/* ///////////////////////////////////////////////////////////////////////////////////////////////////////// CosmosMedia /* ///////////////////////////////////////////////////////////////////////////////////////////////////////// SmartGrid 2.2 ///////////////////////////////////////////// BASIC FONT SPEC. font-family1: "Domine", Georgia, Times, Times New Roman, serif; font-family2: "Lato", Helvetica, Arial, sans-serif; Alternativ: "Yanone Kaffeesatz", Helvetica, Arial, sans-serif; font-weight1: 400, 700 (ACHTUNG - KEINE UMLAUTE BEI UPPERCASE) font-weight2: 400 font-size: 16px / 100% / 1.000em line-height: 1.625em; / 26px Scale: 64, 42,26,20,16,15,13,10 px Head-Big: font-size: 64px; font-size: 4.0000em; line-height: 1.2188em; margin-bottom: 0.4063em; Title: font-size: 42px; font-size: 2.625em; line-height: 1.2381em; margin-bottom: 0.619em; Headlines: font-size: 26px; font-size: 1.625em; line-height: 1.000em; margin-bottom: 1.000em; Sub-headlines: font-size: 20px; font-size: 1.250em; line-height: 1.300em; margin-bottom: 1.300em; Primary Text: font-size: 16px; font-size: 1.000em; line-height: 1.625em; margin-bottom: 1.625em; NavigationText: font-size: 15px; font-size: 0.9375em; line-height: 1.7333em; margin-bottom: 1.7333em; Secondary Text: font-size: 13px; font-size: 0.8125em; line-height: 2.000em; margin-bottom: 2.000em; Small Text: font-size: 10px; font-size: 0.625em; line-height: 2.600em; margin-bottom: 2.600em; ///////////////////////////////////////////// COLORS Moos Grün #004538 Blatt Grün #51833b Königs Gold #8f7b45 Elfenbein Beige #fff5d7 Silber #aeafb1 Himmel Blau #7db5df Königs Blau #001a6d Nacht Blau #000d38 Rubin Rot #950000 Feuer Orange #da6100 Kohlen Schwarz #18150f Prim. Gold #2c2001 - #59450f - #79652f - #8f7b45 - #aa9660 - #bda973 Prim. Beige #c5b486 - #ddca97 - #f5e0a8 - #ffefc4 - #fff5d7 - #fffbee Prim. Green #001a12 - #00261b - #003827 - #005c40 - #007350 - #00a674 Sec. White #fff5d7 - #fffbee - #ffffff Links Master #006144 - Link-Hover #008960 Links Master DK #005038 - Link-Hover #008960 Menue Links #fff5d9 - Hover #fffefa Menue BG #004034 - rgba(0, 64, 52, 0.8) Menue BG Hover #002f26 - rgba(0, 47, 38, 0.33) Menue Headlines #928564 Menue Text #ad9e76 Menue Border #004639 Menue Icons #fffdf8 - Hover #fffdf9 Text #513f0e Main Background #b29a5b SCHATTEN TEXT WEIT text-shadow: 3px 6px 6px rgba(44, 32, 1, 0.55); SCHATTEN TEXT text-shadow: 1px 1px 1px rgba(44, 32, 1, 0.33); SCHEIN TEXT text-shadow: 2px 2px 3px rgba(255, 250, 237, 0.33); */ @font-face { font-family: 'Domine'; font-style: normal; font-weight: 400; src: url('hotel-fonts/domine-v5-latin-regular.eot'); /* IE9 Compat Modes */ src: local('Domine'), local('Domine-Regular'), url('hotel-fonts/domine-v5-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('hotel-fonts/domine-v5-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */ url('hotel-fonts/domine-v5-latin-regular.woff') format('woff'), /* Modern Browsers */ url('hotel-fonts/domine-v5-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */ url('hotel-fonts/domine-v5-latin-regular.svg#Domine') format('svg'); /* Legacy iOS */ } @font-face { font-family: 'Domine'; font-style: normal; font-weight: 700; src: url('hotel-fonts/domine-v5-latin-700.eot'); /* IE9 Compat Modes */ src: local('Domine Bold'), local('Domine-Bold'), url('hotel-fonts/domine-v5-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('hotel-fonts/domine-v5-latin-700.woff2') format('woff2'), /* Super Modern Browsers */ url('hotel-fonts/domine-v5-latin-700.woff') format('woff'), /* Modern Browsers */ url('hotel-fonts/domine-v5-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */ url('hotel-fonts/domine-v5-latin-700.svg#Domine') format('svg'); /* Legacy iOS */ } @font-face { font-family: 'Lato'; font-style: normal; font-weight: 400; src: url('hotel-fonts/lato-v14-latin-regular.eot'); /* IE9 Compat Modes */ src: local('Lato Regular'), local('Lato-Regular'), url('hotel-fonts/lato-v14-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('hotel-fonts/lato-v14-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */ url('hotel-fonts/lato-v14-latin-regular.woff') format('woff'), /* Modern Browsers */ url('hotel-fonts/lato-v14-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */ url('hotel-fonts/lato-v14-latin-regular.svg#Lato') format('svg'); /* Legacy iOS */ } /* ///////////////////////////////////////////////////////////////////////////////////////////////////////// GENERAL RESET */ html,body,div,applet,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,big,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,input,textarea,button,select,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,figure,footer,header,hgroup,menu,nav,section,time,mark,audio,video {border:0; margin:0; padding:0; outline:0; font-size:100%; font-weight: normal; line-height: 1; font: inherit; color: inherit; vertical-align:baseline; background:transparent;} article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section main, audio, video {display: block;} sub, sup {font-size: 75%; line-height: 0px; position: relative; vertical-align: baseline;} sup {top: -0.5em;} sub {bottom: -0.25em;} pre {white-space: pre; white-space:pre-wrap; white-space:-moz-pre-wrap; white-space:-pre-wrap; white-space:-o-pre-wrap; word-wrap:break-word;} *[lang=en]{quotes:"'" "'";} *[lang=de]{quotes:"„" "“";} b, strong {font-weight: 700;} ol, ul {list-style: none;} blockquote, q {quotes: none;} blockquote:before, blockquote:after, q:before, q:after {content: ''; content: none;} abbr[title] {border-bottom: 1px dotted;} form, input, textarea, button, select, fieldset {font-size: 100%; line-height: normal; vertical-align: baseline; border: 0px;} a, img, a img, {border: 0px;} button, html input[type=button] {cursor: pointer; -webkit-appearance: button;} input[type=reset], input[type=submit] {cursor: pointer; -webkit-appearance: button;} input[type=checkbox], input[type=radio] {-webkit-box-sizing: border-box; -moz-box-sizing: border-box; -o-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box;} textarea {overflow: auto;} table {border-collapse: collapse; border-spacing: 0px;} figure {position: relative;} figure img, figure object, figure embed, figure video {display: block;} img {border: 0px; -ms-interpolation-mode: bicubic;} object, embed, video, iframe {max-width: 100%; width: 100%; display: block; margin: 6px 0px 0px 0px; border: 1px solid; border-color: #eaeff0 #d6dadb #d6dadb #eaeff0;} .clear {clear: both;} .clear:before, .clear:after {display: table; content: "";} .clear:after {clear: both;} .clearfix:after {visibility: hidden; display: block; font-size: 0px; content: " "; clear: both; height: 0px; margin: 0px; padding: 0px;} * html .clearfix {zoom: 1;} /* IE6 */ *:first-child+html .clearfix {zoom: 1;} /* IE7 */ .section:before, .section:after {content: ""; display: table;} .section:after {clear: both;} .section {zoom: 1;} .hidden.focusable:active, .hidden.focusable:focus {position: static; clip: auto; height: auto; width: auto; margin: 0px; overflow: visible;} * {-moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box; *behavior:url(boxsizing.htc);} *:first-child + html .row, *:first-child + html .clear {zoom: 1;} *:after, *:before {-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;} ::-moz-selection {background: #aa9660; color: #18150f; text-shadow: 0px 0px 0px #aa9660;} ::selection {background: #aa9660; color: #18150f; text-shadow: 0px 0px 0px #aa9660;} /* ///////////////////////////////////////////////////////////////////////////////////////////////////////// BASIC LAYOUT */ /* html {height:100%; -webkit-tap-highlight-color:#008960; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; -webkit-overflow-scrolling:touch; background: #b29a5b url('images/bg-main-raster.gif') fixed center top; text-rendering: optimizelegibility;} */ html {height:100%; -webkit-tap-highlight-color:#008960; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; -webkit-overflow-scrolling:touch; text-rendering: optimizelegibility;} body {min-height: 101%; width: 100%; margin: 0; padding: 0; font-family: "Domine", Georgia, Times, Times New Roman, serif; font-weight: 400; font-size: 16px; font-size: 100%; line-height: 1.625em; color: #513f0e; -webkit-hyphens: manual; -moz-hyphens: manual; -ms-hyphens: manual; -o-hyphens: manual; hyphens: manual; text-rendering: optimizelegibility; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; background-color: #b29a5b;} /* ///////////////////////////////////////////////////////////////////////////////////////////////////////// TYPO */ p, ol, ul, li, dl, dd, dt, address {font-size: 16px; font-size: 1.000em; line-height: 1.625em; margin: 0 0 0 0; padding: 0px; color: #513f0e; letter-spacing: 0.015em;} p:hover {} h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {margin: 0px; padding: 0px; font-weight: 400; text-rendering: optimizelegibility; letter-spacing: normal; color: #8f7b45;} h1, .h1 {font-size: 20px; font-size: 1.250em; line-height: 1.300em; margin-bottom: 1.300em; letter-spacing: 0.025em; text-shadow: 1px 1px 0px #fffbee; font-family: "Lato", Helvetica, Arial, sans-serif; color: #aa9660;} h2, .h2 {font-size: 20px; font-size: 1.250em; line-height: 1.300em; margin-bottom: 1.300em; letter-spacing: 0.025em; display: inline; text-shadow: 1px 1px 0px #fffbee; color: #aa9660;} h3, .h3 {font-size: 20px; font-size: 1.250em; line-height: 1.300em; margin-bottom: 1.300em; letter-spacing: 0.025em; display: inline; text-shadow: 1px 1px 0px #fffbee;} h4, .h4 {font-size: 16px; font-size: 1.000em; line-height: 1.625em; margin-bottom: 0em; letter-spacing: 0.025em; color: #79652f;} h5, .h5 {font-size: 16px; font-size: 1.000em; line-height: 1.625em; margin-bottom: 1.625em; letter-spacing: 0.025em; display: inline;} h6, .h6 {font-size: 13px; font-size: 0.8125em; line-height: 1.000em; margin-bottom: 1.000em; color: #8f7b45;} h1 small, h2 small, h2 small, h4 small, h5 small, h6 small {font-size: 13px; font-size: 0.8125em;} h1.big {font-size: 26px; font-size: 1.625em; line-height: 1.000em; margin-bottom: 1.000em; color: #bda973; display: block; font-family: "Lato", Helvetica, Arial, sans-serif; font-weight: 400; font-style: normal; letter-spacing: 0.005em; text-transform: uppercase;} h2.big {font-size: 20px; font-size: 1.250em; line-height: 1.300em; color: #8f7b45; font-weight: 400; letter-spacing: 0.005em;} h3.big, p.big {font-size: 16px; font-size: 1.000em; line-height: 1.625em; color: #513f0e; font-weight: 400; letter-spacing: 0.005em;} h1.bigger {font-size: 64px; font-size: 4.0000em; line-height: 1.2188em; margin-bottom: 1em; display: block; font-family: "Lato", Helvetica, Arial, sans-serif; font-weight: 400; font-style: normal; letter-spacing: 0.025em; text-shadow: 1px 1px 0px #8f7b45;} h2.bigger {font-size: 64px; font-size: 4.0000em; line-height: 0em; margin-bottom: -1em; display: block; font-family: "Lato", Helvetica, Arial, sans-serif; font-weight: 400; font-style: normal; letter-spacing: 0.025em; text-shadow: 1px 1px 0px #8f7b45; font-style: italic;} h3.bigger {font-size: 144px; font-size: 12.0000em; line-height: 1.2188em; margin-bottom: 0em; display: block; font-family: "Lato", Helvetica, Arial, sans-serif; font-weight: 400; font-style: normal; letter-spacing: 0.025em; text-shadow: 1px 1px 0px #8f7b45; font-style: italic;} .text-special {text-shadow: 2px 2px 4px rgba(44, 32, 1, 0.38); font-size: 110%; line-height: 1.625em; color: #ffffff; text-align: center;} small, .small {font-size: 13px; font-size: 0.8125em; line-height: 2.000em; margin-bottom: 2.000em;} code {font-size: 13px; font-size: 0.8125em; line-height: 2.000em; margin-bottom: 2.000em;} .thin {font-weight: 400;} .marker {background-color: #aa9660;} .shadow {text-shadow: 1px 1px 0px #8f7b45;} .inset {text-shadow: -1px -1px 0px #79652f, 1px 1px 0px #fffbee;} .retro {text-shadow: 2px 2px 0px #ffefc4, 4px 4px 0px #8f7b45;} .italic {font-style: italic;} .sans {font-family: "Lato", Helvetica, Arial, sans-serif;} .serif {font-family: "Domine", Georgia, Times, Times New Roman, serif;} u, .underline {text-decoration: underline;} em {font-style: normal; color: #8f7b45;} i {font-weight: 400; font-style: italic;} i span {color: #3e3627;} ins {background-color: #950000; color: #003d2b; text-decoration: none;} mark {background-color: #950000; color: #003d2b; text-decoration: none;} sub, sup {position: relative; font-size: 10px; font-size: 0.625em; font-size: 70%; line-height: 0; vertical-align: baseline; padding-left: 2px; padding-right: 1px;} sup {top: -0.325em;} sub {bottom: -0.325em;} strong, .strong, .bold {font-weight: 700;} .caseup {text-transform: uppercase; font-weight: 400;} .branding {font-style: normal; font-weight: 400; color: #3e3627;} /* ///////////////////////////////////////////////////////////////////////////////////////////////////////// LINK PANEL - PANELS */ .panel {margin: 0px 1px 1px 0px; padding: 0px; min-height: 100%; height: 100%; position: relative; color: #fff5d9; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px;} .panel > :first-child {margin-top: 0;} .panel > :last-child {margin-bottom: 0;} .panel.text {background-color: #ffffff; padding-bottom: 30px;} .panel.white {background-color: #ffffff;} .panel.bgfooter {background-color: transparent; min-height: 100px; /*border-color: #8ed100 #588100 #588100 #8ed100;*/} .panel.bgtrans {background-color: transparent; /*border-color: #8ed100 #588100 #588100 #8ed100;*/} .bg-img {background-position: center center; background-repeat: no-repeat; background-attachment: scroll; background-size: cover; min-height: 200px;} .panel.image {color: #636363; background-color: #ffffff; padding: 0px; /*border-color: #ffffff #eeeeee #eeeeee #ffffff;*/} .panel.callout {background: #ff0000; color: #fff5d9; border-color: #cc0000; -webkit-box-shadow: inset 0px 1px 0px rgba(255, 255, 255, 0.5); -moz-box-shadow: inset 0px 1px 0px rgba(255, 255, 255, 0.5); box-shadow: inset 0px 1px 0px rgba(255, 255, 255, 0.5);} .panel.callout a {color: #ffffff;} .panel.callout .button {background: white; border: none; color: red; text-shadow: none;} .panel.callout .button:hover {background: rgba(255, 255, 255, 0.8);} .panel:hover {color: #fffefa; background-image: url('images/bg-light-low.png'); background-position: center center; background-repeat: no-repeat; background-attachment: scroll; background-size: cover; } a.linkpanel {display: block; position: relative; width: 100%; min-height: inherit; height: 100%; top: 0px; left: 0px; z-index: 800; padding: 20px 45px 26px 26px; margin: -1px; font-size: 20px; font-size: 1.2500em; line-height: 1.3000em; margin-bottom: 1.3000em; letter-spacing: 0.015em; font-weight: 400; color: #fff5d9; text-transform: uppercase; text-shadow: 2px 2px 4px rgba(44, 32, 1, 0.28);} a.linkpanel:link, a.linkpanel:visited {color: #fff5d9;} a.linkpanel:hover {color: #fffefa; min-height: inherit; background-image: url('images/bg-gradient.png'); background-position: top left; background-repeat: repeat-x; background-attachment: scroll; background-size: contain;} a.linkpanel:focus, a.linkpanel:active {color: #fffefa; background-image: url('images/bg-light-low.png'); background-position: center center; background-repeat: no-repeat; background-attachment: scroll; background-size: cover;} a.linkpanel span {display: block; float: none; font-size: 16px; line-height: 1.6250em; margin: 26px 0px 0px 0px; padding: 0px 13px 5px 0px; letter-spacing: normal; font-weight: 400; text-transform: none;} .panel.bg-img a.linkpanel, .panel.bg-img a.linkpanel span {text-shadow: 2px 2px 4px rgba(44, 32, 1, 0.28);} .icon-linkpanel {background: url('images/sprites-hke.png') no-repeat 0px -460px; padding-left: 5px; width: 35px; height: 35px; float: right; position: absolute; top: 18px; right: 10px; vertical-align: bottom; margin-bottom: 0px; padding-bottom: 0px;} .icon-linkdoc {background: url('images/sprites-hke.png') no-repeat 0px -800px; padding-left: 5px; width: 35px; height: 35px; float: right; position: absolute; top: 18px; right: 10px; vertical-align: bottom; margin-bottom: 0px; padding-bottom: 0px;} .panel:hover .icon-linkpanel {color: #fffefa; background: url('images/sprites-hke.png') no-repeat 0px -500px;} .panel:hover .icon-linkdoc {color: #fffefa; background: url('images/sprites-hke.png') no-repeat 0px -840px;} /* ///////////////////////////////////////////////////////////////////////////////////////////////////////// LINK CARD - SPECIAL OFFER PANELS */ .card {margin: 0px 1px 1px 0px; width: 100%; min-height: 100%; height: 315px; padding: 200px 0px 0px 0px; position: relative; display: block; color: #fff5d9; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; overflow: hidden; z-index: 500;} .card .cardimage {height: 200px; overflow: hidden; border-bottom: 1px #aa9660 solid; z-index: 510;} .card .cardcontent {padding: 26px; top: 0px; width: 100%; height: 124px; position: relative; z-index: 520; background-color: rgba(255,251,238,1.0); background-image: url('images/bg-pattern-noise.png'); background-position: left top; background-attachment: fixed; background-repeat:repeat; text-align: left;} .card .cardcontent h2 {font-size: 16px; font-size: 1.000em; line-height: 1.3000em; color: #8f7b45; display: block; position: absolute; top: 0px; left: 26px; padding: 10px 88px 0px 0px;} .card .cardcontent h3 {font-size: 20px; font-size: 1.250em; line-height: 1.000em; color: #8f7b45; text-shadow: none; display: block; position: absolute; width: 65px; height: 65px; top: -65px; right: 13px; padding: 10px 7px 0px 0px; overflow: hidden; background-color: rgba(255,251,238,0.95); text-align: right; font-style: italic;} .card .cardcontent h3 span {font-size: 10px; font-size: 0.625em; font-style: italic; padding-right: 2px;} .card .cardcontent h4 {font-size: 16px; font-size: 1.000em; line-height: 1.3000em; margin-bottom: 0px; color: #fffbee; font-family: "Lato", Helvetica, Arial, sans-serif; font-weight: 400; text-shadow: 2px 2px 4px rgba(44, 32, 1, 0.28); display: block; position: absolute; top: -67px; width: 100%; left: 20px; padding: 2px 95px 6px 8px; background-color: rgba(0,97,68,0.78);} .card .cardcontent p {font-size: 16px; font-size: 1.000em; line-height: 1.000em; color: #fff5d9; display: block; position: absolute; width: 65px; height: 65px; top: 0px; right: 13px; padding: 10px 7px 0px 0px; overflow: hidden; font-size: 20px; font-style: italic; background-color: #aa9660; text-align: right;} .card .cardcontent p span {font-size: 10px; font-size: 0.625em; font-style: italic;} a.linkcard {display: block; position: absolute; width: 100%; min-height: inherit; height: 100%; top: 0px; left: 0px; padding: 20px 3px 26px 26px; margin: 0px; font-size: 20px; font-size: 1.2500em; line-height: 1.3000em; margin-bottom: 1.3000em; letter-spacing: 0.015em; font-weight: 400; color: #fff5d9; text-transform: uppercase; text-shadow: 2px 2px 4px rgba(44, 32, 1, 0.28); z-index: 600; background-image: none; background-color: transparent; text-indent: -999999px;} a.linkcard:link, a.linkcard:visited {color: #fff5d9;} a.linkcard:hover {color: #fffefa; min-height: inherit; background-image: url('images/bg-light-low.png'); background-position: center center; background-repeat: no-repeat; background-attachment: scroll; background-size: cover;} a.linkcard:focus, a.linkcard:active {color: #fffefa; background-image: url('images/bg-light-low.png'); background-position: center center; background-repeat: no-repeat; background-attachment: scroll; background-size: cover;} a.linkcard span {display: block; float: none; font-size: 16px; line-height: 1.6250em; margin: 26px 0px 0px 0px; padding: 0px 70px 5px 0px; letter-spacing: 0.015em; font-weight: 400; text-transform: none;} .icon-linkcard {background: url('images/sprites-hke.png') no-repeat 0px -460px; padding-left: 5px; width: 35px; height: 35px; float: right; position: absolute; top: 18px; right: 10px; vertical-align: bottom; margin-bottom: 0px; padding-bottom: 0px;} .card:hover .icon-linkcard {background: url('images/sprites-hke.png') no-repeat 0px -500px;} .icon-cardspecial {background: url('images/sprites-hke.png') no-repeat 0px -660px; padding-left: 0px; width: 40px; height: 40px; float: left; position: absolute; top: 0px; left: 0px; vertical-align: bottom; margin-bottom: 0px; padding-bottom: 0px;} .card:hover .icon-cardspecial {background: url('images/sprites-hke.png') no-repeat 0px -660px;} /* ///////////////////////////////////////////////////////////////////////////////////////////////////////// LINK GRID */ .link-grid, .link-grid:visited {display: block; width: 100%; float: left; margin: 0px; padding: 3px 3px 3px 13px; background-color: #fffbee; color: #006144; border: 1px #ffffff solid; border-color: #ffffff #bda973 #bda973 #ffffff; font-size: 16px; font-size: 1.000em; line-height: 1.625em; text-decoration: none; text-align: left; vertical-align: bottom; cursor: pointer; overflow: hidden; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px;} .link-grid:hover {color: #008960; background-color: #fffefa; border: 1px #ffffff solid; border-color: #ffffff #bda973 #bda973 #ffffff;} .link-grid span {font-size: 16px; font-size: 1.0000em; line-height: 1.625em;} .link-grid:hover span, .link-grid:focus span, .link-grid:active span {} .link-grid span small {color: #bda973;} /* ///////////////////////////////////////////////////////////////////////////////////////////////////////// ARTICLE LINK */ a.link-article {display: block; float: none; padding: 0px; background: transparent url('images/sprites-hke.png') bottom right no-repeat; text-decoration: none;} a.link-article .head {display: block; float: none;} a.link-article .head1 {display: block; float: none; font-size: 20px; font-size: 1.250em; line-height: 1.300em; letter-spacing: 0.015em;} a.link-article .head2 {display: block; float: none; color: #3e3627;} a.link-article .teaser {display: block; float: none; font-size: 13px; font-size: 0.8125em; line-height: 2.000em; margin-bottom: 2.000em; font-weight: 400; color: #aeafb1; text-decoration: none;} a.link-article img {margin: 0.40625em 1.250em 1.21875em 0px; padding: 0px; float: left; max-width: 9.75em; max-height: 9.75em; border: 1px solid; border-color: #eaeff0 #d6dadb #d6dadb #eaeff0;} a.link-article:hover, a.link-article:focus, a.link-article:active {color: #008960; text-decoration: none; background: #fffbee url('images/bg-link-listing-b.gif') bottom right no-repeat;} a.link-article:hover img {} /* ///////////////////////////////////////////////////////////////////////////////////////////////////////// ARTICLE DETAIL VIEW */ div.article {font-size: 16px; font-size: 1.000em; line-height: 1.625em; margin: 0 0 1.625em 0; font-weight: 400; text-rendering: optimizelegibility; letter-spacing: normal; display: block; float: none; text-decoration: none; padding: 0px;} div.article h2 {font-size: 26px; font-size: 1.625em; line-height: 1.300em; margin-bottom: 1.000em; letter-spacing: 0.015em; font-weight: 400; color:#bda973;} div.article h3 {font-size: 20px; font-size: 1.250em; line-height: 1.300em; margin-bottom: 1.300em; letter-spacing: 0.015em; font-weight: 400; display: block; float: none; text-decoration: none; padding: 0px;} div.article h4 {font-size: 16px; font-size: 1.000em; line-height: 1.625em; margin-bottom: 1.625em; letter-spacing: 0.015em; font-weight: 400;} div.article p {font-size: 16px; font-size: 1.000em; line-height: 1.625em; margin: 0 0 1.625em 0; float: none; text-decoration: none; font-weight: 400; padding: 0px;} div.article a {margin-left: 2px; color: #006144;} div.article a:hover {color: #008960;} div.article ul li {padding: 0px 0px 0px 26px; margin: 0px 0px 0px 0px; list-style-type: none; background: transparent url(images/icon-listitem.gif) no-repeat left top;} div.article .img-container {max-width: 17.875em; margin: 0.375em 1.250em 0px 0px; padding: 0px; float: left;} div.article img {max-width: 17.875em; max-height: 17.875em; border: 1px solid; border-color: #eaeff0 #d6dadb #d6dadb #eaeff0;} div.article .img-caption {display:block; margin: 1.3em 0px 2.600em 0px; padding: 0px; float: none; font-size: 10px; font-size: 0.625em; line-height: 1.3em;} /* ///////////////////////////////////////////////////////////////////////////////////////////////////////// HYPERLINKS Link-Visited-Hover-Focus-Active */ a {text-decoration: none; color: #006144; border: 0px; outline: transparent none 0px;} a:visited {color: #006144; border: 0px; outline: transparent none 0px;} a:hover {color: #008960; border: 0px; outline: transparent none 0px;} a:focus {color: #008960; border: 0px; outline: transparent none 0px;} a:active {color: #008960; border: 0px; outline: transparent none 0px;} a.link {color: #006144; background: url('images/sprites-hke.png') no-repeat 0px -540px; padding-left: 26px;} a.link:hover {color: #008960; background-position: 0px -580px;} a.link-big {color: #006144; background: url('images/sprites-hke.png') no-repeat 0px -420px; padding-left: 18px;} a.link-big:hover {color: #008960;} a.link-dk {color: #005038; background: url('images/sprites-hke.png') no-repeat 0px -420px; padding-left: 18px;} a.link-dk:hover {color: #008960;} a.link-lt {font-size: 16px; font-size: 1.000em; line-height: 1.625em; color: #fff5d9;} a.link-lt:focus, a.link-lt:hover, a.link-lt:active {color: #fffefa;} a.link-stealth {text-decoration: none; color: inherit;} a.link-stealth:hover, a.link-stealth:focus, a.link-stealth:active {text-decoration: none; color: inherit;} a.link-anchor{margin-top: -110px; position: absolute;} /* LINK LIST FX */ a.link-list {display: inline-block; vertical-align: middle; -webkit-transform: translateZ(0); transform: translateZ(0); box-shadow: 0 0 1px rgba(0, 0, 0, 0); -webkit-backface-visibility: hidden; backface-visibility: hidden; padding: 0px 0px;} a.link-list:after {background: #fffefa; position: absolute; top: 100%; left: 0; content: ''; width: 100%; height: 2px; opacity: 0; transition: opacity 0.55s, transform 0.55s; -moz-transition: opacity 0.55s, -moz-transform 0.55s; -webkit-transition: opacity 0.55s, -webkit-transform 0.55s; transform: translateY(-2px); -moz-transform: translateY(-2px); -webkit-transform: translateY(-2px);} a.link-list:hover:after, a.link-list:focus:after {opacity: 1; transform: translateY(-2px); -moz-transform: translateY(-2px); -webkit-transform: translateY(-2px);} /* LINK ICONS SOCIALMEDIA*/ .panel-social-media {display: block; position: relative; width: 100%; min-height: 48px; height: auto; margin: 26px auto 0 auto; text-align: center;} a.link-icon {display: inline-block; position: relative; width: 48px; height: 48px; margin: 0px 8px 0px 0px; padding: 0px; text-align: center; background-image: url('images/sprites-hke.png'); background-repeat: no-repeat;} a.link-icon.icon-facebook {background-position: 0px -920px; margin-left: -9px;} a.link-icon.icon-instagram {background-position: -48px -920px;} .panel-social-media a.link-icon.icon-facebook {margin-left: 0px;} /* ///////////////////////////////////////////////////////////////////////////////////////////////////////// TEXTBOX, BLOCKQUOTES, ALERTS */ .action {background-color: #da6100; border-color: #da6100; color: #B33E00;} .success {background-color: #c5e6c5; border-color: #a2d6a2; color: #347834;} .warning {background-color: #FFA9A9; border-color: #FF0000; color: #7A0000;} blockquote {font-family: "Lato", Helvetica, Arial, sans-serif; font-weight: 400; font-style: normal; letter-spacing: 0.025em; text-transform: uppercase; font-size: 20px; font-size: 1.250em; line-height: 1.300em; margin-bottom: 1.300em; margin: 0 0 0 0; padding: 0 13px 0 13px; color: #79652f; position: relative; text-align: center;} blockquote:before {} blockquote cite {display: block; color: #aa9660; font-size: 13px; font-size: 0.8125em; line-height: 2.000em;} blockquote cite:before {content: "\2013 \2002";} blockquote cite:after {content: "\2002 \2013";} blockquote.box {font-size: 16px; font-size: 1em; line-height: 1.625em; margin: 0 0 1.625em 0; padding: 1.625em; border-left: 10px solid #8f7b45; background-color: #fff5d7;} /* ///////////////////////////////////////////////////////////////////////////////////////////////////////// LISTEN */ ul,ol {list-style-type: none; padding: 0px 0px 0px 0px;} ul:hover, ol:hover {color: #3e3627;} li {margin: 0; line-height:1.625em; list-style: none;} .list {padding: 0px 0px 0px 0px;} .list li {padding: 0px 0px 0px 1.625em; margin: 0px 0px 0px 0px; list-style-type: none; background: transparent url('images/icon-listitem.gif') no-repeat scroll left top;} .list-bordered {padding: 0px 0px 0px 0px;} .list-bordered li {border-bottom: 1px dashed #3e3627;} .list-bordered li:last-child {border-bottom-width:0;} .list-feat {padding: 0px 0px 0px 0px;} .list-feat li {padding: 0px 0px 0px 1.625em; margin: 0px 0px 0px 0px; list-style-type: none; background: transparent url('images/icon-listitem.gif') no-repeat scroll left top; border-bottom: 1px dotted #fffbee;} .list-feat li:last-child {border-bottom-width:0;} .list-icons {padding: 0px 0px 0px 0px;} .list-icons li {padding: 0px 0px 0px 26px;} ol {list-style:decimal; margin-left:1.625em;} .list-counter {counter-reset: list;} .list-counter li {list-style: none; position: relative;} .list-counter li::before {counter-increment: list; content: counter(list) '.'; position: absolute; top: 0px; left: -1.625em;} ul ul,ul ol,ol ol,ol ul {margin: 0.25em 0 0.25em 1.625em;} ul ul li,ul ol li,ol ol li,ol ul li {margin-bottom:0;} /* DEFINITION LISTEN */ dl {border: 3px double #aa9660; padding: 0 0.25em 0 0.25em;} dt {float: left; clear: left; width: 40%; text-align: left; font-weight: 700; color: #8f7b45; padding-right: 0.25em;} dt:after {content: ":";} dd {width: 60%; margin: 0 0 0 40%; padding: 0 0 0 0;} /* ///////////////////////////////////////////////////////////////////////////////////////////////////////// IMAGES IMG BILDER */ svg:not(:root) {overflow: hidden;} dl.image {float: left; margin: 0px; padding: 0px; background-color: #ffffff;} dl.image dt {display: inline; margin: 0px; padding: 0px;} dl.image dd {margin: 0px; padding: 5px 0px 0px 0px; color: #fffbee; font-size: 12px; font-size: 0.800em;} .img-small {display: block; margin-top: 26px;} .img-left {display: block; margin: 0.375em 1.250em 0px 0px; padding: 0px; float: left; text-align: left;} .img-right {display: block; margin: 0px 0px 0px 1.250em; padding: 0px; float: right; text-align: right;} .img-gallery-overview {max-width: 100%; border-width: 0; vertical-align: middle; border: 1px #f5e0a8 solid; border-color: #ffffff #3e3627 #3e3627 #ffffff;} .img-frame {max-width: 100%; border-width: 0; vertical-align: middle; -ms-interpolation-mode: bicubic; border: 26px #fffbee solid;} .img-border{max-width: 100%; border-width: 0; vertical-align: middle; -ms-interpolation-mode: bicubic; border: 1px #f5e0a8 solid; border-color: #ffffff #3e3627 #3e3627 #ffffff;} .img-full {width: 100%; padding-left: 1px; padding-right: 1px;} .img-fullwidth {width: 100%;} .img-halfwidth {width: 50%;} .img-logo {width: 100%; max-width: 400px;} .img-fullheight {height: 100%;} span.caption {background: url(images/bg-caption.png); color: #fffbee; display: block;} span.caption em {font-size: 10px; font-size: 0.625em; line-height: 1em; margin-bottom: 0.625em; display: block; padding-left: 5px;} [class^="img-"]{position: relative; display: block; width: 400px; height: 160px; z-index: 900; margin-left:auto; margin-right: auto; padding: 0px 0px 0px 0px; text-decoration: none; text-align: center; border: 0px; background: transparent url('images/sprites-hke.png') no-repeat 0px -260px; overflow: hidden; zoom:0.5; -moz-transform:scale(0.5); moz-transform-origin: 0 0;} .img-huge {zoom:1; -moz-transform:scale(1); -moz-transform-origin: 0 0;} .img-big {zoom:0.60; -moz-transform:scale(0.60); -moz-transform-origin: 0 0;} .img-small{zoom:0.29; -moz-transform:scale(0.29); -moz-transform-origin: 0 0;} /* ///////////////////////////////////////////////////////////////////////////////////////////////////////// IMAGES LIGHTBOX SLIMBOX */ #lbOverlay {position: fixed; z-index: 9999; left: 0; top: 0; width: 100%; height: 100%; background-color: #000000; cursor: pointer;} #lbCenter, #lbBottomContainer {position: absolute; z-index: 9999; overflow: hidden; background-color: #fffbee; max-width: 300px;} .lbLoading {background: #fffbee url(images/icon-loading.gif) no-repeat center;} #lbImage {position: absolute; left: 0; top: 0; border: 10px solid #fffbee; background-repeat: no-repeat; max-width: 300px; max-height: 300px; background-size: cover;} #lbNavContainer {position: absolute; top: 50%; margin-top: -300px; width: 100%; height: 600px; left: 0; z-index: 800; border: 0px;} #lbPrevLink, #lbNextLink {opacity: 0.45; filter: alpha(opacity=45); cursor: pointer; width: 100px; height: 600px; position: absolute; left: 0px; z-index: 850; background-position: 0 38px; background-image: url('images/sprites-galleria-cosmic.png'); background-repeat: no-repeat; border: 0px;} #lbPrevLink {left: 0px; background-position: 13px 38px; z-index: 2; border: 0px;} #lbNextLink {left: auto; right: 0px; background-position: -229px 38px; z-index: 2; border: 0px;} #lbPrevLink:hover, #lbNextLink:hover {opacity: 1; filter: alpha(opacity=100); border: 0px;} #lbPrevLink:focus, #lbNextLink:focus {opacity: 0.45; filter: alpha(opacity=45); border: 0px;} #lbPrevLink:active, #lbNextLink:active {opacity: 0.45; filter: alpha(opacity=45); border: 0px;} #lbCloseLink {position: absolute; top: 0px; right: 20px; width: 31px; height: 31px; background-image: url('images/sprites-galleria-cosmic.png'); background-repeat: no-repeat; background-position: -747px 0px; opacity: 0.68; filter: alpha(opacity=68); cursor: pointer; z-index: 999; border: 0px;} #lbCloseLink:hover {opacity:1; filter: alpha(opacity=100);} #lbCloseLink:active {opacity: 0.68; filter: alpha(opacity=68);} #lbBottom {font-size: 13px; font-size: 0.8125em; line-height: 2.000em; margin-bottom: 1em; color: #79652f; text-align: left; border: 10px solid #fffbee; border-top-style: none;} #lbCaption, #lbNumber {margin-right: 5px;} #lbNumber {color: #8f7b45; font-style: italic;} /* ////////////////////////// DESKTOP RESIZE */ @media only screen and (min-width: 610px) { #lbCenter, #lbBottomContainer {max-width: none; width: 1000px;} #lbImage {max-width: 800px; max-height: 800px; background-size: cover;} } /* ///////////////////////////////////////////////////////////////////////////////////////////////////////// FORMS FORMULAR */ form, form.feedbackform {font-family: "Lato", Helvetica, Arial, sans-serif; font-size: 16px; font-size: 1.000em; line-height: 1.625em; letter-spacing: 0.025em; margin: 0px; padding: 0px;} label, input, button, select, textarea {font-family: "Lato", Helvetica, Arial, sans-serif; font-size: 16px; font-size: 1.000em; line-height: 1.625em; letter-spacing: 0.025em; margin: 0px; padding: 0px; vertical-align: baseline; *vertical-align: middle;} /* FORM LAYOUT */ div.fieldwrapper {width: 100%; overflow: auto; margin: 0px 0px 0px 0px; padding: 0px; border: 0px solid; border-color: #006144; background-color: transparent;} div.fieldwrapper:hover, div.fieldwrapper:focus {} /* LABEL */ div.fieldwrapper label {float: none; position: relative; display: inline; top: 3px; padding: 0px 0px 0px 1px; margin: 0px 0px 0px 10px; font-size: 13px; font-size: 0.8125em; text-align: left; color: #008960; text-transform: uppercase; z-index: 1500;} div.fieldwrapper label.required {background: transparent url(images/icon-required.gif) no-repeat left center; padding: 0px 0px 0px 16px;} div.fieldwrapper label.marked {background: transparent url(images/icon-marked.gif) no-repeat left center; color: #da6100; font-weight: 700; padding: 0px 0px 0px 16px;} div.fieldwrapper label span {float: left; width: 150px; margin: 0px 0px 0px 0px; padding: 0px 15px 0px 0px; text-align: right; color: #ff5a00;} /* FIELDS */ div.thefield {float: left; margin: 4px 0px 0px 0px; padding: 0px 0px 0px 0px; width: 100%;} div.thefield:hover, div.thefield:focus {} div.thefield.inputstyle {vertical-align: top; width: 100%; height: 3.250em;} /* INPUT TEXT */ div.fieldwrapper div.thefield input[type=text] {vertical-align: top; width: 100%; height: 3.250em; padding: 1.0000em 2px 0px 10px; margin: -20px 0px 0px 0px;} /* TEXTAREA margin-top: -8px; _NO__DOTCOMMA__AFTER__*/ div.fieldwrapper div.thefield textarea {vertical-align: top; width: 100%; height: 9.750em; padding: 1.0000em 2px 0px 10px; margin: -20px 0px 0px 0px; color: #8f7b45; background-color:#fffbee; border: 1px solid; border-color: #bda973 #aa9660 #00a674 #bda973;} div.fieldwrapper div.thefield textarea:hover, div.fieldwrapper div.thefield textarea:focus {background-color: #fffefa; border-color: #bda973 #aa9660 #008960 #bda973; color: #2c2001;} /* DROPDOWN SELECT */ div.fieldwrapper div.thefield select, div.fieldwrapper div.thefield .formpull, div.fieldwrapper div.thefield .formpullsmall {-webkit-appearance: none; -moz-appearance: none; appearance: none; border-radius: 0; border: none; border: 0px solid; font-size: 1em; vertical-align: top; width: 96%; height: 1.625em; margin: 0px 0px 0px 7px; padding: 0px 6px 0px 0px; color: #8f7b45; cursor: pointer; background: #fffbee url(images/icon-form-select.png) no-repeat right center; background-size: 32px 32px;} div.fieldwrapper div.thefield select:hover, div.fieldwrapper div.thefield select:focus {border-color: #bda973 #aa9660 #008960 #bda973; color: #2c2001; background-color: #fffefa;} div.fieldwrapper div.thefield select:: -ms-expand {display:none;} .lt-ie10 select {background-image: none;} /* CHECKBOX RADIO */ div.fieldwrapper div.thefield input[type=radio] {width: 1.000em; height: 1.000em; vertical-align: middle; margin: 0px 0px 0px 0px; cursor: pointer; color: #8f7b45; background-color:#fffbee;} div.fieldwrapper div.thefield input[type=radio]:hover, div.fieldwrapper div.thefield input[type=radio]:focus {background-color: #fffefa; color: #2c2001;} /* GENERAL FIELD STYLES AND FX WITH HOVER */ div.fieldwrapper div.thefield input[type=text], div.fieldwrapper div.thefield textarea, div.thefield.inputstyle {color: #8f7b45; background-color:#fffbee; border: 1px solid; border-color: #bda973 #aa9660 #00a674 #bda973; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; outline: none; transition: all 0.2s ease-out; -webkit-transition: all 0.2s ease-out; -moz-transition: all 0.2s ease-out; -webkit-box-shadow: inset 1px 1px 1px 0px rgba(0, 0, 0, 0.2); -moz-box-shadow: inset 1px 1px 1px 0px rgba(0, 0, 0, 0.2); box-shadow: inset 1px 1px 1px 0px rgba(0, 0, 0, 0.2);} div.fieldwrapper div.thefield input[type=text]:hover, div.fieldwrapper div.thefield input[type=text]:focus, div.fieldwrapper div.thefield textarea:hover, div.fieldwrapper div.thefield textarea:focus, div.thefield.inputstyle:hover, div.thefield.inputstyle:focus {color: #2c2001; background-color: #fffefa; border-color: #bda973 #aa9660 #008960 #bda973; -webkit-box-shadow: inset 2px 2px 5px 0px rgba(0, 0, 0, 0.3); -moz-box-shadow: inset 2px 2px 5px 0px rgba(0, 0, 0, 0.3); box-shadow: inset 2px 2px 5px 0px rgba(0, 0, 0, 0.3);} /* ERROR INFO */ div.fieldwrapper div.thefield input[type=text].marked, div.fieldwrapper div.thefield textarea.marked, div.fieldwrapper div.thefield select.marked, div.thefield.inputstyle.marked {background-color: #ffffff; border-color: #da6100 #950000 #950000 #da6100;} h3.marked {background: transparent url(images/icon-marked.gif) no-repeat left center; padding-left: 20px;} li.marked {padding-left: 8px; background: transparent url(images/icon-marked.gif) no-repeat left center; color: #da6100;} .formerror {width: 100%; padding: 9px; margin: 0px 0px 20px 20px; border-left: 4px #ff6700 solid;} /* FORMCHECK */ .formcheck {width: 100%; visibility: hidden; display: none;} /* SPECIAL FORMATS */ div.fieldwrapper div.thefield input[type=text].short30 {width: 30%; float: left; display:block; text-align: left;} div.fieldwrapper div.thefield input[type=text].short70 {width: 60%; float: left; display:block; text-align: left; margin-top: -41px;} /* ///////////////////////////////////////////////////////////////////////////////////////////////////////// FORM NEWSLETTER */ form.newsletter {font-family: "Lato", Helvetica, Arial, sans-serif; font-size: 16px; font-size: 1.000em; line-height: 1.625em; letter-spacing: 0.025em; margin: 0px; padding: 0px; color: #79652f;} form.newsletter label {float: none; position: relative; display: inline; top: 12px; padding: 0px 0px 0px 0px; margin: 0px 0px 0px 6px; font-size: 13px; font-size: 0.8125em; text-align: left; color: #79652f; text-transform: uppercase; z-index: 1500;} form.newsletter input {vertical-align: top; width: 100%; height: 3.250em; padding: 1.0000em 2px 0px 10px; margin: -20px 0px 0px 0px; color: #8f7b45; background-color:#fffbee; border: 1px solid; border-color: #bda973 #aa9660 #00a674 #bda973; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; outline: none; transition: all 0.2s ease-out; -webkit-transition: all 0.2s ease-out; -moz-transition: all 0.2s ease-out; -webkit-box-shadow: inset 1px 1px 1px 0px rgba(0, 0, 0, 0.2); -moz-box-shadow: inset 1px 1px 1px 0px rgba(0, 0, 0, 0.2); box-shadow: inset 1px 1px 1px 0px rgba(0, 0, 0, 0.2);} form.newsletter input[type=checkbox] {width: 1.000em; height: 1.000em; vertical-align: middle; margin: 12px 0px 0px 3px; cursor: pointer; color: #8f7b45; background-color:#fffbee;} form.newsletter input[type=checkbox]:hover, form.newsletter input[type=checkbox]:focus {background-color: #fffefa; color: #2c2001;} /* ///////////////////////////////////////////////////////////////////////////////////////////////////////// CALENDAR DATEPICKER */ .Zebra_DatePicker *, .Zebra_DatePicker *:after, .Zebra_DatePicker *:before {-moz-box-sizing: content-box !important; -webkit-box-sizing: content-box !important; box-sizing: content-box !important; font-family: "Lato", Helvetica, Arial, sans-serif;} .Zebra_DatePicker {position: absolute; background: #004034; border: 3px solid #004639; z-index: 1200; font-size: 13px; top: 0;} .Zebra_DatePicker * {margin: 0; padding: 0; color: #513f0e; background: transparent; border: none;} .Zebra_DatePicker table {border-collapse: collapse; border-spacing: 0; width: auto; table-layout: auto;} .Zebra_DatePicker td, .Zebra_DatePicker th {text-align: center; padding: 5px 0;} .Zebra_DatePicker td {cursor: pointer;} .Zebra_DatePicker .dp_daypicker, .Zebra_DatePicker .dp_monthpicker, .Zebra_DatePicker .dp_yearpicker {margin-top: 3px;} .Zebra_DatePicker .dp_daypicker td, .Zebra_DatePicker .dp_daypicker th, .Zebra_DatePicker .dp_monthpicker td, .Zebra_DatePicker .dp_yearpicker td {background: #fffbee; width: 30px; border: 1px solid #bda973;} .Zebra_DatePicker, .Zebra_DatePicker .dp_header .dp_hover, .Zebra_DatePicker .dp_footer .dp_hover {-webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px;} /* VISIBLE / HIDDEN */ .Zebra_DatePicker.dp_visible {visibility: visible; filter: alpha(opacity=100); -khtml-opacity: 1; -moz-opacity: 1; opacity: 1; transition: opacity 0.2s ease-in-out;} .Zebra_DatePicker.dp_hidden {visibility: hidden; filter: alpha(opacity=0); -khtml-opacity: 0; -moz-opacity: 0; opacity: 0;} /* CALENDAR HEAD */ .Zebra_DatePicker .dp_header td {color: #fff5d9;} .Zebra_DatePicker .dp_header .dp_previous, .Zebra_DatePicker .dp_header .dp_next {width: 30px;} .Zebra_DatePicker .dp_header .dp_caption {font-weight: 700;} .Zebra_DatePicker .dp_header .dp_hover {background: #007350; color: #fffefa;} /* CALENDAR DATES */ .Zebra_DatePicker .dp_daypicker th {background: #aa9660; color: #FFF5D9;} .Zebra_DatePicker td.dp_not_in_month {background: #ddca97; color: #bda973; cursor: default;} .Zebra_DatePicker td.dp_not_in_month_selectable {background: #ddca97; color: #bda973; cursor: pointer;} .Zebra_DatePicker td.dp_weekend {background: #fff5d7;} .Zebra_DatePicker td.dp_weekend_disabled {background: #ddca97; color: #bda973; cursor: default;} .Zebra_DatePicker td.dp_selected {background: #007350; color: #fffefa !important;} .Zebra_DatePicker td.dp_week_number {background: #aa9660;; color: #FFF5D9; cursor: text; font-style: italic;} /* CALENDAR MONTH */ .Zebra_DatePicker .dp_monthpicker td {width: 33%;} /* CALENDAR YEAR */ .Zebra_DatePicker .dp_yearpicker td {width: 33%;} /* CALENDAR FOOTER BUTTON */ .Zebra_DatePicker .dp_footer {margin-top: 3px;} .Zebra_DatePicker .dp_footer .dp_hover {background: #007350; color: #fffefa;} .Zebra_DatePicker .dp_today {color: #fff5d9; padding: 3px;} .Zebra_DatePicker .dp_clear {color: #fff5d9; padding: 3px;} /* CALENDAR GLOBAL OVERWRITE */ .Zebra_DatePicker td.dp_current {color: #00a674; font-weight: 700;} .Zebra_DatePicker td.dp_disabled_current {color: #00a674;} .Zebra_DatePicker td.dp_disabled {background: #ddca97; color: #bda973; cursor: default;} .Zebra_DatePicker td.dp_hover {background: #00a674; color: #fffefa;} /* CALENDAR ICON */ button.Zebra_DatePicker_Icon {display: block; position: absolute; width: 16px; height: 16px; background: url('images/icon-calendar.png') no-repeat left top; text-indent: -9000px; border: none; cursor: pointer; padding: 0; line-height: 0; vertical-align: top;} button.Zebra_DatePicker_Icon_Disabled {background-image: url('images/icon-calendar-disabled.png');} button.Zebra_DatePicker_Icon {margin: 0 26px 0 26px;} button.Zebra_DatePicker_Icon_Inside_Right {margin: 0 26px 0 0;} button.Zebra_DatePicker_Icon_Inside_Left {margin: 0 0 0 26px;} /* ///////////////////////////////////////////////////////////////////////////////////////////////////////// SEARCHBAR */ .form-searchbar {float: left; display: block; margin: 8px 0px 12px 26px;} .form-searchinput {font-size: 13px; line-height: 26px; height: 26px; width: 302px; padding: 0px 0px 0px 22px; margin: 0px 0px 0px 0px; float: left; display: inline; border: 1px #f5e0a8 solid; background: #fffbee url(images/form-bg-search.gif) top left no-repeat;} .form-searchinput:hover {background: #fffbee url(images/form-bg-search-b.gif) top left no-repeat; border: 1px #008960 solid;} /* ///////////////////////////////////////////////////////////////////////////////////////////////////////// BUTTONS */ .btn, form button.btn { font-family: "Lato", Helvetica, Arial, sans-serif; display: inline-block; padding: 0.6125em 1.625em 0.6125em 1.625em; margin: 0px; min-height: 3.33em; font-size: 16px; font-size: 1.000em; line-height: 1.625em; font-weight: 700; letter-spacing: 0.025em; text-transform: uppercase; word-spacing: normal; text-decoration:none; text-align: center; vertical-align: text-top; /* color: #513f0e; */ color: #006144; *margin-left: 0.325em; display: inline-block; *display: inline; /* IE7 inline-block hack */ *zoom: 1; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; border: 2px solid #006144; cursor: pointer; background-color: rgba(255,251,238,0.95); text-shadow: 0px 0px 0px rgba(255, 255, 255, 0); } .btn:focus, .btn:hover, .btn:active { border-left: 2px solid #008960; border-right: 2px solid #008960; border-top: 2px solid #008960; border-bottom: 2px solid #00a674; color: #ffffff; background-color: #006144; text-decoration: none; background-image: linear-gradient(top, #008960, #006144); } .btn-active, .btn-active:focus, .btn-active:hover, .btn-active:active { color: #ffffff; background-color: #008960; text-decoration: none; background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#008960), to(#006144)); background-image: -webkit-linear-gradient(top, #008960, #006144); background-image: -moz-linear-gradient(top, #008960, #006144); background-image: -ms-linear-gradient(top, #008960, #006144); background-image: -o-linear-gradient(top, #008960, #006144); background-image: linear-gradient(top, #008960, #006144); border: 2px solid #008960; border-bottom-color: #00a674; cursor: default; text-shadow: 0px 0px 0px #ffffff; } input[type=submit].btn:hover {border: 2px solid #008960; border-bottom-color: #008960;} .btn:first-child {*margin-left: 0;} .btn-disabled {-webkit-opacity: 0.5; -moz-opacity: 0.5; opacity: 0.5; cursor: default;} .btn img {margin: 0px; padding: 0px;} .btn-full {width: 100%;} .btn-extlarge {padding: 11px 22px; font-size: 20px; font-size: 1.333em;} .btn-large {padding: 0px 22px 0px 22px; font-size: 15px; font-size: 1.000em; font-weight: 700;} .btn-small {margin: 2px 0px 0px 0px; padding: 0.825em 0.8125em 0.125em 0.8125em; font-size: 13px; font-size: 0.8125em; height: 1.625em; line-height: 1.125em;} .btn-doc {background-image: url(images/icon-doc.gif); background-repeat: no-repeat; background-position: 1.625em center; padding-left: 2.625em;} .btn-doc:hover {background-image: url(images/icon-doc.gif); background-repeat: no-repeat; background-position: 1.625em center;} .btn-go {background-image: url(images/icon-go.gif); background-repeat: no-repeat; background-position: 10px center;} .btn-go:hover {background-image: url(images/icon-go.gif); background-repeat: no-repeat; background-position: 10px center;} .btn-searchbar {padding: 0px; margin: 1px 0px 0px 0px; height: 23px; width: 23px; vertical-align: top; background-color: #006144; border: 2px solid #008960; background-image: url(images/icon-go.gif); background-repeat: no-repeat; background-position: 8px center;} .btn-searchbar:hover {background-image: url(images/icon-go.gif); background-repeat: no-repeat; background-position: 8px center;} .btn-next {padding: 0 0.40625em 0px 0.40625em; margin: -2px 0px 0px 0px; height: 1.625em; min-width: 1.625em; width: 1.625em; background-image: url(images/icon-next.gif); background-repeat: no-repeat; background-position: 7px center;} .btn-next:hover {background-image: url(images/icon-next.gif); background-repeat: no-repeat; background-position: 7px center;} .btn-prev {padding: 0 0.40625em 0px 0.40625em; margin: -2px 0px 0px 0px; height: 1.625em; min-width: 1.625em; width: 1.625em; background-image: url(images/icon-prev.gif); background-repeat: no-repeat; background-position: 5px center;} .btn-prev:hover {background-image: url(images/icon-prev.gif); background-repeat: no-repeat; background-position: 5px center;} .btn-toolbar {clear: both; margin-top: 0.75em; margin-bottom: 0.75em;} .btn-toolbar .btn-group {display: inline-block; *display: inline; *zoom: 1;} .btn-group {position: relative; *zoom: 1; *margin-left: .3em; margin-bottom: 1.625em;} .btn-group .btn {position: relative; float: left; margin-left: -1px;} .btn-group .btn:first-child {margin-left: 0; -webkit-background-clip: padding-box; -moz-background-clip: padding; background-clip: padding-box;} .btn-group .btn:last-child {-webkit-background-clip: padding-box; -moz-background-clip: padding; background-clip: padding-box;} /* ///////////////////////////////////////////////////////////////////////////////////////////////////////// TABS */ ul.tabs {margin: 0px; padding: 0px; float: left; list-style: none; border-bottom: 1px solid #00a674; width: 100%;} ul.tabs li {float: left; overflow: hidden; position: relative; padding: 0px 0.40625em 0px 0.40625em; margin: 0px 0px 0px 1px; height: 1.625em; *margin-left: 0.325em; display: inline-block; *display: inline; /* IE7 inline-block hack */ *zoom: 1; font-size: 16px; font-size: 1.000em; line-height: 1.625em; font-weight: 400; letter-spacing: normal; word-spacing: normal; text-decoration: none; text-shadow: 1px 1px 1px #003d2b; text-align: center; vertical-align: middle; list-style: none; color:#ffffff; background-color: #006144; background-image: none; background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#fffbee)); background-image: -webkit-linear-gradient(top, #ffffff, #fffbee); background-image: -moz-linear-gradient(top, #ffffff, #fffbee); background-image: -ms-linear-gradient(top, #ffffff, #fffbee); background-image: -o-linear-gradient(top, #ffffff, #fffbee); background-image: linear-gradient(top, #ffffff, #fffbee); background-repeat: repeat-x; border: 1px solid #006144; border-bottom-color: #B33E00; cursor: pointer;} ul.tabs li a, ul.tabs li a:visited, ul.tabs li a:hover, ul.tabs li a:focus, ul.tabs li a:active {color:#ffffff;} ul.tabs li:hover {color: #ffffff; background-color: #008960; text-decoration: none; background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#008960), to(#006144)); background-image: -webkit-linear-gradient(top, #008960, #006144); background-image: -moz-linear-gradient(top, #008960, #006144); background-image: -ms-linear-gradient(top, #008960, #006144); background-image: -o-linear-gradient(top, #008960, #006144); background-image: linear-gradient(top, #008960, #006144); border: 1px solid #008960; border-bottom-color: #00a674;} ul.tabs li.active {color: #ffffff; background-color: #fffbee; text-decoration: none; background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#005c40)); background-image: -webkit-linear-gradient(top, #ffffff, #005c40); background-image: -moz-linear-gradient(top, #ffffff, #005c40); background-image: -ms-linear-gradient(top, #ffffff, #005c40); background-image: -o-linear-gradient(top, #ffffff, #005c40); background-image: linear-gradient(top, #ffffff, #005c40); border: 1px solid #ffffff; border-bottom-color: #005c40; cursor: default;} .tab_content {display: none;} /* ///////////////////////////////////////////////////////////////////////////////////////////////////////// LABELS */ .label {padding: 1px 9px 2px; font-size: 12px; font-size: 0.800em; font-weight: 700; white-space: nowrap; color: #808080; background-color: #e6e6e6; -webkit-transition: background-color 0.25s 0 linear; -moz-transition: background-color 0.25s 0 linear; -ms-transition: background-color 0.25s 0 linear; -o-transition: background-color 0.25s 0 linear; transition: background-color 0.25s 0 linear;} .label:hover {color: #808080; text-decoration: none; cursor: pointer;} .label-error {background-color: #da4f49; color: #ffffff;} .label-error:hover {background-color: #9d2520; color: #ffffff;} .label-warning {background-color: #faa732; color: #ffffff;} .label-warning:hover {background-color: #c17305; color: #ffffff;} .label-success {background-color: #006144; color: #ffffff;} .label-success:hover {background-color: #347834; color: #ffffff;} .label-info {background-color: #d9edf7; color: #247fad;} .label-info:hover {background-color: #85c5e5;} .label-inverse {background-color: #414141; color: #ffffff;} .label-inverse:hover {background-color: #0e0e0e; color: #ffffff;} /* ///////////////////////////////////////////////////////////////////////////////////////////////////////// TABLES */ table {font-size: 16px; font-size: 1em; line-height: 1.625em; margin: 0 0 1.625em 0; padding: 0px; text-align: left; width: 100%; vertical-align: top; border-collapse: collapse; border-spacing: 0; border: 0px; color: #513f0e;} table caption {padding: 0px; margin: 0px; text-align: left;} table th {text-align: left; font-weight: 400; vertical-align: top; background: transparent url('images/bg-line-dotted.gif') left bottom repeat-x; color: #513f0e;} table tbody tr {background: transparent url('images/spacer.gif') left bottom repeat-x;} table tbody tr td {text-align: left; vertical-align: top; font-size: 16px; font-size: 1em; line-height: 1.625em; margin: 0 0 0 0;} table tfoot tr td {text-align: left; font-weight: 400; vertical-align: top; background: transparent url('images/bg-line-dotted.gif') left top repeat-x;} .ruler tbody tr {background: transparent url('images/bg-line-dotted.gif') left bottom repeat-x;} /* ////////////////////////// TABLE STYLE */ table.tablestyle {width: 100%; margin: -1px 0 1.625em -20px; padding: 0px; font-size: 13px; font-size: 0.8125em; line-height: 2.000em; text-align: left; vertical-align: top; border-collapse: collapse; border-spacing: 0; color: #513f0e; border: #fffbee 0px solid; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; overflow: auto;} table.tablestyle thead tr th {padding: 3px; border-top: 0px solid #fffbee; border-bottom: 1px solid #fffbee;} table.tablestyle tbody tr td {padding: 3px; border-top: 1px solid #fffbee; border-bottom:1px solid #fffbee; border-left: 1px solid #fffbee;} table.tablestyle tbody tr.even td {background-color: rgba(164,139,86,0.15);} table.tablestyle tbody tr.odd td {background-color: rgba(164,139,86,0.25);} table.tablestyle tbody tr.divline, table.tablestyle tbody tr.divline td {border-top: 2px #8f7b45 solid; border-bottom: 1px #aa9660 solid; background-color: transparent; height: 2px; line-height: 2px; margin: 0px; padding: 0px;} table.tablestyle tr:last-child td {border-bottom:1px solid #8f7b45;} table.tablestyle tr td.indent {padding-left: 26px;} table.tablestyle tr td.indent::before {content: "\21B3 \0000a0";} table.tablestyle tr td.right, table.tablestyle tr th.right {text-align: right; float: none;} table.tablestyle caption {padding: 0px; margin: 0px;} table.tablestyle tfoot tr td {text-align: left; font-weight: 400; vertical-align: top;} table.tablestyle tbody tr.even:hover td, table.tablestyle tbody tr.odd:hover td {background-color: rgba(255,255,255,0.15); color: #18150f;} /* ////////////////////////// TABLE SMALL */ .tablesmall {margin: 1.625em 0px 1.625em 0px; width: 100%; text-align: left; vertical-align: top; border-collapse: collapse; border-spacing: 0; border: 0px; font-size: 12px; font-size: 0.800em;} .tablesmall th {font-weight: 400; vertical-align: top; padding: 0px 0px 0px 0px; border-bottom: 1px #f5e0a8 solid; margin-bottom: -1px;} .tablesmall td {padding: 5px 26px 5px 0px; vertical-align: top;} .tablesmall tr {border-bottom: 1px #ffffff solid;} .tablesmall tfoot tr td {font-size: 12px; font-size: 0.800em;} .tablesmall tbody tr:hover td {background-color: #aa9660; color: #003d2b; border-top: 1px #ffffff solid; border-bottom: 1px #ffffff solid; margin-top: -1px; margin-bottom: -1px;} /* ///////////////////////////////////////////////////////////////////////////////////////////////////////// LINES AND BORDERS */ hr, .hr {display: block; width: 100%; height: 2px; line-height: 2px; border:0; clear:both; outline:0; margin: 7px 0px 7px 0px; padding: 0px 0px 0px 0px; top: 0px; text-align: center; border-top: 1px solid #8f7b45; border-bottom: 1px solid #ddca97;} .light {border-top: 1px solid #aa9660; border-bottom: 1px solid #ffffff;} .divider {width: 100%; max-width: 400px; height: 40px; line-height: 40px; margin: 0px auto 0px auto; padding: 0px 0px 0px 0px; background: transparent url('images/sprites-hke.png') no-repeat 50% -700px; text-align: center;} /* ///////////////////////////////////////////////////////////////////////////////////////////////////////// KENBURNs */ #kb-container {position: absolute; top: 0; left: 0; z-index: 3; /* Optional 1 */} /* ///////////////////////////////////////////////////////////////////////////////////////////////////////// */ /* ///////////////////////////////////////////////////////////////////////////////////////////////////////// */ /* ///////////////////////////////////////////////////////////////////////////////////////////////////////// */ /* ///////////////////////////////////////////////////////////////////////////////////////////////////////// BASIC GRID */ .container {width: 100%; margin: 0px auto 100px auto; padding: 0px 0% 100px 0%; overflow: hidden; position: relative; display: inherit; top:0; vertical-align:top; z-index:100;} .section {position: relative;} .row {height:100%; overflow: hidden;} .col:first-child {margin-left: 0px;} .inner {float: left; padding: 0px 0px 0px 0px; margin: 0px 0px 0px 0px;} .bg-lt {background-color: rgba(255,255,255,0.80);} .bg-dk {background-color: rgba(36,30,19,0.80);} .bg-leaf {background-color: rgba(81,131,59,0.95);} .bg-sky {background-color: rgba(125,181,223,0.95);} .bg-moos {background-color: rgba(0,69,56,0.95);} .bg-beigexlt {background-color: rgba(255,239,196,0.95);} .bg-beigelt {background-color: rgba(245,224,168,0.95);} .bg-beige {background-color: rgba(221,202,151,0.95);} .bg-beigedk {background-color: rgba(197,180,134,0.95);} .bg-beigexdk {background-color: rgba(174,159,118,0.95);} .bg-goldlt {background-color: rgba(203,172,106,0.95);} .bg-gold {background-color: rgba(164,139,86,0.95);} .bg-golddk {background-color: rgba(134,114,70,0.95);} .bg-goldxdk {background-color: rgba(87,74,45,0.95);} .bg-bluelt {background-color: rgba(125,181,223,0.95);} .bg-blue {background-color: rgba(0,26,109,0.95);} .bg-bluedk {background-color: rgba(0,13,57,0.95);} .bg-greenlt {background-color: rgba(0,166,116,0.95);} .bg-green {background-color: rgba(0,92,64,0.95);} .bg-greendk {background-color: rgba(0,70,49,0.95);} .bg-whitelt {background-color: rgba(255,255,255,0.95);} .bg-white {background-color: rgba(255,251,238,0.95);} .bg-whitedk {background-color: rgba(255,245,215,0.95);} .bg-black {background-color: rgba(36,30,19,0.95);} .bg-silver {background-color: rgba(174,175,177,0.95);} .bg-trans {background-color: rgba(255,255,255,0.01);} .bg-master {background-color: rgba(255,251,238,0.95); background-image: url('images/bg-pattern-noise.png'); background-position: left top; background-attachment: fixed; background-repeat:repeat;} .bg-noise {background-image: url('images/bg-pattern-noise.png'); background-position: left top; background-attachment: fixed; background-repeat: repeat;} .bg-crown {background-image: url('images/bg-pattern-crown.png'); background-position: left top; background-attachment: scroll; background-repeat: repeat;} .bg-striped {background-image: url('images/bg-pattern-noise.png'); background-position: left top; background-attachment: fixed; background-repeat: repeat; background: repeating-linear-gradient(145deg, rgba(255,251,238,0.89), rgba(255,251,238,0.89) 30px, rgba(255,251,238,0.82) 30px, rgba(255,251,238,0.82) 60px)} .bg-striped2 {background-image: linear-gradient(145deg, rgba(255,251,238,0.89) 25%, rgba(255,251,238,0.82) 25%, rgba(255,251,238,0.82) 50%, rgba(255,251,238,0.89) 50%, rgba(255,251,238,0.89) 75%, rgba(255,251,238,0.82) 75%, rgba(255,251,238,0.82) 100%); background-size: 174.34px 122.08px;} /* ///////////////////////////////////////////////////////////////////////////////////////////////////////// FOOTER */ .footer-bar {width: 100%; z-index: 998; margin: 0px 0px 0px 0px; padding: 26px 0px 26px 0px; border-top: 1px #004639 solid; position: relative; height:100%; overflow: hidden; font-family: "Lato", Helvetica, Arial, sans-serif; font-weight: 400; text-transform: none; letter-spacing: 0.025em; background: #004034 url('images/bg-pattern-clean.png') fixed left top; background: rgba(0, 64, 52, 0.91); background-color: rgba(0, 64, 52, 0.91);} .footer-fixed {width: 100%; left: 0; position: fixed; bottom: 0; height: auto;} .footer-text {font-size: 13px; font-size: 0.8125em; line-height: 1.000em; margin-bottom: 1.000em; color: #ad9e76;} .footer-bar h4 {color:#ad9e76; text-transform: none; letter-spacing: 0.025em;} .footer-bar p {color:#ad9e76; text-transform: none; letter-spacing: 0.025em;} .footer-bar a {color:#fff5d9; text-transform: uppercase; letter-spacing: 0.025em;} .footer-bar a:hover {color:#fffefa;} .footer-bar hr {display: block; width: 100%; height: 2px; line-height: 2px; border:0; clear:both; outline:0; margin: 7px 0px 7px 0px; padding: 0px 0px 0px 0px; top: 0px; text-align: center; border-top: 1px solid #000000; border-bottom: 1px solid #ffffff; -khtml-opacity: 0.15; -moz-opacity: 0.15; -webkit-opacity: 0.15; filter: alpha(opacity=15); opacity: 0.15;} a.link-cosmosdesigned {font-size: 13px; font-size: 0.8125em; line-height: 1.000em; margin-bottom: 1.000em; text-align: right; display: block; float: right; text-decoration: none; text-transform: none; color: #003329; letter-spacing: normal;} a.link-cosmosdesigned:hover, a.link-cosmosdesigned:focus, a.link-cosmosdesigned:active {text-decoration: none; color: #009e80;} /* ///////////////////////////////////////////////////////////////////////////////////////////////////////// MEDIA-QUERY GRID 240 */ @media only screen { a.buttonLogo {display: block; width: 150px; height: 40px; line-height: 50px; margin: 12px 0px 0px 0px; padding: 0px 0px 0px 0px; text-decoration: none; cursor: pointer; text-indent: -999999px; background: transparent url('images/sprites-hke.png') no-repeat 0px -120px;} a.buttonLogo:hover {background-position: 0px -160px;} .container {max-width: 980px;} .content {padding: 100px 0px 0px 0px; z-index: 50; z-index: 500; width: 100%; height: 100%; margin-bottom: 200px} .inner, .inner:first-child, .inner:last-child {float: left; padding: 0px 0px 0px 0px;} .inner:first-child {padding: 0px 0px 0px 0px; margin: 0px 0px 0px 0px;} .inner:last-child {padding: 0px 0px 0px 0px; margin: 0px 0px 0px 0px;} .col {float: none; padding: 0px; margin: 0px; border:0px; height: 100%; overflow: hidden;} .col-left {float: none; padding: 0px; margin: 0px; border:0px; height: 100%; overflow: hidden; margin-bottom: 20px;} .col-right {float: none; padding: 0px; margin: 0px; border:0px; height: 100%; overflow: hidden; margin-bottom: 20px;} .one{width:100%;} .two{width:100%;} .three{width:100%;} .four{width:100%;} .five{width:100%;} .six{width:100%;} .seven{width:100%;} .eight{width:100%;} .nine{width:100%;} .ten{width:100%;} .eleven{width:100%;} .twelve{width:100%;} .nomobile {visibility: hidden; display: none;} .onlymobile {visibility: visible; display: block;} .nodesktop {visibility: visible; display: block;} .onlydesktop {visibility: hidden; display: none;} .margin-top-big {margin-top: 13px;} .margin-bottom-big {margin-bottom: 13px;} #ad-slider h4 {font-size: 120%;} #ad-slider p {font-size: 80%;} /* ///////////////////////////////////////////////////////////////////////////////////////////////////////// TOPBAR NAVIGATION MENU BASIS */ /*-khtml-opacity: 0.65; -moz-opacity: 0.65; -webkit-opacity: 0.65; filter: alpha(opacity=65); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=65)"; opacity: 0.65;*/ .header-bar {width: 100%; z-index: 999; text-transform: uppercase; letter-spacing: 0.025em; background: #004034 url('images/bg-pattern-clean.png') fixed left top; background: rgba(0, 64, 52, 0.85); background-color: rgba(0, 64, 52, 0.85); z-index: 998; /*SAFARI FIX? */} .subnav-bar {width: 100%; position: absolute; top: 0; margin: 50px 0px 50px 0px; z-index: 20;} .top-bar-fx {background: transparent url('images/sprites-hke.png') repeat-x 0px 50px fixed; display: block; position: fixed; width: 100%; height: 20px; margin: 0px; top: 50px; left: 0; z-index: 600; border: 0px;} .top-bar-js-breakpoint {width: 980px !important; visibility: hidden;} /* Element that controls breakpoint */ .fixed {width: 100%; left: 0; position: fixed; top: 0;} /* Wrapped around .top-bar to make it fixed at the top */ .top-bar {width: 980px; height: 50px; line-height: 50px; margin: 0 auto; padding: 0px; z-index: 999; font-family: "Lato", Helvetica, Arial, sans-serif; font-size: 15px; font-size: 0.9375em; line-height: 1.3000em; font-style: normal; font-weight: 400; text-transform: uppercase; letter-spacing: 0.025em; text-decoration: none; text-shadow: 1px 1px 1px rgba(44, 32, 1, 0.33);} .top-bar ul {display: inline; height: 50px; line-height: 50px; list-style: none; margin: 0px; padding: 0px; z-index: 999; /* Main Nav links style */ /* Left Side