/* Getting the new tags to behave */
* { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
article, aside, audio, canvas, command, datalist, details, embed, figcaption, figure, footer, header, hgroup, keygen, meter, nav, output, progress, section, source, video {display:block;}
mark, rp, rt, ruby, summary, time {display:inline;}
img {border:0}

/*//// Layout ////*/
	body {margin:0; padding:0; font-size:0.9em; min-width:1024px; background:url(/images/bkg-body.gif) #f1f1f1; border-top:8px solid #d3d0ac; font-family:Arial, Helvetica, sans-serif; color:#525252}
	.wrapper {margin:auto; width:1024px}
	#header {padding:20px 0}
		#header .calltoday {font-family:'garogierregular'; color:#2f712f; font-size:1.65em; margin:40px 0 0 0 }
		#header a.roofingtoday {font-family:'garogierregular'; color:#2f712f; font-size:1.65em; margin-top:10px !important; width:87%; float:right; background:#d9d7bf; padding:8px; text-align:center; text-decoration:none}
		#header a.roofingtoday:hover {background:#236123; color:#fff; text-decoration:none}
		.readmore {font-family:'garogierregular'; color:#236123; font-size:1.7em; padding:11px 15px 11px 25px; display:inline; text-decoration:none; background:url(/images/btn-readmore.png) no-repeat left;}
		.readmore:hover {background:url(/images/btn-readmore.png) no-repeat left #f9f9f9;animation: fadein 10s, bp 0.5s;
   -moz-animation: fadein .2s, bp .2s; /* Firefox */
   -webkit-animation: fadein .2s, bp .2s; /* Safari and Chrome */
   -o-animation: fadein .2s, bp .2s; }
   @-webkit-keyframes fadein { /* Safari and Chrome */
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }}
	ol li {padding-bottom:8px}
	.box-white {background:#fff; padding:20px}
	.gray-box {background:#e5e5e5; padding:20px}
	.submit {color:#fff; padding:11px 15px 11px 15px; display:inline; text-decoration:none; background:#236123; border:none}
	.submit:hover {background:#585858; border:none}
		.documentlogin {letter-spacing:.15em; font-size:.75em; -webkit-text-size-adjust: none !important; text-transform:uppercase; color:#7b7b7a; padding:14px 15px 11px 35px; display:inline; text-decoration:none; background:url(/images/icon-document.png) no-repeat left;}
		.documentlogin:hover {background:url(/images/icon-document.png) no-repeat left #f9f9f9;animation: fadein 10s, bp 0.5s;
   -moz-animation: fadein .2s, bp .2s; /* Firefox */
   -webkit-animation: fadein .2s, bp .2s; /* Safari and Chrome */
   -o-animation: fadein .2s, bp .2s; }
   @-webkit-keyframes fadein { /* Safari and Chrome */
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }}
	#sidebar {float:right; width:25%}
	.sidebar-ribbon {background:#fff;}
	#content-sidebar a {text-decoration:none; display:block; padding:9px 0px 12px 12px; color:#007b17 !important; letter-spacing:.15em; font-size:.75em;-webkit-text-size-adjust: none !important; text-transform:uppercase; font-weight:normal}
	#content-sidebar ul.awards li {text-decoration:none; display:block; padding:9px 0px 12px 12px; color:#007b17 !important; letter-spacing:.15em; font-size:.75em;-webkit-text-size-adjust: none !important; text-transform:uppercase; font-weight:normal}
	#content-sidebar ul {margin:0 !important; padding:0 !important; }
	#content-sidebar ul ul {margin:0 !important; padding:0 !important; }
	#content-sidebar ul li {list-style-image:none; list-style-type:none; padding:0; font-weight:bold; }
	#content-sidebar ul ul li {list-style-image:none; list-style-type:none; padding:0 0 0 30px; font-weight:normal}
	#content-sidebar ul a:hover {background:#aacfb1; color:#000}
	#banner{}
	#banner-sub{z-index:1; width:100%; height:314px; padding:80px 0 0 0}
		.banner-outer{background:#dcdac3; padding:23px 0px 18px 11px; opacity:0.9; display:inline; float:right}
		.banner-inner{background:#fcfcf6; display:inline; padding:11px 22px 7px 22px; font-family: 'alluraregular'; font-size:2.75em}
	#content {padding:0 0 20px 0}
		#content-left {padding:0 0 20px 0; float:left; width:70%}
		#content p, #content-left p {line-height:1.6em}
		.shadow {font-family: 'alluraregular'; font-size:2.1em; margin:auto; text-align:center; padding:14px 0}
		.shadow-up {height:14px; background:url(/images/bkg-shadow-up.png) center no-repeat; margin:auto}
		.shadow-down {height:14px; background:url(/images/bkg-shadow-down.png) center no-repeat; margin:auto}
		.goinggreen {background:url(/images/going-green.png) 96% 3% no-repeat #e5e5e5; padding:20px}
	#footer {background:#d9d7bf; font-size:11px; color:#848372; padding:25px 0; margin:auto}

/*//// Menu ////*/
	#nav {clear:both; background:#2f712f; margin-top:-20px}
	ul.megamenu {margin: 0; color:#393a3b; padding: 0; list-style: none; display: none; z-index:500;}
	ul.megamenu li.mm-item {margin: 0px; padding: 0px;}
	ul.megamenu li {margin: 0px; padding: 0px;}
	ul.megamenu li.clear-fix {float: none; clear: both; margin: 0px; padding: 0px; height: 0px; line-height: 0px;}
	ul.megamenu a.mm-item-link:link, ul.megamenu a.mm-item-link:visited {position: relative; display: inline-block; color: #fff; text-decoration: none; z-index: 10; padding:19px 31px 18px 31px; letter-spacing:.15em; font-size:.75em;-webkit-text-size-adjust: none !important; text-transform:uppercase; border-right:1px solid #266526}
	*html ul.megamenu a.mm-item-link:link, *html ul.megamenu a.mm-item-link:visited {color:#fff;}
	ul.megamenu a.mm-item-link-hover:link, ul.megamenu a.mm-item-link-hover:visited {background:#266526;}
	ul.megamenu div.mm-item-content {background:#266526; position:absolute; z-index:800; margin:0 0 0 5px}
	ul.megamenu div.mm-item-content a {display:block; padding:12px 12px 12px 28px; text-decoration:none; font-size:.95em; color: #fff;}
	ul.megamenu div.mm-item-content a:hover {color:#000; display:block; background:#d0c980;}
	.mm-content-base {position: relative; z-index: 11;}
	.mm-js-shadow {background: #555; position: absolute; display:none; z-index: 10;}
	
	.antispam { display:none;}
	
/*//// Text ////*/
	h1 {color:#236123; font-size:2.1em; font-weight:normal; margin:0 !important; padding:0; font-family: 'garogierregular';}
	h2 {color:#ada666; font-size:1.9em; font-weight:normal; margin:0; padding:0; font-family: 'alluraregular';}
	.txt-red {color:#ff0000}
	.txt-green {color:#236123}
	.txt-c {text-align:center !important}
	.txt-caps {text-transform:uppercase}
	.txt-r {text-align:right}
	.txt-c {text-align:center}
	
/*//// Links ////*/
	a, a:visited, a:active {color:#236123; cursor:pointer; text-decoration:underline;}
	a:hover {text-decoration:none; color:#000}

/*//// Misc ////*/
	
/*//// Dividers ////*/
	.divider {clear:both; margin:4px 0 1px 0; border-top:dotted 1px #1b531b}

/*//// Buttons ////*/

/*//// Structural Alignment ////*/
	.clear {clear:both}
	.l {float:left}
	.r {float:right}
	.auto {margin:auto !important}
	
	
	
	
	
	
	
.item {
  width: 256px;
  height: 199px;
  background: #EBEBEB;
  transition: all 1s ease;
  float:left;
  margin-bottom:25px
}
.item img {
  width: 256px;
  height: 199px;
}
.item:hover .overlay {
  background: #e0e5c3;
  opacity:0.15;
}
.item:hover .button {
  width: 70px;
  height: 70px;
  margin: -139px auto 0 auto;
  background: url(http://immedesign.nl/cssdeck/next.png) center center no-repeat #dbdec9;
  opacity: 1;
  transform:scale(1);
  animation-delay: inherit;
  animation:scale .5s infinite;   
  cursor: pointer;
}
.overlay {
  width: 100%;
  height: 100%; 
  margin: -198px 0 0 0;
  background: #000; 
  opacity:0;
  transition: all .5s ease;
}
.button {
  width: 123px;
  height: 123px;
  margin: -123px auto 0 auto;
  background: url(http://immedesign.nl/cssdeck/next.png) center center no-repeat;
  opacity: 0;
  border-radius: 50%;
  transition: all .2s ease;
}

	
	
	
	
	
	
	
	
	

/*//// Columns ////*/
	.col5 {width:5%}
	.col10 {width:10%}
	.col15 {width:15%}
	.col20 {width:20%}
	.col23 {width:23%}
	.col25 {width:25%}
	.col27 {width:27%}
	.col30 {width:30%}
	.col33 {width:33.33%}
	.col35 {width:35%}
	.col40 {width:40%}
	.col45 {width:45%}
	.col50 {width:50%}
	.col55 {width:55%}
	.col60 {width:60%}
	.col65 {width:65%}
	.col70 {width:70%}
	.col75 {width:75%}
	.col80 {width:80%}
	.col85 {width:85%}
	.col90 {width:90%}
	.col95 {width:95%}

/*//// Margins ////*/
	.m5 {margin:5px}
	.m10 {margin:10px}
	.m15 {margin:15px}
	.m20 {margin:20px}
	.m25 {margin:25px}
	.m30 {margin:30px}
	.m35 {margin:35px}
	.m40 {margin:40px}
	.m45 {margin:45px}
	.m50 {margin:50px}
	
	.mt5 {margin-top:5px}
	.mt10 {margin-top:10px}
	.mt15 {margin-top:15px}
	.mt20 {margin-top:20px}
	.mt25 {margin-top:25px}
	.mt30 {margin-top:30px}
	.mt35 {margin-top:35px}
	.mt40 {margin-top:40px}
	.mt45 {margin-top:45px}
	.mt50 {margin-top:50px}
	
	.mr5 {margin-right:5px}
	.mr10 {margin-right:10px}
	.mr15 {margin-right:15px}
	.mr20 {margin-right:20px}
	.mr25 {margin-right:25px}
	.mr30 {margin-right:30px}
	.mr35 {margin-right:35px}
	.mr40 {margin-right:40px}
	.mr45 {margin-right:45px}
	.mr50 {margin-right:50px}
	
	.mb5 {margin-bottom:5px}
	.mb10 {margin-bottom:10px}
	.mb15 {margin-bottom:15px}
	.mb20 {margin-bottom:20px}
	.mb25 {margin-bottom:25px}
	.mb30 {margin-bottom:30px}
	.mb35 {margin-bottom:35px}
	.mb40 {margin-bottom:40px}
	.mb45 {margin-bottom:45px}
	.mb50 {margin-bottom:50px}
	
	.ml5 {margin-left:5px}
	.ml10 {margin-left:10px}
	.ml15 {margin-left:15px}
	.ml20 {margin-left:20px}
	.ml25 {margin-left:25px}
	.ml30 {margin-left:30px}
	.ml35 {margin-left:35px}
	.ml40 {margin-left:40px}
	.ml45 {margin-left:45px}
	.ml50 {margin-left:50px}

/*//// Padding ////*/
	.p5 {padding:5px}
	.p10 {padding:10px}
	.p15 {padding:15px}
	.p20 {padding:20px}
	.p25 {padding:25px}
	.p30 {padding:30px}
	.p35 {padding:35px}
	.p40 {padding:40px}
	.p45 {padding:45px}
	.p50 {padding:50px}
	
	.pt5 {padding-top:5px}
	.pt10 {padding-top:10px}
	.pt15 {padding-top:15px}
	.pt20 {padding-top:20px}
	.pt25 {padding-top:25px}
	.pt30 {padding-top:30px}
	.pt35 {padding-top:35px}
	.pt40 {padding-top:40px}
	.pt45 {padding-top:45px}
	.pt50 {padding-top:50px}
	
	.pr5 {padding-right:5px}
	.pr10 {padding-right:10px}
	.pr15 {padding-right:15px}
	.pr20 {padding-right:20px}
	.pr25 {padding-right:25px}
	.pr30 {padding-right:30px}
	.pr35 {padding-right:35px}
	.pr40 {padding-right:40px}
	.pr45 {padding-right:45px}
	.pr50 {padding-right:50px}
	
	.pb5 {padding-bottop:5px}
	.pb10 {padding-bottop:10px}
	.pb15 {padding-bottop:15px}
	.pb20 {padding-bottop:20px}
	.pb25 {padding-bottop:25px}
	.pb30 {padding-bottop:30px}
	.pb35 {padding-bottop:35px}
	.pb40 {padding-bottop:40px}
	.pb45 {padding-bottop:45px}
	.pb50 {padding-bottop:50px}
	
	.pl5 {padding-left:5px}
	.pl10 {padding-left:10px}
	.pl15 {padding-left:15px}
	.pl20 {padding-left:20px}
	.pl25 {padding-left:25px}
	.pl30 {padding-left:30px}
	.pl35 {padding-left:35px}
	.pl40 {padding-left:40px}
	.pl45 {padding-left:45px}
	.pl50 {padding-left:50px}

/*//// Fonts ////*/
@font-face {
    font-family: 'garogierregular';
    src: url('/fonts/Garogier_unhinted-webfont.eot');
    src: url('/fonts/Garogier_unhinted-webfont.eot?#iefix') format('embedded-opentype'),
         url('/fonts/Garogier_unhinted-webfont.woff') format('woff'),
         url('/fonts/Garogier_unhinted-webfont.ttf') format('truetype'),
         url('/fonts/Garogier_unhinted-webfont.svg#garogierregular') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'alluraregular';
    src: url('/fonts/allura-regular-webfont.eot');
    src: url('/fonts/allura-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('/fonts/allura-regular-webfont.woff') format('woff'),
         url('/fonts/allura-regular-webfont.ttf') format('truetype'),
         url('/fonts/allura-regular-webfont.svg#alluraregular') format('svg');
    font-weight: normal;
    font-style: normal;
}