/*
 * Name: 76 visual styles
 * Author: Cameron Babiak
 * Version: 1.0
 * 
 * Created: 5/4/2016
 * 
*/

/**	=VISUAL TEMPLATE
------------------------------------------------------------------------------------------------ */
	@font-face {font-family: 'AvantGardeGothicITCW01Bk';
		src: url('fonts/302D16_0_0.eot');
		src: url('fonts/302D16_0_0.eot?#iefix') format('embedded-opentype'),
		url('fonts/302D16_0_0.woff2') format('woff2'),
		url('fonts/302D16_0_0.woff') format('woff'),
		url('fonts/302D16_0_0.ttf') format('truetype'),
		url('fonts/302E54_0_0.svg') format('svg');
	} 
	  
	@font-face {font-family: 'AvantGardeGothicITCW02Dm';
		src: url('fonts/302D16_1_0.eot');
		src: url('fonts/302D16_1_0.eot?#iefix') format('embedded-opentype'),
		url('fonts/302D16_1_0.woff2') format('woff2'),
		url('fonts/302D16_1_0.woff') format('woff'),
		url('fonts/302D16_1_0.ttf') format('truetype'),
		url('fonts/302E54_1_0.svg') format('svg');
	} 
	  
	@font-face {font-family: 'AvantGardeGothicITCW02Md';
		src: url('fonts/302D16_2_0.eot');
		src: url('fonts/302D16_2_0.eot?#iefix') format('embedded-opentype'),
		url('fonts/302D16_2_0.woff2') format('woff2'),
		url('fonts/302D16_2_0.woff') format('woff'),
		url('fonts/302D16_2_0.ttf') format('truetype'),
		url('fonts/302E54_2_0.svg') format('svg');
	}

	/* TYPOGRAPHY
	-------------------------------------------------------------- */
		html body {
			font-family: 'AvantGardeGothicITCW02Dm', sans-serif;
			color: #444;
		}
		html body #pe-content h1 {
			color: #003893;
			letter-spacing: -0.5px;
			text-transform: none;
		}
		html body #pe-content h4 {
			color:#003893;
			text-transform: none;
		}
		html body #pe-content h5 {
			text-transform: none;
		}
		html body #pe-frame p {
			font-family: 'Muli', sans-serif;
		}
		html body #pe-frame a {
			font-family: 'Muli', sans-serif;
			color: #003893;
			text-decoration: none;
		}
		html body #pe-frame a:hover {
			text-decoration: underline;
		}
		html body #pe-frame a.arrow-link {
			font-family: 'AvantGardeGothicITCW02Dm' , sans-serif;
			color: #003893;
			font-size: 16px;
			line-height: 23px;
			text-decoration: none;
		}
		#pe-content-wrap form .form-button {
			text-align: center;
		}
		

	/* HEADER
	-------------------------------------------------------------- */
		

	/* NAVIGATION
	-------------------------------------------------------------- */
		#pe-nav .client-logo a,
		#pe-nav .client-logo a img {
			width: 75px;
			height: 72px;
		}
		#pe-nav .client-logo {
			padding-top: 7px; 
		}
		#pe-nav .location {
			background: #003893; 
		}
		#pe-nav .location a span {
			font-family: 'AvantGardeGothicITCW02Dm', sans-serif;
		}
		#pe-nav .location a span:before {
			content: url( '../img/gas_pump.png' );
			position: relative;
			top: -8px;
			display: block;
		}

	/* CONTENT
	-------------------------------------------------------------- */
		/* Buttons */
			#pe-frame button.client,
			#pe-frame a.btn.client,
			#pe-frame a.button.client,
			#pe-frame input[type=submit].client,
			#pe-frame input[type=reset].client,
			#pe-frame input[type=button].client {
				background-color: #f16639;
				border-color: #f16639;
				border-radius: 100px;
				color: #fff;
				font-size: 16px;
				line-height: 16px;
				padding: 16px 35px;
				text-decoration: none;
				font-family: 'AvantGardeGothicITCW02Dm', sans-serif;
				font-weight: 400;
				text-transform: lowercase;
			}
			#pe-frame button.client:hover,
			#pe-frame a.btn.client:hover,
			#pe-frame a.button.client:hover {
				background-color: #f16639;
				border-color: #d95d34;
				border-width: 3px;
				padding: 14px 33px;
				outline: none !important;				
			}
			/* userID buttons*/
				#pe-frame #pe-header #userID a.button.client {
					font-size: 10px;
					line-height: 10px;
					padding: 10px 18px;
				}
				#pe-frame #pe-header #userID a.button.client:hover {
					padding: 8px 16px;
				}
		/* Forms */
			#pe-content-wrap form .form-item .form-input input, 
			#pe-content-wrap form .form-item .form-input select {
				font-family: 'Muli', sans-serif;
			}
		
		/* Icons */
			/*#pe-frame .icon-filled-circle-right {
				margin-right: 5px;
				position: relative;
				top: 2px;
				font-family: 'icomoon' !important;
				line-height: 1;
			}
			#pe-frame .icon-filled-circle-right:before {
				content: "\e945";
			}*/
			#pe-frame .arrow-right:before {
				content: "\f138";
				color: #003893;
			}
				

	/* FOOTER
	-------------------------------------------------------------- */
		#pe-frame #pe-footer {
			background-color: #f16639;
			background-image: url( '../img/bg_footer_m.png' );
			background-position: top center;
			background-repeat: no-repeat;
			background-size: 100% auto; 
			position: relative; 
			padding-top: 190px !important; 
			padding-bottom: 34px !important; 
			margin-bottom: 8px; 
		}
		#pe-frame #pe-footer .footer-logo {
			position: absolute; 
			right: 4%; 
		}
		#pe-frame #pe-footer #footer_nav {
			font-size: 22px;
			line-height: 22px;
		}
		#pe-frame #pe-footer #footer_nav a:hover {
			color: #d25126; 
		}
		#pe-frame #pe-footer #copyright,
		#pe-frame #pe-footer #legal_links {
			font-size: 14px; 
			line-height: 18px; 
		}
		#pe-frame #pe-footer #legal_links {
			font-weight: bold; 
		}
		#pe-frame #pe-footer #legal_links a {
			text-decoration: none; 
		}
		#pe-frame #pe-footer #legal_links a:hover {
			color: #367771;
			text-decoration: underline; 
		}
	
	/* PAGES
	-------------------------------------------------------------- */
		/* {map_select} */
			.map_selected #pe-frame #pages > div.selected {
				border-bottom: 1px solid #002d55;
			}
			.map_selected #pe-frame #pages > div.selected a {
				background: #003f77;
			}
		

	/* @media queries =VISUAL TEMPLATE --------------------------------------------------------- */
		@media only screen and (max-width: 959px) {
			/* navigation */
				#pe-nav .client-logo {
					padding-left: 15px; 
				}
				#pe-nav .location a span {
					font-size: 30px; 
				}
				#pe-nav .location a span:before {
					font-size: 40px; 
					padding-left: 40px; 
					padding-right: 24px; 
					top: 8px !important;
				}
				#menu-toggle span {
					background-color: #003893;
				}
				#pe-nav #nav-links {
					background: #003893;
				}
				#pe-nav #nav-links #nav_logo {
					width: 60px; 
					height: 60px; 
					background-image: url( '../img/logo_navigation.png' );
				}
				#pe-nav #nav-links .nav-wrapper div.nav-item a:hover {
					text-decoration: none;
				}
				#pe-nav #nav-links .nav-wrapper .nav-item a {
					font-family: 'AvantGardeGothicITCW02Dm' , sans-serif;
				}
				
				/* footer nav mobile */
					#pe-frame #footer_nav_mobile a,
					#pe-frame #legal_links_mobile a {
						color: #fff;
					}
					#pe-frame #footer_nav_mobile a:hover,
					#pe-frame #legal_links_mobile a:hover {
						text-decoration: none;
					}


			/* footer */
				#pe-frame #pe-footer .footer-logo {
					top: 12px; 
				}
		}
		@media only screen and (max-width: 767px) {
		}
		@media only screen and (max-width: 479px) {
			/* footer */
				#pe-frame #pe-footer {
					padding-top: 140px !important;
				}
		}
		@media only screen and (max-width: 479px) {
			/* navigation */
				#pe-nav .location a span {
					font-size: 20px; 
				}
			/* {home} */
				#pe-frame .call-to-action {
					width: 100%;
					float: none;
					text-align: center;					
				}

		}
		@media only screen and (min-width: 480px) {
		}
		@media only screen and (min-width: 768px) {
		}
		@media only screen and (min-width: 960px) {
			/* navigation */
				#pe-nav .client-logo {
					width: 17.3% !important;
				}
				#pe-nav #nav-links {
					width: 63.8% !important;
				}
				#pe-nav #nav-links a {
					color: #58595b;
					font-size: 1.1875em; 
					font-family: 'AvantGardeGothicITCW02Dm', sans-serif;
				}
				#pe-nav #nav-links .current a {
					color: #003893; 
				}
				#pe-nav #nav-links a:hover {
					color: #9ea2a2;
				}
				#pe-nav #nav-links .current a:after {
					background: #003893;
				}
				#pe-nav .location {
					width: 18.9% !important;
				}
				#pe-nav .location a span {
					font-size: 13px;
					line-height: 15px;
					padding-top: 24px;
					margin-top: -1px; 
				}
				#pe-nav .location a span:before {
					font-size: 48px; 
					line-height: 26px;
					padding-left: 20px; 
					margin: 0px 16px 10px 0;
				}

			/* footer */
				#pe-frame #pe-footer {
					padding-top: 131px !important; 
					background-image: url( '../img/bg_footer.png' );
				}
				#pe-frame #pe-footer .footer-logo {
					top: -16px; 
				}
		}
		@media only screen and (min-width: 1281px) {
		}