/*
NOTES FOR FONT USAGE
body { font-size: 14px; font-size: 1.4rem; } /* =14px 
h1   { font-size: 24px; font-size: 2.4rem; } /* =24px */

body { font-size: 14px; font-size: 1.4rem; background: #F6F6F6 /* url(../../site/img/bg.jpg) repeat-x */; color: #575656} /* =14px */
.lrgutter-quad {padding-left: 4%; padding-right: 4%}
.pad-right-8 {padding-right: 8%}
.content {background:#fff;overflow: hidden}
.content a {color: #cc9900}
#bottom_fade {
	z-index: 99;
	position: fixed;
	width: 100%;
	height: 95px;
	bottom: 0%;
/*	background-image: url("../../site/img/bottom-fade.png");*/
}

.softshadow
{-webkit-box-shadow: 0px 4px 5px 3px rgba(0,0,0,0.19);
-moz-box-shadow: 0px 4px 5px 3px rgba(0,0,0,0.09);
box-shadow: 0px 4px 5px 3px rgba(0,0,0,0.29);
}
.fancyfont {font-family: "myriad-pro-condensed", tahoma;}

.panel .content {width: 100%; max-width: 1403px;}
.pad-bottom-double {padding-bottom: 2%}
.pad-top-double {padding-top: 2%;}
.pad-top-tripple {padding-top: 3%;}
.border-bottom {border-bottom: 2px solid #ccc}

.btn-yellow {display: inline-block; padding: 2%; color: #000; background: #ffd204; text-transform: uppercase; font-size: 2rem; font-weight: bold; padding-left: 4%; padding-right: 4%;font-family: "myriad-pro-condensed", tahoma }
.btn-yellow:before {  background: #a98b03; }

.btn-gray {display: inline-block; padding: 2%; color: #fff; background: #535353; text-transform: uppercase; font-size: 2rem; font-weight: bold; padding-left: 4%; padding-right: 4%; font-family: "myriad-pro-condensed", tahoma; }
.btn-gray:before {  background: #000; }

.btn-white {display: inline-block; padding: 2%; color: #535353; background: #fff; text-transform: uppercase; font-size: 2rem; font-weight: bold; padding-left: 4%; padding-right: 4%; font-family: "myriad-pro-condensed", tahoma; }
.btn-white:before {  background: #aaa; color: #fff }

.btn-lgray {display: inline-block; padding: 2%; color: #535353; background: #ccc; text-transform: uppercase; font-size: 2rem; font-weight: bold; padding-left: 4%; padding-right: 4%; font-family: "myriad-pro-condensed", tahoma; }
.btn-lgray:before {  background: #666; color: #eee }


/* this is for image rollover captions */
.imgcontainer {position: relative; overflow: hidden}
.imgcontainer .imagedesc {height: 100%;  position: absolute; bottom: -100%; padding: 2%; background: #ffd203;  -moz-transition:all .4s;-o-transition:all .4s;-webkit-transition:all .4s}
.imgcontainer img {height: 100%;}
.imgcontainer .imagedesc .details {vertical-align: middle; display: block; height: 100%; padding: 2%}
.imgcontainer .imagedesc h4{ font-size: 2rem; font-weight: normal; text-transform: uppercase; margin: 0px; padding: 0px; margin-top: 10px; margin-bottom: 5px;}
.imgcontainer .imagedesc p{ font-size: 1.3rem; font-weight: normal; margin: 0px; padding: 0px; line-height: 1.5rem; color: #000; margin-bottom: 10px;}
.imgcontainer .imagedesc .btn-white {margin-bottom: 10px;}
.imgcontainer:hover .imagedesc {bottom: 0px;}

.imgcontainer .imagedescshort {height: normal;  position: absolute; bottom: -75px; padding: 1%; background: #ffd203;  -moz-transition:all .4s;-o-transition:all .4s;-webkit-transition:all .4s}
.imgcontainer .imagedescshort .details {vertical-align: middle; display: block; height: 100%; padding: 1%}
.imgcontainer .imagedescshort h4{ font-size: 2rem; font-weight: normal; text-transform: uppercase; margin: 0px; padding: 0px; margin-top: 10px; margin-bottom: 5px;}
.imgcontainer .imagedescshort p{ font-size: 1.3rem; font-weight: normal; margin: 0px; padding: 0px; line-height: 1.5rem; color: #000; margin-bottom: 10px;}
.imgcontainer .imagedescshort .btn-white {margin-bottom: 10px;}
.imgcontainer:hover .imagedescshort {bottom: 0px;}



/* general site styles*/
p {font-family: arial; font-size: 1.6rem; color: #575656; line-height: 2.5rem; margin-top: 0px; padding-top: 0px; padding-bottom: 20px;}
li {font-family: arial; font-size: 1.6rem; color: #575656; line-height: 2.5rem; margin-top: 0px; padding-top: 0px;}


/* logo and nav bar */
#logoandnav{height:auto;min-height:auto;overflow:hidden; position: relative;}
#logoandnav #sitelogo{display:block;height:111px;margin:0;padding:0;width:100%;}
#logoandnav #sitelogo img{max-height:111px;max-width:100%;vertical-align:middle;  -ms-interpolation-mode: bicubic; object-fit: contain;}
#logoandnav #sitelogo,#sitelogo a{display:block;height:111px;width:100%}

#mainnav{min-height:111px;position:relative}
#mainnav #navitems{display:inline-block;margin-top:80px; width: 100%; text-align: right}
#mainnav #navitems a{color:#1e1d12;font-family:myriad-pro, tahoma;font-size:1.6rem;letter-spacing:1px;margin-left:20px;text-transform:uppercase}
#mainnav #navitems a:hover, #mainnav #navitems a.active{color:#201c1d}
#mainnav,#mainnav .align-right{display:block}

.cmn-t-underline{position:relative}
.cmn-t-underline:after{-moz-transition:all .4s;-o-transition:all .4s;-webkit-transition:all .4s;background-color:#fff;bottom:-16px;content:"";display:block;height:3px;left:0;position:absolute;transition:all .4s;width:100%}
.cmn-t-underline:before{-moz-transition:all .4s;-o-transition:all .4s;-webkit-transition:all .4s;background-color:#fff;content:"";display:block;height:3px;left:0;position:absolute;top:-15px;transition:all .4s;width:100%}
.cmn-t-underline:hover:after{background-color:#ffd204;bottom:-5px}
.cmn-t-underline:hover:before{background-color:#ffd204;top:-5px}

#mainnav #navitems a.active:after{background-color:#ffd204;bottom:-5px}
#mainnav #navitems a.active:before{background-color:#ffd204;top:-5px}


#subnav { background: #eee; position: relative; min-height:50px; overflow: hidden}
#subnav #subnavitems {width: 100%; float: none; clear: both; height: auto!important; min-height: auto; text-align: center; padding-right: 25px;}
#subnav  #subnavitems { text-align: right; width: 100%; padding-top: 15px; padding-bottom: 15px;}
#subnav  #subnavitems a {margin-left: 0px; margin-right: 0px; margin: 0px; padding: 0px; font-family: "myriad-pro", tahoma; color: #666;font-size: 1.9rem; padding-left: 15px; padding-right: 15px;}
#subnav  #subnavitems a:first-child {margin-left: 0px}
#subnav  #subnavitems a:last-child {margin-right: 0px; padding-right: 0px;}
#subnav  #subnavitems a.active { color: #cc9900}
#subnav  #subnavitems a:hover { color: #cc9900}


.corpslogan{font-style:italic;position:absolute;right:0;top:13px}
.corpslogan .loginlink a{color: #FFD204; font-weight: bold; text-decoration: none;}
.vhelp{display:inline-block;height:100%;vertical-align:middle}
/* end of logo bar */


/* mast graphic bar */
#mastgraphic{background-image:url(../../site/img/SPERRY_Truck.png);height:692px}
#mastgraphic.school{background-image:url(../../site/img/sperryinaction002.jpg); max-height: 422px}
#mastgraphic.stickslanding{background-image:url(../../site/img/mast-stick.jpg); max-height: 422px; background-position: left}
#mastgraphic.story{background-image:url(../../site/img/storymast.jpg); max-height: 422px; background-position: left}
#mastgraphic.safety{background-image:url(../../site/img/saftey.jpg); max-height: 422px; background-position: left}
#mastgraphic.vision{background-image:url(../../site/img/vision02.jpg); max-height: 422px; background-position: left}
#mastgraphic.joint{background-image:url(../../site/img/jointbar.jpg); max-height: 422px; background-position: left}
#mastgraphic.career{background-image:url(../../site/img/iamsperrywide.jpg); max-height: 522px; background-position: left}
#mastgraphic.induction{background-image:url(../../site/img/Induction.jpg); max-height: 422px; background-position: left}
#mastgraphic.s360{background-image:url(../../site/img/sperry-360.jpg); max-height: 422px; background-position: top center}
#mastgraphic.eddy{background-image:url(../../site/img/newheaders/eddy.jpg); max-height: 422px; background-position: left}
#mastgraphic.ultrasonics{background-image:url(../../site/img/RSU.jpg); max-height: 522px; background-position: left}
#mastgraphic.platform{background-image:url(../../site/img/triple.jpg); max-height: 522px; background-position: left}
#mastgraphic.pedestrian{background-image:url(../../site/img/walkingstickv2.jpg); max-height: 522px; background-position: left}
#mastgraphic.media{background-image:url(../../site/img/media.jpg); max-height: 522px; background-position: left}
#mastgraphic.testimonials{background-image:url(../../site/img/testimonials.jpg); max-height: 522px; background-position: left}
#mastgraphic.events{background-image:url(../../site/img/tradeshow.jpg); max-height: 522px; background-position: left}
#mastgraphic.case{background-image:url(../../site/img/casestudies.jpg); max-height: 522px; background-position: left}
#mastgraphic.webinars{background-image:url(../../site/img/newheaders/webinars.jpg); max-height: 522px; background-position: left}
#mastgraphic.technology{background-image:url(../../site/img/Induction.jpg); max-height: 422px; background-position: left}

#mastgraphic.hirail{background-image:url(../../site/img/sprinterv2.jpg); max-height: 522px; background-position: left}
#mastgraphic.railbound{background-image:url(../../site/img/Hirail.jpg); max-height: 422px; background-position: left}

#mastgraphic.vehtesting{background-image:url(../../site/img/vehtestingbanner.jpg); max-height: 422px; background-position: left}

#mastgraphic.datamanagement{background-image:url(../../site/img/newheaders/dataMGMT01.jpg); max-height: 422px; background-position: left}
#mastgraphic.dataan{background-image:url(../../site/img/newheaders/dataanalysis.jpg); max-height: 422px; background-position: left}
#mastgraphic.dual{background-image:url(../../site/img/newheaders/dual.jpg); max-height: 422px; background-position: left}
#mastgraphic.stop{background-image:url(../../site/img/newheaders/stopandverify.jpg); max-height: 422px; background-position: left}
#mastgraphic.weld{background-image:url(../../site/img/newheaders/weldv2.jpg); max-height: 422px; background-position: left}
#mastgraphic.nonstop{background-image:url(../../site/img/newheaders/nonstop.jpg); max-height: 422px; background-position: left}
#mastgraphic.railhealth{background-image:url(../../site/img/future.jpg); max-height: 422px}

#mastgraphic{background-position:center;background-size:cover;}
/*-moz-box-shadow:inset 0 20px 20px -20px rgba(0,0,0,0.8);-webkit-box-shadow:inset 0 20px 20px -20px rgba(0,0,0,0.8);box-shadow:inset 0 11px 8px -10px rgba(0,0,0,0.8), inset 0 -11px 8px -10px rgba(0,0,0,0.8);*/
#mastgraphic .slogancontainer{display:inline-block;height:100%;overflow:hidden;position:relative;text-align:center;width:100%}
#mastgraphic .slogancontainer .slogan{border-bottom:15px solid #fff;border-top:15px solid #fff;display:inline-block;margin-bottom:40px;padding-bottom:20px;padding-top:20px;position:relative;vertical-align:middle}
#mastgraphic .slogancontainer h1{color:#fff;font-size:6.5rem;text-align:center;text-shadow:2px 2px 2px rgba(0,3,0,.5);text-transform:uppercase}
#mastgraphic .slogancontainer h2{color:#fff;font-size:4rem;font-weight:400;text-align:center;text-shadow:2px 2px 2px rgba(0,3,0,.5);text-transform:uppercase}
#mastgraphic .slogancontainer video{bottom:0;left:0;position:absolute;width:100%}
#mastgraphic img{width:100%}

#mastgraphic #submastslogan{display:inline-block;overflow:hidden;position:relative; vertical-align: middle}
#mastgraphic #submastslogan h1{text-transform: uppercase; font-weight: normal; font-size: 4.7rem; margin: 0px; padding: 0px;}
#mastgraphic #submastslogan h2{text-transform: uppercase; font-weight: bold; font-size: 3.9rem; margin: 0px; padding: 0px; border-bottom: 40px solid #FFD204}

/* end of graphic bar */

#yellowtitle {background: #ffd204}
#yellowtitle h1 {padding: 1% 1% 1% 0%; color: #fff; font-weight: normal; text-transform: uppercase; font-size: 4rem}


#whitecontent h2, #whitecontent h3 {text-transform: uppercase; font-size: 4rem; margin: 0px; padding: 0px;}
#whitecontent h2 {font-weight: normal; font-size: 4rem; margin: 0px; padding: 0px; }
#whitecontent h3 {padding-bottom: 3%;}
#whitecontent h2.coloredtitle, #whitecontent h3.coloredtitle {color: #b39300}
#whitecontent img {max-width: 100%;}
#graycontent {background:#e0e0e0; overflow: visible}
#graycontent .popimage {margin-top: -140px;}
#graycontent img {max-width: 100%;}
#graycontent h2, #graycontent h3 {text-transform: uppercase; font-size: 4rem; margin: 0px; padding: 0px;}
#graycontent h2 {font-weight: normal; font-size: 4rem; margin: 0px; padding: 0px; }
#graycontent h3 {padding-bottom: 3%;}
#graycontent h2.coloredtitle, #graycontent h3.coloredtitle {color: #b39300}

#contentarea {}
#homecontent_block1 {background: #f6f6f6}
#homecontent_block1 .majorhighlightbox {color: #474646; display: inline-block; text-align: center; text-transform: uppercase; border-bottom: 80px solid #ffd204; font-weight: normal; font-size: 3.6rem;}


/* innovation page */
#innovation{text-align:center}
#innovation h2{border-bottom:1px dotted #ffd204;display:inline-block;font-family:verdana;font-size:1.6rem;font-style:italic;font-weight:400;margin:0 0 5px;padding:0 0 5px}
#innovation h3{color:#000;display:block;font-family:arial;font-size:1.6rem;font-weight:700;margin:0;padding:0 0 5px}
#innovation h3 a{color:#000}
#innovation img{max-width:270px;width:100%}
/* end of innovation */


#history{background:url(../../site/img/wood.jpg);background-position:center;background-size:cover;color:#fff;padding:5%;text-align:center}
#history p {background: #302623; padding: 5% 7%; color: #fff; font-size: 1.6rem;}
#history h1 {color: #fff; font-weight: normal; text-transform: uppercase; font-size: 4.8rem; padding-bottom: 10px;}

#careerintro{background:url("../../site/img/carreerheader.jpg");background-position:center;color:#fff;padding:5%;text-align:center}
#careerintro p {padding: 3% 15%; font-size: 1.6rem;}
#careerintro h1 {font-weight: normal; text-transform: uppercase; font-size: 4.8rem; padding-bottom: 10px; color: #575656}
#careerintro .inline-list li{display: inline-block; clear: none; }
#careerintro .inline-list {margin-top: 0px; padding-top: 0px;}

#contactmast{background:url("http://cdn.desktopwallpapers4.me/wallpapers/abstract/1680x1050/2/15920-grey-wood-texture-1680x1050-abstract-wallpaper.jpg");background-position:left;color:#fff;padding:5%;text-align:center}
#contactmast p {padding: 3% 15%; font-size: 1.6rem; color: #eee}
#contactmast h1 {font-weight: normal; text-transform: uppercase; font-size: 4.8rem; padding-bottom: 10px; color: #fff}


#drivers {position: relative; height: 452px; overflow: visible }
#drivers .yellowbox {width: 51%; padding: 2% 11% 2% 2%; float: right; margin: 9% 5%; background: #ffd204; }
#drivers .yellowbox h1 {margin: 0px; padding: 0px; font-family: arial; font-style: italic; font-weight: normal; color: #575656; font-size: 2rem; margin-bottom: 6px; border-bottom: 1px dotted #fff; padding-bottom: 6px}
#drivers .yellowbox p {margin: 0px; padding: 0px; margin-bottom: 6px;}

#focusgraphic {position: absolute; bottom: 0px; left: 0px;}

#contactnums {width: 90%; margin: 0 auto;}
#contactnums .col {text-align: center}
#contactnums h2 {font-weight: bold; color: #FFD204; font-size: 3rem}
.contactdetails {text-align: left; background: #222; padding: 4%; min-height: 130px;}
.contactdetails p {color: #fff; font-size: 1.4rem; margin: 0px; padding: 0px; line-height: 1.9rem}
.contactdetails h5 {font-weight: bold; color: #FFD204; font-size: 1.8rem; margin: 0px; padding: 0px; display: none;}

/* footer element */
#copyrightcontainer p{border-top:1px solid #ffd200;margin-top:20px;padding-top:5px}
#footerrow {}
#footerrow .content{background:#2b2b2b;padding-bottom:50px;padding-top:30px; border-top: 30px solid #ffd204}
#footerrow a{-webkit-transition-duration:.3s;-webkit-transition-property:color;color:#ffd200;font-family:arial;font-size:1.4rem;transition-duration:.3s;transition-property:color}
#footerrow a:hover{color:#ffd200}
#footerrow h5{border-bottom:1px solid #ffd200;border-top:1px solid #ffd200;color:#ffd200;font-family:myriad-pro-condensed, tahoma;font-size:1.8rem;font-weight:700;margin:5px 0;padding:5px 0;text-transform:uppercase}
#footerrow h5.margin-right{margin-right:20px}
#footerrow h6{color:#fff;font-family:arial;font-size:1.4rem;margin:10px 0 0;padding:0}
#footerrow h6 a{color:#fff;font-size:1.4rem;margin:0;padding:0}
#footerrow p,#footerrow a{color:#fff;font-size:1.4rem;margin:0;padding:0 0 10px; line-height: 20px;}
#footerrow a{color:#ffd200;font-size:1.4rem;margin:0;padding:0 0 10px; line-height: 20px;}
#footerrow ul{list-style:none;margin:10px 0 0;padding:0}
#footerrow ul li a{color:#fff;font-family:arial;font-size:1.4rem}
/* end of footer */

#slides {height: 452px; position: relative; background: #333335}
#slides .slide {height: 100%; background-size: cover; background-repeat: none; position: absolute; top: 0px; left: 0px; width: 100%;}
#slides .slide .slidecontent {width: 50%; margin: 2%; text-align: center; float: right; margin-top: 6%; padding: 2%}
#slides .slide .slidecontent p {color: #fff; font-size: 1.8rem}
#slides .dotnav {position: absolute; width: 50%; bottom: 80px; right: 20px;  z-index: 9999999; text-align: center}
#slides .dotnav a {color: #fff; width: 15px; height: 15px; background: #fff; border-radius: 100px; display: inline-block; margin: 5px}
#slides .dotnav a.dotactive {background: #ffd200}

.pic-grid { width: 90%; margin: 0 auto; margin-top: 60px; margin-bottom: 30px;}
.pic-grid .pic {border: 5px solid #fff ;-moz-box-sizing:    border-box;
   -webkit-box-sizing: border-box;
    box-sizing:        border-box;
	vertical-align: top; float: left}


.quote p {text-align: center}

#graycontent.joblistings h3 {font-size: 1.9rem}
.joblistings .col {padding: 5%}
.joblistings .col p {padding-bottom: 0px; margin-bottom: 15px;}

.hoverreveal {position: relative; overflow:hidden}
.hoverreveal .cover {position: absolute; top: 0px; left: 0px; -moz-transition:all 1s;-o-transition:all 1s;-webkit-transition:all 1s;}
.hoverreveal .cover {height: 100%;}
.hoverinstruct {display: inline-block; position: absolute; z-index: 99999; color: #fff; top: 0px; left: 0px; font-size: 4rem; text-align: center; font-weight: bold; opacity: .7; text-align: center; vertical-align: center; 
 margin-top: 20%; width: 100%}
.hoverinstruct div {vertical-align: center; display: block; position: relative;}
.hoverreveal:hover .cover {top: 500px}
.locations h4 {background: #575656; margin: 0px; padding: 2%; text-transform: uppercase; color: #fff; font-size: 2rem; text-align: center}
.locations { padding-bottom: 30px;}

.framebox {width: 100%; margin: 2%; padding: 5%; background: #ccc; padding-top: 8%}
.framebox {border-bottom: 6px solid #FFD204}
@media only screen and (max-width: 1403px) {
video {display: none;}

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

.pic-grid { width: 100%; margin: 0 auto; margin-top: 0px; margin-bottom: 0px;}
.pic-grid .pic {border: 5px solid #fff ;-moz-box-sizing:    border-box;
   -webkit-box-sizing: border-box;
    box-sizing:        border-box;
	vertical-align: top; float: left}

    .hide-at-medium {display: none;}
#focusgraphic {display: none;}
#drivers .yellowbox {width: 90%; padding: 2% 2% 2% 2%; float: none; margin: 2% auto; background: #ffd204;  margin-bottom: 4% }
#drivers { height: auto }

#mainnav {width: 100%; float: none; clear: both; height: auto!important; min-height: auto; padding-left: 2%}
#mainnav  #navitems {margin-top: 20px; text-align: center; width: 100%;}
#mainnav #navitems a {margin-left: 1.4%; margin-right: 1.5%;}
#mainnav #navitems a:first-child {margin-left: 0px}
#mainnav #navitems a:last-child {margin-right: 0px;}
#mainnav .align-right {float: none!important; clear: all}




.corpslogan {font-size: 2rem}

#slides {height: 380px; }
#slides .slide {height: 100%; background-size: cover; background-repeat: none; position: absolute; top: 0px; left: 0px; width: 100%;}
#slides .slide .slidecontent {width: 100%; margin: 0%; text-align: center; float: right; margin-top: 0%; padding: 10%; background: #333335; height: 100%}
#slides .dotnav {display: none;}

}

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

@media only screen and (max-width: 759px) {
    
	#graycontent .popimage {margin-top: 0px;}

	#mainnav a {display: block; float: left; width: 45%; text-align: left; margin: 0px; padding: 0px; padding-left: 2%!important; margin-bottom: 12px; margin-left: 0px!important}
	#slides {height: 300px; }
	#subnavitems {text-align: left; padding: 0px;}
#subnavitems a {display: block; width: 100%; text-align: left; padding: 0px; padding-left: 1%!important; margin-bottom: 14px!important;}
}



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


	#mastgraphic {height: 400px}
	#logoandnav {margin: 0px; padding: 0px}
	#logocol { padding: 2%}
	#mainnav {margin: 0px; padding: 0px}
	#drivers .yellowbox {width: 100%; padding: 2% 2% 2% 2%; float: none;  background: #ffd204;  margin: 0px; }
	.majorhighlightbox {width: 100%}
	.elemencontent {padding: 2%}
	.hide-mobile {display: none!important;}
	#mastgraphic .slogancontainer h1 {font-size: 3.5rem}
		#mastgraphic .slogancontainer h2 {font-size: 2.5rem}
	#mainnav {margin: 0px; padding: 0px; margin-left: 1%;}
	#mainnav #navitems {margin-top: 0px;}

}
	#mastgraphic-mobile {display: none;}

@media screen and (max-width: 480px) {
	#mainnav {margin: 0px; padding: 0px; margin-left: 1%; padding-top: 20px;}
	#mainnav #navitems {margin-top: 0px;}
	.col, #drivers .yellowbox {padding-left: 4%; padding-right: 4%}
	.col .col {padding-left: 0px; padding-right: 0px;}
	#footerrow .content .col:first-child {margin-bottom: 40px;}
	#footerrow .content .col .col:first-child {margin-bottom: 0px;}

	#mastgraphic {display: none;}
	#mastgraphic-mobile {display: block;}
	#mastgraphic-mobile img {
		display:block;
		max-width:380px;
		height:auto;
		width:auto\9;
		margin:0 auto;
	}
}

/* sweeps */
.hvr-sweep-to-top {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -moz-osx-font-smoothing: grayscale;
  position: relative;
  -webkit-transition-property: color;
  transition-property: color;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
}
.hvr-sweep-to-top:before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  -webkit-transform: scaleY(0);
  transform: scaleY(0);
  -webkit-transform-origin: 50% 100%;
  transform-origin: 50% 100%;
  -webkit-transition-property: transform;
  transition-property: transform;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}
.hvr-sweep-to-top:hover, .hvr-sweep-to-top:focus, .hvr-sweep-to-top:active {
  color: white;
}
.hvr-sweep-to-top:hover:before, .hvr-sweep-to-top:focus:before, .hvr-sweep-to-top:active:before {
  -webkit-transform: scaleY(1);
  transform: scaleY(1);
}


.subnavgroup {margin-bottom: 100px;}
.subnavgroup a {display: block; clear: both; font-family: arial; text-transform: uppercase; color: #cc9900;  font-weight: bold; padding-top: 10px; padding-bottom: 10px; padding-left: 5px; padding-right: 5px; background: #eee; border-bottom: 1px solid #fff}
.subnavgroup a:hover {background: #cc9900; color: #fff}
.subnavgroup h2 {margin-bottom: 10px; border-bottom: 1px solid #cc9900 }
.subnavgroup a:last-child {border-bottom: 20px solid #cc9900}
.subnavgroup a.active {background: #cc9900; color: #fff}

.whoname {display: block; background: #FFD204; font-weight: bold; color: #000; padding: 5%; font-size: 2rem; text-transform: uppercase; position: absolute; bottom: 0px; left: 0px; width: 100%;}
.managementquote {background: #ccc; min-height: 469px; padding-top: 100px; padding-left: 25px; padding-right: 25px;}
.bio {background: #ccc; padding: 4%; height: 372px; overflow: hidden;}
.shade {background: #ccc; display: block; height: 372px; overflow: hidden; position: relative;} 
.shade .col {height: 372px; position: relative;}
.bio p {margin: 0px; padding: 0px; text-align: left; font-size: 1.4rem}
.management .imgcontainer img {height: 324px;overflow: hidden; width: 100%;}
.management .imgcontainer {height: 324px; overflow: hidden;}

.formstyle {margin-top: 15px; margin-bottom: 20px;}
.formstyle label {display: inline-block; width: 20%; float: left; font-size: 2rem; margin-bottom: 10px;}
.formstyle .typefield { display: inline-block; width: 50%; float: left; font-size: 2rem}
.formstyle .btn {background: #FFD204; padding: 2%; text-transform: uppercase; margin-top: 10px;}
.formstyle br {clear: both;}



.downloadBtn img {width: 120px; margin-bottom: 20px;}

.modal {display: block; width: 100%; height: 100%; position: fixed;  top: 0px; display: none; z-index: 9999999}
.modal .modalcontent {display: block; margin: 0 auto; margin-top: 200px; background: #fff;
padding: 2%;
display: block;
width: 30%;
min-width: 350px;
margin: 200px auto 0px;
min-height: 50%;
box-shadow: 0px 0px 10px #000
}

.brochureform label {display: block; float: left; width: 150px; font-family: arial; font-size: 16px; margin-bottom: 15px; clear: left;}
.brochureform input {display: block; float: left;  font-family: arial; font-size: 16px; margin-bottom: 15px;}
.brochureform br {clear: both;}
.brochureform .btn-yellow, .brochureform .btn-gray {color: #fff; margin-top: 10px;}

.clearfix:after {
     visibility: hidden;
     display: block;
     font-size: 0;
     content: " ";
     clear: both;
     height: 0;
     }
.clearfix { display: inline-block; }
/* start commented backslash hack \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* close commented backslash hack */