/* Responsive Stylesheet */

/* Hide Responsive Elements */
.responsive {
	display: none;
}

@media only screen and (min-width: 1px) and (max-width: 1400px) {

	ul.catalogue li {
		width: 25%;
	}

	ul.news.top li {
		width: 25%;
		padding-bottom: 25%;
		height: 0;
	}

}

@media only screen and (min-width: 1px) and (max-width: 1200px) {

	ul.catalogue li a .desc .inner {
		background: none;
		height: auto;
		float: left;
		width: 90%;
		padding: 0 5%;
		text-align: center;
		margin: 0;
		left: auto;
		top: 70px;
	}

	ul.catalogue li a .desc h4 {
		font-size: 23px;
		line-height: 27px;
	}

	#timeline .box {
		width: 72%;
	}
}

@media only screen and (min-width: 1px) and (max-width: 1190px) {

	.homeBand.white .right {
		padding-top: 5px;
	}

	.homeBand h2 {
		margin-bottom: 19px;
	}

	.homeBand.white .left {
		position: relative;
	}

	.homeBand.white .left img {
		margin-top: 0;
		height: 100%;
		width: auto;
		position: absolute;
	}

	.homeBand.white .left,
	.homeBand.green .right,
	.homeBand.green .left {
		width: 45%;
	}

	.homeBand.white .right {
		width: 46%;
	}

	.homeBand .right img {
		height: 100%;
		width: auto;
	}
}

@media only screen and (min-width: 1px) and (max-width: 1170px) {

	footer h3 {
		font-size: 15px;
	}

	footer .col2 input[type=text] {
		width: 200px;
	}

	footer .col1 ul li a {
		font-size: 11px;
	}
}

@media only screen and (min-width: 1px) and (max-width: 1090px) {

	footer .col3 {
		display: none;
	}

	footer .col1 {
		width: 56%;
		border: none;
	}

	footer .col2 {
		display: block;
		width: 33%;
		margin-right: 0;
		border: none;
		float: right;
		width: auto;
	}

	#timeline .box {
		width: 69%;
	}
}

@media only screen and (min-width: 1px) and (max-width: 1070px) {

	#blogInfo {
		display: none;
	}

	ul.testimonials li img {
		height: 80px;
	}
}

@media only screen and (min-width: 1px) and (max-width: 1040px) {

	header .wrapper {
		width: 90%;
	}

	header .menu-main-left-container ul li a {
		margin-right: 10px;
	}

	header .menu-main-right-container ul li a {
		margin-left: 4px;
	}
}

@media only screen and (min-width: 1px) and (max-width: 980px) {

	header img {
		width: 200px;
		margin-left: -100px;
	}

	header ul li a {
		font-size: 14px;
	}

	header .menu-main-left-container ul li a {
		margin-right: 6px;
	}

	header .menu-main-right-container ul li a {
		margin-left: 2px;
	}

	h1 {
		font-size: 26px;
		line-height: 31px;
	}

	h2 {
		font-size: 25px;
		line-height: 32px;
	}

	h4 {
		font-size: 18px;
		line-height: 22px;
	}

	p {
		font-size: 14px;
	}

	ul.catalogue li,
	ul.news.top li {
		width: 33.3%;
		padding-bottom: 33.3%;
	}

	ul.catalogue li:nth-child(3n),
	ul.news.top li:nth-child(3n) {
		width: 33.4%;
	}
}

@media only screen and (min-width: 1px) and (max-width: 960px) {

	#timeline .box {
		width: 63%;
	}

	.sidebar {
		width: 27%;
	}
}

@media only screen and (min-width: 1px) and (max-width: 900px) {

	header img {
		width: 180px;
		margin-left: -90px;
		margin-top: 31px;
	}

	header ul li a {
		font-size: 13px;
	}

	header .menu-main-left-container ul li a {
		margin-right: 0;
	}

	header .menu-main-right-container ul li a {
		margin-left: 0;
	}

	.pebbles .pebble {
		padding-top: 178px;
	}

	.pebbles .pebble h3 {
		margin-top: 0;
		font-size: 20px;
		line-height: 23px;
	}

	.pebbles .pebble1 img.big {
		margin-left: -90px;
		width: 180px;
	}

	.pebbles .pebble2 img.big {
		margin-left: -85px;
		top: 22px;
		width: 170px;
	}

	.pebbles .pebble3 img.big {
		margin-left: -93px;
		width: 186px;
	}

	.homeBand.white .left img {
		left: -25%;
	}

	.sidebar {
		width: 100%;
	}

	.sidebar .box {
		width: 23%;
		clear: none;
		padding: 20px 5%;
		margin: 0;
	}

	.sidebar .box1,
	.sidebar .searchBox {
		display: none;
	}

	.sidebar .box.responsive {
		display: inline;
	}

	.sidebar .box h3 {
		font-size: 14px;
		line-height: 16px;
	}

	.blogFeed .main {
		width: 100%;
	}
}

@media only screen and (min-width: 1px) and (max-width: 830px) {

	header ul li a {
		padding: 7px 8px;
	}

	header {
		height: 100px;
	}

	header img {
		width: 150px;
		margin-left: -75px;
		margin-top: 29px;
	}

	header ul {
		margin-top: 37px;
	}

	footer .col1 {
		margin-right: 0;
	}

	.homeBand h2 {
		font-size: 23px;
		line-height: 30px;
	}

	a.ltGrey,
	a.dkGrey,
	a.green,
	input[type=submit] {
		font-size: 13px;
		line-height: 17px;
		padding: 15px 24px;
	}

	.sidebar .box h3 {
		font-size: 13px;
	}
}

@media only screen and (min-width: 1px) and (max-width: 790px) {

	#timeline .box {
		padding: 20px 7%;
		width: 53%;
	}

	ul.testimonials li img {
		height: 60px;
	}
}

@media only screen and (min-width: 1px) and (max-width: 750px) {

	header ul {
		display: none;
	}

	.greyHeader {
		display: block;
	}

	.pebbles .pebble {
		width: 100%;
		padding: 0;
		margin: 30px 0 0;
	}

	.pebbles .pebble img.big {
		position: relative;
		left: auto;
		margin: 0 0 15px;
		top: auto;
	}

	.pebbles .pebble p {
		width: 70%;
	}

	.homeBand.white .left {
		width: 40%;
	}

	.homeBand.white .right {
		width: 50%;
	}

	.homeBand.white .left img {
		left: -50%;
	}

	footer .col1 {
		width: 70%;
	}

	footer .col2 {
		display: none;
	}

	.pebbleVideo {
		height: 300px;
	}

	.pebbleVideo .inner {
		top: 65px;
	}

	#timeline {
		padding: 20px 0 0;
	}

	#timeline .timeline_bg {
		background: none;
	}

	#timeline .box_wrap {
		width: 100%;
		margin: 0 0 20px !important;
		padding: 0;
	}

	#timeline .box_wrap .hand_icon,
	#timeline .box_wrap .circle {
		display: none;
	}

	#timeline .box {
		padding: 20px 5%;
		width: 90%;
	}

	#timeline .box_wrap.even.boxid_2,
	#timeline .box_wrap.even {
		padding: 0;
	}

	.sidebar .searchBox.responsive {
		display: none;
	}

	.sidebar .box {
		width: 40%;
	}

	.bottomBar .wft {
		display: none;
	}

	.bottomBar p.copyright {
		width: auto;
		margin: 0;
	}
}

@media only screen and (min-width: 1px) and (max-width: 700px) {

	.homeBand.green .right .inner h4,
	.homeBand.green .right .inner p,
	.video-wrap .inner h4,
	.video-wrap .inner p {
		display: none;
	}

	.homeBand.green .right .inner,
	.video-wrap .inner {
		top: 120px;
	}
}

@media only screen and (min-width: 1px) and (max-width: 680px) {

	ul.catalogue li,
	ul.news.top li {
		width: 50%;
		padding-bottom: 50%;
	}

	ul.catalogue li:nth-child(3n),
	ul.news.top li:nth-child(3n) {
		width: 50%;
	}

	form#contact .left,
	form#contact .right {
		width: 100%;
	}
}

@media only screen and (min-width: 1px) and (max-width: 650px) {

	ul.testimonials li:nth-child(3n) {
		display: none;
	}

	ul.testimonials li {
		width: 50%;
	}
}

@media only screen and (min-width: 1px) and (max-width: 600px) {

	ul.contact {
		margin: 0;
	}

	ul.contact li {
		width: 100%;
		margin-top: 27px !important;
	}
}

@media only screen and (min-width: 1px) and (max-width: 580px) {

	.bottomBar p span {
		display: none;
	}

	#retailersList {
		padding: 50px 5%;
	}

	#retailersList h2 {
		font-size: 25px;
		line-height: 28px;
	}

	footer .col1 {
		width: 100%;
	}
}

@media only screen and (min-width: 1px) and (max-width: 550px) {

	h2 {
		font-size: 22px;
		line-height: 29px;
	}

	h4 {
		font-size: 16px;
		line-height: 19px;
	}

	.intro {
		padding: 35px 0 25px;
	}

	.homeBand {
		padding: 0;
	}

	.homeBand.white .left,
	.homeBand.green .right {
		width: 100%;
		height: 220px;
	}

	.homeBand.white .left img,
	.homeBand.green .right img {
		left: 0;
		width: 125%;
		height: auto;
	}

	.homeBand.green .left {
		display: none;
	}

	.homeBand.white .right,
	.homeBand.green .left.responsive {
		display: block;
		width: 90%;
		padding: 25px 5% 30px;
	}

	.homeBand.green .right .inner,
	.video-wrap .inner {
		top: 58px;
	}

	.productFull > img {
		width: 100%;
		height: auto;
	}

	.productFull .main {
		padding: 30px 5%;
		width: 90%;
	}

	.productFull .main h1 {
		font-size: 23px;
		line-height: 27px;
	}
}

@media only screen and (min-width: 1px) and (max-width: 480px) {

	ul.catalogue li a h3 {
		font-size: 16px;
		font-weight: 600;
		background: rgba(88, 89, 91, 0.8)
	}

	.pebbles .pebble p {
		width: 80%;
	}

	.pebbleVideo img {
		height: 130%;
		width: auto;
	}

	.sidebar .box {
		width: 90%;
	}
}

@media only screen and (min-width: 1px) and (max-width: 400px) {

	ul.catalogue li,
	ul.news.top li {
		width: 100%;
		padding-bottom: 60%;
	}

	ul.catalogue li:nth-child(3n),
	ul.news.top li:nth-child(3n) {
		width: 100%;
	}

	ul.catalogue li a img,
	ul.news.top li a img {
		margin-top: -15%;
	}

	#quotes {
		display: none;
	}

	.bottomBar {
		background: #F1F4F5;
	}

	.homeBand h2 {
		font-size: 20px;
		line-height: 27px;
	}
}