/* - - - - - - - - - - - - - - - - - - - - -

Title : Ace Gutters
URL : http://www.acegutters.com.au/

Author : SiteSuite Australasia
Author URL : http://www.sitesuite.com.au

- - - - - - - - - - - - - - - - - - - - - */


/*----------------------------------------------------------------------------- 
	Global Styles
-----------------------------------------------------------------------------*/
html, body, h1, h2, h3, p, img { margin: 0; padding: 0; }

body {
	background: url(../templateimages/bg.jpg) #cecac3;
	color: #333333;
	font: normal 11px/18px Verdana, Arial, Helvetica, sans-serif;
}

.clear { clear: both; padding: 0; margin:0; line-height: 0; height:0; }
.clearfix { clear: both; padding: 0; margin:0; }
.clearfix:before, .clearfix:after { content: " "; display: table; }
.clearfix:after { clear: both; }

/*----------------------------------------------------------------------------- 
	Template Styles
-----------------------------------------------------------------------------*/

h1 {
	color: #002596;
	font: normal 18px Verdana, Arial, Helvetica, sans-serif;
	padding-bottom: 10px;
}

h2 {
	color: #333333;
	font: normal 18px Verdana, Arial, Helvetica, sans-serif;
	padding: 20px 0 10px 0;
}

h3 {}

p, td { color: #333333; font: normal 11px/18px Verdana, Arial, Helvetica, sans-serif; }

p { margin-bottom: 15px; }

hr { height: 1px; color: #035bac }

a { color: #fb5219; }



/*----------------------------------------------------------------------------- 
	Layout Styles
-----------------------------------------------------------------------------*/

#wrapper {
	max-width: 760px;
	margin: 20px auto;
	border: 1px solid #4e4e4e;
	background: #ffffff;
}

#logo {
	background:url(../templateimages/head_bg.jpg) top repeat-x;
	padding-top: 9px;
}

#navWrap {
	height: 36px;
	background: url(../templateimages/nav_bg.jpg) repeat-x;
}

#contentWrap {
	padding: 20px 0 20px 0;
}

#contentLeft { /* Our Products Section */
	float: left; 
	width: 185px;
	height: 247px;
	margin-left: 13px;
	background: url(../templateimages/our_products_bg.jpg) repeat;
}

#contentRight { /* Main content body */
	float: right;
	width: 506px;
	padding-right: 25px;
}

#footerWrap {
	background: url(../templateimages/footer.jpg) bottom no-repeat;
	margin-top: 20px;
	max-width: 760px;
	height: 107px;
	color: #FFFFFF;
}

#footerWrap p { color: #ffffff; }

#footerWrap a, #footerWrap a:visited { color: #FFFFFF; text-decoration:none; }
#footerWrap a:hover { text-decoration: underline; }

#footerLeft { 
	float: left; 
	width: 590px;
	padding: 8px 0 0 8px;
}

#footerRight {
	float: right;
	width: 130px;
	padding: 8px 8px 0 0px;
}

#stats {
	display: none;
}

/*----------------------------------------------------------------------------- 
	Our Products Menu
-----------------------------------------------------------------------------*/

#products {
	margin: 0 0 0px 10px;
	padding: 0 0 0px 0;
	list-style: none;
}

#products li { margin:0; padding:0; float: left;}

#products a {
	font-weight: bold;
	color: #ffffff;
	text-decoration: none;
	display: block;
	margin-bottom: 15px;
	
}

#products a:hover { color: #000000; }

/*----------------------------------------------------------------------------- 
	Navigation 
-----------------------------------------------------------------------------*/

#nav {
	margin: 0;
	padding:0;
	list-style: none;
}

	#nav li {
		display: inline;
		float: left;
	}

	#nav li a.mainNav {
		display: block;
		padding: 10px 12px;
		font: bold 12px Verdana, Arial, Helvetica, sans-serif;
		text-decoration: none;
		color: #FFFFFF;
	}
	
	#nav li a:hover { color: #000000; } /* top level hover */ 

#nav li ul { /* second-level lists  */
	position : absolute;
	left: -999em;
	margin : 0px;
	width: 200px;
	list-style: none;
	padding: 0;
	padding-top: 0px;
	line-height:0; 
	z-index: 99;
	}

#nav li ul li {
	width: 205px; margin:0; padding:0; line-height: 1em;
}

#nav li ul li a {
	display : block;
	padding: 11px 12px 10px 12px;
	border-bottom: 1px solid #cccccc;
	text-decoration: none;
	background: #eeeeee; 
	color: #0f39b7;	
	text-align: left;
	font: bold 12px Verdana, Arial, Helvetica, sans-serif;
	}

#nav li:hover, #nav li.sfhover { position: static; }
	
#nav li ul li a:hover { color: #ffffff; background: #fd6835; border-bottom: 1px solid #fb4f14; 	} /* Second level hover */

#nav li:hover ul ul, #nav li:hover ul ul ul, #nav li.sfhover ul ul, #nav li.sfhover ul ul ul { left: -999em; }
	
#nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul, #nav li li li.sfhover ul { left: auto; }

.responsiveImg,.navbar-toggle { display: none; }
/*
#wrapper > div#flash { width: 100%; height: 180px; }
td { padding: 0 10px; }
*/
/*
#enquiryForm textarea { width: 147px !important; }
#enquiryForm select { width: 154px !important; }
*/
#enquiryForm textarea, #enquiryForm input { width: 36% !important; }
#enquiryForm select { width: 36% !important; }
.banner ul li img { max-width: 100%; }
#owl-demo .item img { display: block; width: 100%; height: auto; }
.con-img img { float: right; }
.banner { padding: 0 5px; }
#logo > a { display: block; }
/*nav:not(.mm-menu) { display: none; }*/
nav#menu-left { background: url("../templateimages/nav_bg.jpg") repeat-x 0 0; height: 36px; }
nav#menu-left > ul { list-style: none; margin: 0; padding: 0; }
nav#menu-left li { display: inline; float: left; }
nav#menu-left li a.mainNav { color: #ffffff; display: block; font: bold 12px  Verdana,Arial,Helvetica,sans-serif; padding: 10px 12px; text-decoration: none; }
nav#menu-left li ul { left: -999em; line-height: 0; list-style: outside none none; margin: 0; padding: 0; position: absolute; width: 200px; z-index: 99; }
nav#menu-left li ul li { line-height: 1em; margin: 0; padding: 0; width: 200px; }
nav#menu-left li ul li a { background: #eeeeee; border-bottom: 1px solid #cccccc; color: #0f39b7; display: block; font: bold 12px Verdana,Arial,Helvetica,sans-serif; padding: 11px 12px 10px; text-align: left; text-decoration: none; }
nav#menu-left li:hover, nav#menu-left li.sfhover { position: static; }
nav#menu-left li:hover ul, nav#menu-left li li:hover ul, nav#menu-left li li li:hover ul, nav#menu-left li.sfhover ul, nav#menu-left li li.sfhover ul, nav#menu-left li li li.sfhover ul { left: auto; }
nav#menu-left li ul li a:hover { background: #fd6835; border-bottom: 1px solid #fb4f14; color: #ffffff; }

.responsiveBtn{ width: 50px; height: 50px; margin-top: 10px; display: none;}


#hamburger:before, #hamburger:after, #hamburger span {
  transition-delay: 0.5s;
  transition-duration: 0.5s;
  transition-property: transform, top, bottom, left, opacity;
  transition-timing-function: ease;
}
#hamburger:before { top: 10px; }

#hamburger:before, #hamburger:after, #hamburger span {
  background: #FB561C;
  content: "";
  display: block;
  height: 5px;
  left: 20px;
  position: absolute;
  width: 30px;
}
#hamburger:before, #hamburger:after, #hamburger span {
  transition-delay: 0.5s;
  transition-duration: 0.5s;
  transition-property: transform, top, bottom, left, opacity;
  transition-timing-function: ease;
}
#hamburger:after { top: 30px; }

#hamburger:before, #hamburger:after, #hamburger span {
  background: #FB561C;
  content: "";
  display: none;
  height: 5px;
  left: 6px;
  position: absolute;
  width: 30px;
}
#hamburger {
  box-sizing: border-box;
  display: none;
  height: 45px;
  position: relative;
  z-index: 4;
}
.mm-slideout {
  transition: transform 0.4s ease 0s;
  -moz-transition: transform 0.4s ease 0s;
  -webkit-transition: transform 0.4s ease 0s;
  -ms-transition: transform 0.4s ease 0s;
}
#hamburger span { top: 20px; }

html.mm-opening #hamburger:before {
  transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
}
html.mm-opening #hamburger:before, html.mm-opening #hamburger:after { top: 20px; }

html.mm-opening #hamburger:after {
  transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
}
html.mm-opening .mm-slideout {
  transform: translate(440px, 0px);
  -moz-transform: translate(440px, 0px);
  -webkit-transform: translate(440px, 0px);
  -ms-transform: translate(440px, 0px);
}
html.mm-opening .mm-slideout {
  transform: translate(0, 0px);
  -moz-transform: translate(0, 0px);
  -webkit-transform: translate(0, 0px);
  -ms-transform: translate(0, 0px);
}
html.mm-opening #hamburger span { left: -50px; opacity: 0; }
nav ul li.active a, nav ul li a:hover,  nav ul li:hover/*,.mm-listview .mm-next:hover*/ { background: #bc440f; }
nav ul li, nav ul li a { transition: all 0.3s ease 0.1s; }

