/* ---------------------------------------------------------------------------------------------------------------------- ---------------------------------------- Ilmarinen.fi main stylesheet---------------------------------------- -----------------------------------------------------------------------------------------------------------------------*/ body {height:100%;} .textCustomer, [class*="icon"].customer, a.textCustomer {color:#078299;} .textEntrepreneur, [class*="icon"].entrepreneur, a.textEntrepreneur {color:#f7d8dc;} .textEmployer, [class*="icon"].employer, a.textEmployer {color:#078299;} .textIlmarinen, [class*="icon"].ilmarinen, a.textIlmarinen {color:#facc25;} .textNewsroom, [class*="icon"].newsroom, a.textNewsroom {color:#d83b51;} .textDarkblue, [class*="icon"].darkblue, a.textDarkblue {color:#00274b;} .textLightblue, [class*="icon"].lightblue, a.textLightblue {color:#cde6eb;} .textWhite{ color: #fff !important; } .textCustomer {color:#078299 !important;} .textEntrepreneur{color:#f7d8dc !important;} .textEmployer{color:#078299 !important;} .textIlmarinen{color:#facc25 !important;} .textNewsroom{color:#d83b51 !important;} .textDarkblue{color:#00274b !important;} .textLightblue{color:#cde6eb !important;} .textWhite > a{ color: #FFF !important; } .textCustomer > a {color:#078299 !important;} .textEntrepreneur > a{color:#f7d8dc !important;} .textEmployer > a {color:#078299 !important;} .textIlmarinen > a {color:#facc25 !important;} .textNewsroom > a {color:#d83b51 !important;} .textDarkblue > a {color:#00274b !important;} .textLightblue > a {color:#cde6eb !important;} .textWhite > strong > a{ color: #FFF !important; } .textCustomer > strong > a {color:#078299 !important;} .textEntrepreneur > strong > a{color:#f7d8dc !important;} .textEmployer > strong > a {color:#078299 !important;} .textIlmarinen > strong > a {color:#facc25 !important;} .textNewsroom > strong > a {color:#d83b51 !important;} .textDarkblue > strong > a {color:#00274b !important;} .textLightblue > strong > a {color:#cde6eb !important;} #contentWrapper div.lightblue, #contentWrapper div.lightblue .row, #contentWrapper li.lightblue a {background-color:#cde6eb; } #contentWrapper div.employer, #contentWrapper div.employer .row, #contentWrapper li.employer a {background-color:#078299; } #contentWrapper div.customer, #contentWrapper div.customer .row, #contentWrapper li.customer a{background-color:#078299; } #contentWrapper div.ilmarinen, #contentWrapper div.ilmarinen .row, #contentWrapper li.ilmarinen a {background-color:#facc25; } #contentWrapper div.entrepreneur, #contentWrapper div.entrepreneur .row, #contentWrapper li.entrepreneur a {background-color:#f7d8dc; } #contentWrapper div.newsroom, #contentWrapper div.newsroom .row, #contentWrapper li.newsroom a {background-color:#d83b51; } #contentWrapper div.grey, #contentWrapper div.grey .row, #contentWrapper li.grey a {background-color:#eeeeee;} #contentWrapper div.darkblue, #contentWrapper div.darkblue .row, #contentWrapper li.darkblue a {background-color:#00274b;} #contentWrapper div.entrepreneur div, #contentWrapper div.entrepreneur p, #contentWrapper div.entrepreneur h3, #contentWrapper div.entrepreneur h4, #contentWrapper div.entrepreneur li, #contentWrapper div.darkblue div, #contentWrapper div.darkblue p, #contentWrapper div.darkblue h3, #contentWrapper div.darkblue h4, #contentWrapper div.darkblue li, #contentWrapper div.employer p, #contentWrapper div.employer h3, #contentWrapper div.employer h4, #contentWrapper div.employer li, #contentWrapper div.highlightBlock.employer div, #contentWrapper div.highlightBlock.employer p, #contentWrapper div.highlightBlock.employer h2, #contentWrapper div.highlightBlock.employer h3, #contentWrapper div.highlightBlock.employer h4, #contentWrapper div.highlightBlock.newsroom div, #contentWrapper div.highlightBlock.newsroom p, #contentWrapper div.highlightBlock.newsroom h2, #contentWrapper div.highlightBlock.newsroom h3, #contentWrapper div.highlightBlock.newsroom h4, #contentWrapper div.highlightBlock.employer a, #contentWrapper div.highlightBlock.newsroom a, #contentWrapper div.highlightBlock.entrepreneur a, #contentWrapper div.highlightBlock.darkblue a, #contentWrapper div.highlightBlock.customer a, #contentWrapper div.sectionBlock .employer div, #contentWrapper div.sectionBlock .employer p, #contentWrapper div.sectionBlock .employer h2, #contentWrapper div.sectionBlock .employer h3, #contentWrapper div.sectionBlock .employer h4, #contentWrapper div.sectionBlock .newsroom div, #contentWrapper div.sectionBlock .newsroom p, #contentWrapper div.sectionBlock .newsroom h2, #contentWrapper div.sectionBlock .newsroom h3, #contentWrapper div.sectionBlock .newsroom h4, #contentWrapper div.sectionBlock .entrepreneur div, #contentWrapper div.sectionBlock .entrepreneur p, #contentWrapper div.sectionBlock .entrepreneur h2, #contentWrapper div.sectionBlock .entrepreneur h3, #contentWrapper div.sectionBlock .entrepreneur h4, #contentWrapper div.sectionBlock .employer a, #contentWrapper div.sectionBlock .newsroom a, #contentWrapper div.sectionBlock .entrepreneur a, #contentWrapper div.sectionBlock .darkblue a, div.sectionBlock .entrepeneur a, #contentWrapper div.twoColumnBlock .employer div, #contentWrapper div.twoColumnBlock .employer p, #contentWrapper div.twoColumnBlock .employer h2, #contentWrapper div.twoColumnBlock .employer h3, #contentWrapper div.twoColumnBlock .employer h4, #contentWrapper div.twoColumnBlock .newsroom div, #contentWrapper div.twoColumnBlock .newsroom p, #contentWrapper div.twoColumnBlock .newsroom h2, #contentWrapper div.twoColumnBlock .newsroom h3, #contentWrapper div.twoColumnBlock .newsroom h4, #contentWrapper div.twoColumnBlock .entrepreneur div, #contentWrapper div.twoColumnBlock .entrepreneur p, #contentWrapper div.twoColumnBlock .entrepreneur h2, #contentWrapper div.twoColumnBlock .entrepreneur h3, #contentWrapper div.twoColumnBlock .entrepreneur h4, #contentWrapper div.twoColumnBlock .employer a, #contentWrapper div.twoColumnBlock .newsroom a, #contentWrapper div.twoColumnBlock .entrepreneur a, #contentWrapper div.twoColumnBlock .darkblue a, div.twoColumnBlock .entrepeneur a, div.twoColumnBlock .customer a{color:#fff;} #contentWrapper div.highlightBlock.employer a.btn, #contentWrapper div.highlightBlock.entrepreneur a.btn, #contentWrapper div.highlightBlock.employer a.btn, #contentWrapper div.highlightBlock.darkblue a.btn, #contentWrapper div.sectionBlock .employer a.btn, #contentWrapper div.sectionBlock .entrepreneur a.btn, #contentWrapper div.sectionBlock .employer a.btn, #contentWrapper div.sectionBlock.darkblue a.btn, #contentWrapper div.twoColumnBlock .employer a.btn, #contentWrapper div.twoColumnBlock .entrepreneur a.btn, #contentWrapper div.twoColumnBlock .employer a.btn, #contentWrapper div.twoColumnBlock .darkblue a.btn{color:#00274b;} #contentWrapper div.highlightBlock.employer a.btn:hover, #contentWrapper div.highlightBlock.entrepreneur a.btn:hover, #contentWrapper div.highlightBlock.employer a.btn:hover, #contentWrapper div.highlightBlock.darkblue a.btn:hover, #contentWrapper div.sectionBlock .employer a.btn:hover, #contentWrapper div.sectionBlock .entrepreneur a.btn:hover, #contentWrapper div.sectionBlock .employer a.btn:hover, #contentWrapper div.sectionBlock .darkblue a.btn:hover, #contentWrapper div.twoColumnBlock .employer a.btn:hover, #contentWrapper div.twoColumnBlock .entrepreneur a.btn:hover, #contentWrapper div.twoColumnBlock .employer a.btn:hover, #contentWrapper div.twoColumnBlock .darkblue a.btn:hover {color:#fff;} /* ----------- Reset ---------*/ .clearfix{*zoom:1;}.clearfix:before,.clearfix:after{display:table;content:"";line-height:0;} .clearfix:after{clear:both;} .hidden {display:none} .hide-text{font:0/0 a;color:transparent;text-shadow:none;background-color:transparent;border:0;} .input-block-level{display:block;width:100%;min-height:34px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;} article,aside,details,figcaption,figure,footer,header,hgroup,nav,section{display:block;} audio,canvas,video{display:inline-block;*display:inline;*zoom:1; width:100%;} audio:not([controls]){display:none;} html{font-size:100%;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;} a:focus,button:focus{ outline: 2px solid #078299; outline-offset: 2px; } a:hover,a:active{ outline:0; } sub,sup{position:relative;font-size:75%;line-height:0;vertical-align:baseline;} sup{top:-0.5em;} p {margin-top:0; margin-bottom:18px;} ul {margin:0;} sub{bottom:-0.25em;} img{max-width:100%;width:auto\9;height:auto;vertical-align:middle;border:0;-ms-interpolation-mode:bicubic;} #map_canvas img,#map_canvas2 img,.google-maps img{max-width:none;} button,input,select,textarea{margin:0;font-size:100%;vertical-align:middle;} button,input{*overflow:visible;line-height:normal;} button::-moz-focus-inner,input::-moz-focus-inner{padding:0;border:0;} button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer;} label,select,button,input[type="button"],input[type="reset"],input[type="submit"],input[type="radio"],input[type="checkbox"]{cursor:pointer;} input[type="search"]{-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;-webkit-appearance:textfield;} input[type="search"]::-webkit-search-decoration,input[type="search"]::-webkit-search-cancel-button{-webkit-appearance:none;} textarea{overflow:auto;vertical-align:top;} .pull-right { float: right !important; } .pull-left { float: left !important; } /* ------------------Body, links, typography (see typo.css) -------------------- */ h1 span.employer, h2 span.employer, h3 span.employer, h4 span.employer, h5 span.employer {color:#078299;} h1 span.customer, h2 span.customer, h3 span.customer, h4 span.customer, h5 span.customer {color:#078299;} h1 span.ilmarinen, h2 span.ilmarinen, h3 span.ilmarinen, h4 span.ilmarinen, h5 span.ilmarinen {color:#facc25;} h1 span.entrepreneur, h2 span.entrepreneur, h3 span.entrepreneur, h4 span.entrepreneur, h5 span.entrepreneur {color:#f7d8dc;} h1 span.newsroom, h2 span.newsroom, h3 span.newsroom, h4 span.newsroom, h5 span.newsroom {color:#d83b51;} .text-left{text-align:left;} .text-right{text-align:right;} .text-center{text-align:center;} .imagealignleft {float:left; margin:0 10px 10px 0; display:inline-block; } .subpageContentArea .imageAlignLeft, .subpageContentArea .imagealignleft {float:left; margin:0 20px 20px 0; display:inline-block; } .imagealignright {float:right; margin:0 0 10px 10px; display:inline-block; } .subpageContentArea .imageAlignRight, .subpageContentArea .imagealignright {float:right; margin:0 0 20px 20px; display:inline-block; } .textAlignRight, .textalignright{text-align:right;} .textAlignCenter, .textaligncenter{text-align:center;} /*------------------- Grid system -------------------- */ #contentWrapper { margin: 0px auto 20px; max-width: 1260px; position:relative; background-color:transparent; padding: 0 20px;} .mainImage + #contentWrapper {margin-top:-40px;} .mainImage.frontpage + #contentWrapper {margin-top:-100px;} #contentWrapper .row.wide {position:relative;} .row.error {padding: 20px 30px 150px 30px; -webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box; background-color:#fff;} #contentWrapper .row.linkListBlock {background-color:transparent;} .row {width:1260px; max-width: 100%; margin:0 auto; padding:0; } .span6 .row,.span4 .row { width:100%;} .mainBody .row {width: 100%;} .row.wide {width:100%; margin:0 auto; border:0;} /* content block that stretches its background to 100% */ .row:before,.row:after, .topHighlightContentArea:before,.topHighlightContentArea:after{display:table;content:"";line-height:0;} .row .row:before {display:block; } .row.workingarea .row:before {display:table;} .row:after, .topHighlightContentArea:before{clear:both;} .row [class*="span"]{margin-left: 0%; padding: 0px; display:block;width:100%;min-height:0px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;float:left; background-color:#fff; } footer .row [class*="span"] {background-color: transparent;} .row [class*="span"] [class*="span"] {/*padding:0;*/} .row [class*="span"]:first-child {margin-left:0%;clear:both; } /*.row [class*="span4"]:nth-child(4n+4) {margin-left:0%;clear:both; }*/ .row .span12{width:100%; } .row .span11{width:92.5%;} .row .span10{width:84%;} .row .span9{width:77.5%;} .row .span8{width:66.6%;} .row .span7{width:58.5%;} .row .span6{width:50%;} .row .span5{width:41.5%;} .row .span4{width:33.3%; } .row .span4:first-child, .row.mainContentArea .span12 + .span4 {width:33.4%;} .row .span3{width:25%;} .row .span2{width:16.6%;} .row .span2:first-child {width:17%;} .row .span1{width:7.5%;} .col-sm-5ths { float: left; min-height: 1px; padding-left: 10px; line-height: 1.2em; padding-right: 10px; position: relative; width: 20%; -webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box; } /* .row .span8:nth-child(3),.row .span8:nth-child(5),.row .span8:nth-child(8) {clear:both; margin-left:0;} .ie8 .row .span8:first-child + .span8 + .span8 {clear:both; margin-left:0;} ie8 */ [class*="span"].hide,.row [class*="span"].hide{display:none;} [class*="span"].pull-right,.row [class*="span"].pull-right{float:right;} /*columns padding - here are most of the blocks that need padding because the block background has color and blocks are next to each other (no margins used on columns)*/ .pageHelpLinkBlock, .processStepBlock, .sectionDropdown, .highlightText, .customerEventBlock, .threeColumnBlock, .processThreeStepBlock, .frontpageBottomArea .newsHighlightBlock, .colpadding, .row [class*="span"].colpadding, .white .twoColumnBlock .span6 { padding:40px 35px; -webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;} /*------------------- Buttons --------------------- */ a.btn, button.btn, span.btn { display:inline-block; font-family: "HelveticaNeueW01-75Bold", Arial; padding:16px 38px; line-height:18px; text-align:center; vertical-align:middle; cursor:pointer; color:#fff; background-color:#078299; text-transform:uppercase; font-size:15px; border-radius: 0; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; transition: all 0.2s linear; border:0; } .workingarea a.btn { padding: 16px; } a.btndarkblue, a.btnlightblue, button.btndarkblue, button.btnlightblue, span.btndarkblue, span.btnlightblue { display:inline-block; font-family: "HelveticaNeueW01-75Bold", Arial; padding: 10px 32px; line-height:18px; text-align:center; vertical-align:middle; cursor:pointer; color:#fff; background-color:#078299; text-transform:uppercase; font-size:15px; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; transition: all 0.2s linear; border:2px solid #078299; border-radius: 0; } a.btnwhite, a.btnwhite, button.btnwhite, button.btnwhite span.btnwhite, span.btnwhite { display:inline-block; font-family: "HelveticaNeueW01-75Bold", Arial; padding: 10px 32px; line-height:18px; text-align:center; vertical-align:middle; cursor:pointer; color:#00274b; background-color:#fff; text-transform:uppercase; font-size:15px; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; transition: all 0.2s linear; border:2px solid #00274b; border-radius: 0; } a.btn:hover, a.btndarkblue:hover, a.btnlightblue:hover, button.btn:hover, button.btndarkblue:hover, button.btnlightblue:hover, span.btn:hover, span.btndarkblue:hover, span.btnlightblue:hover { color:#fff; text-decoration:none; background-color:#05697c; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; transition: all 0.2s linear; } a.btn:active, a.btndarkblue:active, a.btnlightblue:active, button.btn:active, button.btndarkblue:active, button.btnlightblue:active, span.btn:active, span.btndarkblue:active, span.btnlightblue:active { color:#fff; text-decoration:none; background-color:#033e49; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; transition: all 0.2s linear; } a.btn:focus, a.btndarkblue:focus, a.btnlightblue:focus, a.btn:focus:active, a.btndarkblue:focus:active, a.btnlightblue:focus:active, button.btn:focus, button.btndarkblue:focus, button.btnlightblue:focus, button.btn:focus:active, button.btndarkblue:focus:active, button.btnlightblue:focus:active, span.btn:focus, span.btndarkblue:focus, span.btnlightblue:focus, span.btn:focus:active, span.btndarkblue:focus:active, span.btnlightblue:focus:active { color:#fff; text-decoration:none; background-color:#05697c; outline: 2px solid #078299; outline-offset: 2px; box-shadow: none; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; transition: all 0.2s linear; } a.btnwhite:hover, a.btnwhite:focus, a.btnwhite:focus:active, button.btnwhite:hover, button.btnwhite:focus, button.btnwhite:focus:active, span.btnwhite:hover, span.btnwhite:focus, span.btnwhite:focus:active { color:#00274b; background-color:#e5f2f5; text-decoration:none; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; transition: all 0.2s linear; } a.btnwhite:active, button.btnwhite:active, span.btnwhite:active { color:#00274b; background-color:#c1e0e7; text-decoration:none; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; transition: all 0.2s linear; } a.btnwhite:focus, a.btnwhite:focus:active, button.btnwhite:focus, button.btnwhite:focus:active, span.btnwhite:focus, span.btnwhite:focus:active { outline: 2px solid #078299; outline-offset: 2px; box-shadow: none; } a.btn.disabled, a.btn[disabled], button.btn.disabled, button.btn[disabled], span.btn.disabled, span.btn[disabled] { opacity: 1; background-color: #707070; border-color: #707070; color: #fff; } /* special editor styles */ a.arrowlinkDarkblue{ color: #00274b; } .arrowlinkDarkblue:after { content: "\00a0\203A"; } .arrowlink:after { content: "\00a0\203A"; } a.attachment { color:#00274b !important; display: inline-block; padding: 20px 20px 10px 20px; border: 2px solid #dddddd; background-color:#fff; border-radius: 7px; font-family: Arial,verdana } a.attachment:before { color:#00274b;content: "\47"; display: inline-block;float: left;font-size: 30px;line-height: 24px;margin-bottom: 10px;padding-right: 20px;position: relative; } a.attachment:after { color:#00274b;content: "\00a0\203A";} /* ---------------------- header -> see also headerfooter.css--------------------*/ /* language selection */ .languageWrapper.dropdown { display:inline-block; position:absolute; top:21px; right:320px; text-transform: uppercase; font-size:15px; color:#fff; font-family: 'HelveticaNeueW01-45Ligh', Arial; } .languageWrapper .arrowDown:before {color:#fff; font-size:8px;} .languageWrapper .arrowDown {padding-left:5px; position:relative; top: -2px; } .languageWrapper .dropdown-toggle { line-height: 29px; height:29px; display:inline-block; padding-right:10px; color:#fff; } .dropdown-toggle:hover {text-decoration:none;} ul.language { background-color:#fff; border-radius: 5px; padding: 0; text-align:left; margin:0; list-style:none; } ul.language li {text-transform: uppercase; margin:0; padding:0; line-height: 24px;} ul.language a { display:inline-block; padding: 4px 22px 2px 6px; } ul.language li.active {color:#333; background-color:transparent;} ul.language li a:hover {color:#333; text-decoration:none;} /*------------------ main navigation -------------------*/ .toggleMenu:before {font-size:25px; color:#fff; } .toggleMenu { cursor:pointer; position:absolute; top:0px; height: 20px; padding: 15px 18px 15px 0; display:none; } .toggleMenu:hover {text-decoration:none;} .navLangWrapper {float:left; margin-left: 100px; } .mainnav {padding-top: 0px;list-style: none; margin:0; font-size: 14px; font-weight: 500;} .mainnav:before,.mainnav:after {content: " "; display: table; } .mainnav:after {clear: both;} .mainnav ul {max-width:1170px; margin:0 auto; list-style: none; margin-left:0; } .mainnav li {float: left; margin: 0; line-height:38px; margin-right:3px; } .mainnav li.separator {line-height: 29px; height:29px; display:inline-block; border-right: 1px solid #124668; margin: 22px 10px 0 5px;} .mainnav li a {font-family: 'HelveticaNeueW01-45Ligh', Arial; color:#fff; text-align:left; cursor:pointer; display: block; padding: 17px 10px 9px; text-decoration:none; text-transform: uppercase; font-size:15px; } .mainnav > li.active > a{border-bottom:6px solid #FFF; color:#FFF;} .mainnav > li > a { border-bottom:6px solid #00274b;} .mainnav > li > a:hover { color:#FFF; border-bottom:6px solid #FFF;} .mainnav > li.active > a { color:#FFF; border-bottom:6px solid #FFF;} /* --------- Search ------- */ .sb-search {overflow: hidden; z-index:1; position:absolute; margin-left:10px; top: 18px; right: 160px; width:0; width:150px; height:36px; background: #fff; border-radius: 0px; -moz-transition: width 0.2s ease-out;-webkit-transition: width 0.2s ease-out;-moz-transition: width 0.2s ease-out; } .sb-search-input { position:absolute; left:30px;border: none; outline: none; width: 114px; height: 22px; margin: 0; padding: 6px 4px 8px 2px; font-family: inherit; font-size: 14px; background: #fff; border-top-left-radius: 5px; border-bottom-left-radius: 5px;color: #00274b; transition: width 0.2s ease-out;-webkit-transition: width 0.2s ease-out;-moz-transition: width 0.2s ease-out; } .sb-icon-search:before, .icon-ilmarinen_icon_picto-b:before { color: #00274b; } .sb-search-input:focus + .sb-icon-search, .sb-search.open .sb-icon-search {background-color:#fff; color:#999; } .sb-search-input::-webkit-input-placeholder { color: #89a3b3; opacity:1; font-style: italic; } .sb-search-input:-moz-placeholder { color: #89a3b3;opacity:1; font-style: italic;} .sb-search-input::-moz-placeholder { color: #89a3b3;opacity:1; font-style: italic;} .sb-search-input:-ms-input-placeholder { color: #89a3b3; opacity:1; font-style: italic;} .sb-search-input::-ms-clear { display: none;} .sb-icon-search {position:absolute; left:0; top:0; width: 24px; height: 22px; display:inline-block; padding: 0; margin: 0; line-height: 20px; text-align: center; cursor: pointer; border-top-right-radius: 5px; border-bottom-right-radius: 5px;color:#fff;padding:7px 3px 7px 4px; font-size: 16px; } .sb-search-submit {position:absolute; left:0; top:0;z-index:1; position:absolute; top:0; right:0; width: 35px; height: 36px; display:inline-block; padding: 0; margin: 0; line-height: 20px; text-align: center; cursor: pointer; } .sb-search-submit { background: #fff; /* IE needs this */ -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; /* IE 8 */ filter: alpha(opacity=0); /* IE 5-7 */ opacity: 0; color: transparent; border: none; outline: none; } .row.breadcrumb { overflow:hidden; white-space: nowrap; text-overflow:ellipsis; margin-top: 0px; text-align:left; z-index:1; font-family: "HelveticaNeueW01-75Bold", Arial; font-size:15px; color:#fff; -webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box; background-color:#00274b; padding:20px 40px; } .breadcrumb a {color:#fff; } .breadcrumb .arrowRight {padding: 0 5px;} .homeLink:hover {text-decoration:none;} .iconHome { color:#fff; font-size:20px; text-decoration:none;} /*------------------- content blocks / custom made layouts --------------------- */ .sectionContentPage .span12 {min-height:0; padding:0 35px;} .sectionContentPage.asiointi .span12 {color:#fff; background-color:transparent; padding-bottom:10px;} .sectionContentPage.asiointi + .row .span12:first-child {min-height:0;} .sectionContentPage .span12 h1:first-child, .sectionContentPage .span12 h2:first-child, .sectionContentPage .span12 h3:first-child, .sectionContentPage .span12 p:first-child {padding-top:40px; margin-top:0;} .sectionContentPage.asiointi .span12 h1:first-child, .sectionContentPage.asiointi .span12 h2:first-child, .sectionContentPage.asiointi .span12 h3:first-child, .sectionContentPage.asiointi .span12 p:first-child {padding-top:0px; margin-top:0;} .sectionContentPage .span12 p {margin-bottom:0; padding-bottom:18px;} /* Popup */ .ilmarinen-popup .ilmarinen-popup-background { position: fixed; z-index: 8000; top: 0; left: 0; width: 100%; max-width: 100vw; height: 100%; background-color: rgba(0, 0, 0, 0.5); } .ilmarinen-popup .ilmarinen-popup-foreground { position: relative; margin: 0 auto; background-color: #FFF; width: 100%; max-width: 1200px; top: 5%; box-sizing: border-box; } .ilmarinen-popup * { box-sizing: border-box; } .ilmarinen-popup .close-popup { position: absolute; font-size: 34px; height: 35px; width: 35px; right: 15px; top: 15px; font-weight: bold; z-index: 8000; } .ilmarinen-popup a.secure { background-color: #00274b; padding: 10px 15px; color: #fff; font-size: 16px; font-family: "HelveticaNeueW01-75Bold", Arial; display: inline-block; } .ilmarinen-popup a.secure:hover{ text-decoration: none; background-color: #078299; text-decoration: none; transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; } .ilmarinen-popup a.secure:before { content: "\61"; font-size: 18px; padding-right: 12px; position: relative; top: 1px; font-family: 'ilmarinen-iconfont'; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased; } .ilmarinen-popup.darkblue .upper-content{ background-color: #00274b; } .ilmarinen-popup.darkblue .upper-content-text{ color: #fff; } .ilmarinen-popup.darkblue .upper-content-text *{ color: #fff; } .ilmarinen-popup.lightblue .upper-content{ background-color: #cde6eb; } .ilmarinen-popup.lightblue .upper-content-text{ color: #00274b; } .ilmarinen-popup.lightblue .upper-content-text *{ color: #00274b; } .ilmarinen-popup.employer .upper-content{ background-color: #078299; } .ilmarinen-popup.employer .upper-content-text{ color: #00274b; } .ilmarinen-popup.employer .upper-content-text *{ color: #00274b; } .ilmarinen-popup.customer .upper-content{ background-color: #078299; } .ilmarinen-popup.customer .upper-content-text{ color: #00274b; } .ilmarinen-popup.customer .upper-content-text *{ color: #00274b; } .ilmarinen-popup.ilmarinen .upper-content{ background-color: #facc25; } .ilmarinen-popup.ilmarinen .upper-content-text{ color: #00274b; } .ilmarinen-popup.ilmarinen .upper-content-text *{ color: #00274b; } .ilmarinen-popup.entrepreneur .upper-content{ background-color: #f7d8dc; } .ilmarinen-popup.entrepreneur .upper-content-text{ color: #00274b; } .ilmarinen-popup.entrepreneur .upper-content-text *{ color: #00274b; } .ilmarinen-popup.newsroom .upper-content{ background-color: #d83b51; } .ilmarinen-popup.newsroom .upper-content-text{ color: #00274b; } .ilmarinen-popup.newsroom .upper-content-text *{ color: #00274b; } .ilmarinen-popup.white .upper-content{ background-color: #fff; } .ilmarinen-popup.white .upper-content-text{ color: #00274b; } .ilmarinen-popup.white .upper-content-text *{ color: #00274b; } .popup-image-included.upper-content { position: relative; } .popup-image-included .upper-content-text { position: absolute; bottom: 0; width: 100%; box-sizing: border-box; } .upper-content-text { padding: 50px; } .close-popup:hover { cursor: pointer; } .close-popup:before, .close-popup:after { position: absolute; right: 15px; content: ' '; height: 33px; width: 3px; background-color: #fff; } .close-popup:before { transform: rotate(45deg); } .close-popup:after { transform: rotate(-45deg); } .ilmarinen-popup .bottom-content { width: 100%; color: #00274b; padding-left: 50px; padding-right: 50px; padding-top: 20px; padding-bottom: 20px; } .ilmarinen-popup .bottom-content > *:first-child, .ilmarinen-popup .upper-content-text > *:first-child { margin-top: 0; } .ilmarinen-popup .popup-left-column { width: 33.3%; padding: 0 5px; float: left; } .ilmarinen-popup .popup-mid-column { width: 33.3%; padding: 0 5px; float: left; } .ilmarinen-popup .popup-right-column { width: 33.3%; padding: 0 5px; float: left; } /*tyky overrwrites some basic styles*/ #contentWrapper.white { max-width: 100%; background-color:#fff; height:100%;} .white h1 {} /*tyky spynav*/ .spynav { left:0; right:0; margin:0 auto; padding-top:40px; text-align:center; max-width: 1260px; width: 100%; z-index:1; } .fixed.spynav {position:fixed; top: 0; padding-top:10px; padding-bottom: 60px; background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 47%, rgba(255,255,255,0) 99%, rgba(255,255,255,0) 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(255,255,255,1) 47%,rgba(255,255,255,0) 99%,rgba(255,255,255,0) 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, rgba(255,255,255,1) 0%,rgba(255,255,255,1) 47%,rgba(255,255,255,0) 99%,rgba(255,255,255,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=0 ); /* IE6-9 */ } .fixed.spynav + .row {padding-top: 92px;} .spynav ul { border-left:0; } .spynav li {display:inline-block; margin:0 0 0 -6px; padding:0;background:#fff; } .spynav li a{color:#078299; font-family: 'HelveticaNeueW01-75Bold', Arial; font-size:15px; text-transform: uppercase; padding:6px 20px; display:inline-block; border: 1px solid #00274b; background-color:#fff;} .spynav li a:hover, .spynav li.active a{color:#fff; background-color:#f7d8dc;border-color:#f7d8dc; text-decoration:none; } /*tyky pathColumnBlock*/ .row.pathColumnBlock {margin-bottom:40px; font-family: "HelveticaNeueW01-75Bold", Arial; max-width: 950px;} .row.pathColumnBlock .col-sm-5ths:before {content: " "; height:6px; width:100%; background-color:#cccccc; position:absolute; top: 200px; display:block;} .pathColumnBlock .col-sm-5ths div {background-color:#00274b; width: 100px; height:100px; border-radius:80px; text-align:center; margin:0 auto; position:relative;} .row.pathColumnBlock .col-sm-5ths {border-left:0;} .pathColumnBlock .col-sm-5ths div span {color:#fff; font-size: 63px; padding-top: 19px; padding-left:3px;display: inline-block; } .pathColumnBlock .col-sm-5ths p {margin-top:25px;} .pathColumnBlock .col-sm-5ths a {display:block; padding-bottom:110px;} .pathColumnBlock .col-sm-5ths a span:after {content:""; width:34px; height:34px; border-radius: 34px; background-color:#00274b; display:block; position:relative; top: 103px; left:8px;} .pathColumnBlock .col-sm-5ths:nth-child(even) { /*display: flex; display: -webkit-flex; display: -moz-flex; display: -ms-flexbox; display: -o-flex; flex-direction: column-reverse; -webkit-flex-direction: column-reverse;-ms-flex-direction: column-reverse; */ /*does not work on ie9, so old absolute positioned way is the best*/ position:relative; padding-bottom:280px;} .pathColumnBlock .col-sm-5ths:nth-child(even) a {padding-top:78px; padding-bottom:0; position:absolute; top:163px; left:0; right:0;} .pathColumnBlock .col-sm-5ths:nth-child(even) a span:after {top:-146px;} .pathColumnBlock .col-sm-5ths:nth-child(even) a div:after {top:-72px;} .pathColumnBlock .col-sm-5ths:nth-child(even) p {padding-top:103px; margin-top:20px;} .pathColumnBlock .col-sm-5ths a div:after{content:""; width:3px; height:60px; background-color:#00274b; display:inline-block; position:relative; top:80px; left:-25px; } .pathColumnBlock .col-sm-5ths:nth-child(1) a div:after {height: 60px;} .pathColumnBlock .col-sm-5ths:nth-child(1) div {top: 30px;} .pathColumnBlock .col-sm-5ths:nth-child(1) a span:after {top: 74px; } .pathColumnBlock .col-sm-5ths:nth-child(2) a div:after {height: 40px;} .pathColumnBlock .col-sm-5ths:nth-child(2) div {top: 10px;} .pathColumnBlock .col-sm-5ths:nth-child(2) a span:after { } .pathColumnBlock .col-sm-5ths:nth-child(3) a div:after { height: 90px;position: absolute; left: 50px; top: 96px;} .pathColumnBlock .col-sm-5ths:nth-child(3) div {top: 1px;} .pathColumnBlock .col-sm-5ths:nth-child(3) a span:after {top: 103px; } .pathColumnBlock .col-sm-5ths:nth-child(4) a div:after {height: 73px;} .pathColumnBlock .col-sm-5ths:nth-child(4) div {top: 44px;} .pathColumnBlock .col-sm-5ths:nth-child(4) a span:after {top: -182px; } .pathColumnBlock .col-sm-5ths:nth-child(5) a div:after {height: 59px;} .pathColumnBlock .col-sm-5ths:nth-child(5) div {top: 55px;} .pathColumnBlock .col-sm-5ths:nth-child(5) a span:after { top:50px;} .pathColumnBlock .col-sm-5ths div.darkblue span:after, .pathColumnBlock .col-sm-5ths div.darkblue:after { background-color:#00274b;} .pathColumnBlock .col-sm-5ths div.lightblue span:after, .pathColumnBlock .col-sm-5ths div.lightblue:after { background-color:#cde6eb} .pathColumnBlock .col-sm-5ths div.employer span:after, .pathColumnBlock .col-sm-5ths div.employer:after { background-color:#078299;} .pathColumnBlock .col-sm-5ths div.customer span:after, .pathColumnBlock .col-sm-5ths div.customer:after { background-color:#078299;} .pathColumnBlock .col-sm-5ths div.ilmarinen span:after, .pathColumnBlock .col-sm-5ths div.ilmarinen:after { background-color:#facc25;} .pathColumnBlock .col-sm-5ths div.entrepreneur span:after, .pathColumnBlock .col-sm-5ths div.entrepreneur:after { background-color:#f7d8dc;} .pathColumnBlock .col-sm-5ths div.newsroom span:after, .pathColumnBlock .col-sm-5ths div.newsroom:after { background-color:#d83b51;} .pathColumnBlock .row.text-center {position:relative;} .pathColumnBlock .row.text-center:before {content:""; width:19px; height:19px; border-radius: 20px; background-color:#cccccc; position:absolute; top: 214px; left:0;} .pathColumnBlock .row.text-center:after {content:""; width:19px; height:19px; border-radius: 20px; background-color:#cccccc; position:absolute; top: 214px; right:-12px;} /*tyky fiveColumnBlock*/ .fiveColumnBlock {background-color: #fff; } .fiveColumnBlock .col-sm-5ths p:first-child {min-height:63px;} .row .col-sm-5ths { border-left: 2px solid #CFCFCF; margin-top: 20px; } .row .col-sm-5ths p{ font-weight: bold;font-family: Arial; } .row .col-sm-5ths:first-child { border-left:0; } .numberWrapper { font-size: 28px; padding: 9px 0; font-family: Arial; vertical-align: middle; line-height: 28px; font-weight: bold; position: relative; margin-bottom: 25px; height: 36px; margin-bottom: 25px; background-image: url(/Static/css/assets/kassa.png); background-size: 100%; background-position: 10px 0px; background-repeat: no-repeat; } .fiveColumnSlogan {padding-top:25px; } .fiveColumnSlogan p{padding-top:25px;font-weight: bold;font-family: Arial;text-align: center;} .fiveColumnHeading { background-color: #00274b;padding-top: 12px;padding-bottom: 12px;} .fiveColumnHeading *{ margin: 0;color: #FFF;} /*tyky twocolumnblock*/ .white .twoColumnBlock p {font-size:22px; line-height:36px;} .white .tykyIngress .twoColumnBlock p, .white .tab-content .twoColumnBlock p {font-size:18px; line-height:24px;} .white .tab-content .twoColumnBlock p.eventMonth {font-size:11px;} .white .tab-content .twoColumnBlock p.eventDay {font-size:36px;} .white .tab-content .twoColumnBlock p.eventTime, .white .tab-content .twoColumnBlock p.eventLocation {font-size: 15px; line-height: 18px;} /*tyky spynavBlock*/ .spynavBlock {margin-top: 100px;} .spynavBlock .span6 {} /* video embed in tabs*/ .video-container {position: relative;padding-bottom: 56.25%;padding-top: 30px; height: 0; overflow: hidden; margin:0 auto;} .video-container iframe,.video-container object,.video-container embed {position: absolute;top: 0;left: 0;width: 100%;height: 100%;} .tab-content .video-wrapper {max-width:700px; margin:0 auto;} /*tabbed navigation*/ .row.tykyTabs .headerRow.colpadding {padding-top:0;} .tab-content>.tab-pane {display: none} .tab-content>.active {display: block} .tykyTabs ul.nav {text-align:center;} .tykyTabs .nav li { display:inline-block;} .tykyTabs .nav li a{ display:inline-block; min-width: 130px; padding: 20px 10px 10px 10px; color:#078299; text-transform: uppercase; font-size:14px; font-family:"HelveticaNeueW01-75Bold", Arial;} .tykyTabs .nav li a span {color:#00274b; font-size:65px; display:block; margin-bottom:6px;} .tykyTabs .nav li a:hover{ text-decoration:none; } .tykyTabs .nav li.active {border-bottom: 4px solid #d83b51;} .tykyTabs .tab-content { padding: 30px 0 0 0; /*max-width:880px;*/ margin: 0 auto; } .tykyTabs .tab-pane {} .tab-pane.employer, .tab-pane.customer, .tab-pane.ilmarinen, .tab-pane.entrepreneur, .tab-pane.newsroom, .tab-pane.darkblue, .tab-pane.lightblue {padding:30px 30px 20px 30px;} .row.tykyTabs .tab-pane .colpadding { margin: 0 auto;} .tab-content .customerEventBlock {max-width: 780px; } .tab-content .colpadding .customerEventBlock {padding:0;} .white .bloghighlight {height:auto; overflow:visible;} .white .bloghighlight > .colpadding:first-child {display:none;} /*asiointi*/ .form-control {-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;} .preHeader #vakuutuslista {z-index:2;} /*mainImage*/ .mainImage {margin-right:auto; margin-left:auto; position: relative; min-height: 500px; } .mainImage.noShow {visibility: hidden; height: 90px; min-height: 90px; overflow: hidden; } .mainImage.frontpage.noShow {height: 190px; min-height: 190px;} picture {display:block; margin:0 auto; max-height:480px; overflow:hidden;} .frontpage picture {max-height:680px;} .mainImage .row {width: 1260px; position:absolute; left:0; right:0; height:100%; margin:0 auto; } .mainImage img {width:100%; } .topContentArea {position: absolute; top: 13%; left:35px; max-width:750px; color:#fff; font-size:24px;} .topContentArea a {color:#facc25; font-family: "HelveticaNeueW01-75Bold", Arial; } .topContentArea .textCustomer a,.topContentArea a.textCustomer {color:#078299;} .topContentArea .textEntrepreneur a, .topContentArea a.textEntrepreneur {color:#f7d8dc;} .topContentArea .textEmployer a, .topContentArea a.textEmployer{color:#078299;} .topContentArea .textIlmarinen a, .topContentArea a.textIlmarinen {color:#facc25;} .topContentArea .textNewsroom a, .topContentArea a.textNewsroom {color:#d83b51;} .topContentArea .textDarkblue a, .topContentArea a.textDarkblue {color:#00274b;} .topContentArea .textCustomer {color:#078299 !important;} .topContentArea .textEntrepreneur {color:#f7d8dc !important;} .topContentArea .textEmployer{color:#078299 !important;} .topContentArea .textIlmarinen{color:#facc25 !important;} .topContentArea .textNewsroom{color:#d83b51 !important;} .topContentArea .textDarkblue{color:#00274b !important;} .topContentArea .textWhite{color:#fff !important;} .topContentArea a.btn {color:#00274b; margin-bottom:10px; padding: 16px} .topContentArea a.btn span {padding-right:10px; font-size: 18px;} header.newsroom + .mainImage .topContentArea a.btn { color:#fff; background-color:#078299; transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; border:0;} header.newsroom + .mainImage .topContentArea a.btn:hover { color:#fff; background-color:#00274b; transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear;} .topContentArea a.btn:hover {color:#fff;} .frontpage .topContentArea {left:30px; top: 50px;} .topContentArea h1 {margin-top:0; color:#fff; text-align:left;} .loginButton.btn {padding-left:20px; padding-right:33px; padding-top: 8px; font-size:18px; line-height:18px;} .loginButton .iconKey {padding-right:15px; font-size:25px; position:relative; top:4px; } .topContentArea h1 p {margin:0;} .newCustomerButton.btn {position: absolute; top:15px; right:20px; background-color: #f7d8dc; color:#fff; width: 300px; padding-left:10px; padding-right:10px;} .videoContentArea {width:337px; position: absolute; right:20px; bottom:80px; color:#fff; text-transform:uppercase; line-height:28px; font-size:24px; font-family: "HelveticaNeueW01-75Bold", Arial;} .frontpage .videoContentArea {bottom: 180px;} .videoContentArea a {color:#fff; text-shadow: 1px 1px 16px rgba(0, 0, 0, 0.8);} .videoContentArea a:hover {text-decoration:none; } .videoContentArea span {color:#f7d8dc;} .videoContentArea p {margin-bottom:0;} .videoContentArea .iconPlay {font-size: 82px; text-shadow:none; color:#fff; float:left; padding: 0 20px 35px 0; transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear;} .videoContentArea a:hover .iconPlay {color:#f7d8dc; transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; } .videoContainer { max-height: 100%;} .videoContainer .flowplayer{ max-height: 418px;width: 743px; margin: 0 auto; display: block;max-width: 100%;} .short-hero .videoContainer .flowplayer{ max-height: 300px;width: 719px; } .videoContainer .videoContainerOverlay{ width: 100%;height: 100%;width: 100%;position: absolute;left: 0;top: 0; background-color: rgba(0, 40, 77, 0.7); } .videoContainerOverlay{ width: 100%;height: 100%;width: 100%;position: absolute;top: 0; background-color: rgba(0, 40, 77, 0.7); z-index: 1001;} .videoContainerOverlay #closeButton { position: absolute; right: 0; top: 0; background-color: #00274b; z-index: 2001; padding: 5px 9px; color: #fff; } /*top Highlight content area*/ #contentWrapper .row.topHighlightContentArea {background-color:transparent;} /*newCustomer block*/ .topHighlightContentArea {} .newCustomerBlock { margin-top:-82px; padding:20px 30px 20px 20px; float:right; background: -moz-linear-gradient(left, rgba(0,0,0,0) 0%, rgba(0,0,0,0.65) 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(0,0,0,0)), color-stop(100%,rgba(0,0,0,0.65))); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(left, rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(left, rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(left, rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 100%); /* IE10+ */ background: linear-gradient(to right, rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#a6000000',GradientType=1 ); /* IE6-9 */ } .newCustomerBlock h4 {color:#fff; display:inline-block; margin:0; margin-right:20px; position:relative; top:4px; } .newCustomerBlock .btn {background-color:#f7d8dc; color:#fff; padding-top: 12px; padding-bottom:12px;} .newCustomerBlock .btn:hover {background-color:#078299;} /*linklistblock*/ .row.linkListBlock [class*="span"] {padding: 0; margin:0; width: 33.3%; color:#fff; position:relative;} .row.linkListBlock [class*="span"]:first-child { width: 33.4%;} .row.linkListBlock > div {float:left;} .row.linkListBlock [class*="span"] > div {padding:32px 40px 30px 40px; height:100%; -webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;} .row.linkListBlock a {color:#fff;} .row.linkListBlock a h3 {margin-top:0; margin-bottom:0px; color:#fff; text-decoration:none; } .row.linkListBlock h3 {width:90%; font-size:28px;} .row.linkListBlock a:hover {text-decoration:none;} .row.linkListBlock p {font-family: Arial; width:90%; font-size:17px;} .linkListBlock .employer {background-color:#078299; } .linkListBlock .customer {background-color:#078299; } .linkListBlock .ilmarinen{background-color:#facc25; } .linkListBlock .entrepreneur {background-color:#f7d8dc; } .linkListBlock .newsroom {background-color:#d83b51; } .links ul {margin-bottom:0;} .links li a {text-transform:uppercase; font-family: "HelveticaNeueW01-75Bold", Arial; padding: 6px 15px; background-color: rgba(0, 0, 0, 0.1); display:block; margin-bottom: 4px; font-size:15px; border-radius: 4px; transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; } .links li a:hover {background-color: rgba(0, 0, 0, 0.3);transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; } .linkListBlock .iconArrowRight {font-size:45px; color:#fff; position:absolute; top: 40px; right:30px; transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; } .linkListBlock a:hover .iconArrowRight {color:#00274b; transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; } /*main content area on section pages */ .mainContentArea {border-bottom: 9px solid #00274b; background-color:#fff;} /*process step block*/ .processStepBlock .span12, .processStepBlock .span11{background-color:transparent;} .processStepBlock .ingress {font-family: "HelveticaNeueW01-45Ligh",Arial,verdana;} .row .processStepBlock .span11 {min-height:0;} .processStepBlock h3 {margin-top:0;} .processItemWrapper {clear:both; overflow:hidden; border-bottom: 3px solid #00274b;} .processItemNumber [class*="icon"] { color: #fff; font-size: 100px; text-align: center; display:block; padding-top: 20px; } .processItemNumber {height: 140px; width:9%; float:left;} .processItem {width: 100%; } .processItemNumber + .processItem {width:91%; float:left;} .processItem .btn, .processItem .btndarkblue, .processItem .btnlightblue {width:100%; -webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;} .processItem .btndarkblue {width:auto;} .processItem {float:left; background-color:#fff; margin-bottom:20px; font-family: Arial;} .subpageContentArea .processItem {margin-bottom:10px;} .processItem a {} .processItem h4 {margin-top:0; text-transform:none;} .processItem p {margin-bottom:10px !important;} .row .processItem [class*="span"] {padding:30px 35px 15px 35px; } #contentWrapper .processItemNumber.employer {background-color:#fff; } #contentWrapper .processItemNumber.customer {background-color:#fff; } #contentWrapper .processItemNumber.ilmarinen{background-color:#fff; } #contentWrapper .processItemNumber.entrepreneur {background-color:#fff; } #contentWrapper .processItemNumber.newsroom {background-color:#fff; } #contentWrapper .processItemNumber.darkblue {background-color:#fff; } .processItemNumber.employer [class*="icon"]{color:#078299; } .processItemNumber.customer [class*="icon"]{color:#078299; } .processItemNumber.ilmarinen [class*="icon"]{color:#facc25; } .processItemNumber.entrepreneur [class*="icon"]{color:#f7d8dc; } .processItemNumber.newsroom [class*="icon"]{color:#d83b51; } .processItemNumber.darkblue [class*="icon"]{color:#00274b; } /*process three step block*/ .processThreeStepBlock {background-color:#fff;} .processThreeStepBlock h2 {margin-bottom: 30px; margin-top:0;} .processThreeStepBlock [class*="span"]{ text-align:center;} .processThreeStepBlock .span12 {text-align:left;} .processThreeStepBlock img { display:block; margin:0 auto; } .processThreeStepBlock .span4 {padding: 10px 40px 0; position:relative; font-family: arial;} .processThreeStepBlock h4 {text-transform:none;} .processThreeStepBlock a {color:#00274b; text-decoration:none; } .processThreeStepBlock .iconArrowRight {font-size:60px; color:#ddd; position:absolute; top: 20px; right:-10px;} /*frontpage bottom block / middle content area blocks on entrepreneur sectionmainpages */ .row.frontpageBottomArea .span6:nth-child(2), .row.frontpageBottomArea .span6:nth-child(3), .row.frontpageBottomArea .span6:nth-child(6), .row.frontpageBottomArea .span6:nth-child(2) .highlightBlock, .row.frontpageBottomArea .span6:nth-child(3) .highlightBlock, .row.frontpageBottomArea .span6:nth-child(6) .highlightBlock, .row.middleContentArea .span6:nth-child(2), .row.middleContentArea .span6:nth-child(3), .row.middleContentArea .span6:nth-child(6) {background-color:#f2f2f2;} /*highlight block*/ .highlightBlock {background-color:#fff; display:table; float:left; width: 100%; } .frontpageBottomArea .highlightBlock {float:none;} .highlightBlock h5, .highlightBlock h2{ margin-top:0;} .highlightBlock h2 a:after, .highlightBlock h3 a:after, .highlightHighlightWithLinkBlock Block a h2:after, .highlightBlock a h3:after {content: "\00a0\203A"; } .highlightBlock h3{ margin-top:5px; margin-bottom: 25px;} .highlightBlock div.imagealignright, .highlightBlock div.imagealignleft {margin:0; vertical-align:top; display:table-cell; width:420px; } .highlightBlock img.imagealignleft, .highlightBlock img.imagealignright {margin-bottom:30px;} .highlightBlock .imagealignright {text-align:right;} /*.highlightBlock.customer a, .highlightBlock.employer a {color:#00274b;}*/ .highlightText { display:table-cell; vertical-align:top; padding-bottom:0; -webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box; } .highlightBlock .highlightText { width: 840px; } .frontpageBottomArea .highlightBlock {display:block;position: relative;} .frontpageBottomArea .highlightBlock .arrowlinkDarkblue{position: absolute;bottom: 15px; right: 15px;} .NewEntrepreneurSectionPage .highlightBlock {display:block;position: relative;} .NewEntrepreneurSectionPage .highlightBlock .arrowlinkDarkblue{position: absolute;bottom: 15px; right: 15px;} .highlightText a { font-family:'HelveticaNeueW01-75Bold', arial;} .frontpageBottomArea .highlightText, .frontpageBottomArea .highlightBlock .highlightText {width: 100%; display:block;float:none; padding-bottom:18px;} /*three column block*/ .threeColumnBlock {float:left; -webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box; background-color:#fff; } .threeColumnBlock a.btn, .threeColumnBlock a.btndarkblue, .threeColumnBlock a.btnlightblue{ border: 2px solid #fff; margin-bottom: 20px; width:90%; display:block; -webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box; padding: 16px;} .threeColumnBlock h3, .threeColumnBlock h2 {margin-top:0;} .threeColumnBlock p {margin-bottom:0;} .threeColumnBlock .span4 {font-family: 'HelveticaNeueW01-75Bold', Arial; padding-top:20px; padding-right:20px; } .threeColumnBlock li a {font-size:24px; line-height: 30px;} .threeColumnBlock li a:after {content: "\00a0\203A";} .threeColumnBlock .span4 {background-color:transparent;} .threeColumnBlock .span4:first-child {padding-left:0px;} .threeColumnBlock .span4:last-child {padding-right:0px;} /*two column block*/ .mainBody .twoColumnBlock .colpadding {padding-top:0; padding-bottom:20px;} .twoColumnBlock h2, .twoColumnBlock h3, .twoColumnBlock h4, .twoColumnBlock h1{ margin-top:0;} .twoColumnBlock .headerRow h2, .twoColumnBlock .headerRow h3, .twoColumnBlock .headerRow h4 { margin:0;} .twoColumnBlock .headerRow h1 {margin-bottom:30px;} .twoColumnBlock h2 {margin-top:0;} .twoColumnBlock .headerRow.colpadding {padding-bottom:0; background-color:#fff;} .twoColumnBlock .row {display:table; width:100%;} .twoColumnBlock .row .span6 {display:table-cell; height:100%; vertical-align:top; float:none; width: 50%;} /*news highlight block*/ .newsHighlightBlock h3{margin-top:5px;} /*news highlight Double block*/ .newsHighlightBlock {padding:20px 35px 30px; border-top: 6px solid #fff; font-family: Arial;} .newsHighlightBlock h3{margin-top:5px; } .newsHighlightBlock h3 a {color:#078299;} .newsHighlightBlock h3 a:hover {text-decoration:underline;} .newsHighlightBlock h5{display:inline-block;} .newsHighlightBlock .btn.newsroom { float:right; color:#fff; padding:3px 10px; background-color:#078299; font-size:13px; border-radius:4px;} .newsHighlightBlock .btn.newsroom:hover {background-color:#078299;} .newsHighlightBlock .btn.newsroom .iconSound {padding-right:10px;} .frontpageBottomArea .newsHighlightBlock h5 {margin-top:0;} /*news highlight block*/ .latestNewsBlock {font-family: arial;} .latestNewsBlock .liftUp h5{display:inline-block; color:#fff; text-transform: uppercase;} .latestNewsBlock h3 {margin-top:5px;} .latestNewsBlock .liftUp {position:relative;} .latestNewsBlock .liftUpItem {width:100%; padding:10px 10px 20px 40px; position:absolute; bottom:0; left:0; background: rgba(0, 39, 75, 0.65);color: rgba(0, 39, 75, 0.65); -webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box; color:#fff; } .latestNewsBlock .liftUpItem a {color:#fff;} .subpageContentArea .latestNewsBlock h4 {text-transform: uppercase;} .latestNewsBlock h4 a, .latestNewsBlock h5 a {color:#00274b; } .latestNewsBlock .span4 {padding:16px 30px 0px 40px; position:relative;} .latestNewsBlock h4 a:after {content:"\00a0\203A"; } .latestNewsBlock h5 {text-transform:none;margin-bottom:0; } .latestNewsItem {padding-top: 2px; clear:both;} a.rss {background-color:#d83b51; color:#fff; font-size:15px; font-family:'HelveticaNeueW01-75Bold', arial; padding:6px 10px; border-radius:6px; position:absolute; top:30px; right:30px;} .newsCategory {color:#999999; display:inline-block; font-size:15px; text-transform: uppercase; font-family:'HelveticaNeueW01-75Bold', arial; } a.rss:hover {text-decoration:none; background-color:#00274b} .newsDate {color:#999999; display:inline-block; font-size:15px; } .moreNews {margin-top:20px; margin-bottom:0;} .moreNews a{font-family:'HelveticaNeueW01-75Bold', arial; color:#078299;} .moreNews a:after {content:"\00a0\203A"; } .separator {color:#999;} /*news Article*/ .newsArticle {background-color:#fff;} .newsArticle .sidebar h4 {margin-top:0;} .newsArticle .latestNewsItem {padding-bottom: 5px;} .newsArticle .newsDate, .newsArticle .newsCategory, .newsArticle .separator {color:#666;} .newsArticle .sidebar .newsDate, .newsArticle .sidebar .newsCategory, .newsArticle .sidebar .separator {color:#00274b; font-family: arial;} .newsArticle .contactCardBlock.colpadding {padding:0; margin-bottom:20px;} .newsArticleImage {margin:10px 0 20px;} .relatedLinks {float:left; max-width: 33%;} .subpageContentArea .mainBody .relatedLinks ul{list-style:none; margin:0; padding:0;} .subpageContentArea .mainBody .relatedLinks li{list-style:none; margin:0 50px 5px 0; padding:0; font-size:16px; line-height: 20px;} .keywordTitle {margin-top:0px;} .keywords {color: #666; font-size: 16px; line-height: 20px; margin-top: 0px; float:left; max-width: 33%;} .keywords span {display:inline-block; margin-bottom: 3px;} .newsArticle .ingress, .BasicContentPage .ingress { position: relative;} .ingressIcon {position: absolute;top: 0; left:0; height: 62px; width: 50px; margin-top: 5px; } .ingressIcon [class*="icon"] { font-size:42px; padding-top:0px;} .ingressIcon + p { padding-left: 55px;} .ingress .epi-editContainer { padding-left: 55px;} #contentWrapper .ingressIcon.employer {background-color:#fff; } #contentWrapper .ingressIcon.customer {background-color:#fff; } #contentWrapper .ingressIcon.ilmarinen{background-color:#fff; } #contentWrapper .ingressIcon.entrepreneur {background-color:#fff; } #contentWrapper .ingressIcon.newsroom {background-color:#fff; } #contentWrapper .ingressIcon.white {background-color:#fff; } #contentWrapper .ingressIcon.darkblue {background-color:#fff; } .ingressIcon.employer [class*="icon"]{color:#078299; } .ingressIcon.customer [class*="icon"]{color:#078299; } .ingressIcon.ilmarinen [class*="icon"]{color:#facc25; } .ingressIcon.entrepreneur [class*="icon"]{color:#f7d8dc; } .ingressIcon.newsroom [class*="icon"]{color:#d83b51; } .ingressIcon.darkblue [class*="icon"]{color:#00274b; } .ingressIcon.white [class*="icon"]{color:#fff; } /*news archive*/ .newsArchive {background-color:#fff;} .newsArchive .newsArchive-results{ position: relative;} .newsArchive .latestNewsItem {padding-bottom: 10px;clear: none; border-right: 2px solid #fff;} .newsArchive .latestNewsItem h5{ margin-top: 0;margin-bottom: 15px;} .newsArchive .latestNewsItem h5 a{ margin-bottom:0; text-transform:uppercase; font-size: 24px; line-height: 28px; font-weight: 500; margin: 15px 0 10px; color: #00274b; } .newsArchive .latestNewsBlock h4 a:after { content: ""; } .newsArchive .newsDate, .newsArchive .newsCategory, .newsArchive .separator {color:#666; text-transform:none; font-family: arial;} .newsArchive .span8 {position:relative; /*padding-right: 50px*/;} .newsArchive .rss {top:50px; right:40px;} .newsArchive .newsItemImageContainer { height: 315px; position: relative; overflow: hidden;} .newsArchive .newsItemImage { top: 0; position: absolute; width: 100%; height: 315px; background-size: cover; background-position: center; z-index: 999; } .newsArchive .newsItemTextContainer{ padding: 15px 20px;} .newsArchive .newsItemTextContainer .newsItemReadMore{ font-weight: bold; font-size: 14px; float: right; margin-top: 12px; color: #00274b; } .subpageContentArea .filters h5 {text-transform: uppercase;} .subpageContentArea .facetlist {margin:0 0 20px; } .subpageContentArea .facetlist li {display:block; margin:0 0 5px 0; padding: 0; font-size: 13px; color: #00274b;} .subpageContentArea .subject-filter .facetlist li {display:inline-block;} .facetlist li a{color: #00274b; border: none; padding: 0px 4px; display:inline-block; margin-right:6px; font-family: arial; } .facetlist li a:hover, .facetlist li.active a { text-decoration: underline;} .subpageContentArea .filters .span4{ border-left: 3px solid #00274b; padding-left: 25px;padding-right: 25px;} .subpageContentArea .filters .subject-filter.span4{ border-left: none; padding-left: 0px;} .subpageContentArea .filters .subject-filter.span4 .facetlist li:after{ content: "|"; color: #00274b;} .subpageContentArea .filters .subject-filter.span4 .facetlist li:last-child:after{ content: ""; color: #00274b; } /*real estates block*/ .realEstatesBlock.colpadding {padding-right:25px;} .realEstatesBlock.colpadding + .realEstatesBlock.colpadding {border-top:10px solid #fff; padding-top:20px;} .realEstatesBlock h3{margin-top:0; } .realEstatesBlock a {color:#00274b;} .realEstatesAddress {text-transform: uppercase; font-size:13px; line-height: 15px; font-family:'HelveticaNeueW01-75Bold', arial; margin-bottom:0; min-height:30px; overflow:hidden;} .realEstatesDesc { font-style:italic; line-height:20px; margin-top:3px;} #contentWrapper .realEstatesBlock .row {background:transparent;} #contentWrapper .realEstatesBlock .row .span4 {padding:0 0 0 10px; width:33.3%; background-color:transparent;} #contentWrapper .realEstatesBlock .row .span4:first-child {margin-left:-10px; } .realEstatesAddressImgWrapper {position:relative;} .realEstatesAddressImgWrapper p {position:absolute; bottom:2px; left:8px; color:#fff; font-size:13px; text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.7); margin-bottom:0;} .realEstatesBlock .row + a {color:#078299; font-family:'HelveticaNeueW01-75Bold', arial; } .realEstatesBlock .row + a:after { content: "\00a0\203A"; } /*customer events block*/ .customerEventBlock {font-family: arial; background-color:#fff;} #contentWrapper .row.event {padding-bottom:10px; background-color:transparent;} .event + .btn {padding-top: 10px; padding-bottom:10px; margin-top:15px; background-color:#078299; color:#fff;} .customerEventBlock h3{margin-top:0;} .customerEventBlock .eventDayBox { display: table-cell; vertical-align:top; text-align:center; width: 74px;} .customerEventBlock .eventContent {display: table-cell; vertical-align:top; padding-left:20px; } .customerEventBlock .eventDay { background-color:#078299; margin:0; padding: 11px 0 5px 0;color:#fff; font-size: 36px; font-family:'HelveticaNeueW01-75Bold', arial; } .customerEventBlock .eventMonth { background-color:#078299; padding: 2px 0 5px 0; margin: 0px; text-transform: uppercase; color:#fff; font-family:'HelveticaNeueW01-75Bold', arial; font-size:11px; } .customerEventBlock .row .span10 { padding-left: 20px;} .customerEventBlock .eventTime { font-size: 15px; line-height:18px; color: #999; margin-bottom:0;} .customerEventBlock .evenTitle { color:#00274b;} .customerEventBlock .evenTitle h5 { margin-bottom:0; margin-top:0;color:#00274b; line-height:20px;} .customerEventBlock .eventLocation {font-size: 15px; line-height:18px; margin-bottom:0; } /*page help link block*/ .showMoreLinks {display:none;text-transform:uppercase; font-size:15px; font-family:"HelveticaNeueW01-75Bold", Arial; float:right; margin-top:5px;} .pageHelpLinkBlock.showmore .showMoreLinks {display:inline-block; margin-bottom:5px;} .pageHelpLinkBlock .showMoreLinks:after { content: ""; } .pageHelpLinkBlock .showMoreLinks:before { content: "\67"; padding-right:10px; position:relative; top:1px; } .pageHelpLinkBlock .showMoreLinks:hover{text-decoration:none;} .pageHelpLinkBlock.showmore .span4 .row div:nth-child(n+5) {display:none;} .pageHelpLinkBlock .arrowDown {display:none;} #contentWrapper .pageHelpLinkBlock .row {background-color:transparent;} .pageHelpLinkBlock [class*="span"]{ background-color: transparent; } .pageHelpLinkBlock .mainContentArea {border-bottom:0;} .pageHelpLinkBlock h3 {margin-top:0;} .pageHelpLinkBlock h3 p {margin:0;} .pageHelpLinkBlock a:after{ content: "\00a0\203A"; } .pageHelpLinkBlock .span4 {} .pageHelpLinkBlock h4 {padding-top: 5px;} .pageLink {background-color:#fff; padding:22px 20px 8px 20px; display:block; margin: 0; color:#078299; font-family:"HelveticaNeueW01-75Bold", Arial; height: 35px; vertical-align:middle; line-height:18px; transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear;} .pageLink [class*="icon"] {padding-right:20px; font-size:38px;float:left; position:relative; top:-7px; } .pageLink:hover {text-decoration:none; background-color:#078299; color:#fff; transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear;} .pageLink:hover [class*="icon"] {color:#fff;} .pageLink.white { background-color: #FFF !important; color: #00274b !important;} .pageLink.customer {background-color:#078299 !important; color: #00274b !important;} .pageLink.entrepreneur a{background-color:#f7d8dc !important; color: #00274b !important;} .pageLink.employer {background-color:#078299 !important; color: #00274b !important;} .pageLink.ilmarinen {background-color:#facc25 !important; color: #00274b !important;} .pageLink.newsroom {background-color:#d83b51 !important; color: #00274b !important;} .pageLink.darkblue {background-color:#00274b !important; color: #fff !important;} .pageLink.lightblue {background-color:#cde6eb !important; color: #00274b !important;} .pageLink.lightblue {background-color:#cde6eb !important; color: #00274b !important;} .pageLink.white:hover, .pageLink.customer:hover, .pageLink.entrepreneur:hover, .pageLink.employer:hover, .pageLink.ilmarinen:hover, .pageLink.newsroom:hover, .pageLink.darkblue:hover, .pageHelpLinkBlock .pageLink:hover { background-color: #078299 !important; color: #fff !important;} .pageLink [class*="icon"] { background-color: transparent !important;} /* subpage text elements */ .row.subpageContentArea { width: 100%;} .row .mainBody {padding: 40px 30px 30px 35px; float:left; margin-left:0; width:66.6%; float:left; background:#fff; -webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;} .row .mainBody h1 {margin-top:0;} .row .mainBody.nopadding {padding:0; width: 100%; } .row .sidebar {padding: 0 0 30px 0; width:33.4%; float:right; -webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;background-color: #FFF; } /* mainContent in mainBody*/ .mainBody .mainContent { margin: 0 -30px -30px -35px; } .subpageContentArea h1 {text-align:left;} .subpageContentArea h2, .subpageContentArea h3, .subpageContentArea h4, .subpageContentArea h5 { text-align: left; } .subpageContentArea ul,.subpageContentArea ol, .accordion ul, .accordion ol, .sectionContentPage ul, .sectionContentPage ol, .sectionBlock ul, .sectionBlock ol, .threeColumnBlock ul, .threeColumnBlock ol, .twoColumnBlock ul, .twoColumnBlock ol, .processStepBlock ul, .processStepBlock ol, .twoRowBlock ul, .twoRowBlock ol, .tab-content ul, .tab-content ol {margin-left: 0; margin-bottom:12px;} .subpageContentArea li, .highlightBlock li, .accordion li, .sectionContentPage li, .sectionBlock li, .threeColumnBlock li, .twoColumnBlock li, .processStepBlock li, .twoRowBlock li, .tab-content li {list-style:outside; line-height: 24px;margin-bottom: 5px;margin-left: 30px;padding-left: 8px; font-size:18px;} .subpageContentArea .mainutshell-section-1nBody ul ul, .highlightBlock ul ul, .accordion ul ul, .sectionContentPage ul ul, .sectionBlock ul ul, .threeColumnBlock ul ul, .twoColumnBlock ul ul, .processStepBlock ul ul, .twoRowBlock ul ul, .tab-content ul ul {margin-top:6px;} .subpageContentArea .mainBody ul li li, .highlightBlock ul li li, .accordion ul li li, .sectionContentPage ul li li, .sectionBlock ul li li, .threeColumnBlock ul li li, .twoColumnBlock ul li li, .processStepBlock ul li li, .twoRowBlock ul li li, .tab-content ul li li {list-style-type:circle;} .subpageContentArea .mainBody ol li, .highlightBlock ol li, .accordion ol li, .sectionContentPage ol li, .sectionBlock ol li, .threeColumnBlock ol li, .twoColumnBlock ol li, .processStepBlock ol li, .twoRowBlock ol li, .tab-content ol li {list-style-type:decimal;} @media screen and (max-width:1279px) { .subpageContentArea li, .highlightBlock li, .accordion li, .sectionContentPage li, .sectionBlock li, .threeColumnBlock li, .twoColumnBlock li, .processStepBlock li, .twoRowBlock li, .tab-content li {line-height: 20px;font-size:15px;} } .maintenance .subpageContentArea li {margin-bottom:5px; line-height: 18px; font-size:16px;} .maintenance .subpageContentArea ul {margin: 20px 0 40px 0;} .subpageContentArea p {margin-bottom:24px; margin-top:0;} .ingress, .subpageContentArea .ingress {font-size:24px; line-height:28px; font-family:'HelveticaNeueW01-75Bold', arial; } .ingressArea p {margin-bottom: 10px; } .ingressArea a {} /*practical block*/ .practicalBlock h3 {margin-top:0;} #contentWrapper div .row.practicalContent { background-color:#fff;} .practicalBlock.colpadding {/*padding-bottom:0px;*/ } .practicalContent .mainContentArea {border-bottom:0;} .practicalContent .leftContentArea {font-family: arial; font-size:18px; padding-bottom:10px;} .leftContentArea .highlightText {padding:0;} .practicalContent .leftContentArea ul {margin-top:0; margin-bottom:0;} .practicalContent .leftContentArea li {margin-top: 12px; font-family:"HelveticaNeueW01-75Bold", Arial; } .practicalContent .leftContentArea .iconDoc {margin-right:10px; font-size:24px; float:left;} .practicalContent .leftContentArea h4, .practicalContent .leftContentArea h3 {margin-top:0; text-transform:none; } .practicalBoxes [class*="span"] {display:table; color:#fff; height:130px; -webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box; } .practicalBoxes [class*="span"] div.ilmarinen, .practicalBoxes [class*="span"] div.customer {color:#00274b;} .practicalBoxes [class*="span"] div {height:100%; vertical-align:middle;padding: 10px 20px 10px 35px; font-size:24px; text-transform: uppercase; display:table-cell; color:#fff;font-family:"HelveticaNeueW01-75Bold", Arial; -webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;} /* sectionNav */ #contentWrapper .sectionNav {background-color: #fff; overflow-x:hidden; border-bottom:9px solid #fff;padding-top: 30px; } .sectionNav ul {width:100%; } .sectionNav .arrowDown {display:none;} .sectionNav li {width:33.3%;float:left; display:table; } .sectionNav li:first-child {width:33.4%;} .sectionNav li a {display:table-cell; vertical-align:middle; background-color:#02284a; color:#fff; height:80px; padding: 0px 10px 0px 35px; line-height: 26px; font-size:24px; font-family:"HelveticaNeueW01-75Bold", Arial; text-transform:uppercase; transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; border-left: none;} .sectionNav li.selected a { background-color:#3e8da8; color:#fff;border-left: none;} .sectionNav li.selected + li a{border-left:2px solid transparent;} .sectionNav li:first-child a, .sectionNav li.selected:first-child a {border-left:0;} .sectionNav li:last-child {position:relative;} .sectionNav li.selected:last-child a { border-left: 2px solid #fff;} .sectionNav li a:hover { text-decoration:none; background-color: #3e8da8; transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; } /* section dropdown */ .sectionDropdown {background-color:#fff;} .sectionDropdown h3 {margin:0 30px 0 0; display:inline-block;} .sectionDropdown h3 p{margin:0;} .sectionSelection { display: inline-block; text-transform: uppercase; font-size: 15px; font-family: "HelveticaNeueW01-75Bold", Arial; width:322px; padding:0; } .sectionSelection.open .dropdown-toggle {border-bottom:0; border-bottom-left-radius: 0px; border-bottom-right-radius:0px;} .sectionSelection.open .arrowDown:before {content: "\68"; } .sectionSelection .arrowDown {margin-left:10px; padding: 5px 10px 5px 30px; float:right; top: -2px; position:relative;} .sectionSelection .dropdown-toggle {display: block; border: 1px solid #078299; border-radius: 4px; padding:10px;} .sectionSelection .dropdown-menu { margin:0; width:320px;border-top:0; border-bottom-left-radius: 4px; border-bottom-right-radius:4px; border-color:#078299;} .sectionSelection .dropdown-menu li a { font-size:14px; white-space: normal; line-height:18px; padding: 8px 10px; color: #00274b; font-family: "HelveticaNeueW01-45Ligh", Arial; } .sectionDropdown .dropdown-menu li a:hover {background-color:#078299; color:#fff;} .sectionSelection .dropdown-menu li.active a {background-color:#078299; color:#fff;} /* employer shortcut links */ #contentWrapper .shortcutLinks {/*background-color:#078299;*/ } .shortcutLinks ul {width:100%;} .shortcutLinks .iconArrowRight {padding-left:20px; font-size:20px;} .shortcutLinks .arrowDown {display:none;} .shortcutLinks li {width:33.3%;float:left; display:table; } .shortcutLinks li:first-child {width:33.4%;} .shortcutLinks li a {border-left:2px solid #2e7996;display:table-cell; vertical-align:middle; background-color:#078299; color:#fff; height:80px; padding: 0px 10px 0px 35px; line-height: 26px; font-size:24px; font-family:"HelveticaNeueW01-75Bold", Arial; text-transform:uppercase; transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear;} .shortcutLinks li:first-child a{ border-left:0;} .shortcutLinks li.selected a { background-color:#fff; color:#00274b;} .shortcutLinks li a:hover { text-decoration:none; color:#00274b; transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; } .shortcutLinks li.customer a, .shortcutLinks li.lightblue a, .shortcutLinks li.employer a, .shortcutLinks li.ilmarinen a, .shortcutLinks li.entrepreneur a, .shortcutLinks li.newsroom a, .shortcutLinks li.darkblue a, .shortcutLinks li.grey a,.shortcutLinks li.customer, .shortcutLinks li.lightblue , .shortcutLinks li.employer, .shortcutLinks li.ilmarinen, .shortcutLinks li.entrepreneur, .shortcutLinks li.newsroom, .shortcutLinks li.darkblue a, .shortcutLinks li.grey {border:0; } /*page title*/ .pagetitle {background-color:#fff;} .pagetitle h2 {margin:0;} /*tabs navigation*/ .tabNavWrapper { background-color: #fff; } .tabNavigation {margin-top:0;} .tabNavigation ul {padding-left:20px; margin:0;} .tabNavigation li {display:inline-block; margin-right: 4px; width: 30%; text-align:center;background-color:#078299; border: 2px solid #078299; border-bottom:0; padding: 13px 3px;} .tabNavigation li a{vertical-align:middle; display:inline-block; text-align:center;color:#fff; line-height: 26px; font-size:24px; font-family:"HelveticaNeueW01-75Bold", Arial; text-transform:uppercase; transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear;} .tabNavigation li:hover a {text-decoration:none; color:#00274b;} .tabNavigation li.selected {background-color:#eee; border: 2px solid #ddd; border-bottom:0; } .tabNavigation li.selected a { color:#00274b;} /*year calendar block*/ .yearCalendarBlock {background-color:#fff;} .yearCalendarBlock h3 {margin-top:0; } .yearCalSingleBlock[class*="span"] {position:relative; padding: 0 35px; text-align:center; font-family: arial; overflow:hidden;} .yearCalSingleBlock[class*="span"]:first-child .lineGraphic .dottedLine{ position: relative; display: block; border-top: 4px dotted #00274b; height: 0; width: 65px; background-color: #fff; margin-left: -4px; border-right: 1px solid #00274b; } .yearCalendarBlock .yearCalSingleBlock[class*="span"]:last-child .lineGraphic .dottedLine, .yearCalSingleBlock[class*="col-md-3"]:last-child .lineGraphic .dottedLine { position: absolute; top:0; right:0; display: block; border-top: 4px dotted #00274b; height: 0; width: 60px; background-color: #fff; margin-left: 0px; border-left:1px solid #00274b; border-right:0;} .yearCalSingleBlock[class*="span"].lineGraphic .dottedLine {display:none;} .lineGraphic {height: 4px; width: 100%; position:absolute; top: 83px; z-index:0; left:0; background-color: #00274b;} .titleContainer {position:relative;height: 51px; overflow:hidden; padding-top:0px;} .yearCalSingleBlock h5 { font-family: arial; position:absolute; bottom:0; left:0; right:0;} #timeCarousel .yearCalSingleBlock h5 {position:static;} .yearCalSingleBlock [class*="icon"] {color:#fff; font-size:30px;} .yearCalBoxWrapper {padding:10px 15px;z-index:1; position:relative; } .editable .yearCalBoxWrapper {background: rgba(131, 209, 223, 0.3); border-radius: 10px;} .yearCalIcon {margin: 0 auto 10px; display: table; height: 50px; } .yearCalSingleBlock .box {border-radius: 6px; width: 50px; height:50px; display: table-cell; vertical-align: middle;} .yearCalContent {font-size:15px; line-height:17px;} .yearCalContent a {font-family:"HelveticaNeueW01-75Bold", Arial; font-weight:normal; } .yearCalSingleBlock p{margin-bottom:5px;} .yearAnnouncementText {font-size:15px; color:#999; text-transform: uppercase; min-height: 24px; } /* youtube block */ .youtubeBlock.employer, .youtubeBlock.lightblue, .youtubeBlock.employer, .youtubeBlock.entrepreneur, .youtubeBlock.newsroom, .youtubeBlock.darkblue, .youtubeBlock.employer, .youtubeBlock.lightblue a, .youtubeBlock.employer a, .youtubeBlock.entrepreneur a, .youtubeBlock.newsroom a, .youtubeBlock.darkblue a {color:#fff;} .youtubeBlock .row .span2 {padding:0 10px 10px; width:16.6%; font-size:15px; line-height:17px; overflow:hidden; background-color:transparent;} .youtubeBlock h3 {margin-top:0;} .youtubeBlock .row .span2 p {margin-top:8px; margin-bottom:0; font-size:13px; line-height:16px; font-family:"HelveticaNeueW01-75Bold", Arial;} .youtubeBlock .row .span2:first-child {margin-left:-10px;} .youtubeImageLink {position:relative; display:block; max-width:100%;} .youtubeImageLink.iconPlay:before { position: absolute; width: 100%; font-size: 52px; text-align: center; line-height: 52px; top: 50%; height: 52px; margin-top: -26px; color: #FFF; } .youtubeBlock .youtubeContent .youtubeVideoRow{ margin-bottom: 25px; } .youtubeBlock .youtubeContent p { margin: 0; } .youtubeImageLink .duration {position:absolute; bottom:3px; right:3px; background:rgba(0,0,0,0.5); color:#fff; font-size:11px; padding:0px 5px; line-height:14px; font-family:"HelveticaNeueW01-75Bold", Arial;} #contentWrapper .span6 .youtubeBlock.employer, #contentWrapper .span6 .youtubeBlock.employer .row {background-color: #00274b; } .span6 .youtubeBlock .row .span2 {padding:10px; width:33.3%; font-size:15px; line-height:17px; overflow:hidden;} .span6 .youtubeBlock .row .span2:nth-child(4) {clear:left; margin-left:-10px;} /* social blocks*/ .row.social {position:relative;border-left: 3px solid #00274b; padding: 0 10px; box-sizing: border-box;} .row.social.twitterBlock {border-left: none;} .social .colpadding {padding-top:10px; padding-bottom:10px; } .socialHeader {position:relative;} .social .colpadding:first-child {padding-right:5px;} .social a.btn {position:absolute; z-index:1;background-color:#078299; color:#fff; margin: 20px auto 0; display:block; width: 90%; max-width: 300px; padding-right:10px; padding-left:10px; left:50px; bottom: 20px; } .social a.facelift-button {text-transform: uppercase;text-align: center; z-index:1; margin: 20px auto 0; display:block; width: 90%; max-width: 300px; padding-right:10px; padding-left:10px; /*position:absolute; left:50px; bottom: 20px; */ } .social a.btn:hover {background-color:#00274b; color:#fff;} .social h4 {position:relative; font-size:23px;} .socialContent.colpadding {padding-top:20px; padding-bottom: 30px; overflow:hidden;} .socialContent iframe {width: 100% !important;} .social [class*="icon"] {position:absolute; top:-10px; right:10px; font-size:40px; color:#00274b;} /* css replacement for equalHeight(): */ .newsArchive.subpageContentArea .row,.newsArchive-results .row,.InsuranceInANutshellBlock,.PensionCalculator2017Page .calculatorContent, .row.linkListBlock,.row.frontpageBottomArea,.fiveColumnRow,.InsuranceInANutshellBlock, .row.mainContentArea,.row.middleContentArea,.row.bottomContentArea {display:flex;flex-wrap:wrap;} @supports (display:flex) { /* Safari wrapping fix */ .newsArchive.subpageContentArea .row:before, .newsArchive.subpageContentArea .row:after,.newsArchive-results .row:before, .newsArchive-results .row:after, .PensionCalculator2017Page .calculatorContent:before,.PensionCalculator2017Page .calculatorContent:after, .row.linkListBlock:before,.row.linkListBlock:after,.row.frontpageBottomArea:before,.row.frontpageBottomArea:after, .fiveColumnRow:before,.fiveColumnRow:after,.row.mainContentArea:before,.row.mainContentArea:after, .row.middleContentArea:before,.row.middleContentArea:after,.row.bottomContentArea:before,.row.bottomContentArea:after, .InsuranceInANutshellBlock.clearfix:before,.InsuranceInANutshellBlock.clearfix:after, .row.frontpageBottomArea>[class*="span"]:before,.row.frontpageBottomArea>[class*="span"]:after, .fiveColumnRow>.col-sm-5ths:before,.fiveColumnRow>.col-sm-5ths:after, .row.mainContentArea>[class*="span"]:before,.row.mainContentArea>[class*="span"]:after, .row.middleContentArea>[class*="span"]:before,.row.middleContentArea>[class*="span"]:after, .row.bottomContentArea>[class*="span"]:before,.row.bottomContentArea>[class*="span"]:after{content:none;display:none;} } .row.frontpageBottomArea>[class*="span"],.fiveColumnRow>.col-sm-5ths, .row.mainContentArea>[class*="span"],.row.middleContentArea>[class*="span"],.row.bottomContentArea>[class*="span"] {display: flex;flex-wrap: wrap;} .row.frontpageBottomArea>[class*="span"]>*,.fiveColumnRow>.col-sm-5ths>*, .row.mainContentArea>[class*="span"]>*,.row.middleContentArea>[class*="span"]>*,.row.bottomContentArea>[class*="span"]>*{flex-basis:100%;} .row.frontpageBottomArea>[class*="span"]>.span6,.row.mainContentArea>[class*="span"]>.span6,.row.middleContentArea>[class*="span"]>.span6,.row.bottomContentArea>[class*="span"]>.span6{flex-basis:50%;} .row.frontpageBottomArea>[class*="span"]>.span4,.row.mainContentArea>[class*="span"]>.span4,.row.middleContentArea>[class*="span"]>.span4,.row.bottomContentArea>[class*="span"]>.span4{flex-basis:33.3%;} .row.social {display:flex;flex-direction:column;} .row.social .colpadding:first-child {flex:0 0 auto;} .row.social .colpadding.socialContent {flex: 10 0 auto;display:flex;flex-direction:column;} .row.social .colpadding.socialContent .facelift-button {flex: 0 0 auto;} /* twitter block */ .twitterBlock h4 a{color:#00274b;} .twitterBlock .twitter-timeline,.facebookBlock .fb_iframe_widget{flex: 10 1 auto;} /* facebook block*/ .facebookBlock h4 a{color:#00274b;} .bloghighlight .colpadding.socialContent .facelift-button {margin-top: auto;} /* bloghighlight block*/ .bloghighlight h4 a{color:#00274b; } .bloghighlight .socialContent h4 {color:#078299;} .bloghighlight .blogImageWrapper {position:relative;padding-top: 10px;margin-bottom:20px;} .blogDate {color:#999; font-size:15px; margin-bottom:5px;} .blogContent {color:#333333; margin-bottom:5px; font-family: arial;} .blogContinue {font-family:"HelveticaNeueW01-75Bold", Arial;} .blogAuthor { color:#00274b; font-size:15px; line-height: 17px; font-family:"HelveticaNeueW01-75Bold", Arial; margin-bottom:0; text-transform:uppercase; margin-top: 10px;} .blogPersonImage { margin-left:-35px; width:45%; float:left; overflow:hidden; margin-right:20px; } .blogPersonImage img {width:100%;} .blogPersonTitle {color:#00274b; font-size:15px; line-height: 17px; position:relative; } .blogTags {font-size:13px; color:#999; margin-top:25px; margin-bottom:25px; line-height:15px; } .blogImageWrapper.multiplePost {margin-bottom:20px; float:left; width:100%; max-width: 500px;} .blogImageWrapper.multiplePost .blogPersonImage { margin-left:0px; width:100px; float:left; overflow:hidden; margin-right:20px; } .span12 .bloghighlight .socialContent h4 {margin-top: 60px;} .span12 .bloghighlight .socialContent h4:first-child {margin-top:0;} .span12 .socialContent {max-width: 780px;} .social .blogImageWrapper.multiplePost + a.btn { position:static; margin: 20px 0; display:block; clear:both; float:none; } /* slideshare block*/ .span6 .slideshare, .span6 .youtubeBlock {height: 515px;} .slideshare h3 {margin-top:0;} .slideshare a { font-family:"HelveticaNeueW01-75Bold", Arial; color:#00274b;} .slideshareWidget {float:left; } .slideshareWidget iframe {width: 360px !important; max-height:307px;} .slideshareWidget iframe + div {float:right;width: 160px; margin-left:10px;} /* contact card block*/ .contactCardBlock img {float:left; margin-right: 20px; max-width: 150px;} .contactCardBlock h5 {margin-top:0;} .contactCardBlock {font-size:16px; line-height: 20px;} .contactCardBlock ul {margin-top: 40px; } .subpageContentArea .mainBody .contactCardBlock li {list-style:none;} /* newsroom highlight block*/ .newsroomHighlightsBlock { } .newsroomHighlightsBlock h4 {margin:0; display: table; height: 120px; } .newsroomHighlightsBlock a { color:#00274b; display: table-cell; height: 120px; vertical-align:middle;} .newsroomHighlightsBlock .employer a, .newsroomHighlightsBlock .newsroom a, .newsroomHighlightsBlock .entrepreneur a, .newsroomHighlightsBlock .darkblue a {color:#fff;} .newsroomHighlightsBlock a:after { content: "\00a0\203A";} .newsroomHighlightsBlock [class*="span"]{overflow:hidden; padding: 0 30px; position:relative; } .newsroomHighlightsBlock .span3 {width: 25%;} .newsroomHighlightsBlock img {max-height: 80px; position:absolute; top:20px; right:20px; } /* ilmarinen section block*/ .sectionBlock .span8 + .span4{width:33.4%; } .sectionBlock .span8 {min-width:840px;} .sectionBlock h2, .sectionBlock h3, .sectionBlock h4 {margin-top:0;} .sectionBlock [class*="span"] {display:table-cell; float:none; vertical-align:top; -webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box} /* ilmarinen section highlight block*/ .sectionHighlightBlock {position:relative;} .sectionHighlightBlock div.textContent {position:absolute; top: 15px; left:30px;} .sectionHighlightBlock img {width: 100%;} .sectionHighlightBlock a {text-transform: uppercase; color:#00274b; font-family:'HelveticaNeueW01-75Bold', arial;} .sectionHighlightBlock a:after {content: "\00a0\203A";} /* two Row block and one row block*/ .twoRowBlock {height:100%;} .twoRowBlock table{ width:100%; border-collapse:collapse; } .twoRowBlock h3, .twoRowBlock h4, .twoRowBlock h2, .twoRowBlock h5 {margin:0 0 5px 0;} .twoRowBlock td {vertical-align:top;} .twoRowBlock {font-family: arial;} .twoRowBlock td:first-child {width:100px;} .twoRowBlock a { font-family:'HelveticaNeueW01-75Bold', arial;} .twoRowBlock a:after {content: "\00a0\203A";} .twoRowBlock [class*="icon"], .oneRowBlock [class*="icon"] { font-size:80px; margin-right:10px; display:block; } .oneRowBlock.employer [class*="icon"], .oneRowBlock.newsroom [class*="icon"], .oneRowBlock.entrepreneur [class*="icon"], .oneRowBlock.darkblue [class*="icon"] {color:#fff;} /* subpage sidebar */ .sidebar .attachmentArea {background-color:#f2f2f2; padding:25px 30px; } .attachmentArea { font-family: Arial, verdana; } .attachmentArea .iconDoc {padding-right:20px; font-size:30px; line-height:24px; display:inline-block; margin-bottom:10px; float:left; position:relative; } .attachmentArea a { display:inline-block; padding:20px 20px 10px 20px; background-color:#fff; border: 2px solid #dddddd; border-radius:7px;} .sidebar .attachmentArea a {display:block; padding-bottom:20px; margin-bottom:15px;} .rightSideNavigation h4 {margin-top:30px; margin-left:35px; text-transform:uppercase; } .rightSideNavigation > a {color:#00274b;} .row .relatedContent {padding: 20px 30px;} .row .relatedContent.nopadding {padding:0;} /*subnav*/ ul.submenu {margin-left:0; margin-top:20px;} ul.submenu li {border-top: 2px solid #fff; margin:0 20px; padding:0; list-style:none;} ul.submenu li a{font-family: 'HelveticaNeueW01-75Bold', Arial, verdana; color:#00274b; padding:15px; display:block; line-height:20px; } ul.submenu li.active {margin-left:0px; margin-bottom:-2px;} ul.submenu li.active a {background-color:#fff; padding-left:35px;} /*--------------- forms----------------------*/ .formField {margin: 20px 0; clear:both;} .controls {margin-left:190px;} .requestContact {background-color: #078299; -webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;} .requestContact .formField + .formField .parsley-errors-list {min-height: 30px;} .requestContact .formField:last-child {margin-bottom:0;} .requestContact h2 {color:#fff; margin-top:0;} .sendFeedback h2 {margin-top:0; height:100%;} .sendFeedback {background-color:#fff;} .feedbackWrapper {max-width: 570px;} div.feedback-consent { padding-top: 20px; } .whitePaper {background-color:#fff;} .whitePaperWrapper {max-width: 570px;} @media screen and (min-width:960px) { .whitePaperWrapper label { text-align: left; width: 100px; } .whitePaperWrapper .controls { margin-left: 100px; } } .field-validation-error, .parsley-required, .parsley-phoneoremail, .parsley-type, .parsley-reservation, .parsley-hetu, .parsley-errors-list li {font-size:16px; line-height:20px;color: #d83b51 !important; font-family: arial; list-style:none !important; margin-left:0 !important; padding-left:0 !important;} input[type="text"] {outline:none; } input[type="text"]::-ms-clear { display: none;} /* submit buttons */ .formPage input[type="submit"] {outline:none; display:inline-block; padding:13px 18px; min-width: 165px; font-family: 'HelveticaNeueW01-75Bold', Arial; margin-left:0px; line-height:18px;vertical-align:middle;cursor:pointer;color:#fff;background-color:#078299;text-transform:uppercase; font-size:15px; border:0; border-radius: 3px; -webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;} .formPage input[type="submit"]:hover {background-color:#00274b; color:#fff; text-decoration:none; } .formPage input[type="submit"]:active {background-color:#00274b; color:#fff; text-decoration:none; border-color:#00274b; } .formPage input[type="submit"].disabled,.formPage input[type="submit"][disabled] {color:#333333;background-color:#e6e6e6;cursor:pointer;opacity:0.5;} /* labels */ label {font-size:18px; line-height: 20px; display:inline-block; font-family: 'HelveticaNeueW01-75Bold', Arial, verdana; width: 170px; text-align:right; float:left;} label .small {font-size:14px; display:block; clear:both;line-height:16px; font-family: arial; } .custom-select-menu label {float:none; border: 1px solid blue; padding: 5px 20px; font-size:16px;} /* textarea and input */ textarea, .formPage input[type="text"] { font-size: 15px; width: 100%; border-radius:3px; background-color:#fff9e6; border: 0; -webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box; border: 1px solid #dddddd; -moz-box-shadow:inset 0px 1px 0px #b7b7b7; -webkit-box-shadow: inset 0px 1px 0px #b7b7b7; box-shadow: inset 0px 1px 0px #b7b7b7; font-family: arial;} .formPage .row [class*="span"] input[type="text"]:first-child {margin-top:0;} .formPage input[type="text"] {padding:10px 30px 10px 10px; margin-top: 0px; } .formPage input[type="text"]:focus, .formPage textarea:focus {/*background-color:#00274b; color:#fff; border-color:#00274b;*/} textarea {padding:15px; height:184px; } textarea:focus {/*border-color:#00274b; background-color:#fff;*/} /*custom select, radiobutton, checkbox */ .selectWrapper {margin-top:20px; position:relative;} .custom-form-select {border-radius: 15px; border: 1px solid #EBEBF0; outline:none; width:100%;font-weight: 400; background: url("../img/sprite_forms.png") no-repeat scroll right -97px transparent; height: 31px;overflow: hidden;padding: 0px 26px 0px 10px;position: absolute;font-size: 12px; line-height: 31px; -webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;} .custom-form-select + select {width: 100% !important; border:0; background-color:#F5F5FA; font-size:12px;} .custom-form-select.custom-form-focused {background-position: right -135px; background-color:#00274b; color:#fff; border-color:#00274b;} .custom-form-checkbox {float:left;display:block;width:33px;height:34px;margin-right:10px;background:url('../img/sprite_forms.png') no-repeat scroll -51px -9px transparent;} .custom-form-checked + input + label {color:#00274b;} .custom-form-checkbox.custom-form-focused {background-position:-10px -9px;} .custom-form-checkbox.custom-form-checked {background-position:-51px -49px;} .custom-form-checkbox.custom-form-checked.custom-form-focused {background-position:-10px -49px;} .custom-form-radio {float:left;display:block;width:33px;height:34px;margin-right:10px;background:url('../img/sprite_forms.png') no-repeat scroll -132px -9px transparent;} .custom-form-radio.custom-form-focused {background-position:-91px -9px;} .custom-form-radio.custom-form-checked {background-position:-132px -49px;} .custom-form-radio.custom-form-checked.custom-form-focused {background-position:-91px -49px;} @media screen and (-webkit-min-device-pixel-ratio:0) { select.cform {-webkit-appearance: menulist-button;} } /* fix select height bug on webkit browsers for Mac OS */ /* placeholder texts */ .formPage input[type="text"]::-webkit-input-placeholder, .formPage textarea::-webkit-input-placeholder { color: #141928; opacity:1; } .formPage input[type="text"]:-moz-placeholder,.formPage textarea:-moz-placeholder { color: #141928; opacity:1;} .formPage input[type="text"]::-moz-placeholder, .formPage textarea::-moz-placeholder { color: #141928; opacity:1;} .formPage input[type="text"]:-ms-input-placeholder,.formPage textarea:-ms-input-placeholder { color: #141928; opacity:1; } .formPage input[type="text"]:focus::-webkit-input-placeholder { color: #fff; opacity:1; } .formPage input[type="text"]:focus:-moz-placeholder { color: #fff; opacity:1;} .formPage input[type="text"]:focus::-moz-placeholder { color: #fff; opacity:1;} .formPage input[type="text"]:focus:-ms-input-placeholder { color: #fff; opacity:1; } .formPage textarea:focus::-webkit-input-placeholder { color: #00274b; opacity:1; } .formPage textarea:focus:-moz-placeholder { color: #00274b; opacity:1;} .formPage textarea:focus::-moz-placeholder { color: #00274b; opacity:1;} .formPage textarea:focus:-ms-input-placeholder { color: #00274b; opacity:1; } /* search results */ .searchResults h1 {text-align:left; margin:0; } .searchResults .row.colpadding {background-color:#fff;} #contentWrapper .row.searchResultsHeader {background-color:#f2f2f2;} #contentWrapper .row.searchResultsHeader [class*="span"] {background: transparent;} .row.searchResultsHeader .span2:first-child {width:16.5%} .search-result-item {display:table;} .search-result-item h5 {margin-top:0; margin-bottom:2px;} .search-result-item .searchResultsIcon + .searchResultsContent {padding-left:10px; display:table-cell; vertical-align:top; } .search-result-item h5 em{font-style:normal;} .search-result-item p { font-size: 16px; line-height: 20px; margin-bottom:5px; } .search-result-item p em { font-family: 'HelveticaNeueW01-75Bold', Arial, verdana; font-style:normal; } .foundResults {font-family: 'HelveticaNeueW01-75Bold', Arial, verdana; } .row [class*="span"].search-result-item {position:relative; border-bottom: 1px solid #f2f2f2; padding: 10px 0; } .searchResults input[type="submit"] { padding:10px 5%; float:none; width: 15%; margin-left:3%; min-width:50px;} .searchResults input[type="text"] {background-color:#124667; width: 72%; border:0;color:#fff; } .searchResultsIcon {height: 35px; width:35px; display:table-cell; vertical-align:top; text-align:center;} .searchResultsIcon .bgcolor {background-color:#f2f2f2; padding: 7px 5px 4px; border-radius: 4px;} .search-result-item [class*="icon"] {color: #666; font-size: 30px; } /* autocomplete - overrides jquery ui styles*/ .ui-autocomplete {background-color:#fff; border:1px solid #ddd; border-top:0; border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; } .ui-autocomplete.ui-menu .ui-menu-item {font-size:16px;} .ui-autocomplete.ui-menu .ui-menu-item:hover {background-color:#ddd;} /* pension calculators*/ .calculator .accordion-heading a {padding: 0 80px 0 25px;} .calculator.employer .accordion-heading a {color:#fff;background-color: #00274b;padding: 20px;} .calculator.accordion {position:relative;padding-right: 0;padding-left: 0;background-color: #FFF;padding-top: 0;padding-bottom: 0;} #contentWrapper .calculator.employer { background-color: #FFF;margin-bottom: 0;border-bottom: none;} #contentWrapper div.employer .calculator.accordion {background-color: #FFF} .calculator.employer .accordion-heading a.collapsed .arrowDown {background-color:#00274b; padding: 22px 30px; float:right; position:absolute; top:0; right:0;} .calculator h3{ margin-top:0;} .calculator h3.accordion-title {margin:0;} .calculator {color:#fff;} .row.calculatorContent {width: 100%; padding-top: 41px;} .calculatorContent .span6 {background-color:transparent;} .row.calculatorContent {width: 100%;padding-top: 0px;} .calcTitle {font-family: 'HelveticaNeueW01-75Bold', Arial, verdana; padding:0 0 10px 5px; min-height: 24px; line-height:20px;} .calculatorContent .span6 .calculatorForm { padding: 20px; min-height: 40px;background-color: #dbf1f5; } .calculatorContent .span6 + .span6 .calculatorForm {background-color:#fff; background-image:none; text-align:center; } .calculatorContent .span6 .calculatorForm #entrepreneur4years1 { margin-top: -3px; } .calculatorContent .span6 .calculatorForm #entrepreneur4years0 { margin-top: -3px; } .calculatorContent .span6 .calculatorForm > label { margin-right: 10px; } .calculator input[type="text"] {background-color:#fff; border-radius: 0px; border:0; font-size: 18px; outline: none; padding:5px; width: 150px; font-family: Arial; } .calculatorForm.calculatorFormInputContainer .calcTitle2{ font-family: 'HelveticaNeueW01-75Bold', Arial;text-transform: uppercase;font-weight: bold;margin-bottom: 10px;} .calculatorForm.calculatorFormResultContainer .calcTitle2{ font-family: 'HelveticaNeueW01-75Bold', Arial;text-transform: none;font-weight: bold;} .result-row div[class^="result-"] { text-align: right;} .estimate-notice p{ text-align: right;} .calculator button {font-family: 'HelveticaNeueW01-75Bold', Arial; float: right; margin-left:35px; margin-top: 15px; line-height:18px;vertical-align:middle;cursor:pointer;color:#fff;background-color:#00274b;text-transform:uppercase; font-size:15px; border:0; border-radius: 0px; padding: 9px 20px; -webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box; transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear;} .calculator a.btn { background-color:#00274b; color: #fff; margin-top: 15px; padding: 9px 20px; border-radius: 0px; } .calculator button:hover, .calculator a.btn:hover {background-color: #00274b; color:#fff; transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear;} .currency {color:#00274b; font-size: 15px; padding-left:20px; font-family: 'HelveticaNeueW01-75Bold', Arial;} .result-employee, .result-entrepreneur, .result-ilmarinen {color:#00274b; font-family: 'HelveticaNeueW01-75Bold', Arial; font-weight:bold; font-size:23px; line-height:35px; padding-top:0; display:inline-block;} .result-entrepreneur {padding-top: 85px;} .result-employee + .currency {padding-left:5px;} .calcTitle2 {color:#00274b;font-family: 'HelveticaNeueW01-75Bold', Arial, verdana; margin-top: 25px; line-height:20px; text-align:left; } .calculatorForm .calcTitle2:first-child { margin-top:0;} .calculator.entrepren .calculatorForm {height: auto; min-height: 315px; vertical-align:middle;} .calculator label {color:#00274b; font-family: 'HelveticaNeueW01-75Bold', Arial, verdana; float:none; width:auto;} .calculator select {font-size: 15px; margin-top:3px; padding: 5px 8px;} .calculator .result-row div:first-child { line-height: 35px; } .calculator .result-row.indent div {line-height:normal;height:27px;} .calculator .result-row.indent div:first-child {padding-left:25px; font-size:17px; line-height:16px;} .calculator .result-row.indent-last {margin-bottom:7px;} .calculator .result-row .note {color:#f7d8dc;} .calculator .row p {color:#0f0f0f !important;margin:0;} .calculator .result-row .span6:first-child { width: 55%;} .calculator .result-row .span6:last-child { width: 45%;} /*calculator validation*/ .bootbox-body {color:#00274b; padding: 30px 30px 15px 30px; font-family: 'HelveticaNeueW01-75Bold', Arial, verdana;} .bootbox-close-button{display:none;} .bootbox .modal-dialog {padding-top: 15%;} .bootbox .modal-body {width: 400px; background: #fff; text-align: center; } .bootbox .modal-footer { width: 380px; background: #fff; padding-top:0; } .bootbox .btn { padding: 10px 40px;background-color: #078299; color:#fff;} /* big pension calculator */ .bigCalculator h1, .bigCalcDescription, .bigCalcInstruction {color:#fff; margin-top:0;} .bigCalcDescription {font-size: 1.2em;} .bigCalcInstruction {padding-bottom:10px;} .calculatorContent .span6 .span6 {background:#fff; height:35px;} .bigCalculator .result-entrepreneur {padding-top:0;} .bigCalculator .result-ilmarinen {padding-top:0; color:#facc25;} .bigCalculator .calculatorContent .span6 + .span6 .calculatorForm {text-align:left; height:100%; -webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;} .bigCalculator a {font-size:0.8em;} .bigCalcInstruction a {color:#fff; text-decoration:underline; font-size:1em; } .bigCalcDescription a {color:#fff; text-decoration:underline; font-size:1em; } .bigCalcInstruction a[class*="btn"], .bigCalcDescription a[class*="btn"] {text-decoration:none; color:#fff; text-decoration:underline; font-size:1em; } .bigCalcInstruction a.arrowlink, .bigCalcDescription a.arrowlink {text-decoration:none;} .bigCalcInstruction a.textCustomer, .bigCalcDescription a.textCustomer {text-decoration:none;color:#078299;} .bigCalcInstruction a.textEntrepreneur, .bigCalcDescription a.textEntrepreneur {text-decoration:none;color:#f7d8dc;} .bigCalcInstruction a.textEmployer, .bigCalcDescription a.textEmployer {text-decoration:none;color:#078299;} .bigCalcInstruction a.textIlmarinen, .bigCalcDescription a.textIlmarinen {text-decoration:none;color:#facc25;} .bigCalcInstruction a.textNewsroom, .bigCalcDescription a.textNewsroom {text-decoration:none;color:#d83b51;} .bigCalcInstruction a.textDarkblue, .bigCalcDescription a.textDarkblue {text-decoration:none;color:#00274b;} .bigCalculator .calculator button {margin-left:60px; padding: 9px 40px;} .height50 .span6{padding-bottom: 80px;} .noTopPadding h1:first-child, .noTopPadding h2:first-child, .noTopPadding h3:first-child, .noTopPadding h4:first-child {margin-top:0;} /* .equalHeight .span6 .span6 {height: auto !important;} */ .euroSign {color:#00274b;font-family: arial; } /* monthly calculator 09/2016 */ .EntrepreneurPensionCalculatorBlock .calculatorContent > .span6 { background-color: #dbf1f5; } .EmployerPensionCalculatorBlock .span6 .calcTitle, .EmployerMonthlyCalculatorBlock .span6 .calcTitle, .EntrepreneurMonthlyCalculatorBlock .span6 .calcTitle { background-color: #fff; color: #00274b; padding-top: 5px; } .EmployerPensionCalculatorBlock .span6:first-child .calcTitle, .EmployerMonthlyCalculatorBlock .span6:first-child .calcTitle, .EntrepreneurMonthlyCalculatorBlock .span6:first-child .calcTitle { background-color: #dbf1f5; } .employer.monthly .calculatorForm { height: 560px; } .employer.monthly input { text-align: right; } .employer.monthly select { background-color:#fff; border-radius: 0px; border:0; font-size: 24px; padding:4px 15px; width: 175px; font-family: Arial; } .employer.monthly .pre2017, .employer.monthly .post2017 { display: none; } .employer.monthly .radios { display: inline; } #contentWrapper .employer.monthly .result-row { background-color: #fff; } .employer.monthly .result-pct { text-align: right; padding-right: 2px; } .employer.monthly .result-avg, .employer.monthly .result-sum { text-align: right; padding-right: 12px; } .employer.monthly .monthCalcGrid { padding-right: 48px; margin: 0 0 0 -4px; } .employer.monthly .monthCalcGrid li { list-style-type: none; float: left; width: 33%; min-height: 42px; padding: 0; margin: 0; vertical-align: middle; } .employer.monthly .monthCalcGrid span { margin: 0; display: inline-block; width: 100%; font-family: 'HelveticaNeueW01-75Bold', Arial; vertical-align: middle; text-align: center; color: #fff; background-color: #078299; text-transform: uppercase; font-size: 15px; line-height: 23px; border: 0; border-radius: 3px; padding: 9px 4px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; transition: all 0.2s linear; -webkit-transition: all 0.2s linear; box-shadow: inset 1px 1px 0px #d8e8ed; -webkit-box-shadow: inset 1px 1px 0px #d8e8ed; } .employer.monthly .monthCalcGrid button { float: left; margin: 0; font-size: 15px; line-height: 23px; padding: 9px 4px; width: 100%; white-space: nowrap; box-shadow: inset 1px 1px 0px #d8e8ed; -webkit-box-shadow: inset 1px 1px 0px #d8e8ed; } #contentWrapper .employer.monthly table { font-family: 'HelveticaNeueW01-75Bold', Arial, verdana; font-size: 18px; margin: 12px 0 32px 0; } #contentWrapper .employer.monthly td { box-sizing: border-box; } #contentWrapper .employer.monthly tr:nth-child(even) {background-color: #f2f2f2} #contentWrapper .employer.monthly tr:nth-child(odd) {background-color: #fff} #contentWrapper .employer.monthly tr :not(:first-child) { text-align: right; white-space: nowrap; border-left: none; } #contentWrapper .employer.monthly th { background-color: #d2d2d2; text-transform: none; font-size: 100%; font-weight: normal; color: #00274b; line-height: normal; } #contentWrapper .employer.monthly tr.sum:nth-child(even) {background-color: #d8e8ed} #contentWrapper .employer.monthly tr.sum:nth-child(odd) {background-color: #f4f8f9} #contentWrapper .employer.monthly tr.sum:last-child { } #contentWrapper .employer.monthly tr.sum td { border-right: none; border-left: none; } #contentWrapper .employer.monthly tr.sum:last-child td { padding-top: 6px; } #contentWrapper .employer.monthly tr.sum td:last-child { color: #f7d8dc; font-weight: bold; } .salary-calculator { border-bottom: none; background-color: #d2eef5; } .calculator.salary-calculator-container { border-bottom: none; } /* Salary calculator */ .salary-calculator * { box-sizing: border-box; } .salary-calculator > [class*="span"] { background-color: #d2eef5; color: #00274b; } .salary-calculator-container .salary-calculator-heading { color: #fff !important; background-color: #00274b; padding: 20px; } .salary-calculator .left-panel > *:first-child { margin-top: 0; } .salary-calculator .right-panel > *:first-child { margin-bottom: 40px; margin-top: 0;} .salary-calculator-container .salary-calculator-heading a{ color: #fff !important; padding-left: 0; } .salary-calculator-container .salary-calculator-heading .arrowDown { position: absolute; right: 0; } .salary-calculator.employer h3{ color: #00274b; } .salary-calculator .left-panel { padding: 45px 30px; } .salary-calculator .right-panel { padding: 45px 30px; border-left: 5px solid #fff; } .salary-calculator .input-row { display: block; } .salary-calculator .input-row .input-container{ display: block; width: 50%; float: left; padding-right: 75px; box-sizing: border-box; } .salary-calculator .input-row .radio-container{ padding-right: 0; } .salary-calculator .input-row .submit-container { width: 100%; float: none; text-align: right; padding: 0; padding-top: 20px; } .salary-calculator .input-row .submit-container .facelift-button { border: none; text-transform: uppercase; } .salary-calculator .input-row label, .salary-calculator .input-row label > input, .salary-calculator .input-row .radio-label { display: block; text-align: left; font-family: 'FranklinGothicDemiCondRegular','HelveticaNeueW01-75Bold', Arial; text-transform: uppercase; width: 100%; position: relative; line-height: 22px; } .salary-calculator .unit { color: #00274b; position: absolute; right: -18px; top: 41px; font-family: arial; text-transform: none; } .salary-calculator .unit.percentage { right: -20px; } .salary-calculator .input-row label > input { margin-top: 10px; margin-bottom: 20px; box-sizing: border-box; padding: 12px 10px; border: none; color: #00274b; } .salary-calculator-container .row p { color: #00274b !important; } .salary-calculator .radio-container .radio-control input{ display: none; } .salary-calculator .radio-container .radio-control label { text-align: center; background-color: transparent; border: 2px solid #078299; color: #078299; margin: 0; box-sizing: border-box; padding: 12px 10px; text-transform: none; line-height: 22px; } .salary-calculator .radio-container .radio-control { width: 49.5%; float: left; margin-top: 10px; } .salary-calculator .radio-container .radio-control:first-of-type { margin-right: 1%; } /* Selected input label */ .salary-calculator .radio-container .radio-control input[type="radio"]:checked + label { background-color: #078299; color: #FFF; } .salary-calculator .bottom-panel { display: none; background-color: #d2eef5; border-top: 5px solid #fff; padding: 45px 30px; text-align: center; } .salary-calculator .bottom-panel.active { display: block; } .salary-calculator .bottom-panel h3{ margin-bottom: 20px; line-height: 32px; } .salary-calculator .bottom-panel h3:last-child { margin-bottom: 0; } .salary-calculator .total-amount { display: block; font-size: 40px; color: #078299; } .salary-calculator .total-amount .euros { font-size: 20px; color: #00274b; font-family: 'HelveticaNeueW01-45Ligh',Arial,verdana; margin-left: 5px; } .salary-calculator-details { padding: 45px 30px; box-sizing: border-box; } .salary-calculator-details .left-panel { width: 50%; float: left; padding-right: 28px; border-right: 2px solid #00274b; box-sizing: border-box; } .salary-calculator-details .right-panel { width: 50%; float: left; padding-left: 30px; box-sizing: border-box; } .salary-calculator-details h3{ color: #00274b; margin-bottom: 40px; } .salary-calculator-details .detail-row { text-align: right; position: relative; padding-right: 27px; margin-bottom: 5px; } .salary-calculator-details .detail-row .detail-label { color: #00274b; float: left;} .salary-calculator-details .detail-row .detail-number { color: #078299; font-family: 'FranklinGothicDemiCondRegular','HelveticaNeueW01-75Bold', Arial; font-size: 28px; } .salary-calculator .bottom-panel #employerCostsTotal:after { content: "\20AC"; color: #00274b; font-family: 'HelveticaNeueW01-45Ligh',Arial,verdana; font-size: 24px; margin-left: 5px; vertical-align: text-bottom; position: relative; top: -2px; } .salary-calculator-details .details-subheading { margin-top: 0; font-size: 18px; } .salary-calculator-details .detail-row .detail-number:after { content: "\20AC"; color: #00274b; font-family: 'HelveticaNeueW01-45Ligh',Arial,verdana; font-size: 18px; margin-left: 5px; } .salary-calculator-details .detail-row .detail-tooltip { cursor: pointer; color: #ffffff; border-radius: 100px; height: 20px; display: inline-block; width: 20px; text-align: center; font-size: 15px; background-color: #078299; position: absolute; right: 0; top: 10px; font-weight: bold; } .salary-calculator-details .detail-row.detail-highlight { background-color: #d2eef5; padding: 20px 15px; margin-bottom: 40px; margin-top: 30px; display: block; } .salary-calculator-details .detail-row.detail-highlight:last-of-type { margin-bottom: 0;} .salary-calculator-details .detail-row.detail-highlight .detail-number { font-size: 36px; vertical-align: top; line-height: 32px; } .salary-calculator-details .tooltip-container { background-color: #00274b; padding: 15px; color: #fff; display: none; cursor: pointer; margin-bottom: 15px; position: relative; } .salary-calculator-details .tooltip-container.active { display: block; } .salary-calculator-details .tooltip-container:before { content: ""; width: 0; height: 0; border-left: 5px solid transparent; border-right: 5px solid transparent; border-bottom: 5px solid #00274b; position: absolute; left: 50%; top: -5px; } .salary-calculator-details .tooltip-container:after { content: "x"; position: absolute; width: 10px; height: 10px; top: 0; right: 5px; color: #FFF; font-weight: bold; } .salary-calculator-details .detail-row.detail-highlight .detail-label { font-family: 'FranklinGothicDemiCondRegular','HelveticaNeueW01-75Bold', Arial; text-transform: uppercase; line-height: 32px; } .salary-calculator-details .detail-row.detail-highlight .detail-number:after { vertical-align: bottom; line-height: 22px; } .salary-calculator-details { display: none; } .salary-calculator-infobox { background-color: #078299; } .salary-calculator-details.active { display: block; } .salary-calculator-details .details-heading h3 { border-bottom: 5px solid #00274b; padding-bottom: 10px; color: #00274b; } .salary-calculator-details .detail-panels { display: block; display: flex; } .salary-calculator-details .detail-panels > .left-panel, .salary-calculator-details .detail-panels > .right-panel { flex: 1 0 auto; } .salary-calculator-details .detail-panels > .right-panel { display: flex; flex-direction: column; } .salary-calculator-details .detail-panels > .right-panel .salary-calculator-infobox { flex: 1 0 auto; margin-top: 30px; padding: 30px; } /* meeting reservations */ /*.meetingReservationWrapper { max-width: 570px; }*/ .meeting-calendar { min-width: 300px; max-width: 640px; width: auto !important; border-collapse: separate; } .meeting-calendar .mc-toolbar { text-align: center;margin-bottom: 5px; } .meeting-calendar .mc-toolbar .mc-left { float: left; } .meeting-calendar .mc-toolbar .mc-right { float: right; } .meeting-calendar .mc-toolbar .mc-center { display: inline-block; } .meeting-calendar .mc-clear { clear: both; } .meeting-calendar .mc-view { position: relative;padding: 3px; } .meeting-calendar .mc-view #mc-overlay { width: 100%; height: 100%; background: grey; position: absolute; text-align: center; top: 0; left: 0; min-height: 100px;opacity: 0.5;z-index: 1;} .meeting-calendar .mc-view #mc-overlay span { padding: 5px;border-radius: 5px;background-color: #fff;top: 40%;position: relative; } .meeting-calendar .mc-view table { background-color:#facc25 !important; border-radius: 4px; width: 100%;table-layout: fixed;border-collapse: collapse;border-spacing: 0; /*font-size: 1em;*/ } .meeting-calendar .mc-view td { border-style: solid;border-width: 1px;padding: 0;vertical-align: top;border-color: #eee; } .meeting-calendar .mc-view table tbody {margin: 0;padding: 0; border-color: #eee; } .meeting-calendar .mc-time-grid-container { position: relative; } .meeting-calendar .mc-bg {position: absolute;top: 0;bottom: 0;left: 0;right: 0;z-index: 1; } .meeting-calendar .mc-bg table { height: 100%; } .meeting-calendar .mc-axis {background-color: #fff; width: 33px; text-align: right; vertical-align: middle;padding: 0 4px;white-space: nowrap; } .meeting-calendar .mc-slats { position: relative;z-index: 2;min-height: 100px; } .meeting-calendar .mc-slats td { height: 1.5em; min-height:22px; border-bottom: 0; } .meeting-calendar .mc-slats td.no-right-border { border-right-width: 0; } .meeting-calendar .mc-slats td.no-left-border { border-left-width: 0; } .meeting-calendar .mc-slats td.reserved { background: grey; } .meeting-calendar .mc-slats .mc-minor td { border-top-style: dashed; } .meeting-calendar .mc-slats tr:first-child td { border-color: #eee !important; } .meeting-calendar .mc-slats tr:last-child { border-bottom: 1px solid #eee; } .meeting-calendar .mc-slats td.free:hover { background-color: #facc25; } .meeting-calendar .mc-slats td.free.selected {color: white; background-color: #078299; text-align: center !important; } .meeting-calendar .mc-slats td.free.selected:hover {color: white; background-color: #078299 !important; } .meeting-calendar .mc-slats td.disabled { background-color: #ddd; border-style: solid; border-color: #ddd; border-right-color: #fff; } .meetingReservation .error-message {color:red} .meetingReservation textarea { height: 70px;} .meetingRes_timecell { /*position: relative;*/ } .meetingRes_timecell div { position: absolute; top: 0; left: 0; width: 100%; } .meetingRes_timecell .disabled { z-index: -1; } /*.meetingRes_timecell.free:hover { background-color: #facc25; }*/ .meetingRes_timecell.selected {color: white; background-color: #078299; text-align: center !important; } .meeting-calendar .btn { padding: 5px 18px; } .meeting-calendar .btn.disabled { background-color: whitesmoke; color: #fff; } .meeting-calendar .mc-left-icon, .meeting-calendar .mc-right-icon { letter-spacing: -1px; font-size: 0; } .meeting-calendar .mc-left-icon:before { content: "f"; font-size: 18px; text-align: center; width: 100%; padding-right: 2px; position: relative; top: 1px; letter-spacing: normal; } .meeting-calendar .mc-right-icon:after { content: "e"; font-size: 18px; text-align: center; width: 100%; padding-left: 2px; position: relative; top: 1px; letter-spacing: normal; } .meeting-calendar .free { background-color: #facc25; border-color: #fff !important; } .meeting-calendar .free:hover { background-color: #00274b !important; } .meetingReservation .meeting-calendar { padding-bottom: 12px; } .meetingReservation #second-step { padding-top: 12px; } .meetingReservation #second-step .formField:first-child { margin-top: 0; } @media only screen and (max-width:1095px) { label { font-size: 16px; line-height: 18px; display: block; width: 100%; text-align: left; float: none; margin-bottom: 5px; } .controls { margin-left: 0px; } } /*------------------- bootstrap modules --------------------- */ /* clickable dropdown menu */ .dropup,.dropdown{position:relative; list-style-type:none; margin:0;} .dropdown-toggle{*margin-bottom:-3px;padding: 2px; } .dropdown-toggle:hover { } .dropdown-toggle:focus {outline: 2px solid #078299;outline-offset: 2px;} .caret{display:inline-block;width:0;height:0;vertical-align:middle; border-top:4px solid;border-right:4px solid transparent;border-left:4px solid transparent;content:"";} .dropdown .caret{margin-top:11px;margin-left:3px;*margin-top:7px;*margin-left:0px;} .dropdown-menu{position:absolute;top:100%;left:0;z-index:1;display:none;float:left;padding:5px 0;margin:2px 0 0;list-style:none;background-color:#ffffff;border:1px solid #dbdbdb;-webkit-background-clip:padding-box;-moz-background-clip:padding;background-clip:padding-box;} .searchResults .dropdown-menu label { display:inline-block;} .dropdown-menu.pull-right{right:0;left:auto;} .dropdown-menu .divider{*width:100%;height:1px;margin:11px 1px;*margin:-5px 0 5px;overflow:hidden;background-color:#e5e5e5;border-bottom:1px solid #ffffff;} .dropdown-menu>li>a{display:block;padding:3px 10px;clear:both;font-weight:normal;line-height:24px;color:#333333;white-space:nowrap;} .dropdown-menu>li>a.checked{background-color:transparent;} .dropdown-menu>li>a:hover,.dropdown-submenu:hover>a{text-decoration:none;background-repeat: repeat-x; cursor:pointer; background-color:#dbdbdb; } .dropdown-menu>.active>a,.dropdown-menu>.active>a:hover{text-decoration:none;outline:0; } .dropdown-menu>.disabled>a,.dropdown-menu>.disabled>a:hover,.dropdown-menu>.disabled>a:focus{color:#999999;} .dropdown-menu>.disabled>a:hover,.dropdown-menu>.disabled>a:focus{text-decoration:none;background-color:transparent;background-image:none;filter:progid:DXImageTransform.Microsoft.gradient(enabled = false);cursor:default;} .open{*z-index:1000;}.open>.dropdown-menu{display:block; z-index:2;} .pull-right>.dropdown-menu{right:0;left:auto;} .dropup .caret,.navbar-fixed-bottom .dropdown .caret{border-top:0;border-bottom:4px solid #0f0f0f;content:"";} .dropup .dropdown-menu,.navbar-fixed-bottom .dropdown .dropdown-menu{top:auto;bottom:100%;margin-bottom:1px;} /* modal */ .modal-open{overflow:hidden} .modal{color:#fff; position:fixed;top:0;right:0;bottom:0;left:0;z-index:1040;display:none;overflow:auto;overflow-y:scroll} .modal.fade .modal-dialog{-webkit-transform:translate(0,-25%);-ms-transform:translate(0,-25%);transform:translate(0,-25%);-webkit-transition:-webkit-transform .3s ease-out;-moz-transition:-moz-transform .3s ease-out;-o-transition:-o-transform .3s ease-out;transition:transform .3s ease-out} .modal.in .modal-dialog{-webkit-transform:translate(0,0);-ms-transform:translate(0,0);transform:translate(0,0); } .modal-dialog{position:relative;z-index:1050;width:auto;padding:5px;margin-right:auto;margin-left:auto; max-width: 1100px;} .modal-content{position:relative;outline:0;background-clip:padding-box} .modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1030;background-color:#00274b} .modal-backdrop.fade{opacity:0;filter:alpha(opacity=0)} .modal-backdrop.in{opacity:.95;filter:alpha(opacity=95)} .modal-header{ margin:0 auto;max-width:980px; min-height:16.428571429px;padding:65px 0px 0; text-align:center; position:relative;} .modal-header .close{font-family: 'HelveticaNeueW01-75Bold', Arial; background: #fff;cursor:pointer; font-size:14px; position:absolute; right:0px; bottom:0; text-transform: uppercase; padding:5px 10px; color:#00274b; transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear;} .modal-header .close:hover {color:#078299; } .modal-header .close .iconX {padding-left:5px;} .modal-title{margin:0;line-height:1.428571429; margin-bottom:10px;font-family:'HelveticaNeueW01-75Bold', arial; font-weight: 300; font-size:30px;} .modal-body{background-color:#fff;border:10px solid #fff; border-bottom:5px solid #fff;; position:relative;padding:0; max-width:960px; margin:0 auto; -webkit-overflow-scrolling:touch; } .modal-body .copyright{ position:absolute; bottom:10px; right:40px; z-index:1; margin-bottom:0; opacity:0.5; /* IE needs this */ -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0.5)"; /* IE 8 */ filter: alpha(opacity=0.5); font-size:10px; } .modal-footer{padding:19px 20px 20px;margin:0 auto;text-align:center; max-width:600px;} .modal-footer-buttons .shareWrapper {display:inline-block; position:relative; } .modal-footer-buttons .shareWrapper a.share, .download {padding-top:13px; height:33px; font-size:20px; margin-right:18px; position:relative;} .download a{width: 48px; height: 48px; display:block; position:absolute; top:0; left:0;} .modal-footer:before,.modal-footer:after{display:table;content:" "} .modal-footer:after{clear:both} .modal-footer .btn+.btn{margin-bottom:0;margin-left:5px} .modal-footer .btn-group .btn+.btn{margin-left:-1px} .modal-footer .btn-block+.btn-block{margin-left:0} .modal.modal-message {color:#00274b;} .modal.modal-message .modal-body h1 {margin-bottom: 35px;} .modal.modal-message .modal-body { max-width:980px; padding:0 30px 20px; -webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box; font-size: 22px; font-family: arial; text-align:center; } /* cookie consent modal */ .ilmgdpr-modal .modal-backdrop.in { opacity: .75; } #ilmGdprCooMod.in { display: flex !important; flex-direction: column; } #ilmGdprCooMod .btn { display: none; } #ilmGdprCooMod .modal-dialog { background-color: #fff; color: #00274b; width: 100%; max-width: 500px; text-align: center; margin-top: 1rem; margin: auto; } #ilmGdprCooMod .modal-content { padding: 1% 4%; } #ilmGdprCooMod .modal-content .row { margin: 19px 0; } #ilmGdprCooMod .btn-area .btn { display: inline-block; } /* cookie consent modal end */ .fp-ratio, .fp-ui, .fp-help, .fp-context-menu {} .fp-help + a {z-index:-1 !important;} /*------------------- pagination --------------------- */ .pagination {margin: 0; padding-top:20px; clear:both;} .pagination .iconArrowLeft, .pagination .iconArrowRight { vertical-align:middle; color: #999;} .pagination a .iconArrowLeft, .pagination a .iconArrowRight { color:#078299;} .pagination a:hover {text-decoration:none;} .pagination ul {display: inline-block;*display: inline; margin-bottom: 0; margin-left: 10px; margin-right:10px;*zoom: 1; border-radius: 4px;vertical-align:middle} .pagination ul > li {display: inline; margin-left: 0; padding-left: 0;} .pagination ul > li > a, .pagination ul > li > span {float: left;padding: 4px 12px;line-height: 20px;text-decoration: none;background-color: #ffffff;border: 0; border-left-width: 0; font-size: 14px;} .pagination ul > li > a:focus, .pagination ul > .active > a, .pagination ul > .active > span {background-color: #078299;} .pagination ul > .active > a, .pagination ul > .active > span {color: #fff; font-family:'HelveticaNeueW01-75Bold', arial;} .pagination ul > .disabled > span, .pagination ul > .disabled > a, .pagination ul > .disabled > a:hover, .pagination ul > .disabled > a:focus {color: #999; background:#eee;cursor: default; font-family:'HelveticaNeueW01-75Bold', arial; } .pagination ul > li:first-child > a, .pagination ul > li:first-child > span {border-left-width: 1px;} .pagination-centered {text-align: center;} /*------------------- Lists general --------------------- */ ul,ol{padding:0;margin:0 0 12px 0px; list-style:none;} ul ul,ul ol,ol ol,ol ul{margin-bottom:0;} li{list-style:none; } ul.unstyled,ol.unstyled{margin-left:0;list-style:none;} ul.inline,ol.inline{margin-left:0;list-style:none;}ul.inline>li,ol.inline>li{display:inline-block;*display:inline;*zoom:1;padding-left:10px;padding-right:10px;} dl{margin:0;} dt,dd{line-height:13px; } dt{text-transform: uppercase; color:#6f6e68;font-size: 12px;margin-bottom:5px;} dd{margin-left:0;font-size: 13px;} /*------------------- Tables --------------------- */ #contentWrapper table { font-family: Arial;width:100%;margin-bottom:24px;max-width:100%;background-color:transparent;border-collapse:collapse;border-spacing:0;font-size:14px; border:0; color:#333;} #contentWrapper .workingarea table {color:#707070;} #contentWrapper table th, #contentWrapper table td{padding:6px 12px;text-align:left;vertical-align:top;line-height: 18px;} #contentWrapper .workingarea table td {padding: 5px;} #contentWrapper table th{font-weight:bold; line-height: 14px; text-transform:uppercase; color:#707070; padding:6px 14px 6px 4px;} #contentWrapper table.simple tr:first-child td {padding:6px 12px;text-align:left;vertical-align:top;line-height: 18px; font-weight:bold; line-height: 14px; text-transform:uppercase; color:#707070; } #contentWrapper table.grey tr:first-child td, #contentWrapper table.grey th {padding:6px 12px;text-align:left;vertical-align:top;line-height: 18px; font-weight:bold; line-height: 14px; text-transform:uppercase; color:#fff; background-color:#999; } #contentWrapper table thead th{vertical-align:bottom;} table.grey tr:nth-child(even) {background: #fff} table.grey tr:nth-child(odd) {background: #f2f2f2;} #contentWrapper table.blue tr:first-child td, #contentWrapper table.blue th {padding:10px 12px;text-align:left;vertical-align:top;line-height: 18px; font-weight:bold; line-height: 14px; text-transform:uppercase; color:#fff; background-color:#00274b; } #contentWrapper table.blue tr:first-child td *, #contentWrapper table.blue th *{ color: #FFF;padding: 0;margin: 0;} table.blue tr:nth-child(even) {background: #fff} table.blue tr:nth-child(odd) {background: #d8f1f5;} table.blue tr td { border-left: 1px solid #00274b;} table.blue tr td:last-child { border-right: 1px solid #00274b;} table.blue tr:last-child { border-bottom: 1px solid #00274b;} table.simple {border-top: 3px solid #f2f2f2; border-bottom: 3px solid #f2f2f2;} table.simple tr td {border-top: 1px solid #f2f2f2;} table.simple tr:first-child th {padding-top:8px;} table.simple tr:last-child td {padding-bottom:8px;} table.simple tr td:first-child, table.simple th:first-child {padding-left:0;} table.simple tr td:last-child,table.simple th:last-child {padding-right:0;} .subpageContentArea table.grey p, .subpageContentArea table.simple p, table.grey p, table.simple p {margin-bottom:0;} .subpageContentArea table td.alignright {text-align:right;} #contentWrapper table.maksupaivat {border-collapse: collapse; width: auto; } #contentWrapper table.maksupaivat td {background-color:#078299; color:#fff; text-align:center; border-right:2px solid #fff; font-family:'HelveticaNeueW01-75Bold', arial; padding:8px 11px 1px; } .euro {background-color:#5fafc4; max-width:25px; margin:0 auto; border-radius: 3px; padding: 3px 0 4px; font-family: arial;} table.maksupaivat td p {text-align:center;} /*table indicator- tables that dont fit viewport */ .scrollable > div{ overflow-x: auto; padding: 0 1px 0 0; } /* padding fix because IE miscalculates width */ .scrollable.has-scroll {position: relative;overflow: hidden; } .scrollable.has-scroll.right-shadow:after {position: absolute;top: 0;left: 100%;width: 50px;height: 100%;border-radius: 10px 0 0 0.2px 0 0 50%;box-shadow: -5px 0 10px rgba(0, 0, 0, 0.25);content: ''; } .scrollable.has-scroll.left-shadow:before {position: absolute;top: 0;left: -50px;width: 50px;height: 100%;border-radius: 10px 0 0 0.2px 0 0 50%;box-shadow: 5px 0 10px rgba(0, 0, 0, 0.25);content: '';} /* Style the scrollbar to make it visible in iOS, Android and OS X WebKit browsers (where user preferences can make scrollbars invisible until you actually scroll) */ .scrollable > div::-webkit-scrollbar {height: 12px;} .scrollable > div::-webkit-scrollbar-track {box-shadow: 0 0 2px rgba(0, 0, 0, 0.15) inset;background: #f0f0f0;} .scrollable > div::-webkit-scrollbar-thumb {border-radius: 6px;background: #ccc;} /* ------------------ utility classes for easy hiding on certain device -----------------*/ .visible-phone{display:none !important;} .visible-tablet{display:none !important;} .visible-print{display:none !important;} .epi-editContainer .visible-print{display:block !important;} .hidden-desktop{display:none !important;} .visible-desktop{display:inherit !important;} /* --------------- Accordions --------------- */ .accordions h2 { margin:0; } .accordion .ui-state-active .accordion-title a span.arrowDown {display:none; float: right;} .accordion .accordion-title span.arrowDown {display:inline-block; padding-right:25px; float: right;} .accordion .iconArrowUp {display:none; float: right;} .accordion .ui-state-active .iconArrowUp {padding-right:25px; display:inline-block;} .accordion.calculator .ui-state-active .accordion-title a span.arrowDown {display:inline-block;} .accordion.calculator .ui-state-active .accordion-title a span.arrowDown:before { content: "\68"; } .accordions .mainContentArea {border-bottom:0;} h4.accordion-title {margin:0; text-transform: none;color: #00274b;} h4.accordion-title a{color: #00274b;} .accordions .accordion-group { border-top: 2px solid #00274b; } .accordion{ background-color:#fff;border-bottom: 2px solid #00274b; overflow:hidden;} .accordion.requestContactFormBlock { border-bottom: none; } .accordion-heading{border-bottom:0; padding: 0; } .accordion-heading a{display:block;padding:20px 25px; transition: height .3s; -webkit-transition: height .3s; cursor:pointer; } .accordion-heading a:hover {text-decoration:none; } .accordion-heading a.collapsed{ transition: height .3s; -webkit-transition: height .3s;} .accordion-body{padding:0 25px 25px 25px; } .collapse {display:none} .collapse.in {display:block;} .collapsing {height: 0;overflow: hidden;position: relative;transition: height 0.35s ease 0s;} /* -------------------------Facelift styles -------------------------------*/ body{ background-color: #FFF;} /* AppCollectionDesktopPage is not ready for this change yet! */ .AppCollectionDesktopPage body { background-color: #00274b; } .mainImage.frontpage + #contentWrapper {margin-top:0px;} .mainImage + #contentWrapper {margin-top:0px;} .newsHighlightBlock h2 { margin-top: 0px; } .SiteStartPage h2{ font-weight: normal;} .SiteStartPage h3{ font-weight: normal;} .mainImage picture { max-height: 418px; } .mainImage.short-hero picture { max-height: 300px; } .mainImage.short-hero .topContentArea { top: 25px; } .mainImage { min-height: 0; } .link-container ul{ margin: 0;padding: 0;} .link-container ul li{ margin: 0;padding: 0;} a.key:before { font-family: 'ilmarinen-iconfont'; content: "\61"; font-size: 18px; padding-right: 12px; position: relative; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; top: 1px; } a.key:hover { text-decoration: none; } /* RelatedPracticalLinksBlock used on a basic content page related content area */ .RelatedPracticalLinksBlock{ padding: 30px 15px;background-color: #078299;color: #00274b; box-sizing: border-box;} .RelatedPracticalLinksBlock h4{ margin: 0;padding: 0;margin-bottom: 10px;} .RelatedPracticalLinksBlock ul > li > a{ color: #00274b; text-transform: uppercase; font-family: "HelveticaNeueW01-75Bold", Arial; font-size: 15px;} .RelatedPracticalLinksBlock ul > li { color: #00274b;list-style: none;margin: 0;padding: 0;margin-bottom: 5px;} .RelatedPracticalLinksBlock .key ul > li:before { font-family: 'ilmarinen-iconfont'; content: "\61"; font-size: 18px; padding-right: 12px; position: relative; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; top: 1px; } .RelatedPracticalLinksBlock ul { margin: 0;padding: 0;} /* Basic content page */ .BasicContentPage .row .relatedContent { padding: 40px 30px 30px 35px; } .BasicContentPage h3 { margin-top: 55px; } /* Page header image */ .header-infobar { background-color: #00274b;padding: 5px 0;} .header-infobar .row{ background-color: #00274b; } .header-infobar .row .span12{ background-color: #00274b; } .header-infobar .row .span12 *{ color: #fff;margin-bottom: 0;margin-top: 0;} .header-infobar .row .span12 strong{font-family: 'HelveticaNeueW01-75Bold'; font-weight:normal;} .topContentArea { position: relative;bottom: 0;right: 0;padding-right: 220px;box-sizing: border-box;width: auto;display: inline-block; top: 50px;} .topContentArea h1 { margin-bottom: 0px;} .topContentArea a.darkblue-btn{ position: absolute;bottom: 0;right: 0;max-width: 220px;box-sizing: border-box;border-radius: 0px;color: #FFF;background-color: #00274b;margin: 0; margin-bottom: 8px;} .topContentArea a.darkblue-btn.video-actication-button{ background-color: transparent;font-size: 100px;} .topContentArea a.video-actication-button {background-color: transparent;font-size: 100px;cursor: pointer; right: 100px; position: absolute;bottom: 0; max-width: 220px;box-sizing: border-box;color: #FFF;margin: 0; margin-bottom: 8px;} .topContentArea a.video-actication-button:hover { color: #078299;text-decoration: none;} /* Facelift button */ .facelift-button, .topContentArea a.facelift-button, a.facelift-button, input.facelift-button { background-color: #00274b; padding: 10px 15px; color: #fff; font-size: 16px; font-family: "HelveticaNeueW01-75Bold", Arial; } .Sleek .facelift-button { color: #00274b;padding: 0px;} .facelift-button .epi-editContainer{ display: inline-block; } .facelift-button:hover, .topContentArea a.facelift-button:hover, a.facelift-button:hover, input.facelift-button:hover { background-color: #078299; text-decoration: none; transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; } .calculatorForm .calcTitle2 .btn { background-color: #00274b; padding: 10px 15px; color: #fff; font-size: 16px; font-family: "HelveticaNeueW01-75Bold", Arial; } .calculatorForm .calcTitle2 .btn:hover { background-color: #078299; text-decoration: none; transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; } #request-contact-form-block .submit-container .formField .controls input:hover { background-color: #078299; text-decoration: none; transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; } /* Megamenu */ .expand-mobile-submenu {display: none;} .megamenu {display: none;position: absolute;width: 100%;min-height: 418px;z-index: 1001;background-color: #fff; left: 0;margin-top: 0px;padding-top: 20px;padding-bottom: 20px;box-sizing: border-box;} .megamenu.active {display: block;} .megamenu-section {width: 33.3%;position: relative;float: left;box-sizing: border-box;min-height: auto;padding-left: 50px;padding-bottom: 65px;} ul.megamenu-utilities-section {clear: both;position: absolute;bottom: 0;width: 100%;background-color: #00274b;max-width: none;} ul.megamenu-utilities-section li {float: left;width: 33.333333%;padding-left: 0px;box-sizing: border-box;margin-right: 0px;} ul.megamenu-utilities-section li > a{border-bottom: none;text-transform: none;font-family: "HelveticaNeueW01-75Bold";padding: 10px 0;padding-left: 50px;} ul.megamenu-section li > a:hover{ text-decoration: underline; } ul.megamenu-utilities-section li > a:hover{ background-color: #078299;text-decoration: none;transition: all 0.2s linear;-webkit-transition: all 0.2s linear;-moz-transition: all 0.2s linear; } ul.megamenu-utilities-section li:nth-child(1) > a:before{ font-family: 'ilmarinen-iconfont';content: "\76";font-size: 18px;padding-right: 12px;position: relative;top: 2px;} ul.megamenu-utilities-section li:nth-child(2) > a:before{ font-family: 'ilmarinen-iconfont';content: "\4d";;font-size: 18px;padding-right: 12px;position: relative;top: 2px;} ul.megamenu-utilities-section li:nth-child(3) > a:before{ font-family: 'ilmarinen-iconfont';content: "\61";;font-size: 18px;padding-right: 12px;position: relative;top: 2px;} .megamenu-section:nth-child(2):after,.megamenu-section:nth-child(1):after {content: "";position: absolute;right: 0;top: 0;height: 100%;width: 3px;background-color: #00274b;} .megamenu-section li{float: none;display: block;text-align: left;line-height: 28px; } .megamenu-section:nth-child(4){border-right: none; float: right;} .megamenu-section:nth-child(3){border-right: none;} .megamenu-section:last-child {float: right;border-right: none;padding-right: 16px;padding-left: 37px;} .megamenu-section li a{text-align: left;color: #00274b;margin: 0;padding: 0;text-transform: none;font-weight: bold;} .mainnav > li.active .megamenu-section a {color: #00274b;border-bottom: none;} .megamenu-section li span{font-size: 18px;font-family: "HelveticaNeueW01-75Bold";text-align: left;color: #00274b;font-weight: normal;} .logorow > .row {position: relative;} /* newsHighlightBlock */ .newsHighlightBlock{ color: #00274b;padding: 30px 15px;margin-top: 0;border-top: none;} .newsHighlightBlock:last-child{ border-right: none;} .newsHighlightBlock h5{ color: #00274b;} .newsHighlightBlock h3 a{ color: #00274b; font-family: "HelveticaNeueW01-75Bold"; font-weight: bold;} .newsHighlightBlock p{ color: #00274b; font-family: "HelveticaNeueW01-75Bold";} .newsHighlightBlock a{ color: #00274b;} .newsHighlightBlock .btn.newsroom{ display: none;} .InsuranceInANutshellBlock { box-sizing: border-box;padding-top: 30px;padding-bottom: 30px;} .InsuranceInANutshellBlock *{ box-sizing: border-box;} .InsuranceInANutshellBlock p a{font-family: "HelveticaNeueW01-75Bold";} .InsuranceInANutshellBlock .nutshell-blockheader {padding-bottom: 30px;} .InsuranceInANutshellBlock > .nutshell-section-2{ position: relative; padding-left: 15px;padding-right: 15px;} .InsuranceInANutshellBlock > .nutshell-section-3{ padding-left: 15px; padding-right: 15px;border-left: 3px solid #00274b; border-right: 3px solid #00274b;} .InsuranceInANutshellBlock > .nutshell-section-1{ padding-left: 15px; padding-right: 15px;border-right: 3px solid #00274b; border-left: 3px solid #00274b; } .InsuranceInANutshellBlock > .span12.nutshell-section-1{ border-right: 3px solid #00274b; border-left: 3px solid #00274b;} .InsuranceInANutshellBlock > .span6.nutshell-section-2{ border-right: 3px solid #00274b; } .PracticalLinksBlock { padding: 30px 15px; box-sizing: border-box;background-color: #88d2dd;} .PracticalLinksBlock { padding: 30px 15px; box-sizing: border-box;background-color: #88d2dd;} .PracticalLinksBlock .PracticalLinksBlock-description p{ margin: 0;padding: 0; } .PracticalLinksBlock *{ box-sizing: border-box;color: #00274b; } .PracticalLinksBlock p a{font-family: "HelveticaNeueW01-75Bold";} .PracticalLinksBlock .PracticalLinksBlock-header {padding-bottom: 25px;} .PracticalLinksBlock .PracticalLinksBlock-header h2{ padding: 0;margin: 0; font-weight: bold;} .PracticalLinksBlock .PracticalLinksBlock-description {padding-bottom: 25px;} .PracticalLinksBlock > .PracticalLinksBlock-section-2{ position: relative; padding-left: 15px;padding-right: 15px; background-color: #88d2dd;} .PracticalLinksBlock > .PracticalLinksBlock-section-3{ padding-left: 15px; padding-right: 15px; background-color: #88d2dd;} .PracticalLinksBlock > .PracticalLinksBlock-section-1{ padding-left: 15px; padding-right: 15px; background-color: #88d2dd;} .PracticalLinksBlock ul > li > a{ color: #00274b; font-family: "HelveticaNeueW01-75Bold";font-weight: bold;text-transform: uppercase;} .PracticalLinksBlock ul > li { margin-bottom: 10px;position: relative;padding-left: 25px; } .PracticalLinksBlock ul > li:before{position: absolute;left: 0;top: 0; content: "\61"; font-size: 18px; font-family: 'ilmarinen-iconfont'; font-style: normal;font-weight: normal;font-variant: normal;text-transform: none; padding-right: 10px;} .PracticalLinksBlock ul > li:last-child { margin-bottom: 0px; } /* pageHelpLinkBlock */ .pageHelpLinkBlock { padding: 30px 15px;} .pageHelpLinkBlock h2{ font-weight: bold;} .pageHelpLinkBlock a.pageLink {color: #00274b; } .pageHelpLinkBlock a.pageLink:hover {color: #fff;} .pageHelpLinkBlock a.pageLink:after {content: "";} /* Highlight block */ .SiteStartPage .highlightBlock .highlightText{ padding: 30px 15px; } /* Highlight block with bckground and link */ .HighlightWithLinkBlock h1, .HighlightWithLinkBlock h2, .HighlightWithLinkBlock h3, .HighlightWithLinkBlock h4, .HighlightWithLinkBlock h5 { color: #00274b;margin: 0;padding: 0;text-align: left;} /* theme for this block */ .HighlightWithLinkBlock.darkblue h1, .HighlightWithLinkBlock.darkblue h2, .HighlightWithLinkBlock.darkblue h3, .HighlightWithLinkBlock.darkblue h4, .HighlightWithLinkBlock.darkblue li, .HighlightWithLinkBlock.darkblue h5 { color: #00274b;} .HighlightWithLinkBlock.white .link-container a { color: #fff !important;} .HighlightWithLinkBlock.white h1, .HighlightWithLinkBlock.white h2, .HighlightWithLinkBlock.white h3, .HighlightWithLinkBlock.white h4, .HighlightWithLinkBlock.white p, .HighlightWithLinkBlock.white li, .HighlightWithLinkBlock.white h5 { color: #FFF; } .HighlightWithLinkBlock li { list-style: disc inside; } .HighlightWithLinkBlock .link-container li { list-style: none; } .HighlightWithLinkBlock .link-container a { color: #00274b !important;} .HighlightWithLinkBlock.white .link-container a{color: #FFF !important;} .HighlightWithLinkBlock { position: relative; box-sizing: border-box;height: 100%;} .HighlightWithLinkBlock.white { background-color: #00274b;} .HighlightWithLinkBlock.whiteanddarkblue { background-color: #fff;} .HighlightWithLinkBlock.yellowandblue { background-color: #fce385;} .HighlightWithLinkBlock.pinkandblue { background-color: #f07a8b;} .HighlightWithLinkBlock.blueanddarkblue { background-color: #88d2de;} .HighlightWithLinkBlock .link-container.btndarkblue a{ display:inline-block; font-family: "HelveticaNeueW01-75Bold", Arial; padding: 10px 15px; line-height:18px;text-align:center;vertical-align:middle;cursor:pointer;color:#fff !important;background-color:#00274b;text-transform:uppercase; font-size:15px; transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; border:0; border-radius: 0; } .HighlightWithLinkBlock .link-container.btndarkblue a:hover{ text-decoration: none; background-color:#078299; } .HighlightWithLinkBlock .link-container.btndarkblue a:after{ content: ""; } .HighlightWithLinkBlock .link-container.btnlightblue a{ display:inline-block; font-family: "HelveticaNeueW01-75Bold", Arial; padding: 10px 15px; line-height:18px;text-align:center;vertical-align:middle;cursor:pointer;color:#fff !important;background-color:#078299;text-transform:uppercase; font-size:15px; transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; border:0; border-radius: 0;} .HighlightWithLinkBlock .link-container.btnlightblue a:hover{ text-decoration: none; background-color:#00274b; } .HighlightWithLinkBlock .link-container.btnlightblue a:after{ content: ""; } .SiteStartPage .HighlightWithLinkBlock.whiteanddarkblue { background-color: #fff;} .SiteStartPage .HighlightWithLinkBlock.yellowandblue { background-color: #fce385;} .SiteStartPage .HighlightWithLinkBlock.white { background-color: #00274b;} .SiteStartPage .HighlightWithLinkBlock.pinkandblue { background-color: #f07a8b;} .SiteStartPage .HighlightWithLinkBlock.blueanddarkblue { background-color: #88d2de;} .HighlightWithLinkBlock img {width: 100%;} .HighlightWithLinkBlock div.textContent {position:absolute; top: 75px; left:30px;} .HighlightWithLinkBlock.noBackgroundImage { padding: 15px 30px;} .HighlightWithLinkBlock.noBackgroundImage .link-container a{ margin-left: 15px;margin-right: 15px;} .HighlightWithLinkBlock.noBackgroundImage div.textContent {position:static;} .HighlightWithLinkBlock .link-container a { font-size: 18px;font-family: 'HelveticaNeueW01-75Bold', arial;} .HighlightWithLinkBlock .link-container a:after { content: "\00a0\203A"; } .HighlightWithLinkBlock .link-container{ position: absolute;bottom: 15px;width: 100%;text-align: right;padding-right: 30px;padding-left: 30px; box-sizing: border-box;} .HighlightWithLinkBlock .link-container ul{ margin: 0;padding: 0;} .HighlightWithLinkBlock .link-container ul li{ margin: 0;padding: 0;} .HighlightWithLinkBlock .link-container a.ext-link {} .HighlightWithLinkBlock .link-container a.ext-link:after { content: "\00a0\e90a"; font-family: 'ilmarinen-iconfont'; font-size: 18px; /* padding-right: 12px;position: relative;speak: none;font-style: normal;font-weight: normal; font-variant: normal;text-transform: none;line-height: 1;top: 1px; */ } /* Highlight with link and icon block */ /* sizes... */ .span4 > .HighlightWithLinkAndIconBlock { height: 100px; } .span4 > .HighlightWithLinkAndIconBlock .link-container {bottom: 5px;right: 15px;} .span4 > .HighlightWithLinkAndIconBlock .textContent h2 {font-size: 20px;padding-left: 30px;padding-top: 10px;padding-right: 15px;} .span6 > .HighlightWithLinkAndIconBlock { height: 150px; } .span12 > .HighlightWithLinkAndIconBlock { height: 200px; } .span12 > .HighlightWithLinkAndIconBlock .textContent h2{ font-size: 58px; line-height: 63px; font-weight: 700; padding-top: 55px;} .highlightHighlightWithLinkBlock.noBackgroundImage{ height: auto; } /* themes... */ .HighlightWithLinkAndIconBlock { background-color: #FFF; } .HighlightWithLinkAndIconBlock .textContent h2{ color: #00274b; } .HighlightWithLinkAndIconBlock .link-container a{ color: #00274b } .HighlightWithLinkAndIconBlock.white { background-color: #FFF; } .HighlightWithLinkAndIconBlock.white .textContent h2{ color: #00274b; } .HighlightWithLinkAndIconBlock.white .link-container a{ color: #00274b } .HighlightWithLinkAndIconBlock.darkblue { background-color: #00274b; } .HighlightWithLinkAndIconBlock.darkblue .textContent h2{ color: #fff; } .HighlightWithLinkAndIconBlock.darkblue .link-container a{ color: #fff; } .HighlightWithLinkAndIconBlock { position: relative;padding-bottom: 0px;} .HighlightWithLinkAndIconBlock .textContent{ max-width: 75%;width: auto; float: left;} .HighlightWithLinkAndIconBlock .textContent h2{font-size: 30px; padding-left: 30px; padding-top: 32px; padding-right: 30px;} .HighlightWithLinkAndIconBlock .icon-container img{ height: 100%; } .HighlightWithLinkAndIconBlock .icon-container { height: 100%; width: auto; float: left;max-width: 150px;} .span12 > .HighlightWithLinkAndIconBlock .icon-container { max-width: none; } .HighlightWithLinkAndIconBlock .link-container{ position: absolute;bottom: 15px;right: 30px; display: block;list-style: none;} .HighlightWithLinkAndIconBlock .link-container li{ list-style: none;} .HighlightWithLinkAndIconBlock .link-container ul{ padding: 0px;margin: 0px;} .HighlightWithLinkAndIconBlock .link-container ul li a{font-family: 'HelveticaNeueW01-75Bold', arial; font-size: 18px; line-height: 24px; } .HighlightWithLinkAndIconBlock .link-container ul li a:after{ content: "\00a0\203A"; } /*OversizedHEaderContentBlock*/ .oversizedHeaderContentBlock { height: 100%; box-sizing: border-box; padding: 15px 30px;position: relative; padding-bottom: 30px;background-repeat: no-repeat;background-size: cover;} .oversizedHeaderContentBlock .link-container{ position: absolute;bottom: 15px; } .oversizedHeaderContentBlock .link-container a{ font-family: 'HelveticaNeueW01-75Bold', arial; } /* Stacked content block */ .stackedContentBlock { height: 50%;padding: 30px 15px;box-sizing: border-box;position: relative;} .stackedContentBlock.blueandwhite{ background-color: #FFF;color: #00274b;} .stackedContentBlock.blueandwhite *{color: #00274b;} .stackedContentBlock.blueandwhite .link-container a{ color: #00274b;} .stackedContentBlock.whiteandblue { background-color: #00274b; color: #FFF;} .stackedContentBlock.whiteandblue *{ color: #FFF;} .stackedContentBlock.whiteandblue .link-container a{ color: #FFF;} .stackedContentBlock .link-container{ position: absolute;bottom: 15px;right: 15px; } .stackedContentBlock .link-container a{ font-family: 'HelveticaNeueW01-75Bold', arial; } .stackedContentBlock .link-container a:after { content: "\00a0\203A"; } /* Customer even block */ .customerEventBlock { background-color: #078299; height: 100%;position: relative;} .customerEventBlock .eventDayBox{ display: none; } .customerEventBlock .eventContent { padding-left: 0px; } .customerEventBlock .evenTitle { color: #fff; } .customerEventBlock .evenTitle h5 { color: #fff; font-size: 24px; line-height: 26px;} .customerEventBlock .eventTime { color: #00274b;} .customerEventBlock .arrowlinkDarkblue { font-family: 'HelveticaNeueW01-75Bold', arial;position: absolute;bottom: 15px;right: 15px;} /* countdownBlock countdown block*/ .countdownBlock { background-color: #FFF;color: #00274b; padding: 15px; position: relative; border-bottom: 3px solid #00274b; border-top: 3px solid #00274b;} .countdownBlock #Countdown { font-size: 40px; line-height: 45px; font-family: 'FranklinGothicDemiCondRegular','HelveticaNeueW01-75Bold', Arial; } .countdownBlock span *{ display: inline;margin-bottom: 0;} .countdownBlock .countdown-readmore { position: absolute; right: 0; bottom: 15px; width: 100%; text-align: right; box-sizing: border-box; } .countdownBlock .countdown-readmore a{color: #00274b; margin-left: 15px; margin-right: 15px; font-size: 18px; font-family: 'HelveticaNeueW01-75Bold', arial;} .countdownBlock .countdown-readmore a:after{ content: "\00a0\203A"; } .countdownBlock .countdown-readmore *{ margin-bottom: 0;} .countdownBlock .colon { color: #078299;} .countdownBlock .countdown-message { display: block;text-align: center; } .countdownBlock span.small{font-size: 28px; } .countdownBlock #FinalMessage *{ margin-bottom: 0;margin-top: 0; } .countdownBlock #Countdown { display: block;text-align: center; } /* FrontpageLinkListBlock facelift styles */ .mainContentArea {border-bottom:none;} .SiteStartPage .white {background-color: #fff;} .SiteStartPage .HighlightWithLinkBlock .white {background-color: #00274b;} .SiteStartPage #contentWrapper .row.linkListBlock {padding: 30px 0;} .linkListBlock .white {background-color: #fff; border-right: 3px solid #00274b;} .linkListBlock .span4:first-child .white {border-left: 3px solid #00274b;} .row.linkListBlock .white a h3 { color: #00274b; font-weight: bold; } .row.linkListBlock .white a { color: #00274b; } .row.linkListBlock .white .links a { font-weight: bold; background-color: transparent; position: relative; } .row.linkListBlock .white .links a:hover { background-color: transparent;} .row.linkListBlock .white .links a:before { font-family: 'ilmarinen-iconfont';content: "\61";font-size: 18px; padding-right: 12px;position: relative;speak: none;font-style: normal;font-weight: normal; font-variant: normal;text-transform: none;line-height: 1;top: 1px;} /* Frontpage link lift (New block in facelift) */ .FrontPageLinkLiftBlock { padding: 30px 15px; } .FrontPageLinkLiftBlock h2{ display: inline-block;max-width: 80%;margin: 0; font-size: 40px; font-weight: bold;} .FrontPageLinkLiftBlock .link{ display: inline-block;width: 20%; margin: 0; float: right; text-align: center; } .FrontPageLinkLiftBlock .link a{ line-height: 45px;} /* Frontpage link lift themes */ .FrontPageLinkLiftBlock.blueandcyan { background-color: #078299; } .FrontPageLinkLiftBlock.blueandpink { background-color: #f7d8dc; } .FrontPageLinkLiftBlock.blueandyellow { background-color: #fce385; } .FrontPageLinkLiftBlock.blueandlightblue { background-color: #078299; } .FrontPageLinkLiftBlock.whiteanddarkblue { background-color: #00274b;color: #fff;} .FrontPageLinkLiftBlock.whiteanddarkblue .facelift-button{ background-color: #078299; } .FrontPageLinkLiftBlock.whiteanddarkblue .facelift-button:hover{ background-color: #00274b; } .FrontPageLinkLiftBlock.blueandwhite { background-color: #fff;border-top: 3px solid #00274b; border-bottom: 3px solid #00274b; } /* News lift block */ .latestNewsBlock { height: 100%; background-color: #078299; padding: 30px 15px;position: relative;box-sizing: border-box; padding-bottom: 45px;} .NewsArchivePage .latestNewsBlock{ height: auto; } .latestNewsBlock .span12{ background-color: #078299;} .latestNewsBlock h2{ margin-top: 0; } .latestNewsBlock .latestNewsItem h5{ text-transform: uppercase; } .latestNewsBlock .latestNewsItem .newsDate{ color: #00274b; } .latestNewsBlock .latestNewsItem .separator{ color: #00274b; } .latestNewsBlock .latestNewsItem .newsCategory{ color: #00274b;text-transform: capitalize;display: inline; font-weight: normal; font-family: arial;} .latestNewsBlock .rss{ display: none; } .latestNewsBlock .moreNews{ position: absolute;bottom: 15px;right: 15px;margin-top: 0;padding-top: 0;} .latestNewsBlock .moreNews a{ color: #00274b; } /*news highlight with manual lift block*/ .latestNewsBlockWithManualLift{ background-color: #078299; } .latestNewsBlockWithManualLift .ManualLift{position: relative; overflow: hidden;} .latestNewsBlockWithManualLift > h2 { margin-top: 0;margin-bottom: 0; } .latestNewsBlockWithManualLift .newsDate { font-weight: bold;display: inline; } .latestNewsBlockWithManualLift .manualLiftImage{ width: auto; position: relative;height: 100%;max-width: none; max-height: 600px;} .latestNewsBlockWithManualLift .manualLiftText { box-sizing: border-box; background-color: rgba(0, 0, 0, 0.2); color: #FFF; position: absolute;bottom: 0;width: 100%;display: block;padding: 20px;} .latestNewsBlockWithManualLift .manualLiftText:hover { color: #FFF; } .latestNewsBlockWithManualLift .manualLiftText h2{ color: #FFF; } .latestNewsBlockWithManualLift .manualLiftText p{ color: #FFF; } /* last modified pages block lastModifiedPagesBlock */ .lastModifiedPagesBlock{ padding-top: 30px; padding-bottom: 30px; } .lastModifiedPagesBlock .latestPageItem a{ color: #00274b; text-transform: uppercase; font-family: "HelveticaNeueW01-75Bold", Arial; font-size: 15px; } .lastModifiedPagesBlock .latestPageItem a:hover{ text-decoration: underline; color: #00274b; } .lastModifiedPagesBlock .latestPageItem a:after { content: "\00a0\203A"; } /* Order newsletter */ .orderNewsletterBlock .accordion-heading { color: #fff; background-color: #00274b; } .orderNewsletterBlock .accordion-title { margin-top: 0; margin-bottom: 0; color: #FFF; position: relative; background-color: #00274b; padding-right: 85px; } .orderNewsletterBlock .accordion-title a { color: #FFF !important; } .orderNewsletterBlock .accordion-heading a.collapsed .arrowDown { background-color: #00274b; padding: 20px 30px; float: right; position: absolute; top: 0; right: 0; display: inline-block; } .orderNewsletterBlock .ui-state-active .accordion-title a span.arrowDown { display: inline-block; } .orderNewsletterBlock, .orderNewsletterFormBlockContent, #orderNewsletterForm, .orderNewsletterBlock div[class^="span"]{ background-color: #d8f1f6; } .orderNewsletterBlock.accordion { border-bottom:none; } .orderNewsletterBlock .ui-state-active .accordion-title a span.arrowDown:before { content: "h"; } #orderNewsletterForm, #orderNewsletterThankYou { padding: 15px; } #orderNewsletterForm .formField { width: 100%; } #orderNewsletterForm .formField label { display: block; width: 100%; text-align: left; text-transform: uppercase; margin-bottom: 5px; } #orderNewsletterForm .email-container .controls { margin-left: 0; width: 100%; } #orderNewsletterForm .email-container .controls input { width: 100%; border: none; } #orderNewsletterForm .email-container .controls input:focus, #orderNewsletterForm .email-container .controls input { outline-offset: -1px; } #orderNewsletterForm .submit-container .formField { margin-top: 37px; } #orderNewsletterForm .submit-container { text-align: right; } #orderNewsletterForm .submit-container .facelift-button { text-transform: uppercase; } #orderNewsletterForm .disclaimer p { margin-bottom: 0; } #orderNewsletterForm .disclaimer { font-size: 15px; } #orderNewsletterForm input[type=button] { outline: none; box-shadow: none; border: none; } #orderNewsletterForm input[type=text] { background-color: #FFF; border: none; padding: 5px; color: #00274b; box-sizing: border-box; } /* Highcharts block: */ .highchartsBlock { padding: 15px 0 30px; } /* Personnel pages */ .PersonnelListingPage #contentWrapper { margin: 0px; max-width: none; position: relative; background-color: transparent; padding: 0px; } .PersonnelListingPage .personnel-listing-page-wrapper { margin: 0px auto 20px; max-width: 1260px; position: relative; background-color: transparent; padding: 0 20px; padding-top: 30px; } .personnel-listing-page-wrapper { padding-top: 30px; } .personnel-page-wrapper { padding-top: 30px; } .personnel-listing-page-wrapper .personnel-list .personnel-list-item { float: left; width: 33.3%; text-align: center; padding-bottom: 30px; } .personnel-listing-page-wrapper .personnel-list .personnel-list-item:nth-child(3n+1) { clear: left; } .personnel-listing-page-wrapper .personnel-list .personnel-list-item .personnel-image, .personnel-page-wrapper .personnel-image img{ border: 3px solid #00274b; border-radius: 50%; text-align: center; margin-bottom: 20px; } .personnel-page-wrapper{ font-family: Arial; font-size: 16px; line-height: 22px; } .personnel-page-wrapper .personnel-left-container{ padding-right: 25px; } .personnel-page-wrapper .personnel-right-container{ padding-left: 25px; } .personnel-page-wrapper .personnel-image{ text-align: center; padding: 0 80px;} .personnel-page-wrapper .personnel-name{ text-transform: none;margin-bottom: 0px;} .personnel-page-wrapper .personnel-jobtitle{ display: block; font-family: Arial; color: #00274b;} .personnel-page-wrapper .personnel-phone-number{ display: block; } .personnel-page-wrapper .personnel-phone-number a{ color: #00274b;font-family: Arial;} .personnel-page-wrapper .personnel-email{ display: block; text-align: left; font-family: Arial; } .personnel-page-wrapper .personnel-description{ margin-top: 30px;} .personnel-page-wrapper .personal-social-media-list{ margin-top: 5px;} .personnel-page-wrapper .personal-social-media-list li{ display: inline; margin-right: 10px;} .personnel-listing-page-wrapper .personnel-list .personnel-list-item > a:hover{ text-decoration: none; } .personnel-listing-page-wrapper .personnel-list .personnel-list-item .personnel-image{ width: 225px;height: 225px; } .personnel-listing-page-wrapper .personnel-list .personnel-list-item a .personnel-name{ display: block; text-align: center;font-weight: bold;font-family: Arial; color: #00274b;} .personnel-listing-page-wrapper .personnel-list .personnel-list-item a .personnel-name:hover{ text-decoration: underline;} .personnel-listing-page-wrapper .personnel-list .personnel-list-item .personnel-jobtitle{ display: block; text-align: center; font-family: Arial;} .personnel-listing-page-wrapper .personnel-list .personnel-list-item .personnel-phone-number{ display: block; text-align: center; } .personnel-listing-page-wrapper .personnel-list .personnel-list-item .personnel-phone-number a{ color: #00274b;font-family: Arial;} .personnel-listing-page-wrapper .personnel-list .personnel-list-item .iconPhone, .personnel-page-wrapper .iconPhone { color: #078299; padding-right: 5px; vertical-align: middle; } .personnel-listing-page-wrapper .personnel-list .personnel-list-item .personnel-email{ display: block; text-align: center; font-family: Arial; } /*Events */ .EventPage #contentWrapper, .EventListingPage #contentWrapper{ min-height: 780px; } .EventListingPage .eventsListingPagingPreviousButton { float: left; } .EventPage .event-page-more-info-button, .EventPage .event-page-register-button, .EventListingPage .eventsRegisterButton, .EventListingPage .eventsListingPagingNextButton, .EventListingPage .eventsListingPagingPreviousButton { text-transform: uppercase; } .EventPage .event-page-register-button { margin-right: 15px; } .EventListingPage a:hover, .EventListingPage a h4:hover { color: #00274b; } .EventListingPage a h4 { margin-top: 0; margin-bottom: 0; display: table-cell; vertical-align: middle; height: 199px; } .EventPage .locationText { margin-bottom: 0; } .EventPage .event-page-toggle-container { margin-bottom: 25px; } .EventPage .timeText { margin-bottom: 0; } .EventPage .event-page-registeration-iframe, .EventPage .event-page-programme-iframe { width: 817px; height: 580px; border: none; } .EventPage .event-page-programme-iframe { height: 1660px; } .EventListingPage #contentWrapper{ margin: 0px; max-width: none; position: relative; background-color: transparent; padding: 0px; } .EventListingPage .eventListingPageContainer { margin: 0px auto 20px; max-width: 1260px; position: relative; background-color: transparent; padding: 0 20px; } .EventListingPage a.facelift-button:hover { color: #FFF; } .eventListingPageContainer h1, .EventPage h1{ text-align: left; } .eventListingPageContainer .eventContent .eventTime {margin-bottom: 0; font-size: 14px; font-weight: bold;} .eventListingPageContainer .eventContent .evenTitle {margin: 0; } .eventListingPageContainer .eventContent .eventLocation { font-family: Arial;font-weight: bold;} .eventListingPageContainer .event:nth-child(3n){ clear: right; } .eventListingPageContainer .event:nth-child(3n+4){ clear: left; } .eventListingPageContainer .event.row1:nth-child(3n+1) a.eventsColorBox{ background-color: #85d2df;} .eventListingPageContainer .event.row1:nth-child(3n+2) a.eventsColorBox{ background-color: #f6dd7e;} .eventListingPageContainer .event.row1:nth-child(3n+3) a.eventsColorBox{ background-color: #f27889;} .eventListingPageContainer .event.row2:nth-child(3n+1) a.eventsColorBox{ background-color: #f27889;} .eventListingPageContainer .event.row2:nth-child(3n+2) a.eventsColorBox{ background-color: #85d2df;} .eventListingPageContainer .event.row2:nth-child(3n+3) a.eventsColorBox{ background-color: #f6dd7e;} .eventListingPageContainer .event.row3:nth-child(3n+1) a.eventsColorBox{ background-color: #f6dd7e;} .eventListingPageContainer .event.row3:nth-child(3n+2) a.eventsColorBox{ background-color: #f27889;} .eventListingPageContainer .event.row3:nth-child(3n+3) a.eventsColorBox{ background-color: #85d2df;} .eventListingPageContainer .event .eventContent a.eventsColorBox { padding: 0px 25px; height: 200px; display: block; } .eventListingPageContainer .event .eventContent .eventsInfoContainer { position: relative; padding-bottom: 45px; margin-bottom: 25px; height: 100px; } .eventListingPageContainer .event .eventContent a.eventsRegisterButton { position: absolute; right: 0; bottom: 0; } .eventListingPageContainer .eventsCityFilter { position: relative; margin-top: 10px; margin-left: 10px; } .eventListingPageContainer .eventsCityFilter a { background-color: #00274b; padding: 3px 10px; color: #FFF; display: block; text-transform: uppercase; font-size: 14px; } .eventListingPageContainer .eventsToggleFilter:after { position: absolute; right: 8px; top: 8px; content: "\67"; font-size: 15px; color: #fff; font-family: 'ilmarinen-iconfont'; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; padding-bottom: 0px; } .eventListingPageContainer .eventsCityFilter .filter-menu { position: absolute; width: 100%; top: 0; left: 0; z-index: 2000; } .eventListingPageContainer .eventsHeaderRow { margin-top: 30px;} .eventListingPageContainer .eventsHeaderRow h2 { margin-top: 0; } .EventListingPage .eventsListingPagingRow{ margin-top: 30px;} .EventListingPage .eventsListingPagingRow .eventsListingPagingNextButton{ float: right; } /* Html block */ .htmlBlock li{ list-style: disc inside; } .htmlBlock.info > .span12 { border: 3px dashed #078299; padding: 15px 30px 15px 90px; margin: 15px 0 30px; position: relative; } .htmlBlock.info > .span12:before { font-family: 'ilmarinen-iconfont'; content: " \76"; font-size: 26px; line-height: 34px; letter-spacing: -.1em; text-align: center; display: block; width: 34px; height: 34px; border: 2px solid; border-radius: 50%; position: absolute; left: 30px; top: 35px; } @media screen and (max-width:549px) { .htmlBlock.info > .span12 { padding-left: 70px; } .htmlBlock.info > .span12:before { left: 20px; } } /* Divider block */ .dividerBlock { width: 100%; display: block; padding-top: 20px; padding-bottom: 20px; background-color: transparent; height: auto; min-height: 1px; } .dividerBlock .dividerBlockLine{ width: 100%;display: block;margin: 20px 0;height: 3px;background-color: #00274b; } /* New client form block*/ .insuranceOrderFormBlock{ position: relative;padding: 0;margin: 0;background-color: #dbf1f5;} .insuranceOrderFormBlock .insuranceOrderFormBlock-title{ background-color: #00274b;color: #FFF;margin: 0;padding: 0; color: #FFF;margin: 0;padding: 20px;} .insuranceOrderFormBlock fieldset{ border: none;padding: 0;margin: 0;} .insuranceOrderFormBlock legend{ font-weight: bold;} .insuranceOrderFormBlock .insuranceOrderFormBlockContent { padding: 15px; } .insuranceOrderFormBlock .row { width: 100%;box-sizing: border-box; } .insuranceOrderFormBlock .row [class*="span"]{ background-color: transparent;} .insuranceOrderFormBlock .formField label{width: 100%; display: block;text-align: left;margin-bottom: 10px; padding-right: 100px;box-sizing: border-box; font-family: 'HelveticaNeueW01-75Bold', Arial;text-transform: uppercase; font-weight: bold;} .insuranceOrderFormBlock .formField label .labelInfo{font-family: 'HelveticaNeueW01-45Ligh', Arial;font-weight: normal;font-size: 14px;text-transform: none;} .insuranceOrderFormBlock .formField .controls{ margin: 0;padding: 0;margin-right: 100px;} .insuranceOrderFormBlock .formField .controls select{ display: inline-block;margin-right: 30px;} .insuranceOrderFormBlock .formField .controls #insurance-order-is-employer{ display: inline-block;width: auto;} .insuranceOrderFormBlock .formField .controls #insurance-order-number-of-employees{ max-width: 50px;} .insuranceOrderFormBlock .formField input{ width: 100%;display: block;border: none;padding: 5px; margin: 0; clear: both;} .insuranceOrderFormBlock .formField fieldset{padding: 0; margin:0;} .insuranceOrderFormBlock .employee-fields-container.disabled{ display: none;} .insuranceOrderFormBlock .submit-container .formField .controls input{ float: right;margin-left: 35px;margin-top: 15px; vertical-align: middle;cursor: pointer; padding: 10px 15px; text-transform: uppercase; -webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;width: auto;} .requestContactFormBlock{ position: relative;padding: 0;margin: 0;background-color: #dbf1f5;} .requestContactFormBlock .accordion-title{ background-color: #00274b;color: #FFF;margin: 0;padding: 0;} .requestContactFormBlock .accordion-title a{ color: #FFF;margin: 0;padding: 20px;} .requestContactFormBlock .arrowDown{ background-color: #00274b;padding: 22px 30px;float: right;position: absolute;top: 0;right: 0; } .requestContactFormBlock .accordion-title span.arrowDown { display: inline-block;color: #FFF; padding-right:30px;} .requestContactFormBlock .ui-state-active .accordion-title a span.arrowDown:before {content: "\68";} .requestContactFormBlock .ui-state-active .accordion-title a span.arrowDown { display: inline-block;} .requestContactFormBlock .ui-state-active .accordion-title a span.arrowDown { display: inline-block;} .requestContactFormBlock fieldset{ border: none;padding: 0;margin: 0;} .requestContactFormBlock legend{ font-weight: bold;} .requestContactFormBlock .requestContactFormBlockContent { padding: 15px; } .requestContactFormBlock .row { width: 100%;box-sizing: border-box; } .requestContactFormBlock .row [class*="span"]{ background-color: transparent;} .requestContactFormBlock .formField label{width: 100%; display: block;text-align: left;margin-bottom: 10px; font-family: 'HelveticaNeueW01-75Bold', Arial;text-transform: uppercase; font-weight: bold;} .requestContactFormBlock .formField label .labelInfo{font-family: 'HelveticaNeueW01-45Ligh', Arial;font-weight: normal;font-size: 14px;text-transform: none;} .requestContactFormBlock .formField .controls{ margin: 0;padding: 0;margin-right: 100px;} .requestContactFormBlock .formField input{ width: 100%;display: block;border: none;padding: 5px; margin: 0; clear: both;} .requestContactFormBlock .formField textarea{ width: 100%;display: block;border: none;padding: 5px; margin: 0; clear: both;background-color: #FFF; -webkit-box-shadow: none; box-shadow: none; } .requestContactFormBlock .formField fieldset{padding: 0; margin:0;} .requestContactFormBlock .employee-fields-container.disabled{ display: none;} .requestContactFormBlock .submit-container .formField .controls input{ font-family: 'HelveticaNeueW01-75Bold', Arial;float: right;margin-left: 35px;margin-top: 15px; line-height: 18px;vertical-align: middle;cursor: pointer;color: #fff;background-color: #00274b; text-transform: uppercase;font-size: 15px;border: 0;border-radius: 0px;padding: 9px 20px; -webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;width: auto;} /* Personnel block */ .PersonnelBlock .personnel-image { text-align: center; padding: 25px; } .PersonnelBlock .personnel-image img{ border: 3px solid #00274b; border-radius: 50%; } .PersonnelBlock .personnel-title { display: block; text-align: center; } .PersonnelBlock .personnel-name { display: block; text-align: center; font-weight: bold; } /* Forms addon */ form.EPiServerForms, .EPiServerForms { padding: 0; margin: 0; background-color: #dbf1f5; box-sizing: border-box; } form.EPiServerForms .Form__Status .Form__Success__Message { background-color: #dbf1f5; color: #00274b; } form.EPiServerForms .Form__Status__Message.hide, .EPiServerForms .Form__Status__Message.hide { display: none; } .EPiServerForms .Form__Description{ padding: 10px 15px; } .EPiServerForms * { box-sizing: border-box; } .EPiServerForms .Form__Element:before, .EPiServerForms .Form__Element:after { content: " "; display: table; } .EPiServerForms .Form__Element:after { clear: both; } .EPiServerForms h2 { font-family: 'FranklinGothicDemiCondRegular','HelveticaNeueW01-75Bold', Arial; background-color: #00274b; color: #FFF; margin: 0; padding: 0; padding: 20px; font-size: 30px; } .EPiServerForms h2.Form__Title { position: relative; cursor: pointer; } .EPiServerForms h2.Form__Title:after { background-color: #00274b; content: "\67"; padding: 22px 30px; float: right; position: absolute; top: 0; display: inline-block; right: 0; font-family: 'ilmarinen-iconfont'; box-sizing: border-box; height: 100%; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased; } .EPiServerForms .FormSelection select { background-color: #fff; border-radius: 0px; border: 0; font-size: 24px; padding: 4px 15px; width: 100%; font-family: Arial; } .EPiServerForms .Form__Status{} .EPiServerForms input{ display: block; } .EPiServerForms input.FormTextbox__Input, .EPiServerForms textarea.FormTextbox__Input { width: 100%; display: block; border: none; padding: 5px; margin: 0; clear: both; box-shadow: none; background-color: #FFF; font-size: 18px; } .EPiServerForms .epi-editContainer .span6, .EPiServerForms .epi-editContainer .span12 { background-color: initial; } .epi-editContainer .EPiServerForms { background-color: #dbf1f5; } .EPiServerForms:after { clear: both; display: table; content: ""; line-height: 0; } .EPiServerForms:before { display: table; content: ""; line-height: 0; } .EPiServerForms .epi-editContainer .FormTextbox, .EPiServerForms .epi-editContainer .FormSelection, .EPiServerForms .epi-editContainer .FormChoice { display: block; border: none; padding: 5px; margin: 0; clear: both; box-shadow: none; font-size: 18px; width: 100%; padding-right: 20px; padding-left: 20px; display: inline-block; float: left; background-color: #dbf1f5; } .EPiServerForms .epi-editContainer .FormTextbox--Textarea { width: 100%; padding-right: 20px; padding-left: 20px; display: inline-block; float: left; } .EPiServerForms button.FormSubmitButton{ background-color: #00274b; padding: 10px 15px; color: #fff; font-size: 16px; font-family: "HelveticaNeueW01-75Bold", Arial; display: block; border: none; clear: both; vertical-align: middle; cursor: pointer; text-transform: uppercase; margin-left: 20px; } .EPiServerForms button.FormSubmitButton:hover { background-color: #078299; text-decoration: none; transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; } .EPiServerForms .Form__Element .Form__Element__Caption{ background-color: #dbf1f5; display: block; clear: both; text-align: left; width: 100%; margin-bottom: 10px; box-sizing: border-box; font-family: 'HelveticaNeueW01-75Bold', Arial; text-transform: uppercase; font-weight: bold; } .EPiServerForms .Form__Element.FormChoice label{ width: auto; display: block; clear: both;} .EPiServerForms .Form__Element.FormChoice .FormChoice__Input { display: inline-block;} .EPiServerForms .Form__MainBody { padding: 15px; } .EPiServerForms .Form__Element .FormTextbox, .EPiServerForms .Form__Element .FormFileUpload, .EPiServerForms .Form__Element .FormRange, .EPiServerForms .Form__Element .FormSelection, .EPiServerForms .Form__Element .FormCaptcha, .EPiServerForms .Form__Element .FormChoice { width: 50%; padding-right: 20px; padding-left: 20px; display: inline-block; float: left; } .EPiServerForms .FormCaptcha__Refresh { background-color: #00274b; padding: 5px 10px; color: #fff; font-size: 16px; font-family: "HelveticaNeueW01-75Bold", Arial; border: none; clear: both; vertical-align: middle; cursor: pointer; text-transform: uppercase; margin-left: 20px; } .EPiServerForms .FormCaptcha__Input { margin-top: 10px; } .EPiServerForms .Form__Element.FormChoice label.FormChoice--Image__Item { display: inline-block; clear: none; } .EPiServerForms .FormChoice--Image .FormChoice__Input~img { border: 2px solid #dbf1f5 !important; } .EPiServerForms .FormChoice--Image .FormChoice__Input:checked~img { border: 2px solid rgb(0, 39, 75) !important; } .EPiServerForms .Form__Element .FormTextbox.FormTextbox--Textarea, .EPiServerForms .Form__Element .FormChoice--Image { width: 100%; padding-right: 20px; padding-left: 20px; display: inline-block; float: left; } .EPiServerForms .Form__Element.FormParagraphText { clear: both; padding: 0 20px; } /* Retirement test */ .retirementTestContainer { position: relative; } .retirementTest [class*="span"] { background-color: #dbf1f5; } #retirementTestSummary { display: none; padding: 30px 15px; margin: 0; background-color: #dbf1f5; box-sizing: border-box; } .retirementQuestionContainer { max-width: 960px; margin: 0 auto; } .retirementTestContainer #retirementTestSubmit { margin: 0;border: 0;text-transform: uppercase;display: inline-block;} .retirementTestContainer h2{ margin: 0; padding: 0; color: #FFF; margin: 0; padding: 0px; } .retirementTestContainer .accordion-heading a { color: #fff; background-color: #00274b; padding: 20px; padding-right: 85px; } .retirementTestContainer .accordion-title { margin: 0; } .retirementTestContainer .accordion-heading a.collapsed .arrowDown { background-color: #00274b; padding: 22px 30px; float: right; position: absolute; top: 0; right: 0; } @media screen and (max-width: 720px) { .retirementTestContainer .accordion-heading a.collapsed .arrowDown { padding: 20px 30px; } } .retirementTestContainer .ui-state-active .accordion-title a span.arrowDown { display: inline-block; } .retirementTestContainer .ui-state-active .accordion-title a span.arrowDown:before { content: "\68"; } .radios-to-slider{ background-color:#fff; display:block; position:relative; margin-bottom:80px; -webkit-box-sizing:content-box; -moz-box-sizing:content-box; -o-box-sizing:content-box; box-sizing:content-box; } .radios-to-slider.medium{ height:22px; -webkit-border-radius:25px; -moz-border-radius:25px; -o-border-radius:25px; border-radius:25px; padding:5px; } /* Levels */ .radios-to-slider .slider-level{ background-color:#078299; cursor:pointer; position:absolute; display:block; } .radios-to-slider .slider-level.slider-lower-level{ background-color: #fff; } .radios-to-slider.medium .slider-level{ width:22px; height:22px; -webkit-border-radius:22px; -moz-border-radius:22px; -o-border-radius:22px; border-radius:22px; z-index:2; } /* Labels */ .slider-label{ position:relative; display:block; cursor:pointer; font-weight: normal; text-align:center; font-size: 14px; } .slider-label-active { font-weight: bold; } .radios-to-slider.medium .slider-label{ top:50px; width: 33.3%; text-align: center; min-width: 1px; min-height: 1px; } .radios-to-slider.medium .slider-label:first-of-type { text-align:left; } .radios-to-slider.medium .slider-label:last-of-type { text-align:right; } .radios-to-slider.medium.FiveOptions .slider-label{ width: 20%; } .radios-to-slider.medium.FourOptions .slider-label{ width: 25%; } .radios-to-slider.medium.TwoOptions .slider-label{ width: 50%; } /* Slider bar */ .radios-to-slider .slider-bar{ background-color: #078299; float:left; height:100%; width:0; pointer-events:none; display:none; position:absolute; left:0; top:0; } .slider-bar.transition-enabled{ -webkit-transition:.2s; -moz-transition:.2s; -o-transition:.2s; transition:.2s; } .radios-to-slider.medium .slider-bar{ -webkit-border-radius:22px; -moz-border-radius:22px; -o-border-radius:22px; border-radius:22px; } /* Slider Knob */ .slider-knob{ float:right; background-color: #00274b; } .radios-to-slider.medium .slider-knob{ width:32px; height:32px; -webkit-border-radius:25px; -moz-border-radius:25px; -o-border-radius:25px; border-radius:25px; } .retirementQuestionsSection { padding: 30px 15px; margin: 0; background-color: #dbf1f5; box-sizing: border-box; } /* Error outline */ input.parsley-error { outline: 1px solid #d83b51; } /* Switchery styles */ .switchery {background-color: #fff;border: 1px solid #dfdfdf;border-radius: 20px;cursor: pointer;display: inline-block; height: 25px;position: relative;vertical-align: middle;width: 95px;-moz-user-select: none;-khtml-user-select: none; -webkit-user-select: none;-ms-user-select: none;user-select: none;box-sizing: content-box;background-clip: content-box;} .switchery > small {background: #fff;border-radius: 100%;box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);height: 25px;position: absolute;top: 0;width: 25px;} .switchery-small {border-radius: 20px;height: 20px;width: 33px;} .switchery-small > small {height: 20px;width: 20px;} .switchery-large {border-radius: 40px;height: 40px;width: 66px;} .switchery-large > small {height: 40px;width: 40px;} .insuranceOrderFormBlock .switchery:after { content: "EN"; color: #FFF; position: absolute; left: 40px; top: 1px; font-size: 14px; } .insuranceOrderFormBlock .switchery.switchery-checked:after { content: "KYLL\00c4"; color: #00274b;position: absolute;left: 25px;top: 1px;font-size: 14px; } /* SV */ html:lang(sv) .insuranceOrderFormBlock .switchery:after { content: "NEJ"; } html:lang(sv) .insuranceOrderFormBlock .switchery.switchery-checked:after {content: "JA";} /* EN */ html:lang(en) .insuranceOrderFormBlock .switchery:after {content: "NO";} html:lang(en) .insuranceOrderFormBlock .switchery.switchery-checked:after {content: "YES";} /* Suomi100 campaign */ /*Landing page for suomi100 campign*/ .Suomi100CampaignLandingPage #contentWrapper, .Suomi100CampaignSubmissionPage #contentWrapper{ margin: 0px; max-width: none; position: relative; background-color: transparent; padding: 0px; } .Suomi100CampaignLandingPage .suomi100Wrapper, .Suomi100CampaignSubmissionPage .suomi100Wrapper{ margin: 0px auto 20px; max-width: 1260px; position: relative; background-color: transparent; padding: 0 20px; } #Suomi100SubmissionForm .formField label .tooltip { max-width: 240px; } .submissionListContainer .firstCol { clear:left; } /* Suomi 100 Submission page */ .Suomi100CampaignSubmissionPage .suomi100Submission { padding: 30px; } .Suomi100CampaignSubmissionPage .suomi100Wrapper { margin-top: 30px; } .Suomi100CampaignSubmissionPage .backToLanding { padding: 20px 0px; padding-left: 65px; background-color: #00274b; display: block; width: 100%; color: #FFF; position: relative; font-size: 30px; box-sizing: border-box; font-family: 'FranklinGothicDemiCondRegular','HelveticaNeueW01-75Bold', Arial; text-transform: uppercase; } .Suomi100CampaignSubmissionPage .backToLanding:hover { text-decoration: underline;color: #FFF; } .Suomi100CampaignSubmissionPage .backToLanding:before { font-size: 30px; position: absolute; left: 0; top: 0; content: "f"; font-family: 'ilmarinen-iconfont'; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; padding-left: 20px; padding-top: 17px; padding-bottom: 17px; } .Suomi100CampaignLandingPage .voteCountContainer { position: relative; padding-left: 40px; float: left; } .Suomi100CampaignSubmissionPage .voteCountContainer { position: relative; padding-left: 55px; } .Suomi100CampaignLandingPage .voteCountContainer span, .Suomi100CampaignSubmissionPage .voteCountContainer span { display: block; font-weight: bold; font-size: 14px; font-family: arial; line-height: 18px; } .Suomi100CampaignLandingPage .voteCountContainer:before, .Suomi100CampaignSubmissionPage .voteCountContainer:before { width: 35px; height: 35px; position: absolute; left: 0px; top: 2px; color: #00274b; content: ""; background-image: url("/Static/img/sydan.svg"); background-size: contain; background-repeat: no-repeat; speak: none; padding-bottom: 0px; } .Suomi100CampaignLandingPage .voteCountContainer:before { padding-left: 0px; } .Suomi100CampaignSubmissionPage .submissionImageContainer { margin-bottom: 30px; clear: both; overflow: hidden; position: relative; } .Suomi100CampaignLandingPage .submissionImageContainer .iconPlay { font-size: 70px; color: #fff; margin: 0 auto; position: relative; top: 125px; width: 70px; display: block; } .Suomi100CampaignSubmissionPage .submissionTextContainer { padding-left: 30px; } /* Embed resposively */ .Suomi100CampaignSubmissionPage .submissionYoutubeContainer { margin-bottom: 30px; position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; clear: both; } .Suomi100CampaignSubmissionPage .submissionYoutubeContainer iframe, .Suomi100CampaignSubmissionPage .submissionYoutubeContainer object, .Suomi100CampaignSubmissionPage .submissionYoutubeContainer embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .Suomi100CampaignSubmissionPage .submitVoteContainer {border: none;position: relative;display: none;} .Suomi100CampaignSubmissionPage .facelift-button {border: none; padding-left: 30px;} .Suomi100CampaignSubmissionPage .submitVoteContainer:before { font-size: 15px; position: absolute; left: 10px; top: 13px; color: #fff; content: "M"; font-family: 'ilmarinen-iconfont'; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; padding-bottom: 0px; } .submissionListContainer { margin-top: 30px; } .submissionListContainer .submissionListTop h2{ padding-left: 30px; margin-top: 0; } .submissionListContainer .suomi100Listfilter { position: relative; margin-top: 10px; } .submissionListContainer .suomi100Listfilter .filter-menu { position: absolute; width: 100%; top: 0; left: 0; z-index: 2000; } .submissionListContainer .suomi100Listfilter a{ background-color: #00274b; padding: 3px 10px; color: #FFF; display: block; text-transform: uppercase; font-size: 14px; } #suomi100ToggleFilter { position: relative; } #suomi100ToggleFilter:after { position: absolute; right: 8px; top: 8px; content: "\67"; font-size: 15px; color: #fff; font-family: 'ilmarinen-iconfont'; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; padding-bottom: 0px; } .submissionListContainer .submission{ padding: 0 5px;} .submissionListContainer .submissionDate{ font-weight: bold; font-size: 14px;} .submissionListContainer .submissionCompany{ font-weight: bold;font-size: 14px;} .submissionListContainer .readMore { font-weight: bold; font-size: 14px; float: right; margin-top: 12px; } .submissionListContainer .submissionVotes { position: relative; padding-left: 30px; font-weight: bold; font-size: 14px; } .submissionListContainer .submissionVotes:before { font-size: 15px; position: absolute; left: 10px; top: 3px; content: "M"; font-family: 'ilmarinen-iconfont'; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; padding-bottom: 0px; } .Suomi100IdeaSpotlight { padding: 0px 30px; } .Suomi100IdeaSpotlight .Suomi100IdeaSpotlightLink { clear: both; padding-top: 15px; } .Suomi100IdeaSpotlight .Suomi100IdeaSpotlightLink .facelift-button { float: right; } .submissionListContainer .submissionImageContainer { height: 315px; position: relative; overflow: hidden; } .submissionImageContainer .palkittu { position: absolute; top: 20px; left: -45px; padding: 0px 50px; width: auto; color: #FFF; background-color: #00274b; text-align: center; transform: rotateZ(-45deg); z-index: 1000; text-transform: uppercase; font-size: 14px; font-weight: normal; } .submissionListContainer .submissionImageContainer .submissionImage{ top: 0; position: absolute; width: 100%; height: 315px; background-size: cover; background-position: center; z-index: 999; } .submissionListContainer .submissionImageContainer .submissionOverlay { position: absolute; top: 0; left: 0; width: 100%; height: 315px; z-index: 1001; } .submissionListContainer .submissionTextContainer span, .submissionListContainer .submissionTextContainer a { color: #00274b; } .submissionListContainer .submissionTextContainer { padding: 25px 15px; } .submissionListContainer .submissionTextContainer h4 { margin-top: 0; } .submissionListContainer .submissionTextContainer .submissionOverview { height: 65px; padding-bottom: 5px; position: relative; overflow: hidden; color: #00274b; font-weight: bold; font-size: 16px; } .submissionListContainer .submissionTextContainer .submissionOverview:after { content: ""; height: 35px; width: 100%; position: absolute; bottom: 0; left: 0; background: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */ } .submitSuomi100Idea , #Suomi100SubmissionForm, .submitSuomi100Idea div[class^="span"]{ background-color: #d8f1f6; } .submitSuomi100Idea .submitSuomi100Idea-title { color: #FFF; background-color: #00274b; } .submitSuomi100Idea .accordion-heading { color: #fff; background-color: #00274b; } .submitSuomi100Idea.accordion{ border-bottom: none; } .submitSuomi100Idea .accordion-title {margin: 0; position: relative;} .submitSuomi100Idea .accordion-title a{ color: #FFF !important;} .submitSuomi100Idea .accordion-heading a.collapsed .arrowDown { background-color: #00274b; padding: 22px 30px; float: right; position: absolute; top: 0; right: 0; display: inline-block; } .submitSuomi100Idea .ui-state-active .accordion-title a span.arrowDown:before { content: "g"; } .submitSuomi100Idea .ui-state-active .accordion-title a span.arrowDown{ display: inline-block; } .submitSuomi100Idea .ui-state-active .accordion-title a span.arrowDown:before { content: "h"; } #Suomi100SubmissionForm { padding: 30px 15px; } #Suomi100SubmissionForm .idea-row{ margin-bottom: 30px; } #Suomi100SubmissionForm .left-panel { padding-right: 15px; } #Suomi100SubmissionForm .right-panel { padding-left: 15px; } #Suomi100SubmissionForm textarea, #Suomi100SubmissionForm input[type=text] { background-color: #FFF; border: none; padding: 5px; color: #00274b; box-sizing: border-box; } #Suomi100SubmissionForm input[type=file] { background-color: #FFF; } #Suomi100SubmissionForm textarea { padding: 5px; height: auto; box-shadow: none; border-radius: 0; color: #00274b; } #Suomi100SubmissionForm textarea#idea-description { height: 268px; } #Suomi100SubmissionForm input[type=submit] { outline: none; box-shadow: none; border: none; } #Suomi100SubmissionForm .formField label{ display: block; margin: 0; padding: 0; text-align: left; text-transform: uppercase; width: auto; margin-bottom: 5px; max-height: 20px; } #Suomi100SubmissionForm .formField label .tooltip { background-color: #00274b; color: #FFF; padding: 5px; font-size: 12px; font-weight: lighter; border-radius: 3px; } #Suomi100SubmissionForm .formField label .inputTooltip { font-family: "ilmarinen-iconfont"; padding-right: 15px; text-transform: none; } #Suomi100SubmissionForm .formField label .inputTooltip:hover { font-family: "ilmarinen-iconfont"; text-decoration: none; } #Suomi100SubmissionForm .suomi100RulesLinks { width: 20%; float: left; margin-left: 51%; } #Suomi100SubmissionForm .submit-container { width: 26.5%; float: right; } #Suomi100SubmissionForm .submit-container .formField { margin: 0; } #Suomi100SubmissionForm .formField .controls{ margin: 0;color: #00274b;} #Suomi100SubmissionForm .formField .controls.youtubeControl{ display: block;width: 100%; clear: both;} #Suomi100SubmissionForm .formField .controls.youtubeControl input{ display: block;width: 100%;} #Suomi100SubmissionForm .formField .controls.youtubeControl input::-webkit-input-placeholder{/* Modern webkit */color: #00274b; color: rgba(0, 39, 75, 0.5);} #Suomi100SubmissionForm .formField .controls.youtubeControl input:-ms-input-placeholder { /* Internet Explorer 10-11 */color: #00274b; color: rgba(0, 39, 75, 0.5);} #Suomi100SubmissionForm .formField .controls input, #Suomi100SubmissionForm .formField .controls textarea { display: block; width: 100%; } #Suomi100SubmissionForm .submit-container input.facelift-button{ width: auto; float: right; } .suomi100RulesLinks { display: block; text-align: right; margin-top: 10px; } #Suomi100SubmissionForm .suomi100TocLink, #Suomi100SubmissionForm .suomi100RegistryLink { font-size: 18px; margin-right: 25px; line-height: 20px; display: inline; font-family: Arial, verdana; color: #00274b; text-align: right; font-weight: bold; font-size: 14px; } #Suomi100SubmissionForm .suomi100TocLink:after, #Suomi100SubmissionForm .suomi100RegistryLink:after { content: "\00a0\203A"; } #suomi100-submission-thankyou, #suomi100-submission-error { padding: 30px 15px; } #suomi100-submission-error p { font-size: 16px; line-height: 20px; color: #d83b51 !important; font-family: arial; list-style: none !important; margin-left: 0 !important; padding-left: 0 !important; } /* ---------- Parempi Vire and SelfEmployedInsuranceOrderBlock ------------------- */ /* valmentamo block and RegisterUnitaito blocks */ #registerUnitaitoForm, #vmoForm, .parempiVireBlock, #parempiVireBlockSubmissionForm, .parempiVireBlock div[class^="span"], .selfEmployedInsuranceOrderBlock, #selfEmployedInsuranceOrderForm, .selfEmployedInsuranceOrderBlock div[class^="span"]{ background-color: #d8f1f6; } .parempiVireBlock .parempiVireBlock-title, .selfEmployedInsuranceOrderBlock .selfEmployedInsuranceOrderBlock-title { color: #FFF; background-color: #00274b; padding: 20px; text-transform: uppercase; } #registerUnitaitoForm, #vmoForm, #parempiVireBlockSubmissionForm, #selfEmployedInsuranceOrderForm { padding: 30px 15px; } #registerUnitaitoForm .left-panel, #vmoForm .left-panel, #parempiVireBlockSubmissionForm .left-panel, #selfEmployedInsuranceOrderForm .left-panel { padding-right: 15px; } #registerUnitaitoForm .right-panel, #vmoForm .right-panel, #parempiVireBlockSubmissionForm .right-panel, #selfEmployedInsuranceOrderForm .right-panel { padding-left: 15px; } #registerUnitaitoForm textarea, #registerUnitaitoForm input[type=text], #vmoForm textarea, #vmoForm input[type=text], #parempiVireBlockSubmissionForm textarea, #parempiVireBlockSubmissionForm input[type=text], #selfEmployedInsuranceOrderForm textarea, #selfEmployedInsuranceOrderForm input[type=text], #selfEmployedInsuranceOrderForm select { background-color: #FFF; border: none; padding: 5px; color: #00274b; box-sizing: border-box; } /*#parempiVireBlockSubmissionForm textarea, #selfEmployedInsuranceOrderForm textarea { padding: 5px; height: auto; box-shadow: none; border-radius: 0; color: #00274b; }*/ #registerUnitaitoForm input[type=submit], #vmoForm input[type=submit], #parempiVireBlockSubmissionForm input[type=submit], #selfEmployedInsuranceOrderForm input[type=submit] { outline: none; box-shadow: none; border: none; } #registerUnitaitoForm .formField label, #vmoForm .formField label, #parempiVireBlockSubmissionForm .formField label, #selfEmployedInsuranceOrderForm .formField label { display: block; margin: 0; padding: 0; text-align: left; text-transform: uppercase; width: auto; margin-bottom: 5px; max-height: 20px; } #registerUnitaitoForm .submit-container, #vmoForm .submit-container, #parempiVireBlockSubmissionForm .submit-container, #selfEmployedInsuranceOrderForm .submit-container { float: right; } #registerUnitaitoForm .submit-container .formField, #vmoForm .submit-container .formField, #parempiVireBlockSubmissionForm .submit-container .formField, #selfEmployedInsuranceOrderForm .submit-container .formField { margin: 0; } #registerUnitaitoForm .formField .controls, #vmoForm .formField .controls, #parempiVireBlockSubmissionForm .formField .controls, #selfEmployedInsuranceOrderForm .formField .controls { margin: 0;color: #00274b; } #vmoForm .formField .controls input, #vmoForm .formField .controls textarea, #registerUnitaitoForm .formField .controls input, #registerUnitaitoForm .formField .controls textarea, #parempiVireBlockSubmissionForm .formField .controls input, #parempiVireBlockSubmissionForm .formField .controls textarea, #parempiVireBlockSubmissionForm .formField .controls select, #selfEmployedInsuranceOrderForm .formField .controls input, #selfEmployedInsuranceOrderForm .formField .controls textarea, #selfEmployedInsuranceOrderForm .formField .controls select { display: block; width: 100%; } #parempiVireBlockSubmissionForm .formField .controls.pvradiogrp { margin-bottom: 20px; } .pvradiogrp, .pvradiolabel { float:left; clear:none; } #selfEmployedInsuranceOrderForm .formField p.labor-income-notification { font-size:16px; margin-bottom:0px; } #parempiVireBlockSubmissionForm .formField .controls input[type=radio], #selfEmployedInsuranceOrderForm .formField .controls input[type=radio], input.pvradio { float: left; clear: none; width: auto; margin-right: 10px; vertical-align: middle; height: 20px; } #parempiVireBlockSubmissionForm .formField .pvheadinglabel, #selfEmployedInsuranceOrderForm .formField .pvheadinglabel { text-transform: uppercase; font-size: 18px; line-height: 20px; font-family: 'HelveticaNeueW01-75Bold', Arial, verdana; margin-top: 0px; } #uni-error p, #vmo-submit-error p, #pv-submission-error p { font-size: 16px; line-height: 20px; color: #d83b51 !important; font-family: arial; list-style: none !important; margin-left: 0 !important; padding-left: 0 !important; } .row div.submitResultMessage { padding: 0px 20px 0px 20px; } /* ---------- End of Parempi Vire and SelfEmployedInsuranceOrderBlock ------------------- */ /* -------------------------------------------------------------------------------------------------------------------- ---------------------------------------------- responsive rules for smaller desktop and wide tablet -------------------------------------- ------------------------------------------------------------------------------------------------------------------------*/ @media screen and (max-width:1279px) { /* --------- general rules --------*/ .touch a:hover {text-decoration:none !important;} /*underline not needed in mobile*/ iframe {max-width:100%;} .subpageContentArea li, .highlightBlock li, .accordion li, .sectionContentPage li, .sesctionBlock li, .threeColumnBlock li, .twoColumnBlock li, .processStepBlock li, .twoRowBlock li {line-height:20px; font-size:15px;} /* --------- grid rules --------*/ #contentWrapper { } .row { width: 100%; } header .row, footer .row { } .row .row { width: 100%; } .row .mainBody { padding: 15px 20px 20px; } .row .sidebar { padding: 0 0 15px; } /*columns padding*/ .pageHelpLinkBlock, .processStepBlock, .sectionDropdown, .newsHighlightBlock, .frontpageBottomArea .newsHighlightBlock, .highlightText, .customerEventBlock, .threeColumnBlock, .processThreeStepBlock, .colpadding, .row [class*="span"].colpadding, .white .twoColumnBlock .span6 { padding: 20px; } .highlightText {padding-bottom:0;} .row.breadcrumb { padding: 20px; } /*section content page*/ .sectionContentPage .span12 {padding:0 20px;} .sectionContentPage .span12 h1:first-child, .sectionContentPage .span12 h2:first-child, .sectionContentPage .span12 h3:first-child, .sectionContentPage .span12 p:first-child {padding-top:20px;} /* mainContent in mainBody*/ .mainBody .mainContent { margin: 0 -20px -20px; } /*logo and mainnav*/ .languageWrapper.dropdown { right: 118px; } .sb-search { right: 68px; } .navLangWrapper { margin-left: 40px; } .mainnav li a { font-size: 14px; padding: 17px 7px 9px; } /* search */ .sb-search-input, .sb-search-submit { visibility: hidden; overflow: hidden; } .sb-search { width: 38px; transition: width 0.2s ease-out; -webkit-transition: width 0.2s ease-out; -moz-transition: width 0.2s ease-out; } .open.sb-search { transition: width 0.2s ease-out; -webkit-transition: width 0.2s ease-out; -moz-transition: width 0.2s ease-out; width: 240px; } .open .sb-search-input, .open .sb-search-submit { visibility: visible; } .sectionNav li a, .shortcutLinks li a {padding-left:20px;} /*process step block*/ .row .processItem [class*="span"] { padding: 20px 20px 5px 20px; } .processItem .btn, .processItem .btnlightblue, .processItem .btndarkblue { padding: 16px 20px; } /*Three column block*/ .threeColumnBlock li a {font-size:18px; line-height: 30px;} /*highlightblock*/ .highlightBlock .highlightText {width:auto;} .countdownBlock .countdown-container { margin-bottom: 15px;} /*main image*/ .topContentArea {top: 13%; } .mainImage a.btn {font-size: 14px; padding: 10px 15px;} .frontpage .topContentArea { top: 0;} .frontpage .topContentArea h1 {font-size: 32px;line-height: 34px;} .topContentArea {max-width:570px; font-size:20px; line-height:22px;} .topContentArea h1 {margin-bottom:10px;} .topHighlightContentArea {right:20px;} /*linklistblock*/ .row.linkListBlock [class*="span"] > div {padding:22px 20px 20px 20px;} .row.linkListBlock h3 { font-size:24px;} .row.linkListBlock p { font-size:15px;} .linkListBlock .iconArrowRight {font-size:36px; position:absolute; top: 30px; right:12px; } .linkListBlock .white { border-left: 3px solid #00274b; margin-bottom: 10px;border-right: none; } /*practical block*/ .practicalBoxes [class*="span"] div {padding: 10px 10px 10px 25px; font-size:22px; line-height:22px; } /*tabs navigation*/ .tabNavigation li a{font-size:20px; } /*Section block*/ .sectionBlock .span8 {min-width:0;} /*year calendar block*/ .yearCalSingleBlock[class*="span"] { padding: 0 5px; } /*social blocks*/ .span6 .slideshare, .span6 .youtubeBlock {height: 450px; overflow:hidden;} .slideshareWidget iframe {} .slideshareWidget iframe + div {float:none; width:100%; margin-left:0;} .social h4 {font-size:19px;} .social a.btn {left:20px; width: 80%;} /*.facebookBlock .socialContent.colpadding {padding-left:0;}*/ /*latest news block*/ .latestNewsBlock .span4 {padding: 0px 5px 10px 20px;} a.rss {top:13px; right:10px;} .newsArchive .rss {top:30px; right:30px;} /*calculator*/ .calculator .result-row.indent div:first-child {font-size:15px; line-height:17px;} .result-entrepreneur {font-size:21px;} .calculator h2.accordion-title{ font-size: 30px; line-height: 35px; font-weight: 500; margin: 20px 0 15px; display: block; } .accordion.calculator .ui-state-active h2.accordion-title a span.arrowDown { top: 20px; font-size: 30px; } .calculator.employer .accordion-heading h2.accordion-title a.collapsed .arrowDown { top: 20px; font-size: 30px; } /*newsroom highlight block*/ .newsroomHighlightsBlock img { max-height: 50px; top:34px;} /* Frontpage link lift (New block in facelift) */ .FrontPageLinkLiftBlock { padding: 30px 15px; } .FrontPageLinkLiftBlock h2{ display: inline-block;max-width: 80%;margin: 0; font-size: 30px;} .FrontPageLinkLiftBlock .link{ display: inline-block;width: 20%; margin: 0; float: right; } .FrontPageLinkLiftBlock .link a{ padding: 6px 12px; font-size: 16px; line-height: 45px;} /* Highlight block with link and icon */ /* sizes... */ .span4 > .HighlightWithLinkAndIconBlock { height: 100px;} .span4 > .HighlightWithLinkAndIconBlock .link-container {position: absolute;bottom: 5px;right: 5px;display: block;} .span4 > .HighlightWithLinkAndIconBlock .textContent h2 {font-size: 20px;padding-left: 30px;padding-top: 10px;padding-right: 0px;} .span4 > .HighlightWithLinkAndIconBlock .icon-container { display: none;} .span6 .HighlightWithLinkAndIconBlock .textContent h2 {font-size: 20px;padding-left: 30px;padding-top: 32px;padding-right: 30px;} .header-infobar {padding: 5px;} } @media screen and (max-width:1024px) { .retirementQuestion input{ float: left;margin: 4px; clear: both;} .retirementQuestion label{ min-height: 18px; } } /* -------------------------------------------------------------------------------------------------------------------- ---------------------------------------------- responsive rules for portrait tablets -------------------------------------- ------------------------------------------------------------------------------------------------------------------------*/ @media screen and (max-width:959px){ /* ------------------ utility classes for easy hiding on certain device -----------------*/ .hidden-desktop{display:inherit !important;} .visible-desktop{display:none !important ;} .visible-tablet{display:inherit !important;} .hidden-tablet{display:none !important;} /* ------ grid rules --------*/ .row.linkListBlock [class*="span"],.row.linkListBlock [class*="span"]:first-child, .row .processItem [class*="span"], .row.frontpageBottomArea .span6, .processThreeStepBlock [class*="span"], .calculator [class*="span"], .pageHelpLinkBlock .span4, .row.mainContentArea .span4, .row.mainContentArea .span4:first-child, .row.newsroomHighlightsBlock [class*="span"], .row.sectionBlock [class*="span"], .row.mainContentArea .span12 + .span4, .sectionBlock .span8 + .span4, .latestNewsBlock [class*="span"], .pageHelpLinkBlock .row .span4:first-child {float:none;display:block;width:100%; clear:both; margin-left:0; } .mainImage + #contentWrapper {margin-top:0px; margin-top:0; border:0;} .mainImage.noShow {height: 65px !important; min-height: 65px !important;} /* ------ reset equal heights --------*/ .linkListBlock [class*="span"], .row.frontpageBottomArea .span6, .sectionBlock [class*="span"], .latestNewsBlock [class*="span"] { height: auto !important; } /*header*/ .sb-search {top:10px; overflow: hidden;} .languageWrapper.dropdown {top:14px;} /* mobile navigation */ .navLangWrapper {margin-left:0; float:none;} .mainnav {background-color:#00274b; position:absolute; top:50px; left:0; z-index:2; margin-left:0; padding-left:0px; width: 50%; padding-bottom:10px;} .mainnav li {float:none; display:block; margin:0; line-height:20px;position: relative; clear: both;border-top: 1px solid #124667; padding: 4px 0;} .mainnav li:first-child {border-top: none;} .mainnav li.separator {display:none;} .mainnav li a {display:block; float:none; font-size:18px; padding: 5px 10px; text-transform:none; font-family: Arial; color:#fff;} .mainnav li a:hover {color:#fff !important; } .mainnav li.active a {border-bottom:0 !important;} /* Megamenu mobile */ .megamenu{ display: block; } .megamenu-section-title{ padding-right: 25px;position: relative; } .megamenu-section-title .expand-mobile-submenu{ position: absolute;right: 10px; } .megamenu-section:last-child {float: none;border-right: none;padding-right: 0px;padding-left: 0px;} .megamenu-section:nth-child(2):after,.megamenu-section:nth-child(1):after { display: none;visibility: hidden;} .megamenu-section li, .megamenu-section li a, .megamenu-utilities-section li a, .megamenu-utilities-section li { width: 100%; padding: 0; margin: 0; color: #fff; } .megamenu.active { display: none; } .megamenu.mobile-active {display: block;} .flipArrow.arrowDown:before {content: "\68";} .arrowDown:before { font-size: 24px;} .megamenu { padding-left: 20px; position: static; padding-top: 0; padding-bottom: 0; width: 100%; min-height: 0; background-color: #00274b; } .megamenu-section li{margin: 10px 0;border-top: none;} .megamenu-section li a{font-family: 'HelveticaNeueW01-45Ligh', Arial;} .megamenu-section li.megamenu-section-title span{font-family: Arial;} .megamenu-section li.megamenu-section-title span.arrowDown{font-family: 'ilmarinen-iconfont';} .megamenu-section li{ padding-left:7px;} .megamenu-section li.megamenu-section-title{ padding-left: 0px;} .megamenu-section li span, .megamenu-section li a { display: block; float: none; font-size: 18px; line-height: 20px; padding: 0px; text-transform: none; font-weight: normal; color: #fff; } .megamenu-section li span { font-size: 18px; } .mainnav > li.active .megamenu-section a { color: #fff; } .megamenu-section li {display: none;} .megamenu-section li.megamenu-section-title {display: block;} .megamenu-section-active.megamenu-section li {display: block;} ul.megamenu-utilities-section { display: none; } .expand-mobile-submenu { display: inline; position: absolute; right: 0; top: 0; color: #fff; font-size: 28px; padding: 5px; vertical-align: middle; } .megamenu-section { width: 100%; padding: 0; margin: 0; float: none; } .topContentArea { padding-right: 0px; } .topContentArea a.darkblue-btn { position: static; } /* News list with manual lift */ .latestNewsBlockWithManualLift > .span8 { width: 100%; } .latestNewsBlockWithManualLift .manualLiftImage { width: 100%; } .row.social {/*float:left; width: 33.3%;*/ border-left: none; } /* attachmentArea in mainBody*/ .mainBody .mainContent { margin: 0 -20px -20px;} .mainBody .attachmentArea {display:block; } .mainBody .attachmentArea a {display:block; padding-bottom:20px;} /*subpage & sidebar*/ .white .twoColumnBlock p, .ingress, .subpageContentArea .ingress {font-size:20px; line-height:24px;} .white .tykyIngress .twoColumnBlock p, .white .tab-content .twoColumnBlock p {font-size:15px; line-height:20px;} .rightSideNavigation h4 {margin-top:28px; margin-left:20px;} .row .relatedContent {padding: 0px 10px;} .BasicContentPage .row .relatedContent {padding: 20px 10px;} /*subnav*/ ul.submenu {margin-left:0; margin-top:20px;} ul.submenu li { margin:0 10px;} ul.submenu li a{padding:14px 10px; line-height:20px; } ul.submenu li.active a { padding-left:20px;} /*asiointi*/ .workingarea .col-lg-12 {padding-left:0; padding-right:0;} /*sectionNav*/ .sectionNav li a { padding: 0px 10px 0px 20px; height:70px; font-size:18px; line-height:22px; } /*shortcut links*/ .shortcutLinks .iconArrowRight {display:inline-block; position:absolute; top: 20px; right: 20px; font-size:18px; } .shortcutLinks ul {margin-bottom:0;} .shortcutLinks li {border-left:0; border-top:2px solid #2e7996;width:100%;float:none; clear:both; position:relative; } .shortcutLinks li a { height:55px; padding: 0px 10px 0px 20px; border:0;} .shortcutLinks li:first-child {width:100%; border-top:0;} /*tabs navigation*/ .tabNavigation li {width:47.5%;} .tabNavigation li a{font-size:18px; } /* .section dropdown */ .sectionSelection { margin-top:20px;display: block; clear:both; width:100%; -webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box; } .sectionSelection .dropdown-menu { width:100%; -webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;} /* countdown block */ .countdownBlock .countdown-readmore { bottom: 5px; } /*process step block*/ .processItemNumber {height: 62px; width:8%; } .processItemNumber [class*="icon"] { font-size:42px; padding-top:10px;} .processItemNumber + .processItem {width:92%; } /*process three step block*/ .processThreeStepBlock .span12 {text-align:center;} .processThreeStepBlock .span4 { padding-right:0; padding-left:0; } .processThreeStepBlock img {max-width: 70px;} .processThreeStepBlock .iconArrowRight { position:static; margin:0 auto; font-size: 40px; text-align:center; position: relative; top:0px; right:auto; } .processThreeStepBlock .iconArrowRight:before {content: "\67";} /*three column block*/ .threeColumnBlock a.btn, .threeColumnBlock a.btndarkblue, .threeColumnBlock a.btnlightblue{ width:auto; width: 100%; display:block; padding: 10px 38px; -webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;} .threeColumnBlock .span4, .threeColumnBlock .span4:first-child, .row.mainContentArea .threeColumnBlock .span4{ width: 100%; padding:0; clear:none; display:block; } .threeColumnBlock li a { font-size:15px; line-height:18px; } .threeColumnBlock .span4 li {margin-bottom:5px;} .threeColumnBlock .span4 ul {margin-bottom:0;} .threeColumnBlock .span4:last-child {padding-bottom:0px;} /* Epi forms mobile styles */ .EPiServerForms .Form__Element .FormTextbox, .EPiServerForms .Form__Element .FormSelection { width: 100%; padding-right: 20px; padding-left: 20px; display: inline-block; float: none; } /*frontpage bottom block colouring*/ .row.frontpageBottomArea .span6:nth-child(2), .row.frontpageBottomArea .span6:nth-child(3), .row.frontpageBottomArea .span6:nth-child(6), .row.frontpageBottomArea .span6:nth-child(6), .row.frontpageBottomArea .span6:nth-child(2) .highlightBlock, .row.frontpageBottomArea .span6:nth-child(3) .highlightBlock, .row.frontpageBottomArea .span6:nth-child(6) .highlightBlock, .row.frontpageBottomArea .span6:nth-child(6) .highlightBlock {background-color:#fff;} .row.frontpageBottomArea .span6:nth-child(even) , .row.frontpageBottomArea .span6:nth-child(even) .highlightBlock {background-color:#f2f2f2;} /*main image*/ .mainImage + #contentWrapper {margin-top:0px; } .mainImage.frontpage + #contentWrapper {margin-top:0px; } .videoContentArea {bottom:38px; right:20px; width: 300px; font-size: 20px; line-height:22px; } .frontpage .videoContentArea {bottom:20px;} .videoContentArea .iconPlay {font-size:70px;} .topContentArea {left:20px; max-width:490px; font-size:16px; line-height:20px; margin-top: 15px; padding-right: 60px;} .topContentArea a.video-actication-button { right: 0px;font-size: 50px;} .topContentArea p {max-width: 390px;} /*linklistblock*/ .row.linkListBlock [class*="span"] > div {padding:32px 40px 10px 40px;} .row.linkListBlock h3 {display:inline-block; width: 100%;} .row.linkListBlock p {display:inline-block; width: 100%; } .links {display:none;} .linkListBlock .iconArrowRight {font-size:23px; position:absolute; top: 34px; right:32px; } /*page help link block*/ .pageHelpLinkBlock .span4:first-child h4 {padding-top: 10px;} .pageHelpLinkBlock h4 {padding-top:30px;} .pageLink {width: 49%; padding:22px 5px 8px 20px; float:left; margin: 0 1% 4px 0; height: 67px; line-height:18px; -webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;} /* highlight block */ .highlightBlock div.imagealignright, .highlightBlock div.imagealignleft {width:240px; } /*sectionBlock*/ .sectionBlock {display:block;} /*practical block*/ .practicalContent > .span6 {float:none; width:100%; } .practicalBoxes {display:table; width:100%;} .practicalBoxes .span6 {height: 100%; display:table-cell;} .practicalBoxes .span6 div {display:block; min-height: 80px; padding: 15px;} /* monthly calculator 09/2016 */ .employer.monthly input:not([type="radio"]) { width: 80%; } .employer.monthly select { width: 90%; } .employer.monthly .calculatorContent .span6 .calculatorForm { text-align: left; height: 700px; } .employer.monthly .span6 + .span6 .calcTitle2 { text-align: center; margin-top: 15px; } .employer.monthly .result-pct, .employer.monthly .result-avg, .employer.monthly .result-sum { text-align: center;; padding-right: 0; } .employer.monthly .monthCalcGrid { padding-right: 0; } .employer.monthly .monthCalcGrid li { width: 100%; } .employer.monthly .monthCalcGrid span { font-size: 14px; } .employer.monthly .monthCalcGrid button { font-size: 14px; } /*year calendar block*/ @media (max-width: 955px) { .yearCalSingleBlock[class*="col-md-3"] { float: none; padding: 0 0 0 50px; position: relative; text-align: left; width: 100%; } .yearCalSingleBlock[class*="col-md-3"]:first-child { padding-top: 10px; } .yearCalSingleBlock[class*="col-md-3"]:last-child { padding-bottom: 22px; } .yearCalSingleBlock[class*="col-md-3"]:first-child .yearCalIcon { top: 25px; } .yearCalSingleBlock[class*="col-md-3"]:first-child .lineGraphic .dottedLine, .yearCalSingleBlock[class*="col-md-3"]:last-child .lineGraphic .dottedLine { background-color: #fff; border-left: 4px dotted #00274b; border-right: 0 none; border-top: 0 none; display: block; height: 22px; margin-left: 0; position: relative; top: 0; width: 4px; } .yearCalSingleBlock[class*="col-md-3"]:last-child .lineGraphic .dottedLine { border-bottom: 0 none; border-top: 0 none; bottom: -2px; height: 22px; left: 0; margin-left: 0; position: absolute; top: auto; width: 4px; } } .yearCalSingleBlock[class*="span"] { padding: 0 0 0 50px; float:none; width:100%; text-align:left; position: relative;} .yearCalSingleBlock[class*="span"]:first-child { padding-top: 10px;} .yearCalSingleBlock[class*="span"]:last-child { padding-bottom: 22px;} .yearCalSingleBlock[class*="span"]:first-child .yearCalIcon{ top: 25px;} .titleContainer {height:auto; position:static;} .yearCalSingleBlock h5 {height: auto; position:static; margin-top:10px;} .yearCalIcon {position: absolute; left:10px; top:15px; height:30px;} .editable .yearCalIcon {top: 10px;} .yearCalSingleBlock .box {text-align:center; width:30px; height:30px; } .yearCalSingleBlock [class*="icon"] {font-size:18px; display:inline-block; padding-top:3px;} p.yearAnnouncementText {min-height:0px; margin-bottom:2px; } .yearCalBoxWrapper {padding: 5px; z-index:0; position:static; } .editable .yearCalBoxWrapper {margin-left: -50px; padding: 2px 5px 2px 50px; position: relative; } .lineGraphic {top:0; height:100%; width: 4px; left: 23px;} .yearCalSingleBlock[class*="span"]:first-child .lineGraphic .dottedLine, .yearCalSingleBlock[class*="span"]:last-child .lineGraphic .dottedLine { position: relative; display: block; border-left: 4px dotted #00274b; border-right:0; height:22px; width: 4px; background-color: #fff; margin-left: 0px; border-top:0; top: 0px;} .yearCalendarBlock .yearCalSingleBlock[class*="span"]:last-child .lineGraphic .dottedLine {position: absolute; top: auto; bottom: -2px; left:0; height:22px; width: 4px; margin-left:0; border-top: 0; border-bottom: 0; border-right:0; border-left: 4px dotted #00274b; } /* youtube block*/ .youtubeBlock .row .span2 {padding:0 10px 10px 0; width:33.3%; } .youtubeBlock .row .span2:first-child {margin-left:0;} .span12 .youtubeBlock .row .span2:nth-child(4) {clear:left; margin-left:-10px;} .span6 .youtubeBlock .row .span2:first-child {margin-left:-10px;} /* social blocks*/ .row.social {float:none; width: 100%; height: auto !important; } .social [class*="icon"] {font-size:33px; top:-6px;} .social a.btn {display:inline-block; margin: 20px 0; padding: 16px; font-size:14px; bottom:0px;} .twitterBlock, .facebookBlock, .bloghighlight {height: auto; overflow: visible; clear:both;} .blogPersonImage {margin-left:-20px; width: 25%} .socialContent.colpadding {padding-bottom:90px;} .social h4 {font-size:18px;} .slideshareWidget {float:none; width: 100%; } /* calculator */ .calculator .accordion-heading a {padding-left:0;} .calculator.employer .accordion-heading a.collapsed .arrowDown { padding: 23px 30px 22px; } .result-row div[class^="result-"] { text-align: center;} .calculator h2 {margin-bottom:0;} .calculator.entrepren .calculatorForm {height:auto;} .calculatorContent .span6 .calculatorForm { padding-bottom:40px; background-color: #d8e8ed; text-align:center;} .entrepren .calculatorContent .span6 .calculatorForm {text-align:left;} .calculatorContent .span6 + .span6 .calculatorForm { padding-bottom:10px; padding-top:10px;} .calculatorContent .span6 + .span6 .calcTitle {background:#fff; text-align:center; color:#00274b; padding-top:20px;} .result-entrepreneur {padding-top:30px;} .entrepren .span6 + .span6 .calcTitle2 {text-align:center; margin-top:15px; } .result-entrepreneur {text-align:center; display:block; padding-bottom:20px;} .bigCalculator .calculatorContent .span6 .calculatorForm {text-align:left;} .bigCalculator a {font-size:0.9em;} .bigCalculator .result-entrepreneur {text-align:left;} .height50 .span6 {padding-bottom:0;} .result-ilmarinen {padding-bottom:20px;} .bigCalculator .calculator button { margin-left:0; padding: 9px 80px; display:block; margin-top:20px;} .calculator .result-row .span6:first-child { width: 100%;} .calculator .result-row .span6:last-child { width: 100%;} /* newsroom highlight block*/ .newsroomHighlightsBlock [class*="span"]{ padding: 20px; } .newsroomHighlightsBlock h4 { height: auto; } .newsroomHighlightsBlock a { height: auto; display:block; } .newsroomHighlightsBlock img { max-height: 40px; top: 10px; right: 20px;} .sectionHighlightBlock div.textContent {position:absolute; top: 0px; left:20px;} /*latest news block*/ .latestNewsBlock .span4 {padding: 5px 5px 20px 20px;} .latestNewsBlock .liftUpItem {padding:10px 20px;} .latestNewsBlock .liftUp img {width:100%;} a.rss {top:20px; right:20px;} .newsArchive .rss {top:30px; right:30px;} /*forms*/ .controls {margin-left:0px;} label {font-size:16px; line-height: 18px; display:block; width: 100%; text-align:left; float:none; margin-bottom: 5px;} .calculator label {display:inline-block;} /*welcome modal*/ .modal.modal-message .modal-body {font-size: 20px; } /*tyky*/ .spynavBlock {margin-top:30px;} .numberWrapper { font-size:30px; } .spynav li a {font-size:13px; padding: 6px;} .tykyTabs .nav li a { min-width: 100px;padding: 10px 10px;} /* Frontpage link lift (New block in facelift) */ .FrontPageLinkLiftBlock { padding: 30px 15px; text-align: center; } .FrontPageLinkLiftBlock h2{ display: inline-block;max-width: 100%;margin: 0; font-size: 30px; font-size: 24px;} .FrontPageLinkLiftBlock .link{ display: inline-block;width: 100%; margin: 0; float: none; padding-top: 15px;} .FrontPageLinkLiftBlock .link a{ padding: 6px 12px; font-size: 16px; line-height: 45px;} .personnel-listing-page-wrapper .personnel-list .personnel-list-item /* Highlight block with link and icon */ /* sizes... */ .span12 > .HighlightWithLinkAndIconBlock { height: 150px; } .span6 > .HighlightWithLinkAndIconBlock { } .span4 > .HighlightWithLinkAndIconBlock { } .span12 > .HighlightWithLinkAndIconBlock .textContent h2 {font-size: 30px;line-height: 33px;font-weight: 700;padding-top: 42px;} .span6 > .HighlightWithLinkAndIconBlock .textContent h2 {font-size: 30px;line-height: 33px;font-weight: 700;padding-top: 42px;} .span4 > .HighlightWithLinkAndIconBlock .textContent h2 {font-size: 18px;line-height: 19px;font-weight: 700;padding-top: 23px; } .span12 > .HighlightWithLinkAndIconBlock .icon-container{ display: none; } .span6 > .HighlightWithLinkAndIconBlock .icon-container{ display: none; } .span4 > .HighlightWithLinkAndIconBlock .icon-container{ display: none; } .InsuranceInANutshellBlock > .nutshell-section-1,.InsuranceInANutshellBlock > .nutshell-section-3{ border-left: none; border-right: none;} /*Salary calculator */ .salary-calculator .bottom-panel { display: none !important; } .salary-calculator .bottom-panel.active { display: block !important; } .salary-calculator-details h3 { margin-bottom: 20px; } .salary-calculator .left-panel { width: 100% !important; border-right: 0; } .salary-calculator-details .detail-row.detail-highlight { margin-bottom: 15px; } .salary-calculator-details .detail-panels > .right-panel .salary-calculator-infobox { margin-top: 15px; padding: 15px; } .salary-calculator .right-panel { width: 100% !important; border-left: 0; } .salary-calculator-container .details-heading { margin-bottom: 30px; } .salary-calculator-container .detail-panels { display: block; } /* Sales personnel pages*/ .personnel-listing-page-wrapper .personnel-list .personnel-list-item .personnel-image{ max-width: 225px; max-height: 225px; height: auto; width: 100%; } } /* ------------------------------------------------------------------------------------------------------------------ ---------------------------------------------- responsive rules for phablets ------------------- ------------------------------------------------------------------------------------------------------------------------*/ @media screen and (max-width:739px){ a:hover {text-decoration:none !important;} /*underline not needed in mobile*/ .toggleMenu {display:block;} .mainnav {display:none;} /* -------- header --------------*/ .mainImage + #contentWrapper {margin-top:0px !important; } .mainImage.frontpage + #contentWrapper {margin-top:0px !important; } header { z-index:0; background-color: transparent; } .row.breadcrumb {padding: 10px; height:auto; overflow:visible; white-space: normal; text-overflow: clip;} /*logo and mainnav*/ .mainnav {padding-left:0;} .languageWrapper.dropdown {right:104px;} .sb-search {right:54px; overflow: hidden;} /* ------ grid rules --------*/ .row [class*="span"], .row .span4:first-child, .row .span2:first-child, .row.searchResultsHeader .span2:first-child, .col-sm-5ths {float:none;display:block; clear:both;width:100%;margin-left:0; } #contentWrapper {padding-right:10px; padding-left:10px; margin-top:0; } .row .mainBody {padding: 15px 10px; width:100%; clear:both; float:none; } .row .sidebar {padding:15px 0; width:100%; clear:both; float:none;} .row .sidebar .colpadding {padding-top:0; padding-bottom:0;} /*columns padding*/ .pageHelpLinkBlock, .processStepBlock, .sectionDropdown, .newsHighlightBlock, .frontpageBottomArea .newsHighlightBlock, .highlightText, .customerEventBlock, .threeColumnBlock, .processThreeStepBlock, .colpadding, .row [class*="span"].colpadding, .white .twoColumnBlock .span6 { padding: 20px 10px; } .highlightText {padding-bottom:0;} /*section content page*/ .sectionContentPage .span12 {padding:0px 10px;} .sectionContentPage .span12 h1:first-child, .sectionContentPage .span12 h2:first-child, .sectionContentPage .span12 h3:first-child, .sectionContentPage .span12 p:first-child {padding-top:10px;} /* ------ reset equal heights --------*/ /*.middleContentArea .span6, .newsArchive [class*="span"], .equalHeight [class*="span"], .customEqual { height: auto !important; }*/ /*asiointi log out link*/ header .preHeader .logout {font-size:10px; padding: 5px 4px;} header .userinfo {min-height:0;} /* ------ subpage --------*/ .white .twoColumnBlock p, .ingress, .subpageContentArea .ingress {font-size:19px; line-height:22px;} .twoColumnBlock .headerRow h1 {margin-bottom:0;} .rightSideNavigation h4 {margin-top:10px; margin-left:10px;} .relatedContent {padding: 0px 10px;} /* ------ submenu --------*/ ul.submenu {background-color:#fff; display:none; margin: -4px 10px 0 10px; border: 1px solid #5199b0; border-top:0; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px; } ul.submenu li.active {margin:0;} ul.submenu li.active a {background-color:#078299; color:#fff;} ul.submenu li {border-top: 1px solid #b2bec9; margin:0;} ul.submenu li.active a {padding:12px 10px; font-family: 'HelveticaNeueW01-75Bold', Arial; } ul.submenu li a {padding:12px 10px; font-family: Arial; } ul.submenu li a:hover {text-decoration:none;} .toggleSubMenu:link, .toggleSubMenu:visited, .toggleSubMenu:hover {font-family: Arial; color:#00274b; margin:0 10px; background-color:#fff;padding:8px 5px 7px 10px; border: 1px solid #5199b0; border-radius: 4px; } .toggleSubMenu.active {border-bottom:0; border-top-right-radius: 4px; border-top-left-radius: 4px; padding-bottom:10px;} .toggleSubMenu.active .arrowDown:before {content: "\68";} .activeSubMenuTitle {color:#00274b; width: 80%; display:inline-block; white-space: nowrap;overflow: hidden;text-overflow: ellipsis; line-height:23px;} .toggleSubMenu:hover {text-decoration:none;} .toggleSubMenu .arrowDown {float:right; border-left: 1px solid #b2bec9; padding:0 10px; line-height:27px; display:inline-block; color:#00274b;} /* mainContent in mainBody*/ .mainBody .mainContent { margin: 0 -10px -20px; } /*section nav*/ .sectionNav .arrowDown {display:inline-block; position:absolute; top: 20px; right: 20px; font-size:15px;} .sectionNav li.selected .arrowDown:before {content: "\68";} .sectionNav ul {margin-bottom:0;} .sectionNav li {width:100%;float:none; clear:both; position:relative; } .sectionNav li a {height:55px; padding-right:40px; padding-left:10px;font-size:16px; border-left:0;} .sectionNav li:last-child { left:0;} .sectionNav li:first-child {width:100%;} /*shortcut links*/ .shortcutLinks li a { font-size:16px; padding: 0px 10px 0px 10px;} /*tab navigation*/ #contentWrapper .row.tabNavigation { background-color:#eeeeee; padding: 10px 10px 0 10px; -webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;} .toggleTabs .arrowDown { float: right;margin-left: 10px;padding: 5px 10px 5px 30px;position: relative; top: -2px;} .tabNavWrapper {position:relative; } .tabNavigation .dropdown-toggle.open {border-bottom:0; border-bottom-left-radius: 0px; border-bottom-right-radius:0px;} .tabNavigation .dropdown-toggle.open .arrowDown:before {content: "\68"; } .tabNavigation .arrowDown {margin-left:10px; padding: 5px 10px 5px 30px; float:right; top: -2px; position:relative;} .tabNavigation .dropdown-toggle {background-color:#fff; text-transform :uppercase; font-family:'HelveticaNeueW01-75Bold', arial; display: block; border: 1px solid #078299; border-radius: 4px; padding:10px;} .tabNavigation ul { border: 1px solid #078299; border-top:0; border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; border-color: #078299; border-top: 0 none #078299; margin: 0; -webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box; width: 100%;display: none; z-index: 2; background-color: #ffffff; float: left; left: 0; list-style: none outside none; padding: 5px 0; margin-top:-3px; } .tabNavigation .dropdown-toggle.open + ul {display:block;} .tabNavigation ul li {background:#fff; border:none; float:none; display:block; width:100%; padding:0;} .tabNavigation ul li.selected {border:none;} .tabNavigation ul li a { display:block; text-align:left; font-size:14px; white-space: normal; line-height:18px; padding: 8px 10px; color: #00274b; font-family: "HelveticaNeueW01-45Ligh", Arial; } .tabNavigation ul li a:hover {background-color:#078299; color:#fff;} .tabNavigation ul li.active a {background-color:#078299; color:#fff;} /*process step block*/ .row .processItem [class*="span"] {padding:10px 10px 5px 10px; } .processItemWrapper {position:relative;} .processItemNumber {height: 50px; width: 50px; position:absolute; top:0; left:0; } .processItemNumber [class*="icon"] { font-size:28px; padding-top:10px;} .processItemNumber + .processItem {width:100%; } .processItemNumber + .processItem .span8 p:first-child, .processItemNumber + .processItem .span8 h4:first-child, .processItemNumber + .processItem .span8 h3:first-child {margin-left:55px; min-height:40px;} .processItemNumber + .processItem .span8 table.maksupaivat p:first-child {margin-left:0; min-height:0;} .processItemNumber + .processItem p ~ h4, .processItemNumber + .processItem p ~ h3 {margin-left:0px; min-height:0px;} /*highlightblock*/ .highlightBlock div.imagealignright, .highlightBlock div.imagealignleft {width:100%; display:block;} .highlightBlock, .highlightBlock .imagealignleft, .highlightBlock .imagealignright, .highlightBlock .highlightText { width:100%; display:block;} .highlightBlock .imagealignleft {padding-bottom:20px;} .highlightBlock .imagealignright {text-align:left;} .highlightBlock h3 {margin-bottom:15px;} /*two row block & one row block*/ .twoRowBlock [class*="icon"], .oneRowBlock [class*="icon"] { font-size:40px; } .twoRowBlock td:first-child, .oneRowBlock td:first-child {width:50px;} /*twocolumnblock*/ .twoColumnBlock .row {display:block;} .twoColumnBlock .row .span6 {display:block; clear:both; height:auto; width: 100%;} /*main image*/ .videoContentArea, .topContentArea p, .newCustomerButton.btn, .loginButton {display:none;} /*linklistblock*/ .row.linkListBlock [class*="span"] > div {padding:15px;} .row.linkListBlock h3 {font-size:18px; display:block;} .row.linkListBlock p {display:none;} .linkListBlock .iconArrowRight {font-size:20px; position:absolute; top: 18px; right:22px; } /*newshighlight block*/ .newsHighlightBlock .btn.newsroom, .newsHighlightBlock p {display:none;} .newsHighlightBlock h3 {margin-bottom:0;} /*customer Event Block*/ .customerEventBlock .eventDayBox { width:72px; display:none; } .customerEventBlock .eventContent { padding-left:0px;} .customerEventBlock .eventDay {font-size:26px;} .customerEventBlock .eventMonth {font-size: 10px;} .customerEventBlock .eventLocation, .customerEventBlock .eventTime {font-size:14px; } /*real estates block*/ #contentWrapper .realEstatesBlock .row .span4 {padding:0; width:100%; clear:both; float:left;padding-bottom:10px; background-color:transparent;} #contentWrapper .realEstatesBlock .row .span4:first-child {margin-left:0px; } .realEstatesAddress {min-height:20px;} .realEstatesAddressImgWrapper img {position:relative; width:90px; float:left; padding-right:10px;} .realEstatesAddressImgWrapper p {position:static; color:#00274b; font-size:13px; text-shadow: none;} .realEstatesDesc {margin-bottom:0;} /*page help link block*/ .pageHelpLinkBlock .span4 {position:relative;} .pageHelpLinkBlock h4 {font-size:16px;border-top: 1px solid #dddddd; padding-top:10px; padding-right:30px; margin:0; padding-bottom:10px;} .pageHelpLinkBlock span + div {display:none;} .pageHelpLinkBlock span.open + div {display:block;} .pageLink { width: 100%; padding:12px 5px 12px 15px; height:auto; float:none; margin: 0 0 4px 0; } .pageLink [class*="icon"] { font-size:23px;top:-3px; padding-right:13px; } .pageHelpLinkBlock .arrowDown {display:inline-block; position:absolute; top:5px; right:0px; padding: 10px 10px 10px 40px; cursor:pointer;} .pageHelpLinkBlock .arrowDown.open:before {content: "\68"; } .pageHelpLinkBlock.showmore .span4 .row div:nth-child(n+5) {display:block !important;} .pageHelpLinkBlock .showMoreLinks{display:none !important;} /*practical block*/ .practicalBoxes .span6 {display:block; float:none; width: 100%;} .practicalBoxes .span6 div {font-size:18px; line-height: 20px;} /* youtube block*/ .youtubeBlock.colpadding {padding-top:10px; padding-bottom:10px;} .youtubeBlock .row .span2 { padding:0 10px 0 0; float:left; clear:none; } .youtubeBlock h3 {margin-top:0; padding-bottom:0px; display:table-cell; font-size:18px; line-height:22px; cursor:pointer; } .youtubeBlock h3:hover {text-decoration:underline;} .open.youtubeBlock h3 {padding-bottom:20px;} .youtubeImageLink {display:inline-block;position: relative;} .youtubeContent {display:none;} .youtubeBlock.open .youtubeContent {display:block;} .span6 .youtubeBlock .row .span2:first-child {margin-left:0px;} .youtubeBlock .row .span2, .span6 .youtubeBlock .row .span2, .span6 .youtubeBlock .row .span2:nth-child(4), .span12 .youtubeBlock .row .span2:nth-child(4) {padding:0 0 30px 0; float:none; clear:both; text-align:center; width:100%; margin: 0 auto; } .youtubeBlock .row .span2:first-child {margin-left:auto;} /* slideshare block*/ .span6 .slideshare, .span6 .youtubeBlock {height:auto;} .slideshareHeader { cursor:pointer;} .slideshareHeader h3 {margin:0; display:table-cell; font-size:18px; line-height:22px; } .open .slideshareHeader {margin-bottom:20px;} .slideshare.colpadding {padding-top:10px; padding-bottom:10px;} .slideshareTitle, .slideshareWidget { display:none; } .open .slideshareWidget { display:block; clear:both; padding-top:10px; } .slideshareWidget iframe {width: 310px !important; max-height:271px;} /* social blocks */ .socialContent {display:none;} .blogPersonImage {margin-left:-10px; width: 40%;} .social [class*="icon"] {font-size:25px; top:-3px;} .social h4 {margin:0; padding-bottom:0px; display:table-cell; font-size:18px; line-height:22px; cursor:pointer; } .social a.btn { padding: 16px 5px;} .social h4 a {display:inline-block; } .social .arrowDown, .youtubeBlock .arrowDown, .slideshare .arrowDown {float:left; padding-right:10px; padding-top:1px; font-size:20px; cursor:pointer;} .facebookBlock .arrowDown, .bloghighlight .arrowDown, .youtubeBlock .arrowDown{color:#fff;} .social .open .arrowDown:before, .youtubeBlock.open .arrowDown:before, .slideshare.open .arrowDown:before {content: "\68";} .social .open + .socialContent {display: block;} .tab-content .socialContent {display:block;} .social .hidden-phone, .slideshare .hidden-phone {display:none !important;} /* Divider block */ .dividerBlock { padding-top: 10px;padding-bottom: 10px; } .dividerBlock .dividerBlockLine {margin: 10px 0; } /* highlightwithlink block*/ /* Frontpage linklift block */ .FrontPageLinkLiftBlock { padding: 10px 1px; } /* Highlight block with link and icon */ /* sizes... */ .span12 > .HighlightWithLinkAndIconBlock .textContent h2 { font-size: 30px;line-height: 54px;font-weight: 700;padding-top: 56px;} .span4 > .HighlightWithLinkAndIconBlock .textContent h2 {font-size: 18px;line-height: 19px;font-weight: 700;padding-top: 23px; } .span6 > .HighlightWithLinkAndIconBlock .textContent h2 {} /*search results */ .searchResults input[type="submit"] { width: 22%; } .searchResultsHeader h1 {padding-bottom:15px;} .foundResults {padding-top: 15px; margin-bottom:0; } /*calculator*/ .result-employee, .result-entrepreneur, .result-ilmarinen {font-size: 24px;} .calculator input[type="text"] {font-size:18px; text-align:right; width: 100px;} .currency {padding-left:5px;font-family: Arial;} .calculator button {display:block; font-size:15px; margin: 20px auto; } .calculatorContent .span6 .calculatorForm { padding-bottom:20px; } .calculatorContent .span6 + .span6 .calculatorForm { padding-bottom:10px; } #calculate-entrepreneur {margin: 20px 0 20px 0;} .calculatorContent {display:none;} .calculator .arrowDown {float:left; padding-right:10px; padding-top: 2px;} .calculator.open .calculatorContent {display:block;} .calculator.open .arrowDown:before {content: "\68";} .bigCalculator .calculatorContent {display:block;} /* monthly calculator 09/2016 */ .employer.monthly input:not([type="radio"]):not([type="checkbox"]) { width: 70%; } .employer.monthly select { font-size: 18px; } #contentWrapper .employer.monthly table { font-size: 14px; } #contentWrapper .employer.monthly th, #contentWrapper .employer.monthly td { padding: 3px 6px; } /* Salary calculator */ .salary-calculator .input-row .input-container { display: block; width: 100%; float: none; padding-right: 0px; box-sizing: border-box; } .salary-calculator .total-amount { margin-top: 10px; } .salary-calculator-details .left-panel { width: 100%; float: none; padding-right: 0; border-right: none; margin-bottom: 30px; } .salary-calculator-details .right-panel { width: 100%; float: none; padding-left: 0px; } .salary-calculator-details .detail-row.detail-highlight .detail-label { width: 50%; text-align: left; } /* Popup */ .popup-image-included .upper-content-text { position: static; } .ilmarinen-popup .popup-image { display: none; } .ilmarinen-popup .upper-content-text { padding: 25px; } .ilmarinen-popup .bottom-content { padding-left: 25px; padding-right: 25px; padding-top: 10px; } .ilmarinen-popup .popup-left-column { width: 100%; float: none; text-align: center; } .ilmarinen-popup .popup-mid-column { width: 100%; float: none; text-align: center; } .ilmarinen-popup .popup-right-column { width: 100%; float: none; text-align: center; } .ilmarinen-popup .ilmarinen-popup-foreground { top: 0; background-color: transparent; } .ilmarinen-popup .bottom-content { background-color: #FFF; } .ilmarinen-popup .ilmarinen-popup-background { padding: 10px; box-sizing: border-box; overflow: scroll; } /*contact card block*/ .contactCardBlock img {max-width: 100px;} .contactCardBlock ul {margin-top:0px;} /* newsroom highlight block*/ .newsroomHighlightsBlock [class*="span"] {padding: 10px;} .newsroomHighlightsBlock img { max-height: 25px; right:10px;} /* ilmarinen section highlight block*/ .sectionHighlightBlock{overflow:hidden;} .sectionHighlightBlock div.textContent {position:absolute; top: 0px; left:10px;} .sectionHighlightBlock img { max-height:250px; min-height:100px; max-width: none; min-width: 100%; width:auto; } /* latest news block*/ .latestNewsBlock .span4 {padding:1px 10px 10px;} .latestNewsBlock .liftUpItem {width:100%; padding:10px; position:static; background: rgba(0, 39, 75, 1);color: rgba(0, 39, 75, 1); color:#fff; } a.rss {top: 10px; right:10px;} /*news article % news archive page*/ .relatedLinks, .keywords {max-width:100%; width: 100%; float:none; display:block;margin-bottom:35px;} .keywords {margin-bottom:0;} .newsArchive .span8 { padding-right:10px;} .newsArchive .rss {top:20px; right:10px;} /*Events*/ .EventPage #contentWrapper, .EventListingPage #contentWrapper{ min-height: 0px; } /*welcome modal*/ .modal.modal-message .modal-body h1 {margin-bottom:20px;} .modal.modal-message .modal-body {font-size: 16px; } /*tyky*/ .row .col-sm-5ths { border-left: 0; border-bottom: 2px solid #cfcfcf; padding-top:20px; max-width: 300px; float:none; margin: 0 auto;} .row.pathColumnBlock .col-sm-5ths {border-bottom:0;} .fiveColumnBlock .col-sm-5ths p:first-child {min-height:0;} .spynav {padding-top:0;} .fixed.spynav {top:0; padding-top:0;} .spynavToggle, .spynavToggle:hover {display:block; text-align:left; cursor:pointer; padding:10px 20px; font-family:"HelveticaNeueW01-75Bold", arial; text-transform:uppercase; border-bottom: 2px solid #00274b; margin: 0 -10px; background-color:#fff; color:#00274b;} .spynav ul { text-align:left; } .spynav li {display:block; margin:0 -10px; padding:0;background:#fff; text-align:left;} .spynav li a{ padding:10px 20px 10px; display:block; border:0; border-bottom:1px solid #00274b; text-align:left;} .spynav li a:hover{color:#078299; background-color:#fff;border-color:#00274b;} .spynav li.active a:hover {color:#fff; background-color:#f7d8dc;border-color:#f7d8dc; text-decoration:none; } .tabmenuToggle .arrowDown {position:relative; top: 1px; left:5px;} .tabmenuToggle.active .arrowDown:before {content: "\68";} .tabmenuToggle, .tabmenuToggle:hover {display:block; text-align:left; cursor:pointer; padding:10px; font-family:"HelveticaNeueW01-75Bold", arial; border: 2px solid #cfcfcf; margin: 0; background-color:#fff; color:#00274b; text-transform: uppercase; font-size:16px;} .tykyTabs ul.nav {text-align:left; margin:-2px 0 0 0;} .tykyTabs .nav li { display:block; border: 2px solid #cfcfcf; border-bottom:0; border-top:0; margin:0;} .tykyTabs .nav li a{ display:block; min-width: 0; padding: 6px 10px 10px; border-bottom: 1px solid #cfcfcf} .tykyTabs .nav li a span {color:#00274b; font-size:25px; position:relative; bottom:-4px; display:inline-block; margin-bottom:0; margin-right:10px;} .tykyTabs .nav li a:hover{ text-decoration:none; } .tykyTabs .nav li.active {border-bottom:0;} .tykyTabs .nav li.active a { background-color: #d83b51; color:#fff; } .tykyTabs .tab-content { border: 2px solid #cfcfcf; border-top:0; padding:10px;} .tykyTabs .nav li.active span {color:#fff;} .row.pathColumnBlock {display:none;} .span12 > .HighlightWithLinkAndIconBlock .icon-container{ display: none; } .span6 > .HighlightWithLinkAndIconBlock .icon-container{ display: none; } .span4 > .HighlightWithLinkAndIconBlock .icon-container{ display: none; } .span6 > .HighlightWithLinkAndIconBlock .textContent h2, .span12 > .HighlightWithLinkAndIconBlock .textContent h2,.span4 > .HighlightWithLinkAndIconBlock .textContent h2{ font-size: 30px; line-height: 32px; font-weight: 700; padding: 0; } .span6 > .HighlightWithLinkAndIconBlock .textContent, .span12 > .HighlightWithLinkAndIconBlock .textContent,.span4 > .HighlightWithLinkAndIconBlock .textContent{ width: 100%; float: none; max-width: 100%; padding: 0; } .span6 > .HighlightWithLinkAndIconBlock, .span12 > .HighlightWithLinkAndIconBlock, .span4 > .HighlightWithLinkAndIconBlock{ height: auto; padding: 15px;padding-bottom: 30px; } .span4 > .HighlightWithLinkAndIconBlock .link-container, .span6 > .HighlightWithLinkAndIconBlock .link-container, .span12 > .HighlightWithLinkAndIconBlock .link-container { position: absolute; bottom: 5px; right: 5px; display: block; } /* Parempi vire block */ #parempiVireBlockSubmissionForm .left-panel, #selfEmployedInsuranceOrderForm .left-panel { padding-right: 0px; } #parempiVireBlockSubmissionForm .right-panel, #selfEmployedInsuranceOrderForm .right-panel { padding-left: 0px; } #parempiVireBlockSubmissionForm .right-panel .formField, #selfEmployedInsuranceOrderForm .right-panel .formField { margin-bottom: 0px; } /* Sales personnel pages */ .personnel-page-wrapper .personnel-left-container{ padding-right: 0px; } .personnel-page-wrapper .personnel-right-container{ padding-left: 0px; } .personnel-listing-page-wrapper .personnel-list .personnel-list-item{ width: 50%; } .personnel-listing-page-wrapper .personnel-list .personnel-list-item:nth-child(3n+1){ clear: none; } .personnel-listing-page-wrapper .personnel-list .personnel-list-item:nth-child(2n+1){ clear: left; } /* ------------------ utility classes for easy hiding on certain device -----------------*/ .hidden-desktop{display:inherit !important;} .visible-desktop{display:none !important;} .visible-phone{display:inherit !important;} } /* ------------------------------------------------------------------------------------------------------------------ ---------------------------------------------- responsive rules for smartphones ------------------- ------------------------------------------------------------------------------------------------------------------------*/ @media screen and (max-width:549px){ .sectionContentPage.asiointi h3 {font-size:18px;} .sb-search { width:36px;} .sb-icon-search {padding-left:5px; padding-right:7px; width:20px;} .sb-search-submit {width:28px;} .sb-search-input {right:27px; padding-top:7px; padding-bottom:7px;} /* mobile language selection */ .mainnav {position: static; padding-left:0; width:100%; padding-bottom:0; background-color:#00274b; margin-bottom:0;} .navLangWrapper {position: absolute; top:50px; left:0; z-index:2; margin-left:0; padding-left:0px; width: 80%; padding-bottom:0px; background-color:#00274b; } .languageWrapper.dropdown {padding-top: 10px; position:static; margin-top:0;right:0; top: 0px; left:0; z-index:2; right:auto; display:none;} .toggleMenu.active + .navLangWrapper .languageWrapper.dropdown{display:block;} .languageWrapper ul.dropdown-menu {background-color:#00274b; border:0; display:block; width:100%; margin-top:0px; padding-bottom:10px; margin-left:0px; border-radius:0;} ul.language li:first-child {margin-left:10px;} ul.language li, ul.language li a {float:left; display:inline-block; color:#fff;font-size:14px; } ul.language li.active a, ul.language li.active a:hover {background: #fff; color:#333 !important;} ul.language li a:hover {color:#fff !important; background:none;} ul.language li a {line-height: 20px;padding: 3px 7px;} .hidden-phone{display:none !important;} /*main image*/ .row.mainImage {height:250px; width:auto; } .mainImage picture img {height:250px; max-width:none; width:auto; } .row.frontpage.mainImage {height:250px; } .mainImage.frontpage picture img {height:250px; } .videoContainer .flowplayer{max-height: 250px;width: 444px; max-width: 100%;} .mainImage picture {overflow:hidden; } .topContentArea { left:20px;} .bootbox .modal-body {width: 300px; background: #fff; text-align: center; } .bootbox .modal-footer { width: 280px; background: #fff; padding-top:0; } /*facebook */ .facebookBlock .socialContent.colpadding {padding-left:0px;} /*calculator*/ .calculator .accordion-heading a {font-size: 18px;} .insuranceOrderFormBlock .arrowDown {padding: 19px 30px;} a.addthis_button_email {clear:both; margin-left:0; margin-top:10px;} .HighlightWithLinkBlock h1, .HighlightWithLinkBlock h2, .HighlightWithLinkBlock h3, .HighlightWithLinkBlock h4, .HighlightWithLinkBlock h5 { font-size: 18px;line-height: 22px;} .HighlightWithLinkBlock div.textContent { top: 7px; left: 15px; } .HighlightWithLinkBlock .link-container {bottom: 0px;padding-right: 15px;padding-left: 15px;width: auto;right: 0px;} .HighlightWithLinkBlock .link-container a{ margin: 0;padding: 0;} .HighlightWithLinkBlock.noBackgroundImage .link-container a{ margin-left: 0px; margin-right: 0px; } /* Suomi100 mobile styles */ #Suomi100SubmissionForm .right-panel { padding-left: 0px; } #Suomi100SubmissionForm .suomi100RulesLinks { width: 50%; float: left; margin-left: 0; } #Suomi100SubmissionForm .suomi100TocLink, #Suomi100SubmissionForm .suomi100RegistryLink { text-align: left; } .Suomi100CampaignLandingPage .arrowDown:before, .Suomi100CampaignSubmissionPage .arrowDown:before { font-size: 20px; } #suomi100ToggleFilter:after { top: 14px; } .submissionListContainer .suomi100Listfilter a { padding: 10px; } #suomi100ToggleFilter { margin-bottom: 20px; } /* Sales personnel pages */ .personnel-listing-page-wrapper .personnel-list .personnel-list-item{ width: 100%; clear: both; } } @media screen and (max-width:360px) { .mainImage picture img {margin-left:-95px;} .navLangWrapper {width: 100%;} } /* ---------------- print styles ------------------- */ @media print { body, footer .row.wide {background-color:#fff;} footer .row, header, .row .sidebar.tablecell, .siteTerms {display:none;} footer .row.copyright, footer .row.copyright .row {display:block;} footer {color:#00274b;} .row .mainBody.tablecell {width:100%;} .row .mainBody, .colpadding {padding:0;} footer .row.wide .row {padding:20px 0 0 20px;} .subpageContentArea p {margin-bottom: 10px;} /* --------- typography --------*/ body, .contactCardBlock, a.btn, a.btndarkblue, a.btnlightblue, button.btn, .row.breadcrumb, .topContentArea a.btn span, .links li a, .newsHighlightBlock .btn.newsroom, a.rss, .newsCategory, .newsDate, .subpageContentArea .mainBody .relatedLinks li, .keywords, .customerEventBlock .eventTime, .showMoreLinks, .maintenance .subpageContentArea li, .practicalContent .leftContentArea, .practicalBoxes [class*="span"] div, .sectionNav li a, .yearCalContent, .yearAnnouncementText, .youtubeBlock .row .span2, .span6 .youtubeBlock .row .span2, .blogDate, .blogAuthor, .blogPersonTitle, .blogTags, .contactCardBlock, .field-validation-error, .parsley-required, .parsley-phoneoremail, label, label .small, .custom-select-menu label, .search-result-item p, .calculator button, .calculator select, .pagination ul > li > span, #contentWrapper table, footer .row.wide { font-size: 12px; line-height: 14px; } h1, .frontpage h1 { font-size: 26px; line-height: 32px; } h2, span.h2, span.H2, .subpageContentArea h1, .searchResults h1, .service-header { font-size: 22px; line-height: 26px; } h3, .row.linkListBlock h3 { font-size: 18px; line-height: 22px; } h4, .topContentArea, .videoContentArea, .threeColumnBlock li a, .customerEventBlock .eventDay, .ingress, .subpageContentArea .ingress, .shortcutLinks li a, .tabNavigation li a, .social h4, .result-employee, .result-entrepreneur, .result-ilmarinen { font-size:15px;line-height:18px; } h5 { font-size:13px;line-height:17px; } .subpageContentArea li, .highlightBlock li, .accordion li, .sectionContentPage li, .sectionBlock li, .threeColumnBlock li, .twoColumnBlock li, .processStepBlock li, .twoRowBlock li {line-height:14px;} *{text-shadow:none !important;background:transparent !important;box-shadow:none !important;} 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; margin-left:0 !important;} p,h2,h3{orphans:3;widows:3;} h2,h3{page-break-after:avoid;} .visible-print{display:inherit !important;} .hidden-print{display:none !important;} }