@charset "UTF-8"; /* CSS Document */ html, body { font-size: 12px; font-family:Arial, Helvetica, sans-serif; } * { padding: 0; margin: 0; } body { background: url('../images/concussion-background.png') repeat-x; overflow-x: hidden; } #topline { position: absolute; top:0px; left:0px; width:1600px; height: 135px; background: url('../images/topline.png') repeat-x; } img#title_img { position: absolute; top:27px; left:812px; width:237px; height:46px; } h3 { font-size: 2em; margin: 20px 0 0 20px; } h4 { font-size: 1.3em; margin: 0 0 0 20px; } h5 { font-size: 1.5em; margin: 20px 0 0 20px; } /* nav btns */ #btns_holder { position: absolute; top:80px; left:0px; width: 300px; height: 600px; z-index: 1; } a.main_btn { display: block; position: relative; top:0; left:0; width:300px; height: 49px; text-indent: -999px; cursor: hand; cursor: pointer; z-index: 100; } a#btn1 {background: url('../images/intro_btn.png'); } a#btn2 {background: url('../images/lesson1_btn.png'); } a#btn3 {background: url('../images/lesson2_btn.png'); } a#btn4 {background: url('../images/lesson3_btn.png'); } a#btn5 {background: url('../images/lesson4_btn.png'); } a#btn6 {background: url('../images/lesson5_btn.png'); } a#btn1.active, a#btn2.active, a#btn3.active, a#btn4.active, a#btn5.active, a#btn6.active {background-position: 0 0 !important} a#btn1.enabled, a#btn2.enabled, a#btn3.enabled, a#btn4.enabled, a#btn5.enabled, a#btn6.enabled {background-position: 0 -49px !important;} a#btn1.enabled:hover, a#btn2.enabled:hover, a#btn3.enabled:hover, a#btn4.enabled:hover, a#btn5.enabled:hover, a#btn6.enabled:hover {background-position: 0 -98px !important} a#btn1.disabled, a#btn2.disabled, a#btn3.disabled, a#btn4.disabled, a#btn5.disabled, a#btn6.disabled {background-position: 0 -147px !important; cursor:default} .enabled { cursor: hand; cursor: pointer; } .disabled { pointer-events: none; cursor: default; } #btns_holder ul { list-style: none; } #btns_holder ul ul { position: relative; top:-4px; width:200px; background: #fff; height: auto; border-bottom: 4px solid #8ac148; display: none; list-style: url("../images/green_bullet.png") ; padding: 5px 0 0 20px; margin: 0 0 0 20px; z-index: 90; } #btns_holder ul ul li{ padding: 0 0 5px 0; margin: 0 0 0 20px; } #btns_holder ul ul li a{ text-decoration: none; color:#000; } a#resource_center_btn { display: block; position: relative; width: 226px; height: 42px; background: url('../images/resource_center.png'); text-indent: -999px; margin: 20px 0 0 0; z-index: 100; } a#resource_center_btn:hover {background-position: 0 -42px} a#contributors_btn { position: absolute; top:570px; left:12px; width:167px; height:26px; background: url('../images/contributors_btn.png'); text-indent: -999px; z-index: 200; } a#contributors_btn:hover {background-position: 0 -26px;} a#participating_orgs_btn { position: absolute; top:595px; left:12px; width: 277px; height: 27px; background: url('../images/participating_orgs_btn.png'); text-indent: -999px; z-index: 202; } a#participating_orgs_btn:hover {background-position: 0 -27px;} a#share_btn { position: absolute; top:640px; left:12px; width:178px; height:25px; background: url('../images/share_btn.png'); text-indent: -999px; z-index: 200; } a#share_btn:hover {background-position: 0 -25px;} /* end buttons */ #menu_line { position: absolute; top:520px; left:-60px; width: 413px; height: 39px; background: url('../images/menu_line.png'); } #mediaspace { position: absolute; top:165px; left:280px; width: 640px; height: 360px; border: 1px solid #ccc; } a#play_btn { position: absolute; top:550px; left:370px; width: 22px; height: 24px; text-indent: -9999px; } a#play_btn.play { background: url('../images/play_pause_btn.png') 0 0; } a#play_btn.pause { background: url('../images/play_pause_btn.png') 0 -24px; } a#mute_btn { position: absolute; top:546px; left:410px; width: 40px; height: 29px; text-indent: -9999px; } a#mute_btn.muteoff { background: url('../images/mute_btn.png') 0 0; } a#mute_btn.muteon { background: url('../images/mute_btn.png') 0 -29px; } #footer { position: absolute; top:710px; left:10px; width:900px; height:100px; } img#nfl_logo { position: relative; width:38px; height:52px; } img#cdc_foundation_logo { position: relative; width:194px; height:32px; margin: 4px 0 10px 30px; } img#cdc_logo { position: relative; width:47px; height:28px; margin: 0 0 10px 25px; } p#copyright { position: relative; color: #666; font-size: .9em; } p#copyright a { color: #666; } p#screenreader { position: relative; padding: 10px 0 0 0; } .popup { position: absolute; display: none; width:435px; height: 232px; background: url('../images/popup_bg.png'); transform-origin: 435px 0; -webkit-transform-origin:435px 0; /* Safari and Chrome */ -ms-transform-origin:435px 0; } .popup a.close { position: absolute; display: block; top:10px; left: 100px; width:75px; height: 20px; background: url('../images/close_btn.png'); z-index: 130; text-indent: -9999px; } .popup a.close:hover { background-position: 0 -20px; } .popup .content { position: absolute; top:40px; left: 100px; width:260px; height: 150px; background: #fff; border: 4px solid black; z-index: 130; overflow-x: hidden; overflow-y: scroll; } .popup .content p { padding: 0 0 10px 10px; font-weight: bold; } .popup .content hr { width:80%; margin: 0 auto 10px auto; } #contributors_popup { top:359px; left:-80px; z-index: 199; } #participating_orgs { top:387px; left:-80px; z-index: 200; } #disclaimer_popup { top:550px; left:400px; z-index: 120; } #share_pop { position: absolute; top:650px; left: 80px; display: none; width:138px; height: 99px; background: url('../images/shareit.png'); z-index: 130; transform-origin: 250px 0; -webkit-transform-origin:250px 0; /* Safari and Chrome */ -ms-transform-origin:250px 0; } #share_pop a#share_close { display: block; position: relative; top:15px; left:15px; font-size: .8em; color: #000; font-weight: bold; text-decoration: none; } #share_pop textarea { position: relative; display: block; width:90px; height: 10px; margin: 20px auto 10px auto; font-size: .8em; padding: 5px; } #share_pop label#url_select_direction { position: absolute; left:-9999px; text-indent: -9999px; } #share_pop #sbtns { position: relative; margin: 15px auto 0 auto; width:140px; height: 30px; text-align: center; } .stButton { padding: 0 !important; margin: 0 !important; } #quiz { position: absolute; top:165px; left:280px; width: 640px; height: 360px; z-index: 400; display: none; } .slide { position: absolute; top:0px; left:0px; width: 640px; height: 360px; background-color: #fff; z-index: 400; border: 1px solid #929698; display: none; -webkit-box-shadow: 0px 3px 3px 3px rgba(0, 0, 0, .3); box-shadow: 0px 3px 3px 3px rgba(0, 0, 0, .3); } .slide p { font-size: 1.3em; line-height: 1.1em; padding: 10px 0 15px 23px; color: #666; } .slide ul.question { position: relative; float: left; line-height: 2em; /* text-indent: 50px; */ list-style: none; margin: 0 0 0 20px; } .slide ul.question li a { text-decoration: none; color: #666; text-align: center; line-height: 2em; font-size: 1.4em; text-indent: -9999px; } .slide ul.question li { position: relative; display: block; width: 600px; height: 35px; padding: 0 0 5px 0; clear: both; } .slide ul.question li p { float: left; position: relative; display: block; height: 35px; width:550px; margin: 0 0 0 10px; padding: 5px 0 0 0; text-align: left !important; font-size: 1.3em; line-height: 1.1em; } /* quiz elements */ .slide ul.question li a.answer_btn { position: relative; float: left; display: block; width: 30px; height: 30px; cursor: hand; cursor: pointer; } a.answer_btn.true_btn {background: url('../images/a_btn.png') 0 0 no-repeat;} a.answer_btn.true_btn.allowhover:hover {background: url('../images/a_btn.png') 0 -30px no-repeat;} a.answer_btn.true_btn.selected {background: url('../images/a_btn.png') 0 -60px no-repeat;} a.answer_btn.false_btn {background: url('../images/b_btn.png') 0 0 no-repeat;} a.answer_btn.false_btn.allowhover:hover {background: url('../images/b_btn.png') 0 -30px no-repeat;} a.answer_btn.false_btn.selected {background: url('../images/b_btn.png') 0 -60px no-repeat;} a.answer_btn.a_btn {background: url('../images/a_btn.png') 0 0 no-repeat;} a.answer_btn.a_btn.allowhover:hover {background: url('../images/a_btn.png') 0 -30px no-repeat;} a.answer_btn.a_btn.selected {background: url('../images/a_btn.png') 0 -60px no-repeat;} a.answer_btn.b_btn {background: url('../images/b_btn.png') 0 0 no-repeat;} a.answer_btn.b_btn.allowhover:hover {background: url('../images/b_btn.png') 0 -30px no-repeat;} a.answer_btn.b_btn.selected {background: url('../images/b_btn.png') 0 -60px no-repeat;} a.answer_btn.c_btn {background: url('../images/c_btn.png') 0 0 no-repeat;} a.answer_btn.c_btn.allowhover:hover {background: url('../images/c_btn.png') 0 -30px no-repeat;} a.answer_btn.c_btn.selected {background: url('../images/c_btn.png') 0 -60px no-repeat;} a.answer_btn.d_btn {background: url('../images/d_btn.png') 0 0 no-repeat;} a.answer_btn.d_btn.allowhover:hover {background: url('../images/d_btn.png') 0 -30px no-repeat;} a.answer_btn.d_btn.selected {background: url('../images/d_btn.png') 0 -60px no-repeat;} a.answer_btn.e_btn {background: url('../images/e_btn.png') 0 0 no-repeat;} a.answer_btn.e_btn.allowhover:hover {background: url('../images/e_btn.png') 0 -30px no-repeat;} a.answer_btn.e_btn.selected {background: url('../images/e_btn.png') 0 -60px no-repeat;} a.submit_btn { display: block; position: absolute; right:20px; bottom: 20px; width: 122px; height: 35px; background: url('../images/submit_btn.png') 0 0 no-repeat; text-indent: -9999px; clear: both; display: none; } a#next_btn { display: block; position: absolute; bottom:10px; left:10px; float: left; width: 122px; height: 35px; background: url('../images/next_btn.png') 0 0 no-repeat; text-indent: -9999px; clear: both; } #response_box { position: absolute; top:100px; left:20px; width: 580px; height:130px; background: #fff; z-index: 500; padding: 20px 0 0 20px; border: 2px solid #95c11f; display: none; } .hidden { display: none; } #fail { position: relative; margin: 20px auto 0 auto; width: 550px; height: 200px; border: 3px solid #D6E13E; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; padding: 20px; } p#retake_txt { display: block; position: absolute; bottom:30px; right:18px; } .bold { font-weight: bold; } a#retake_btn { display: block; position: absolute; right:20px; bottom: 10px; width: 119px; height: 32px; background: url('../images/retake_btn.png') 0 0 no-repeat; text-indent: -9999px; clear: both; } #cert_thumb { position: relative; float: left; width:188px; height: 142px; margin: 0px 0 0 20px; } a#dl { display: block; margin: 50px 0 0 0; } #doc_icon { position: relative; float: left; width:16px; height: 19px; margin: 5px 5px 0 0; clear: right; } #acsm { position: relative; float: right; width:152px; height: 122px; margin: -60px 20px 0 0; } p#acsmtxt { display: block; height: 100px; clear: left; float: left; width:400px; font-size: .9em; font-style: italic; } p#pdf { padding: 10px 0 0 0; font-size: .9em; } /* name form */ #name_form { width:400px; height: 180px; margin: 0px 0 0 0; } #name_form h3 { position: relative; display: block; width:350px; margin: 10px auto; font-size: 1.5em; line-height: 1.6em; text-align: center; } #name_form label { position: absolute; top:-9999px; left:-9999px; text-indent: -9999px; } #name_form input { position: relative; display: block; width:200px; height: 30px; font-size: 1.3em; padding: 3px 0 0 0; margin: 20px auto 10px auto; text-align: center; } #name_submit_btn { position: relative; display: block; width:100px; height: 42px; margin: 20px auto 0 auto; background: url('../images/submit_btn.png') no-repeat; text-indent: -9999px; clear: both; } #free-banner { position: absolute; left:718px; top:540px; width:202px; height: 50px; }