.allCaps {text-transform:uppercase;}

body {background:url(/towing/gettowing/assets/img/bodyMicroBG.png) repeat-x; color:#666666;}
    header, #header {min-height:104px;}

#microHeaderNav {position: relative; top: 43px; float: right;}
#microLogo {position: relative; top: 26px; width: 200px; float: left;}
#microHeaderNav ul li {color:#666666; font-size:14px; line-height:14px; float:left; margin:0 0 0 1em; padding:0 0 0 1em; border-left:1px solid #CCC;}
    #microHeaderNav ul li:first-child {margin:0; padding:0; border-left:0;}
    #microHeaderNav ul li a {color:#666666; text-decoration:none; border-bottom:2px solid #DDD; padding-bottom:2px; transition: all 0.3s ease-in-out; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out;}
    #microHeaderNav ul li a:visited, #preferTalk ul li a:link, #preferTalk ul li a:active {color:#666666;}
    #microHeaderNav ul li a:hover {color:#CC0000; border-bottom:2px solid #CC0000;}
    #microHeaderNav ul li a.active {color:#CC0000;}

.mapOverlay {position:absolute; height:300px; width:100%; border:1px solid #000; z-index:10; background:rgba(0,0,0,.5);}

#map_container {display:block; height:300px;}

@media only screen and (min-width: 761px) {
    /*Desktop*/
	#showPPCMenu {display:none;}
    a#PlansPricing {margin:0 1em 1em 0}
}

@media only screen and (max-width: 760px) {
	#BUSlogoResponsive {margin-top:10px;}
    footer, #footer {margin-bottom:40px}
	body #page {padding-top: 60px;}
    
    a.flat {display:block; margin:2em auto 0;}
    a.flat.small.wide,
    a.flat.outline.small.wide {padding:10px 24px;}
    

	#microLogo {position: relative; top: 0; width: 100%; float: left;}
	header #ppc-header #microLogo #logo {width:160px; margin:.4em 0 0 .4em;}
	#microHeaderNav {top: 47px;}

	header {position:fixed; top:0; background:#FFF; z-index:9999;}
	header #ppc-header.container_30 {width:100%;}
	header {padding:0 0 5px 0; width:100%; height:42px;
		-webkit-box-shadow:0px 3px 10px rgba(0,0,0,0.2);
		-moz-box-shadow:0px 3px 10px rgba(0,0,0,0.2);
		box-shadow:0px 3px 10px rgba(0,0,0,0.2);}
	header #ppc-header #showPPCMenu {display:block; margin:10px 15px 0 0; float:right;}
	header #ppc-header #showPPCMenu i {display:inline-block; font-size:25px; }

	/*#showPPCMenu {display:block;}*/
	#microHeaderNav {display:block;}
	#page, #microHeaderNav {transition: .2s all ease;}
	body #microHeaderNav {margin-right: -200%; float: right; width:60%; position: fixed; right: 0; height: 100%; overflow-y: scroll; overflow-x: hidden;}
	body.respond #microHeaderNav {margin-right: 0; background: #333333; z-index:999;
		-webkit-box-shadow: -3px 0px 10px rgba(0,0,0,0.2);
		-moz-box-shadow: -3px 0px 10px rgba(0,0,0,0.2);
		box-shadow: -3px 0px 10px rgba(0,0,0,0.2);}
		
	.respond #microHeaderNav ul li {float:none; display:block; margin:0; padding:0; width:100%; border-left:0;}
	.respond #microHeaderNav ul li a {display:block; padding:.8em 0 .8em .5em; border-bottom-width:1px; border-bottom-color:#222; color:#CCC;}
	.respond #microHeaderNav ul li a.active {color:#FFF; border-bottom-color:#C00;}
}




@-webkit-keyframes roll {
from { -webkit-transform: rotate(0deg) }
to   { -webkit-transform: rotate(360deg) }
}

@-moz-keyframes roll {
from { -moz-transform: rotate(0deg) }
to   { -moz-transform: rotate(360deg) }
}

@keyframes roll {
from { transform: rotate(0deg) }
to   { transform: rotate(360deg) }
}

body.roll {
-moz-animation-name: roll;
-moz-animation-duration: 4s;
-moz-animation-iteration-count: 1;
-webkit-animation-name: roll;
-webkit-animation-duration: 4s;
-webkit-animation-iteration-count: 1;
}