html { display: none; }

.rlearn { display: block; }

* { padding : 0; margin : 0; }

body { font-family: 'HelveticaNeueLTStd-Cn'; font-size: 13px; color: #333; background-color: rgb(102, 102, 102); }

#container { position: relative; margin: 0px auto; width: 1280px !important; height: 900px !important; text-align: left; background-color: rgb(255, 255, 255); overflow: hidden; }

#header { width: 1280px; height: 102px; background-image: url("../images/headerBg.png"); background-repeat: no-repeat; position: relative; }

#header #content_title { position: absolute; bottom: 2px; width: 1280px; height: 20px; font-size: 18px; line-height: 8px; padding-left: 29px; color: #013c30; }

#header #content_title span { color: #894a12; }

#header #content_title span span { color: #2b8663; margin-left: 25px; margin-right: 25px; font-size: 22px; }

#header .btn { float: right; margin: 6px 0px 0px 5px; }

#header #exit { position: absolute; top: 9px; right: 2px; cursor: pointer; }

#header #glossary { position: absolute; left: 1119px; top: 6px; cursor: pointer; height: 34px; width: 117px; background-image: url("../images/controls/btn1.png"); background-repeat: no-repeat; line-height: 33px; text-align: center; color: #818181; font-size: 18px; }

#header #help { position: absolute; left: 869px; top: 6px; left: 994px; top: 6px; cursor: pointer; height: 34px; width: 117px; background-image: url("../images/controls/btn1.png"); background-repeat: no-repeat; line-height: 33px; text-align: center; color: #818181; font-size: 18px; }

#header #home { position: absolute; left: 869px; top: 6px; /*left: 744px; top: 6px;*/ cursor: pointer; height: 34px; width: 117px; background-image: url("../images/controls/btn1.png"); background-repeat: no-repeat; line-height: 33px; text-align: center; color: #818181; font-size: 18px; }

#header #resources { position: absolute; left: 869px; top: 6px; cursor: pointer; height: 34px; width: 117px; background-image: url("../images/controls/btn1.png"); background-repeat: no-repeat; line-height: 33px; text-align: center; color: #818181; font-size: 18px; display: none; }

#header #home:hover { background-image: url("../images/controls/btn1H.png"); background-repeat: no-repeat; color: #318d68; }

#header #help:hover { background-image: url("../images/controls/btn1H.png"); background-repeat: no-repeat; color: #318d68; }

#header #resources:hover { background-image: url("../images/controls/btn1H.png"); background-repeat: no-repeat; color: #318d68; }

#header #glossary:hover { background-image: url("../images/controls/btn1H.png"); background-repeat: no-repeat; color: #318d68; }

#media .content { width: 1280px; height: 668px; overflow: hidden; }

#media { z-index: 50; width: 1280px; height: 668px; }

#media #video { z-index: 55; position : absolute; width: 1280px; height: 668px; }

#media #timeline { z-index: 60; position : absolute; width: 1280px; height: 668px; }

#media #html { z-index: 65; position : absolute; width: 1280px; height: 668px; }

#footer { background: url("../images/footerBg.png") no-repeat; height: 138px; width: 1280px; z-index: 100; position: relative; overflow: hidden; }

#footer img { position: relative; float: right; margin: 5px 8px 0 5px; cursor : pointer; }

#copyRight { float: left; clear: both; height: 40px; background-color: #2A7A5A; color: #FFF; line-height: 39px; padding-left: 10px; width: 100%; position: absolute; bottom: 0px; text-align: center; font-size: 19px; }

.button { /*height : 48px; width : 48px; border : 0; position:absolute; top: 6px; cursor : pointer; top: 31px;*/ }

.TOCbutton { width:75px; height:75px; background: url(../images/controls/toc.png) no-repeat left top; /*position:absolute; left:88px; */z-index:101; }

.divider { padding-top: 24px; }

.right { /*float : right; margin-right : 5px;*/ }

#counter { float: right; background: transparent; color: #2A7A5A; font-size: 15pt; position: relative; height: 40px; width: 138px; /*cursor: pointer;*/ top: 21px; right: 129px; line-height: 41px; text-align: center; }

#topnav { display: none; height: 65px; left: 0; overflow: hidden; padding-right: 12px; position: absolute; top: 0; width: 1280px; z-index: 5; }

.clientLogo { position: absolute; line-height: 60px; padding-left: 20px; font-size: 13px; color: #999; }

.refLogo { position: absolute; padding-left: 20px; font-size: 13px; color: #999; left: 280px; top: 10px; }

/*Glossary*/
.glossaryTable { height: 376px; left: 290px; overflow: hidden; padding: 10px; position: absolute; top: 233px; width: 655px; z-index: 100; background: url(../contents/images/glossaryBg.png) no-repeat top left; }

.glossaryClose { position: absolute; top: 15px; right: 17px; background-color: #00C; height: 24px; width: 24px; cursor: pointer; background: url(../contents/images/close.png) no-repeat top left; }

.glossaryTable .grid300 { width: 300px; float: left; margin: 50px 0 0 20px; }

.border01 { border: 1px solid #FFF; }

.scrollContainer { overflow: auto; height: 275px; }

ul.term_list { }

.term_list li { list-style: none; }

.term_list li { line-height: 22px; cursor: pointer; border-bottom: 1px dotted #FFF; padding: 2px 6px; }

.term_list li.active { color : #FFFFFF; background: #2e6f56; font-weight: bold; }

.left_arrow { background: url(../contents/images/arrowLeft.png) no-repeat 0 0; width: 32px; height: 34px; position: absolute; top: 0px; left: 0px; cursor: pointer; }

.right_arrow { background: url(../contents/images/arrowRight.png) no-repeat 0 0; width: 32px; height: 34px; position: absolute; top: 0px; left: 0px; cursor: pointer; }

#transcript_container { position: absolute; top: 120px; right: 0px; z-index: 67; width: 355px; height: 414px; overflow: hidden; }

#transcript_content { color: #333333; font-size: 12px; height: 414px; left: 32px; line-height: 15px; position: absolute; top: 0px; width: 323px; padding: 7px; background: url(../contents/images/transcriptBody.jpg) no-repeat; }

.transcript_text { display: block; height: 361px; overflow: auto; position: relative; top: 35px; width: 301px; left: 5px; }

.transcript_text p { margin-bottom: 10px; }

@font-face { font-family: 'futura_ltregular'; src: url('../font/futuralt-webfont.eot'); src: url('../font/futuralt-webfont.eot?#iefix') format('embedded-opentype'), url('../font/futuralt-webfont.woff') format('woff'), url('../font/futuralt-webfont.ttf') format('truetype'), url('../font/futuralt-webfont.svg#futura_ltregular') format('svg'); font-weight: normal; font-style: normal; }

@font-face { font-family: 'HelveticaNeueLTStd-Cn'; src: url('../font/HelveticaNeueLTStd-Cn.otf'); }

@media only screen and (min-device-width : 768px) and (max-device-width : 1280px) and (orientation : landscape) {

body { position: fixed; top: 0; width: 100%; height: 672px !important; }

#volume { display: none!important; }
}

.flashMsg { display: block; padding: 270px 400px; color: red; font-size: 23px; }

.loaderText { position: absolute; left: 425px; top: 194px; font-size: 23px; }

.refTable { display: none; height: 376px; left: 185px; overflow: hidden; padding: 10px; position: absolute; top: 113px; width: 674px; z-index: 67; background: url(../contents/images/refBg.png) no-repeat top left; }

.refClose { position: absolute; top: 15px; right: 37px; background-color: #00C; height: 24px; width: 24px; cursor: pointer; background: url(../contents/images/close.png) no-repeat top left; }

#info { display: none; width: 32px; height: 32px; float: left !important; margin-top: 12px !important; margin-left: 80px !important; cursor: pointer; }

.fg { color: #2c8562; }

.button_logo { float: left; margin-left: 34px; margin-top: 9px; }

.controlsmar { margin-right: 20px; margin-top:1px}

.ref_bg_color { background-color: rgba(245, 249, 245, 0.6); position: absolute; top: 98px; left: 0px; width: 1280px; height: 668px; z-index: 70; }

.ref_bg { position: absolute; left: 288px; top: 240px; z-index: 71; background: url("../images/Ref_BG.png") no-repeat scroll left top transparent; height: 376px; width: 674px; }

#reference_container { display: none; }

.ref_content { position: absolute; top: 63px; left: 22px; height: 277px; width: 630px; overflow-y: scroll; overflow-x: hidden; padding-right: 7px; }

.ref_content ol { margin-left: 35px; }

.ref_content ol li { padding-bottom: 7px; }

.refrenceclose { width: 50px; height: 50px; position: absolute; top: 243px; right: 320px; z-index: 72; cursor: pointer; }

/********resource****************/
.resource_bg_color { background-color: rgba(245, 249, 245, 0.6); position: absolute; top: 98px; left: 0px; width: 1280px; height: 668px; z-index: 70; }

.resource_bg { position: absolute; left: 290px; top: 240px; z-index: 71; background: url("../images/Resources_BG.png") no-repeat scroll left top transparent; height: 376px; width: 674px; list-style: disc; }

#resource_container { display: none; }

.resource_content { position: absolute; top: 63px; left: 22px; height: 277px; width: 630px; overflow-y: scroll; overflow-x: hidden; padding-right: 7px; }

.resource_content h2 { font-size: 16px; line-height: 22px; padding-bottom: 10px; }

.resource_content li { margin-left: 20px; padding-bottom: 7px; }

.resource_content li a { text-decoration: none; color: #333; }

.resourceClose { width: 50px; height: 50px; position: absolute; top: 243px; right: 320px; z-index: 72; cursor: pointer; }

.navMsgContainer { width: 275px; position: absolute; top: 732px; right: -275px; z-index: 60; text-align: center; background-color: #ccc; color: #000; padding: 5px 0; border-top-left-radius: 7px; border-bottom-left-radius: 7px; z-index: 70;/* border-color: #22A7F0; */}

.blinking { -webkit-animation: blink 2s infinite; -moz-animation: blink 2s infinite; animation: blink 2s infinite; }
 @-webkit-keyframes blink {
 0% {
opacity:0;
}
 100% {
opacity:1;
}
}
 @-moz-keyframes blink {
 0% {
opacity:0;
}
 100% {
opacity:1;
}
}
 @keyframes blink {
 0% {
opacity:0;
}
 100% {
opacity:1;
}
}

.glossary_term { cursor: pointer; }