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

/**	=VISUAL TEMPLATE
------------------------------------------------------------------------------------------------ */
	@font-face {
		font-family:'Gotham-Book';
		src: url('fonts/Gotham-Book_gdi.eot');
		src: url('fonts/Gotham-Book_gdi.eot?#iefix') format('embedded-opentype'),
			 url('fonts/Gotham-Book_gdi.woff') format('woff'),
			 url('fonts/Gotham-Book_gdi.ttf') format('truetype'),
			 url('fonts/Gotham-Book_gdi.otf') format('opentype'),
			 url('fonts/Gotham-Book_gdi.svg#Gotham-Book') format('svg');
		font-weight: normal;
		font-style: normal;
	}
	@font-face {
		font-family:'Gotham-Medium';
		src: url('fonts/Gotham-Medium_gdi.eot');
		src: url('fonts/Gotham-Medium_gdi.eot?#iefix') format('embedded-opentype'),
			 url('fonts/Gotham-Medium_gdi.woff') format('woff'),
			 url('fonts/Gotham-Medium_gdi.ttf') format('truetype'),
			 url('fonts/Gotham-Medium_gdi.otf') format('opentype'),
			 url('fonts/Gotham-Medium_gdi.svg#Gotham-Medium') format('svg');
		font-weight: normal;
		font-style: normal;
	}
	@font-face {
		font-family:'Gotham-Bold';
		src: url('fonts/Gotham-Bold_gdi.eot');
		src: url('fonts/Gotham-Bold_gdi.eot?#iefix') format('embedded-opentype'),
			 url('fonts/Gotham-Bold_gdi.woff') format('woff'),
			 url('fonts/Gotham-Bold_gdi.ttf') format('truetype'),
			 url('fonts/Gotham-Bold_gdi.otf') format('opentype'),
			 url('fonts/Gotham-Bold_gdi.svg#Gotham-Bold') format('svg');
		font-weight: normal;
		font-style: normal;
	}

	/* TYPOGRAPHY
	-------------------------------------------------------------- */
		html body {
			/* font-family: 'Gotham-Book', sans-serif; */
			color: #000000;
		}
		html body #pe-content h1 {
			font-family: 'Gotham-Bold', sans-serif;
			color: #ed1c24;
			text-transform: none;
		}
		html body #pe-content h2 {
			font-family: 'Gotham-Medium', sans-serif;
			color: #2f2f2f;
		}
		html body #pe-content h3 {
			font-family: 'Gotham-Bold', sans-serif;
			color: #262626;
		}
		html body #pe-content h4 {
			font-family: 'Gotham-Bold', sans-serif;
			color: #ed1c24;
			text-transform: none;
		}
		html body #pe-content h5 {
			text-transform: none;
			font-family: 'Gotham-bold', sans-serif;
		}
		html body #pe-frame p {
			/* font-family: 'Gotham-Book', sans-serif; */
		}
		html body #pe-frame a {
			font-family: 'Gotham-Medium', sans-serif;
			outline: none !important;
			text-decoration: none;
			color: #58595b;
		}
		html body #pe-frame a:hover {
			text-decoration: underline;
		}
		html body #pe-frame a.arrow-link {
			font-family: 'Gotham-Bold', sans-serif;
			color: #58595b;
			font-size: 18px;
			line-height: 23px;
			text-decoration: none;
			text-transform: none;
		}
		#pe-content-wrap form .form-button {
			text-align: center;
		}

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

	/* NAVIGATION
	-------------------------------------------------------------- */
		#pe-nav .client-logo a,
		#pe-nav .client-logo a img {
			width: 96px;
			height: 83px;
		}
		#pe-nav .client-logo {
			padding-top: 2px; 
		}
		#pe-nav .location {
			background: #7d8084; 
		}
		#pe-nav .location a span:before {
			content: url( '../img/gas_pump.png' );
			position: relative;
			top: -12px;
			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: #ed1c24;
				border-color: #ed1c24;
				border-radius: 8px;
				color: #fff;
				font-size: 16px;
				line-height: 16px;
				padding: 16px 35px;
				text-decoration: none;
				font-family: 'Gotham-Bold', sans-serif;
				font-weight: 400;
				text-transform: none;
				border: 3px solid #ed1c24;
			}
			#pe-frame button.client:hover,
			#pe-frame a.btn.client:hover,
			#pe-frame a.button.client:hover {
				background-color: #ed1c24;
				border-color: #A90A16;
				border-bottom-color: #A90A16;
				border-top-color: #E31922;
				outline: none !important;			
			}
			/* userID buttons*/
				#pe-frame #pe-header #userID a.button.client {
					font-size: 9px;
					line-height: 9px;
					padding: 3px 6px;
				}

		/* Forms */
			#pe-content-wrap form .form-item .form-input input, 
			#pe-content-wrap form .form-item .form-input select {
				font-family: 'Gotham-Book', sans-serif;
			}
		/* Icons */
			/*a.arrow-link span {
				display: block;
				float: left;
				font-size: 22px;
				font-family: 'icomoon' !important;
			}
			#pe-frame .icon-filled-circle-right {
				margin-right: 10px;
			}
			#pe-frame .icon-filled-circle-right .path1:before {
				content: "\e977";
				color: rgb(80, 82, 85);
			}
			#pe-frame .icon-filled-circle-right .path2:before {
				content: "\e978";
				margin-left: -1em;
				color: rgb(255, 255, 255);
			}*/
			#pe-frame .arrow-right:before {
				content: "\f138";
				color: #58595b;
			}

	/* FOOTER
	-------------------------------------------------------------- */
		#pe-frame #pe-footer {
			background-color: #262626;
			background-position: top center;
			background-repeat: repeat-x;
			padding-top: 2.5em;
			padding-bottom: 2.5em;
		}
		#pe-frame #pe-footer .footer-logo {
			display: block; 
			margin: 0 auto 24px; 
			width: 82px;
			height: 82px;
		}
		#pe-frame #pe-footer #footer_nav {
			font-size: 20px;
			line-height: 22px;
		}
		#pe-frame #pe-footer #footer_nav a:hover,
		#pe-frame #pe-footer #legal_links a:hover {
			color: #acadb0; 
		}
		#pe-frame #pe-footer #copyright {
			font-weight: bold; 
		}
		#pe-frame #pe-footer #copyright,
		#pe-frame #pe-footer #legal_links {
			font-size: 13px; 
			line-height: 18px; 
		}
		#pe-frame #pe-footer #legal_links a {
			text-decoration: none; 
			font-weight: bold; 
		}
		#pe-frame #pe-footer #legal_links a:hover {
			text-decoration: underline; 
		}

	/* PAGES
	-------------------------------------------------------------- */
		/* {map_select} */
			.map_selected #pe-frame #pages > div.selected {
				border-bottom: 1px solid #302f30;
			}
			.map_selected #pe-frame #pages > div.selected a {
				background: #404041;
			}


	/* @media queries =VISUAL TEMPLATE --------------------------------------------------------- */
		@media only screen and (max-width: 959px) {
			/* navigation */
				#pe-nav .location a span {
					font-size: 30px; 
				}
				#pe-nav .location a span:before {
					font-size: 40px; 
					padding-left: 15px; 
					padding-right: 24px; 
					top: 8px; 
				}
				#menu-toggle span {
					background-color: #262626;
				}
				#pe-nav #nav-links {
					background: #262626;
				}
				#pe-nav #nav-links #nav_logo {
					width: 78px; 
					height: 70px; 
					background-image: url( '../img/logo_navigation.png' );
				}
				#pe-nav #nav-links #menu-close {
					margin-top: 27px; 
					width: 23px;
					height: 23px;
				}
				#pe-nav #nav-links .nav-wrapper div.nav-item {
					border-bottom: 1px solid #454749;
				}
				#pe-nav #nav-links .nav-wrapper div.nav-item a {
					font-family: 'Gotham-Bold', sans-serif;
				}
				#pe-nav #nav-links .nav-wrapper div.nav-item:nth-child(2),
				#pe-nav #nav-links .nav-wrapper div.nav-item:nth-child(3) {
					border-top: 1px solid #454749;
				}
				#pe-nav #nav-links .nav-wrapper div.nav-item:nth-child(even) {
					border-right: 1px solid #454749;
				}
				/* 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;
					}
		}
		@media only screen and (max-width: 767px) {
		}
		@media only screen and (max-width: 479px) {
			/* navigation */
				#pe-nav .location a span {
					font-size: 20px; 
				}
		}
		@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: 18.4% !important;
				}
				#pe-nav #nav-links {
					width: 66.2% !important;
				}
				#pe-nav #nav-links a {
					color: #000;
					font-size: 1.125em; 
					font-family: 'Gotham-Bold', sans-serif;
				}
				#pe-nav #nav-links .current a {
					color: #ed1c24; 
				}
				#pe-nav #nav-links a:hover {
					color: #7d8084;
				}
				#pe-nav #nav-links .current a:after {
					background: #ed1c24;
				}
				#pe-nav .location {
					width: 15.4% !important;
				}
				#pe-nav .location a span {
					font-size: 13px;
					line-height: 15px;
					padding-top: 24px; 
				}
				#pe-nav .location a span:before {
					font-size: 48px; 
					padding-left: 10px; 
					padding-top: 5px; 
					margin: 0px 16px 10px 0;
				}
				#pe-frame #pe-nav #nav-links .nav-wrapper div.nav-item a:hover {
					text-decoration: none;
				}
		}
		@media only screen and (min-width: 1281px) {
		}