/*
 * Name: P66, 76 & Conoco Core styles
 * Author: Cameron Babiak
 * Version: 1.0
 * 
 * Created: 5/4/2016
 * Edited: 9/19/2020
 * 
*/


/** =TYPOGRAPHY
------------------------------------------------------------------------------------------------ */
	/* fontawesome */
		#pe-frame .fa {
			font-style: normal;
			display: inline-block;
			font-family: 'Font Awesome 6 Brands';
			font-size: inherit;
			text-rendering: auto;
			-webkit-font-smoothing: antialiased;
			-moz-osx-font-smoothing: grayscale;
			transform: translate(0, 0);
			margin-right: 0.5em;
		}
		#pe-frame .fa-facebook-official:before {
			content: "\f09a";
			color: #3b579d;
		}
		#pe-frame .fa-twitter:before {
			content: "\e61b";
			color: #000
		}
		#pe-frame .fa-instagram:before {
			content: "\f16d";
			color: #000;
		}
		#pe-frame .fa-youtube-play:before {
			content: "\f16a";
		}
		#pe-frame .fa-facebook-f:before,
		#pe-frame .fa-facebook:before {
			content: "\f09a";
			color: #fff;
		}

	/* @media queries =TYPOGRAPHY -------------------------------------------------------------- */
		@media only screen and (max-width: 959px) {
		}
		@media only screen and (max-width: 767px) {
		}
		@media only screen and (max-width: 479px) {
		}
		@media only screen and (min-width: 480px) {
		}
		@media only screen and (min-width: 768px) {
		}
		@media only screen and (min-width: 960px) {
		}
		@media only screen and (min-width: 1281px) {
		}


/** =LAYOUT TEMPLATE
------------------------------------------------------------------------------------------------ */
	html body #pe-frame {
		width: 100%; 
		max-width: 1280px; 
		margin: 0 auto; 
	}

	/* HEADER
	-------------------------------------------------------------- */
		/* userID */
			#pe-frame #pe-header #userID {
				margin-top: 1em;
			}
				
	/* NAVIGATION
	-------------------------------------------------------------- */
		#pe-nav {
			line-height: 86px; 
			background: #FFF; 
		}
		#pe-nav .client-logo a,
		#pe-nav .client-logo a img {
			display: block; 
		}
		#pe-nav .location,
		#pe-nav .location a {
			color: #fff;
			text-decoration: none; 
			vertical-align: middle; 
		}
		#pe-nav .location a:hover {
			text-decoration: none; 
		}
		#pe-nav .location a span {
			display: block; 
		}
		#pe-nav .location a span:before {
			display: block; 
			float: left; 
			font-family: 'icomoon' !important;
		}
		
	/* CONTENT
	-------------------------------------------------------------- */
		html body #pe-frame #pe-content-wrap {
			padding: 2em 0; 
		}
		#pe-content-wrap #pe-sidebar {
			display: block; 
			padding: 0 1em;
		}
		#pe-content-wrap #pe-sidebar img {
			display: block; 
			margin: 0 auto; 
		}
	
		/* List */
			#pe-content-wrap .disc > li, 
			#pe-content-wrap .decimal > li, 
			#popup-frame .disc > li, 
			#popup-frame .decimal > li {
				line-height: 1.75em;
			}
		/* Forms */
			#pe-content-wrap form .form-item .form-input input, 
			#pe-content-wrap form .form-item .form-input select,
			#pe-content-wrap form .form-item .form-pin-input input,
			#pe-content-wrap form.vertical .form-input textarea {
				border: 1px solid #D0D1C9;
				border-radius: 0;
				box-shadow: none;
			}
			#pe-content-wrap form .form-item .form-input input:focus, 
			#pe-content-wrap form .form-item .form-input select:focus,
			#pe-content-wrap form .form-item .form-pin-input input:focus,
			#pe-content-wrap form.vertical .form-input textarea:focus {
				border: 1px solid #66afe9;
				outline: 0;
				-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6);
						box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6);
			}
			/*#pe-content-wrap form.vertical .form-item .form-label label {
				white-space: nowrap;
			}*/
			#pe-content-wrap form.vertical #receive_promo_er .form-input {
				width: 100%;
			}
			#pe-content-wrap form.vertical #rules_er .form-input label {
				padding-left: 0;
			}
			#pe-content-wrap form.vertical #rules_er .form-input label input {
				margin-left: 4px;
			}
			#pe-content-wrap form.vertical #recaptcha_response_field_er span {
				/* display: none; */
			}
			#pe-content-wrap form #day_phone_er .form-input input {
				min-width: 50px;
			}
			#pe-content-wrap form #day_phone_er .form-input input:last-child {
				min-width: 60px;
			}
			#pe-content-wrap form .required { display: none; }
			#pe-content-wrap form.pe-form .form_button {
				text-align: right;
			}

	/* SIDEBAR
	-------------------------------------------------------------- */
		#pe-frame .socials {
			text-align: center;
		}
		#pe-frame .socials ul {
			margin: 1.5em auto 0.75em;
			list-style: none;
			display: block;
			text-align: center;
		}
		#pe-frame .prize_lv .socials ul {
			text-align: left;
		}
		#pe-frame .socials ul li {
			display: inline-block;
			margin-right: 0.5em;
		}
		#pe-frame .socials ul li:last-child {
			margin-right: 0;
		}
		#pe-frame .socials ul li i {
			font-size: 2.25em;
			margin-right: 0.125em;
			vertical-align: middle;
		}
		#pe-frame .socials ul li a,
		#pe-frame .socials a.social-links-bottom {
			text-decoration: none;
			-webkit-transform: translateZ(0);
			transform: translateZ(0);
			-moz-osx-font-smoothing: grayscale;
			position: relative;
			-webkit-transition-duration: 0.3s;
			transition-duration: 0.3s;
			-webkit-transition-property: transform;
			transition-property: transform;
			display: block;
		}
		#pe-frame .socials ul li a:hover,
		#pe-frame .socials a.social-links-bottom:hover {
			-webkit-transform: translateY(-4px);
			transform: translateY(-4px);
		}
		#pe-frame .socials a.social-links-bottom {
			font-size: 1.75em;
		}
			
	/* FOOTER
	-------------------------------------------------------------- */
		#pe-frame #pe-footer {
			position: relative;
			padding: 0 20px; 
		}
		#pe-frame #pe-footer,
		#pe-frame #pe-footer #footer_nav a,
		#pe-frame #pe-footer #legal_links a {
			color: #fff; 
		}
		#pe-frame #pe-footer .footer-logo {
			display: block; 
			line-height: 1; 
		}
		#pe-frame #pe-footer #footer_nav {
			text-align: center; 
			margin-bottom: 26px;
		}
		#pe-frame #pe-footer #footer_nav a {
			/* font-weight: bold; */
			text-decoration: none; 
			margin-right: 36px; 
			white-space: nowrap;
		}
		#pe-frame #pe-footer #footer_nav a.social-links {
			margin-right: 24px; 
		}
		#pe-frame #pe-footer #footer_nav .social-links span {
			font-family: 'icomoon' !important;
			speak: none;
			font-style: normal;
			font-weight: normal;
			font-variant: normal;
			text-transform: none;
			line-height: 1;
			-webkit-font-smoothing: antialiased;
			font-size: 30px;
			position: relative;
			top: 7px;
		}
		#pe-frame #pe-footer #footer_nav .social-links .youtube {
			font-size: 40px;
			line-height: 40px;
			position: relative;
			top: 11px;
			margin-right: 0px; 
		}
		#pe-frame #pe-footer #footer_nav .social-links span:after,
		#pe-frame #footer_nav_mobile .social-links span:after {
			display: inline;
		}
		#pe-frame #pe-footer #footer_nav .facebook:after,
		#pe-frame #footer_nav_mobile .facebook:after {
			content: '\e940';
		}
		#pe-frame #pe-footer #footer_nav .twitter:after,
		#pe-frame #footer_nav_mobile .twitter:after {
			content: '\e90a';
		}
		#pe-frame #pe-footer #footer_nav .instagram:after,
		#pe-frame #footer_nav_mobile .instagram:after {
			content: '\e92a';
		}
		#pe-frame #pe-footer #footer_nav .youtube:after,
		#pe-frame #footer_nav_mobile .youtube:after {
			content: '\e936';
		}
		#pe-frame #pe-footer #footer_nav i.fa-facebook-official:before,
		#pe-frame #pe-footer #footer_nav i.fa-twitter:before,
		#pe-frame #pe-footer #footer_nav i.fa-instagram:before,
		#pe-frame #pe-footer #footer_nav i.fa-youtube-play:before {
			font-size: 1.5em;
			color: #fff;
		}
		#pe-frame #pe-footer #copyright {
			margin-bottom: 24px;
		}
		#pe-frame #pe-footer #legal_links a:first-child {
			margin-right: 24px;
		}
		#pe-frame #pe-footer #legal_links {
			text-align: center;
		}

	/* @media queries =LAYOUT TEMPLATE --------------------------------------------------------- */
		@media only screen and (max-width: 959px) {
			/* navigation */
				#pe-nav {
					position: relative; 
				}
				#pe-nav .client-logo {
					height: 86px; 
					line-height: 86px; 
				}
				#pe-nav .client-logo a {
					margin: 0; 
					padding: 0; 
				}
				#pe-nav .location,
				#pe-nav .location a,
				#pe-nav .location a span {
					height: 83px; 
					line-height: 83px; 
				}
				#pe-nav .location br {
					display: none; 
				}
				#menu-toggle {
					float: right; 
					margin-right: 3px; 
					height: 86px; 
					width: 50px;
					padding-top: 22px; 
					padding-bottom: 27px;
					margin-top: -169px;
					background: #fff; 
					cursor: pointer; 
				}
				#menu-toggle span {
					display: block; 
					width: 50px; 
					height: 37px; 
					background-image: url( '../img/bg_menu-toggle.png' );
					background-repeat: no-repeat; 
					background-position: center center; 
				}
				#pe-nav #nav-links {
					position: absolute;
					width: 100%;
					/*top: -100%;*/
					top: -400%;
					transition: top 1s;
					box-sizing: border-box;
					margin-top: -1px; 
					z-index: 1;
				}
				#pe-nav #nav-links.in {
					top: 0;
				}
				#pe-nav #nav-links .nav-wrapper {
					padding: 20px 15px 5px; 
				}
				#pe-nav #nav-links #nav_logo {
					display: block; 
					float: left; 
					background-position: center center; 
					background-repeat: no-repeat; 
					background-size: 100% 100%; 
				}
				#pe-nav #nav-links #menu-close {
					display: block; 
					width: 35px; 
					height: 35px; 
					float: right; 
					cursor: pointer; 
					background-image: url( '../img/close-nav.png' );
					background-position: center center; 
					background-repeat: no-repeat; 
					background-size: 100% 100%; 
					margin-top: 13px; 
				}
				#pe-nav #nav-links .nav-wrapper div.nav-item {
					position: relative;
					width: 50%;
					float: left;
					border-bottom: 1px solid #91a6a5;
					text-align: center;
					margin: 0;
				}
				#pe-nav #nav-links .nav-wrapper div.nav-item a {
					display: block;
					font-size: 18px;
					height: auto;
					line-height: 25px;
					padding: 40px 0;
				}
				#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 #91a6a5;
					margin-top: 1em;
				}
				#pe-nav #nav-links .nav-wrapper div.nav-item:nth-child(even) {
					border-right: 1px solid #91a6a5;
				}
				#pe-nav #nav-links .nav-wrapper div.nav-item:last-child {
					border-bottom: none;
				}
				#pe-nav #nav-links .nav-wrapper .nav-item a {
					color: #fff;
					font-family: 'AvantGardeGothicITCW02Dm' , sans-serif;
				}
				#pe-nav #nav-links .nav-wrapper .nav-item a:hover {
					text-decoration: none;
				}
				
			/* footer */
				#pe-frame #pe-footer #copyright p {
					display: block; 
					margin-bottom: 24px; 
				}

				#pe-frame #pe-footer #footer_nav a {
					line-height: 1.5;
				}
				#pe-frame #pe-footer #footer_nav .footer_social-btns {
					display: block;
				}
				#pe-frame #pe-footer #footer_nav a.social-links {
					margin: 0 12px;
				}
		}
		@media only screen and (max-width: 767px) {
			/* Layout
			------------------------------------------------------ */
				/* navigation */
					#pe-nav #nav-links .nav-wrapper {
						padding: 20px 0 5px;
					}
					#pe-nav #nav-links .nav-wrapper .mobile-nav-header {
						padding: 0 15px;
					}
				/* userID */
					#pe-frame #pe-header #userID {
						padding-left: 20px;
					}
				/* content */
					html body #pe-frame #pe-content {
						padding: 0 20px; 
					}
					#user-access-note {
						padding: 0 20px; 
					}
				/* footer */
					#pe-frame #pe-footer #footer_nav .client_menu a {
						margin-right: 0;
						display: block;
						width: 50%;
						float: left;
						text-align: center;
					}
					
			/* inline validation
			------------------------------------------------------ */
				html .error-frame,
				html .validation-pass .form-input:before {
					top: auto;
					bottom: 4px;
					right: 4px; 
					transform: translateY(0px);
				}
				html .form-item-radio .error-frame {
					top: 36px; 
					bottom: auto; 
				}
				html .form-item-checkbox .error-frame,
				html #rules_er .error-frame, 
				html #recaptcha_response_field_er .error-frame {
					top: 4px; 
					bottom: auto; 
				}
				html .form-item-radio.validation-pass .form-input:before,
				html .form-item-checkbox.validation-pass .form-input:before,
				html #rules_er.validation-pass .form-input:before,
				html #recaptcha_response_field_er.validation-pass .form-input:before {
					top: 4px; 
					bottom: auto; 
				}
				#pe-content-wrap form.vertical .form-item-checkbox .form-input label {
					line-height: 1.5em !important;
				}
		}
		@media only screen and (max-width: 549px) {
			/* userID */
				#pe-frame #pe-header #userID span {
					display: block;
					margin-top: 0.875em;
				}
				#pe-frame #pe-footer #footer_nav a.social-links {
					margin: 0 4px;
				}
		}
		@media only screen and (max-width: 479px) {
			/* Layout
			------------------------------------------------------ */
				/*navigation*/
					#footer_nav_mobile .social_mobile a {
						margin: 0 1%;
					}

				/*footer*/
					#pe-frame #pe-footer #footer_nav a {
						font-size: 16px;
					}

			/* inline validation
			------------------------------------------------------ */
				html .error-frame,
				html .validation-pass .form-input:before {
					top: auto;
					bottom: 0px;
					transform: translateY(0px);
				}
				html .form-item-radio .error-frame {
					top: 24px; 
					bottom: auto; 
				}
				html .form-item-checkbox .error-frame,
				html #rules_er .error-frame, 
				html #recaptcha_response_field_er .error-frame {
					top: 0px; 
					bottom: auto; 
				}
				html .form-item-radio.validation-pass .form-input:before,
				html .form-item-checkbox.validation-pass .form-input:before,
				html #rules_er.validation-pass .form-input:before,
				html #recaptcha_response_field_er.validation-pass .form-input:before {
					top: 0px; 
					bottom: auto; 
				}
				#pe-frame .pe-form .form-item-radio .form-input,
				#pe-frame .pe-form .form-item-checkbox .form-input {
					padding-right: 32px !important
				}
		}
		@media only screen and (min-width: 480px) {
			/* inline validation
			------------------------------------------------------ */
				#pe-frame .pe-form .form-item-radio .form-input,
				#pe-frame .pe-form .form-item-checkbox .form-input {
					padding-right: 32px !important
				}
		}
		@media only screen and (min-width: 768px) {
			html body #pe-frame {
				max-width: 750px; 
			}

			/* inline validation
			------------------------------------------------------ */
				html .error-frame, 
				html .validation-pass .form-input:before {
					top: 4px;
					transform: translateY(0px);
				}
				#pe-content-wrap form.vertical .form-item-checkbox .form-input label {
					line-height: 1.5em !important;
				}
		}
		@media only screen and (min-width: 960px) {
			html body #pe-frame {
				max-width: 970px; 
			}

			/* navigation */
				#pe-nav {
					height: 86px; 
				}
				#menu-toggle,
				.mobile-nav-header {
					display: none !important; 
				}
				#pe-nav > div {
					float: left; 
					box-sizing: border-box;
					height: 86px; 
				}
				#pe-nav .client-logo a {
					margin: 0 auto; 
					padding: 0; 
				}
				#pe-nav #nav-links .nav-wrapper {
					width: 100%; 
					display: -webkit-box;
					display: -ms-flexbox;
					display: -webkit-flex;
					display:		 flex;
					-webkit-flex-flow: row nowrap;
							flex-flow: row nowrap;
					-webkit-align-items: center;
							align-items: center;
					-webkit-justify-content: flex-start;
					-ms-flex-pack: space-between;
							justify-content: space-between;
					padding-right: 2.5em;
				}
				#pe-nav #nav-links .nav-wrapper div {
					height: 86px; 
					line-height: 86px; 
				}
				#pe-nav #nav-links a {
					text-decoration: none; 
					display: inline-block; 
					height: 86px; 
					line-height: 86px; 
					padding: 0 10px; 
					position: relative; 
				}
				#pe-nav #nav-links .current a:after {
					display: block; 
					position: absolute; 
					top: 0; 
					left: 0; 
					width: 100%; 
					content: ' ';
					height: 9px;
				}
			/* userID */
				#pe-frame #pe-header #userID {
					padding-right: 0;
					text-align: right;
				}

			/* content */
				/*html body #pe-frame #pe-content {
					padding: 0 10%; 
				}*/
				#user-access-note {
					padding: 0 10%; 
				}
				#pe-content-wrap #pe-sidebar {
					padding: 0;
				}
				#pe-content-wrap #pe-sidebar,
				#pe-content-wrap #pe-content {
					width: 50%; 
					float: left; 
				}
				#pe-content-wrap #pe-sidebar img {
					width: 480px; 
					max-width: 75%;
				}
				#pe-content-wrap #pe-content {
					padding: 0 5% 0 0 !important; 
					clear: right; 
				}

			/* footer */
				#pe-frame #pe-footer #footer_nav {
					display: block; 
				}
				#pe-frame #pe-footer #copyright,
				#pe-frame #pe-footer #legal_links {
					padding: 0 10%; 
				}
				#pe-frame #pe-footer #copyright p {
					display: inline; 
					margin: 0 !important; 
				}
		}
		@media only screen and (min-width: 1200px) {
			html body #pe-frame {
				max-width: 1170px; 
			}
		}
		@media only screen and (min-width: 1281px) {
			html body #pe-frame {
				max-width: 1280px; 
			}
		}


/** =PAGES
------------------------------------------------------------------------------------------------ */

	/* {home}
	-------------------------------------------------------------- */
		#pe-frame .call-to-action {
			width: 50%;
			float: left;
			text-align: center;
			margin-bottom: 1.5em;
		}
		#pe-frame .call-to-action strong { 
			display: block;
			margin-bottom: 1em;
		}
	
	/* {enter picks}
	-------------------------------------------------------------- */
		.enter_picks #pe-content-wrap form.vertical .form-item .form-label,
		.enter_picks #pe-content-wrap form.vertical .form-item .form-input {
			width: 100%;
		}
		.enter_picks #pe-content-wrap form.vertical .form-item .form-label, 
		.enter_picks #pe-content-wrap form.vertical .form-item .form-input {
			float: none;
		}
		#pe-content-wrap form#game_form #userPIN_er,
		#pe-content-wrap form#game_form .form_button {			
			text-align: left;
			float: left;
		}
		#pe-content-wrap form#game_form #userPIN_er {
			width: 60%;
		}
		#pe-content-wrap form#game_form .form_button {
			width: 40%;
		}

		#pe-content-wrap form#game_form #userPIN_er input {
			font-size: 1em;
			line-height: 1.5em;
			padding: 0.5em;
			width: 400px;
			max-width: 95%;
		}
		#pe-frame .socials.prize_lv ul li a {
			padding: 0.5em 0.75em;
			color: #fff;
		}
		#pe-frame .socials.prize_lv ul li a.fb {
			background: #3b579d;
		}
		#pe-frame .socials.prize_lv ul li a.tw {
			background: #55acee;
		}
		#pe-frame .socials.prize_lv ul li i {
			margin-right: 0.5em;
			font-size: 1.5em;
		}
		#pe-frame .socials.prize_lv ul li a.tw .fa-twitter:before {
			color: #fff !important;
		}
		#pe-frame #winimg img {
			display: block; 
			width: 420px; 
			max-width: 70%;
			margin: 0 auto;
		}

	/* {help}
	-------------------------------------------------------------- */
		#pe-frame .content-button a {
			margin-bottom: 1em !important;
		}
		#pe-frame .content-button a:first-child {
			margin-right: 1em !important;			
		}

	/* {change email}
	-------------------------------------------------------------- */
		#form-field-change_email {
			margin-bottom: 1em;
		}

	/* {register} {profile}
	-------------------------------------------------------------- */
		.register #pe-content-wrap #pe-sidebar img,
		.profile #pe-content-wrap #pe-sidebar img {
			width: 280px;
			max-width: 40%;
		}
		#pe-frame #pe-content-wrap #birthdate_select select {
			width: 15% !important;
		}
		#pe-frame #pe-content-wrap #birthdate_select select:first-child {
			width: 25% !important;
		}
		#pe-frame #pe-content-wrap #birthdate_select select:last-child {
			width: 18% !important;
		}
		#pe-frame #recaptcha_response_field_er .form-label {
			display: none !important;
		}
		#pe-frame #recaptcha_response_field_er .form-input {
			width: 100% !important; 
		}

	/* {help} {rules} {portfolio}
	-------------------------------------------------------------- */
		.help #pe-content-wrap #pe-sidebar,
		.rules #pe-content-wrap #pe-sidebar,
		.portfolio #pe-content-wrap #pe-sidebar {
			display: none; 
		}
		.help #pe-content-wrap #pe-content,
		.rules #pe-content-wrap #pe-content,
		.portfolio #pe-content-wrap #pe-content {
			width: 100%; 
			float: none;
			padding: 0 10% !important;
		}

	/* {register} {profile} -------------------------------------- */
		.register #pe-content-wrap #pe-sidebar img, 
		.profile #pe-content-wrap #pe-sidebar img {
			width: 280px;
			max-width: 40%;
		}


	/* @media queries =PAGES ------------------------------------------------------------------- */
		@media only screen and (max-width: 959px) {
			#pe-content-wrap form#game_form {
				width: 100%;
			}
			/* {register} -------------------------------------------- */
				.desktop-links { display: none; }
		}
		@media only screen and (max-width: 767px) {
			/*#pe-content-wrap form.vertical .form-item .form-label label p { top: 0; left: 105%; }*/
		}
		@media only screen and (max-width: 479px) {
			/* {home} -------------------------------------------- */
				#pe-frame .call-to-action {
					width: 100%;
					float: none;
				}
			/* {register} -------------------------------------------- */
				#pe-frame .rCta,
				#rCta-frame {
					max-width: 250px;
				}
				#rc-imageselect, .g-recaptcha {
					transform:scale(0.77);
					-webkit-transform:scale(0.77);
					transform-origin:0 0;
					-webkit-transform-origin:0 0;
				}
			/* {enter picks} -------------------------------------------- */
				#pe-content-wrap form#game_form #userPIN_er,
				#pe-content-wrap form#game_form .form_button{
					width: 100%;
					text-align: center;
					float: none;
				}
			/* {portfolio} -------------------------------------------- */
				.portfolio table tbody td {
					word-break: break-all;
				}
		}
		@media only screen and (min-width: 480px) {
		}
		@media only screen and (min-width: 768px) {
			.register #pe-frame .pe-form #receive_promo_er,
			.profile #pe-frame .pe-form #receive_promo_er,
			.register #pe-frame .pe-form #rules_er,
			.profile #pe-frame .pe-form #rules_er,
			.register #pe-frame .pe-form #recaptcha_response_field_er,
			.profile #pe-frame .pe-form #recaptcha_response_field_er {
				margin-left: 40%; 
			}
			.register #pe-content-wrap form .form-button,
			.profile #pe-content-wrap form .form-button {
				text-align: center !important;
			}
		}
		@media only screen and (min-width: 960px) {
			
			/* {home} -------------------------------------------- */
				/*.home #pe-content-wrap #pe-sidebar {
					display: block; 
				}
				.home #pe-content-wrap #pe-sidebar,
				.home #pe-content-wrap #pe-content {
					width: 50%; 
					float: left; 
				}
				.home #pe-content-wrap #pe-sidebar img {
					width: 480px; 
					max-width: 75%;
				}
				.home #pe-content-wrap #pe-content {
					padding: 0 5% 0 0 !important; 
					clear: right; 
				}*/

			/* {register} -------------------------------------------- */
				.mobile-links { display: none; }

			/* {register} {profile} -------------------------------------------- */
				.register #pe-content-wrap,
				.profile #pe-content-wrap { 
					padding: 1em 0 2em !important; 
				}
				.register #pe-content-wrap #pe-sidebar,
				.profile #pe-content-wrap #pe-sidebar {
					float: none;
					width: 100%;
					text-align: center;
				}
				.register #pe-content-wrap #pe-content,
				.profile #pe-content-wrap #pe-content {
					width: 100%; 
					float: none;
					padding: 0 10% !important;
				}
			/* {register} {profile}  -------------------------------------------- */
				.register #pe-content-wrap #pe-sidebar, 
				.profile #pe-content-wrap #pe-sidebar {
					float: none;
					width: 100%;
					text-align: center;
				}
				.register #pe-content-wrap #pe-content, 
				.profile #pe-content-wrap #pe-content {
					float: none;
					width: 100%;
					padding: 0 10% !important;
				}
		}
		@media only screen and (min-width: 1200px) {
		}
		@media only screen and (min-width: 1281px) {
		}
 

/** =SURVEY TEMPLATE
------------------------------------------------------------------------------------------------ */
	/* {map_select}
	-------------------------------------------------------------- */

	/* {map_selected}
	-------------------------------------------------------------- */
		/* address block */
			#pe-frame #station_info {
			}
			#pe-frame #station_info h2 {
				font-size: 28px;
				line-height: 32px; 
				margin-bottom: 4px;
			}
			#pe-frame #station_info > div {
				height: 20px;
				line-height: 20px;
			}

		/* select items */
			.map_selected #pe-frame #pages {
				margin: 24px 0px 36px; 
			}
			.map_selected #pe-frame #pages > div {
				border-bottom: 1px solid #CCC;
			}
			.map_selected #pe-frame #pages > div a {
				display: block;
				position: relative; 
				padding-left: 36px; 
				color: #2b2b2b;
				background: #f3f3f3;
				cursor: pointer;
				text-decoration: none; 
			}
			.map_selected #pe-frame #pages > div a,
			.map_selected #pe-frame #pages > div a:before {
				height: 48px; 
				line-height: 48px;
			}
			.map_selected #pe-frame #pages > div.selected {
				border-bottom: 1px solid #5997ee;
			}
			.map_selected #pe-frame #pages > div.selected a {
				color: #FFF;
				background: #7aaaf5;
				font-weight: bold; 
			}
			.map_selected #pe-frame #pages > div a:before {
				position: absolute; 
				top: 0px; 
				left: 0px;
				width: 36px; 
				font-family: FontAwesome !important;
				font-style: normal !important;
				font-size: 18px; 
				text-transform: none !important;
				font-weight: normal !important;
				text-align: center;
			}
			.map_selected #pe-frame #pages > div a:before {
				content: '\f328';
				color: #CCC; 
			}
			.map_selected #pe-frame #pages > div.selected a:before {
				content: '\f46c';
				color: #FFF; 
			}

		/* button styles */
			#pe-frame #next_button .client.disabled,
			#pe-frame #next_button .client.disabled:hover {
				background-color: #CCC !important;
				border-color: #F5F5F5 !important;
				color: #fff !important;
			}

	/* {survey}
	-------------------------------------------------------------- */
		/* loading state */
			.survey #pages.loading {
				min-height: 64px; 
			}
			.survey #pages.loading:before,
			.survey #pages.loading:after {
				display: block; 
				position: absolute; 
				top: 0px; 
				left: 0px; 
				width: 100%; 
				height: 64px; 
				line-height: 64px; 
				text-align: center;
			}
			.survey #pages.loading:before {
				font-family: FontAwesome !important;
				font-style: normal !important;
				font-size: 32px; 
				text-transform: none !important;
				font-weight: normal !important;
				content: '\f013';
				color: #CCC; 
				-webkit-animation: loader 1.1s infinite linear;
				animation: loader 1.1s infinite linear;
			}
			.survey #pages.loading:after {
				content: 'Loading Survey';
				font-weight: normal !important;
				font-size: 12px !important; 
				text-shadow: white -1px 1px;
			}
			.survey #pages.loading .page,
			.survey #pages.loading #finish {
				display: none !important;
			}

		/* animations */
			@-webkit-keyframes loader {
				0% {
					-webkit-transform: rotate(0deg);
					transform: rotate(0deg);
				}
				100% {
					-webkit-transform: rotate(360deg);
					transform: rotate(360deg);
				}
			}
			@keyframes load8 {
				0% {
					-webkit-transform: rotate(0deg);
					transform: rotate(0deg);
				}
				100% {
					-webkit-transform: rotate(360deg);
					transform: rotate(360deg);
				}
			}

		/* pages and questions */
			.survey #pages {
				position: relative; 
			}
			.survey #pages .page {
				display: none;
			}
			.survey #pages .page.active {
				display: block;
			}
			.survey #pages .question {
				padding-bottom: 16px;
			}
			.survey #pages .next {
				margin-top: 32px !important; 
			}
			.survey #pages .form-item .form-label,
			.survey #pages .form-item .form-input {
				display: block !important;
				width: 100% !important;
				float: none !important;
			}

		/* button styles */
			#pe-frame #pages .client.disabled,
			#pe-frame #pages .client.disabled:hover {
				background-color: #CCC !important;
				border-color: #F5F5F5 !important;
				color: #fff !important;
			}

		/* contact popup */
			html #pe-frame .mfp-content {
				width: 600px;
				max-width: 100% !important;
				min-height: 240px;
				overflow-y: auto;
			}
			html #pe-frame .mfp-content > div {
				padding: 24px 24px;
			}
			html #pe-frame .mfp-content h3.popup-title {
				font-size: 18px;
				height: 48px; 
				line-height: 24px; 
				margin: -24px -24px 12px; 
				padding: 12px 24px; 
				background: #000000;
				color: #FFF;
				font-weight: bold;
			}
			html #pe-frame .mfp-content button.mfp-close {
				height: 48px;
				min-height: 48px;
				line-height: 48px;
				padding: 0px !important;
				margin: 0px !important;
				top: 0px !important;
				color: #FFF !important; 
			}

		/* form submitting */
		@media all and (max-width: 479px) {
			#pe-frame #finish {
				text-align: center; 
			}
			#pe-frame #finish .client {
				margin-bottom: 16px !important; 
			}
		}