@charset "UTF-8";
/* CSS Document */

html {
    /*background: url(../images/bg.jpg) no-repeat center center fixed;*/
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    */;
}

body {
    margin: 0px;
}

.textbox {
    padding: 10px 10px 10px 30px;
    width: 500px;
    border: 1px solid #c3c3c3;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    font-family: 'Open Sans', sans-serif;
    font-size: 12px;
}

.textbox_icon_name {
    background: #F1F1F1 url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAABARpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wUmlnaHRzPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvcmlnaHRzLyIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczpkYz0iaHR0cDovL3B1cmwub3JnL2RjL2VsZW1lbnRzLzEuMS8iIHhtbG5zOnhtcE1NPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvbW0vIiB4bWxuczpzdFJlZj0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL3NUeXBlL1Jlc291cmNlUmVmIyIgeG1wUmlnaHRzOk1hcmtlZD0iVHJ1ZSIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ1M1IFdpbmRvd3MiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6MzFCNkEwRDExNUFCMTFFMTg0QUE5MjhENDYyMUZBODMiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6MzFCNkEwRDIxNUFCMTFFMTg0QUE5MjhENDYyMUZBODMiPiA8ZGM6cmlnaHRzPiA8cmRmOkFsdD4gPHJkZjpsaSB4bWw6bGFuZz0ieC1kZWZhdWx0Ij5ST1lBTFRZIEZSRUUgTElDRU5TRSA8L3JkZjpsaT4gPC9yZGY6QWx0PiA8L2RjOnJpZ2h0cz4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MzFCNkEwQ0YxNUFCMTFFMTg0QUE5MjhENDYyMUZBODMiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6MzFCNkEwRDAxNUFCMTFFMTg0QUE5MjhENDYyMUZBODMiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz5FHaNQAAAAxUlEQVR42mL8//8/Azro7+8XAFLrgdgBKnQAiAMLCws/oKtlYsAOkDUzQNnrsSnEZYADkWI4DcAKgF5TINaAA9jEgGHwgFgDAtEMOQAVwwCM2GKBFMCCFnX1QFwAxKDoMoQ5Ger380AMUjMBKF6IzQv9UM0MUIX1SHL1UDEQKAAaOB/FC0CBABzxbAilz2MLJ6BDNsBcEI/Di+dxaIbrgRkQQEb4BZCckChOifgMOECG3gPIBoBS2QJo/BMCH6BqwSkTIMAAAGo3LoAv8NoAAAAASUVORK5CYII=) no-repeat 8px center;
}

.textbox_icon_email {
    background: #F1F1F1 url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAABClpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wUmlnaHRzPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvcmlnaHRzLyIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczpkYz0iaHR0cDovL3B1cmwub3JnL2RjL2VsZW1lbnRzLzEuMS8iIHhtbG5zOnhtcE1NPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvbW0vIiB4bWxuczpzdFJlZj0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL3NUeXBlL1Jlc291cmNlUmVmIyIgeG1wUmlnaHRzOk1hcmtlZD0iVHJ1ZSIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ1M1IFdpbmRvd3MiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NzI3NTdDRTExNUFCMTFFMUE5NURCRkMwMEFDNjhEQUMiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NzI3NTdDRTIxNUFCMTFFMUE5NURCRkMwMEFDNjhEQUMiPiA8ZGM6cmlnaHRzPiA8cmRmOkFsdD4gPHJkZjpsaSB4bWw6bGFuZz0ieC1kZWZhdWx0Ij5DcmVhdGl2ZSBDb21tb25zIEF0dHJpYnV0aW9uIE5vbi1Db21tZXJjaWFsIE5vIERlcml2YXRpdmVzPC9yZGY6bGk+IDwvcmRmOkFsdD4gPC9kYzpyaWdodHM+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjcyNzU3Q0RGMTVBQjExRTFBOTVEQkZDMDBBQzY4REFDIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjcyNzU3Q0UwMTVBQjExRTFBOTVEQkZDMDBBQzY4REFDIi8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+SoKR9AAAAH5JREFUeNpi/P//PwMlgImBQsDS39/fAKTrydTfyESBZhCoR/bCAig9AYgZceAFaGpRwiARKlEAxPOx2AYSS4CqSYSHAZoimEQCGh+rZmwGYDOEAZdmXAZgMwSrZnwGMKBpSMSZDghEUyLtUyIS+z+5eaGRAgc0Mg54bgQIMAAD7RsCMDpK7QAAAABJRU5ErkJggg==) no-repeat 8px center;
}

.textbox_icon_message {
    background: #F1F1F1;
    height: 250px;
}

.textbox:focus {
    background-color: #FFF;
    border-color: #E8C291;
    outline: none;
}

/* Overlays for popups
************************/
#loadercover {
    position: fixed;
    background-color: #f3efea;
    width: 100%;
    height: 100%;
    z-index: 9999;
}

#ipadrotatecover {
    position: fixed;
    background-color: rgba(0, 0, 0, 0.8);
    width: 100%;
    height: 100%;
    z-index: 9999;
    visibility: hidden; /*hides the ipad rotation warning initially (for desktop)*/
}

.generalcover {
    position: fixed;
    background-color: rgba(255, 255, 255, 0.3);
    width: 100%;
    height: 100%;
    z-index: 9998;
    /*visibility: hidden;  this div is initially hidden when loaded */
}

/* Slide popup window
************************/
#slides {
    position: fixed;
    background-color: rgba(37, 40, 42, 0.95);
    width: 910px;
    height: 640px;
    top: 50%;
    left: 50%;
    margin: -320px 0 0 -455px; /*sets new anchor point of div. 50% of the heights and 50% of the width to center*/
    /*border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;*/
    -webkit-box-shadow: 0px 0px 85px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 0px 85px 0px rgba(0,0,0,0.75);
    box-shadow: 0px 0px 85px 0px rgba(0,0,0,0.75);
}

#slidesclose {
    width: 910px;
    height: 50px;
    position: absolute;
    bottom: 0px;
    border-top: 1px;
    border-top-style: solid;
    border-top-color: rgba(200,200,200,0.3);
    line-height: 50px;
    text-align: center;
    vertical-align: central;
    /*border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;*/
    font-family: 'Open Sans', sans-serif;
    color: rgba(200,200,200,1.00);
    font-size: 12px;
}

/* Slide popup - Chapter
************************/
#chapterwrapper {
    width: 250px;
    height: 659px;
    float: left;
    border-top-left-radius: 15px;
}

#chapterheadline {
    width: 210px;
    height: 80px;
    margin-left: 20px;
}

.chapter {
    width: 210px;
    height: 40px;
    margin-left: 20px;
    cursor: pointer;
    border-bottom: 1px;
    border-bottom-style: solid;
    border-bottom-color: rgba(200,200,200,0.3);
}

.chapterheadlinetext {
    font-family: 'Open Sans', sans-serif;
    color: rgba(200,200,200,1.0);
    font-size: 16px;
    line-height: 80px;
    vertical-align: central;
}

.chapterlinktext {
    font-family: 'Open Sans', sans-serif;
    color: rgba(200,200,200,1.0);
    font-size: 12px;
    line-height: 40px;
    vertical-align: central;
}

.chapterlink-icon {
    color: rgba(200,200,200,1.0);
    float: right;
    padding-top: 12px;
}

/* Slide popup - jump to position in video button
************************/
#slidejump {
    height: 40px;
    width: 200px;
    float: left;
    line-height: 40px;
    vertical-align: central;
    text-align: left;
    font-family: 'Open Sans', sans-serif;
    color: rgba(200,200,200,1.0);
    font-size: 21px;
}

/* Slide popup - fotorama positioning
************************/
#fotorama {
    display: inline-block;
    margin-left: 10px;
}

/* Twitter popup
************************/
#twitter {
    position: fixed;
    background-color: rgba(37, 40, 42, 0.95);
    width: 1000px;
    height: 600px;
    top: 50%;
    left: 50%;
    margin: -300px 0 0 -500px; /*sets new anchor point of div. 50% of the heights and 50% of the width to center*/
    /*border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;*/
    -webkit-box-shadow: 0px 0px 85px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 0px 85px 0px rgba(0,0,0,0.75);
    box-shadow: 0px 0px 85px 0px rgba(0,0,0,0.75);
}

#twitterheadline {
    width: 100%;
    height: 50px;
    text-align: center;
}

.twitterheadlinetext {
    font-family: 'Open Sans', sans-serif;
    color: rgba(200, 200, 200, 1.0);
    font-size: 16px;
    font-weight: 600;
    line-height: 54px;
    vertical-align: central;
}

#tweets {
    width: 460px;
    height: 460px;
    float: left;
    margin: 20px;
}

#hashtags {
    width: 460px;
    height: 460px;
    float: left;
    margin: 20px;
}

#twitter_close_btn {
    width: 100%;
    height: 50px;
    float: left;
    position: absolute;
    bottom: 0px;
    border-top: 1px;
    border-top-style: solid;
    border-top-color: rgba(200, 200, 200, 0.3);
    line-height: 50px;
    text-align: center;
    vertical-align: central;
    /*border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;*/
    font-family: 'Open Sans', sans-serif;
    color: rgba(200, 200, 200, 1.0);
    font-size: 12px;
}

/* Information popup
************************/
#info {
    position: fixed;
    background-color: rgba(37, 40, 42, 0.95);
    width: 350px;
    height: 308px;
    top: 50%;
    left: 50%;
    margin: -154px 0 0 -175px; /*sets new anchor point of div. 50% of the heights and 50% of the width to center*/
    /*border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;*/
    -webkit-box-shadow: 0px 0px 85px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 0px 85px 0px rgba(0,0,0,0.75);
    box-shadow: 0px 0px 85px 0px rgba(0,0,0,0.75);
}

#infoheadline {
    width: 100%;
    height: 50px;
    text-align: center;
    border-bottom: 1px;
    border-bottom-style: solid;
    border-bottom-color: rgba(200, 200, 200, 0.3);
}

.infoheadlinetext {
    font-family: 'Open Sans', sans-serif;
    color: rgba(200, 200, 200, 1.0);
    font-size: 16px;
    font-weight: 600;
    line-height: 54px;
    vertical-align: central;
}

.info_btn_text {
    font-family: 'Open Sans', sans-serif;
    color: rgba(200, 200, 200, 1.0);
    font-size: 12px;
    line-height: 50px;
    vertical-align: central;
}

#systemcheck_btn {
    width: 100%;
    height: 50px;
    border-bottom: 1px;
    border-bottom-style: solid;
    border-bottom-color: rgba(200, 200, 200, 0.3);
    text-align: center;
}

#termsandconditions_btn {
    width: 100%;
    height: 50px;
    border-bottom: 1px;
    border-bottom-style: solid;
    border-bottom-color: rgba(200, 200, 200, 0.3);
    text-align: center;
}

#support_btn {
    width: 100%;
    height: 50px;
    border-bottom: 1px;
    border-bottom-style: solid;
    border-bottom-color: rgba(200, 200, 200, 0.3);
    text-align: center;
}

#about_btn {
    width: 100%;
    height: 50px;
    text-align: center;
}

#info_close_btn {
    width: 100%;
    height: 50px;
    float: left;
    position: absolute;
    bottom: 0px;
    border-top: 1px;
    border-top-style: solid;
    border-top-color: rgba(200, 200, 200, 0.3);
    line-height: 50px;
    text-align: center;
    vertical-align: central;
    /*border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;*/
    font-family: 'Open Sans', sans-serif;
    color: rgba(200, 200, 200, 1.0);
    font-size: 12px;
}
/* System Check popup
************************/
#syscheck {
    position: fixed;
    background-color: rgba(37, 40, 42, 0.95);
    width: 1000px;
    height: 610px;
    top: 50%;
    left: 50%;
    margin: -305px 0 0 -500px; /*sets new anchor point of div. 50% of the heights and 50% of the width to center*/
    /*border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;*/
    -webkit-box-shadow: 0px 0px 85px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 0px 85px 0px rgba(0,0,0,0.75);
    box-shadow: 0px 0px 85px 0px rgba(0,0,0,0.75);
}

#syscheckheadline {
    width: 100%;
    height: 50px;
    text-align: center;
}

.syscheckheadlinetext {
    font-family: 'Open Sans', sans-serif;
    color: rgba(200, 200, 200, 1.0);
    font-size: 16px;
    font-weight: 600;
    line-height: 54px;
    vertical-align: central;
}

#syscheckframe {
    width: 960px;
    height: 500px;
    float: left;
    margin-left: 20px;
    margin-right: 20px;
    border: none;
    /*border-style: solid;
    border-color: #c3c3c3;
    background-color: #FFF;*/
    overflow: auto;
    font-family: 'Open Sans', sans-serif;
    font-size: 12px;
}

#syscheck_close_btn {
    width: 100%;
    height: 50px;
    float: left;
    position: absolute;
    bottom: 0px;
    border-top: 1px;
    border-top-style: solid;
    border-top-color: #c3c3c3;
    line-height: 50px;
    text-align: center;
    vertical-align: central;
    /*border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;*/
    font-family: 'Open Sans', sans-serif;
    color: rgba(200, 200, 200, 1.0);
    font-size: 12px;
}

/* Support FAQ popup
************************/
#support {
    position: fixed;
    background-color: rgba(37, 40, 42, 0.95);
    width: 1000px;
    height: 610px;
    top: 50%;
    left: 50%;
    margin: -305px 0 0 -500px; /*sets new anchor point of div. 50% of the heights and 50% of the width to center*/
    /*border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;*/
    -webkit-box-shadow: 0px 0px 85px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 0px 85px 0px rgba(0,0,0,0.75);
    box-shadow: 0px 0px 85px 0px rgba(0,0,0,0.75);
}

#supportheadline {
    width: 100%;
    height: 50px;
    text-align: center;
}

.supportheadlinetext {
    font-family: 'Open Sans', sans-serif;
    color: rgba(200, 200, 200, 1.0);
    font-size: 16px;
    font-weight: 600;
    line-height: 54px;
    vertical-align: central;
}

#supportframe {
    width: 960px;
    height: 460px;
    float: left;
    margin-left: 20px;
    margin-right: 20px;
    border: 1px;
    border-style: solid;
    border-color: #c3c3c3;
    background-color: #FFF;
    overflow: auto;
    font-family: 'Open Sans', sans-serif;
    font-size: 12px;
}

#support_close_btn {
    width: 100%;
    height: 50px;
    float: left;
    position: absolute;
    bottom: 0px;
    border-top: 1px;
    border-top-style: solid;
    border-top-color: rgba(200, 200, 200, 0.3);
    line-height: 50px;
    text-align: center;
    vertical-align: central;
    /*border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;*/
    font-family: 'Open Sans', sans-serif;
    color: rgba(200, 200, 200, 1.0);
    font-size: 12px;
}

/* About popup
************************/
#about {
    position: fixed;
    background-color: rgba(37, 40, 42, 0.95);
    width: 600px;
    height: 500px;
    top: 50%;
    left: 50%;
    margin: -250px 0 0 -300px; /*sets new anchor point of div. 50% of the heights and 50% of the width to center*/
    /*border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;*/
    -webkit-box-shadow: 0px 0px 85px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 0px 85px 0px rgba(0,0,0,0.75);
    box-shadow: 0px 0px 85px 0px rgba(0,0,0,0.75);
}

#abouttable {
    width: 520px;
    margin-left: 40px;
    margin-top: 40px;
}

.podium2web {
    font-family: 'Open Sans', sans-serif;
    color: rgba(200, 200, 200, 1.0);
    font-size: 40px;
    font-weight: 800;
}

.version {
    font-family: 'Open Sans', sans-serif;
    color: rgba(200, 200, 200, 1.0);
    font-size: 12px;
}

.licence_copyright {
    font-family: 'Open Sans', sans-serif;
    color: rgba(200, 200, 200, 1.0);
    font-size: 12px;
}

#about_close_btn {
    width: 100%;
    height: 50px;
    float: left;
    position: absolute;
    bottom: 0px;
    border-top: 1px;
    border-top-style: solid;
    border-top-color: rgba(200, 200, 200, 0.3);
    line-height: 50px;
    text-align: center;
    vertical-align: central;
    /*border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;*/
    font-family: 'Open Sans', sans-serif;
    color: rgba(200, 200, 200, 1.0);
    font-size: 12px;
}

/* Terms and Conditions popup
************************/
#tac {
    position: fixed;
    background-color: rgba(37, 40, 42, 0.95);
    width: 1000px;
    height: 610px;
    top: 50%;
    left: 50%;
    margin: -305px 0 0 -500px; /*sets new anchor point of div. 50% of the heights and 50% of the width to center*/
    /*border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;*/
    -webkit-box-shadow: 0px 0px 85px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 0px 85px 0px rgba(0,0,0,0.75);
    box-shadow: 0px 0px 85px 0px rgba(0,0,0,0.75);
}

#tacheadline {
    width: 100%;
    height: 50px;
    text-align: center;
}

.tacheadlinetext {
    font-family: 'Open Sans', sans-serif;
    color: rgba(200, 200, 200, 1.0);
    font-size: 16px;
    font-weight: 600;
    line-height: 54px;
    vertical-align: central;
}

#tacframe {
    width: 960px;
    height: 460px;
    float: left;
    margin-left: 20px;
    margin-right: 20px;
    border: 1px;
    border-style: solid;
    border-color: #c3c3c3;
    background-color: #FFF;
    overflow: auto;
    font-family: 'Open Sans', sans-serif;
    font-size: 12px;
}

#tac_close_btn {
    width: 100%;
    height: 50px;
    float: left;
    position: absolute;
    bottom: 0px;
    border-top: 1px;
    border-top-style: solid;
    border-top-color: rgba(200, 200, 200, 0.3);
    line-height: 50px;
    text-align: center;
    vertical-align: central;
    /*border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;*/
    font-family: 'Open Sans', sans-serif;
    color: rgba(200, 200, 200, 1.0);
    font-size: 12px;
}

/* eMail popup
************************/
#email {
    position: fixed;
    background-color: rgba(37, 40, 42, 0.95);
    width: 900px;
    height: 600px;
    top: 50%;
    left: 50%;
    margin: -300px 0 0 -450px; /*sets new anchor point of div. 50% of the heights and 50% of the width to center*/
    /*border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;*/
    -webkit-box-shadow: 0px 0px 85px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 0px 85px 0px rgba(0,0,0,0.75);
    box-shadow: 0px 0px 85px 0px rgba(0,0,0,0.75);
}

#emailheadline {
    width: 100%;
    height: 50px;
    text-align: center;
}

.emailheadlinetext {
    font-family: 'Open Sans', sans-serif;
    color: rgba(200,200,200,1.0);
    font-size: 16px;
    font-weight: 600;
    line-height: 54px;
    vertical-align: central;
}

#selectwrapper {
    width: 300px;
    height: 500px;
    float: left;
}

#selectspeakerheadline {
    width: 300px;
    height: 70px;
    margin-left: 30px;
}

#selectspeaker {
    height: 400px;
    overflow: auto;
    padding-left: 30px;
}

.speaker {
    width: 280px;
    height: 38px;
    margin-top: 10px;
    border-bottom: 1px;
    border-bottom-style: solid;
    border-bottom-color: rgba(200,200,200,0.3);
}

#message {
    width: 600px;
    height: 500px;
    float: left;
    text-align: center;
}

#note {
    width: 500px;
    text-align: left;
    margin-left: 30px;
    margin-right: 30px;
    font-family: 'Open Sans', sans-serif;
    color: rgba(200,200,200,1.0);
    font-size: 10px;
}

#emailclose {
    width: 449px;
    height: 50px;
    float: left;
    position: absolute;
    bottom: 0px;
    border-top: 1px;
    border-top-style: solid;
    border-top-color: rgba(200,200,200,0.3);
    border-right: 1px;
    border-right-style: solid;
    border-right-color: rgba(200,200,200,0.3);
    line-height: 50px;
    text-align: center;
    vertical-align: central;
    /*border-bottom-left-radius: 15px;
    border-bottom-right-radius: 5px;*/
    font-family: 'Open Sans', sans-serif;
    color: rgba(200,200,200,1.0);
    font-size: 12px;
}

#emailsend {
    width: 450px;
    height: 50px;
    float: left;
    position: absolute;
    bottom: 0px;
    right: 0px;
    border-top: 1px;
    border-top-style: solid;
    border-top-color: rgba(200,200,200,0.3);
    line-height: 50px;
    text-align: center;
    vertical-align: central;
    /*border-bottom-left-radius: 5px;
    border-bottom-right-radius: 15px;*/
    font-family: 'Open Sans', sans-serif;
    color: rgba(200,200,200,1.0);
    font-size: 12px;
}

input[type=checkbox].css-checkbox {
    display: none;
}

    input[type=checkbox].css-checkbox + label.css-label {
        padding-left: 40px;
        height: 28px;
        width: 280px;
        display: inline-block;
        line-height: 28px;
        background-repeat: no-repeat;
        background-position: 0 0;
        font-family: 'Open Sans', sans-serif;
        font-size: 14px;
        vertical-align: middle;
        cursor: pointer;
        color: rgba(200, 200, 200, 1.00);
    }

    input[type=checkbox].css-checkbox:checked + label.css-label {
        background-position: 0 -28px;
    }

label.css-label {
    background-image: url(../images/checkbox.png);
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

#emailsent {
    position: absolute;
    background-color: rgba(37, 40, 42, 0.95);
    width: 300px;
    height: 150px;
    top: 50%;
    left: 50%;
    margin: -75px 0 0 -150px; /*sets new anchor point of div. 50% of the heights and 50% of the width to center*/
    /*border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;*/
    -webkit-box-shadow: 0px 0px 85px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 0px 85px 0px rgba(0,0,0,0.75);
    box-shadow: 0px 0px 85px 0px rgba(0,0,0,0.75);
}

#emailsenttext {
    position: absolute;
    width: 100%;
    height: 100px;
    top: 0px;
    line-height: 100px;
    text-align: center;
    vertical-align: central;
    border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
    font-family: 'Open Sans', sans-serif;
    color: rgba(200,200,200,1.0);
    font-size: 12px;
}

.emailsenttexticon {
    color: #0C0;
    font-size: 21px;
}

#emailsentok {
    position: absolute;
    width: 100%;
    height: 50px;
    bottom: 0px;
    border-top: 1px;
    border-top-style: solid;
    border-top-color: rgba(200,200,200,0.3);
    line-height: 50px;
    text-align: center;
    vertical-align: central;
    /*border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;*/
    font-family: 'Open Sans', sans-serif;
    color: rgba(200,200,200,1.0);
    font-size: 12px;
}

/* Fullscreen popup
************************/
#fullscreen {
    position: absolute;
    background-color: rgba(37, 40, 42, 0.95);
    width: 600px;
    height: 250px;
    top: 50%;
    left: 50%;
    margin: -125px 0 0 -300px; /*sets new anchor point of div. 50% of the heights and 50% of the width to center*/
    /*border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;*/
    -webkit-box-shadow: 0px 0px 85px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 0px 85px 0px rgba(0,0,0,0.75);
    box-shadow: 0px 0px 85px 0px rgba(0,0,0,0.75);
}

#fullscreenheadline {
    width: 100%;
    height: 54px;
    text-align: center;
}

.fullscreenheadlinetext {
    font-family: 'Open Sans', sans-serif;
    color: rgba(200, 200, 200, 1.0);
    font-size: 16px;
    font-weight: 600;
    line-height: 54px;
    vertical-align: central;
}

#fullscreenpresentation {
    width: 155px;
    height: 125px;
    float: left;
    margin-left: 25px;
}

#fullscreenspeaker {
    width: 155px;
    height: 125px;
    float: left;
    margin-left: 20px;
}

#fullscreenbroadcast {
    width: 155px;
    height: 125px;
    float: left;
    margin-left: 20px;
}

.fullscreenicon {
    width: 150px;
    text-align: center;
    color: rgba(200, 200, 200, 1.0);
    font-size: 30px;
    text-decoration: none;
    margin-top: 30px;
}

.fullscreenbtntext {
    width: 150px;
    height: 50px;
    text-align: center;
    text-decoration: none;
    font-family: 'Open Sans', sans-serif;
    color: rgba(200, 200, 200, 1.0);
    font-size: 12px;
    margin-top: 20px;
}

#fullscreenclose {
    position: absolute;
    width: 100%;
    height: 50px;
    bottom: 0px;
    border-top: 1px;
    border-top-style: solid;
    border-top-color: rgba(200, 200, 200, 0.3);
    line-height: 50px;
    text-align: center;
    vertical-align: central;
    /*border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;*/
    font-family: 'Open Sans', sans-serif;
    color: rgba(200, 200, 200, 1.0);
    font-size: 12px;
}

.fullscreen_spacer {
    width: 1px;
    height: 50px;
    background-color: rgba(200, 200, 200, 0.3);
    float: left;
    margin-left: 20px;
    margin-top: 40px;
}

/* loading screen
************************/
#version {
    position: absolute;
    right: 20px;
    bottom: 20px;
    color: rgba(255, 255, 255, 0.6);
}

#spinner {
    position: absolute;
    background-color: none;
    color: #FFF;
    font-size: 30px;
    width: 80px;
    height: 80px;
    top: 50%;
    left: 50%;
    margin: -40px 0 0 -40px; /*sets new anchor point of div. 50% of the heights and 50% of the width to center*/
    text-align: center;
}

#loader_logo {
    position: absolute;
    background-image: url(../images/logo_loading.png);
    width: 200px;
    height: 100px;
    top: 35%;
    left: 50%;
    margin: -50px 0 0 -100px; /*sets new anchor point of div. 50% of the heights and 50% of the width to center*/
}

#loader_phone {
    position: absolute;
    width: 300px;
    height: 100px;
    top: 90%;
    left: 50%;
    margin: -50px 0 0 -150px; /*sets new anchor point of div. 50% of the heights and 50% of the width to center*/
    text-align: left;
}

.version_text {
    font-size: 10px;
    font-weight: normal;
}
/* rotation detection PLEASE ROTATE
************************/
#rotatespinner {
    position: absolute;
    background-color: none;
    color: #FFF;
    font-size: 60px;
    width: 300px;
    height: 300px;
    top: 50%;
    left: 50%;
    margin: -150px 0 0 -150px; /*sets new anchor point of div. 50% of the heights and 50% of the width to center*/
    text-align: center;
}

.rotate_text {
    font-size: 16px;
    font-weight: bold;
}

/* General layout
************************/
.font {
    font-family: 'Open Sans', sans-serif;
}

#header {
    width: 100%;
    height: 120px;
    position: fixed;
    top: 0px;
    /*background-color: #0097d1;*/ /*background color for header if NO image*/
}

#webcastinfo {
    width: 50%;
    height: 100px;
    float: left;
    margin-top: 20px;
    margin-left: 20px;
    margin-right: 20px;
}

#webcastinfo_phone {
    width: 80%;
    height: 100px;
    float: left;
    margin-top: 140px;
    margin-left: 20px;
    margin-right: 20px;
}

.titletext {
    font-size: 18px;
    font-weight: 800;
    color: #fc2e35;
}

.nametext {
    font-size: 13px;
    font-weight: normal;
    color: #fc2e35;
}

#logo {
    width: 350px;
    height: 120px;
    float: right;
    /*background-color: #0097d1;for testing only*/
    background-image: url('../images/logo.png');
    background-repeat: no-repeat;
    background-position: left center;
}

#content {
    width: 100%;
    height: %;
    position: fixed;
    bottom: 115px;
    top: 0px;
    background-color: #f3efea;
}

#content_phone {
    width: 100%;
    height: %;
    position: fixed;
    bottom: 100px;
    top: 0px;
      background-color: #f3efea;
}

/* Possible configurations: w1004,h384,m145 or w804,h408,m135 or w1004,h292,m145 */
#video {
    width: 1004px;
    height: 384px;
    margin: 145px auto; /*position of the video from top*/
    background-color: #3F6;
}



/* Player elements
************************/

#player_wrapper {
    width: 100%;
    height: 115px;
    position: fixed;
    bottom: 0px;
}

#player_wrapper_phone {
    width: 100%;
    height: 100px;
    position: fixed;
    bottom: 0px;
}

#currentposition {
    width: 6%;
    right: 0px;
    height: 15px;
    background-color: rgba(24, 26, 28, 1.0);
    float: left;
    font-family: 'Open Sans', sans-serif;
    font-size: 11px;
    color: #FFF;
    font-weight: 600;
    text-align: center;
}

#slider {
    width: 88%;
    height: 15px;
    display: block;
    float: left;
}

#videolength {
    width: 6%;
    right: 0px;
    height: 15px;
    background-color: rgba(24, 26, 28, 1.0);
    float: right;
    font-size: 11px;
    color: #FFF;
    font-weight: 600;
    text-align: center;
}

.playerbtn_wrapper {
    width: 100%;
    height: 100px;
    background-color: rgba(37, 40, 42, 0.95);
    display: inline-block;
}

.playerbtn_spacer_dark_left {
    width: 1px;
    height: 50px;
    background-color: rgba(29, 31, 33, 0.6);
    display: inline;
    float: left;
    margin-top: 25px;
    margin-bottom: 25px;
}

.playerbtn_spacer_dark_right {
    width: 1px;
    height: 50px;
    background-color: rgba(29, 31, 33, 0.6);
    display: inline;
    float: right;
    margin-top: 25px;
    margin-bottom: 25px;
}

.playerbtn_spacer_light_left {
    width: 1px;
    height: 50px;
    background-color: rgba(137, 140, 141, 0.3);
    display: inline;
    float: left;
    margin-top: 25px;
    margin-bottom: 25px;
    /*display: none;  enbale to show the lighter spacer 3D effect*/
}

.playerbtn_spacer_light_right {
    width: 1px;
    height: 50px;
    background-color: rgba(137, 140, 141, 0.3);
    display: inline;
    float: right;
    margin-top: 25px;
    margin-bottom: 25px;
    /*display: none;  enbale to show the lighter spacer 3D effect*/
}

.playerbtn {
    width: 100px;
    height: 100px;
    background-color: none;
    display: inline;
    float: left;
}

.playerbtn_right {
    width: 100px;
    height: 100px;
    background-color: none;
    display: inline;
    float: right;
}

.playerbtn_top {
    width: 100px;
    height: 25px;
}

.playerbtn_center {
    width: 100px;
    height: 55px;
}

.playerbtn_bottom {
    width: 100px;
    height: 20px;
}

.playerbtn_icon {
    width: 100px;
    height: 35px;
    line-height: 40px;
    text-align: center;
    vertical-align: central;
    color: rgba(200, 200, 200, 1.0);
    font-size: 21px;
    text-decoration: none;
}

.playerbtn_text {
    width: 100px;
    height: 20px;
    line-height: 20px;
    text-align: center;
    vertical-align: central;
    font-size: 10px;
    text-decoration: none;
    letter-spacing: 1px;
    color: rgba(200, 200, 200, 1.0);
}

/* Helper (button on touch, hover etc.
************************/
.hyperspan {
    position: relative;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
}

a, a:visited, a:hover, a:active {
    text-decoration: none;
}

.hover_effect {
    background-color: rgba(247, 247, 247, 0.2);
}

.hover_effect_popup {
    background-color: rgba(247, 247, 247, 0.2);
}

.hover { /* stop the browser asking you to copy/save/select the image or whatever */
    -webkit-user-select: none;
    -webkit-touch-callout: none;
}


/* *****************************************************************************************************
    LIVE ONLY
   *****************************************************************************************************/

/* Q&A popup
************************/
#qa {
    position: fixed;
    background-color: rgba(37, 40, 42, 0.95);
    width: 600px;
    height: 600px;
    top: 50%;
    left: 50%;
    margin: -300px 0 0 -300px; /*sets new anchor point of div. 50% of the heights and 50% of the width to center*/
    /*border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;*/
    -webkit-box-shadow: 0px 0px 85px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 0px 85px 0px rgba(0,0,0,0.75);
    box-shadow: 0px 0px 85px 0px rgba(0,0,0,0.75);
}

#qaheadline {
    width: 100%;
    height: 50px;
    text-align: center;
}

.qaheadlinetext {
    font-family: 'Open Sans', sans-serif;
    color: rgba(200, 200, 200, 1.0);
    font-size: 16px;
    font-weight: 600;
    line-height: 54px;
    vertical-align: central;
}

#message {
    width: 600px;
    height: 500px;
    float: left;
    text-align: center;
}

#qanote {
    width: 500px;
    text-align: left;
    margin-left: 30px;
    margin-right: 30px;
    font-family: 'Open Sans', sans-serif;
    color: rgba(200, 200, 200, 1.0);
    font-size: 10px;
}

#qaclose {
    width: 299px;
    height: 50px;
    float: left;
    position: absolute;
    bottom: 0px;
    border-top: 1px;
    border-top-style: solid;
    border-top-color: rgba(200, 200, 200, 0.3);
    border-right: 1px;
    border-right-style: solid;
    border-right-color: rgba(200, 200, 200, 0.3);
    line-height: 50px;
    text-align: center;
    vertical-align: central;
    /*border-bottom-left-radius: 15px;
    border-bottom-right-radius: 5px;*/
    font-family: 'Open Sans', sans-serif;
    color: rgba(200, 200, 200, 1.0);
    font-size: 12px;
}

#qasend {
    width: 300px;
    height: 50px;
    float: left;
    position: absolute;
    bottom: 0px;
    right: 0px;
    border-top: 1px;
    border-top-style: solid;
    border-top-color: rgba(200, 200, 200, 0.3);
    line-height: 50px;
    text-align: center;
    vertical-align: central;
    /*border-bottom-left-radius: 5px;
    border-bottom-right-radius: 15px;*/
    font-family: 'Open Sans', sans-serif;
    color: rgba(200, 200, 200, 1.0);
    font-size: 12px;
}

input[type=checkbox].css-checkbox {
    display: none;
}

    input[type=checkbox].css-checkbox + label.css-label {
        padding-left: 40px;
        height: 28px;
        width: 280px;
        display: inline-block;
        line-height: 28px;
        background-repeat: no-repeat;
        background-position: 0 0;
        font-family: 'Open Sans', sans-serif;
        font-size: 14px;
        vertical-align: middle;
        cursor: pointer;
    }

    input[type=checkbox].css-checkbox:checked + label.css-label {
        background-position: 0 -28px;
    }

label.css-label {
    background-image: url(../images/checkbox.png);
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

#qasent {
    position: absolute;
    background-color: rgba(37, 40, 42, 0.95);
    width: 300px;
    height: 150px;
    top: 50%;
    left: 50%;
    margin: -75px 0 0 -150px; /*sets new anchor point of div. 50% of the heights and 50% of the width to center*/
    /*border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;*/
    -webkit-box-shadow: 0px 0px 85px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 0px 85px 0px rgba(0,0,0,0.75);
    box-shadow: 0px 0px 85px 0px rgba(0,0,0,0.75);
}

#qasenttext {
    position: absolute;
    width: 100%;
    height: 100px;
    top: 0px;
    line-height: 100px;
    text-align: center;
    vertical-align: central;
    border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
    font-family: 'Open Sans', sans-serif;
    color: rgba(200, 200, 200, 1.0);
    font-size: 12px;
}

.qasenttexticon {
    color: #0C0;
    font-size: 21px;
}

#qasentok {
    position: absolute;
    width: 100%;
    height: 50px;
    bottom: 0px;
    border-top: 1px;
    border-top-style: solid;
    border-top-color: rgba(200, 200, 200, 0.3);
    line-height: 50px;
    text-align: center;
    vertical-align: central;
    /*border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;*/
    font-family: 'Open Sans', sans-serif;
    color: rgba(200, 200, 200, 1.0);
    font-size: 12px;
}
/*PANEL Streams*/
#livestream_cover {
    z-index: 5;
}

.connection_status {
    width: 94%;
    height: 15px;
    display: block;
    float: left;
    background-color: rgba(0,0,0,0.75);
    font-family: 'Open Sans', sans-serif;
    color: rgba(200, 200, 200, 1.0);
    font-size: 10px;
    letter-spacing: 0.5px;
}
/*PANEL*/
/*******************************************************************************/
.panel_streams_open {
    width: 400px;
    height: 100%;
    position: fixed;
    left: 0px;
    background-color: rgba(37, 40, 42, 0.95);
    -webkit-transition: left 0.5s ease;
    -moz-transition: left 0.5s ease;
    -o-transition: left 0.5s ease;
    transition: left 0.5s ease;
    z-index: 6;
}

.panel_streams_close { /*moves outside*/
    width: 400px;
    height: 100%;
    position: fixed;
    left: -400px;
    background-color: none;
}

.panel_btn_open {
    position: fixed;
    left: 0px;
    background-color: rgba(37, 40, 42, 0.95);
    width: 150px;
    height: 50px;
    margin-top: 20px;
    cursor: pointer;
    -webkit-transition: left 0.5s ease;
    -moz-transition: left 0.5s ease;
    -o-transition: left 0.5s ease;
    transition: left 0.5s ease;
}

.panel_btn_open_move {
    position: fixed;
    left: 400px;
    background-color: rgba(37, 40, 42, 0.95);
    width: 150px;
    height: 50px;
    margin-top: 20px;
    cursor: pointer;
}

.panel_btn_close {
    position: fixed;
    left: 400px;
    background-color: rgba(37, 40, 42, 0.95);
    width: 50px;
    height: 50px;
    margin-top: 20px;
    cursor: pointer;
    z-index: 6;
    -webkit-transition: left 0.5s ease;
    -moz-transition: left 0.5s ease;
    -o-transition: left 0.5s ease;
    transition: left 0.5s ease;
}

.panel_btn_close_move {
    position: fixed;
    left: 0px;
    background-color: rgba(37, 40, 42, 0.95);
    width: 50px;
    height: 50px;
    margin-top: 20px;
    cursor: pointer;
    z-index: 6;
}

.panel_btn_icon {
    width: 50px;
    height: 50px;
    line-height: 50px;
    text-align: center;
    vertical-align: central;
    color: rgba(200, 200, 200, 1.0);
    font-size: 16px;
    text-decoration: none;
    margin-top: 16px;
    float: left;
}

.panel_btn_text {
    width: 100px;
    height: 50px;
    line-height: 50px;
    vertical-align: central;
    font-size: 10px;
    text-decoration: none;
    letter-spacing: 1px;
    color: rgba(200, 200, 200, 1.0);
    float: left;
}

.panel_btn_hover {
    background-color: rgba(87, 89, 91, 1.0);
}

#streamlist_headline {
    width: 380px;
    height: 70px;
    border-bottom: 1px;
    border-bottom-style: solid;
    border-bottom-color: rgba(200, 200, 200, 0.3);
    margin-left: 20px;
    line-height: 70px;
    vertical-align: central;
    font-family: 'Open Sans', sans-serif;
    color: rgba(200, 200, 200, 1.0);
    font-size: 16px;
    letter-spacing: 0.5px;
}

.streamlist {
    position: fixed;
    width: 400px;
    background-color: rgba(37, 40, 42, 0.95);
    overflow: auto;
    left: 0px;
    top: 70px;
    bottom: 50px;
    -webkit-transition: left 0.5s ease;
    -moz-transition: left 0.5s ease;
    -o-transition: left 0.5s ease;
    transition: left 0.5s ease;
}

.streamlist_move {
    position: fixed;
    width: 400px;
    background-color: rgba(37, 40, 42, 0.95);
    overflow: auto;
    left: -400px;
    top: 70px;
    bottom: 50px;
}

.stream_counter {
    position: fixed;
    width: 380px;
    height: 50px;
    background-color: rgba(37, 40, 42, 0.95);
    bottom: 0px;
    left: 0px;
    padding-left: 20px;
    line-height: 50px;
    vertical-align: central;
    font-family: 'Open Sans', sans-serif;
    color: rgba(200, 200, 200, 1.0);
    font-size: 11px;
    letter-spacing: 0.5px;
    -webkit-transition: left 0.5s ease;
    -moz-transition: left 0.5s ease;
    -o-transition: left 0.5s ease;
    transition: left 0.5s ease;
}

.stream_counter_move {
    position: fixed;
    width: 380px;
    height: 50px;
    background-color: rgba(37, 40, 42, 0.95);
    bottom: 0px;
    left: -400px;
    padding-left: 20px;
    line-height: 50px;
    vertical-align: central;
    font-family: 'Open Sans', sans-serif;
    color: rgba(200, 200, 200, 1.0);
    font-size: 11px;
    letter-spacing: 0.5px;
}

.date_wrapper {
    width: 400px;
    height: 35px;
    background-color: rgba(30, 30, 30, 0.95);
    border-bottom: 1px;
    border-bottom-style: solid;
    border-bottom-color: rgba(200, 200, 200, 0.5);
}

.date {
    margin-left: 20px;
    font-family: 'Open Sans', sans-serif;
    color: rgba(200, 200, 200, 1.0);
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.5px;
    line-height: 35px;
    vertical-align: central;
}

.streamitem {
    width: 400px;
    height: 100px;
    background-color: rgba(60, 60, 60, 1.0);
    border-bottom: 1px;
    border-bottom-style: solid;
    border-bottom-color: rgba(200, 200, 200, 0.3);
}

.times {
    width: 360px;
    margin-left: 20px;
    padding-top: 10px;
    font-family: 'Open Sans', sans-serif;
    color: #ffffff;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.5px;
}

.title {
    width: 360px;
    margin-left: 20px;
    font-family: 'Open Sans', sans-serif;
    color: #ffffff;
    font-size: 11px;
    letter-spacing: 0.5px;
}

.livenow {
    width: 360px;
    margin-left: 20px;
    font-family: 'Open Sans', sans-serif;
    color: #0C0;
    font-size: 11px;
    letter-spacing: 0.5px;
    padding-top: 10px;
}
/*CHAT*/
.chatpopup {
    position: fixed;
    background-color: rgba(37, 40, 42, 0.95);
    width: 450px;
    height: 640px;
    top: 50%;
    right: -535px;
    margin: -320px 0 0 0; /*sets new anchor point of div. 50% of the heights and 50% of the width to center*/
    -webkit-box-shadow: 0px 0px 85px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 0px 85px 0px rgba(0,0,0,0.75);
    box-shadow: 0px 0px 85px 0px rgba(0,0,0,0.75);
    -webkit-transition: right 0.5s ease;
    -moz-transition: right 0.5s ease;
    -o-transition: right 0.5s ease;
    transition: right 0.5s ease;
    z-index: 6;
}

.chat_move {
    position: fixed;
    background-color: rgba(37, 40, 42, 0.95);
    width: 450px;
    height: 640px;
    top: 50%;
    right: 0px;
    margin: -320px 0 0 0; /*sets new anchor point of div. 50% of the heights and 50% of the width to center*/
    -webkit-box-shadow: 0px 0px 85px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 0px 85px 0px rgba(0,0,0,0.75);
    box-shadow: 0px 0px 85px 0px rgba(0,0,0,0.75);
    z-index: 6;
}

#chatheadline {
    width: 100%;
    height: 50px;
    text-align: center;
}

.chatheadlinetext {
    font-family: 'Open Sans', sans-serif;
    color: rgba(200, 200, 200, 1.0);
    font-size: 16px;
    font-weight: 600;
    line-height: 54px;
    vertical-align: central;
}

#chatclose {
    width: 450px;
    height: 50px;
    float: left;
    position: absolute;
    bottom: 0px;
    border-top: 1px;
    border-top-style: solid;
    border-top-color: rgba(200, 200, 200, 0.3);
    line-height: 50px;
    text-align: center;
    vertical-align: central;
    font-family: 'Open Sans', sans-serif;
    color: rgba(200, 200, 200, 1.0);
    font-size: 12px;
}

#chatwindow {
    height: 450px;
}



table {
    width: 90%;
    overflow: scroll;
    margin-left: 25px;
}

td {
    vertical-align: top;
}

#chathistory {
    width: 90%;
    margin-left: 25px;
    height: 350px;
    overflow: auto;
    background-color: rgba(30, 30, 30, 1.00);
    padding-bottom: 10px;
}


div.history {
    padding: 15px;
    height: 350px;
}

    div.history .message {
        clear: both;
        color: rgba(200, 200, 200, 1.0);
        font-family: 'Open Sans', sans-serif;
        font-size: 11px;
    }

        div.history .message .sender {
            width: 60px;
            float: left; /*border:1px solid #000;*/
            white-space: nowrap;
            font-weight: bold;
            font-family: 'Open Sans', sans-serif;
            color: rgba(200, 200, 200, 1.0);
            font-size: 11px;
        }

        div.history .message .text {
        }

div.chat {
    height: 25px;
    width: 83%;
    margin-left: 25px;
    margin-top: 10px;
    margin-bottom: 25px;
}

    div.chat input {
        margin: 0;
    }


div.history .join {
    text-align: center;
    color: #686868;
    font-family: 'Open Sans', sans-serif;
    font-style: italic;
    font-size: 11px;
}

td.chat input {
}

div.occupancy {
    text-align: left;
    padding: 0 10px;
    vertical-align: middle;
    font-size: 14px;
    margin-bottom: 10px;
    margin-left: 25px;
    font-family: 'Open Sans', sans-serif;
    color: rgba(200, 200, 200, 1.0);
    font-size: 10px;
}

.chattextbox {
    padding: 10px 10px 10px 30px;
    width: 96%;
    border: 1px solid rgba(200, 200, 200, 1.0);
    font-family: 'Open Sans', sans-serif;
    font-size: 12px;
}

.chattextbox_icon_chat {
    background: #F1F1F1 url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAABbklEQVQ4T2NkoBAwoutPS0tjffv2reufP38cmJmZ+f/+/fuCiYlpx/r1649jswvFgODgYPf///9PB2JFdMWMjIwngeKJQIOuI8vBDQgAAqDEaqBCFly+AhrwHohtNm7ceA2mBmyAn5+fONCZt4GaeYkIkissLCwGq1ev/gtSCzbA39+/BWhANRGaYUqCgV5ZBzcA6PozQNuNobK/gTQrPva/f/9mA72RhmzAC6AB4kCJacCQbwH68wmQPQMbG6iJCYhBseIJNyAoKOg2UJMKEN8FGnQCKBGNiw3SBJRbtWHDhnBkFywGaowhNgyArisCeqEfboCvr68TMGT3EmsAUF0y0Avz4AZAY2IpMCaiiDRkH9AAZxQD3NzcuHl4eJYA/QdKUNjAP6DcUaCEJdC7TEAXKwLTwiP0vMAIjNIgoKI0oCJzIM0PxF+A7D1AunPdunUnXF1dpXh5eRN+/Pixedu2bZcxMhORXoAro9gAAJ1WpRFSYY0hAAAAAElFTkSuQmCC) no-repeat 8px center;
}

#chatnote {
    width: 83%px;
    text-align: left;
    margin-left: 30px;
    margin-right: 30px;
    font-family: 'Open Sans', sans-serif;
    color: rgba(200, 200, 200, 1.0);
    font-size: 10px;
}
/*LOGIN*/
.logincover {
    position: fixed;
    background-color: rgba(210, 210, 210, 0.8);
    width: 100%;
    height: 100%;
    z-index: 9998;
}

#login_wrapper {
    position: fixed;
    background-color: rgba(0, 90, 132, 0.9);
    width: 500px;
    height: 600px;
    top: 50%;
    left: 50%;
    margin: -300px 0 0 -250px; /*sets new anchor point of div. 50% of the heights and 50% of the width to center*/
    /*border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;*/
    -webkit-box-shadow: 0px 0px 85px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 0px 85px 0px rgba(0,0,0,0.75);
    box-shadow: 0px 0px 85px 0px rgba(0,0,0,0.75);
}

#login {
    width: 440px;
    height: 310px;
    margin-left: 30px;
    margin-right: 30px;
    margin-top: 10px;
    float: left;
}

#spacer {
    width: 1px;
    height: 310px;
    background-color: rgba(200, 200, 200, 0.3);
    float: left;
    margin-top: 20px;
}

#register {
    width: 359px;
    height: 310px;
    margin-top: 10px;
    margin-left: 30px;
    float: left;
}

.login_headline {
    width: 100%;
    height: 50px;
    line-height: 50px;
    vertical-align: central;
    font-family: 'Open Sans', sans-serif;
    color: rgba(255,255,255,1.0);
    font-size: 19px;
    display: inline;
    font-weight: 600
}
.login_btn_wrapper {
    width: 100%;
    height: 50px;
    line-height: 50px;
    vertical-align: central;
    text-align:center;

}
.btn {
    width: 200px;
/* margin-left: 119px; */
height: 50px;
line-height: 50px;
vertical-align: central;
background-color: rgba(0, 49, 72, 1.0);
font-family: 'Open Sans', sans-serif;
color: rgba(255,255,255,1.0);
font-size: 11px;
letter-spacing: 0.5px;
margin-top: 20px;
border: 0px;
cursor: pointer;
 -webkit-appearance: none;
  -webkit-border-radius: 0;
}
.btn_hover {
    width: 200px;
/* margin-left: 119px; */
height: 50px;
line-height: 50px;
vertical-align: central;
background-color: rgba(255,255,255,1.0);
font-family: 'Open Sans', sans-serif;
color:  rgba(0, 49, 72, 1.0);
font-size: 11px;
letter-spacing: 0.5px;
margin-top: 20px;
border: 0px;
cursor: pointer;
 -webkit-appearance: none;
  -webkit-border-radius: 0;
}
.pwinput {
    padding: 10px 10px

}
#signup_text {
    width: 100%;
    height: 50px;
    margin-bottom:10px;
    font-family: 'Open Sans', sans-serif;
    color: rgba(255,255,255,1.0);
    font-size: 11px;
     letter-spacing: 0.5px;
}
#login_inputs {
     width: 100%;
}
.userinput {
    padding: 5px 10px 5px 10px;
    width: 320px;
    border: 1px solid rgba(200, 200, 200, 1.0);
    font-family: 'Open Sans', sans-serif;
    font-size: 11px;
   margin-left: 50px;
   margin-bottom:15px;
}

.email_login_icon {
    background: #F1F1F1 url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAABWUlEQVQ4T6WTvUvDUBTFexMTEnAQXGxHR0PIpzgIEnfBVQcdBSftKlREca4ugqNQdHLwL3CRLk2CS9DJSa2ggwQhNCGJJyUtCh0S8pYk953zu+fdR6hWcVFFf40syxJ8398movkysDRNX1zXvSLTNG/jOJ6CuVsGwLLsMiAD0nV9kCTJ0iNWGYBhGDoAXcJLigRNhmG+EKlTBKJp2hbMs0jRHgIcx6FFrCiKNgE4RpjvSSBVVWdQP+Q47qaHlXnHgMyAQh3DbIN+BOjzX4iiKBKMLew1sdfP9f8ADAa6h3m8AzIHwSeE15lwFBn1D8Su27Z9jnIyToCPBowHEFxgDk85fRXd1rN31O8Au89hC3juhmF4KghCf3gECM6CIGh5nvdTZIiSJE2LoniCBvvZNb4CsIEOD0XMI40syys8z3cIw1nDuS4BaZQBoPsbrn6n+r9QpuskbeUEv4e/ntvQinxnAAAAAElFTkSuQmCC) no-repeat 8px center;
}
.password_login_icon {
    background: #F1F1F1 url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAB1klEQVQ4T41TTUsCURR1dMbIEKzNbNxEBW1UxlGSaCEuDVq5EaIfULugNhFZuCvaBP2BimjTxkWtykWklOMXuOmD9i6CGDEdP6Zzw7FxmsIHj5l777nn3vvOe4zFZAWDwflut7uF0FwvnG21WslyuZw1whmjIxAIxFVVPep0Ojscx11RHHYUO4G9ls/nL/Q5AwQej2fcbrc/MwxDCSEAXSCCybzj+wjCFHzTkiR9aCQDBKi+gkAM+xAjTKDaJQHhjzWbzSrIN0F0XiwWz0wJRFHcRuIoqtcw80GlUlF6wBHE1hFzwq4XCoXkXx0ktEAul+v/97owjfVH8Hq9k2jxGNWpCq07wwEvkI3zkBVFWYUib9+2BvL7/U8IptBm1aiM3kYB3mazRXGQswMEmFGF85esZmR6bD/BjEAQhCV0pUINkq+/hiYAkPSmzlzDELQbjYZDJ50FBLc9goiOgCStgZQznsEr2o1DvgcN7PP5BPovlUoFzQe1QizLnmCsGSPBHhwimBf/UwFqXaPQPXCE/5GR5/kxt9t9Q/eeHo7T6ZTS6XSbQOFwmJVlWYR/F3E6jwgI6gMEZGA2B+76htVqXYY5Ra+I/EhU8XmBeYrLtp/JZD61Lr8A8q/rEZe6Ss4AAAAASUVORK5CYII=) no-repeat 8px center;
}
.pwinput {
    padding: 10px 10px 10px 30px;
    width: 289px;
    border: 1px solid rgba(200, 200, 200, 1.0);
    font-family: 'Open Sans', sans-serif;
    font-size: 12px;
    margin-top: 20px;

}
#register_text {
     width: 100%;
    height: 210px;
     font-family: 'Open Sans', sans-serif;
    color: rgba(255,255,255,1.0);
    font-size: 11px;
     letter-spacing: 0.5px;
    margin-top:10px;
}
#forgot_password {
     width: 100%;
    height: 40px;
    font-family: 'Open Sans', sans-serif;
    color: rgba(200,200,200,1.0);
    font-size: 11px;
     letter-spacing: 0.5px;
}
#loginerror {
    width: 230px;
 display: inline;
    margin-left: 135px;
    margin-bottom: 5px;
    height: 15px;
    /*background-color: rgba(255, 0, 0, 1.0);*/
    font-family: 'Open Sans', sans-serif;
    color: rgba(255,0,0,1.0);
    font-size: 11px;
    letter-spacing: 0.5px;
    visibility: hidden;
}
.loginerror_icon {
 background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAACaklEQVQ4T2NkwA4YgcKyQKwGlb4FpB8D8X905SCF2IB6V1dXXXp6ugdIcubMmTvKysqagMybxBjAHRERUb5s2dLqbx8e/GBiZGTk4Fdgj4qKal2xYkUn0ICvyIZgc4Hly2e31wsLcIj/eLGFgYGRjYFDwovh48fPb4Ul1HyBmo/jM4C3oKCgtb+/P/frvWkMf3++AhrAwsDCKc3AJZ/IUFhYOHnChAnVQAM+wwxBcQEPD4/d9SvnFovxfZT7cnciw9xtnAzMzMwMiZ5/GLgV0xjefOF9Ii2nGQHUfBSbAbzV1dVdLS0tGa8POzP8/fGUIapdiuH3798Mq6ofM7BwKzGI2u7DcAXcBTIyMg4nj+9fIsL1WvrVASuwBbbFCmD6cO8DMC1qd4Dh7TexZ9LyWmEwV4ANCAwMFNbT02ttaGhIf3sylOH7s/XAGP/L4NWgC9a4reEymGYXdQC6Yj9DUVHRJGA41YDCgvH////cbm5u9osXzJwjyPFS8vVhJ6De72ANNYsVwXRL7H14wINc8f676HNJOe0QoOAxxi1btmjeuHGjtLi4OBHk95+v98EVY2Ogu4JRWVnZad/e3bPFuR8pvT7kgKIntxnCnVyLahTIFa+/Sj+UVVCNYrSysso7evToxBdnS7/9edjDhawUlwGc8hl/hY2nMwP1FjIaGRmlnz59esrXz2++/ng8m52d+Q8HPj/8/M36nU06+gefkJyAhYVFHigWVJubm2tzc3M9+Pn5RfEGAFTy8+fP75cuXbovMzOzBmQACEsBsSYQiwExGxCzAjELEDND5UHZ+A8U/wbS74AYFLcPAXkB4arFmE5FAAAAAElFTkSuQmCC) no-repeat 0px center;
}
#loginlogo {
width: 100%;
height: 40px;
}
#livestreamdate {
width: 100%;

 font-family: 'Open Sans', sans-serif;
    color: rgba(255,255,255,1.0);
    font-size: 11px;

     margin-top: 15px;
}
#livestreaminfo {
width: 100%;
height: 40px;
 font-family: 'Open Sans', sans-serif;
    color: rgba(255,255,255,1.0);
    font-size: 14px;
    font-weight: 600;

}
#reg_spacer_dark {
width: 100%;
height: 1px;
 background-color: rgba(29, 31, 33, 0.2);

}
#reg_spacer_light {
width: 100%;
height: 1px;
background-color: rgba(137, 140, 141, 0.3);
}
.input_label {
    font-size: 11px;
    font-family: 'Open Sans', sans-serif;
    color: #fff;
    margin-left:50px;
}