/* ---------------------------------------------------------------------------------------------------------------------------- CSS Reset */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, font, img, input, ins, kbd, q, s, samp, small, strike, sub, sup, textarea, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline; }
:focus { outline: none; }
ol, ul { list-style: none; }
table { border-collapse: collapse; border-spacing: 0; }
caption, th, td { text-align: right; font-weight: normal; }
blockquote:before, blockquote:after, q:before, q:after { content: ""; }
blockquote, q { quotes: "" ""; }
a { outline: none; }

/* ---------------------------------------------------------------------------------------------------------------------------- Typography */
body { font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; font-size: 8pt; line-height: 1.4; /*overflow-x: hidden;*/ }
input, 
select, 
textarea { font-family: Consolas, "Courier New", Courier, monospace; }
h1, 
#videos h3 { text-indent: -9999px; overflow: hidden; }

/* ---------------------------------------------------------------------------------------------------------------------------- Layout */
html,
body { width:100%; height:100%; }
.hidden { display: none; }
#background { position:absolute; top:0; left:0; width:100%; height:100%; overflow:hidden; }
#background img { width:100%; }
h1 { position: absolute; right: 60px; top: 10px; width: 160px; height: 44px; background: url(../img/logo2.png) no-repeat left top; }
h1 a { display: block; height: 44px; }
p#disclaimer-si-regulament { position: absolute; left: -197px; bottom: 4px; width: 395px; padding: 3px 0; text-indent: 9px; background-color: #1F1E1E; opacity: .78; color: #FFF; }
p#disclaimer-si-regulament a { color: #FFF; }
.center { position:absolute; left:50%; top:0; width:1px; height:100%; }
#fereastra { position: absolute; right: -225px; top: 10px; width: 450px; }

/* ---------------------------------------------------------------------------------------------------------------------------- Z-Index */
h1 { z-index: 100; }
p#disclaimer-si-regulament { z-index: 100; }
.center { z-index: 150; }
#youtube { z-index: 150; }
#fereastra { z-index: 300; }
#videos { z-index: 200; }
#ui-datepicker-div { z-index: 400; }
#overlay { z-index: 500; }

/* ---------------------------------------------------------------------------------------------------------------------------- Fereastra */
.fereastra { padding-top: 30px /*43px*/; background: url(../img/bg-fereastra-top-and-repeat.png) no-repeat left top; }
.fereastra .inner { padding-bottom: 30px; background: url(../img/bg-fereastra-bottom.png) no-repeat left bottom; }
.fereastra h2 { padding: 0 20px; font-family: Consolas, "Courier New", Courier, monospace; font-size: 2.2em; font-weight: 700; line-height: 1.2; text-align: center; color: #B7B5B5; background: url(../img/bg-fereastra-top-and-repeat.png) repeat-y -450px; }
.fereastra#ghici-strada h2 { padding-bottom: 10px; }
.fereastra#date-personale h2,
.fereastra#date-trimise h2 { color:  #00FF00; }
.fereastra#raspuns-gresit h2 { color: #FF0000; }
.fereastra h3, 
.fereastra p { padding: 10px 20px 0 20px; font-family: "Courier New", Courier, monospace; font-size: 1.2em; font-weight: 700; text-align: center; color: #B7B5B5; background: url(../img/bg-fereastra-top-and-repeat.png) repeat-y -450px; }
.fereastra a { display: block; padding: 10px 0 0 0; font-family: "Courier New", Courier, monospace; font-size: 1.8em; font-weight: 700; text-align: center; color: #FF0000; background: url(../img/bg-fereastra-top-and-repeat.png) repeat-y -450px; }

/* ------------------------------------------------------ Fereastra form */
.fereastra form p {height: auto; text-indent: 0; text-align: right; font-weight: 700; color: #B7B5B5; padding: 20px 50px 0 0; font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; font-size: 8pt; line-height: 1.4;}
.fereastra#raspuns-gresit form p { font-family: background: url(../img/bg-fereastra-top-and-repeat.png) repeat-y -450px; }
.fereastra form fieldset.radio p { padding: 0 50px 3px 0; background-image: none; }
.fereastra form fieldset label { font-weight: 700; color: #B7B5B5; }
.fereastra form fieldset.text.error label,
.fereastra form fieldset.checkbox.error label { color: #ED1B2D; }
.fereastra form fieldset.text label span,
.fereastra form fieldset.checkbox label span { display: none; }
.fereastra form fieldset.text.error label span,
.fereastra form fieldset.checkbox.error label span { display: inline; color: #ff9900; }
.fereastra form fieldset.text { background: url(../img/bg-fereastra.png) no-repeat 0 -324px; }
.fereastra form fieldset.text.large { background: url(../img/bg-fereastra.png) no-repeat -450px -324px; }
.fereastra form fieldset.text input { width: 315px; height: 16px; padding: 1px 0 0 0; margin: 8px 0 0 67px/*81px*/; font-weight:700; background: url(../img/transparent.png) repeat; color: #cc0000; }
.fereastra form fieldset.text.large input { width: 338px; height: 27px; padding: 5px 0 0 0; margin: 14px 0 0 58px; font-size: 12pt; }
.fereastra form fieldset.text label { display: block; height: 16px; padding: 2px 50px 0 0; text-align: right; background: url(../img/bg-fereastra-top-and-repeat.png) repeat-y -450px; }
.fereastra form fieldset.text.optional label { padding-right: 57px; }
.fereastra form fieldset.checkbox, 
.fereastra form fieldset.radio { padding: 10px 0 0 0; background: url(../img/bg-fereastra-top-and-repeat.png) repeat-y -450px; }
.fereastra form fieldset.checkbox input { float: right; height: 10px; width: 10px; margin: 0 5px 0 0; }
.fereastra form fieldset.checkbox label { float: right; padding: 0 50px 0 0; }
.fereastra form fieldset.radio input { float: right; width: 13px; height: 13px; }
.fereastra form fieldset.radio label { float: right; padding: 0 5px; margin: 0 55px 0 0; }
.fereastra form fieldset.radio label#informari-da-label { margin-right: 20px; }
/*.fereastra form fieldset.submit { background: url(../img/bg-fereastra.png) no-repeat -450px -294px; }*/
.fereastra form fieldset.submit input { width: 100%; padding: 10px 0 0 0; font-family: "Courier New", Courier, monospace; font-size: 1.8em; font-weight: 700; text-decoration: underline; cursor: pointer; text-align: center; color: #FF0000; background: url(../img/bg-fereastra-top-and-repeat.png) repeat-y -450px; }

.fereastra#ghici-strada .inner { background-image: none;}
.fereastra#ghici-strada h3 { padding-top: 45px; height: 80px; font-size: 1.6em; color: #70ca08; background: url(../img/bg-fereastra-bottom-mai-sunt.png) no-repeat left top;}

/* ---------------------------------------------------------------------------------------------------------------------------- Videos */
#videos { position: absolute; left: -197px; bottom: 30px; width: 395px; height: 157px; background: url(../img/bg-alte-ferestre.png) no-repeat left top; }
#videos.expanded { width: 540px; height: 437px; left: -270px; background-position: 0 -157px; }
#videos h3 { height: 40px; }
#videos ul#video-list { height: 96px; overflow: hidden; }
#videos ul#video-list li { display: none; height: 96px; color: #FFF; cursor: pointer; }
#videos ul#video-list li.current { display: block; }
#videos ul#video-list li h4 { float: left; width: 200px; padding: 23px 0 0 10px; }
#videos ul#video-list li p { float: right; padding: 23px 20px 0 0; }
#videos ul#video-list li img { float: left; padding: 0 0 0 20px; }
#videos ul#video-list li a { display: block; color: #FFF; text-decoration: none; cursor: pointer; }
#videos ul#video-search { display: none; position: absolute; right: 25px; top: 199px; width: 32px; height: 82px; }
#videos ul#video-search li { height: 41px; text-indent: -9999px; overflow: hidden; cursor: pointer; }
#videos.expanded h3 { height: 68px; }
#videos.expanded ul#video-list { height: 355px; }
#videos.expanded ul#video-list li { width: 460px; height: 116px; margin: 0 0 0 20px; }
#videos.expanded ul#video-list li a { display: block; height: 96px; padding: 10px; }
#videos.expanded ul#video-list li a:hover { background-color: #000; opacity: 0.7; }
#videos.expanded ul#video-list li img { padding: 0; }
#videos.expanded ul#video-list li p { padding: 23px 0 0 0; }
#videos.expanded ul#video-search { display: block; }
#videos.pardon { background-image: url(../img/bg-alte-ferestre-fara-sageti.png); }
#videos.expanded.pardon ul#video-search { display: none; }

/* ---------------------------------------------------------------------------------------------------------------------------- Movie time */
#youtube { display: none; position: absolute; left:-230px; top: 30px; width: 425px; height: 344px; padding: 19px 18px 32px 18px; background: url(../img/bg-alte-ferestre.png) no-repeat 0 -594px; }
#youtube a { position: absolute; right: 0; bottom: 0; width: 80px; height: 30px; text-indent: -9999px; overflow: hidden; }
body.movie-time { height: 100%; }
.movie-time #youtube { display: block; }
.movie-time #fereastra .fereastra,
.movie-time #frame { display: none; }

/* ---------------------------------------------------------------------------------------------------------------------------- Overlay */
div#overlay { position:fixed; width: 100%; height: 100%; left: 0; top: 0; opacity: 0.95; background-color: #000; }
div#overlay #loading { position: absolute; left: 100px; top: 100px; font-size: 14px; font-weight: 700; color: #CC0000; }

/* ---------------------------------------------------------------------------------------------------------------------------- Date Picker */
#ui-datepicker-div { padding: 10px 8px; border: 5px solid #2b2323; background: #000; color: #E6E6E6; cursor: default; }
#ui-datepicker-div .ui-datepicker-header { padding: 0 0 0 10px; }
#ui-datepicker-div table.ui-datepicker tr td { padding: 0 10px 0 10px; }
#ui-datepicker-div table.ui-datepicker thead tr td { padding: 10px 10px 0 10px; }
#ui-datepicker-div .ui-datepicker-days-cell { cursor:pointer; }

/* ---------------------------------------------------------------------------------------------------------------------------- Clearfix */
.clearfix:after{ content: " ";  display: block;  height: 0;  clear: both;  visibility: hidden}
.clearfix{display: inline-block}
/* Hides from IE-mac \*/
* html .clearfix{height: 1%}
.clearfix{display: block}
/* End hide from IE-mac */

/* ---------------------------------------------------------------------------------------------------------------------------- Debug */
#debug{display:none;font-size:9pt;color:red;z-index:1000;position:absolute;bottom:0;font-family:ProFontWindows, Consolas;background:#ccc}