/*@font-face {
    font-family: 'Barrio';
    src: url('../../fonts/barrio/barrio-regular.eot');
    src: url('../../fonts/barrio/barrio-regular.eot?#iefix') format('embedded-opentype'),
         url('../../fonts/barrio/barrio-regular.woff') format('woff'),
         url('../../fonts/barrio/barrio-regular.ttf') format('truetype'),
         url('../../fonts/barrio/barrio-regular.svg#barioregular') format('svg');
    font-weight: normal;
    font-style: normal;

}*/


/*=========================================================================================*/
/*=========================================================================================*/
.clearfix:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}
 
.clearfix {
    display: inline-block;
}
 
html[xmlns] .clearfix {
    display: block;
}
 
* html .clearfix {
    height: 1%;
}

#drivers-ed-container {
	font-size: 16px;
	text-rendering: geometricPrecision;
	-moz-text-rendering: geometricPrecision;
	-webkit-text-rendering: geometricPrecision;
	-ms-text-rendering: geometricPrecision;
	text-align: center;
    min-width: 320px;
	font-family: "Arial";
	background-color: #093e7f;
	
	background-image: url( '/quiz/images/earthquake-safety/bg-particles.png' );
	background-repeat: repeat;
}

#drivers-ed-container div { 
	position: relative;
}

#drivers-ed-container h1, 
#drivers-ed-container h2, 
#drivers-ed-container h3, 
#drivers-ed-container h4 {
	margin: 0;
	padding: 0;
	font-family: "Arial";
	position: relative;
    color: white;
    font-weight: 700 !important;
    float:none;
    margin:0 auto;
}

#drivers-ed-container .answers a {
	text-decoration: none;
}

#drivers-ed-container .answers a:focus .answer, 
#drivers-ed-container .answers a:hover .answer {
	/*outline: solid;*/
	border: 5px solid #f50002;
	background-color: transparent;
	color: #f50002;
	text-decoration: none;
}

#drivers-ed-container #retake .retake {
	text-decoration: underline;
}

#drivers-ed-container #retake:focus .retake, 
#drivers-ed-container #retake:hover .retake, .retake:hover {
	/*text-decoration: none;*/
	/*color: white;*/
	font-weight: bold;
}

#drivers-ed-container .share-copy-top,
#drivers-ed-container .share-copy{
	margin: 8px;
	display: inline-block;
	float: none;
	/*font-size: 0.625em;*/
	font-weight: bold;
	color: white;
}

#drivers-ed-container #share-copy{
	font-size: 0.625em;
}

#drivers-ed-container #share-copy-top{
	font-size: 0.9375em;
}

#drivers-ed-container .facebook-top, 
#drivers-ed-container .twitter-top, 
#drivers-ed-container .linkedin-top,
#drivers-ed-container .googleplus-top,
#drivers-ed-container .email-top,
#drivers-ed-container .facebook, 
#drivers-ed-container .twitter, 
#drivers-ed-container .linkedin,
#drivers-ed-container .googleplus,
#drivers-ed-container .email {
	width: 35px;
	height: 35px;
	margin: 6px;
	display: inline-block;
	float: none;
	/*background-size: contain;*/
}

#drivers-ed-container .facebook-top,
#drivers-ed-container .facebook {
	background-image: url( '/quiz/images/earthquake-safety/facebook.png' );
}

#drivers-ed-container .twitter-top,
#drivers-ed-container .twitter {
	background-image: url( '/quiz/images/earthquake-safety/twitter.png' );
}

#drivers-ed-container .linkedin-top,
#drivers-ed-container .linkedin {
	background-image: url( '/quiz/images/earthquake-safety/linkedin.png' );
}

#drivers-ed-container .googleplus-top,
#drivers-ed-container .googleplus {
	background-image: url( '/quiz/images/earthquake-safety/googleplus.png' );
}

#drivers-ed-container .email-top,
#drivers-ed-container .email {
	background-image: url( '/quiz/images/earthquake-safety/email.png' );
}
	
#drivers-ed-container .share :focus {
		outline: none;
		border: none;
	}

#drivers-ed-container #facebook-top:focus .facebook-top, 
#drivers-ed-container #facebook-top:hover .facebook-top,
#drivers-ed-container #facebook:focus .facebook, 
#drivers-ed-container #facebook:hover .facebook {
		background-image: url( '/quiz/images/earthquake-safety/facebook-hover.png' );
		outline: none;
		border: none;
	}

#drivers-ed-container #twitter-top:focus .twitter-top, 
#drivers-ed-container #twitter-top:hover .twitter-top,
#drivers-ed-container #twitter:focus .twitter, 
#drivers-ed-container #twitter:hover .twitter {
		background-image: url( '/quiz/images/earthquake-safety/twitter-hover.png' );
		outline: none;
		border: none;
	}

#drivers-ed-container #linkedin-top:focus .linkedin-top, 
#drivers-ed-container #linkedin-top:hover .linkedin-top,
#drivers-ed-container #linkedin:focus .linkedin, 
#drivers-ed-container #linkedin:hover .linkedin {
		background-image: url( '/quiz/images/earthquake-safety/linkedin-hover.png' );
		outline: none;
		border: none;
	}

#drivers-ed-container #googleplus-top:focus .googleplus-top, 
#drivers-ed-container #googleplus-top:hover .googleplus-top,
#drivers-ed-container #googleplus:focus .googleplus, 
#drivers-ed-container #googleplus:hover .googleplus {
		background-image: url( '/quiz/images/earthquake-safety/googleplus-hover.png' );
		outline: none;
		border: none;
	}

#drivers-ed-container #email-top:focus .email-top, 
#drivers-ed-container #email-top:hover .email-top,
#drivers-ed-container #email:focus .email, 
#drivers-ed-container #email:hover .email {
		background-image: url( '/quiz/images/earthquake-safety/email-hover.png' );
		outline: none;
		border: none;
	}		

/*=========================================================================================*/
/*=========================================================================================*/

#drivers-ed-container #content {
	width: 760px;
	display: inline-block;
	margin-top: 10px;
	float: none;
}

#drivers-ed-container #start-frame {
	margin-bottom: 24px;
	text-align: center;
	width: 668px;
	display: inline-block;
	float: none;
}

#drivers-ed-container #start-frame #headline-a,
#drivers-ed-container #start-frame #headline-b, 
#drivers-ed-container #start-frame h2, 
#drivers-ed-container #start-frame .icon {
		width: 100%
	}

#drivers-ed-container #start-frame .icon {
		text-align: center;
		color: white;
		font-size: 1.385em;
		line-height: 1.5em;
		font-weight: bold;
		margin-bottom: 9px;
		padding-top: 2px;
	}

#drivers-ed-container #start-frame h2 {
		font-size: 1.25em;
		line-height: 1.15em;
		color: #ffffff;
		letter-spacing: -.02em;
        font-weight: normal !important;
	}

#drivers-ed-container #start-frame #headline-a, 
#drivers-ed-container #start-frame #headline-b{
		color: #ffffff;
		font-size: 1.875em;
		/*font-size: 2.6em;*/
		text-align: center;
		font-weight: bold;
		letter-spacing: -.03em;
	}

#drivers-ed-container #start-frame #headline-a{
		margin-bottom: 10px;
}

#drivers-ed-container #start-frame #headline-b{
		margin-bottom: 18px;
}

#drivers-ed-container #start-frame #headline-image{
		left: 30px;
  		/*margin-bottom: -265px;*/
  		width: 100%;
  		height: 110px;

  	}

#drivers-ed-container .question, 
#drivers-ed-container #end-frame {
	width: 720px;
	text-align: center;
	color: white;
	margin-bottom: 15px;
	display: inline-block;
	float: none;
	overflow: hidden;
}

#drivers-ed-container .question{
	background-color: white;
}


#drivers-ed-container .question .icon, 
#drivers-ed-container .question h1, 
#drivers-ed-container .question .answers, 
#drivers-ed-container .question .tracker {
		width: 100%;
	}

#drivers-ed-container .question .icon {
		width: 200px;
		height: 60px;
		/*background-color: white;*/
		display: inline-block;
		float: none;
		margin: 50px 250px 30px 250px;
	}

#drivers-ed-container img.gif {
			height: 60px;
			width: auto;
			position: relative;
			top: -10px;
		}

#drivers-ed-container .question h1 {
		font-size: 2.8em;
		line-height: .9em;
		letter-spacing: -.04em;
		display: inline-block;
		width: 78%;
		color:#093e7f;
	}

#drivers-ed-container .question .answers {		
		margin-top: 50px;
		text-align: center;
		display: inline-block;
		float: none;
	}

#drivers-ed-container .question .two-answer-q{
		width: 380px;
	}
#drivers-ed-container .question .three-answer-q{
		width: 570px;
	}	

#drivers-ed-container .answers a .answer {
			background-color: #f50002;
			font-size: 1.54em;
			float: left;
			font-weight: bold;
			display: inline-block;
			margin: 0 5px 0 5px;
			width: 170px;
			height: 170px;
			color: white;
			text-align: left;
			line-height: 1em;
			letter-spacing: -.06em;
			border: 5px solid #f50002;
			text-decoration: none;
		}

#drivers-ed-container .question .answers .answer:hover {
				cursor: pointer;
			}

#drivers-ed-container .question .answers .answer .label {
				left: 10px;
				top: 10px;
				width: 90%;
			}

#drivers-ed-container .question .answers .answer-off, 
#drivers-ed-container .question .answers a:hover .answer-off {
				border: 5px solid #a50206;
				background-color: #a50206;
				color: #f50002;
			}

#drivers-ed-container .question .answers .answer-on, 
#drivers-ed-container .question .answers a:hover .answer-on {
				border: 5px solid #f50002;
				background-color: #f50002;
				color: white;
				text-decoration: none;
			}

#drivers-ed-container .question .tracker {
		margin-top: 80px;
		margin-bottom: 40px;
		text-align: center;
		font-weight: lighter;
		color: #bc0415;
	}

#drivers-ed-container .question .tracker span {
		/*color: white;*/
		font-weight: bold;
	}

#drivers-ed-container .question .tracker .mark {
			width: 16px;
			height: 16px;
			background-color: #a50206;
			/*margin: 0 -1px 0 0px;*/
			display: inline-block;
			float: none;
		}

#drivers-ed-container .question .tracker .on {
			background-color: white;
		}

#drivers-ed-container .cover {
		position: absolute;
		left: 0px;
		top: 0px;
		width: 100%;
		height: 100%;
		background-color: white;
		/*display: none;*/
		z-index: 10;

	}

#drivers-ed-container .cover .label {
			width: 100%;
			text-align: center;
			color: #0b4081;
			font-size: 9em;
			top: 50%;
			margin-top: -.6em;
			font-weight: bold;
			z-index: 16;
			position: absolute;
		}

#drivers-ed-container #end-frame .label {
			font-size: 5em;
		}

#drivers-ed-container #end-frame {
	margin-bottom: 28px;
	height: 640px;
	overflow: hidden;
	width: 720px;
}

#drivers-ed-container #end-frame .card {
		width: 720px;
		height: 100%;
	}

#drivers-ed-container #end-frame .cards {
		width: 5050px;
		height: 100%;
		overflow: hidden;
		position: absolute;
		left: 0px;
		top: 0px;
		visibility: hidden;
	}

#drivers-ed-container #end-frame .cards .card {
		float:left;
	}

#drivers-ed-container #end-frame .retake,
#drivers-ed-container #end-frame .result-image,
#drivers-ed-container #end-frame .share,
#drivers-ed-container #end-frame .message,
#drivers-ed-container #end-frame .tracker,
#drivers-ed-container #end-frame .tracker-message,
#drivers-ed-container #end-frame .hash {
		width: 100%;
	}

#drivers-ed-container #end-frame .retake, 
#drivers-ed-container #end-frame .return-results {
		text-align: right;
		font-size: 1.01em;
		margin-bottom: 80px;
		/*color: #89080b;*/
		font-weight: 700;
		color:white;
		right: 15px;
		margin-top: 15px;
		z-index: 9;
	}

#drivers-ed-container #end-frame .return-results {
			width: 720px;
			text-decoration: underline;
		}

#drivers-ed-container #end-frame .retake:hover, 
#drivers-ed-container #end-frame .return-results:hover {
			text-decoration: none;
			cursor: pointer;
			/*color: white;*/
			font-weight: bold;
			/*letter-spacing: -.01em;*/
		}

#drivers-ed-container #end-frame .retake img, 
#drivers-ed-container #end-frame .return-results img {
			margin-left: 4px;
		}

#drivers-ed-container #end-frame .return-results {
			position: absolute;
			top: 0px;
		}

#drivers-ed-container #back-results {
			display: none;
			text-decoration: underline;
		}

#drivers-ed-container #end-frame .result-image {
		left: 96px;
		margin-bottom: -290px;
		margin-top: -50px;
	}

#drivers-ed-container #end-frame .count {
			letter-spacing: .2em;
			font-size: .8em;
			position: absolute;
			left: 245px;
			top: 145px;
			color: #f50002;
			text-align: center;
			width: 40px;
		}

#drivers-ed-container #end-frame .share {
		font-size: 1.5em;
		/*margin-bottom: 17px;*/
		margin-top: 23px;
		width: 100%;
	}
#drivers-ed-container #start-frame .share {
		/*margin-bottom: 17px;*/
		margin-top: 5px;
		width: 100%;
	}	

#drivers-ed-container #start-frame .share img,
#drivers-ed-container #end-frame .share img {
			margin: 8px;
		}

#drivers-ed-container .facebook-top, .twitter-top, .linkedin-top, .googleplus-top, .email-top,
#drivers-ed-container .facebook, .twitter, .linkedin, .googleplus, .email {
			top: 12px;
		}
#drivers-ed-container .facebook, .twitter, .linkedin, .googleplus, .email {
			opacity: 0;
		}

#drivers-ed-container .share-copy-top,
#drivers-ed-container .share-copy{
			top: -6px;
		}

#drivers-ed-container .share-copy{
			opacity: 0;
		}

#drivers-ed-container .tracker-message {
			opacity: 0;
			bottom: 110px;
		}

#drivers-ed-container #end-frame h1 {
		font-size: 2.25em;
		/*font-weight: bold;*/
		line-height: .8em;
		/*margin-bottom: 30px;*/
		letter-spacing: -.03em;
		margin: 0px auto 4px auto;
		
	}

#drivers-ed-container #end-frame h2 {
			font-size: 1.4em;
			font-weight: normal !important;
			letter-spacing: 0em;
			width: 75%;
			margin-top: 5px;
			margin-bottom: 3px;
			opacity: 0;
		}

#drivers-ed-container #end-frame .tracker-message {
		font-size: 1.5em;
		font-weight: bold;
		margin-bottom: 8px;
		position: absolute;
		bottom: 120px;
	}

#drivers-ed-container #end-frame .tracker {
		/*margin-top: 5px;
		margin-bottom: 44px;*/
		text-align: center;
		position: absolute;
        left:0;
        right:0;
        bottom: 10%;
	}

#drivers-ed-container #end-frame .tracker .mark {
			width: 35px;
			height: 35px;
			/*background-color: white;*/
			background-color: transparent;
			display: inline-block;
			margin: 0 1px 0 1px;
			float: none;
		}

#drivers-ed-container #end-frame .tracker .mark .bg {
			width: 35px;
			height: 35px;
			position: absolute;
			left: 0px;
			top: 0px;
			opacity: 0;
		}

#drivers-ed-container #end-frame .tracker .mark .bg {
				background-color: white;
			}

#drivers-ed-container #end-frame .tracker .marker-wrong .bg {
				width: 31px;
  				height: 31px;
				background-color: #093e7f;
				border: 2px solid white;
			}

#drivers-ed-container #end-frame .tracker .mark:hover {
				cursor: pointer;
			}

#drivers-ed-container #end-frame .tracker .mark .indicator/*, 
#drivers-ed-container #end-frame .tracker .mark .hover*/ {
			width: 35px;
			height: 3px;
			background-color: white;
			position: absolute;
			left: 0px;
			bottom: -7px;
			display: none;
		}

#drivers-ed-container #end-frame .tracker a:hover .mark .hover {
			display: block;
		}

#drivers-ed-container #end-frame .tracker .mark img {
			top: 9px;
			top: 30px;
			position: relative;
			z-index: 8;
			opacity: 0;
		}

#drivers-ed-container #end-frame .tracker .marker-wrong {
			/*background-color: #9e0206;*/
		}

#drivers-ed-container #end-frame .tracker a.mark-link {
    display: inline-block;
}

#drivers-ed-container #end-frame .hash {
		font-size: 1.579375em;
		font-weight: bold;
		/*margin-bottom: 15px;*/
		position: absolute;
		bottom: 15px;
	}

#drivers-ed-container #next-arrow, 
#drivers-ed-container #prev-arrow {
		width: 24px;
		height: 59px;
		margin-top: -30px;
		top: 196px;
		position: absolute;
	}

#drivers-ed-container #next-arrow:hover, 
#drivers-ed-container #prev-arrow:hover {
		cursor: pointer;
	}

#drivers-ed-container #next-arrow {
		background-image: url( '/quiz/images/earthquake-safety/next-arrow.png' );
		right: 30px;
		right: -30px;
	}

#drivers-ed-container #prev-arrow {
		background-image: url( '/quiz/images/earthquake-safety/prev-arrow.png' );
		left: 30px;
		left: -30px;
	}



#drivers-ed-container #end-frame .icon,
#drivers-ed-container #end-frame h1 {
		width: 100%;
	}

#drivers-ed-container #end-frame .card .icon {
		height: 96px;
		margin-top: 67px;
	}

#drivers-ed-container #end-frame .card h1 {
		font-size: 2.25em;
		/*font-weight: bold;*/
		line-height: .8em;
		margin-bottom: 30px;
		letter-spacing: -.03em;
		margin: 20px auto 6px auto;
	}

#drivers-ed-container #end-frame .cards .card h1 {
		font-size: 2.7em;
		font-weight: bold;
		letter-spacing: -.05em;
		line-height: .95em;
		top: -30px;
		width: 80%;
		display: inline-block;
		float: none;
	}

#drivers-ed-container #end-frame .info {
		width: 570px;
		display: inline-block;
		float: none;
		position: absolute;
		top: 328px;
		left: 50%;
		margin-left: -285px;
	}

#drivers-ed-container #end-frame .info .answer {
			height: inherit;
			width: 124px;
			float: left;
			margin-right: 10px;
		}

#drivers-ed-container #end-frame .info .answer div {
				float: left;
			}

#drivers-ed-container #end-frame .info .answer .label {
					font-size: 0.71em;
					letter-spacing: 0;
					top: -3px;
					color: white;
				}

#drivers-ed-container #end-frame .info .answer .square {
					width: 104px;
					height: 104px;
					background-color: #f50002;
					color: white;
					padding: 10px;
					text-align: left;
					font-weight: bold;
					letter-spacing: -.03em;
					margin-top: 3px;
				}

#drivers-ed-container #end-frame .info .answer .square-wrong {
					width: 96px;
  					height: 96px;
					background-color: #0a3f80;
					border: 4px solid white;
					color: white;
				}

#drivers-ed-container #end-frame .info .answer .mark {
					width: 13px;
					height: 12px;
					position: absolute;
					bottom: 8px;
					right: 8px;
				}

#drivers-ed-container #end-frame .info .answer .mark.wrong {
						background-image: url( '/quiz/images/earthquake-safety/wrong-small.png' );
					}

#drivers-ed-container #end-frame .info .answer .mark.right {
						background-image: url( '/quiz/images/earthquake-safety/right-small.png' );
					}

#drivers-ed-container #end-frame .info .blurb {
				width: 290px;
				float: left;
				margin-left: 10px;
				height: 124px;
				margin-top: 15px;
				/*background-color: white;*/
			}

#drivers-ed-container #end-frame .info .blurb .text, 
#drivers-ed-container #end-frame .info .blurb .buttons {
					width: 100%;
					float: left;
				}

#drivers-ed-container #end-frame .info .blurb .text {
					height: 96px;
					text-align: left;
					font-size: 0.935625em;
				}

#drivers-ed-container #end-frame .info .blurb .buttons {
				text-align: left;
				top: 12px;
				float:none;
			}

#drivers-ed-container #end-frame .info .blurb .buttons a, 
#drivers-ed-container #end-frame .info .blurb .buttons a:visited {
				font-size: .94em;
				text-decoration: underline;
				/*color: #89080b;*/
				color: white;
				font-weight:700;
				margin-top: 10px;
				letter-spacing: -.02em;
				margin-right: 2px;

			}

#drivers-ed-container #end-frame .info .blurb .buttons img {
					position: relative;
					top: 1px;
				}

#drivers-ed-container #end-frame .info .blurb .buttons a:hover {
					text-decoration: none;
					opacity: .9;
					/*color: white;*/
					/*font-weight: bold;*/
					/*letter-spacing: -.05em;*/
				}

#drivers-ed-container #end-frame .info .blurb .buttons div {
				float: left;
			}

#drivers-ed-container #btn-learn-more {
					width: 109px;
					height: 29px;
					background-image: url( '/quiz/images/earthquake-safety/btn-learn-more.png' );
					margin-right: 5px;
				}

#drivers-ed-container #btn-share {
					width: 152px;
					height: 29px;
					background-image: url( '/quiz/images/earthquake-safety/btn-share.png' );
				}

#drivers-ed-container #noscript-msg {
	width: 100%;
	height: 200px;
	background-color: #f50002;
	color: white;
	padding-top: 80px;
	font-size: .8em;
}

#drivers-ed-container #noscript-msg a, #noscript-msg a:visited {
		color: white;
	}

#drivers-ed-container #noscript-msg a:hover {
		color: black;
	}

#drivers-ed-container #more-info-box {
	width: 720px;
	display: inline-block;
	float: none;
	padding: 35px 0px 40px;
	margin-bottom: 34px;
	background-color: #ffffff;
	/*font-size: 0.8125em;*/
	/*line-height: 1.3em;*/
}

#drivers-ed-container #more-info-box h1, #more-info-box h2 {
	color: #f50002;
	font-weight: bold;
}

#drivers-ed-container #more-info-box h1{
	font-size: 2em;
	letter-spacing: -.06em;
}

#drivers-ed-container #more-info-box h2{
	font-size: 1.25em;
	letter-spacing: -.06em;
}

#drivers-ed-container #more-info-box #more-info-box-cta{
	width: 196px;
	height: 22px;
	display: inline-block;
	background-color: #000000;
	color: white;
	font-weight: bold;
	margin: 22px auto -20px;
	font-size: 0.980625em;
	padding-top: 7px;
}
#drivers-ed-container #more-info-box #more-info-box-cta img{
	padding-left:  8px;
}

#drivers-ed-container #disclaimer {
	width: 720px;
	display: inline-block;
	float: none;
	padding-bottom: 34px;
	color: #ffffff;
	font-size: 0.8125em;
	line-height: 1.3em;
}

#drivers-ed-container #references {
	width: 720px;
	display: inline-block;
	float: none;
	color: #ffffff;
	font-size: 0.8125em;
	line-height: 1.3em;
	text-align: left;
	padding-bottom: 100px;

	/*Fix for Long URLS creating horizontal scroll*/
	-ms-word-break: break-all;
    /* Be VERY careful with this, breaks normal words wh_erever */
    word-break: break-all;
    /* Non standard for webkit */
    word-break: break-word;
	-webkit-hyphens: auto;
   	-moz-hyphens: auto;
    hyphens: auto;
}

#drivers-ed-container #references #references-title{
	font-weight: bold;
}

#drivers-ed-container #references li{
	color: white;
	margin-bottom: 12px;
	list-style-type: none;
}

#drivers-ed-container #references-links a{
	color: white;
	cursor: pointer;
	text-decoration: underline;
}

#drivers-ed-container #references-links a:focus, 
#drivers-ed-container #references-links a:hover{
	color: white;
	cursor: pointer;
	text-decoration: none;
}

@media screen and (max-width: 767px ) {
    #drivers-ed-container #end-frame .count {
        left: 26.5%;
    }

    #drivers-ed-container #content {
		width: 100%;
	}

    #drivers-ed-container #disclaimer {
		width: 90%;
        margin:0 auto;
	}

	#drivers-ed-container #references{
		width: 90%;
	}

	#drivers-ed-container #more-info-box{
		width: 100%;        	
	}

    #drivers-ed-container #start-frame {
        width: 90%;
        margin:0 auto 20px;
    }



    #drivers-ed-container .question, 
    #drivers-ed-container #end-frame {
        width: 100%;
    }

    #drivers-ed-container .question .icon {
        margin:0;
        padding:25px 0 15px;
    }

    #drivers-ed-container #start-frame .icon {
        margin-bottom: 12px;
    }

    #drivers-ed-container #start-frame #headline-a ,
    #drivers-ed-container #start-frame #headline-b{
        font-size: 1.8em;
    }

    #drivers-ed-container #start-frame #headline-image{
  		height: 102px;
  	}

    #drivers-ed-container #start-frame h2 {
        font-size: 1em;
    }

    #drivers-ed-container #end-frame .card {
        width:100%;
        float:left;
    }
    #drivers-ed-container #end-frame .card h1 {
        font-size: 1.8em;
        line-height: 1.05em;
        width: 90%;
        float:none;
    }

    #drivers-ed-container #end-frame .share {
        width: 100%;
        margin:0 auto;
    }

    #drivers-ed-container #end-frame .tracker-message {
        font-size: 1.1em;
        bottom: 22%;
        width: 100%;
        margin: 0 auto;
        padding: 0 5%;
    }

    #drivers-ed-container #end-frame h2 {
        font-size: 1.1em;
        width: 90%;
        margin: 0 auto;
        float:none;
    }

    #drivers-ed-container .question .tracker {
        margin-top: 80px;
        margin-bottom: 20px;
    }

    #drivers-ed-container .question .answers {
        width: 90%;
        padding-top: 30px;
        display: block;
        overflow: visible;
    }

    #drivers-ed-container .question .two-answer-q{
        margin: 0 21.5%;
    }

    #drivers-ed-container .question .three-answer-q{
    	margin: 0 auto;
    }
    
    #drivers-ed-container .answers a {
        display: block;
        cursor: pointer;
    }

    #drivers-ed-container .answers a .answer {
        font-size: 1.3em;
        height: 110px;
        width: 29%;
        margin: 0 .8%;
    }

    #drivers-ed-container .question .answers .answer .label {
        left: 0;
        top:0;
        padding: 5%;
        width: 90%;
    }

    #drivers-ed-container #end-frame .label {
        font-size: 3.8em;
    }

    #drivers-ed-container #end-frame .card .info {
        width: 90%;
        position: relative;
        top: 0;
        left: 0;
        margin-left:0;
    }

    #drivers-ed-container #end-frame .cards .card h1 {
        font-size: 1.8em;
    }

    #drivers-ed-container #end-frame .info .blurb {
        width: 90%;
        margin: 15px auto 0;
    }

    #drivers-ed-container #end-frame {
        height: 680px;
    }

    #drivers-ed-container #end-frame .info .blurb .text {
        height: auto;
        font-size: .8em;
    }

    #drivers-ed-container #end-frame .tracker {
        bottom: 9.5%;
    }

}

@media only screen 
    and (min-device-width : 414px) 
    and (max-device-width : 736px) 
    and (orientation : landscape) 
    and (-webkit-min-device-pixel-ratio : 3){
        #drivers-ed-container #end-frame .count {
            left: 34.5%;
        }

        #drivers-ed-container #end-frame .info .blurb {
            width:56%;
        }

        #drivers-ed-container #end-frame .tracker {
            bottom: 26.5%;
        }
}

@media only screen 
    and (min-device-width : 414px) 
    and (max-device-width : 736px) 
    and (orientation : portrait) 
    and (-webkit-min-device-pixel-ratio : 3){
        .#drivers-ed-container #end-frame .count {
            top: 27.6%;
            left: 27%;
        }
        #drivers-ed-container #end-frame #card-home .tracker-message {
            bottom: 19% !important;
        }
}

/*GALAXY S5*/
@media only screen and (min-width:620px) and (max-width: 640px) {
	 #drivers-ed-container #end-frame .count {
        left: 32%;
        top: 27.8%;
    }
}

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

	#drivers-ed-container #start-frame #headline-image{
		height: 95px;
		width: 97%;
  	}

    #drivers-ed-container .question .answers {
        width: 80%;
    }

    #drivers-ed-container .question .two-answer-q{
        margin: 0 auto;
    }

    #drivers-ed-container .question .three-answer-q{
    	margin: 0 auto;
    }

    #drivers-ed-container .answers a .answer {
        width: 95%;
        margin-bottom: 15px;
        float:none;
        height:80px;
    }

    #drivers-ed-container .question h1 {
        font-size: 1.7em;
    }

    #drivers-ed-container #end-frame .count {
        /*left: 27.5%;*/
        top: 27.8%;
    }

    #drivers-ed-container #end-frame .card h1 {
        margin-top:5%;
    }

    #drivers-ed-container #end-frame .cards .card h1 {
        font-size: 1.6em;
        width: 72%;
    }

    #drivers-ed-container #end-frame .info .blurb .buttons a, #drivers-ed-container #end-frame .info .blurb .buttons a:visited {
        font-size: .8em;
    }

    #drivers-ed-container #end-frame .info .answer .square {
        height:90px;
    }
    #drivers-ed-container #end-frame .info .answer .square-wrong{
    	height: 82px;
    }

}

/*Nokia Lumia 1020*/
@media only screen and (min-width:460px) and (max-width: 480px) {
	 #drivers-ed-container #end-frame .count {
        left: 27.5%;
    }
}

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

	#drivers-ed-container #start-frame #headline-image{
		height: 65px;
  	}

    #drivers-ed-container #end-frame #card-home h1 {
          margin-top: 27.5%; /*25%*/
    }
    #drivers-ed-container #end-frame .result-image {
        left: 18%;
    }
    #drivers-ed-container #end-frame #card-home .tracker-message {
        bottom: 20% !important; /*25%*/
    }
    #drivers-ed-container #end-frame .tracker {
        bottom: 12%;
    }
    #drivers-ed-container #end-frame .count {
        top:27.8%;
    }
}

@media screen and (max-width: 380px) {
	#drivers-ed-container #start-frame #headline-image{
		height: 50px;
		width: 93%;
  	}

    #drivers-ed-container #end-frame .count {
        left: 26%;
    }

    #drivers-ed-container #share-copy-top {
  		display: block;
  		margin-bottom: -10px;
  		margin-top: 20px;
	}

	#drivers-ed-container #share-copy {
	    display: block;
  		margin-bottom: -10px;
  		margin-top: 40px;
	}
}

/*iPhone 6*/
@media only screen 
    and (min-device-width : 375px) 
    and (max-device-width : 667px) 
    and (orientation : portrait) 
    and (-webkit-min-device-pixel-ratio : 2){

        #drivers-ed-container #end-frame #card-home .tracker-message {
            bottom: 18.5% !important;
            font-size: 1em;
        }
}

/*iPhone 6+*/
@media only screen 
    and (min-device-width : 414px) 
    and (max-device-width : 736px) 
    and (orientation : portrait) 
    and (-webkit-min-device-pixel-ratio : 3) {
        #drivers-ed-container #end-frame .count {
            left: 27.5%;
            top:27.4%;
        }
}

@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { 
    #drivers-ed-container .facebook-top,
	#drivers-ed-container .facebook {
		background-image: url( '/quiz/images/earthquake-safety/facebook-2x.png' );
		background-repeat:no-repeat;
    	background-size:100%;
	}
	#drivers-ed-container #facebook-top:focus .facebook-top, 
	#drivers-ed-container #facebook-top:hover .facebook-top,
	#drivers-ed-container #facebook:focus .facebook, 
	#drivers-ed-container #facebook:hover .facebook {
		background-image: url( '/quiz/images/earthquake-safety/facebook-hover-2x.png' );
		background-repeat:no-repeat;
    	background-size:100%;
		outline: none;
		border: none;
	}


    #drivers-ed-container .twitter-top,
	#drivers-ed-container .twitter {
		background-image: url( '/quiz/images/earthquake-safety/twitter-2x.png' );
		background-repeat:no-repeat;
    	background-size:100%;
	}
	#drivers-ed-container #twitter-top:focus .twitter-top, 
	#drivers-ed-container #twitter-top:hover .twitter-top,
	#drivers-ed-container #twitter:focus .twitter, 
	#drivers-ed-container #twitter:hover .twitter {
		background-image: url( '/quiz/images/earthquake-safety/twitter-hover-2x.png' );
		background-repeat:no-repeat;
    	background-size:100%;
		outline: none;
		border: none;
	}


    #drivers-ed-container .linkedin-top,
	#drivers-ed-container .linkedin {
		background-image: url( '/quiz/images/earthquake-safety/linkedin-2x.png' );
		background-repeat:no-repeat;
    	background-size:100%;
	}
	#drivers-ed-container #linkedin-top:focus .linkedin-top, 
	#drivers-ed-container #linkedin-top:hover .linkedin-top,
	#drivers-ed-container #linkedin:focus .linkedin, 
	#drivers-ed-container #linkedin:hover .linkedin {
		background-image: url( '/quiz/images/earthquake-safety/linkedin-hover-2x.png' );
		background-repeat:no-repeat;
    	background-size:100%;
		outline: none;
		border: none;
	}


    #drivers-ed-container .googleplus-top,
	#drivers-ed-container .googleplus {
		background-image: url( '/quiz/images/earthquake-safety/googleplus-2x.png' );
		background-repeat:no-repeat;
    	background-size:100%;
	}
	#drivers-ed-container #googleplus-top:focus .googleplus-top, 
	#drivers-ed-container #googleplus-top:hover .googleplus-top,
	#drivers-ed-container #googleplus:focus .googleplus, 
	#drivers-ed-container #googleplus:hover .googleplus {
		background-image: url( '/quiz/images/earthquake-safety/googleplus-hover-2x.png' );
		background-repeat:no-repeat;
    	background-size:100%;
		outline: none;
		border: none;
	}



    #drivers-ed-container .email-top,
	#drivers-ed-container .email {
		background-image: url( '/quiz/images/earthquake-safety/email-2x.png' );
		background-repeat:no-repeat;
    	background-size:100%;
	}
	#drivers-ed-container #email-top:focus .email-top, 
	#drivers-ed-container #email-top:hover .email-top,
	#drivers-ed-container #email:focus .email, 
	#drivers-ed-container #email:hover .email {
		background-image: url( '/quiz/images/earthquake-safety/email-hover-2x.png' );
		background-repeat:no-repeat;
    	background-size:100%;
		outline: none;
		border: none;
	}
}
section[role=main] {
	padding: 0;
}
.share a {
	background: none;
}
.share .facebook, .share .twitter, .share .linkedin, .share .facebook:hover, .share .twitter:hover, .share .linkedin:hover{
	background-position: 0 !important; /* Would prefer not to use !important, but the styling from main.min.css are very strict and 'deep' and it was easier to just add important here */ 
}
#hdr-search-wrapper #hdr-search #search-box{
	background: white !important;
}
@media screen and (min-width: 635px ) and (max-width: 767px ) {
    #drivers-ed-container #end-frame .count {
        left: 29.5%;
    }
}