@charset "utf-8";
/*/id%6D61726D616E6179
  --------------------------
  RESPONSIVE CSS for
  OnlinePipe.com.au
  
  MEDIA QUERIES 
  --------------------------  
*/


/* Content Changes */
#Logo {min-height: 110px;}
#Logo a {width: 290px;}

#Logo.hunterLogo {
	margin: -56px 0 0 35px;
}


#res_menu {}
#res_select, .navigate, .mob-only {display:none;}

#target, #hash {display:none;}

div#nav {width: auto; padding: 0 26px;}
div#nav ul.mainav {margin: 0;}
#SlideTop {display: none;}

.right-content {float: right !important;}
div#sidenav ul.mainav li {margin: 0; padding: 0 10px;}

.recaptcha_only_if_privacy {margin-top:-3px !important;line-height: 1;}



@media only screen and (max-width: 1099px) {}


/* Tablet Portrait (fixed width) */
@media only screen and (min-width: 768px) and (max-width: 1000px) {
	
	img, .img-res {max-width:100%; height:auto;}
	table .img-res {width:100%;}
	
	#PageWrapper {width:760px;}
	#Header, .pageMain, #Footer {width: auto;}
	.pageTop {background-size: 100% 10px;}
	#Header, .pageMain {background-size: 100% 5px;}

	div#nav {padding: 0 20px;}
	div#nav ul.mainav li a {padding: 5px 15px 0;}

	.contentMax, .contentArea, #Showcase, #Slides {width:auto; margin: 0 20px;}

	#Slides {margin-top: -309px;}
	#SlideRepeat {background-size: 100% 1px;}
	#SlideBottom {background-size: 100% 55px;}
	a.slidePrev, a.slideNext {margin: 0 6px;}

	.slide {width: 100% !important;}
	.slidebg {width: auto;}
	.slidebg img {margin: 40px 0 0 20px;}
	.content {width: 370px; padding: 20px;}
	#slidePager {top: -285px;}

	.one-third {margin: 0 7px;  width: 225px;}

	.left-nav {margin: 0;}
	.right-content {margin: 0 !important; width: 500px !important;}
	.services-full {width: 92%;}

	.ribbon {margin-left: -20px !important; width: 526px;}
	.ribbon .tab {width: 450px; background-size: 100% 52px;}

	.services-right {float: none; overflow: hidden; padding: 10px; width: auto; text-align: center;}
	.services-right .zoom.img {width: 28%; display: inline-block; float: none;}
	.services-links, .services-form {float: none !important; width: auto !important;}

	.bannerArea {margin: 0 20px;}

	#FooterTop {background-size: 100% 2px;}
  	#FooterContent {float: none; background-size: 100% 10px;}
  	#FooterBottom {width: auto; background-size: 100% 33px;}
}



/* All Mobile Sizes and Small Tablet (devices and browser) */
@media only screen and (max-width: 767px) {
	
	img, .img-res {max-width:100%; height:auto;}
	img.left, img.right {float:none; margin:0 0 15px !important;}
	
	#PageWrapper {width:auto; margin: 0 10px;}
	#Header, .pageMain, #Footer {width: auto;}
	.pageTop {background-size: 100% 10px;}
	#Header, .pageMain {background-size: 100% 5px;}
	
	#Header {position: relative; padding: 105px 0 0;}
	#Logo {position: absolute; top: 10px; left: 0; right:0; margin: 0;}
	#Logo a {margin: 0 auto; width: 260px; height: 85px; background-size: 102% auto;}
	#Logo.hunterLogo {margin: 0;}
	.top-menu {float: none; width: auto; text-align: center; font-size: 12px; margin: 0 10px 15px; height: auto;}

	#MenuWrapper {background-position: center top; height: 45px; padding: 0; margin: 0 12px 5px 8px; background-size: 280px auto; left: auto; right: auto;} 
	#MenuWrapper.hunter-calluson {left: auto !important; height: 70px !important;}
	div#nav {background: #408AB7; position: relative; height: 40px; margin: 0 2.6%; padding: 0;	border: 1px solid #34668b;
			-webkit-border-radius: 4px 4px 0 0;	-moz-border-radius: 4px 4px 0 0;border-radius: 4px 4px 0 0;	}
	#nav, #nav ul {width: auto;}
	#nav ul {display:none;}
	#res_menu {background:url(../images/bg-navigate.png) no-repeat right center; height:40px; position:relative; padding:0; text-align:left;}
	#res_menu .navigate {display:block; position:absolute;color:#fff; font:bold 14px Arial, Helvetica, sans-serif; text-transform:uppercase; line-height:40px; left:10px;}
	#res_select {display:block; opacity:0; width:100%; height:100%}

	.contentMax, .contentArea, #Showcase, #Slides {width:auto; margin: 0 20px;}

	#Slides {margin: -309px 2.6% 0;}
	#SlideRepeat {background-size: 100% 1px;}
	#SlideBottom {background-size: 100% 55px;}
	a.slidePrev, a.slideNext {margin: 0 -2px;}

	.slide {width: 100% !important;}
	.slidebg {width: auto; text-align: center;}
	.slidebg img {margin: 40px 0 0;}
	.content {display: none;}
	#slidePager {display: none;}

	.left-nav, .right-content {width: auto !important; float: none !important; margin:0 0 30px !important;}

	.ribbon {margin-left: -10px; width: auto; position: relative; padding: 0 0 0 52px;}
	.ribbon .wrapAround {position: absolute; left: 0;}
	.ribbon .tab {width: 100%; background-size: 100% 52px; overflow: visible !important;}
	.ribbon span {margin-left: -20px;}

	.services-full {width: auto; padding: 10px;}
	.checklist ul li {margin: 0;}

	div#sidenav {width: auto !important; margin-bottom: 15px;}
	div#sidenav ul.mainav:before {width: 100%}
	div#sidenav ~ br, #sidenav ~ .hr {display: none;}
	.quovolver, .audioplay {width: 195px; float: left;}

	#Showcase .one-third {float: none; width: auto; padding: 5px; margin: 0; overflow: hidden;}
	#Showcase .one-third img {margin: 0 10px 15px 0 !important}

	.services-right {float: none; overflow: hidden; padding: 10px; width: auto; text-align: center;}
	.services-right .zoom.img {width: 28%; display: inline-block; float: none;}
	.services-content {float: none; width: auto; margin-left: 0;}

	.bannerArea {margin: 0 2.6%; height: 110px;}
	.bannerArea big {font-size: 30px; line-height: 34px;}

	.services-links, .services-form {float: none !important; width: auto !important;}
	.services-form .ribbon {width: 248px; margin-left: -26px;}
	.services-form .ribbon .tab {width: 250px;}

	/*.left-nav {padding: 0 0 25px; border-bottom: 1px solid #999;}*/
	.left-nav:before, .left-nav:after {content: ""; line-height: 1; display: table;}
	.left-nav:after {clear: both;}

	#FooterTop {background-size: 100% 2px;}
	#FooterContent {background-size: 100% 10px; float: none;}
  	#FooterBottom {width: auto; background-size: 100% auto; padding: 0 0 4%; height: auto;}

  	#Footer .one-third {background: none; margin-bottom: 25px;}
  
  	#target, #hash {display:block; height:1px;}

  	
}


/* Mobile Portrait Size  */
@media only screen and (max-width: 639px) {
	.right-content img[style*="float: left"], .right-content img[style*="float: right"] {float: none !important; display: block; margin: 0 auto 5px;}
	.services-right .zoom.img {width: auto;}
	input.cat_textbox, textarea.cat_listbox, select.cat_dropdown, select.cat_listbox {width: 95%;}

	.bannerArea big {font-size: 25px; line-height: 30px;}

	#recaptcha_widget_div {height: 140px;}
}
@media only screen and (max-width: 485px) {
    .clearVideo {clear: both; padding: 5px 0;}   
}
@media only screen and (max-width: 380px) {
	#recaptcha_widget_div {margin: 0 -17px;  overflow: hidden;   position: relative;}
	#recaptcha_area { left: 50%;  margin: 0 0 0 -159px;  position: absolute;  width: 318px !important;}
}