/* FONTS */ @font-face{font-family:'speak_bold';src:url('bloomspeak/f_b.eot');src:local("f_b"),url('bloomspeak/f_b.woff') format('woff')} @font-face{font-family:'speak_heavy';src:url('bloomspeak/f_h.eot');src:local("f_h"),url('bloomspeak/f_h.woff') format('woff')} @font-face{font-family:'speak_regular';src:url('bloomspeak/f_r.eot');src:local("f_r"),url('bloomspeak/f_r.woff') format('woff')} html, body {padding: 0; margin: 0;} body {margin: 0 auto; color: #000; background-color: #deedf2; font-family: 'speak_bold', Sans-serif; font-size: 16px; line-height: 150%;} img, video, canvas {max-width: 100%;} .pointer:hover {cursor: pointer;} img.poweredby {vertical-align: middle;} /*h1 {color: #fff; text-shadow: 0 1px 0 #666, 0 2px 0 #5e331a, 0 2px 0 #5e331a, 0 2px 0 #5e331a, 0 3px 0 #5e331a, 0 6px 1px rgba(0,0,0,.1), 0 0 5px rgba(0,0,0,.1), 0 1px 3px rgba(0,0,0,.3), 0 3px 5px rgba(0,0,0,.2), 0 5px 10px rgba(0,0,0,.25), 0 10px 10px rgba(0,0,0,.2), 0 20px 20px rgba(0,0,0,.15); }*/ #floating-logo {position: fixed; top: -200px; right: 200px; z-index: 100;} ul.basic {list-style-type: disc; margin: 0; padding-left: 20px;} ul {list-style-type: circle; margin-left: 20px;} /** WRAPPERS **/ .wrapper, .wrapper-menu {display: block; max-width: 1020px; margin: 0 auto; border: 0; padding: 0;} #footer {text-align: center; color: #fff; background-color: #222; padding: 3px; font-size: 0.9em;} #preload {width: 1px; height: 1px; overflow: hidden; position: absolute; top: 0; left: 0;} .loading {background: url('../graphics/ico_loading.gif') no-repeat center center;} /** NAVIGATION DEFAULT **/ nav {font-weight: normal;} nav ul {margin: 0 auto; padding: 15px 0 0 0; border: 0;} nav li {display: inline; float: left;} nav a {display: inline-block; text-decoration: none!important; font-weight: bold; text-transform: none; border: 0; text-align: center; padding: 0; font-size: 1.2em; padding: 0 30px 0 0;} nav li a {box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;} nav a:hover {text-decoration: none; color: #5e331a!important;} nav a.nav-active {color: #3498db!important;} #projekt {position: relative; margin: 0 auto; width: 100%; max-width: 1920px; background: url('../graphics/backgrounds/pozadie.jpg') #deedf2 50% 0 no-repeat fixed;} #internet {position: relative; margin: 0 auto; width: 100%; max-width: 1920px; background: #fff 50% 0 no-repeat fixed;} /* Introduction #home article { background: url("../graphics/intro.png") no-repeat scroll center top transparent; height: 458px; position: absolute; text-indent: -9999px; top: 291px; width: 100%; } #about article { background: url("../images/parallax.png") no-repeat scroll center top transparent; height: 458px; position: absolute; text-indent: -9999px; top: 291px; width: 100%; } */ /** floating sidebar **/ #sidebar {display: block; width: 200px; position: fixed; top: 320px; right: 0; z-index: 999;} #sidebar a {display: block; margin: 0 0 10px 0; padding: 20px 0 20px 20px; background-color: #cc6633; color: #fff; font-size: 1.4em; text-decoration: none; moz-border-top-left-radius: 6px; -webkit-border-top-left-radius: 6px; border-top-left-radius: 6px; moz-border-bottom-left-radius: 6px; -webkit-border-bottom-left-radius: 6px; border-bottom-left-radius: 6px; } #sidebar a:hover {color: #fff; background-color: #cc9999;} a.countdown {color: #fff; background-color: #cc3366!important; } #mobile-sidebar {display: block; width: 60px; position: fixed; top: 90px; right: 0; z-index: 999;} #mobile-sidebar a {display: block; margin: 0; padding: 20px; background-color: #cc6633; color: #fff; font-size: 1.4em; text-decoration: none; moz-border-top-left-radius: 6px; -webkit-border-top-left-radius: 6px; border-top-left-radius: 6px; moz-border-bottom-left-radius: 6px; -webkit-border-bottom-left-radius: 6px; border-bottom-left-radius: 6px; } #mobile-sidebar a:hover {color: #fff; background-color: #cc9999;} /*#sidebar a.cta {background-color: rgba(212, 116, 52, .9);}*/ /*a.cta {background: rgb(212, 116, 52);}*/ /* basket icon */ .icon-basket {float: left; margin: 3px 12px 0 5px; font-size: 40px!important; color:#fff; animation: scale 5s ease infinite;} .icon-basket-text {display: inline-block; width: 120px; float: left; border: 0;} @keyframes scale { 0% {transform: rotateZ(0deg);transform: rotateY(0deg);} 50% {transform: rotateZ(360deg);transform:rotateY(360deg);} 100% {transform: rotateZ(0deg);transform:rotateY(0deg);} } /** LINKS **/ a:link, a:active, a:visited {text-decoration: underline; color: #339999;} a:hover {text-decoration: underline; color: #b2cfbf;} a:link.logo, a:active.logo, a:visited.logo {display: block; margin: 0 auto; width: 186px; height: 52px; background-image: url('../graphics/logo/tvzadarmo-logo-sprite.png'); background-repeat: no-repeat; background-position: 0 0;} a:hover.logo {background-position: 0 -51px;} a:link.arrow-down-button, a:active.arrow-down-button, a:visited.arrow-down-button {display: block; margin: 0 auto; width: 110px; height: 110px; background-image: url('../graphics/arrow-down-button2-sprite.png'); background-repeat: no-repeat; background-position: 0 0;} a:hover.arrow-down-button {background-position: 0 -112px;} a.button-full {display:block; text-decoration:none!important; margin: 0 0 2% 0; padding: 10px; color: #fff; background-color: #2d4197; text-align: center;} a:hover.button-full {background-color: #46cdec;} a.button {display: inline-block; text-decoration:none!important; margin: 0 0 2% 0; padding: 10px 15px; color: #fff; background-color: #cc6633; text-align: center; font-size: 1.2em; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px;} a:hover.button {background-color: #cc9999;} .pdflink {display:block; margin: 10px 0 20px 0; font-size:1em; color:#666!important;} .pdflink a {display:block; line-height: 25px; text-decoration:none; padding: 0 0 0 20px; color:#7b7b7b!important; margin:0; background: url('../graphics/icon-pdf.png') no-repeat 2px 5px;} .pdflink a:hover {color:#6EB7E4!important; text-decoration:underline;} /*#back-to-top {position: fixed; left: 20px; bottom: 20px; display:none;} #back-to-top a {display: block; background-color: #3498db; color: #fff; padding: 15px; text-decoration: none; border:0 none; display: block;} #back-to-top a:hover {opacity: .8; background-color: #c30a29;} */ a.question-mark {display: block; float: right; padding: 1px 7px 1px 7px; background-color: #ccc; font-weight: bold; text-decoration: none;} a:hover.question-mark {background-color: #46cdec; color: #fff; cursor: help;} /** FORMS **/ /* html5 reset. this is necessary to properly align input fields in html5 */ input, select, textarea {box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;} fieldset {border: 0; margin: 0; padding: 0; text-align: left;} .form-item {display: block; margin: 0 0 15px 0;} label {display: block; width: 100%; padding-bottom: 5px; text-align: left; font-weight: normal; border: 0;} label.third {width: 32%;} label.twothirds {width: 65%;} input[type="text"], input[type="email"], input[type="password"] {float: left; width: 100%; padding: 10px; font-size: 0.9em; color: #555; border: 1px solid #ccc; outline: none; -moz-border-radius: 8px; -webkit-border-radius: 8px; border-radius: 8px;} input[type="text"].half, input[type="email"].half, input[type="password"].half {float: left; width: 50%; padding: 10px; font-size: 0.9em; color: #555; border: 1px solid #ccc; outline: none; -moz-border-radius: 8px; -webkit-border-radius: 8px; border-radius: 8px;} input[type="text"].twothirds, input[type="email"].twothirds, input[type="password"].twothirds {float: left; width: 65%; padding: 10px; font-size: 0.9em; color: #555; border: 1px solid #ccc; outline: none; -moz-border-radius: 8px; -webkit-border-radius: 8px; border-radius: 8px;} input[type="text"].third, input[type="email"].third, input[type="password"].third {float: left; width: 32%; padding: 10px; font-size: 0.9em; color: #555; border: 1px solid #ccc; outline: none; -moz-border-radius: 8px; -webkit-border-radius: 8px; border-radius: 8px;} textarea {float: left; width: 100%; padding: 10px; font-size: 0.9em; color: #555; border: 1px solid #ddd; outline: none; -moz-border-radius: 8px; -webkit-border-radius: 8px; border-radius: 8px;} select {float: left; width: 100%; padding: 10px; font-size: 0.9em; color: #555; border: 1px solid #ddd; outline: none; -moz-border-radius: 8px; -webkit-border-radius: 8px; border-radius: 8px;} select.third, input[type="text"].third {float: left; width: 32%; padding: 10px; font-size: 0.9em; color: #555; border: 1px solid #ddd; outline: none; -moz-border-radius: 8px; -webkit-border-radius: 8px; border-radius: 8px;} select.twothirds {float: left; width: 64%; padding: 10px; font-size: 0.9em; color: #555; border: 1px solid #ddd; outline: none; -moz-border-radius: 8px; -webkit-border-radius: 8px; border-radius: 8px;} select.half, input.half {float: left; width: 49%; padding: 10px; font-size: 0.9em; color: #555; border: 1px solid #ddd; outline: none; -moz-border-radius: 8px; -webkit-border-radius: 8px; border-radius: 8px;} /*select {width: 90%; font-family: speak_bold!important; font-family: 2em!important; overflow: hidden; background: url('../graphics/forms/select_arrow.png') no-repeat right #eff2fb!important; -webkit-appearance: none!important;}*/ input[type="text"]:focus, input[type="password"]:focus, input[type="email"]:focus, textarea:focus, select:focus {color: #000; border: 1px solid #00adef; -webkit-box-shadow: 0px 0px 4px #00adef; -moz-box-shadow: 0px 0px 4px #00adef; box-shadow: 0px 0px 4px #00adef;} input[type="text"]:hover, input[type="password"]:hover, input[type="email"]:hover, textarea:hover, select:hover {color: #000; border: 1px solid #00adef; -webkit-box-shadow: 0px 0px 4px #00adef; -moz-box-shadow: 0px 0px 4px #00adef; box-shadow: 0px 0px 4px #00adef;} input[type="submit"] {float: left; width: 100%; cursor: pointer; margin: 0; padding: 5px; background-color: #00aadd; border: 2px solid #00aadd; color: #fff; font-size: 1.2em; text-decoration: none; outline: none; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px;} input[type="submit"].third {float: left; width: 32%; cursor: pointer; margin: 0; padding: 5px; background-color: #ff1a1a; border: 2px solid #ff1a1a; color: #fff; font-size: 1.2em; text-decoration: none; outline: none; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px;} input[type="submit"]:hover {background-color: #46cdeb; border: 2px solid #46cdeb; -webkit-box-shadow: 0px 0px 4px #fff; -moz-box-shadow: 0px 0px 4px #fff; box-shadow: 0px 0px 4px #fff;} input[type="text"]:disabled {background-color: #d3dfee!important;} /* tv stations display */ .prehlad-programov {display: block; float: left; width: 80px; margin: 0; line-height: 60px; padding: 10px 2px; text-align: center; border-right: 1px dashed #ccc; border-bottom: 1px dashed #ccc;} .prehlad-programov-mobile {font-family: arial; display: block; float: left; width: 40px; margin: 0; line-height: 30px; padding: 10px 2px; text-align: center; border-right: 1px dashed #ccc; border-bottom: 1px dashed #ccc;} .prehlad-programov img {vertical-align: middle; border: 0;} .spacerintro {clear:both; display:block; height: 320px; width:100%;} /************** DESKTOPS *************/ @media screen and (min-width: 1000px) { /* default containers with no padding */ .container-whole, .container-whole-half-on-mobiles, .container-whole-third-on-tablet {float: left; width: 99%; margin: 0.5%;} .container-half, .container-half-whole-on-phone, .container-half-whole-on-mobiles {float: left; width: 49%; margin: 0.5%;} .container-third, .container-third-whole-on-mobiles, .container-third-whole-on-phone, .container-third-half-on-mobiles, .container-third-half-tablet-whole-phone {float: left; width: 32.333%; margin: 0.5%;} .container-fourth, .container-fourth-whole-on-mobiles, .container-fourth-whole-on-phone, .container-fourth-half-on-mobiles, .container-fourth-half-on-tablet, .container-fourth-half-on-phone, .container-fourth-half-tablet-whole-phone, .container-fourth-half-tablet-third-phone, .container-fourth-half-tablet-threefourths-phone {float: left; width: 24%; margin: 0.5%;} .container-fifth, .container-fifth-whole-on-mobiles, .container-fifth-whole-on-phone, .container-fifth-half-on-mobiles, .container-fifth-half-on-phone, .container-fifth-half-tablet-whole-phone, .container-fifth-third-tablet-whole-phone, .container-fifth-third-tablet-half-phone, .container-fifth-fourth-tablet-whole-phone, .container-fifth-fourth-tablet-half-phone {float: left; width: 19%; margin: 0.5%;} .container-sixth, .container-sixth-whole-on-mobiles, .container-sixth-half-on-mobiles, .container-sixth-half-tablet-whole-phone, .container-sixth-third-tablet-whole-phone, .container-sixth-third-tablet-half-phone, .container-sixth-fourth-tablet-half-phone {float: left; width: 15.66%; margin: 0.5%;} .container-seventh, .container-seventh-whole-on-mobiles, .container-seventh-third-tablet-half-phone, .container-seventh-fifth-tablet-half-phone {float: left; width: 13.28%; margin: 0.5%;} .container-eighth, .container-eighth-whole-on-mobiles, .container-eighth-whole-on-mobiles, .container-eighth-half-on-mobiles, .container-eighth-half-on-phone, .container-eighth-third-on-mobiles, .container-eighth-third-tablet-half-phone, .container-eighth-fourth-tablet-whole-phone, .container-eighth-fourth-tablet-half-phone, .container-eighth-fifth-on-phone, .container-eighth-twothirds-on-phone {float: left; width: 11.499%; margin: 0.5%;} .container-ninth, .container-ninth-fourth-tablet-half-phone, .container-ninth-fifth-tablet-third-phone, .container-ninth-fifth-tablet-fourth-phone, .container-ninth-seventh-tablet-fourth-phone {float: left; width: 10.1%; margin: 0.5%;} .container-tenth, .container-tenth-fourth-tablet-half-phone, .container-tenth-fifth-tablet-fourth-phone {float: left; width: 9%; margin: 0.5%;} .container-eleventh, .container-eleventh-half-on-mobiles, .container-eleventh-half-tablet-whole-phone, .container-eleventh-third-on-mobiles, .container-eleventh-fifth-tablet-fourth-phone {float: left; width: 8.09%; margin: 0.5%;} .container-sixteenth, .container-sixteenth-fifth-tablet-third-phone, .container-sixteenth-fifth-tablet-fourth-phone, .container-sixteenth-seventh-tablet-fourth-phone, .container-sixteenth-eighth-on-mobiles, .container-sixteenth-eighth-tablet-fourth-phone {float: left; width: 5.249%; margin: 0.5%;} .container-twothirds, .container-twothirds-whole-on-mobiles {float: left; width: 65.6%; margin: 0.5%;} .container-twofourths, .container-twofourths-whole-on-mobiles {float: left; width: 48.99%; margin: 0.5%;} .container-threefourths, .container-threefourths-whole-on-mobiles, .container-threefourths-whole-on-phone {float: left; width: 74%; margin: 0.5%;} .container-threefifths, .container-threefifths-whole-on-mobiles {float: left; width: 59%; margin: 0.5%;} /* padded containers */ .container-whole-padded {float: left; width: 95.999%; margin: 0.5%; padding: 1.5%;} .container-half-padded, .container-half-padded-whole-on-mobiles, .container-half-padded-whole-on-phone {float: left; width: 45.999%; margin: 0.5%; padding: 1.5%;} .container-third-padded, .container-third-padded-whole-on-mobiles, .container-third-padded-whole-on-phone, .container-third-padded-half-tablet-whole-phone {float: left; width: 29.333%; margin: 0.5%; padding: 1.5%;} .container-fourth-padded, .container-fourth-padded-whole-on-mobiles, .container-fourth-padded-whole-on-phone, .container-fourth-padded-half-on-mobiles, .container-fourth-padded-half-on-phone, .container-fourth-padded-half-tablet-whole-phone {float: left; width: 20.999%; margin: 0.5%; padding: 1.5%;} .container-fifth-padded, .container-fifth-padded-half-tablet-whole-phone {float: left; width: 15.999%; margin: 0.5%; padding: 1.5%;} .container-sixth-padded, .container-sixth-padded-third-tablet-whole-phone {float: left; width: 12.666%; margin: 0.5%; padding: 1.5%;} .container-eighth-padded {float: left; width: 8.503%; margin: 0.5%; padding: 1.5%;} .container-tenth-padded {float: left; width: 6.005%; margin: 0.5%; padding: 1.5%;} .container-twothirds-padded, .container-twothirds-padded-whole-on-mobiles, .container-twothirds-padded-whole-on-phone, .container-twothirds-padded-half-tablet-whole-phone {float: left; width: 62.65%; margin: 0.5%; padding: 1.5%;} .container-threefourths-padded, .container-threefourths-padded-whole-on-mobiles, .container-threefourths-padded-half-tablet-whole-phone {float: left; width: 70.99%; margin: 0.5%; padding: 1.5%;} /* device restrictions */ .mobiles-only {display: none!important;} .tablets-only {display: none!important;} .phones-only {display: none!important;} .tablets-phones-only {display: none!important;} #mobile-sidebar {display: none!important;} /* header & navigation */ #header {z-index: 2; width: 100%; position: fixed; overflow: auto; padding: 10px 0 10px 0; background-color: #fff;} div.logo-block {display: block; float: left; width: 163px; border: 0; margin-left: 30px;} div.cmn-icon-block {display: block; float: left; width: 25px; margin-left: 100px;} div.cmn-promo-block {display: block; float: left; width: 150px; } div.desktop-spacer {clear:both; display:block; height: 100px; width:100%;} nav {float: left; text-align: left; border: 0;} nav a#pull {display: none;} h1 {font-size: 5.3em; font-weight: bold;} h2 {font-size: 2em; font-weight: bold;} h3 {font-size: 1.3em; font-weight: bold;} h4 {font-weight: bold;} label {font-size: 1em!important;} .alignleft-center-on-mobiles {text-align: left!important;} #floating-houses {display: block; width: 100%; height: 156px; background: url('../graphics/houses.png') repeat-x center top; position: fixed; bottom: 0; left: 0; z-index: 9;} #floating-city-sign {display: block; width: 150px; height: 295px; background: url('../graphics/znacka-nitra-small.png') repeat-x center top; position: fixed; bottom: 0; right: 15%; z-index: 10;} /* footer logo powered by */ .powered-by-light {display: block; color: #fff;} .powered-by-dark {display: none;} #projekt {height: 1600px; } #internet {height: 1100px;} } /******************* TABLETS ********************************/ @media screen and (min-width: 500px) and (max-width: 1000px) { /* default containers with no padding */ .container-whole, .container-half-whole-on-mobiles, .container-third-whole-on-mobiles, .container-fourth-whole-on-mobiles, .container-fifth-whole-on-mobiles, .container-sixth-whole-on-mobiles, .container-seventh-whole-on-mobiles, .container-eighth-whole-on-mobiles, .container-twothirds-whole-on-mobiles, .container-twofourths-whole-on-mobiles, .container-threefourths-whole-on-mobiles, .container-threefifths-whole-on-mobiles {float: left; width: 99%; margin: 0.5%;} .container-half, .container-whole-half-on-mobiles, .container-half-whole-on-phone, .container-third-half-on-mobiles, .container-third-half-tablet-whole-phone, .container-fourth-half-on-mobiles, .container-fourth-half-on-tablet, .container-fourth-half-tablet-whole-phone, .container-fourth-half-tablet-third-phone, .container-fourth-half-tablet-threefourths-phone, .container-fifth-half-on-mobiles, .container-fifth-half-tablet-whole-phone, .container-sixth-half-on-mobiles, .container-sixth-half-tablet-whole-phone, .container-eighth-half-on-mobiles, .container-eleventh-half-on-mobiles, .container-eleventh-half-tablet-whole-phone {float: left; width: 49%; margin: 0.5%;} .container-third, .container-whole-third-on-tablet, .container-third-whole-on-phone, .container-fifth-third-tablet-half-phone, .container-fifth-third-tablet-whole-phone, .container-sixth-third-tablet-half-phone, .container-sixth-third-tablet-whole-phone, .container-seventh-third-tablet-half-phone, .container-eighth-third-on-mobiles, .container-eighth-third-tablet-half-phone, .container-eleventh-third-on-mobiles {float: left; width: 32.333%; margin: 0.5%;} .container-fourth, .container-fourth-whole-on-phone, .container-fourth-half-on-phone, .container-fifth-fourth-tablet-half-phone, .container-fifth-fourth-tablet-whole-phone, .container-sixth-fourth-tablet-half-phone, .container-eighth-fourth-tablet-whole-phone, .container-eighth-fourth-tablet-half-phone, .container-ninth-fourth-tablet-half-phone, .container-tenth-fourth-tablet-half-phone {float: left; width: 24%; margin: 0.5%;} .container-fifth, .container-fifth-whole-on-phone, .container-fifth-half-on-phone, .container-seventh-fifth-tablet-half-phone, .container-ninth-fifth-tablet-third-phone, .container-ninth-fifth-tablet-fourth-phone, .container-tenth-fifth-tablet-fourth-phone, .container-eleventh-fifth-tablet-fourth-phone, .container-sixteenth-fifth-tablet-third-phone, .container-sixteenth-fifth-tablet-fourth-phone {float: left; width: 19%; margin: 0.5%;} .container-seventh, .container-ninth-seventh-tablet-fourth-phone, .container-sixteenth-seventh-tablet-fourth-phone {float: left; width: 13.28%; margin: 0.5%;} .container-eighth, .container-eighth-half-on-phone, .container-eighth-fifth-on-phone, .container-eighth-twothirds-on-phone, .container-sixteenth-eighth-on-mobiles, .container-sixteenth-eighth-tablet-fourth-phone {float: left; width: 11.499%; margin: 0.5%;} .container-twothirds {float: left; width: 65.6%; margin: 0.5%;} .container-twofourths {float: left; width: 48.99%; margin: 0.5%;} .container-threefourths, .container-threefourths-whole-on-phone {float: left; width: 74%; margin: 0.5%;} .container-threefifths {float: left; width: 59%; margin: 0.5%;} /* padded containers */ .container-whole-padded, .container-half-padded-whole-on-mobiles, .container-third-padded-whole-on-mobiles, .container-fourth-padded-whole-on-mobiles, .container-twothirds-padded-whole-on-mobiles, .container-threefourths-padded-whole-on-mobiles {float: left; width: 95.999%; margin: 0.5%; padding: 1.5%;} .container-half-padded, .container-half-padded-whole-on-phone, .container-third-padded-half-tablet-whole-phone, .container-fourth-padded-half-on-mobiles, .container-fourth-padded-half-tablet-whole-phone, .container-fifth-padded-half-tablet-whole-phone, .container-twothirds-padded-half-tablet-whole-phone {float: left; width: 45.999%; margin: 0.5%; padding: 1.5%;} .container-third-padded, .container-third-padded-whole-on-phone, .container-sixth-padded-third-tablet-whole-phone {float: left; width: 29.333%; margin: 0.5%; padding: 1.5%;} .container-fourth-padded, .container-fourth-padded-whole-on-phone, .container-fourth-padded-half-on-phone {float: left; width: 20.999%; margin: 0.5%; padding: 1.5%;} .container-fifth-padded {float: left; width: 15.999%; margin: 0.5%; padding: 1.5%;} .container-twothirds-padded, .container-twothirds-padded-whole-on-phone {float: left; width: 62.65%; margin: 0.5%; padding: 1.5%;} .container-threefourths-padded, .container-threefourths-padded-half-tablet-whole-phone {float: left; width: 70.99%; margin: 0.5%; padding: 1.5%;} /* device restrictions */ .desktops-only {display: none!important;} .desktops-phones-only {display: none!important;} .phones-only {display: none!important;} #sidebar {display: none!important;} /* header & navigation */ div.logo-block {text-align: center; padding: 10px 0 10px 0; background-color: #fff; box-shadow: none!important;} div.desktop-spacer {display: none;} nav {background-color: #5e331a; border-bottom: 0; height: auto;} nav ul {width: 100%; display: block; height: auto; padding: 0;} nav li {width: 50%; float: left; position: relative;} nav a.last-link {border-right: 1px solid #191919!important;} nav li a {color: #c8976e!important; border-bottom: 1px solid #191919; border-right: 1px solid #191919; font-size: 1.1em;} nav a {text-align: left; width: 100%; text-indent: 0; color: #fff; padding: 10px; } nav a:hover {color: #fff!important;} nav a#pull {display: block; height: 30px; position: relative; width: 93%; margin: 0; text-align: right; outline: none; text-decoration: none;} nav a#pull:after {display: inline-block; width: 20px; height: 20px; content: ""; background: url('../graphics/menucream.png') no-repeat; border: 0; position: relative; left: 10px; top: 5px;} nav a#pull:hover:after {background: url('../graphics/menufff.png') no-repeat;} h1 {font-size: 3em; font-weight: bold;} h2 {font-size: 2em; font-weight: bold;} h3 {font-size: 1.3em; font-weight: bold;} h4 {font-weight: bold;} label {font-size: 1em!important;} .alignleft-center-on-mobiles {text-align: center!important;} /* footer logo powered by */ .powered-by-light {display: block; color: #fff;} .powered-by-dark {display: none;} } /*********** SMARTPHONES *************/ @media screen and (max-width: 500px) { /* default containers with no padding */ .container-whole, .container-whole-third-on-tablet, .container-half-whole-on-mobiles, .container-half-whole-on-phone, .container-third-whole-on-mobiles, .container-third-whole-on-phone, .container-third-half-tablet-whole-phone, .container-fourth-whole-on-mobiles, .container-fourth-whole-on-phone, .container-fourth-half-on-phone, .container-fourth-half-tablet-whole-phone, .container-fifth-whole-on-mobiles, .container-fifth-whole-on-phone, .container-fifth-half-tablet-whole-phone, .container-fifth-third-tablet-whole-phone, .container-fifth-fourth-tablet-whole-phone, .container-sixth-whole-on-mobiles, .container-sixth-third-tablet-whole-phone, .container-seventh-whole-on-mobiles, .container-eighth-whole-on-mobiles, .container-eighth-fourth-tablet-whole-phone, .container-twothirds-whole-on-mobiles, .container-twothirds-padded-whole-on-phone, .container-twofourths-whole-on-mobiles, .container-threefourths-whole-on-mobiles, .container-threefourths-whole-on-phone, .container-threefifths-whole-on-mobiles {float: left; width: 99%; margin: 0.5%;} .container-half, .container-whole-half-on-mobiles, .container-third-half-on-mobiles, .container-fourth-half-on-mobiles, .container-fifth-half-on-mobiles, .container-fifth-half-on-phone, .container-fifth-third-tablet-half-phone, .container-fifth-fourth-tablet-half-phone, .container-sixth-half-on-mobiles, .container-sixth-third-tablet-half-phone, .container-sixth-fourth-tablet-half-phone, .container-seventh-third-tablet-half-phone, .container-seventh-fifth-tablet-half-phone, .container-eighth-half-on-mobiles, .container-eighth-half-on-phone, .container-eighth-third-tablet-half-phone, .container-eighth-fourth-tablet-half-phone, .container-ninth-fourth-tablet-half-phone, .container-tenth-fourth-tablet-half-phone, .container-eleventh-half-on-mobiles {float: left; width: 49%; margin: 0.5%;} .container-third, .container-fourth-half-tablet-third-phone, .container-eighth-third-on-mobiles, .container-ninth-fifth-tablet-third-phone, .container-eleventh-third-on-mobiles, .container-sixteenth-fifth-tablet-third-phone {float: left; width: 32.333%; margin: 0.5%;} .container-fourth, .container-fourth-half-on-tablet, .container-ninth-fifth-tablet-fourth-phone, .container-tenth-fifth-tablet-fourth-phone, .container-ninth-seventh-tablet-fourth-phone, .container-eleventh-fifth-tablet-fourth-phone, .container-sixteenth-fifth-tablet-fourth-phone, .container-sixteenth-seventh-tablet-fourth-phone, .container-sixteenth-eighth-tablet-fourth-phone {float: left; width: 24%; margin: 0.5%;} .container-fifth, .container-eighth-fifth-on-phone {float: left; width: 19%; margin: 0.5%;} .container-sixth {float: left; width: 15.66%; margin: 0.5%;} .container-eighth, .container-sixteenth-eighth-on-mobiles {float: left; width: 11.499%; margin: 0.5%;} .container-threefifths {float: left; width: 59%; margin: 0.5%;} .container-twothirds, .container-eighth-twothirds-on-phone {float: left; width: 65.6%; margin: 0.5%;} .container-twofourths {float: left; width: 48.99%; margin: 0.5%;} .container-threefourths, .container-fourth-half-tablet-threefourths-phone {float: left; width: 74%; margin: 0.5%;} /* padded containers */ .container-whole-padded, .container-half-padded-whole-on-mobiles, .container-half-padded-whole-on-phone, .container-third-padded-whole-on-mobiles, .container-third-padded-whole-on-phone, .container-third-padded-half-tablet-whole-phone, .container-fourth-padded-whole-on-mobiles, .container-fourth-padded-whole-on-phone, .container-fourth-padded-half-tablet-whole-phone, .container-fifth-padded-half-tablet-whole-phone, .container-sixth-padded-third-tablet-whole-phone, .container-twothirds-padded-whole-on-mobiles, .container-twothirds-padded-half-tablet-whole-phone, .container-threefourths-padded-whole-on-mobiles, .container-threefourths-padded-half-tablet-whole-phone {float: left; width: 93.999%; margin: 0.5%; padding: 2.5%;} .container-half-padded, .container-fourth-padded-half-on-mobiles, .container-fourth-padded-half-on-phone {float: left; width: 43.999%; margin: 0.5%; padding: 2.5%;} .container-third-padded {float: left; width: 27.333%; margin: 0.5%; padding: 2.5%;} .container-fourth-padded {float: left; width: 18.999%; margin: 0.5%; padding: 2.5%;} .container-fifth-padded {float: left; width: 13.999%; margin: 0.5%; padding: 2.5%;} .container-twothirds-padded {float: left; width: 60.65%; margin: 0.5%; padding: 2.5%;} .container-threefourths-padded {float: left; width: 68.99%; margin: 0.5%; padding: 2.5%;} /* device restrictions */ .desktops-only {display: none!important;} .tablets-only {display: none!important;} .desktops-tablets-only {display: none!important;} .tablets-only {display: none!important;} #sidebar {display: none!important;} /* header & navigation */ div.logo-block {text-align: center; padding: 10px 0 10px 0;} div.desktop-spacer {display: none;} nav {background-color: #5e331a; border-bottom: 0; height: auto;} nav ul {display: none; height: auto; padding: 0;} nav li {display: block; float: none; width: 100%;} nav li a {color: #c8976e!important; border-bottom: 1px solid #191919; border-right: 1px solid #191919;} nav a {text-align: left; color: #fff; width: 100%; text-indent: 0; font-size: 1.1em; padding: 15px;} nav a:hover {color: #fff!important;} nav a#pull {display: block; height: 30px; position: relative; width: 87%; margin: 0; text-align: right; outline: none; text-decoration: none;} nav a#pull:after {display: inline-block; width: 20px; height: 20px; content: ""; background: url('../graphics/menucream.png') no-repeat; border: 0; position: relative; left: 10px; top: 6px;} nav a#pull:hover:after {background: url('../graphics/menufff.png') no-repeat;} h1 {font-size: 2em; font-weight: bold;} h2 {font-size: 1.8em; font-weight: bold;} h3 {font-size: 1.5em; font-weight: bold;} h4 {font-weight: bold;} label {font-size: 1em!important;} .alignleft-center-on-mobiles {text-align: center!important;} /* footer logo powered by */ .powered-by-light {display: none;} .powered-by-dark {display: block; color: #333;} } /*********** CUSTOM ADDITIONAL STYLING *************/ @media screen and (max-width: 1400px) { .spacerintro {display: none!important;} } @media screen and (max-width: 1700px) { #floating-city-sign {display: none!important;} } /** responsive embeded media:
**/ figure {height: 0; padding-bottom: 56.25%; /* 16:9 */ position: relative; width: 100%;} iframe {height: 100%; left: 0; position: absolute; top: 0; width: 100%;} /** UTILS **/ .alignleft {text-align: left!important;} .alignright {text-align: right!important;} .alignjust {text-align: justify!important;} .aligncenter {text-align: center!important;} .valignmiddle {vertical-align: middle!important;} .floatleft {float: left!important;} .floatright {float: right!important;} .noborder {border: 0!important;} .ital {font-style: italic;} .nounderline {text-decoration: none;} .underline {text-decoration: underline;} .debug-border {border-top: 1px solid black;} /** CLEARFIX **/ .clearfix:before, .clearfix:after {content: " "; display: table;} .clearfix:after {clear: both;} .clearfix {*zoom: 1;} /** VISIBILITY **/ .hidden {display: none!important;} .visible {display: block!important;} /* padding */ .padding2 {padding: 2%!important;} .padding5 {padding: 5%!important;} /** LINES **/ .simple-line {border-top: #ececec 1px solid; height:0; margin: 0; padding: 2px 0 2px 0; width:100%; } .simple-line-with-padding {border-top: #ececec 1px solid; height:0; margin: 10px 0 10px 0; padding: 0; width:100%; } /* tables */ .rounded-corner-rectangle-with-background {display: block; background-color: #eff2fb; border: solid 1px #e3e6ef; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; } .table-row-divider {border-top: #e3e6ef 1px solid; height:0; margin: 0; padding: 2px 0 2px 0; width:100%; } .lheight140 {line-height: 140%!important;} .lheight150 {line-height: 150%!important;} /** FONTS **/ .font-xxs {font-size: 0.8em!important;} .font-xs {font-size: 0.85em!important;} .font-s {font-size: 0.95em!important;} .font-m {font-size: 1.2em!important;} .font-l {font-size: 1.4em!important;} .font-xl {font-size: 1.8em!important;} /** SPACERS **/ .spacer1 { clear:both; display:block; height: 1px; width:100%; } .spacer2 { clear:both; display:block; height: 2px; width:100%; } .spacer3 { clear:both; display:block; height: 3px; width:100%; } .spacer4 { clear:both; display:block; height: 4px; width:100%; } .spacer5 { clear:both; display:block; height: 5px; width:100%; } .spacer6 { clear:both; display:block; height: 6px; width:100%; } .spacer7 { clear:both; display:block; height: 7px; width:100%; } .spacer8 { clear:both; display:block; height: 8px; width:100%; } .spacer9 { clear:both; display:block; height: 9px; width:100%; } .spacer10 { clear:both; display:block; height: 10px; width:100%; } .spacer15 { clear:both; display:block; height: 15px; width:100%; } .spacer20 { clear:both; display:block; height: 20px; width:100%; } .spacer30 { clear:both; display:block; height: 30px; width:100%; } .spacer40 { clear:both; display:block; height: 40px; width:100%; } .spacer50 { clear:both; display:block; height: 50px; width:100%; } .spacer60 { clear:both; display:block; height: 60px; width:100%; } .spacer100 { clear:both; display:block; height: 100px; width:100%; } .lheight120 {line-height: 120%!important;} .lheight140 {line-height: 140%!important;} /** FOREGROUND COLORS **/ .color-white {color: #fff!important;} .color-black {color: #000!important;} .color-grey6 {color: #666!important;} .color-dgrey {color: #6f6a6c!important;} .color-red {color: #c30a29!important;} .color-dblue {color: #2d4197!important;} .color-mblue {color: #3498db!important;} .color-lblue {color: #46cdec!important;} .color-purple {color: #792d9a!important;} .color-dgreen {color: #1e9b41!important;} .color-lgreen {color: #a5d22c!important;} .color-cream {color: #c8976e!important;} .color-brown {color: #5e331a!important;} .color-dgreen {color: #339999!important;} .color-lorange {color: #cc9999!important;} .color-dorange {color: #cc6633!important;} .color-dred {color: #cc3366!important;} .color-yellow {color: #ffcc33!important;} .color-lgreen {color: #b2cfbf!important;} .color-lblue {color: #83b5c6!important;} /** BACKGROUND COLORS **/ .bgcolor-white {background-color: #fff!important;} .bgcolor-black {background-color: #000!important;} .bgcolor-greyf7 {background-color: #f7f7f7!important;} .bgcolor-greydc {background-color: #dcdcdc!important;} .bgcolor-grey999 {background-color: #999!important;} .bgcolor-grey3 {background-color: #333!important;} .bgcolor-dgrey {background-color: #6f6a6c!important;} .bgcolor-red {background-color: #c30a29!important;} .bgcolor-dblue {background-color: #2d4197!important;} .bgcolor-lblue {background-color: #46cdec!important;} .bgcolor-purple {background-color: #792d9a!important;} .bgcolor-dgreen {background-color: #1e9b41!important;} .bgcolor-lgreen {background-color: #a5d22c!important;} .bgcolor-dorange {background-color: #ff7d00!important;} .bgcolor-lorange {background-color: #ff9c2e!important;} .bgcolor-cream {background-color: #c8976e!important;} .bgcolor-brown {background-color: #5e331a!important;} .bgcolor-dgreen {background-color: #339999!important;} .bgcolor-lorange {background-color: #cc9999!important;} .bgcolor-dorange {background-color: #cc6633!important;} .bgcolor-dred {background-color: #cc3366!important;} .bgcolor-yellow {background-color: #ffcc33!important;} .bgcolor-lgreen {background-color: #b2cfbf!important;} .bgcolor-lblue {background-color: #83b5c6!important;} .bgcolor-highlight {display:block; background:url('../graphics/background_highlight_ciary.png') repeat left top;} .bgcolor-whitetransp {display:block; background:url('../graphics/1px_white_transp.png') repeat left top;} .bgimg-transp-cream50 {display:block; background:url('../graphics/backgrounds/bgimg-transp-cream50.png') repeat left top;} .bgimg-transp-cream80 {display:block; background:url('../graphics/backgrounds/bgimg-transp-cream80.png') repeat left top;} /* ROUND EDGES */ .round-edges {-moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px;} .round-edges-top {-moz-border-top-left-radius: 6px; -webkit-border-top-left-radius: 6px; border-top-left-radius: 6px;-moz-border-top-right-radius: 6px; -webkit-border-top-right-radius: 6px; border-top-right-radius: 6px;} .round-edges-bottom {-moz-border-bottom-left-radius: 6px; -webkit-border-bottom-left-radius: 6px; border-bottom-left-radius: 6px;-moz-border-bottom-right-radius: 6px; -webkit-border-bottom-right-radius: 6px; border-bottom-right-radius: 6px;} /* OPERATION MESSAGES */ #op-msg-green {display: block; margin: 10px 0 10px 0; padding: 10px; text-align: center; background-color: #ccffcc; border: 1px dotted #009900;} #op-msg-orange {display: block; margin: 10px 0 10px 0; padding: 10px; text-align: center; background-color: #ffdd99; border: 1px dotted #ff9933;} #op-msg-red {display: block; margin: 10px 0 10px 0; padding: 10px; text-align: center; background-color: #ffdddd; border: 1px dotted #cc0000;} #op-msg-green h4 {font-size: 1.2em!important; color: #009900!important; font-weight: bold!important; background-color: #ccffcc!important; padding: 0!important; margin: 0!important;} #op-msg-red h4 {font-size: 1.2em!important; color: #cc0000!important; font-weight: bold!important; background-color: #ffdddd!important; padding: 0!important; margin: 0!important;} #op-msg-orange h4 {font-size: 1.2em!important; color: #ff9933!important; font-weight: bold!important; background-color: #ffdd99!important; padding: 0!important; margin: 0!important;} /* COOKIE CONSENT */ #cookie-consent {display: block; width: 100%; margin: 0 auto; z-index: 999!important; position: fixed!important; left: 0!important; right: 0!important; bottom: 0!important; background-color: #666; /*background: rgb(51, 51, 51); background: rgba(51, 51, 51, .9);*/} #cookie-consent p {padding: 10px; font-size: 0.9em; text-align: center; color: #fff; margin: 0;} a:link.consent-button, a:active.consent-button, a:visited.consent-button {display: inline-block; padding: 2px 10px; color: #fff; background-color: #333; font-size: 0.9em!important; text-decoration: none!important; border: 1px solid #333; text-decoration: none; font-size: 1.25em; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px;} a:hover.consent-button {background-color: #999!important; color: #333!important;} /* telephone icon */ @keyframes telephone { 0% {fill: #BC435B;} 50% {fill: #333;} 100% {fill: #BC435B;} } #telephone {fill: #BC435B; animation-name: telephone; animation-duration: 2s; animation-iteration-count: infinite;} @keyframes telephone-white { 0% {fill: #fff;} 50% {fill: #c7c7c7;} 100% {fill: #fff;} } #telephone-white {fill: #fff; animation-name: telephone-white; animation-duration: 2s; animation-iteration-count: infinite;} /* mouse wheel effect */ .kolieskomysky { display: block; width: 5px; height: 5px; -ms-transform: rotate(45deg); /* IE 9 */ -webkit-transform: rotate(45deg); /* Chrome, Safari, Opera */ transform: rotate(45deg); border-right: 2px solid #000; border-bottom: 2px solid #000; margin: 0 0 3px 6px; } .one, .two, .three {margin: 6px auto; -webkit-animation: mouse-scroll 1s infinite; -moz-animation: mouse-scroll 1s infinite;} .one {-webkit-animation-delay: .1s; -moz-animation-delay: .1s; -webkit-animation-direction: alternate;} .two {-webkit-animation-delay: .2s; -moz-animation-delay: .2s; -webkit-animation-direction: alternate;} .three {-webkit-animation-delay: .3s; -moz-animation-delay: .3s; -webkit-animation-direction: alternate;} .mouse {margin: 0 auto; height: 21px; width: 14px; border-radius: 10px; transform: none; border: 2px solid black; top: 170px;} .wheel {height: 5px; width: 2px; display: block; margin: 5px auto; background: black; position: relative;} .wheel {-webkit-animation: mouse-wheel 1.2s ease infinite; -moz-animation: mouse-wheel 1.2s ease infinite;} @-webkit-keyframes mouse-wheel { 0% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(6px); -ms-transform: translateY(6px); transform: translateY(6px); } } @-moz-keyframes mouse-wheel { 0% { top: 1px; } 50% { top: 2px; } 100% { top: 3px;} } @-webkit-keyframes mouse-scroll { 0% { opacity: 0;} 50% { opacity: .5;} 100% { opacity: 1;} } @-moz-keyframes mouse-scroll { 0% { opacity: 0; } 50% { opacity: .5; } 100% { opacity: 1; } } @-o-keyframes mouse-scroll { 0% { opacity: 0; } 50% { opacity: .5; } 100% { opacity: 1; } } @keyframes mouse-scroll { 0% { opacity: 0; } 50% { opacity: .5; } 100% { opacity: 1; } } /* COLORBOX */ #video {padding: 0 20px 0 20px;} /* Colorbox Core Style: The following CSS is consistent between example themes and should not be altered. */ #colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;} #cboxOverlay{position:fixed; width:100%; height:100%;} #cboxMiddleLeft, #cboxBottomLeft{clear:left;} #cboxContent{position:relative;} #cboxLoadedContent{overflow:auto; -webkit-overflow-scrolling: touch;} #cboxTitle{margin:0;} #cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;} #cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;} .cboxPhoto{float:left; margin:auto; border:0; display:block; max-width:none; -ms-interpolation-mode:bicubic;} .cboxIframe{width:100%; height:100%; display:block; border:0;} #colorbox, #cboxContent, #cboxLoadedContent{box-sizing:content-box; -moz-box-sizing:content-box; -webkit-box-sizing:content-box;} /* User Style: Change the following styles to modify the appearance of Colorbox. They are ordered & tabbed in a way that represents the nesting of the generated HTML. */ #cboxOverlay{background:#fff;} #colorbox{outline:0;} #cboxTopLeft{width:25px; height:25px; background:url('../graphics/colorbox/border1.png') no-repeat 0 0;} #cboxTopCenter{height:25px; background:url('../graphics/colorbox/border1.png') repeat-x 0 -50px;} #cboxTopRight{width:25px; height:25px; background:url('../graphics/colorbox/border1.png') no-repeat -25px 0;} #cboxBottomLeft{width:25px; height:25px; background:url('../graphics/colorbox/border1.png') no-repeat 0 -25px;} #cboxBottomCenter{height:25px; background:url('../graphics/colorbox/border1.png') repeat-x 0 -75px;} #cboxBottomRight{width:25px; height:25px; background:url('../graphics/colorbox/border1.png') no-repeat -25px -25px;} #cboxMiddleLeft{width:25px; background:url('../graphics/colorbox/border2.png') repeat-y 0 0;} #cboxMiddleRight{width:25px; background:url('../graphics/colorbox/border2.png') repeat-y -25px 0;} #cboxContent{background:#fff; overflow:hidden;} .cboxIframe{background:#fff;} #cboxError{padding:50px; border:1px solid #ccc;} #cboxLoadedContent{margin-bottom:20px;} #cboxTitle{position:absolute; bottom:0px; left:0; text-align:center; width:100%; color:#999;} #cboxCurrent{position:absolute; bottom:0px; left:100px; color:#999;} #cboxLoadingOverlay{background:#fff url('../graphics/colorbox/loading.gif') no-repeat 5px 5px;} /* these elements are buttons, and may need to have additional styles reset to avoid unwanted base styles */ #cboxPrevious, #cboxNext, #cboxSlideshow, #cboxClose {border:0; padding:0; margin:0; overflow:visible; width:auto; background:none; } /* avoid outlines on :active (mouseclick), but preserve outlines on :focus (tabbed navigating) */ #cboxPrevious:active, #cboxNext:active, #cboxSlideshow:active, #cboxClose:active {outline:0;} #cboxSlideshow{position:absolute; bottom:0px; right:42px; color:#444;} #cboxPrevious{position:absolute; bottom:0px; left:0; color:#444;} #cboxNext{position:absolute; bottom:0px; left:63px; color:#444;} #cboxClose{position:absolute; bottom:0; right:0; display:block; color:#444;} /* The following fixes a problem where IE7 and IE8 replace a PNG's alpha transparency with a black fill when an alpha filter (opacity change) is set on the element or ancestor element. This style is not applied to or needed in IE9. See: http://jacklmoore.com/notes/ie-transparency-problems/ */ .cboxIE #cboxTopLeft, .cboxIE #cboxTopCenter, .cboxIE #cboxTopRight, .cboxIE #cboxBottomLeft, .cboxIE #cboxBottomCenter, .cboxIE #cboxBottomRight, .cboxIE #cboxMiddleLeft, .cboxIE #cboxMiddleRight { filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF); }