/*

Theme Name: Huoltohistoria

Theme URI: https://www.huoltohistoria.fi

Author: JJ-Net Group Oy

Author URI: http://www.jj-net.fi

Description: Huoltohistorian kotisivut

Version: 1.0

License: GNU General Public License v2 or later

License URI: http://www.gnu.org/licenses/gpl-2.0.html

*/
body { background-color:#7e7f7e; }
.wrapper {background-color:#fff; }

header .topsection-container { background-color:#282828; padding:10px 0; position:relative; }
header .mainnavigation a { color:#5baf54; display:block; padding:15px 0; font-size:18px; font-weight:bold; }
header .mainnavigation { text-align:right; }
header .mainnavigation ul { margin:0; padding:0; }
header .btn-mobilenavi { position:absolute; z-index:15; top:14px; right: 15px; display:none; border-radius:4px; border: 1px solid #5baf54; color:#5baf54; cursor:pointer; padding:4px 7px; }
header .btn-mobilenavi > .icon:after { font-style:normal; font-family:"FontAwesome"; content:"\f0c9"; font-size:22px; }

.language-select { position:relative; width:100%; color:#5baf54; }
.language-select .language-select-title { cursor: pointer; padding: 17px 0 16px; display:block; font-weight:bold; }
.language-select-title:after { font-family: FontAwesome; top:0;  padding-left:10px; content: "\f0d7"; color:#fff; }
.language-select ul.language-select-list { margin:0; padding:0; list-style:none; display:none; position:absolute; left:-5px; top:45px; z-index:3000; background-color:#282828; width:100%; color:#5baf54; }
.language-select ul.language-select-list a { display:block; padding:3px 5px; white-space:nowrap; color:#5baf54; text-decoration:none; font-weight:bold; }
.language-select ul.language-select-list a:hover, .language-select ul.language-select-list a:focus, .language-select ul.language-select-list a:active { text-decoration:underline; font-weight:bold; color:#5baf54; }
#language-checkbox:checked + ul { display:block; }
#language-checkbox { position: absolute; clip: rect(0, 0, 0, 0); }

/*Carousel*/
.mainbanner-container { background-color:#343434; height:900px; border-top:2px solid #5baf54; border-bottom:3px solid #5baf54; }

.mainbanner-container .carousel { height: 100%; position:relative; }
.mainbanner-container .carousel .carousel-inner { height: 100%; position:relative; }
.mainbanner-container .carousel .carousel-inner .item { height: 100%; width:100%; background-position: center center; background-size: cover; position:absolute; top:0; left:0; z-index:1000; }
.mainbanner-container .carousel .carousel-caption { top:35%; }
.mainbanner-container .carousel .carousel-caption .carousel-caption-text {}
.mainbanner-container .carousel .carousel-caption h2 { color:#fff; text-align:left; margin:0; padding:0; line-height:60px; font-weight:700; font-size:48px; text-shadow:2px 3px 5px #000; text-shadow: 2px 3px 5px rgba(0,0,0,0.9); }
.mainbanner-container .carousel .left, .mainbanner-container .carousel .right { position:absolute; top:50%; height:100%; width:50px; text-align:center; font-size:60px; color:#282828; }
.mainbanner-container .carousel .left { z-index:2000; left:20px; }
.mainbanner-container .carousel .right { z-index:2001; right:20px; }

/*Flexible contents*/
.content-container-icongroup { padding:30px 0; }
.content-container-icongroup h1 { margin:0; padding:0 0 30px 0; color:#5baf54; }
.content-container-icongroup .icongroup-desc { font-size:18px; color:#000; }
.content-container-icongroup .icons { padding-top:30px; }
/*.content-container-icongroup .icons a.icon { display:block; margin-bottom:15px; height:150px; border:4px solid #dee0de; border-radius:15px; background-repeat:no-repeat; background-position:center 40px; text-align:center; text-decoration:none; -webkit-transition: all 0.2s ease-in; -moz-transition: all 0.2s ease-in; -o-transition: all 0.2s ease-in; -ms-transition: all 0.2s ease-in; transition: all 0.2s ease-in; }
*/
.content-container-icongroup .icons a.icon { display:table; width:100%; margin-bottom:15px; height:150px; border:4px solid #dee0de; border-radius:15px;  text-decoration:none; -webkit-transition: all 0.2s ease-in; -moz-transition: all 0.2s ease-in; -o-transition: all 0.2s ease-in; -ms-transition: all 0.2s ease-in; transition: all 0.2s ease-in; }
.content-container-icongroup .icons a.icon > span { display:table-row; }
.content-container-icongroup .icons a.icon > span:first-child > span { height:98px; }
.content-container-icongroup .icons a.icon > span > span { display:table-cell; vertical-align:middle; text-align:center; }
.content-container-icongroup .icons a.icon h3 { display:inline; font-size:16px; font-weight:bold; text-transform:uppercase; color:#5baf54; }
.content-container-icongroup .icons a.icon:hover { border-color:#5baf54; }
.content-container-icongroup .icons a.icon:hover h3 { color:#333; }

.content-container-productboxes { padding:30px 0 50px 0; background-color:#efefef; position:relative; }

.content-container-productboxes .row-eq-height > .col-md-4 { display:flex; float:none; }
.content-container-productboxes .productbox { display: -webkit-flex; display: -ms-flexbox; display: flex; -ms-flex-direction: column; -webkit-flex-direction: column; flex-direction: column; }
.content-container-productboxes .productbox .productbox-content { -ms-flex: 1 1 auto; -webkit-flex: 1 1 auto; flex: 1 1 auto; font-size:14px; background-color:#fff; }
.content-container-productboxes .productbox .productbox-htext, .content-container-productboxes .productbox .productbox-price, .content-container-productboxes .productbox .productbox-link { background-color:#fff; }
.content-container-productboxes .productbox .productbox-title {}
.content-container-productboxes .productbox .productbox-title h3 { text-align:center; padding:10px; color:#fff; text-transform:uppercase; font-size:18px; font-weight:700; margin-top:0; }
.content-container-productboxes .productbox .productbox-desc { padding:15px; min-height:180px; height:auto !important; height:180px; }
.content-container-productboxes .productbox .productbox-desc p { margin:0; padding:0; }
.content-container-productboxes .productbox .productbox-htext { padding:15px; font-weight:bold; text-align:center; }
.content-container-productboxes .productbox .productbox-price { text-align:center; font-size:18px; padding:10px 0; }
.content-container-productboxes .productbox .productbox-link { text-align:center; padding-bottom:10px; }
.content-container-productboxes .productbox .productbox-link > a { font-size:16px; }

.content-container-productboxes .productbox .productbox-arrow { position:relative; background:url('./images/bg-box.png') no-repeat center bottom; height:30px; }
/*
.content-container-productboxes .productbox .productbox-arrow .productbox-arrow1 { position:absolute; left:0; top:2px; z-index:1000; -webkit-transform:rotate(360deg); border-style: inset; width: 0; height: 0; border-style: solid; border-width: 20px 150px 0 150px; border-color: #ddd transparent transparent transparent; }
.content-container-productboxes .productbox .productbox-arrow .productbox-arrow2 { position:absolute; left:0; top:0; z-index:1001; -webkit-transform:rotate(360deg); border-style: inset;  width: 0; height: 0; border-style: solid; border-width: 20px 150px 0 150px; border-color: #fff transparent transparent transparent; }
*/
.content-container-embed { padding:30px 0; background-color:#e2e2e2; }
.content-container-embed .desc { font-size: 18px; }
.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; height: auto; margin: 25px 0; }
.embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

.content-container-cases { position:relative; text-align:center; height:250px; color:#000; }
.content-container-cases .container { position:relative; }
.content-container-cases h2 { color:#5baf54; padding-bottom:10px; }
.content-container-cases .case-writer { padding-top:20px; }
.content-container-cases i { color:#5baf54; font-size:60px; }
.content-container-cases { position:relative; }
.content-container-cases .fa-chevron-left { position:absolute; left:0; top:80px; }
.content-container-cases .fa-chevron-right { position:absolute; right:0; top:80px; }

/*Subpages*/
.subpage-navi-container { background-color:#494949; border-top:2px solid #5baf54; }
.subpage-navi-container .subnavigation ul { margin:0; padding:0; text-align:center; }
.subpage-navi-container .subnavigation ul a { color:#fff; padding:5px 25px; display:block; }
.subpage-navi-container .subnavigation ul a:hover, .subpage-navi-container .subnavigation ul .current-menu-item a { background-color:#5baf54; }
.subpage-navi-container .subnavigation ul.list-inline > li { padding:0; }

.subpage-title-container > .container { text-align:center; }
.subpage-title-container > .container { text-align:center; }
.subpage-title { margin:0 auto; width:auto; display:inline-block; padding:5% 2%; }
h1.title-icon { background-repeat:no-repeat; background-position:2% center; padding:15px 65px 15px 130px; text-align:left; border-bottom:2px solid #5baf54; }

.ingres-container h3 { font-size:20px; line-height: 1.35; }

.column-container { padding:3% 0; }
.column-container-white { background-color:#fff; }
.column-container-grey { background-color:#efefef; }

.btn-primary { background-color:#2a98db; border-color:#2a98db; }

footer { padding:15px 0; color:#ccc; font-size:14px; }
footer .footer-logo { margin-top: 17px; }
footer ul.some-feeds { margin-bottom:0; margin-top:15px; }
footer ul.some-feeds li a { border-radius: 50%; width:60px; height:60px; background-color:#585959; display:block; text-align:center; padding-top:10px; font-size:30px; color:#7e7f7e; }
footer ul.some-feeds li a:hover { color:#fff; background-color:#585959;  }
footer ul.links { list-style:none; margin:0; padding:0; }
footer ul.links > li > a { color: #ccc; }
footer ul.links > li > a:focus, footer ul.links > li > a:hover, footer ul.links > li > a:active { color: #fff; text-decoration:none; }

/*Fonts*/
body { font-family: 'Lato', sans-serif; font-size:16px; font-weight:400; }

h1 { font-size:34px; font-weight:700; }
h2 { font-size:34px; font-weight:700; color:#282828; }
h3 { font-size:28px; letter-spacing:0.75px; }
h4 { font-size:16px; letter-spacing:2px; }

/*Others*/
.row-eq-height { display:-webkit-box; display:-webkit-flex; display:-ms-flexbox; display:flex; }

@media (max-width:1199px) {
	.subnavigation > ul { display:flex; position:relative; width:100%; flex-wrap: wrap; justify-content: center; }
	.subnavigation > ul > li { display:flex; flex-basis: 25%; }
}

@media (min-width:992px) {
	.col-md-offset-1-5 { margin-left: 12.5%; }
	.topsection-container .col-md-8, .topsection-container .col-md-1 { height: auto !important; }
}

@media only screen and (max-width : 991px) {
	header .btn-mobilenavi { display:block; }
	header .btn-mobilenavi.mobilenavi-on > .icon { padding: 0 0.8px; }
	header .btn-mobilenavi.mobilenavi-on > .icon:after { content:"\f00d"; }
	.topsection-container .col-md-8, .topsection-container .col-md-1 { height:0; transition:height 0.5s; overflow:hidden; text-align:center; }
	.topsection-container .col-md-8 .list-inline, .topsection-container .col-md-1 .language-select-list { text-align:center; }
	.topsection-container .col-md-8 .list-inline > li, .topsection-container .col-md-1 .language-select-list > li { display:block; }
	.topsection-container .col-md-8 .list-inline > li > a, .topsection-container .col-md-1 .language-select-list > li > a { display: inline-block; padding: 5px 0; margin: 5px 0; }
	.topsection-container .col-md-8 .list-inline > li:after, .topsection-container .col-md-1 .language-select-list > li > a:after { content: "\a"; white-space: pre; }
	.topsection-container .col-md-3 > a > img { max-width:220px; }
	.topsection-container .col-md-1 .language-select-title { display:none; }
	.topsection-container .col-md-1 .language-select-list { display:block; position:static; }
	
	.content-container-cases > .container { padding:0 50px; }
	
	footer { text-align:center; }
	footer .footer-logo a { display:inline-block; margin:0 auto; }
	footer .row > div { margin: 10px 0; }
}
@media only screen and (max-width : 768px) {
	.content-container-productboxes .productbox .productbox-arrow { height:50px; }
	.content-container-cases .case-carousel { padding:0 50px; }
	.content-container-cases .fa-chevron-left, .content-container-cases .fa-chevron-right { top:80px; }
	.content-container-cases .fa-chevron-left { left:0; }
	.content-container-cases .fa-chevron-right { right:0; }
	.wrapper-front { padding-bottom:150px; }
	footer { text-align:center; }
	.subnavigation ul { display:block; }
	.subnavigation ul li { display:block; }
	.subpage-title { width:98%; padding:2%; }
	h1.title-icon { padding-left:10px; font-size:24px; background-size:50px; }
	.mainbanner-container { height:500px; }
	.mainbanner-container .carousel .carousel-caption h2 { font-size:36px; line-height:40px; }
	
	.row-eq-height { display:block; }
	
	.content-container-productboxes .row-eq-height, .content-container-productboxes .row-eq-height > .col-md-4, .content-container-productboxes .productbox, .content-container-productboxes .productbox .productbox-content { display:block; }
	.content-container-productboxes .row-eq-height > .col-md-4 { margin-bottom:35px; }
}
@media only screen and (max-width : 480px) {
	.wrapper { overflow:hidden; }
	.content-container-cases > .container { padding:0 15px; }
	.content-container-cases .left, .content-container-cases .right { display:none !important; }
}