@font-face {
    font-family: 'Roboto';
    src: url('../media/global/fonts/Roboto-Regular.ttf');
    font-weight: regular;
    font-style: regular;
}
html {
	height:100%;
	padding: 0;
	max-width: 1024px;
	max-height: 672px;
	width: 1024px;
	height: 672px;
  	margin: 0 auto;
  	position:relative;
 	background-color: white;
}
body{
	-webkit-tap-highlight-color: rgba(0,0,0,0);
	margin: 0 auto;	
	height:100%;
	max-width: 1024px;
	max-height: 672px;
	padding: 0;
	position:relative;
	scroll: no;
}
#scrollTest{
	position:relative;
}

a { border: 0; outline: 0;}
a:hover { border: 0; }
a:selected { border: 0; }
a:focus{ outline:0; }
#contentBG { 
	position: relative;
	margin: 0 auto;
}
#contentBGGraphic {
	display: block;
	background:url(../media/global/images/Background.png);
	background-repeat: no-repeat;
	position:relative;
	margin: 0 auto;
    background-size: 1024px 672px;
	width: 1024px;
	height: 672px;
}
#content{ 
	position: absolute; 
	top: 66px; 
	left: 0; 
	height: 539px; 
	width: 1024px; 
}

img { border: none; }

.button {   
	cursor: pointer;
	background-image: url(../media/global/images/blank_image.gif);
}

#splash { 
        position:absolute;
        width: 60px;
        height: 60px;
        top: 2px;
        left: 8px;
}
#mainMenuButton{ 
	background: url(../media/global/images/menu.png); 
	background-repeat: no-repeat;
	background-size: 40px 40px;
	width: 40px; height: 40px; 
	position: absolute; 
	top: 0px; 
	left: 20px;  
}


#titleM {
	font-family: 'Roboto';
	font-style:regular;
	font-size: 16px;
	line-height: 46px;
	color: #ffffff;
	position:absolute;
	top: 28px;
	left: 73px;
	width: 900px;
}
#screenCount{
	position:absolute;
	left:222px;
	bottom: 40px;
	color: #333333;
	font-family: 'Roboto';
	font-style:regular;
	font-size:18px;
}



/************  Audio Scrubber *************/
#audioBG {
	position:absolute;
	background-size: 368px 10px;
	width:375px;
	height:10px;
	left:356px;
	bottom: 44px;
	background:url(../media/global/images/scrubberBG.png);
}
#audioScrub {
	position:absolute;
	height:8px;
	top:0px;
	left:0px;
	background:url(../media/global/images/scrubber.png);
}
#audioScrubTouch {
	position:relative;
	width:300px;
	height:40px;
	bottom: 10px;
	z-index:1;
}
#scrubberCover {
	position:absolute;
	width:382px;
	height:14px;
	left:352px;
	bottom: 42px;
	z-index: 2;
/**/	background: rgba(0, 0, 124, 0);
}
#disclaimer { 
	font-family: 'Roboto';
	font-size: 10px;
	line-height: 12px;
	color: #7b7c7f;
	position: absolute;
	bottom: 18px;
	left:145px;
}
#popupReturn{
	display:inherit;
	background:url(../media/global/images/Restart.png);
	width:1024px;
	height:768px;
	position:absolute;
	top:0px;
	left:0px;
	z-index: 998;
}
#topBar {
	background-repeat: no-repeat;
	background-size: 1024px 61px;
	width: 1024px;
	height: 66px;
}
#bottomBar {	
	position: absolute; 
	bottom: 0px; 
	background-size: 1024px 61px;
	width: 1024px;
	height: 60px;
}


#backButton { /* Rewind */
	position:absolute;
	background-size: 40px 40px;
	width: 40px;
	height: 40px;
	bottom:21px;
	left:819px;
	display:none;
}
#playPauseButton.pause {
	background:url(../media/global/images/btn_pause.png);
	background-repeat: no-repeat;
	position:absolute;
	background-size: 40px 40px;
	width: 40px;
	height: 40px;
	bottom:21px;
	left:866px;
	display:none;
}
#playPauseButton.pause.off{
	background:url(../media/global/images/btn_pause_off.png);
	background-repeat: no-repeat;
	position:absolute;
	background-size: 40px 40px;
	width: 40px;
	height: 40px;
	bottom:21px;
	left:866px;
	display:none;
}
#playPauseButton.play {
	background:url(../media/global/images/btn_play.png);
	background-repeat: no-repeat;
	position:absolute;
	background-size: 40px 40px;
	width: 40px;
	height: 40px;
	bottom:21px;
	left:866px;
	display:none;
}
#playPauseButton.play.off {
	background:url(../media/global/images/btn_play_off.png);
	background-repeat: no-repeat;
	position:absolute;
	background-size: 40px 40px;
	width: 40px;
	height: 40px;
	bottom:21px;
	left:866px;
	display:none;
}
#refreshButton { 
	background:url(../media/global/images/btn_refresh.png);
	background-repeat: no-repeat;
	position:absolute;
	background-size: 40px 40px;
	width: 40px;
	height: 40px;
	bottom:21px;
	left:915px;
	display:none;
}
#refreshButton.off {  
	background:url(../media/global/images/btn_refresh_off.png);
	background-repeat: no-repeat;
	position:absolute;
	background-size: 40px 40px;
	width: 40px;
	height: 40px;
	bottom:21px;
	left:915px; 
	display:none;
}
#forwardButton {  /* Forward */
	background:url(../media/global/images/btn_next.png);
	background-repeat: no-repeat;
	position:absolute;
	background-size: 40px 40px;
	width: 40px;
	height: 40px;
	bottom:21px;
	left:963px;
	display:none; 
}

#nextCover { /*   Forward */
	background:url(../media/global/images/btn_next_off.png);
	background-repeat: no-repeat;
	position:absolute;
	background-size: 40px 40px;
	width: 40px;
	height: 40px;
	bottom:21px;
	left:963px;
	display:none;
}




/******FLIP CARD CSS STYLE RULES *********/

.flip {
  -webkit-perspective: 800;
   width: 1024px;
   height: 672px;
   position: relative;
}
.flip .card.flipped {
  -webkit-transform: rotatey(-180deg);
}
.flip .card {
  width: 1024px;
  height: 651px;
  -webkit-transform-style: preserve-3d;
  -webkit-transition: 0.5s;
}
.flip .card .face {
  width: 1024px;
  height: 651px;
  position: absolute;
  -webkit-backface-visibility: hidden ;
  z-index: 2;
    font-family: Georgia;
    font-size: 3em;
    text-align: center;
    line-height: 200px;
}
.flip .card .front {
  position: absolute;
  top: 0px;
  z-index: 1;
    color: white;
    cursor: pointer;
}
.flip .card .back {
  -webkit-transform: rotatey(-180deg);
  position: absolute;
  top: 0px;
    color: black;
    cursor: pointer;
}
#cover {
	position:absolute; top:0px; left: 0px; width:1024px; height:672px; background:url(../media/global/popups/flashCard/Cover.png);
}
#help {
	width: 1024px;
	height: 672px;
}
/*** assessments and progress checks ****/
#result_img { 
	background-size: 1024px 651px;
	width: 1024px;
	height: 651px;
}

#resultsCover {	
	background-color:  rgba(123, 124, 127, 0.8);
	width: 1024px;
	height:768px;
}
#popWindow img {
	position: absolute;
	top: 78px
	left: 0px;	
	width: 1024px;
	height:651px;
}
/************ checkboxes  **********/
.checkBox.checkCircle img {
background:url(../media/global/images/check.png);
background-repeat: no-repeat;
width:100%;
height:100%;
}
.checkBox.checkMark img {
background:url(../media/global/images/checkMark.png);
background-repeat: no-repeat;
width:100%;
height:100%;
}
.checkBox.checkBigBox img {
background:url(../media/screens/M1L6S07/checkBox.png);
background-repeat: no-repeat;
background-size: 262px 364px; 
width:262px; 
height:364px;
}
/**** pop-ups ***********/

/**/#pop1_container {
	top: 61px !important;
	height: 651px !important;
}
#pop2_container {
	top: 61px !important;
	height: 651px !important;
}
#pop3_container {
	top: 61px !important;
	height: 651px !important;
}
#pop4_container {
	top: 61px !important;
	height: 651px !important;
}
#pop5_container {
	top: 61px !important;
	height: 651px !important;
}
#pop6_container {
	top: 61px !important;
	height: 651px !important;
}
#pop7_container {
	top: 61px !important;
	height: 651px !important;
}
#pop8_container {
	top: 61px !important;
	height: 651px !important;
}
#pop9_container {
	top: 61px !important;
	height: 651px !important;
}
#pop10_container {
	top: 61px !important;
	height: 651px !important;
}
#pop11_container {
	top: 61px !important;
	height: 651px !important;
}
#pop12_container {
	top: 61px !important;
	height: 651px !important;
}
#pop13_container {
	top: 61px !important;
	height: 651px !important;
}
#pop14_container {
	top: 61px !important;
	height: 651px !important;
}
#pop15_container {
	top: 61px !important;
	height: 651px !important;
}
#pop16_container {
	top: 61px !important;
	height: 651px !important;
}
#pop17_container {
	top: 61px !important;
	height: 651px !important;
}
#pop18_container {
	top: 61px !important;
	height: 651px !important;
}
#pop19_container {
	top: 61px !important;
	height: 651px !important;
}