/* ------------------------------------------------------- Global Resets -------------------------------------------------------*/ html, body, div, p, a, h1, h2, h3 {margin: 0;border: 0;padding:0;} img {border:0;} body.sivu img{vertical-align:middle} b, strong { font-weight: 700;} a { background:transparent; } a:focus { outline: thin dotted; } a:hover, a:active { outline: 0; } ul {list-style-type: square;} html { font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; } html,button,input,select,textarea {font-family: sans-serif; color:#555;} body {font: 400 1em/1.5 'Open Sans', arial, helvetica, sans-serif;} script { display: none !important; } /* ----------------------------------------------------------------- Form globals ----------------------------------------------------------------- */ form {margin:0;} /* ie6/ie7 only... */ button,input,select,textarea {font-size: 100%;vertical-align: baseline;*vertical-align: middle;} /* Improves appearance and consistency 1/2 */ button,input {line-height: normal;} /* FF 3+ UA stylesheet fix */ button,html input[type="button"],input[type="reset"],input[type="submit"] {-webkit-appearance: button;cursor: pointer;*overflow: visible;} /* Improves appearance and consistency 2/2 */ button[disabled],input[disabled] {cursor: default;} /* indicate disabled state */ input[type="checkbox"],input[type="radio"] {box-sizing: border-box;margin:3px;padding: 0;*height: 13px;*width: 13px;} /* IE 7/8/9 only */ button::-moz-focus-inner,input::-moz-focus-inner {border: 0;padding: 0;} /* FF 3+ only */ textarea {overflow: auto;vertical-align: top;resize: vertical;} /* hide scrollbars in IE, disable horizontal scaling globally*/ /* dreamnet specific */ .form_input, .form_textarea {padding: 4px;margin: 3px 0;} .form_select {padding: 2px;min-width: 120px;} .form_button_send, .form_button_reset {cursor: pointer;padding: 4px;} /* ---------------------------------------------------------------- Print globals ---------------------------------------------------------------- */ @media print { * { background: transparent !important; color: #000 !important; text-shadow: none !important; box-shadow: none !important; } a, a:visited { text-decoration: underline; } .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; } /* Don't show links for images, or javascript/internal links */ pre, blockquote { border: 1px solid #999; page-break-inside: avoid; } thead { display: table-header-group; } tr, img { page-break-inside: avoid; } img { max-width: 100% !important; } @page { margin: 0.5cm; } p, h2, h3 { orphans: 3; widows: 3; } h2, h3 { page-break-after: avoid; } } /* ----------------------------------------------------------------------------------------------------------------- BASIC GRID SYSTEM ----------------------------------------------------------------------------------------------------------------- */ .dnsRow, .dnsCell { -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; position: relative; width:100%; } .dnsRow:before, .dnsRow:after { content: ' '; display: table; } .dnsRow:after { clear: both; } .dnsRow { margin: 0 auto; } .dnsRow .dnsRow { margin-left:-15px; /* must be equal to cell padding */ margin-right:-15px; /* must be equal to cell padding */ width:auto; max-width: none; } .dnsCell { float:left; min-height: 1px; padding: 0 15px; /* must be equal to row negative margin */ word-wrap:break-word; } .dnsCell + .dnsCell:last-child { float: right; } .gridTable .dnsCell + .dnsCell:last-child { float:none; } /* ----------------------------------------------------------------------------------------------------------------- GRID WITTHOUT SPACING ----------------------------------------------------------------------------------------------------------------- */ .gridNoSpacing .dnsRow { margin:0;} .gridNoSpacing .dnsCell { padding:0; } /* ----------------------------------------------------------------------------------------------------------------- TABLE STYLE GRID WITH VERTICAL CENTERING ----------------------------------------------------------------------------------------------------------------- */ .gridTable .dnsCell { display:table-cell; float:none; vertical-align: middle; } .gridTable .dnsRow { display:table; width:100%; } /* ----------------------------------------------------------------------------------------------------------------- HELPER CLASSES FOR HORIZONTAL ALIGNMENT ----------------------------------------------------------------------------------------------------------------- */ .one-third {width:33.33333%; } .two-thirds { width: 66.66666%; } .one-quarter { width: 25%; } .three-quarters { width:75%; } .one-half { width: 50%; } .one-fifth { width: 20%; } .two-fifths { width: 40%; } .three-fifths { width: 60%; } .four-fifths { width: 80%; } .one-sixth { width: 16.66666%; } .one-eighth { width: 12.5%; } .one-tenth { width: 10%; } /* ----------------------------------------------------------------------------------------------------------------- HELPER CLASSES FOR HORIZONTAL ALIGNMENT (phones/up to 768px) ----------------------------------------------------------------------------------------------------------------- */ @media screen and (max-width: 48em){ .phone-one-third {width:33.33333%; } .phone-two-thirds { width: 66.66666%; } .phone-one-quarter { width: 25%; } .phone-three-quarters { width:75%; } .phone-one-half { width: 50%; } .phone-one-fifth { width: 20%; } .phone-two-fifths { width: 40%; } .phone-three-fifths { width: 60%; } .phone-four-fifths { width: 80%; } .phone-one-sixth { width: 16.66666%; } .phone-one-eighth { width: 12.5%; } .phone-one-tenth { width: 10%; } .phone-text-left {text-align:left;} .phone-text-center {text-align:center;} .phone-text-right {text-align:right;} } /* ----------------------------------------------------------------------------------------------------------------- HELPER CLASSES FOR HORIZONTAL ALIGNMENT (tablet/769px and up) ----------------------------------------------------------------------------------------------------------------- */ @media screen and (min-width: 48.0625em){ .tablet-full-width {width:100%; } .tablet-one-third {width:33.33333%; } .tablet-two-thirds { width: 66.66666%; } .tablet-one-quarter { width: 25%; } .tablet-three-quarters { width:75%; } .tablet-one-half { width: 50%; } .tablet-one-fifth { width: 20%; } .tablet-two-fifths { width: 40%; } .tablet-three-fifths { width: 60%; } .tablet-four-fifths { width: 80%; } .tablet-one-sixth { width: 16.66666%; } .tablet-one-eighth { width: 12.5%; } .tablet-one-tenth { width: 10%; } .tablet-text-left {text-align:left;} .tablet-text-center {text-align:center;} .tablet-text-right {text-align:right;} } /* ----------------------------------------------------------------------------------------------------------------- HELPER CLASSES FOR HORIZONTAL ALIGNMENT (desktop/1025px and up) ----------------------------------------------------------------------------------------------------------------- */ @media screen and (min-width: 64.0625em) { .desktop-full-width {width:100%; } .desktop-one-third {width:33.33333%; } .desktop-two-thirds { width: 66.66666%; } .desktop-one-quarter { width: 25%; } .desktop-three-quarters { width:75%; } .desktop-one-half { width: 50%; } .desktop-one-fifth { width: 20%; } .desktop-two-fifths { width: 40%; } .desktop-three-fifths { width: 60%; } .desktop-four-fifths { width: 80%; } .desktop-one-sixth { width: 16.66666%; } .desktop-one-eighth { width: 12.5%; } .desktop-one-tenth { width: 10%; } .desktop-text-left {text-align:left;} .desktop-text-center {text-align:center;} .desktop-text-right {text-align:right;} } /* ----------------------------------------------------------------------------------------------------------------- BREAKPOINT I - Phones (0 - 768px) ----------------------------------------------------------------------------------------------------------------- */ @media screen and (max-width: 48em) { .phone-show { display: inherit !important; } .phone-hide, .phone-up-show, .tablet-show, .tablet-up-show, .desktop-show, .desktop-up-show, .bigscreen-show { display: none !important; } } /* ----------------------------------------------------------------------------------------------------------------- BREAKPOINT II - Tablets (769px and up) ----------------------------------------------------------------------------------------------------------------- */ @media screen and (min-width: 48.0625em) { .tablet-show, .phone-up-show { display: inherit !important; } .tablet-hide, .tablet-up-show, .phone-show, .phone-up-hide, .desktop-show, .desktop-up-show, .bigscreen-show { display: none !important; } } /* ----------------------------------------------------------------------------------------------------------------- BREAKPOINT III - Desktops (1024px +) ----------------------------------------------------------------------------------------------------------------- */ @media screen and (min-width: 64.0625em) { .desktop-show, .tablet-up-show, .phone-up-show { display: inherit !important; } .desktop-hide, .phone-show, .tablet-show, .phone-up-hide, .tablet-up-hide, .desktop-up-show, .bigscreen-show { display: none !important; } } /* ----------------------------------------------------------------------------------------------------------------- BREAKPOINT IV - Big screens (1280px +) ----------------------------------------------------------------------------------------------------------------- */ @media screen and (min-width: 80.0625em) { .bigscreen-show, .desktop-up-show, .tablet-up-show, .phone-up-show { display: inherit !important; } .desktop-hide, .desktop-show, .phone-show, .tablet-show, .desktop-up-hide, .phone-up-hide, .tablet-up-hide, .bigscreen-hide { display: none !important; } } /* ----------------------------------------------------------------------------------------------------------------- BREAKPOINTS FOR OLD IFRAMES - 480px ----------------------------------------------------------------------------------------------------------------- */ @media screen and (max-width: 30em) { .iframe-element .phone-hide { display: none !important; } } @media screen and (min-width: 30.0625em) { .iframe-element .phone-hide { display: block !important; } } /* ----------------------------------------------------------------------------------------------------------------- HELPER CLASSES ----------------------------------------------------------------------------------------------------------------- */ /* img replacement */ .ir {background-color: transparent;border: 0;overflow: hidden;*text-indent: -9999px;} .ir:before {content: "";display: block;width: 0;height: 100%;} /* modern img replacement, recommended! NOTE: elem needs block/inline-block */ .ir2 {text-indent: 100%;white-space: nowrap;overflow: hidden;} .invisible {visibility: hidden;} .hidden {display: none !important;visibility: hidden;} .clearfix:before,.clearfix:after {content: " ";display: table;} .clearfix:after {clear: both;} /*.clearfix {*zoom: 1;}*/ .clearfix { zoom: 1; } .circle { border-radius: 50%; } .text-left { text-align: left; } .text-right { text-align: right; } .text-center { text-align: center; } .align-left { float:left; } .align-right { float:right; } .align-center { float:none; margin: 0 auto; } .valign-top { vertical-align: top; } .valign-middle { vertical-align: middle; } .valign-bottom { vertical-align: bottom; } /* ----------------------------------------------------------------------------------------------------------------- CSS for content editor ----------------------------------------------------------------------------------------------------------------- */ .dns-image { border:0; margin: 0; padding: 0; max-width:100%; height:auto; vertical-align: middle; } .dns-image.align-left { margin-right:1em; margin-bottom:1em; } .dns-image.align-right { margin-left:1em; margin-bottom:1em; } .dns-image.align-center { display: block; margin: 1em auto; } /* ----------------------------------------------------------------------------------------------------------------- System components (".dnsModule") ----------------------------------------------------------------------------------------------------------------- */ .dnsModule * { -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; } .dnsModule span { display: inline-block; } .dnsModule hr { height:0; border: solid #ddd; border-width: 1px 0 0; clear: both; } .dnsModule ul, .dnsModule ul > li { display: block; padding: 0;margin: 0;width: 100%; } .dnsModule img { vertical-align: middle; height:auto; max-width: 100%; } /* Form globals inside modules */ .dnsModule .button, .dnsModule input, .dnsModule textarea, .dnsModule select { -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .dnsModule legend { border: 0; padding: 0; white-space: normal; } .dnsModule fieldset { padding: 0;margin: 0;border: 0;} .dnsModule label, .dnsModule .input-info { line-height: 1.1; } .dnsModule .input-info { font-size: 90%; color:#888; margin-top: 0.3em; } .dnsModule input, .dnsModule select, .dnsModule textarea { margin:0; width: 100%; display: block; background-color:#fcfcfc; border: 1px solid #ddd; padding: 0.5em; min-width: inherit; } .dnsModule input[type=submit], .dnsModule .button, .dnsModule .SubmitButton { margin-top: .5em; margin-bottom: 1em; } /*.dnsModule input:focus, .dnsModule select:focus, .dnsModule textarea:focus { outline:0; background-color:#fff; border: 1px solid #bbb; }*/ .dnsModule input[disabled] { background-color: #eee;background-image: repeating-linear-gradient(45deg, transparent, transparent 10px, #f9f9f9 10px, #f9f9f9 20px); opacity:0.7; } .dnsModule label { cursor: pointer; display: block; margin-bottom: 0.3em; margin-top:.5em; } .dnsModule label.info { cursor: default; } .dnsModule input[type=checkbox] + label, .dnsModule input[type=radio] + label { vertical-align: baseline; display: inline-block; margin-right: 7px; margin-left: 4px; margin-top: 0px; max-width: 90%; } .dnsModule input[disabled] + label { cursor: default; opacity:0.7; } .dnsModule input[type=radio], .dnsModule input[type=checkbox] { width:auto; display: inline-block; vertical-align: baseline; } /*.dnsModule form .dnsRow > .dnsCell, form.dnsModule .dnsRow > .dnsCell { margin-bottom: 1em; } */ /*.dnsModule legend { display: block; width: 100%; padding: 0; margin-bottom: 0.5em; font-size: 150%; line-height: inherit; border-bottom: 1px solid #ddd;}*/ /* Buttons */ .dnsModule .button { white-space: nowrap; cursor:pointer; vertical-align: middle; font-weight: 400; -ms-user-select:none; -webkit-user-select:none; -moz-user-select:none; user-select:none; border:0; padding: 0.5em 1em; display: inline-block; text-align: center; } .dnsModule .button-info, .dnsModule .button-submit { color:#fff; font-size: 110%; background-color:#444; } .dnsModule .button-info:hover, .dnsModule .button-submit:hover { background-color:#333; } .dnsModule .button-small { font-size:86%; } .dnsModule .button-medium { font-size:120%; } .dnsModule .button-large { font-size:170%; } .dnsModule .button-wide { width: 100%; display: block; } .dnsModule .button-rounded { border-radius: 0.25em; } /*dns forms*/ .dns-login-form > form { margin-bottom: 1em; } .dns-login-form .dnsCell:nth-child(odd){ clear: both; } .dns-login-form form label.error { margin-top:.3em; color:#ff302d; font-size: 15px; } .dns-login-form form input.error { border-color:#ff302d; } /* ----------------------------------------------------------------------------------------------------------------- Tables (") ----------------------------------------------------------------------------------------------------------------- */ /*.dnsTable { border-collapse: collapse; border-spacing: 0; background: #fff; margin-bottom: 30px; border:solid 1px #ddd; line-height: 120%; width: 100%; max-width: 100%; } .dnsTable thead > tr > th, .dnsTable tbody > tr > th, .dnsTable tfoot > tr > th, .dnsTable thead > tr > td, .dnsTable tbody > tr > td, .dnsTable tfoot > tr > td { vertical-align: top; padding:8px; } .dnsTable tfoot, .dnsTable thead { text-align: left; background: #f5f5f5; font-weight: 700; vertical-align: middle; border-bottom: 2px solid #ddd; } .dnsTable.border > thead > tr > th, .dnsTable.border > tbody > tr > th, .dnsTable.border > tfoot > tr > th, .dnsTable.border > thead > tr > td, .dnsTable.border > tbody > tr > td, .dnsTable.border > tfoot > tr > td { border:solid 1px #ddd; } .dnsTable.stripe > tbody > tr:nth-child(2n+2) > td, .dnsTable.stripe > tbody > tr:nth-child(2n+2) > th { background-color: #f5f5f5; } .dnsTable.small { line-height: 110%; padding:4px; font-size: 90%; }*/ /* ----------------------------------------------------------------------------------------------------------------- dnsmodule colors ----------------------------------------------------------------------------------------------------------------- */ /*.dnsModule .is-warning { color:#fff; background-color:#ff8135; } .dnsModule .is-warning:hover { background-color:#ed7015; } .dnsModule .is-error { color:#fff; background-color:#ff302d; } .dnsModule .is-error:hover { background-color:#e02724; } .dnsModule .is-success { color:#fff; background-color:#6aa842; } .dnsModule .is-success:hover { background-color:#5d9d3a; } .dnsModule .is-disabled, .dnsModule .is-disabled:hover { cursor:default; color:#808080; background-color:#ddd; } .dnsModule fieldset .valid { border-color:#6aa842; background-color:#fff; } .dnsModule fieldset .error { border-color:#ff302d; background-color:#fff; }*/ /* ----------------------------------------------------------------------------------------------------------------- System components ----------------------------------------------------------------------------------------------------------------- */ .document-icon::before { display: inline-block; content:''; margin-top: -2px; vertical-align: middle; margin-right: .1em; margin-left: .25em; height: 1em; width: 1em; background-size: cover; background-repeat: no-repeat; background-position: center; } .document-icon-pdf::before { background-image: url('//images.salattu.fi/system/images/document-icon-pdf.png'); } .document-icon-mp3::before { background-image: url('//images.salattu.fi/system/images/document-icon-mp3.png'); } .document-icon-txt::before { background-image: url('//images.salattu.fi/system/images/document-icon-text.png'); } .document-icon-doc::before, .document-icon-docx::before { background-image: url('//images.salattu.fi/system/images/document-icon-word.png'); } .document-icon-xls::before, .document-icon-xlsx::before { background-image: url('//images.salattu.fi/system/images/document-icon-excel.png'); } .document-icon-jpg::before, .document-icon-jpg::before { background-image: url('//images.salattu.fi/system/images/document-icon-image.png'); } .zoom_gallery .info { font-size: 96%; line-height: 1.2%; } .toimitusAlert { margin-bottom: 21px; margin-top: 21px; font-size: 100%; color: #666; display: inline-block; padding:0.5em 1em; border-radius: 0.3em; background-color:#eee; } .toimitusAlert.Free { color:#fff;background-color:#82c359; } .cartDeliveryMissing { color:#fff; background-color:#ff302d; display:block; width: 90%; font-weight: 400; margin: 7px 0; padding:0.5em 1em; border-radius: 0.3em; } /*Osta nyt v2 */ .shopProd1 h2 { margin-bottom:0.5em; } .shopProd1 > .two > .dnsCell { width: 50%; } .shopProd1 #idProdMaara { float:left; width: 100%; } .shopProd1 .amount > span { width: 100%; vertical-align: middle; } .shopProd1 .amount > input { width: 20%; display: inline-block; vertical-align: middle; } .shopProd1 .title { margin-bottom: 0.3em; font-weight: 700; } .shopProd1 .prodMaara { margin-top: 1em; } .shopProd1 .amount #idUnit { width: 75%; margin-left: 2%; font-size:120%; } span#idUnit { display: inline-block; } select#cmbMyyntiera1 { width: 87%; display: inline-block; } span#idSpanTZip1 { margin-top: 8px; } .shopProd1 .amount #idUnit .icon { font-weight: 700; } .shopProd1 #idProdContinue label { font-size: small; } .promo-wrapper .no-nosto-kuva { position: relative; background: #fff; margin-bottom: 1rem; padding-bottom: 20px; text-align: center; height: 264px; overflow: hidden; display: inline-block; width: 95%; background-position: center center; background-repeat: no-repeat; margin-top: 2.5%; margin-left: 2.5%; background-size: contain; } @media screen and (max-width: 30em) { .shopProd1 > .two > .dnsCell { width: 100%; } .shopProd1 > .two .image { overflow:hidden; max-height:220px; text-align: center; } } /* Ostoskori moduuli */ .shoppingCartSent { color: red; font-weight: bold; padding: 15px 0 0 0; } /* Hinnasto alert ostoskorisivu */ .hinnastoAlert { border-radius: 15px; background:#eee; padding: 15px; line-height: 1.3; font-size: 90%; border:solid 3px #82c359; } #idHinnastoAlert > div.dnsRow.header { text-align: center; color: #82c359; font-weight: bold; padding: 12px 0 12px 0; } .hinnastoAlert span { vertical-align: middle; } .hinnastoAlert > .dnsRow { margin-bottom: 1em; } .hinnastoAlert .items { border-radius: 7px; background:#ddd; padding: 15px 0; } .hinnastoAlert .items > .dnsRow { margin-bottom: 0.5em; } .hinnastoAlert > .header .icon { min-width:30px; width: 12%; height: 30px;} .hinnastoAlert > .header .heading { width: 83%; margin-left: 4%; color:#82c359; } .hinnastoAlert .title > .dnsCell, .hinnastoAlert .item > .dnsCell { width: 16%; } .hinnastoAlert .title > .dnsCell:first-child, .hinnastoAlert .item > .dnsCell:first-child { width: 48%; } .hinnastoAlert .title > .dnsCell:last-child, .hinnastoAlert .item > .dnsCell:last-child { width: 20%; } .hinnastoAlert .title .title { font-weight: 700; } /* ----------------------------------------------------------------------------------------------------------------- Animation presets ----------------------------------------------------------------------------------------------------------------- */ @-webkit-keyframes fade-in-elem { 0% { opacity: 0; } 100% { opacity: 1; } } @-moz-keyframes fade-in-elem { 0% { opacity: 0; } 100% { opacity: 1; } } @-o-keyframes fade-in-elem { 0% { opacity: 0; } 100% { opacity: 1; } } @keyframes fade-in-elem { 0% { opacity: 0; } 100% { opacity: 1; } } @-webkit-keyframes fade-out-elem { 0% { opacity: 1; } 100% { opacity: 0; } } @-moz-keyframes fade-out-elem { 0% { opacity: 1; } 100% { opacity: 0; } } @-o-keyframes fade-out-elem { 0% { opacity: 1; } 100% { opacity: 0; } } @keyframes fade-out-elem { 0% { opacity: 1; } 100% { opacity: 0; } } /* ----------------------------------------------------------------------------------------------------------------- Dropdown default styles ----------------------------------------------------------------------------------------------------------------- */ .dnsDrop { position: relative; } .dnsDrop .button { text-align: left; background:#fff; } @media screen and (max-width: 48em) { .dnsDrop .button { white-space: normal; } } .dnsDrop .button-select { width: 100%; font-weight: 700; font-size: 1.1rem; border:solid 1px #ddd; outline:none; } .dnsDrop .button-select:after { content: '\25bc'; color:inherit; opacity: 0.5; position: absolute; top:50%; right:1em; -o-transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .dnsDrop.open .button-select:after { content: '\25b2'; } .dnsDrop .button-option { position: relative; width: 100%; background: transparent; text-align: left; -moz-user-select: none; -webkit-user-select: none; -ms-user-select: none; user-select: none; border-bottom: solid 1px #eee; } .dnsDrop .button-option:hover { background: #eee; } .dnsDrop .button-option.selected { cursor:default; font-weight: 700; background: #eee; } .dnsDrop .drop-content { background:#fff; display:none; opacity:0; position: absolute; top: 100%; left: 0; width: 100%; z-index: 101; } .dnsDrop.open { box-shadow:none; } .dnsDrop.open .drop-content { opacity: 1; display: block; box-shadow: 0 2px 7px rgba(0,0,0,0.12); } /* ----------------------------------------------------------------------------------------------------------------- Currency symbols ----------------------------------------------------------------------------------------------------------------- */ .currency-symbol.eur::after { content: '\20AC'; } .currency-symbol.sek::after { content: 'SEK'; } .currency-symbol.usd::after { content: '$'; } /* ----------------------------------------------------------------------------------------------------------------- eventcalendar CORE CSS ----------------------------------------------------------------------------------------------------------------- */ .eventCalendar-wrap { position: relative; overflow: hidden; } .eventCalendar-wrap * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .eventCalendar-wrap .arrow { position: absolute; z-index: 5; top: 3px; } .eventCalendar-wrap .prev { left: 3px; } .eventCalendar-wrap .next { right: 3px; } .eventsCalendar-currentTitle .monthTitle { display: block; text-align: center; } .eventsCalendar-monthWrap { position: absolute; top: 0; left: 0; z-index: 2; } .eventsCalendar-monthWrap.currentMonth { z-index: 1; } .eventsCalendar-daysList { display: table; width: 100%; } .eventsCalendar-daysList.showAsWeek { display: block; } .eventsCalendar-daysList li { display: table-cell; } .eventsCalendar-daysList.showAsWeek li { display: block; float: left; width: 14.28%; height: 20px; } .eventsCalendar-daysList li a { padding: 0; display: block; text-align: center; min-width: 7px; } .eventsCalendar-loading { display: block; } .eventsCalendar-list { position: relative; z-index: 1; } .eventsCalendar-list.oldEventList { z-index: 2; } .eventsCalendar-subtitle { font-weight: 700; font-size: 120%; } .eventCalendar-wrap { border: solid 1px #dfdfdf; -moz-box-shadow: 0 0 15px rgba(0,0,0,0.2); -webkit-box-shadow: 0 0 15px rgba(0,0,0,0.2); box-shadow: 0 0 15px rgba(0,0,0,0.2); margin-bottom: 20px; background-color: #fff;} .eventCalendar-wrap .arrow { text-decoration: none; color: #000; line-height: 28px; top: 12px; padding: 8px 10px; } .eventCalendar-wrap .arrow:hover { opacity: 0.7; } .eventCalendar-wrap .arrow span { height: 0; width: 0; font-size: 0; line-height: 0; border-top: 7px solid transparent; border-bottom: 7px solid transparent; border-left: 7px solid #4c4c4c; float: left; text-indent: -5000px; } .eventCalendar-wrap .arrow.prev span { border-left-width: 0; border-right: 6px solid #000; } .eventsCalendar-slider { height: 300px !important; } .eventsCalendar-currentTitle { background-color: #FFF; } .eventsCalendar-currentTitle .monthTitle { text-decoration: none; font-weight: 300; color: #404040; border-bottom: 1px solid #cccccc; font-size: 1.8em; padding-top: 14px; padding-bottom: 14px; } .eventsCalendar-daysList { zoom: 1; padding: 0; width: 100%; } .eventsCalendar-daysList.showAsWeek { margin: 0; width: auto; border-top: solid 1px #FFF; border-bottom-width: 0; border-radius: 0; } .eventsCalendar-daysList:before, .eventsCalendar-daysList:after { content: ""; display: table; } .eventsCalendar-daysList:after { clear: both; } .eventsCalendar-day-header { text-transform: uppercase; text-align: center; font-size: 1.2em; font-weight: 700; color: #a2a2a2; background: #f2f2f2; padding-top: 11px; padding-bottom: 11px; } .eventsCalendar-daysList.showAsWeek li { height: auto; } .eventsCalendar-daysList.showAsWeek li.empty { background-color: #fff; min-height: 29px; } .eventsCalendar-day a { text-decoration: none; font-weight: 400; color: #424242; } .showAsWeek .eventsCalendar-day a { line-height: 200%; font-size: 1.2em; } .eventsCalendar-daysList li.dayWithEvents a { background: #4e75b9; background: -moz-linear-gradient(top, #4e75b9 0%, #2d437e 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #4e75b9), color-stop(100%, #2d437e)); background: -webkit-linear-gradient(top, #4e75b9 0%, #2d437e 100%); background: -o-linear-gradient(top, #4e75b9 0%, #2d437e 100%); background: -ms-linear-gradient(top, #4e75b9 0%, #2d437e 100%); background: linear-gradient(to bottom, #4e75b9 0%, #2d437e 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4e75b9', endColorstr='#2d437e', GradientType=0 ); color: #fff; margin: 0 5%; } .eventsCalendar-daysList li.today a { color: #fff; background: #666; margin: 0 5%; } li.eventsCalendar-day.today a:hover { background-color: #4c4c4c; } .eventsCalendar-daysList li.current a, .eventsCalendar-daysList li.current a:hover { color: #fff; cursor: default; background: #aaa; margin: 0 5%; } .eventsCalendar-loading { margin: 5%; padding: 14px; background-color: #eee; color: #999; text-align: center; } .eventsCalendar-loading.error { background-color: red; color: #fff; } .eventsCalendar-list-wrap { position: relative; } .eventsCalendar-list-wrap .eventsCalendar-subtitle, .eventsCalendar-list-wrap .eventsCalendar-list-content { margin-left: 5%; margin-right: 5%; } .eventsCalendar-list-content.scrollable { height: 100px; overflow-y: auto; margin: 0 5px 5px 0; } .eventsCalendar-list, .eventsCalendar-list li { margin: 0; padding: 0; list-style-type: none; display: block; width: 100%; } .eventsCalendar-list { margin-bottom: 5%; } .eventsCalendar-list time, .eventsCalendar-list .eventTitle, .eventsCalendar-list .eventDesc { display: inline-block; } .eventsCalendar-list .eventTitle { margin-left: 7px; } .eventsCalendar-list .eventDesc { clear: both; width: 100%; } .eventsCalendar-list li time small { background-color: #807E7E; color: #fff; padding: 0 5px 0 4px; margin: 0 0 0 3px; } .eventsCalendar-list .eventTitle:hover { text-decoration: underline; } .eventsCalendar-list li .eventDesc { clear: both; margin: 0 0 5px 0; } .eventsCalendar-list .eventsCalendar-noEvents { font-size: 120%; padding: 14px; background-color: #eee; color: #999; text-align: center; font-weight: 400; } .eventsCalendar-list .eventsCalendar-noEvents p { margin: 0; } .bt { font-size: 12px; display: block; clear: both; text-align: center; margin-top: 10px; padding: 9px 34px 11px; text-decoration: none; font-weight: 700; line-height: 1; color: #ffffff; background-color: #698B10; background-repeat: repeat-x; background-image: -khtml-gradient(linear, left top, left bottom, from(#89B814), to(#698B10)); background-image: -moz-linear-gradient(top, #89B814, #698B10); background-image: -ms-linear-gradient(top, #89B814, #698B10); background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #89B814), color-stop(100%, #698B10)); background-image: -webkit-linear-gradient(top, #89B814, #698B10); background-image: -o-linear-gradient(top, #89B814, #698B10); background-image: linear-gradient(top, #89B814, #698B10); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#89B814', endColorstr='#698B10', GradientType=0); text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25); border: 1px solid #698B10; border-color: #698B10 #698B10 #465F05; border-radius: 4px; -webkit-transition: 0.1s linear all; -moz-transition: 0.1s linear all; -ms-transition: 0.1s linear all; -o-transition: 0.1s linear all; transition: 0.1s linear all; } .bt:hover { background-position: 0 -15px; text-decoration: none; } /* ----------------------------------------------------------------------------------------------------------------- END OF eventcalendar CORE CSS ----------------------------------------------------------------------------------------------------------------- */ /* ----------------------------------------------------------------------------------------------------------------- SmoothZoom styles ported from prettyphoto.css ----------------------------------------------------------------------------------------------------------------- */ .smooth_zoom_preloader { background-image: url(//images.salattu.fi/images/zoom_assets/preloader.gif); } .smooth_zoom_icons { background-image: url(//images.salattu.fi/images/zoom_assets/icons.png); } .zoom_gallery { position: relative; display: block; float: left; border: solid 2px #EDEDED; padding: 6px; z-index: 0; margin: 0px; } .zoom_gallery a { z-index: 0; float: none; width: auto; overflow: auto; } .zoom_gallery li { display: block; } ul.zoom_gallery { display: none; border: none; } .zoom_gallery li img, .zoom_gallery img { margin: 0; border: none; } #ZoomIconWrap { position: relative; display: block; float: left; border: solid 2px #EDEDED; padding: 6px; } #ShopImagesMain { position: relative; display: block; float: left; } #zoomimage { position: absolute; background: url("//images.salattu.fi/images/zoom.png") no-repeat bottom left; width: 50px; height: 50px; z-index: 1000; bottom: 10px; left: 10px; } #ShopProdImages { width: 220px; float: left; position: relative; } .zoom_gallery img.ShopProdThumbImg { margin: 3px 0 3px 8px; border: solid 2px #FFF; box-shadow: 0 0 2px #FFF; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)"; filter: alpha(opacity=70); opacity: .7; } .zoom_gallery img.ShopProdThumbImgSel { border: solid 2px #FFF; box-shadow: 0 0 2px #999; *border: solid 2px #aaa; margin: 3px 0 3px 8px; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter: alpha(opacity=100); opacity: 1; } .zoom_gallery img.ShopProdThumbImg:hover { margin: 3px 0 3px 8px; border: solid 2px #FFF; *border: solid 2px #aaa; box-shadow: 0 0 2px #999; margin: 3px 0 3px 8px; -moz-transition: all 0.3s ease-in-out; -webkit-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter: alpha(opacity=100); opacity: 1; } /* ----------------------------------------------------------------------------------------------------------------- COLORBOX CSS (edited 12/09/2014) ----------------------------------------------------------------------------------------------------------------- */ /* 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;padding:14px;} #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;} /*.noSel.smooth_zoom_preloader { z-index:3; }*/ .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:url(//images.salattu.fi/images/cbimages/overlay.png) repeat 0 0;} #colorbox{outline:0;} #cboxTopLeft{width:21px; height:21px; background:url(//images.salattu.fi/images/cbimages/controls.png) no-repeat -101px 0;} #cboxTopRight{width:21px; height:21px; background:url(//images.salattu.fi/images/cbimages/controls.png) no-repeat -130px 0;} #cboxBottomLeft{width:21px; height:21px; background:url(//images.salattu.fi/images/cbimages/controls.png) no-repeat -101px -29px;} #cboxBottomRight{width:21px; height:21px; background:url(//images.salattu.fi/images/cbimages/controls.png) no-repeat -130px -29px;} #cboxMiddleLeft{width:21px; background:url(//images.salattu.fi/images/cbimages/controls.png) left top repeat-y;} #cboxMiddleRight{width:21px; background:url(//images.salattu.fi/images/cbimages/controls.png) right top repeat-y;} #cboxTopCenter{height:21px; background:url(//images.salattu.fi/images/cbimages/border.png) 0 0 repeat-x;} #cboxBottomCenter{height:21px; background:url(//images.salattu.fi/images/cbimages/border.png) 0 -29px repeat-x;} #cboxContent{background:#fff; overflow:hidden;} .cboxIframe{background:#fff;} #cboxError{padding:50px; border:1px solid #ccc;} #cboxLoadedContent{margin:14px 0;} #cboxTitle{position:absolute; top:0; left:0; text-align:center; width:100%; color:#555;} #cboxCurrent{position:absolute; bottom:4px; left:58px; color:#949494;} #cboxLoadingOverlay{background:url(//images.salattu.fi/images/cbimages/loading_background.png) no-repeat center center;} #cboxLoadingGraphic{background:url(//images.salattu.fi/images/cbimages/loading.gif) no-repeat center center;} /* 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:4px; right:30px; color:#0092ef;} #cboxPrevious{position:absolute; bottom:0; left:0; background:url(//images.salattu.fi/images/cbimages/controls.png) no-repeat -75px 0; width:25px; height:25px; text-indent:-9999px;} #cboxPrevious:hover{background-position:-75px -25px;} #cboxNext{position:absolute; bottom:0; left:27px; background:url(//images.salattu.fi/images/cbimages/controls.png) no-repeat -50px 0; width:25px; height:25px; text-indent:-9999px;} #cboxNext:hover{background-position:-50px -25px;} #cboxClose{position:absolute; top:0; right:0; background:url(//images.salattu.fi/images/cbimages/controls.png) no-repeat -25px 0; width:25px; height:25px; text-indent:-9999px;} #cboxClose:hover{background-position:-25px -25px;} /* 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); } /* ----------------------------------------------------------------------------------------------------------------- HIGHSLIDE CSS (added 12/09/14) ----------------------------------------------------------------------------------------------------------------- */ /** * @file: highslide.css * @version: 4.1.7 */ .highslide-container div { font-family: Verdana, Helvetica; font-size: 10pt; } .highslide-container table { background: none; } .highslide { outline: none; text-decoration: none; } .highslide img { border: 2px solid silver; } .highslide:hover img { border-color: gray; } .highslide-active-anchor img { visibility: hidden; } .highslide-gallery .highslide-active-anchor img { border-color: black; visibility: visible; cursor: default; } .highslide-image { border-width: 2px; border-style: solid; border-color: white; background: gray; } .highslide-wrapper, .highslide-outline { background: white; } .glossy-dark { background: #111; } .highslide-image-blur { } .highslide-number { font-weight: bold; color: gray; font-size: .9em; } .highslide-caption { display: none; font-size: 1em; padding: 5px;/*background: white;*/ } .highslide-heading { display: none; font-weight: bold; margin: 0.4em; } .highslide-dimming { position: absolute; background: black; } a.highslide-full-expand { background: url(//images.salattu.fi/styles/highslide/graphics/fullexpand.gif) no-repeat; display: block; margin: 0 10px 10px 0; width: 34px; height: 34px; } .highslide-loading { display: block; color: black; font-size: 9px; font-weight: bold; text-transform: uppercase; text-decoration: none; padding: 3px; border: 1px solid white; background-color: white; padding-left: 22px; background-image: url(//images.salattu.fi/styles/highslide/graphics/loader.white.gif); background-repeat: no-repeat; background-position: 3px 1px; } a.highslide-credits, a.highslide-credits i { padding: 2px; color: silver; text-decoration: none; font-size: 10px; } a.highslide-credits:hover, a.highslide-credits:hover i { color: white; background-color: gray; } .highslide-move, .highslide-move * { cursor: move; } .highslide-viewport { display: none; position: fixed; width: 100%; height: 100%; z-index: 1; background: none; left: 0; top: 0; } .highslide-overlay { display: none; } .hidden-container { display: none; } /* Example of a semitransparent, offset closebutton */ .closebutton { position: relative; top: -15px; left: 15px; width: 30px; height: 30px; cursor: pointer; background: url(//images.salattu.fi/styles/highslide/graphics/close.png);/* NOTE! For IE6, you also need to update the highslide-ie6.css file. */ } /*****************************************************************************/ /* Thumbnail boxes for the galleries. */ /* Remove these if you are not using a gallery. */ /*****************************************************************************/ .highslide-gallery ul { list-style-type: none; margin: 0; padding: 0; } .highslide-gallery ul li { display: block; position: relative; float: left; width: 106px; height: 106px; border: 1px solid silver; background: #ededed; margin: 2px; line-height: 0; overflow: hidden; } .highslide-gallery ul a { position: absolute; top: 50%; left: 50%; } .highslide-gallery ul img { position: relative; top: -50%; left: -50%; } html>/**/body .highslide-gallery ul li { display: table; text-align: center; } html>/**/body .highslide-gallery ul li { text-align: center; } html>/**/body .highslide-gallery ul a { position: static; display: table-cell; vertical-align: middle; } html>/**/body .highslide-gallery ul img { position: static; } /*****************************************************************************/ /* Controls for the galleries. */ /* Remove these if you are not using a gallery */ /*****************************************************************************/ .highslide-controls { width: 195px; height: 40px; background: url(//images.salattu.fi/styles/highslide/graphics/controlbar-white.gif) 0 -90px no-repeat; margin: 20px 15px 10px 0; } .highslide-controls ul { position: relative; left: 15px; height: 40px; list-style: none; margin: 0; padding: 0; background: url(//images.salattu.fi/styles/highslide/graphics/controlbar-white.gif) right -90px no-repeat; } .highslide-controls li { float: left; padding: 5px 0; margin: 0; list-style: none; } .highslide-controls a { background-image: url(//images.salattu.fi/styles/highslide/graphics/controlbar-white.gif); display: block; float: left; height: 30px; width: 30px; outline: none; } .highslide-controls a.disabled { cursor: default; } .highslide-controls a.disabled span { cursor: default; } .highslide-controls a span { /* hide the text for these graphic buttons */ display: none; cursor: pointer; } /* The CSS sprites for the controlbar - see http://www.google.com/search?q=css+sprites */ .highslide-controls .highslide-previous a { background-position: 0 0; } .highslide-controls .highslide-previous a:hover { background-position: 0 -30px; } .highslide-controls .highslide-previous a.disabled { background-position: 0 -60px !important; } .highslide-controls .highslide-play a { background-position: -30px 0; } .highslide-controls .highslide-play a:hover { background-position: -30px -30px; } .highslide-controls .highslide-play a.disabled { background-position: -30px -60px !important; } .highslide-controls .highslide-pause a { background-position: -60px 0; } .highslide-controls .highslide-pause a:hover { background-position: -60px -30px; } .highslide-controls .highslide-next a { background-position: -90px 0; } .highslide-controls .highslide-next a:hover { background-position: -90px -30px; } .highslide-controls .highslide-next a.disabled { background-position: -90px -60px !important; } .highslide-controls .highslide-move a { background-position: -120px 0; } .highslide-controls .highslide-move a:hover { background-position: -120px -30px; } .highslide-controls .highslide-full-expand a { background-position: -150px 0; } .highslide-controls .highslide-full-expand a:hover { background-position: -150px -30px; } .highslide-controls .highslide-full-expand a.disabled { background-position: -150px -60px !important; } .highslide-controls .highslide-close a { background-position: -180px 0; } .highslide-controls .highslide-close a:hover { background-position: -180px -30px; } /*****************************************************************************/ /* Styles for the HTML popups */ /* Remove these if you are not using Highslide HTML */ /*****************************************************************************/ .highslide-maincontent { display: none; } .highslide-html { background-color: white; } .highslide-html-content { display: none; width: 400px; padding: 0 5px 5px 5px; } .highslide-header { padding-bottom: 5px; } .highslide-header ul { margin: 0; padding: 0; text-align: right; } .highslide-header ul li { display: inline; padding-left: 1em; } .highslide-header ul li.highslide-previous, .highslide-header ul li.highslide-next { display: none; } .highslide-header a { font-weight: bold; color: gray; text-transform: uppercase; text-decoration: none; } .highslide-header a:hover { color: black; } .highslide-header .highslide-move a { cursor: move; } .highslide-footer { height: 16px; } .highslide-footer .highslide-resize { display: block; float: right; margin-top: 5px; height: 11px; width: 11px; background: url(//images.salattu.fi/styles/highslide/graphics/resize.gif) no-repeat; } .highslide-footer .highslide-resize span { display: none; } .highslide-body { } .highslide-resize { cursor: nw-resize; } /*****************************************************************************/ /* Styles for the Individual wrapper class names. */ /* See www.highslide.com/ref/hs.wrapperClassName */ /* You can safely remove the class name themes you don't use */ /*****************************************************************************/ /* hs.wrapperClassName = 'draggable-header' */ .draggable-header .highslide-header { height: 18px; border-bottom: 1px solid #dddddd; } .draggable-header .highslide-heading { position: absolute; margin: 2px 0.4em; } .draggable-header .highslide-header .highslide-move { cursor: move; display: block; height: 16px; position: absolute; right: 24px; top: 0; width: 100%; z-index: 1; } .draggable-header .highslide-header .highslide-move * { display: none; } .draggable-header .highslide-header .highslide-close { position: absolute; right: 2px; top: 2px; z-index: 5; padding: 0; } .draggable-header .highslide-header .highslide-close a { display: block; height: 16px; width: 16px; background-image: url(//images.salattu.fi/styles/highslide/graphics/closeX.png); } .draggable-header .highslide-header .highslide-close a:hover { background-position: 0 16px; } .draggable-header .highslide-header .highslide-close span { display: none; } .draggable-header .highslide-maincontent { padding-top: 1em; } /* hs.wrapperClassName = 'titlebar' */ .titlebar .highslide-header { height: 18px; border-bottom: 1px solid #dddddd; } .titlebar .highslide-heading { position: absolute; width: 90%; margin: 1px 0 1px 5px; color: #666666; } .titlebar .highslide-header .highslide-move { cursor: move; display: block; height: 16px; position: absolute; right: 24px; top: 0; width: 100%; z-index: 1; } .titlebar .highslide-header .highslide-move * { display: none; } .titlebar .highslide-header li { position: relative; top: 3px; z-index: 2; padding: 0 0 0 1em; } .titlebar .highslide-maincontent { padding-top: 1em; } /* hs.wrapperClassName = 'no-footer' */ .no-footer .highslide-footer { display: none; } /* hs.wrapperClassName = 'wide-border' */ .wide-border { background: white; } .wide-border .highslide-image { border-width: 10px; } .wide-border .highslide-caption { padding: 0 10px 10px 10px; } /* hs.wrapperClassName = 'borderless' */ .borderless .highslide-image { border: none; } .borderless .highslide-caption { border-bottom: 1px solid white; border-top: 1px solid white; background: silver; } /* hs.wrapperClassName = 'outer-glow' */ .outer-glow { background: #444; } .outer-glow .highslide-image { border: 5px solid #444444; } .outer-glow .highslide-caption { border: 5px solid #444444; border-top: none; padding: 5px; background-color: gray; } /* hs.wrapperClassName = 'colored-border' */ .colored-border { background: white; } .colored-border .highslide-image { border: 2px solid green; } .colored-border .highslide-caption { border: 2px solid green; border-top: none; } /* hs.wrapperClassName = 'dark' */ .dark { background: #111; } .dark .highslide-image { border-color: black black #202020 black; background: gray; } .dark .highslide-caption { color: white; background: #111; } .dark .highslide-controls, .dark .highslide-controls ul, .dark .highslide-controls a { background-image: url(//images.salattu.fi/styles/highslide/graphics/controlbar-black-border.gif); } /* hs.wrapperClassName = 'floating-caption' */ .floating-caption .highslide-caption { position: absolute; padding: 1em 0 0 0; background: none; color: white; border: none; font-weight: bold; } /* hs.wrapperClassName = 'controls-in-heading' */ .controls-in-heading .highslide-heading { color: gray; font-weight: bold; height: 20px; overflow: hidden; cursor: default; padding: 0 0 0 22px; margin: 0; background: url(//images.salattu.fi/styles/highslide/graphics/icon.gif) no-repeat 0 1px; } .controls-in-heading .highslide-controls { width: 105px; height: 20px; position: relative; margin: 0; top: -23px; left: 7px; background: none; } .controls-in-heading .highslide-controls ul { position: static; height: 20px; background: none; } .controls-in-heading .highslide-controls li { padding: 0; } .controls-in-heading .highslide-controls a { background-image: url(//images.salattu.fi/styles/highslide/graphics/controlbar-white-small.gif); height: 20px; width: 20px; } .controls-in-heading .highslide-controls .highslide-move { display: none; } .controls-in-heading .highslide-controls .highslide-previous a { background-position: 0 0; } .controls-in-heading .highslide-controls .highslide-previous a:hover { background-position: 0 -20px; } .controls-in-heading .highslide-controls .highslide-previous a.disabled { background-position: 0 -40px !important; } .controls-in-heading .highslide-controls .highslide-play a { background-position: -20px 0; } .controls-in-heading .highslide-controls .highslide-play a:hover { background-position: -20px -20px; } .controls-in-heading .highslide-controls .highslide-play a.disabled { background-position: -20px -40px !important; } .controls-in-heading .highslide-controls .highslide-pause a { background-position: -40px 0; } .controls-in-heading .highslide-controls .highslide-pause a:hover { background-position: -40px -20px; } .controls-in-heading .highslide-controls .highslide-next a { background-position: -60px 0; } .controls-in-heading .highslide-controls .highslide-next a:hover { background-position: -60px -20px; } .controls-in-heading .highslide-controls .highslide-next a.disabled { background-position: -60px -40px !important; } .controls-in-heading .highslide-controls .highslide-full-expand a { background-position: -100px 0; } .controls-in-heading .highslide-controls .highslide-full-expand a:hover { background-position: -100px -20px; } .controls-in-heading .highslide-controls .highslide-full-expand a.disabled { background-position: -100px -40px !important; } .controls-in-heading .highslide-controls .highslide-close a { background-position: -120px 0; } .controls-in-heading .highslide-controls .highslide-close a:hover { background-position: -120px -20px; } /*****************************************************************************/ /* Styles for text based controls. */ /* You can safely remove this if you don't use text based controls */ /*****************************************************************************/ .text-controls .highslide-controls { width: auto; height: auto; margin: 0; text-align: center; background: none; } .text-controls ul { position: static; background: none; height: auto; left: 0; } .text-controls .highslide-move { display: none; } .text-controls li { background-image: url(//images.salattu.fi/styles/highslide/graphics/controlbar-text-buttons.png); background-position: right top !important; padding: 0; margin-left: 15px; display: block; width: auto; } .text-controls a { background: url(//images.salattu.fi/styles/highslide/graphics/controlbar-text-buttons.png) no-repeat; background-position: left top !important; position: relative; left: -10px; display: block; width: auto; height: auto; text-decoration: none !important; } .text-controls a span { background: url(//images.salattu.fi/styles/highslide/graphics/controlbar-text-buttons.png) no-repeat; margin: 1px 2px 1px 10px; display: block; min-width: 4em; height: 18px; line-height: 18px; padding: 1px 0 1px 18px; color: #333; font-family: "Trebuchet MS", Arial, sans-serif; font-size: 12px; font-weight: bold; white-space: nowrap; } .text-controls .highslide-next { margin-right: 1em; } .text-controls .highslide-full-expand a span { min-width: 0; margin: 1px 0; padding: 1px 0 1px 10px; } .text-controls .highslide-close a span { min-width: 0; } .text-controls a:hover span { color: black; } .text-controls a.disabled span { color: #999; } .text-controls .highslide-previous span { background-position: 0 -40px; } .text-controls .highslide-previous a.disabled { background-position: left top !important; } .text-controls .highslide-previous a.disabled span { background-position: 0 -140px; } .text-controls .highslide-play span { background-position: 0 -60px; } .text-controls .highslide-play a.disabled { background-position: left top !important; } .text-controls .highslide-play a.disabled span { background-position: 0 -160px; } .text-controls .highslide-pause span { background-position: 0 -80px; } .text-controls .highslide-next span { background-position: 0 -100px; } .text-controls .highslide-next a.disabled { background-position: left top !important; } .text-controls .highslide-next a.disabled span { background-position: 0 -200px; } .text-controls .highslide-full-expand span { background: none; } .text-controls .highslide-full-expand a.disabled { background-position: left top !important; } .text-controls .highslide-close span { background-position: 0 -120px; } /*****************************************************************************/ /* Styles for the thumbstrip. */ /* See www.highslide.com/ref/hs.addSlideshow */ /* You can safely remove this if you don't use a thumbstrip */ /*****************************************************************************/ .highslide-thumbstrip { height: 100%; } .highslide-thumbstrip div { overflow: hidden; } .highslide-thumbstrip table { position: relative; padding: 0; border-collapse: collapse; } .highslide-thumbstrip td { padding: 1px;/*text-align: center;*/ } .highslide-thumbstrip a { outline: none; } .highslide-thumbstrip img { display: block; border: 1px solid gray; margin: 0 auto; } .highslide-thumbstrip .highslide-active-anchor img { visibility: visible; } .highslide-thumbstrip .highslide-marker { position: absolute; width: 0; height: 0; border-width: 0; border-style: solid; border-color: transparent; /* change this to actual background color in highslide-ie6.css */ } .highslide-thumbstrip-horizontal div { width: auto;/* width: 100% breaks in small strips in IE */ } .highslide-thumbstrip-horizontal .highslide-scroll-up { display: none; position: absolute; top: 3px; left: 3px; width: 25px; height: 42px; } .highslide-thumbstrip-horizontal .highslide-scroll-up div { margin-bottom: 10px; cursor: pointer; background: url(//images.salattu.fi/styles/highslide/graphics/scrollarrows.png) left center no-repeat; height: 42px; } .highslide-thumbstrip-horizontal .highslide-scroll-down { display: none; position: absolute; top: 3px; right: 3px; width: 25px; height: 42px; } .highslide-thumbstrip-horizontal .highslide-scroll-down div { margin-bottom: 10px; cursor: pointer; background: url(//images.salattu.fi/styles/highslide/graphics/scrollarrows.png) center right no-repeat; height: 42px; } .highslide-thumbstrip-horizontal table { margin: 2px 0 10px 0; } .highslide-viewport .highslide-thumbstrip-horizontal table { margin-left: 10px; } .highslide-thumbstrip-horizontal img { width: auto; height: 40px; } .highslide-thumbstrip-horizontal .highslide-marker { top: 47px; border-left-width: 6px; border-right-width: 6px; border-bottom: 6px solid gray; } .highslide-viewport .highslide-thumbstrip-horizontal .highslide-marker { margin-left: 10px; } .dark .highslide-thumbstrip-horizontal .highslide-marker, .highslide-viewport .highslide-thumbstrip-horizontal .highslide-marker { border-bottom-color: white !important; } .highslide-thumbstrip-vertical-overlay { overflow: hidden !important; } .highslide-thumbstrip-vertical div { height: 100%; } .highslide-thumbstrip-vertical a { display: block; } .highslide-thumbstrip-vertical .highslide-scroll-up { display: none; position: absolute; top: 0; left: 0; width: 100%; height: 25px; } .highslide-thumbstrip-vertical .highslide-scroll-up div { margin-left: 10px; cursor: pointer; background: url(//images.salattu.fi/styles/highslide/graphics/scrollarrows.png) top center no-repeat; height: 25px; } .highslide-thumbstrip-vertical .highslide-scroll-down { display: none; position: absolute; bottom: 0; left: 0; width: 100%; height: 25px; } .highslide-thumbstrip-vertical .highslide-scroll-down div { margin-left: 10px; cursor: pointer; background: url(//images.salattu.fi/styles/highslide/graphics/scrollarrows.png) bottom center no-repeat; height: 25px; } .highslide-thumbstrip-vertical table { margin: 10px 0 0 10px; } .highslide-thumbstrip-vertical img { max-width: 60px; } .highslide-thumbstrip-vertical .highslide-marker { left: 0; margin-top: 8px; border-top-width: 6px; border-bottom-width: 6px; border-left: 6px solid gray; } .dark .highslide-thumbstrip-vertical .highslide-marker, .highslide-viewport .highslide-thumbstrip-vertical .highslide-marker { border-left-color: white; } .highslide-viewport .highslide-thumbstrip-float { overflow: auto; } .highslide-thumbstrip-float ul { margin: 2px 0; padding: 0; } .highslide-thumbstrip-float li { display: block; height: 60px; margin: 0 2px; list-style: none; float: left; } .highslide-thumbstrip-float img { display: inline; border-color: silver; max-height: 56px; } .highslide-thumbstrip-float .highslide-active-anchor img { border-color: black; } .highslide-thumbstrip-float .highslide-scroll-up div, .highslide-thumbstrip-float .highslide-scroll-down div { display: none; } .highslide-thumbstrip-float .highslide-marker { display: none; } /*****************************************************************************/ /* The following styles are added by the Highslide Editor */ /*****************************************************************************/ .highslide-wrapper, .highslide-outline { background: #FFFFFF; } .highslide img { border: 1px solid #D0D0D0; } .highslide:hover img { border-color: #A0A0A0; } .highslide-dimming { background: #000000; } .highslide-image { border: 2px solid #FFFFFF; } .highslide-loading { color: black; border: 1px solid black; background-color: white; background-image: url(//images.salattu.fi/styles/highslide/graphics/loader.white.gif); } .close-simple-white { width: 16px; height: 16px; background: white url(//images.salattu.fi/styles/highslide/graphics/controlbar-text-buttons.png) 0 -221px; cursor: pointer; } .highslide-html { background: none; } .highslide-header ul a { background-image: url(//images.salattu.fi/styles/highslide/graphics/controlbar-text-buttons.png); padding-left: 16px; display: inline-block; height: 16px; } .highslide-header ul li span { display: none; } .highslide-header .highslide-move { display: none; } .highslide-header .highslide-close { display: none; } /*****************************************************************************/ /* Datepicker loading animation */ /*****************************************************************************/ #ui-datepicker-div.loading .ui-datepicker-calendar { background: url('//images.salattu.fi/styles/images/loading.gif') center no-repeat; } #ui-datepicker-div.loading .ui-datepicker-calendar * { visibility: hidden; } /*****************************************************************************/ /* b2b-forms */ /*****************************************************************************/ @import url('//styles.salattu.fi/system/styles/dns-b2b-form.css');