/* ========================================================================== Metsä custom styles - mobile first ========================================================================== */ /*------------ general --------------- */ /* .container-fluid img {max-width: 100%;} */ a.arrowrounded {} .container-fluid { max-width:100%; padding-bottom:20px;} .wide { width: 100%; position:relative;} .wide.grey { padding-bottom:0; background: url("../img/shadow.png") no-repeat top center #e5e6e5;} .wide .container-fluid {padding-bottom:0; } .row.narrow {max-width: 700px; margin-top:20px; line-height:20px;} iframe {max-width: 100% !important;} .green {color:#8fd400;padding-right:5px;} .ms-rtestate-field p, p.ms-rteElement-P {line-height:1.4;} blockquote {border:0; margin: 0 0 10px 15px; padding:0; font-size: 14px;} blockquote blockquote {margin:0;} ol li {margin-bottom:8px;} /*Search previw fix*/ .ms-srch-hover-siteViewerContainer {width: 1000px !important; border:0;} select:focus {outline:none;} input[type="password"]:focus, input[type="text"]:focus, select:focus, textarea:focus, .sp-peoplepicker-topLevelFocus, .ms-inputBoxActive, .ms-inputBox.ms-inputBoxActive:hover {border-color:#E4E4E4;} /* responsive tables demo */ table.demo {width:100%; margin: 30px auto;} @media screen and (max-width:767px) { .scrollable > div { overflow-x: auto; } .logo img {max-width:140px;} .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; } /* top padding for content pages */ .contentpage{ padding-top:5px !important;} } .lightFont {font-family:"BentonSans-Book", Arial, Helvetica, sans-serif;} .medium {font-family:"BentonSans-Medium", Arial, Helvetica, sans-serif;} .nopadding { padding: 0 !important; } .nopaddingbottom {padding-bottom: 0 !important;} .nopaddingbottom h1 {margin-bottom:20px;} .marginTop0 {margin-top:0 !important;} .marginTop20 {margin-top:20px;} .marginTop40 {margin-top:40px;} .marginBottom {margin-bottom:10px;} .borderTop {border-top:2px solid #c7c7c7;} .borderTopDotted {border-top:1px dotted #c7c7c7;} .row input[type="text"] { border: 1px solid #e3e3e3; font-size: 12px; height: 26px; padding: 0 5px; } /* ------- arrows --- */ /*normal link*/ a.arrow {background: url("/_layouts/15/MGSPMetsaFibreInternet/img/sprite.png") left 3px no-repeat transparent; line-height: 16px; padding-left:20px; text-transform: uppercase; display:inline-block; margin-bottom:6px; } /*scroll down indicator in header*/ #arrowDown {display:block; background:url("/_layouts/15/MGSPMetsaFibreInternet/img/sprite.png") center -31px no-repeat rgba(0, 0, 0, 0.55); width: 100px; height: 100px; position:absolute; top: 230px; left: 50%; margin-left: -50px; z-index:2; opacity:1;} #arrowDown.notshown {opacity:0; transition: opacity .5s ease-in-out;-moz-transition: opacity .5s ease-in-out;-webkit-transition: opacity .5s ease-in-out; } /*scroll up indicator in footer*/ .arrowUp {display:block; cursor:pointer; float:right; background:url("/_layouts/15/MGSPMetsaFibreInternet/img/sprite.png") center -191px no-repeat rgba(0, 0, 0, 0.55)!important; width: 40px!important; height: 40px!important; } /* bordered h1 for separating some content */ .border h1, h1.border {border-top: 2px solid #e5e6e5; padding-top: 25px; } h1 {padding-top:10px; padding-left:15px; padding-right:15px; max-width:910px; margin-left:auto; margin-right:auto;} /* old browsers ( div{border-top:0!important;} .navbar-nav { border-top: 3px solid #e5e6e5; margin-top: 0; margin-bottom:0; } .navbar-nav > li { border-bottom: 1px solid #e5e6e5; } .navbar-nav > li .selected, .navbar-nav > li > a:hover {color:#8fd400!important; background: url("/_layouts/15/MGSPMetsaFibreInternet/img/sprite.png") no-repeat 15px -736px #363534; } .navbar-nav > li > a {font-size:13px;text-transform: uppercase;padding: 15px 15px 15px 35px; font-family:"BentonSans-Medium", Arial, Helvetica, sans-serif;} .navbar-nav > li > a:visited {color: #363534;} .navbar-toggle, .navbar-toggle:hover { border-radius: 0; border: 3px solid #e5e6e5; border-top: 0; border-bottom: 0; margin: 0; padding: 14px; right: 104px; background-color:#fff; } .navbar .breadcrumb { max-width:968px; background-color: #fff; bottom: -56px; width:100%; padding-left:50px; position: absolute; z-index: 2; border-bottom:1px solid #e5e6e5; text-transform:uppercase; line-height:18px; min-height:19px; border-radius:0; margin-left:-15px;} .navbar .breadcrumb a {margin-right:5px; font-size:10px; font-family:"BentonSans-Medium", Arial, Helvetica, sans-serif; color:#8b8b8b;} .navbar .breadcrumb a.active {color:#363534;} .navbar .breadcrumb a.active:hover {text-decoration:none; cursor:default;} /* search */ .sb-search { z-index:1; position:absolute; float:right; top: 0px; right:2px; width: 20px; transition: width 0.2s ease-out; -webkit-transition: width 0.2s ease-out; -moz-transition: width 0.2s ease-out; background-color:#fff; height: 32px; border-radius:5px; } .sb-search-input { position:absolute; right:30px; top:0;background-color:transparent;border: none; outline: none; width: 43px; height: 51px; margin: 0; padding: 6px 4px 6px 8px; font-family: inherit; font-size: 14px; line-height: 14px; border-top-left-radius: 5px; border-bottom-left-radius: 5px;color: #fff;transition: width 0.2s ease-out;-webkit-transition: width 0.2s ease-out;-moz-transition: width 0.2s ease-out; visibility: hidden; border: 1px solid #d8d8d8; border-right:0; } .sb-search-input:focus, .sb-search.open .sb-search-input { width: 200px; background-color:#fff; transition: width 0.2s ease-out;-webkit-transition: width 0.2s ease-out;-moz-transition: width 0.2s ease-out; border-top-left-radius: 5px; border-bottom-left-radius: 5px; border-bottom-right-radius:0; border-top-right-radius:0px; color:#363534;} .sb-search-input:focus + .sb-icon-search, .sb-search.open .sb-icon-search {visibility:hidden; } .sb-search-input::-webkit-input-placeholder { color: #9f9f9f; opacity:1; font-style: italic; position:relative;top: 3px; } .sb-search-input:-moz-placeholder { color: #9f9f9f;opacity:1; font-style: italic; position:relative;top: 3px;} .sb-search-input::-moz-placeholder { color: #9f9f9f;opacity:1; font-style: italic; position:relative;top: 3px;} .sb-search-input:-ms-input-placeholder { color: #9f9f9f; opacity:1; font-style: italic; } .sb-search-input::-ms-clear { display: none;} .sb-icon-search {visibility:visible; position:absolute; right:0px; top:0px; display:inline-block; background:url("/_layouts/15/MGSPMetsaFibreInternet/img/sprite.png") no-repeat 20px -134px; height:50px; width: 50px; border:0; } .sb-icon-search:hover {cursor:pointer;} .sb-search-submit {position:absolute; right:0; top:0;z-index:1; position:absolute; right:0; width: 30px; height: 51px; display:inline-block; padding: 0; margin: 0; line-height: 20px; text-align: center; cursor: pointer; visibility: hidden; background:url("../img/sprite.png") no-repeat 0px -135px #fff; border: none; outline: none; border-top-right-radius: 5px; border-bottom-right-radius: 5px; border: 1px solid #d8d8d8; border-left:0;} .sb-search-submit { } .open.sb-search{ transition: width 0.2s ease-out; -webkit-transition: width 0.2s ease-out; -moz-transition: width 0.2s ease-out; width: 230px; } .open .sb-search-input, .open .sb-search-submit { visibility: visible; } /*oob search*/ .ms-srch-sb > .ms-srch-sb-searchLink { background: url("/_layouts/15/MGSPMetsaForestInternet/img/sprite.png") no-repeat 7px -135px; height: 48px; width: 38px; border: 0; } #searchInputBox { position: relative; left: 2px; margin-bottom:0; } #searchInputBox {visibility: hidden;} .open #searchInputBox {transition: width 0.2s ease-out;-webkit-transition: width 0.2s ease-out;-moz-transition: width 0.2s ease-out;width: 230px;} #searchInputBox.open {visibility: visible;} .ms-srch-sb > .ms-srch-sb-navLink {height: 20px;width: 20px;margin-left: 6px;margin-top: 4px;} .ms-srch-sb > input { width: 189px; height: 48px; } #searchInputBox {width: 233px;} /* Breadcrumb */ .breadcrumb-wrapper{display:none;} /* language selection */ ul.language { position:absolute; top:0; right: 50px; border-right: 3px solid #e5e6e5; margin-bottom:0; } ul.language li.dropdown { height: 50px;/* line-height: 50px;*/ display:inline-block; }/*commented for top spacing responsive*/ ul.language .dropdown-toggle {text-decoration:none; font-size:16px; height: 50px; display:inline-block; padding: 14px 11px; } ul.language .dropdown-menu {right:0; left:auto; min-width: 30px; padding:0;} ul.language .dropdown-menu > li > a {padding: 3px 12px;} /* sidenav for mobile */ #sidenav-mobile .green{padding-right:0;} #sidenav-mobile { border-top: 3px solid #eaeaea; margin-left: -15px; margin-right: -15px; text-transform: uppercase; } #sidenav-mobile button { text-transform: uppercase;font-family:"BentonSans-Medium", Arial, Helvetica, sans-serif; } #sidenav-mobile > button { width: 100%; padding: 10px 15px; border: none; background: transparent; text-align: left; } #sidenav-mobile > button.collapsed .caret {margin-left: 5px; border-top: 4px solid; border-bottom:0;} #sidenav-mobile > button .caret {margin-left: 5px; border-bottom: 4px solid; border-top:0; position:relative; top:-2px;} #sidenav-mobile-list { padding: 0; list-style: none; margin-left:15px; } #sidenav-mobile-list li { display: block; } #sidenav-mobile-list li a { display: block; padding: 10px 10px 10px 20px; } #sidenav-mobile-list li a span { color:#363534;} #sidenav-mobile-list li a.arrow { background-position: 5px 12px; } @media (min-width: 768px) { #sidenav-mobile { border-top: 0; } } /* subpage slider */ .subpage-slider { padding-top: 90px; } .subpage-slider-wrapper { margin: 0 50px; } .subpage-slider-next { right: 10px; } .subpage-slider-prev { left: 10px; } /*------------ Footer --------------- */ footer {margin-top:30px;} footer .wide:first-child{background-color:#8d8d8d; color:#fff; font-size:12px; padding-bottom:10px; } footer .wide {background-color:#e5e6e5; color:#555; text-transform: uppercase; font-size:10px;} footer .wide .container-fluid {padding-top:20px; } footer li a {text-transform:none; color:#555!important; font-size:10px;} footer ul {margin:0 0 20px 0; padding:0;} footer li {margin:0; padding:0; list-style:none;} /*social share buttons*/ .container-fluid.socialshare { padding-bottom: 0; } .addthis_sharing_toolbox {float:right;} /* Footer social icons */ .social {margin:0 auto; display:inline-block; color:#fff!important; margin-right:25px; margin-top:15px;} .social .icon{width:40px; height:40px; display:block; margin: 0 auto 10px; background:url("../img/sprite.png") no-repeat; } .linkedin .icon {background-position: center -800px; } .twitter .icon{background-position: center -850px;} .youtube .icon{background-position: center -900px;} .facebook .icon{background-position: center -1005px;} .instagram .icon{background-position: center -1000px;} .slideshare .icon{background-position: center -952px;} /*------------ content elements --------------- */ /* Image highlight / jumbotron */ .jumbotron {padding: 0; margin-bottom: 30px;position:relative;color:#fff;overflow:hidden; -webkit-box-shadow: 0px 5px 9px 0px rgba(0,0,0,0.15); -moz-box-shadow: 0px 5px 9px 0px rgba(0,0,0,0.15); box-shadow: 0px 5px 9px 0px rgba(0,0,0,0.15); } .jumbotron.main {} .jumbotron > img {position:relative; top:0; left:-50%; right:0;max-width: none;height:289px;} .jumbotron .container-fluid { padding-bottom:0;background-color:#363534} .jumbotron .text-right {text-align:left;} .jumbotron .container-fluid a {color:#fff; position:relative; display:inline-block;} .jumbotron .container-fluid a:after {content: url("/_layouts/15/MGSPMetsaFibreInternet/img/arrowrounded.png"); padding: 0 0 0 5px; position:absolute; bottom:-5px;} .jumbotron.grey, .jumbotron.grey a {color: #333;} /* Key highlight */ .keyhighlight {margin-top:25px; text-align:center; margin:0 auto 20px; overflow:hidden; } .main-title {text-transform: uppercase; margin-top: 10px; margin-bottom: 5px;} .description {font-size:0.9em;} .keyhighlight .col-xs-6, .keyhighlight .col-xs-4{margin-bottom: 20px;} .keyhighlight .row {margin-top:25px;} .keyhighlight p{margin-top:20px;} /* Kpi highlight */ .kpihighlight .center-block-new{display: inline-block;margin-left: -2px;text-align: left;float: none;vertical-align: top;text-align:center} .kpihighlight {margin-bottom:20px;} .kpihighlight a {margin-top:30px; display:inline-block;} .kpihighlight a:hover {text-decoration:none;} .kpihighlight img {margin-bottom:5px;} .kpivalue {font-size:31px; margin-top:5px; font-family:"BentonSans-Light", Arial, Helvetica, sans-serif; text-transform: uppercase;} .kpivaluetitle {margin-left:5px; margin-right:5px; font-size:14px; text-transform: uppercase; display:inline-block; text-align:left; line-height:15px;} .kpititle {font-size:16px; font-family:"BentonSans-Medium", Arial, Helvetica, sans-serif; text-transform: uppercase; margin-top: 10px; margin-bottom: 9px;} .kpidescription {font-size:13px;} /* dashboard header */ .dashboardheader {margin: 0 auto;} .dashboardheader .kpivalue {margin-bottom:10px;} /* echo content */ .echoContainer .echoContent {padding:0 9px 20px 9px} .echoContent a:hover {text-decoration:none;} .echoContent a.arrow:hover {text-decoration:underline;} .echoContent h4 {margin-top:10px;max-height:none!important;} .echoContent img {max-width:100%;} .echoEdition {font-size:0.9em; margin-top:5px; margin-bottom:0;} .echoContainer { margin: 0 auto; max-width: 245px; } /*.echoContainer {font-size: 0px;}*/ .echoContainer .echoContent {display: inline-block;float: none;font-size: 14px;vertical-align: top;} /* echo filters & search results */ .echoFilters {margin-top:30px;} .echoFilters .submit {margin-top:0px;} .echoSearchResults {display:none;} .echoContainer .searchResultsMeta {text-transform: uppercase; font-size:0.9em; width:100%; padding-bottom:10px; font-family:"BentonSans-Medium", Arial, Helvetica, sans-serif; color:#555;} /*pulp videos*/ .videoSelection { position: relative; text-align:center; } .selectionImages { display: inline-block; margin: 0 auto; position: relative; width:100%; } .selectionImages .videoImage {width:25%; float:left; position:relative; cursor:pointer; border:3px solid #fff;} @media (max-width: 480px) { .selectionImages .videoImage {width:50%;} } .selectionImages .videoImage img {padding:6px;} .selectionImages .videoImage:hover, .selectionImages .videoImage.active {border:3px solid #8fd400;} .selectionImages .videoIcon { display: block; position: absolute; top: 0; left: 0; bottom: 0; right: 0; z-index: 1; background: url(/_layouts/15/MGSPMetsaFibreInternet/img/video-camera-icon.png) no-repeat center center; } .videoBlock { margin-top:20px; overflow: hidden; max-height:0px; -webkit-transition: max-height 1s; -moz-transition: max-height 1s; -o-transition: max-height 1s; -ms-transition: max-height 1s; transition: max-height 1s; } .videoBlock.active { max-height:1000px; } .videoBlock .videoContainer { float: left; height: 0; margin: 0 10px 0 auto; max-height: 678px; padding-bottom: 56.25%; padding-top: 25px; position: relative; text-align: center; width: 700px; } .videoContainer iframe, .videoContainer object, .videoContainer embed { width: 100%; height: 100%; position: absolute; top: 0; left: 0; max-height: 678px; } .slidingImages { position: absolute; right: 0; top: 0; width: 200px; -webkit-transition: width 0.5s ease; -moz-transition: width 0.5s ease; -o-transition: width 0.5s ease; -ms-transition: width 0.5s ease; transition: width 0.5s ease; } .slidingImages img { max-width:100%; } .slidingImages li .cameraIcon { display: block; position: absolute; top: 0; left: 0; bottom: 0; right: 0; z-index: 1; background: url(/_layouts/15/MGSPMetsaFibreInternet/img/camera-icon.png) no-repeat center center; } .slidingImages li:hover {border:3px solid #8fd400;} .slidingImages li.open:hover {border:none;} .slidingImages li.open .cameraIcon {display:none;} .slidingImages .information { display:none; } .slidingImages > ul { list-style: outside none none; padding: 0; } .slidingImages > ul > li { margin-bottom:10px; cursor:pointer; position:relative; } .videoBlock { overflow: hidden; position: relative; } .videoBlock.open .slidingImages { height: 100%; width: 100%; } .videoBlock.open li.open { background-color: rgba(0, 0, 0, 0.9); color: #fff; height: 100%; padding: 10px; position: absolute; top: 0; width: 100%; z-index:3; } .videoBlock.open li.open .information {display:block;} .videoBlock.open li.open > img { max-height: 50%; } .videoBlock .closeButton { color: #fff; display: none; font-size: 25px; font-weight: bold; line-height: 20px; padding: 10px; position: absolute; right: 0; top: 0; z-index:3; cursor:pointer; } .videoBlock.open .closeButton {display:inline-block;} @media (max-width: 991px) { .videoBlock .videoContainer {width:75%; } .slidingImages {width: 22.2%;} } @media (max-width: 767px) { .videoBlock.active.open .videoContainer {display:none;} .videoBlock.active.open .slidingImages{-webkit-transition: none; -moz-transition: none; -o-transition: none; -ms-transition: none; transition: none; } .videoBlock.active.open .slidingImages.staticposition {position:static;} .videoBlock.active.open .slidingImages.staticposition[style="display: block;"] li {display:none;} .videoBlock.active.open .slidingImages.staticposition[style="display: block;"] li.open {display:block; position:static; background-color: rgba(0,0,0,1)} } @media (max-width: 480px) { .slidingImages li .cameraIcon, .selectionImages .videoIcon { height:100%; width: 35px; background-size:contain; margin:0 auto;} .slidingImages {width: 21.7%;} } /*comments */ .leaveComment h2, .comments h2 {border-top:1px dotted #333; padding-top:30px; width:100%;} .commentItem {padding:10px; font-size:0.9em} .comments .commentItem:nth-child(odd) {background-color:#f5f5f5; padding:10px 10px 5px;} .commentDate { display:inline-block; margin-bottom:10px; margin-right:5px;} .commentName {display:inline-block; margin-bottom:10px; margin-left:5px; font-family:"BentonSans-Medium", Arial, Helvetica, sans-serif;} /* content section */ .contentsectionimage {margin-bottom:15px; } .contentsection [class*="col-"] h2:first-child, .contentsection [class*="col-"] h3:first-child, .contentsection [class*="col-"] h4:first-child {margin-top:0;} .contentsection h2{color:#363534!important} /* linkbox .linkboxcontainer {margin-top:43px;}*/ .linkbox {list-style:none; margin:0; padding:0;} /*subpagelinks*/ .subpagelinks {margin-top:20px;} /*address listing*/ .addresslisting .row {margin-bottom:20px; font-size:13px;} .addresslisting a{text-decoration:underline;background:none!important;padding-left:0!important} .addresslisting a:hover{text-decoration:underline;font-weight:bold;} /* contact search */ ul.select { margin-bottom:20px; position:relative; } ul.select .dropdown-toggle .caret {float:right; margin-top:7px; border-top: 6px solid #c6c8c7; border-left: 6px solid transparent; border-right: 6px solid transparent;} ul.select li.dropdown { display:block; width: 205px; } ul.select .dropdown-toggle {font-family:"BentonSans-Medium", Arial, Helvetica, sans-serif; text-decoration:none; display:block; width: 205px; font-size:14px; padding: 5px 11px; border: 1px solid #e4e4e4; margin-bottom:0; } ul.select .dropdown-menu {right:0; left:auto; padding:0; margin-top:-1px; width:205px; border-top:0;} ul.select .dropdown-menu > li > a {padding: 3px 12px;} /*forms*/ input[type="text"]:focus, input[type="textarea"]:focus, select:focus, input[type="submit"]:focus {outline:none;} input.submit, input.submit:hover { background: url("/_layouts/15/MGSPMetsaFibreInternet/img/sprite.png") no-repeat 81px 9px #7f7f7f; margin-left:0;text-align:left; width:100px; color:#fff; text-transform:uppercase; border:0;font-size:14px; padding: 6px 30px 6px 15px; font-family:"BentonSans-Medium", Arial, Helvetica, sans-serif; } label {text-transform: uppercase; color:#8f9190; margin-left:0;} input.inputSearchContacts {width:61%; min-width: 150px; display:inline-block; } input.submitSearchContacts {margin-left:10px; } /* =Custom Select Menu */ .custom-select-menu {display: block;margin-bottom: 0px;outline: none; position: relative;} .custom-select-menu label {display: block;position: relative; /* Prevents text-selection on the label. */ -moz-user-select: none;-ms-user-select: none;-webkit-touch-callout: none;-webkit-user-select: none; user-select: none; border: 1px solid #e4e4e4; outline:none; width:100%; background: url("../img/sprite_forms.png") no-repeat scroll right -97px transparent;height: 31px;overflow: hidden;padding: 0px 26px 0px 10px;font-size: 14px; font-family: "BentonSans-Medium",Arial,Helvetica,sans-serif; text-transform:none; font-weight:normal; color:#363534;line-height: 31px; -webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box; margin-bottom:20px; } .custom-select-menu label:before {content:" "; border-left: 6px solid transparent; border-right: 6px solid transparent;border-top: 6px solid #8fd400;float: right;margin-top: 7px;display: inline-block;margin-left: 2px; vertical-align: middle;width: 10px; height: 5px; position:absolute; right: 10px; top:5px; } .custom-select-menu label.opened {border-bottom:0;} .custom-select-menu label.selection-made {} .custom-select-menu label.opened.selection-made {} .custom-select-menu ul {padding:0;background-color: #fff; border: 1px solid #e4e4e4;border-top:0; left: 0; width:100%; list-style: none; margin: 0;position: absolute;top: 31px; z-index: 2; } .custom-select-menu li {background-color:transparent; cursor: pointer; font-size:14px; padding: 4px 10px;} .custom-select-menu li:last-child {border-bottom:0; margin-bottom:0px;} .custom-select-menu li:hover{background-color:#f5f5f5; } .custom-select-menu .selected {} /*videocontainer for responsive youtube embeds*/ .videoContainer { position: relative; padding-bottom: 56.25%; padding-top: 25px; height: 0; max-height:678px; width:100%; margin:0 auto; text-align:center;overflow:hidden;} .videoContainer iframe, .videoContainer object, .videoContainer embed { width:100%; height:100%; position: absolute; top: 0; left: 0; max-height:678px;} /* mosaic */ .mosaic img {position:absolute; top:0; left:0; min-width: 100%; max-width:none; min-height:100%; max-width:none;} .mosaic a {color:#fff;} .container-fluid.mosaic { margin-left:-4px; padding-bottom:0;} .nasdaq .green{padding-right:5px} .mosaic .row {margin-left:-9px; margin-right:-9px;} .mosaic .row .row {margin-left:-4px; margin-right:0;} .mosaic [class*="col-"] {padding-left:9px; padding-right:9px; color:#fff; } /*mosaic square and tall*/ .mosaic .smallbox:first-child, .mosaic .col-xs-6:first-child {padding-left:0;} .dynamicsquare .smallbox:first-child, .dynamicsquare .col-xs-6:first-child {padding-right:9px;} .dynamictall .smallbox:first-child, .dynamictall .col-xs-6:first-child {padding-right:9px;padding-left:9px;} /*mosaic square and tall*/ .mosaic .smallbox + .smallbox, .mosaic .col-xs-6 + .col-xs-6 {padding-right:0;} .dynamicsquare .smallbox + .smallbox, .dynamicsquare .col-xs-6 + .col-xs-6 {padding-right:9px;} .dynamictall .smallbox + .smallbox, .dynamictall .col-xs-6 + .col-xs-6 {padding-right:9px;} .mosaic .col-xs-6 .smallbox {padding:0;} .mosaicimage { position:relative; overflow:hidden; height:100%;} .mosaiccontent { padding:10px; position:relative; height:214px; width: 100%; background: rgba(0, 0, 0, 0.45); transition: background .2s ease-in-out;-moz-transition: background .2s ease-in-out;-webkit-transition: background .2s ease-in-out;} .bigbox .smallbox .mosaiccontent {position:relative; height:214px; width: 100%;} .verticalbox .mosaiccontent, .bigbox .mosaiccontent {height:446px;} .mosaiccontent:hover, .mosaiccontent, .bigbox .horizontalbox .mosaiccontent:hover {background: rgba(0,0,0,0);} .mosaiccontent .text{line-height: 24px; font-size:20px; font-family:"BentonSans-Light", Arial, Helvetica, sans-serif; width: 100%; max-height:100%; padding: 10px; text-align:left; position:absolute; bottom:0; right:0; background: rgba(0, 0, 0, 0); transition: background .2s ease-in-out;-moz-transition: background .2s ease-in-out;-webkit-transition: background .2s ease-in-out; } .mosaiccontent:hover .text {background: rgba(0, 0, 0, 0.45);} .brandtitle {text-transform:uppercase; font-size:13px;} .brandtitle span { font-family:"BentonSans-Medium", Arial, Helvetica, sans-serif;} .brandtitle.default {background:url("/_layouts/15/MGSPMetsaFibreInternet/img/sprite.png") no-repeat 0 -600px; padding: 0 0 0 28px;} .brandtitle.forest {background:url("/_layouts/15/MGSPMetsaFibreInternet/img/sprite.png") no-repeat 0 -348px; padding:0 0 0 23px;} .brandtitle.wood {background:url("/_layouts/15/MGSPMetsaFibreInternet/img/sprite.png") no-repeat 0 -398px; padding: 0 0 0 28px;} .brandtitle.fibre {background:url("/_layouts/15/MGSPMetsaFibreInternet/img/sprite.png") no-repeat 0 -448px; padding: 0 0 0 23px;} .brandtitle.board {background:url("/_layouts/15/MGSPMetsaFibreInternet/img/sprite.png") no-repeat 0 -498px; padding: 0 0 0 23px;} .brandtitle.tissue {background:url("/_layouts/15/MGSPMetsaFibreInternet/img/sprite.png") no-repeat 0 -548px; padding: 0 0 0 23px;} .brandtitle.group {background:url("/_layouts/15/MGSPMetsaFibreInternet/img/sprite.png") no-repeat 0 -600px; padding: 0 0 0 28px;} .greenline {width:167px; height:3px; background-color:#8fd400; position:relative; top:-3px;} .greenline.big {width:35%; } .nasdaq .mosaicimage {background-color:#363534;} .nasdaq iframe {margin:4px 0 10px;} .readmore, .readmore:visited{color:#fff} .archive_link a {color:#fff; text-decoration:none;} .nasdaq .mosaiccontent, .nasdaq .mosaiccontent:hover {background-color:#363534;} .nasdaq .brandtitle {line-height:24px;} .bigbox, .verticalbox { margin-bottom: 18px; height: 446px; position:relative; } .smallbox, .mosaic .horizontalbox { margin-bottom: 18px; padding:0; position:relative; } /*height: 214px;*/ /*read more link*/ .readmore {color:#fff; float:right; } .readmore .img-circle {padding: 0; background:url("../img/sprite.png") no-repeat 7px 7px rgba(0, 0, 0, 0.55); position:relative; top: 7px; margin-left: 5px; height:24px; width: 24px; display:inline-block;} /*job items*/ .jobitem.row {padding: 20px 0 10px; border-bottom: 1px solid #e5e6e5; margin:0;} .row.nopadding .col-xs-12 {padding-left:0; padding-right:0;} .row.nopadding [class*="col-"]:last-child {} .jobitem .col-xs-3, .jobitem .col-xs-4 {padding-right:5px; padding-left:0; font-size:0.9em;} .jobitem .readmore span { top:-4px; } .jobitem h4 {margin-top:0; text-transform:none;word-wrap: break-word;} @media (min-width: 489px) { .socialmedia #twitter iframe, .socialmedia #Twitter iframe{width:100%;margin:auto} .dynamictall .verticalbox{width:150px!important} .mosaic .verticalbox {width: 223px;} .mosaic .smallbox {width:223px;} .mosaic .bigbox {width: 464px;} .mosaic .horizontalbox {width: 446px; padding:0;} .mosaic .col-xs-12.smallbox {padding-left:0px; padding-right:9px;} .mosaic .col-xs-6.smallbox {padding-right:9px;} .mosaic .col-xs-6.smallbox + .col-xs-6.smallbox {padding-left:9px; padding-right:0;} .greenline.big {width:446px;} .echoContainer { margin: 0 auto; max-width: 486px; } .echoContainer .echoContent { width: 47%; } } /* tabs / content drawers */ .tab-content { margin:0 auto; max-width:446px;} .tab-content .drawerrightcol p a.link-style, .tab-content a{background: url(/_layouts/15/MGSPMetsaFibreInternet/img/sprite.png) left 3px no-repeat;line-height: 16px;padding-left: 20px;display: inline-block;margin-bottom: 6px;} .tab-content .drawerrightcol p a.link-style {background: url(/_layouts/15/MGSPMetsaFibreInternet/img/sprite.png) left 3px no-repeat!important;line-height: 16px!important;padding-left: 20px!important;display: inline-block!important;margin-bottom: 6px!important;text-decoration:none!important;} .tab-content .drawerrightcol p a.link-style:hover {font-weight:normal; text-decoration:underline!important;} .tab-content img {max-width:100%;width:100%; margin-bottom: 20px;} .tab-content h1 {padding-top:0;margin-top:0; margin-bottom:10px; font-family:"BentonSans-Light", Arial, Helvetica, sans-serif; text-align:left; padding-left:0; padding-right:0;color:#262626} .tab-content > div {padding: 30px 0;} .tab-content .brandtitle {margin-bottom:10px; line-height:16px; min-height:24px;} .col-centered .brandtitle {text-align:left;} .tab-content .brandtitle.forest {background:url("../img/sprite.png") no-repeat 0 -350px; padding:0 0 0 23px;} .tab-content .brandtitle.wood {background:url("../img/sprite.png") no-repeat 0 -400px; padding: 0 0 0 28px;} .tab-content .brandtitle.fibre {background:url("../img/sprite.png") no-repeat 0 -450px; padding: 0 0 0 23px;} .tab-content .brandtitle.board {background:url("../img/sprite.png") no-repeat 0 -500px; padding: 0 0 0 23px;} .tab-content .brandtitle.tissue {background:url("../img/sprite.png") no-repeat 0 -550px; padding: 0 0 0 23px;} .tab-content .brandtitle.group {background:url("../img/sprite.png") no-repeat 0 -602px; padding: 0 0 0 28px;} .tab-content .brandtitle.default {background:url("/_layouts/15/MGSPMetsaFibreInternet/img/sprite.png") no-repeat 0 -600px; padding: 0 0 0 28px;} .container-fluid .tab-content .container-fluid {padding:0;} .drawerrightcol {margin-top: 25px;} .closeDrawer, .closeDrawerCloud {background:url("../img/sprite.png") no-repeat right -645px!important; padding: 7px 30px 7px 0!important; text-transform: uppercase!important; color:#8e908f!important; font-size:14px!important; position:absolute!important; top:5px!important; right:10px!important; z-index:1!important;} /* image highlight carousel - partly visible next/prev slides */ .carouselContainer {max-width: 910px; overflow:hidden;} .carouselContainer .bx-wrapper {max-width: 910px; width: 100%; margin: 0 auto; background: #f2f2f2; display: block;} .carouselContainer .bx-viewport { position:static !important;} .highlightCarousel > li {position:relative; } .highlightCarousel > li .bg {height:auto; background: none repeat scroll 0 0 rgba(0, 0, 0, 0.5); z-index: 1;width: 100%; position: absolute; color:#fff; padding: 10px; bottom:0; border:0;} .highlightCarousel > li .bg p {margin-bottom:0; font-size:0.9em; margin-bottom:0;} .highlightCarousel > li .bg h2 { padding: 0 0 5px 0; margin:0; color:#fff; font-family: 'BentonSans-Book', Arial, Helvetica, sans-serif; font-size:16px;} .highlightCarousel > li .bg h2 a {color:#fff;} .carouselContainer .highlightCarousel > li .bg { height: 100%; border-left:10px solid #fff; border-right: 10px solid #fff; } .carouselContainer .highlightCarousel > li .bg h2, .carouselContainer .highlightCarousel > li .bg p {display:none; } .carouselContainer .highlightCarousel > li.active-slide .bg { height: auto; border:0;} .carouselContainer .highlightCarousel > li.active-slide .bg h2, .carouselContainer .highlightCarousel > li.active-slide .bg p {display:block; } .Wimg{background-color:transparent!important} /*reports and publication*/ .snip-reportPubl .block{margin-bottom:18px;} .snip-reportPubl h4{margin-top:0;} /* cloud */ .container-fluid.cloud {padding-bottom:20px;} #cloud {width:100%;} #cloud ul {list-style:none; margin:0; padding:0; text-align:center; } #cloud li {list-style:none; display:inline-block; margin: 3px 10px;} #cloud li a.weight1 { font-size:32px; color:#8fd400; } #cloud li a.weight2 { font-size: 25px; opacity: 0.85; color:#8fd400;} #cloud li a.weight3 { font-size: 19px; opacity: 0.70; color: #8fd400;} #cloud li a.weight4 { font-size: 19px; opacity: 0.55;} #cloud li a.weight5 { opacity: 0.4;} #cloud li a { font-size: 13px; color: #363534; text-decoration:none; outline:none; border-bottom: 3px solid #fff; padding: 0; font-family:"BentonSans-Medium", Arial, Helvetica, sans-serif;} #cloud li a:hover, #cloud li.active a, #cloud li.active a:hover {border-bottom: 3px solid #8fd400; } @media (min-width: 486px) { .carouselContainer .bx-viewport {overflow: visible !important;} .carouselContainer .bx-wrapper { width: 70%;} .highlightCarousel > li { overflow:hidden; } .carouselContainer .bx-wrapper .bx-prev {left: -15%; } .carouselContainer .bx-wrapper .bx-next {right: -15%;} } /*Social media*/ .socialmedia .nav > li > a {font-size:20px;} .nav-tabs .twitter {background:url("../img/sprite.png") no-repeat scroll left -1065px transparent; padding-left:35px; cursor:pointer;} .nav-tabs .facebook {background:url("../img/sprite.png") no-repeat scroll left -1112px transparent; padding-left:35px; cursor:pointer;} .nav-tabs .youtube {background:url("../img/sprite.png") no-repeat scroll left -1162px transparent; padding-left:50px; cursor:pointer;} .socialmedia .nav-tabs > li, .nav-pills > li { float: none; display: inline-block; *display: inline; /* ie7 fix */ zoom: 1; /* hasLayout ie7 trigger */ } .socialmedia .nav-tabs, .nav-pills { text-align: center; } .socialmedia .nav-tabs li.active {border-bottom: 3px solid #8fd400; color:#363534;} .socialmedia .nav-tabs li.active > a:hover { border-bottom: none; } .socialmedia .nav-tabs li > a:hover {border-bottom: 3px solid #8fd400; color:#363534;} .socialmedia .nav-tabs li > a:focus {outline:none;} .socialmedia .tab-content {text-align:center;} #fullwidthwhitebg .row{background-color:#363534;color:#fff} #fullwidthnew_smallfont .fwsmalltxt{font-size:14px;} #fullwidthnew_smallfont .fullwidth{font-size:45px;} #fullwidthnew p:last-child, #fullwidthnew_smallfont p:last-child, .jumboyoutube_txtundrLin p:last-child { border-bottom: none; padding-bottom:0; } #fullwidthnew .col-sm-5, #fullwidthnew_smallfont .col-sm-5, .jumboyoutube_txtundrLin .col-sm-5{padding-top:0;width:inherit;} #fullwidthnew_smallfont .fullwidth{margin-top:0} #fullwidthnew_smallfont .fwsmalltxt{margin-top:20px;margin-bottom:15px} .txtWrap .txtWrapImg {padding-right:10px;padding-bottom:25px;width:auto} /*text wrap image for mobile*/ .wrapSnip IMG { float: left; margin: 25px 25px 25px 0; width:360px; } .imagewrap .linkboxcontainer { background-color: #f3f3f3; padding: 10px; margin-top:10px; } /*---------------------------------------- Vertical tablets ---------------------------------------- --------------------------------------------- */ @media only print, screen and (min-width: 768px) { /*Text wrap image */ .wrapSnip IMG { float: left; margin: 25px 25px 25px 0; } .imagewrap .linkboxcontainer { background-color: #f3f3f3; padding: 10px; margin-top: 0px; } #fullwidthnew_smallfont .fwsmalltxt{font-size:14px;} #fullwidthnew_smallfont .fullwidth{font-size:45px;} #fullwidthnew_smallfont .fullwidth{margin-top:0} #fullwidthnew_smallfont .fwsmalltxt{margin-top:20px;margin-bottom:15px} #fullwidthnew p:last-child, #fullwidthnew_smallfont p:last-child, .jumboyoutube_txtundrLin p:last-child { border-bottom: 3px solid #fff; padding-bottom: 15px; } #fullwidthnew .col-sm-5, #fullwidthnew_smallfont .col-sm-5, .jumboyoutube_txtundrLin .col-sm-5{padding-top:0;max-width:41.66666667%;} .txtWrap .txtWrapImg {padding-right:10px;padding-bottom:25px;width:46.666667%} #fullwidthwhitebg .row, #fullwidthwhitebg .row a{background-color:transparent;color:#363534} #sidenav-mobile{border-top:none} .mobile-hotspot-links{display:none} .echoContainer .echoContent { margin-bottom: 0; width: 23%; } .echoContainer {max-width: none;} .contentsection .col-sm-9 {padding-left: 35px;} .echoSearchResults .echoContainer{ margin-left: -9px;} h1.chapter-header .green{display:inline-block} .jumbotron > img {position:absolute; top:0; left:0; right:0;max-width: 100%;height:auto;} .jumbotron .container-fluid{background-color:transparent} .greenline {width:214px;} .linkboxcontainer{background-color:#f3f3f3;padding:10px} #sb-search #searchInputBox .ms-srch-sb-borderFocused {float:none;} .socialmedia #twitter iframe, .socialmedia #Twitter iframe{width:57%;margin:auto} .dynamictall .verticalbox{width:170px!important} .echoFilters .submit {margin-top:24px;} .searchButton{margin-top:24px;} .navbar-nav > li .selected, .navbar-nav > li > a:hover {color: #363534 !important;} .purchsingForm input.submit{float:right;margin-right:65px;} .snip-reportPubl .block{ width:175px;float:left;height:175px;margin-bottom:18px;} .snip-reportPubl .block img{width:175px;} .snip-reportPubl .left-b{margin-left:18px;} .container-fluid {} .border h1, h1.border {padding-top:40px;} h1 {padding-top: 20px; } .row.narrow {margin: 0 auto;} /*------------ Header --------------- */ /* navigation */ #navbar {margin-left:0;} .navbar-nav {border-top: 0; } .navbar-collapse {float: left; width: 73%; margin-top: 18px; } .navbar-nav > li {margin:0 16px 0 0; border-top: 0; border-bottom:0;} .navbar-nav > li:last-child {margin-right:0;} .navbar-nav > li > a {padding: 5px 0 0; border-bottom: 3px solid transparent; } .navbar-nav > li > a:visited {color: #363534;} .navbar-nav > li .selected, .navbar-nav > li > a:hover {border-bottom: 3px solid #8fd400; color:#363534; background-image:none; background-color: transparent;} /* language selection */ ul.language { top: 15px; border:0;} ul.language .dropdown-menu{margin-top:7px;} ul.language li.dropdown {height:20px; line-height:20px;} ul.language .dropdown-toggle { font-size:14px; padding: 8px 0; font-family:"BentonSans-Medium", Arial, Helvetica, sans-serif;} /*search */ .sb-search { top: 17px; right:9px; } .sb-icon-search {top:8px; right: 6px; height:18px; width: 18px; background:url("../img/sprite.png") no-repeat left -150px; } .sb-search-input {height: 32px;} .sb-search-submit {height: 32px; background:url("../img/sprite.png") no-repeat 6px -143px #fff;} .ms-srch-sb > .ms-srch-sb-searchLink {background: url("/_layouts/15/MGSPMetsaFibreInternet/img/sprite.png") no-repeat 13px -143px;height: 30px;width: 38px;border: 0;} #searchInputBox {position: relative;right:0px;} #searchInputBox {visibility: hidden;} .open #searchInputBox {transition: width 0.2s ease-out;-webkit-transition: width 0.2s ease-out;-moz-transition: width 0.2s ease-out;width: 230px;} #searchInputBox.open {visibility: visible;} .ms-srch-sb > .ms-srch-sb-navLink {height: 20px;width: 20px;margin-left: 6px;margin-top: 4px;} .ms-srch-sb > input {width: 159px;height: 30px;} #searchInputBox {width: 203px;} /*breadcrumb*/ .breadcrumb-wrapper{display:block;} .breadcrumb-wrapper{padding-top:8px;padding-bottom:8px;border-bottom:1px solid #E5E6E5} .breadcrumb-wrapper span:first-child a {padding-left: 0;} .breadcrumb-wrapper span a, .breadcrumb-wrapper span .breadcrumbCurrentNode {padding: 0 5px;text-transform: uppercase;font-size: 10px;color: #8b8b8b;} .breadcrumb-wrapper span:last-child {color: #333;font-family: "BentonSans-Medium", Arial, Helvetica, sans-serif;padding-left:2px;} .breadcrumb-wrapper span:nth-child(even) {content: '';background: url('/_layouts/15/MGSPMetsaFibreInternet/img/sprite.png') left 3px no-repeat;padding: 0 7px;position:relative;top:1px;} /* Side navigation*/ #sidenav { background-color: rgba(0, 0, 0, 0)} #sidenav { position: fixed; top: 165px; z-index: 2; } #sidenav .sidenavTitle { background-color: rgba(0,0,0,0.5); color: #fff; padding: 4px 8px 4px 27px; margin-left: 0; font-family: "BentonSans-Medium", Arial, Helvetica, sans-serif; margin-bottom: 5px; height: 25px; display: block; width: 240px; } #sidenav .collapsed .sidenavTitle { visibility:hidden;} #sidenav .collapsed li + .sidenavTitle {visibility:visible;} #sidenav ul { width: 240px; overflow: hidden; padding: 0; -webkit-transition: width 0.5s, -webkit-transform 0.5s; /* For Safari 3.1 to 6.0 */ transition: width 0.5s, transform 0.5s; } #sidenav ul.collapsed { width: 25px; } #sidenav ul li { position: relative; width: 100%; padding-left: 25px; } #sidenav ul li a:before { content: '\2022'; color: #8f9190; text-align: center; font-size: 50px; display: block; width: 25px; height: 25px; position: absolute; z-index: 2; left: 0; top: 0; background-color: #7f7f7f; background-color: rgba(0,0,0,0.6); } #sidenav ul li.previous a:before { content: ''; background-image: url(../img/sprite.png); background-position: 5px -1246px; } #sidenav ul li a { color: #fff; display: inline-block; position: static; height: 25px; line-height: 25px; width: 100%; background-color: #3f3f3f; background-color: rgba(0,0,0,0.5); margin-bottom: 5px; padding-left: 2px; white-space: nowrap;overflow:hidden;text-overflow:ellipsis;} #sidenav ul li a span {color:#fff;} #sidenav ul li a.arrow { background-image: none; } #sidenav ul li a:hover {text-decoration:none;height:auto;white-space:normal;} #sidenav ul li a:focus{text-decoration:none;height:25px;} #sidenav ul li.active a, #sidenav ul li.active a span, #sidenav ul li.active a:before, #sidenav ul li a:hover, #sidenav ul li a:hover span, #sidenav ul li a:hover:before { color: #8fd400; } #sidenav ul li a:after { content: ''; } /* Footer social icons */ .social { margin-right:10px; margin-left: 10px; margin-top:0;} .social .icon {margin-bottom:20px;} footer .row .col-sm-4.text-center:first-child {padding-top:10px;text-align:left;} footer .wide .container-fluid {padding-top:30px;} footer ul {margin-bottom:30px;} /*------------ content elements --------------- */ /* top padding for content pages */ .contentpage{ padding-top:45px;} /* Image highlight / jumbotron */ .jumbotron h1 {margin-top:0;} .jumbotron .container-fluid { padding-top:40px; position:relative; z-index:1; } .jumbotron .text-right {text-align:right; padding-right:30px;} .jumbotron .col-sm-5{padding-top:0;} .jumbotron{min-height:auto;} /* graphical elements .top-shadow{background:url("../img/shadow.png") center top no-repeat; background-size:contain; } */ /* Key highlight */ .keyhighlight h1 {border-top: 0;} .keyhighlight .col-xs-6, .keyhighlight .col-xs-4{margin-bottom: 0px;} /* content section */ .contentsectionimage { margin-bottom: 35px; } /* linkbox .linkboxcontainer {margin-top:43px;}*/ /*subpagelinks*/ .subpagelinks {margin-top:30px;} /* mosaic */ .container-fluid.mosaic {margin-left:auto; max-width:800px;} .mosaic .row {margin:0 auto;} /*tabs*/ .closeDrawer, .closeDrawerCloud {top:15px!important; right:25px!important;} /* image highlight carousels */ .highlightCarousel > li .bg {padding:10px;} .highlightCarousel > li .bg h2 { font-size: 26px; line-height: 26px; } /* kpihighlights */ .kpititle {margin-top:40px;} /*job items*/ .jobitem .col-xs-3 { font-size:1em;} /*forms*/ input.inputSearchContacts {width:84%; } } @media only print, screen and (max-width: 991px) and (min-width: 768px) { .jumbotron.main .container-fluid { padding-left: 40px; padding-right: 40px; } } .searchButton { background-color: #7f7f7f; padding: 6px 15px 4px 15px; color: #fff; font-family: "BentonSans-Medium", Arial, Helvetica, sans-serif; font-size: 12px; cursor: pointer; display: inline-block; margin-top:24px; } /************************************************************************************** new main navigation / 12/2016 **************************************************************************************/ /*level 1 */ ul.nav:focus, .navbar-collapse:focus, .navbar-nav:focus .navbar-nav a:focus, .navbar-nav li:focus, .navbar-nav ul:focus {outline:none !important; outline-color: transparent !important;} /*level 2 and 3*/ .navbar-nav li ul.dynamic {width:100%; box-sizing:border-box; -webkit-box-sizing: border-box; white-space: normal; word-wrap: normal; padding: 0; margin: 0; border: none; box-shadow: none; } .navbar-nav li:nth-child(1) ul.dynamic { /*display: block !important;*/ } .navbar-nav ul.dynamic li.dynamic {display:block;} .navbar-nav ul.dynamic li a:hover {text-decoration:none;} /*only mobile*/ @media only print, screen and (max-width: 767px) { .navbar-fixed-top {max-height:100%; /*overflow-y:auto;*/} /*enable vertical scrolling when nav is longer than page*/ #searchInputBox {margin-bottom:0;} .ms-qSuggest-container {display:none;} .navbar-nav li a {padding: 12px 44px 12px 15px; display:block;} .navbar-nav > li > a, .navbar-nav > li > a:hover {background-image:none; color:#363534 !important; background-color:#fff;} .navbar-nav > li .selected {padding-left:15px; background-image:none; color:#363534 !important; background-color:#fff; font-weight:bold;} .navbar-nav > li.active > a, .navbar-nav > li.active > a:hover, .navbar-nav > li.active > a.selected {background-color:#f2f2f2;} .navbar-nav ul.dynamic li.dynamic {position:relative;} .more {position:absolute; right:0; top:0; height:44px; z-index:1; width:60px; display:inline-block; cursor:pointer; background: url('/_layouts/15/MGSPMetsaForestInternet/img/nav_arrow_down.png') 75% center no-repeat;} /*level 2*/ .navbar-nav ul.dynamic.level2 {background-color:#f2f2f2; position:static !important;} .navbar-nav ul.dynamic.level2 li.has-popup > a {background-color: #f2f2f2;} /*level 3*/ .navbar-nav ul.dynamic.level3 {background-color:#dbdbdb; list-style-type: none; position:static !important; } .navbar-nav ul.dynamic.level2 li > a {padding-left:25px;} .navbar-nav ul.dynamic.level3 li > a {padding-left:35px;} /*don't show submenu with hover, instead show with click function in main.js */ ul.dynamic {display:none !important;} .navbar-nav li.active > ul.dynamic {display:block !important;} } /*desktop*/ @media only print, screen and (min-width: 768px) { /*level 1 */ .navbar-nav > li.has-popup > a, .navbar-nav > li.has-popup > a.selected {background-image:none;} .navbar-nav > li.has-popup > a.level1.highlighted {background-color:#fff} /*level 2 and 3*/ .navbar-nav ul.dynamic li a {padding: 12px 30px 12px 15px; display:block; } /*level 2 */ .navbar-nav ul.dynamic.level2 {background-color:#fff; width: 250px; box-shadow:0px 3px 4px 0px rgba(0,0,0,0.3) !important; } .navbar-nav ul.dynamic.level2 li.has-popup > a {background: url('/_layouts/15/MGSPMetsaForestInternet/img/nav_arrow_right.png') 96% center no-repeat #fff;} .navbar-nav ul.dynamic.level2 li > a{background-color:#fff;} .navbar-nav ul.dynamic.level2 li > a:hover {background-color:#f2f2f2;} .navbar-nav ul.dynamic.level2 > li.has-popup > a:hover {background-color: #f2f2f2;} .navbar-nav ul.dynamic.level2 li.has-popup a.level2.highlighted {background-color:#f2f2f2} /*level 3*/ .navbar-nav ul.dynamic.level3 {list-style-type: none; background-color:#f2f2f2; min-height:100%; box-shadow: 0px 3px 4px 0px rgba(0,0,0,0.3) !important; z-index:-1;} .navbar-nav ul.dynamic.level3 li a {background-color: #f2f2f2;} .navbar-nav ul.dynamic.level3 li a:hover {background-color:#dbdbdb;} /*landscape tablets: hide dropdown */ .touch ul.dynamic {display:none !important;} } /******************************************* main navigation ends *******************************************/ /*--------------------------------------------- Desktop --------------------------------------------- --------------------------------------------- */ @media only print, screen and (min-width: 992px) { #fullwidthnew_smallfont .fullwidth{margin-top:0} #fullwidthnew_smallfont .fwsmalltxt{margin-top:20px;margin-bottom:15px} #fullwidthnew p:last-child, #fullwidthnew_smallfont p:last-child, .jumboyoutube_txtundrLin p:last-child { border-bottom: 3px solid #fff; padding-bottom: 15px; } #fullwidthnew .col-sm-5, #fullwidthnew_smallfont .col-sm-5, .jumboyoutube_txtundrLin .col-sm-5{padding-top:0;max-width:41.66666667%; } .txtWrap .txtWrapImg {padding-right:10px;padding-bottom:25px;width:46.666667%} #fullwidthwhitebg .row{background-color:transparent;color:#363534} #fullwidthwhitebg .row{background-color:transparent;color:#fff} #sidenav-mobile{border-top:none} .mobile-hotspot-links{display:none} .echoContainer { margin: 0 auto; max-width: 100%; } .echoContainer .echoContent { margin-bottom: 0; width: 23%; } .echoSearchResults .echoContainer{ margin-left: -9px;} .searchButton { background-color: #7f7f7f; padding: 6px 15px 4px 15px; color: #fff; font-family: "BentonSans-Medium", Arial, Helvetica, sans-serif; font-size: 12px; cursor: pointer; display: inline-block; margin-top:24px; } .arrowright { background: url("/_layouts/15/MGSPMetsaForestInternet/img/sprite_forest.png") no-repeat scroll 2px 2px transparent; height: 12px; width: 22px; display: inline-block; } .dynamicsquare .smallbox:first-child, .dynamicsquare .col-xs-6:first-child {padding-left:9px;padding-right:9px!important;} .dynamicsquare .col-xs-6.smallbox + .col-xs-6.smallbox{padding-left:9px;padding-right:9px;} h1.chapter-header .green{display:inline-block} .jumbotron > img {position:absolute; top:0; left:0; right:0;max-width: 100%;height:auto;} .greenline {width:214px;} .socialmedia #twitter iframe, .socialmedia #Twitter iframe{width:57%!important;margin:auto} .dynamictall .verticalbox{width:223px!important;} .linkboxcontainer{background-color:#f3f3f3;padding:10px;} /*dynamic page links*/ .MGsubpagelinks {margin:0;padding:0;list-style-type:none;} .MGsubpagelinks li {width:22%;height:36px;line-height: 1.5em;padding-right:8px;float: left;display: inline;} .kpivalue span{display: inline-block;vertical-align:middle} .navbar-nav > li .selected, .navbar-nav > li > a:hover {color: #363534 !important;} .purchsingForm input.submit{float:right;margin-right:51px;} /*dynamic page link*/ .MGsubpagelinks {margin:0;padding:0;list-style-type:none;} .MGsubpagelinks li {width:22%;height:36px;line-height: 1.5em;padding-right:8px;float: left;display: inline;} .dynamic5col .smallbox + .smallbox, .dynamic5col .col-xs-6 + .col-xs-6 { margin-left: 14px; } .snip-reportPubl .block{width:214px;float:left;height:214px;margin-bottom:18px;} .snip-reportPubl .block img{width:214px;} .snip-reportPubl .left-b{margin-left:18px;} .container-fluid {} h1.chapter-header {font-size:30px; line-height:32px;margin-bottom:30px;border-top:2px solid #eaeaea} .border h1, h1.border {padding-top:50px;} h1 {padding-top: 30px; } /*------------ Header --------------- */ /* navigation */ .navbar-collapse { width: 747px; } .navbar-nav > li > a { padding: 5px 0 4px; } .navbar-nav > li > a:visited {color: #363534;} /*breadcrumb*/ .breadcrumb-wrapper{display:block;} .breadcrumb-wrapper{padding-top:8px;padding-bottom:8px!important;border-bottom:1px solid #E5E6E5;width: 925px!important;border-bottom: 0;} .breadcrumb-wrapper span:first-child a {padding-left: 0;} .breadcrumb-wrapper span a, .breadcrumb-wrapper span .breadcrumbCurrentNode {padding: 0 5px;text-transform: uppercase;font-size: 10px;color: #8b8b8b;} .breadcrumb-wrapper span:last-child {color: #333;font-family: "BentonSans-Medium", Arial, Helvetica, sans-serif;padding-left:2px;} .breadcrumb-wrapper span:nth-child(even) {content: '';background: url('/_layouts/15/MGSPMetsaFibreInternet/img/sprite.png') left 3px no-repeat;padding: 0 7px;position:relative;top:1px;} /* Footer social icons */ .social { margin-right:30px; margin-left:30px; } footer .row .col-sm-4.text-center:first-child {padding-top:20px; text-align:left;} /*------------ content elements --------------- */ .contentsection .col-sm-9 {padding-left: 15px;} /* Image highlight / jumbotron --------------- */ .jumbotron { height: 430px; } .jumbotron .container-fluid { padding-top:140px; } .jumbotron.main {height:430px; } .jumbotron p { font-size: 18px; } .jumbotron > img {width: 100%; } .jumbotron .col-sm-5{padding-top:0;} /* scroll down indicator */ #arrowDown { top: 460px; } /* mosaic */ .container-fluid.mosaic { margin-left: auto; max-width: 910px; } .mosaic .row { margin-left: -15px; margin-right: -15px; } .mosaic .row .row { margin: 0; } .mosaiccontent .text {padding:20px;} .mosaic .verticalbox { width: 223px; } .dynamic5col .verticalbox{width:170px;} .mosaic .smallbox { padding-left: 0; } .mosaic .bigbox { width: 446px; padding: 0; } .mosaic .horizontalbox { width: 446px; padding: 0; } .mosaic .col-centered { float: left; margin-right: 0; } .mosaic .col-md-6 { padding-left: 0; } .mosaic .col-xs-12 {padding-left: 0; padding-right:0;} .mosaic .col-md-6 + .col-md-6 { padding-right: 0; float: right; } .nasdaq .mosaiccontent {padding:20px; } .mosaic.dynamicsquare .col-md-6 + .col-md-6, .mosaic.dynamictall .col-md-6 + .col-md-6 {padding-left:9px;} .mosaic.dynamicsquare .col-md-6 + .col-md-6 .smallbox:last-child, .mosaic.dynamictall .col-md-6 + .col-md-6 .verticalbox:last-child {float:right; } .mosaic.dynamicsquare .col-md-6 + .col-md-6 .smallbox:first-child, .mosaic.dynamictall .col-md-6 + .col-md-6 .verticalbox:first-child {float:left; padding-left:0;} .mosaic.dynamicsquare .col-md-6 + .col-md-6, .mosaic.dynamictall .col-md-6 + .col-md-6 {} /*tabs*/ .tab-content { max-width:none;} .tab-pane .col-md-4 {padding-left:0;} .container-fluid .tab-content .container-fluid {padding:0 15px;} .tab-content .row > div + div {padding-left:0;} .drawerrightcol {margin-top:50px;} .drawerleftcol a.arrow {margin-bottom: 10px;} /* image highlight carousel - partly visible next/prev slides */ .carouselContainer .highlightCarousel > li .bg {border-left:19px solid #fff; border-right: 19px solid #fff;} /* kpihighlights */ .kpivalue { font-size: 37px; } /*forms*/ input.inputSearchContacts {width:87%; } input.submitSearchContacts {float:right; margin-left:0;} /*Section Page content */ .linkboxcontainer {width: 23.5%;} } /* Bug - mosaic three in row in portrait tablet and mobile */ @media (min-width:768px) and (max-width: 991px) { .container-fluid.mosaic.dynamicsquare{ max-width:713px; margin:0 auto;} .mosaic.dynamicsquare .col-xs-6.smallbox.col-centered {float: left;margin-right: 0; padding-left:4px !important; padding-right:5px !important;} } @media (max-width: 767px) { .container-fluid.mosaic.dynamicsquare{ max-width:475px; margin:0 auto;} .mosaic.dynamicsquare .col-xs-6.smallbox.col-centered { padding-left:4px !important; padding-right:5px !important;float: left;margin-right: 0;} } /*Table Styles*/ /* ----------- Tables ----------- */ #TableStyle0-Menu,#TableStyle1-Menu,#TableStyle2-Menu, #TableStyle3-Menu, #TableStyle4-Menu, #TableStyle5-Menu, #TableStyle6-Menu, #TableStyle7-Menu, #TableStyle8-Menu, #TableStyle9-Menu, #TableStyle10-Menu, #TableStyle11-Menu {display:none; } /* hide all table styles than default and clear style */ /*Basic*/ table.ms-rteTable-myCustomTable { -ms-name: "Basic"; } .ms-rteTable-myCustomTable > tbody > tr > th { text-transform: uppercase; color: rgba(0,0,0,0.54); border-bottom: 3px solid rgba(0,0,0,0.54); } .ms-rteTable-myCustomTable > tbody > tr > td { color: rgba(0,0,0,0.86); border-bottom: 1px solid rgba(0,0,0,0.54); } .ms-rteTable-myCustomTable > tbody > tr > td, .ms-rteTable-myCustomTable > tbody > tr > th { vertical-align: top; padding: 7px 5px 6px; font-size:75%; } /*Minimalistic*/ table.ms-rteTable-myCustomTable-1 { -ms-name: "Minimalistic"; } .ms-rteTable-myCustomTable-1 > tbody > tr > th { text-transform: uppercase; color: rgba(0,0,0,0.54); border-bottom: 3px solid rgba(0,0,0,0.54); } .ms-rteTable-myCustomTable-1 > tbody > tr > td { color: rgba(0,0,0,0.86); border:0; } .ms-rteTable-myCustomTable-1 > tbody > tr > td, .ms-rteTable-myCustomTable-1 > tbody > tr > th { vertical-align: top; padding: 7px 5px 6px; font-size:75%; } /*Alternating Columns*/ table.ms-rteTable-myCustomTable-2 { -ms-name: "Alternating Columns"; } .ms-rteTable-myCustomTable-2 > tbody > tr > th { text-transform: uppercase; color: rgba(0,0,0,0.54); border-bottom: 3px solid rgba(0,0,0,0.54); } .ms-rteTable-myCustomTable-2 > tbody > tr > th:nth-child(even) { background-color:rgba(0,0,0,0.05); } .ms-rteTable-myCustomTable-2 > tbody > tr > td { color:rgba(0,0,0,0.86); border-bottom:1px solid rgba(0,0,0,0.54); } .ms-rteTable-myCustomTable-2 > tbody > tr > td, .ms-rteTable-myCustomTable-2 > tbody > tr > th { vertical-align: top; padding: 7px 5px 6px; font-size:75%; } /*Basic Green*/ table.ms-rteTable-myCustomTable-3 { -ms-name: "Basic Green"; } .ms-rteTable-myCustomTable-3 > tbody > tr > th { text-transform: uppercase; color: rgba(0,0,0,0.54); border-bottom: 3px solid rgba(143,212,0,1.0); } .ms-rteTable-myCustomTable-3 > tbody > tr > td { color:rgba(0,0,0,0.86); border-bottom:1px solid rgba(0,0,0,0.54); } .ms-rteTable-myCustomTable-3 > tbody > tr > td, .ms-rteTable-myCustomTable-3 > tbody > tr > th { vertical-align: top; padding: 7px 5px 6px; font-size:75%; } /*Specification*/ table.ms-rteTable-myCustomTable-4 { -ms-name: "Specification"; } .ms-rteTable-myCustomTable-4 > tbody > tr > th { text-transform: uppercase; color: rgba(0,0,0,0.54); border-bottom: 1px solid rgba(0,0,0,0.54); } .ms-rteTable-myCustomTable-4 > tbody > tr > td{ border-bottom: 1px solid rgba(0,0,0,0.54); } .ms-rteTable-myCustomTable-4 > tbody > tr > td:nth-child(odd) { color: rgba(0,0,0,0.86); background-color:rgba(0,0,0,0.05); } .ms-rteTable-myCustomTable-4 > tbody > tr > td, .ms-rteTable-myCustomTable-4 > tbody > tr > th { vertical-align: top; padding: 7px 5px 6px; font-size:75%; } @media only print, screen and (min-width: 992px) { .ms-rteTable-myCustomTable > tbody > tr > td, .ms-rteTable-myCustomTable > tbody > tr > th, .ms-rteTable-myCustomTable-1 > tbody > tr > td, .ms-rteTable-myCustomTable-1 > tbody > tr > th, .ms-rteTable-myCustomTable-2 > tbody > tr > td, .ms-rteTable-myCustomTable-2 > tbody > tr > th, .ms-rteTable-myCustomTable-3 > tbody > tr > td, .ms-rteTable-myCustomTable-3 > tbody > tr > th, .ms-rteTable-myCustomTable-4 > tbody > tr > td, .ms-rteTable-myCustomTable-4 > tbody > tr > th { font-size:100%; } } @media only print, screen and (min-width: 768px) { .ms-rteTable-myCustomTable > tbody > tr > td, .ms-rteTable-myCustomTable > tbody > tr > th, .ms-rteTable-myCustomTable-1 > tbody > tr > td, .ms-rteTable-myCustomTable-1 > tbody > tr > th, .ms-rteTable-myCustomTable-2 > tbody > tr > td, .ms-rteTable-myCustomTable-2 > tbody > tr > th, .ms-rteTable-myCustomTable-3 > tbody > tr > td, .ms-rteTable-myCustomTable-3 > tbody > tr > th, .ms-rteTable-myCustomTable-4 > tbody > tr > td, .ms-rteTable-myCustomTable-4 > tbody > tr > th { font-size:100%; } } /*purchasing form*/ .purchsingForm label {font-weight: normal;text-transform: none;color: #363534;} .purchsingForm .radio label {padding-left: 0;} .purchsingForm .radio label label {padding-top: 5px;padding-left: 5px;} .purchsingForm .radio:first-child {margin-top: 0;} .purchsingForm input[type='checkbox']{ margin-top: -5px;padding: 0;margin-right: 5px;} .purchsingForm input[type="text"], .purchsingForm input[type="tel"], .purchsingForm input[type="email"] {height: 26px;margin-right: 0px;border: 1px solid #e5e6e5;padding-left: 5px;} .purchsingForm select{padding:3px;} .purchsingForm textarea{border: 1px solid #e5e6e5;} .mandatoryText {color: red;text-transform: none;font-size: 12px;} .mandatory:before {content: "*";} .mandatory {color: #8fd400;padding: 0;margin: 0;} .validationError .mandatory, .validationError {color: #a94442;padding: 0;margin: 0;} .purchsingForm .validationError input[type="text"], .purchsingForm .validationError input[type="tel"], .purchsingForm .validationError input[type="email"], .purchsingForm .validationError textarea{border-color: #a94442;} .purchsingForm .formMsg{text-align:center;font-weight:bold;text-transform:none;margin:50px 0 50px 0; } .purchsingForm .formMsg h3{color:#8fd400; text-transform:none} /*KPi Highlights*/ .dvKPIValue{margin-top: 32px;margin-bottom: 96px;} /*order form*/ .chapter-header,#heading1{color:#363534!important} .form-control{margin-bottom:0!important;} .publication {margin-bottom: 10px;clear: both;} .publicationPreview {float: left;max-width: 75px;} .publicationDescr {margin-left: 80px;} .publicationDescr div {padding: 0px 0px 10px 0px;} @media print { header, footer, #arrowDown, #sidenav,.socialshare {display: none;} .jumbotron h1, .jumbotron a {color:#ffffff!important} } /*dynamic page link*/ .MGsubpagelinks {margin:0;list-style-type:none;} /*advance search*/ .srch-advancedtable { display: table; border-collapse: separate; border-spacing: 2px; border-color: gray; } .srch-advancedtable td {padding: 3px;} h3.ms-advsearch-header { font-size: 1em; color: #525252; margin: 0; text-transform: capitalize; } .ms-advsrchText-v1 label, .ms-advsrchText-v2 label { font-family: inherit; font-weight: normal; color: inherit; vertical-align: middle; font-size: 12px; text-transform: capitalize; margin-bottom: 0; } .ms-advsrchText-v1 span {font-size: 12px;} .ms-advsrchText-v1 {padding: inherit;} .ms-advsrchText-v2 input[type="checkbox"] {margin-right: 5px;} .ms-advsrchText-v2 select, .ms-advsrchtips span {font-size: 12px;} .ms-advsrchText-v2 input, .ms-advsrchText-v1 input { -webkit-box-sizing: initial; -moz-box-sizing: initial; box-sizing: content-box; font-size: 12px; } .ms-advsrchText-v2 input[type="checkbox"] {margin-top: 0;} /*suite link box*/ #suiteLinksBox{display:none;} /*search page*/ .ms-ref-refiner #Value a, .ms-ref-unsel-toggle {color:#363534;} .ms-ref-ctrl .ms-ref-selSec .ms-ref-filterSel, .ms-ref-ctrl .ms-ref-allSec .ms-ref-filterSel, .ms-ref-refiner #Value a:hover, .ms-ref-unsel-toggle:hover {color:#000;} .ms-srchnav-link-selected:link, .ms-srchnav-link-selected:visited, .ms-srchnav-link-selected:hover, .ms-srchnav-link:hover {color:#000;} .ms-srchnav-link, .ms-srchnav-link:visited {color:#333;} .contentsection .ms-searchCenter-refinement a, .contentsection .ms-searchCenter-result-main a {padding-left:0; background-image:none; text-transform:none; margin-bottom:0;} .contentsection .ms-searchCenter-refinement a.ms-ref-refinername {line-height:23px;} .ms-searchCenter-refinement {margin-top: 35px;} .ms-searchCenter-result-main {margin-top:30px;} .ms-searchCenter-result-main .ms-srch-sbLarge input[type="text"] {border:0; height:28px; font-size:14px;} .contactform{display:none} .ms-srchnav-item h2 {font-size:18px;} .ms-ref-refinername {font-family:"BentonSans-Medium", Arial, Helvetica, sans-serif;} input[type="checkbox"] + .ms-ref-name.ms-displayInlineBlock.ms-ref-ellipsis {position:relative; top: 8px;} .ms-srch-item-title h3 {font-size:16px;} .histogram_bar_active{border-top: 2px solid #8fd400;} .histogram_bar_active:hover, .histogram_bar_inactive:hover {background-color: #8fd400;border-left: 1px solid #92C0E0;border-right: 1px solid #92C0E0;border-top: 2px solid #8fd400;} .ajax__multi_slider_default .inner_rail_horizontal { background-color: #8fd400;border-bottom: 1px solid #8fd400;border-top: 1px solid #8fd400;} .MGNav{display:none} .ms-cui-menu{position:fixed!important} .linkboxcontainer .linkbox a,.linkboxcontainer .linkbox li a, .contentsection a, .subpagelinks a, .snip-reportPubl a, .addresslisting a{background: url("/_layouts/15/MGSPMetsaFibreInternet/img/arrow.png") left top no-repeat transparent; line-height: 16px; padding-left:20px;display:inline-block; margin-bottom:6px; } .linkboxcontainer .linkbox li p a, .contentsection p a, .subpagelinks p a, .snip-reportPubl p a, .addresslisting p a{background:none;padding:0;display:inline-block; margin-bottom:6px;} .highlightSlider h4{max-height:33px;overflow:hidden} /*title image slider*/ .titleslider.highlightSlider h4{background: url("/_layouts/15/MGSPMetsaFibreInternet/img/arrow.png") 0 0 no-repeat transparent;line-height: 16px;padding-left: 20px;text-transform: uppercase;display: inline-block;margin-bottom: 6px;} .titleslider.highlightSlider .mosaiccontent {height:110px;} .titlecontrol .bx-controls .bx-controls-direction .bx-prev, .titlecontrol .bx-wrapper .bx-controls-direction a{margin:0} /*join cooperative snippet*/ .joinCooperative{background-color:#363533;padding:0px;color:#fff} .joinCooperative .tel{color:#fff} .joinCooperative .col-md-9, .joinCooperativeContact{padding:20px;} .joinCooperative .joinCooperativeContact{background-color:#4a4947} .joinCooperative h2{text-transform:capitalize;margin-top: 0;margin-bottom: 15px;color:#fff} .joinCooperative .greenButton{margin-top:0;} .joinCooperativeContact {text-align:center} /*2 column snippet*/ .twoColumnSnippet{background-color:#fff} .twoColumnSnippet .col-md-6{padding-left:15px;} .twoColumnSnippet{padding-left:0} .twoColumnSnippet h2{color:#262626} #s4-workspace,.breadcrumb-wrapper{visibility:hidden} /*rss feed webpart*/ .rssfeedDescription span, .rssfeedDetails span{font-weight:bold;font-weight: bold;width: 147px;display: inline-block;} .rssfeedDescription p, .rssfeedDetails p{font-size:13px;} .rssfeedDescription .arrow{margin-bottom:0;text-transform:lowercase;padding-left:15px;margin-left:10px;} .feedTitle h4{cursor:pointer} .feedTitle h4:hover{text-decoration:underline} .titlerow h4{cursor:default!important;color:#8fd400} .titlerow h4:hover{text-decoration:none!important} /*topic highlight*/ .topic-highlights a:after { content: url("../img/arrowrounded.png");padding: 0 0 0 5px; position: relative;bottom: -5px;} /*carousel responsive*/ @media screen and (max-width: 991px) { .ms-webpart-zone, .ms-webpart-cell-vertical, .ms-webpart-chrome-vertical {display: block;} } @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) { #sidenav ul li a {color: #fff; display: inline-block; position: static; height: 25px; line-height: 25px; width: 100%; background-color: #3f3f3f; background-color: rgba(0,0,0,0.5); margin-bottom: 0px; padding-left: 2px; white-space: nowrap;overflow:hidden;text-overflow:ellipsis;} } @supports (-ms-accelerator:true) { #sidenav ul li a {color: #fff; display: inline-block; position: static; height: 25px; line-height: 25px; width: 100%; background-color: #3f3f3f; background-color: rgba(0,0,0,0.5); margin-bottom: 0px; padding-left: 2px; white-space: nowrap;overflow:hidden;text-overflow:ellipsis;} } .dynamic5col .verticalbox + .verticalbox + .verticalbox + .verticalbox + .verticalbox + .verticalbox { padding-left: 0; } @media all and (min-width:0\0) and (min-resolution: .001dpcm) { #sidenav ul li a {color: #fff; display: inline-block; position: static; height: 25px; line-height: 25px; width: 100%; background-color: #3f3f3f; background-color: rgba(0,0,0,0.5); margin-bottom: 0px; padding-left: 2px; white-space: nowrap;overflow:hidden;text-overflow:ellipsis;} } /*invisible chapter header*/ .invisble{display:none;} .tab-content a{background: url(/_layouts/15/MGSPMetsaFibreInternet/img/sprite.png) left 3px no-repeat;line-height: 16px;padding-left: 20px;display: inline-block;margin-bottom: 6px;} .nasdaqiframecontent iframe{display:block;margin:auto} /*nasdaq webaprt core*/ .nasdaq.white .mosaiccontent{background-color:#fff;padding:0;height:auto} .nasdaq.white .readmore{color:#262626!important;padding-bottom:5px;} .nasdaq.white{padding:0;height:auto;} .nasdaq.white{padding:0;height:auto;} .nasdaq.white .mosaicimage{background-color:#fff;height:auto} /*default link style in contnet area under paragraph*/ .link-style{text-decoration:underline;background:none!important;padding-left:0!important} .link-style:hover{text-decoration:underline;font-weight:bold;} /*left navigation back link*/ #sidenav .back:before{background: #8fd400 url(/_layouts/15/MGSPMetsaFibreInternet/img/green-arrow.png) left top no-repeat!important;content:'';height:25px;} #sidenav-mobile ul li a.back{background:transparent url("/_layouts/15/MGSPMetsaFibreInternet/img/green-arrow_mobile.png") no-repeat scroll 4px 13px!important;} /*footer link*/ .footerLinks li{text-align:center} /*sitemap arrows*/ .arrowLink{background: url("/_layouts/15/MGSPMetsaFibreInternet/img/arrow.png") left 2px no-repeat transparent;line-height: 16px;padding-left: 20px;display: inline-block;margin-bottom: 6px;} .mwTOCColumn .level-item-pos{padding:0;margin:0;} .mwTOCColumn .MGTOCLevel2{padding-left:20px;} .mwTOCColumn .MGTOCLevel3{padding-left:40px;} /*available jobs arrow link*/ .availableJobs a{ float: right;margin-top: -43px;margin-right:7px} /*m brain*/ .mBrain .item a, .mBrain .description {font-family: BentonSans-Book,Arial,sans-serif;font-size: 14px;line-height: 1.35;color:#363534} .mBrain .link-item a{font-weight:bold} .mBrain .description {font-size:12px;margin-top:10px} .mBrain .description .description a{background: url("/_layouts/15/MGSPMetsaFibreInternet/img/arrow.png") left 2px no-repeat transparent;padding-left: 17px;font-size:12px} .mBrain h4{font-weight:bold;margin-bottom:0;} /*search elemnts*/ .ms-srchnav ul li h2{font-size:16px;} .ms-srchnav ul li h2 a:visited{color:#8fd400} /*add this snippet*/ .addthisSnippet{float:right;width:105px;} /*event calendar*/ .eventCalendar .headers.jobitem.row{text-transform: uppercase;color: #363534;border-bottom: 2px solid rgba(143,212,0,1.0);font-weight:bold} .eventCalendar h4{color:#363534;text-transform:uppercase!important} /*Social media*/ .socialmedia .nav > li > a {font-size:20px;border:0;} /*.nav-tabs .twitter {background:url("../img/sprite.png") no-repeat scroll left -1065px transparent; padding-left:35px; cursor:pointer;} .nav-tabs .facebook {background:url("../img/sprite.png") no-repeat scroll left -1112px transparent; padding-left:35px; cursor:pointer;} .nav-tabs .youtube {background:url("../img/sprite.png") no-repeat scroll left -1162px transparent; padding-left:50px; cursor:pointer;}*/ .socialmedia .nav-tabs > li, .nav-pills > li { float: none; display: inline-block; *display: inline; /* ie7 fix */ zoom: 1; /* hasLayout ie7 trigger */ } .socialmedia .nav-tabs, .nav-pills { text-align: center; } .socialmedia .nav-tabs li.active {border:0;border-bottom: 3px solid #8fd400; color:#363534;} .socialmedia .nav-tabs li.active > a:hover { border-bottom: none; } .socialmedia .nav-tabs li > a:hover {border:0;border-bottom: 3px solid #8fd400; color:#363534;} .socialmedia .nav-tabs li > a:active{border:0} .socialmedia .nav-tabs li > a:focus {outline:none;border:0;} .socialmedia .tab-content {text-align:center;} .socialmedia .nav > li > a > img {width:28px;height:28px;margin-right:10px;border:0;} /*motto snippet updated*/ .motto img{margin:auto;} /*search pagination changes*/ .ms-srch-pagingNext {position: absolute!important;left: -110px!important;top: -5px!important;} #PageLinkNext .ms-srch-pagingNext{position: absolute!important;left: -110px!important;top: -5px!important;} /*word cloud*/ .cloud select{font-family: "BentonSans-Medium", Arial, Helvetica, sans-serif;text-decoration: none;display: block;width: 205px;font-size: 14px;padding: 5px 11px;border: 1px solid #e4e4e4;margin-bottom: 0;margin-bottom:20px;} /*visited link*/ .mosaicimage a:visited{color:#fff!important} .container-fluid a:visited {color:#363534;} /*visited link for jumbotron*/ .jumbotron .container-fluid a:visited {color:#fff;} .jumbotron .container-fluid a.link-style{text-decoration:none;} .jumbotron .container-fluid a.link-style:hover{text-decoration:underline;font-weight:normal;} /*section page right box*/ .linkboxcontainer{background-color:#f3f3f3;padding:10px} @media all and (min-width:639px) { .jumbotron > img {height: auto; left: 0; max-width: 100%;} } @media print { header, footer, #arrowDown, #sidenav, .socialshare { display: none; } .jumbotron h1, .jumbotron a { color: #ffffff !important; } .greenbox { background-color: #e5ecea !important; padding: 20px !important; font-family: "BentonSans-Book", Arial, Helvetica, sans-serif; } .greenbox .h2 { font-size: 18px !important; color: #7ca295 !important; margin-top: 0 !important; margin-bottom: 20px !important; font-family: "BentonSans-Medium",Arial, Helvetica, sans-serif !important; } } /*mobile view preview in saerch page*/ .ms-srch-hover-siteViewerContainer {width: 1000px !important; border:0;} .bxslider{visibility:hidden} /* top padding for content pages */ .contentpage{ padding-top:10px;} /*content snippet grey box*/ .contentsnippet .linkboxcontainer{width:100%} .contentsection ul li a{background:none;padding-left:0;} /*Mobile view search fix*/ .ms-srch-ellipsis { white-space: normal; } .echoFilters select{background-color: #fff; display: block; position: relative; -moz-user-select: none; -ms-user-select: none; -webkit-touch-callout: none; -webkit-user-select: none; user-select: none; border: 1px solid #e4e4e4; outline: none; width: 100%; background: url("../img/sprite_forms.png") no-repeat scroll right -97px transparent; height: 31px; overflow: hidden; padding: 0px 26px 0px 10px; font-size: 14px; font-family: "BentonSans-Medium",Arial,Helvetica,sans-serif; text-transform: none; font-weight: normal; color: #363534; line-height: 31px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; margin-bottom: 20px;} .echoFilters .searchButton{ text-align: left; width: 175x; color: #fff; text-transform: uppercase; border: 0; font-size: 14px; padding: 6px 30px 6px 15px; font-family: "BentonSans-Medium", Arial, Helvetica, sans-serif; } /*edit tool panel font changes*/ .ms-ToolPaneOuter * { font-family: sans-serif; color: inherit; vertical-align: middle; font-weight: normal; text-transform: capitalize; margin-bottom: 0; } .ms-ToolPaneOuter input, .ms-ToolPaneOuterselect, .ms-ToolPaneOuter textarea, .ms-ToolPaneOuter button,.ms-ToolPaneOuter option{margin:0 5px 0 0;text-transform:none} #MSOTlPn_MainTD div.UserControlGroup table { border-spacing: 2px; } #MSOTlPn_MainTD div.UserSectionTitle, #MSOTlPn_MainTD div.UserGeneric, #MSOTlPn_MainTD label, #MSOTlPn_MainTD span, #MSOTlPn_MainTD input{ font-family:"Segoe UI","Segoe",Tahoma,Helvetica,Arial,sans-serif; font-size: 13px; font-weight: normal; line-height: normal; text-transform: none; } #MSOTlPn_MainTD label, #MSOTlPn_MainTD span, #MSOTlPn_MainTD input{ box-sizing: content-box; color: #777; display: inline; margin-bottom: 0px; } #MSOTlPn_MainTD span#MSOTlPn_TlPnCaptionSpan { color: #000; } #MSOTlPn_MainTD label, #MSOTlPn_MainTD span { margin-left: 0px; max-width: none; } #MSOTlPn_MainTD input { color: #444; } #MSOTlPn_MainTD input, #MSOTlPn_MainTD textarea, #MSOTlPn_MainTD keygen, #MSOTlPn_MainTD select, #MSOTlPn_MainTD button { margin: 0em; font: 13.3333px Arial; } #MSOTlPn_MainTD input[type="radio"] { margin: 3px 3px 0px 5px; } #MSOTlPn_MainTD input[type=button], #MSOTlPn_MainTD input[type=reset], #MSOTlPn_MainTD input[type=submit] { background-color: #fdfdfd; box-sizing: border-box; font-family: "Segoe UI","Segoe",Tahoma,Helvetica,Arial,sans-serif; font-size: 11px; margin-left: 10px; } /*Front page Mosiac 4 column fix*/ .mosaiccontent, .bigbox .horizontalbox .mosaiccontent { padding: 10px; position: relative; height: 214px; width: 100%; background: rgba(0, 0, 0, 0.45); transition: background .2s ease-in-out; -moz-transition: background .2s ease-in-out; -webkit-transition: background .2s ease-in-out; } div.ECHO-summary { max-height: 188px; overflow: hidden; text-overflow: clip; } .echoContent a.arrow { margin-top:10px; } /* responsive tables demo */ table.demo {width:100%; margin: 30px auto;} @media screen and (max-width:767px) { .scrollable > div { overflow-x: auto; } .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; } } /* VPMFISS-72 */ .mosaic .mosaicimage .readmore .img-circle { background: url("/_layouts/15/MGSPMetsaFibreInternet/img/sprite.png") no-repeat 4px 4px rgba(0, 0, 0, 0.55); top: 4px; height:18px; width: 18px; } .mosaic .nasdaq iframe { left: 15px; position: absolute; } .mosaic .nasdaq a.readmore { bottom: 15px; left: auto; position: absolute; right: 23px; text-align: right; top: auto; width: 150px; } /* mobile screens: iframe needs to be more narrow & taller to fit the news; */ @media (max-width: 450px) { .mosaic .bigbox, .mosaic .horizontalbox.nasdaq, .mosaic .nasdaq > .mosaicimage { height: initial; } .mosaic .nasdaq a.readmore { right: 13px; bottom: 10px; } .mosaic .nasdaq iframe { left: 0px; height: 100%; width: 100%; padding-right:15px; padding-bottom:70px; } .mosaic div.nasdaq > .mosaicimage > .mosaiccontent { height: 225px; } } @media (max-width: 405px) { .mosaic div.nasdaq > .mosaicimage > .mosaiccontent { height: 245px; } } @media (max-width: 360px) { .mosaic div.nasdaq > .mosaicimage > .mosaiccontent { height: 260px; } } @media (max-width: 340px) { .mosaic div.nasdaq > .mosaicimage > .mosaiccontent { height: 275px; } } @media (max-width: 309px) { .mosaic div.nasdaq > .mosaicimage > .mosaiccontent { height: 325px; } } /* end of VPMFISS-72 */ /* VPMFISS-81 */ /* media */ div.nasdaq.white iframe { margin: 0; } @media (max-width: 710px) { div.nasdaq.white iframe { height: 180px; } } @media (max-width: 560px) { div.nasdaq.white iframe { height: 205px; } } @media (max-width: 450px) { div.nasdaq.white iframe { height: 225px; } } @media (max-width: 425px) { div.nasdaq.white iframe { height: 265px; } } @media (max-width: 340px) { div.nasdaq.white iframe { height: 295px; } } /* end of VPMFISS-81 */ /* VPMFISS-86 */ @media (min-width: 489px) { .socialmedia iframe[id^=twitter-widget-] {width:100%;margin:auto} } @media only print, screen and (min-width: 768px) { .socialmedia iframe[id^=twitter-widget-] {width:57%;margin:auto} } @media only print, screen and (min-width: 992px) { .socialmedia iframe[id^=twitter-widget-] {width:57%!important;margin:auto} } /* end of VPMFISS-86 */ @media screen and (max-width:767px) { .ms-searchCenter-refinement { margin-top: 0px; } .ms-searchCenter-refinement #MSOZoneCell_WebPartWPQ2 { margin-bottom: 0px; } .ms-searchCenter-result-main { margin-top: 0px; } } /*VPMFISS-89*/ @media screen and (max-width:504px) { .ms-srch-item, .ms-srch-item-path { width:100%; } .ms-srch-communityItem-path, .ms-srch-item-preview-path { width: 77%; } .ms-srch-item-video-path,.tprprt-body-preview .ms-srch-item-path { width: 74%; } .ms-srch-sbLarge-fullWidth { width: 250px; } .ms-srch-sbLarge-navWidth { width: 86%; } .ms-searchCenter-result-main { width: 100%; } } /*end of VPMFISS-89*/ /*VPMFISS-87*/ #MSOTlPn_MainTD { display: block; position: fixed; top: 65px; right: 0px; z-index: 1000; height: auto; max-height:90%; width: auto !important; overflow-y: auto; overflow-x: hidden; background: transparent; } #MSOTlPn_MainTD > table{ margin-right: 0px; position: static; width: 100%; } .ms-TPBorder { width: 100%; } /*end of VPMFISS-87*/ /*VPMFISS-85 */ @media only print, screen and (min-width: 992px) { .jumbotron .container-fluid { padding-top: 6%; margin-top:30px; } .jumbotron h1, .jumbotron .fullwidth { font-size: 30px; } } @media only print, screen and (min-width: 1100px) { .jumbotron h1, .jumbotron .fullwidth { font-size: 36px; } } @media only print, screen and (min-width: 1290px) { .jumbotron h1, .jumbotron .fullwidth { font-size: 40px; } } /* End of VPMFISS-85 */ /*hot spot image*/ .block-info { background: #f2f3f2; padding: 1.5em; } .block-info.no-bg { background: transparent; padding: 0; } @media (max-width: 767px) { .block-info { margin-top: 2em; margin-bottom: 2em; } } .block-info h5 { margin-top: 0; margin-bottom: 1em; text-transform: uppercase; font-family: "BentonSansMedium", sans-serif; } .block-info ul.links { padding-left: 0; text-transform: uppercase; list-style-type: none; list-style-position: outside; } .block-info ul.links i { float: left; display: inline-block; color: #8fd400; padding-left: 0; margin-right: .5em; line-height: 1.4; } .block-info ul.links li { padding-left: 20px; } .block-info ul.links a { text-decoration: none; text-transform: uppercase; font-family: "BentonSansBook", sans-serif; } .block-hotspot { display: block; position: relative; border: 5px solid #e4e6e5; background: #e4e6e5; min-height: 100px; } .block-hotspot .hotspot-window { position: relative; } .block-hotspot.esb-team .hotspot-window { height: 250px; padding: 34px; background-size: cover; } @media (max-width: 767px) { .block-hotspot.esb-team .hotspot-window { height: 100px; } } @media (max-width: 489px) { .block-hotspot [data-hotspot-target] { display: block; } } .block-hotspot .hotspot-target { position: relative; z-index: 1; width: 100%; height: auto; } .container-fluid .block-hotspot .hotspot { position: absolute; z-index: 1; width: 30px; height: 30px; line-height: 34px; border-radius: 100%; background: rgba(0, 0, 0, 0.5); color: #fff; text-align: center; font-size: 1.4em; -webkit-transition: background 0.2s ease-in-out; -o-transition: background 0.2s ease-in-out; transition: background 0.2s ease-in-out; -moz-transition: -moz-transform 0.25s ease-in-out; -o-transition: -o-transform 0.25s ease-in-out; -webkit-transition: -webkit-transform 0.25s ease-in-out; transition: transform 0.25s ease-in-out; text-decoration:none; } .block-hotspot .hotspot:hover, .block-hotspot .hotspot.active { text-decoration: none; background: rgba(0, 0, 0, 0.6); color: #8fd400; } .block-hotspot .hotspot.active { -moz-transform: rotateZ(45deg); -ms-transform: rotateZ(45deg); -webkit-transform: rotateZ(45deg); transform: rotateZ(45deg); } @media (max-width: 767px) { .block-hotspot .hotspot { display: block; } } .block-hotspot.esb-team .hotspot { position: relative; display: block; margin-bottom: 18px; border-radius: 0; width: 300px; height: 42px; background: none; text-align: left; } .block-hotspot.esb-team .hotspot img { display: inline-block; vertical-align: top; width: 42px; height: auto; border: 2px solid #c8c8c8; } .block-hotspot.esb-team .hotspot span { margin-left: 25px; display: inline-block; vertical-align: top; text-transform: uppercase; text-decoration: underline; font-size: 12px; color: #363534; font-family: "BentonSansMedium", sans-serif; } .block-hotspot.esb-team .hotspot:hover, .block-hotspot.esb-team .hotspot.active { -moz-transform: none; -ms-transform: none; -webkit-transform: none; transform: none; } .block-hotspot.esb-team .hotspot:hover img, .block-hotspot.esb-team .hotspot.active img { border-color: #8fd400; } .block-hotspot.esb-team .hotspot:hover span, .block-hotspot.esb-team .hotspot.active span { color: #000; } @media (max-width: 767px) { .block-hotspot.esb-team .hotspot { display: none; } } @media (max-width: 767px) { .block-hotspot [data-hotspot-target] { display: block; } } .block-hotspot .hotspot-info > div { display: none; padding: 2em; position: relative; } @media (max-width: 767px) { .block-hotspot .hotspot-info > div { display: block; border-top: 1px solid #ccc; border-bottom: 1px solid #ccc; } .block-hotspot .hotspot-info > div:last-child { border-bottom: 0; } .block-hotspot .hotspot-info > div img.img-responsive { margin-bottom: 1em; } } .block-hotspot .hotspot-info .preview img, .block-hotspot .hotspot-info .preview a { float: none; display: inline-block; vertical-align: bottom; padding: 0; } .block-hotspot .hotspot-info .preview img span:hover, .block-hotspot .hotspot-info .preview a span:hover { text-decoration: underline; } .block-hotspot .hotspot-info .preview img { margin-right: 8px; } .block-hotspot .hotspot-info h5 { /*font-family: "BentonSansLight", sans-serif;*/ margin-top: 0; font-size: 2.04em; } .block-hotspot .hotspot-info h5 b { font-family: "BentonSansBold", sans-serif; font-weight: normal; } .block-hotspot .hotspot-info p { width: 100%; } .block-hotspot .hotspot-info .cta i { display: inline-block; vertical-align: top; color: #8fd400; width: 16px; margin-top: 2px; font-size: 0.846em; } .block-hotspot .hotspot-info .cta span { display: inline-block; vertical-align: top; font-weight: bold; text-transform: uppercase; } .block-hotspot .hotspot-info a.hotspot-close { position: absolute; top: 20px; right: 10px; color: #8fd400; font-size: 1.538em; } .block-hotspot .hotspot-info a.hotspot-close:hover { color: #000000; text-decoration: none; } @media (max-width: 767px) { /* .block-hotspot .hotspot-info a.hotspot-close { display: none; }*/ } .block-sharing { padding: 1.5em; } @media (max-width: 767px) { .block-sharing { text-align: center; } } .block-sharing h5 { margin-top: 0; margin-bottom: 1em; text-transform: uppercase; font-family: "BentonSansMedium", sans-serif; } .block-sharing ul.social { list-style: none; padding-left: 0; } .block-sharing ul.social li { display: inline-block; padding-left: 0; margin-right: 0.5em; } @media (max-width: 767px) { .block-sharing ul.social li { margin-right: 1em; } } .block-sharing ul.social li:last-child { margin-right: 0; } .block-sharing ul.social a { display: block; font-size: .9em; color: #ffffff; } .block-sharing ul.social a:hover { text-decoration: none; } .block-sharing ul.social a:hover i { color: #8fd400; } .block-sharing ul.social a:focus, .block-sharing ul.social a:visited, .block-sharing ul.social a:active { outline: none; } .block-sharing ul.social i { display: block; width: 30px; height: 30px; border-radius: 100%; line-height: 31px; text-align: center; background: #8d8d8d; color: #e9e9e9; -webkit-transition: color 0.2s ease-in-out; -o-transition: color 0.2s ease-in-out; transition: color 0.2s ease-in-out; } .hotspot-links { display: block; background: url("/_layouts/15/MGSPCampaigns/img/sprite.png") left 3px no-repeat transparent; padding-left: 17px; margin: 10px 0 10px 0; font-weight: bold; } .hotspot-info .row .col-sm-8 a { background: url(/_layouts/15/MGSPMetsaGroupInternet/img/sprite.png) left 3px no-repeat; line-height: 16px; padding-left: 20px; display: inline-block; margin-bottom: 6px; } @font-face { font-family: 'icomoon'; src: url('/_layouts/15/MGSPCampaigns/fonts/icomoon.eot?-rq127d'); src: url('/_layouts/15/MGSPCampaigns/fonts/icomoon.eot?#iefix-rq127d') format('embedded-opentype'), url('/_layouts/15/MGSPCampaigns/fonts/icomoon.woff?-rq127d') format('woff'), url('/_layouts/15/MGSPCampaigns/fonts/icomoon.ttf?-rq127d') format('truetype'), url('/_layouts/15/MGSPCampaigns/fonts/icomoon.svg?-rq127d#icomoon') format('svg'); font-weight: normal; font-style: normal; } [class^="icon-"], [class*=" icon-"] { font-family: 'icomoon'; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; /* Better Font Rendering =========== */ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .icon-new-window:before { content: "\e611"; } .icon-youtube:before { content: "\e600"; } .icon-slideshare:before { content: "\e601"; } .icon-linkedin:before { content: "\e602"; } .icon-twitter:before { content: "\e603"; } .icon-slider-right:before { content: "\e604"; } .icon-slider-left:before { content: "\e605"; } .icon-share:before { content: "\e606"; } .icon-page-down:before { content: "\e607"; } .icon-pageup:before { content: "\e608"; } .icon-link-arrow:before { content: "\e609"; } .icon-hotspot-plus:before { content: "\e60a"; } .icon-google-plus:before { content: "\e60b"; } .icon-fill-orm:before { content: "\e60c"; } .icon-facebook:before { content: "\e60d"; } .icon-download:before { content: "\e60e"; } .icon-contact:before { content: "\e60f"; } .icon-close:before { content: "\e610"; } /*Brand tool*/ .brandingTool{background-color: #e4e6e5;} .brandingTool .columns{padding-top:15px;} .brandingTool .textImage{margin-bottom:20px;padding-left:0px;} .panels, .flip { padding: 5px; text-align: center; background-color: #cbcccb; /* border: solid 1px #c3c3c3; */ margin-bottom:10px; text-align:left; } .panels{padding:0!important;} .panels .col-sm-6 p{ padding: 10px 17px 0 0px;} .panels .col-sm-6 .videoLinks{ padding: 8px 17px 0 0px;} .panels img{width:100%;} .mobileFlip .flip{ background-color: #373635; color: #fff; background: #373635 url(/_layouts/15/MGSPCampaigns/img/open-content.png) no-repeat 9px; background-size: 13px; padding-left: 35px; } .flip{ cursor:pointer; background-color: #cbcccb; color: #fff; background: #cbcccb url(/_layouts/15/MGSPCampaigns/img/open-content.png) no-repeat 9px; background-size: 13px; padding-left: 35px; } .selectedFlip{ background-color: #373635; color: #fff; background: #373635 url(/_layouts/15/MGSPCampaigns/img/close-content.png) no-repeat 9px; background-size: 13px; padding-left: 35px; } .flip:hover{ background-color: #373635; color: #fff; background: #373635 url(/_layouts/15/MGSPCampaigns/img/close-content.png) no-repeat 9px; background-size: 13px; padding-left: 35px; } .videoLinks a, .panels a{background: url(/_layouts/15/MGSPMetsaForestInternet/img/arrow.png) left top no-repeat transparent; line-height: 10px; padding-left: 15px; display: inline-block; margin-bottom: 6px;} .videoLinks a.brandvideo{background: url(/_layouts/15/MGSPCampaigns/img/video.png) left top no-repeat transparent; line-height: 10px; padding-left: 20px; display: inline-block; margin-bottom: 6px;} .panels { padding: 10px; display: none; background-color:transparent; } .textImage h1 img{width:10%} .textImage h1{font-size:45px;margin-bottom:20px;} .panels .col-sm-6 p{padding: 0 16px;} .videoLinks a{margin: 0 20px;} @media only print, screen and (min-width: 769px) { .textImage h1{font-size:80px;margin-bottom:20px;padding-top:10px;} .textImage h1 img{width:7%} .brandingTool{width:75%} .panels .col-sm-6 p { padding: 10px 17px 0 0px; } .videoLinks a{margin: 0;margin-bottom: 6px;} } @media only print, screen and (min-width: 992px) { .textImage h1{font-size:80px;margin-bottom:20px;margin-left:0;} .textImage h1 img{width:7%} .brandingTool{width:910px;} .panels .col-sm-6 p { padding: 10px 17px 0 0px; } .videoLinks a{margin: 0;margin-bottom: 6px;} } /*Brand Tool end*/ /*left navigation fix for updated chrome browsers*/ @media all and (-webkit-min-device-pixel-ratio:0) and (min-resolution: .001dpcm) { #sidenav ul li { position: relative; width: 100%; padding-left: 25px;display:flex; } #sidenav ul li a:before { content: '\2022'; color: #8f9190; text-align: center; font-size: 50px; display: block; width: 25px; height: 25px; position: absolute; z-index: 2; left: 0; background-color: #7f7f7f; background-color: rgba(0,0,0,0.6); } } .imgWrappeSnippet p{text-align:justify;margin:0;} /*jumbotron full width youtube*/ .jumboyoutubeiframe{max-width:1458px;margin:auto;display:none} #jumboiframe{position:absolute;width:100%;height:100%;max-width:1458px!important;top:0;} /*jumbotron full width youtube end*/ .jumboyoutubeclicked img{visibility: hidden;} .jumbotron .container-fluid img { position: relative; width: auto; height: auto; left: 0!important; right: 0; } .GDPRTexts a { color: #8fd400!important; text-decoration: underline; } .borderTopDotted { border-top: 1px dotted #c7c7c7; } .marginTop20 { margin-top: 20px; } @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) { .MwCustomIFrame{height:611px!important;} }