/**
 * If using a CSS pre-processor, tell it to overwrite this file. If not, place
 * your custom CSS modifications here.
 */
body { font-family: 'Work Sans', Arial, sans-serif; font-size: 17px; color:#000; margin-top: 0!important; } 
td, th { vertical-align: top!important; }
td img { padding: 15px 15px; }
.field--type-text-long img.align-right { padding: 15px 0 15px 15px; }
.field--type-text-long img.align-left { padding: 15px 15px 15px 0px; }
h1 { border: 0!important; font-family: 'Lato', Arial, sans-serif; font-size: 4em; font-weight: bold; }
.path-frontpage .page-header { display: none; }
.page-header { position: absolute; z-index: 9; left: 50%; top: 250px; text-shadow: 1px 2px 10px rgba(0, 0, 0, 1); }
.page-header span { position:relative; left: -50%; top: 60%; display:block; color: #fff; }
.page-node-type-laskeudu #navbar { display: none; }
h2 { color: #fab814; font-weight: 600; font-size: 2.5em; margin-bottom: 25px; }
h2.title { position: relative; padding-bottom: 20px; }
h2.title.text-align-center { font-size: 4em; }
h2.title::after {
	content:" ";
	position: absolute;
    width: 150px;
    height: 1px;
    bottom: 0;
    left: 0%;
    border-bottom: 5px solid #fab814;
}
h2.title.text-align-center::after { left: 45%; border-width: 8px; }
a:focus { outline: 1px solid #000; }
article a { text-decoration: underline; }
.row { margin-left: 0; margin-right: 0; }
p { margin: 0 0 20px; }
.breadcrumb { display: none; }
#block-highcontrast { position: absolute; right: 15px; top: 15px; background: #fff; padding: 10px; }
.highlighted { position: absolute; right: 0; top: 0; z-index: 9; background: #fff; } 
.btn { color: #000!important; }

.container { width: 100%!important; margin: 0; padding: 0; overflow-x: hidden; }
section.col-sm-12 { padding: 0; z-index: 1;  }
.row > div.col-sm-12 { padding: 0; z-index:2; background: rgba(255,255,255, 0.9); }
.logo { margin: 25px; }

.navbar-container { max-width: 100%!important; }
.navbar-default { background-color: transparent!important; border: none!important; }
#navbar { margin: 25px auto 0 auto; overflow-x: visible!important; }
#navbar li.sf-depth-1 a { color: #000; font-size: 22px; font-weight: 600; }
#navbar li.sf-depth-1 > ul { background: #fff; margin-top: 15px; padding: 20px 5px; }
#navbar li.sf-depth-1 > ul li a { padding: 5px 25px; }

.field--type-text-with-summary, .field--type-text-long { max-width: 1180px; margin: 50px auto; }

.field--name-field-ylakuva { margin-bottom: 30px; min-width: 100%; } 
.field--name-field-ylakuva img { min-width: 100%; }

.view-laskeutumissivun-nosto { position: relative; }
.view-laskeutumissivun-nosto .views-field-body { position:absolute; width: 100%; top: 360px; }
.view-laskeutumissivun-nosto .views-field-body > div { max-width: 1180px; margin: auto; color: #fff; text-shadow: 1px 2px 10px rgba(0,0,0, 1); font-size: 1.1em; }
.view-laskeutumissivun-nosto .views-field-body a { color: #fff; }

#block-contactblock { position: absolute; top: 350px; width: 370px; left: 55%; margin: auto; }
#block-contactblock > form { margin: auto; color: #fff!important; }
#block-contactblock #edit-preview { display: none!important; }

#block-simpleinstagramfeed, #block-instagramiframe { max-width: 1080px; margin: auto; text-align: center; padding: 30px; }

.view-nostot, .view-display-id-block_2 { max-width: 1080px; margin: auto; text-align: center;  }
.view-nostot .view-content { }
.view-nostot .views-row, .view-display-id-block_2 .views-row { display: inline-block; vertical-align: top; width: 30%; padding-top: 7.5px; padding-bottom: 7.5px; }
.view-nostot .views-row a, .view-display-id-block_2 .views-row a { color: #fff; text-decoration: none;  }
.view-nostot .nostolaatikko, .view-display-id-block_2 .nostolaatikko { position: relative; overflow: hidden;  }
.view-nostot .views-row:nth-child(3n) .nostolaatikko, .view-display-id-block_2 .views-row:nth-child(3n) .nostolaatikko { margin-left: 10px; }
.view-nostot .views-row:nth-child(3n - 1) .nostolaatikko, .view-display-id-block_2 .views-row:nth-child(3n - 1) .nostolaatikko { margin-right: 5px; margin-left: 5px;}
.view-nostot .views-row:nth-child(3n - 2) .nostolaatikko, .view-display-id-block_2 .views-row:nth-child(3n - 2) .nostolaatikko { margin-right: 10px; }
.view-nostot .nostolaatikko figure { }
.view-nostot .nostolaatikko img, .view-display-id-block_2 .nostolaatikko img { width: 100%; height: 100%; }
.view-nostot .nostolaatikko .nostotitle, .view-display-id-block_2 .nostolaatikko .nostotitle { position: absolute; top: 45%; left: 0; width: 100%; padding: 10px 10px; line-height: 1.2em; text-align: center; font-size: 26px; font-weight: bold; text-shadow: 1px 2px 10px rgba(0,0,0, 1); }
.view-nostot .views-row a:hover .nostotitle, .view-nostot .views-row a:focus .nostotitle,
.view-display-id-block_2 .views-row a:hover .nostotitle, .view-display-id-block_2 .views-row a:focus .nostotitle { background: #000; }

.path-frontpage article { padding: 50px 0; }
.kuvalinkki { color: #000; padding: 10px 20px; font-weight: 600; background: #fff; text-shadow: none; border-radius: 5px; margin: 15px; display: inline-block; }
article .kuvalinkki { background: #fab814; text-decoration: none; }
.kuvalinkki:hover, .kuvalinkki:focus { text-decoration: underline; }
.view-slideshow > div { position: relative; }
#views_slideshow_cycle_main_slideshow-block_1 .views_slideshow_cycle_teaser_section { min-width: 100%; height: 90vh!important; overflow:hidden; } 
.views_slideshow_cycle_slide { min-width: 100%; }
.views_slideshow_cycle_slide img { width: 100%; }
.views_slideshow_slide .views-field-field-kuvaus { position: absolute; top: 0; width: 100%; height: 100%; text-align: center; }
.views_slideshow_slide .views-field-field-kuvaus > .field-content { text-align: center; color: #fff; text-shadow: 1px 2px 10px rgba(0, 0, 0, 1); font-size: 24px; font-weight: 600; }
.views_slideshow_slide .views-field-field-kuvaus > .field-content h1 { margin-top: 10%; color: #fff; }
.views_slideshow_slide .views-field-field-kuvaus > .field-content > div, .views_slideshow_slide .views-field-field-video > .field-content { width: 100%; height: 100%; }
.views_slideshow_slide .views-field-field-video > .field-content video,
.views_slideshow_slide .views-field-field-kuvaus > .field-content iframe { 
	position: absolute;
    left: 50%;
    top: 50%;
    width: 100%!important;
    height: 56.25vw!important;
    min-height: 100%;
    min-width: 177.77vh;
    -webkit-transform: translate(-50%,-10%);
    -ms-transform: translate(-50%,-10%);
    transform: translate(-50%,-10%);	
}
.views-slideshow-controls-bottom { position: absolute; bottom: 20px; z-index: 9; text-align: center; width: 100%; }
.views-slideshow-controls-bottom .views_slideshow_controls_text { color: #000;  }
.views-slideshow-controls-bottom a { color: transparent!important; margin: 0 10px; padding: 15px;  text-shadow: none; border-radius: 5px; display: inline-block;  }
.views-slideshow-controls-bottom a:focus, .views-slideshow-controls-bottom:hover a { color: #000!important; background: rgba(255,255,255,0.8); }
.views-slideshow-controls-bottom .views-slideshow-pager-bullets li { background: #fff!important; border: 1px solid #333; }
.views-slideshow-controls-bottom .views-slideshow-pager-bullets li.active { background: #fab814!important; }
.views_slideshow_controls_text_pause { display: none; }
.view-display-id-block_2 .views_slideshow_cycle_slide { min-width: 100%; min-height: 100px;   }
.view-display-id-block_2 .views_slideshow_cycle_slide img { min-width: 314px; min-height: 314px; }
.view-display-id-block_2 .views-slideshow-controls-bottom { bottom: 0px; position: relative; }
.view-display-id-block_2 .views-slideshow-controls-bottom a { color: #000!important; background: #eee; }
.views-slideshow-controls-text-status-pause a { display: none!important; }

.footer { margin-top: 80px!important; background: #fab814; }
.region-footer { max-width: 1180px; margin: auto; color: #fff; }
.region-footer h2 { color: #fff; font-size: 3em; }
.region-footer a { color: #000; }

/*cookie banneri */
.eu-cookie-withdraw-tab { left: auto; right: 5px; opacity: 1; border-radius: 0!important; }
.eu-cookie-compliance-message p { font-size: 1em; font-weight: normal; }
.eu-cookie-compliance-secondary-button { font-weight: bold; background: #fff; color: #000; }
.eu-cookie-compliance-message h2 { font-size: 20px; margin-top: 20px;} 
.eu-cookie-compliance-banner button { border-radius: 0px!important; min-height: 44px; box-shadow: none;  }
.eu-cookie-compliance-banner button:hover, .eu-cookie-compliance-banner button:focus {
	color: #000!important; outline-color: #fff!important;
}
button.eu-cookie-compliance-save-preferences-button,
button.eu-cookie-withdraw-button,
button.agree-button { color: #000!important; text-shadow: none !important; }
button.eu-cookie-compliance-save-preferences-button:hover,
button.eu-cookie-withdraw-button:hover,
button.agree-button:hover { color: #000!important; text-shadow: none !important;}
.eu-cookie-compliance-banner input[disabled],
#cookie-category-valttamattomat { background-color: #eee!important; opacity: 1!important; color: #000!important; }
.eu-cookie-compliance-banner input[type="checkbox"] { width: 34px; height: 34px; }
.eu-cookie-compliance-buttons { float: left; }
.eu-cookie-compliance-banner .eu-cookie-compliance-more-button { padding: 5px; min-height: 24px; }
.eu-cookie-compliance-more-button:hover, .eu-cookie-compliance-more-button:focus,
.eu-cookie-compliance-save-preferences-button:hover, .eu-cookie-compliance-save-preferences-button:focus,
.eu-cookie-compliance-default-button:focus, .eu-cookie-compliance-default-button:hover { outline: 1px solid #000; color: #000!important; background: #bababa; }
#sliding-popup > button { background: #000!important; color: #fff!important; border-radius: 0!important; }
#sliding-popup > button:hover, #sliding-popup > button:focus { background: #bababa!important; color: #000!important; }
.eu-cookie-compliance-status-2 #addtoany-block .block__title,
.eu-cookie-compliance-status-2 #addtoany-block .ext { display: none; }
.eu-cookie-compliance-categories label { font-weight: normal; }
/*cookie banneri */

@media screen and (max-width: 1500px) {

	#navbar li.sf-depth-1 a { font-size: 18px; }
}

@media screen and (max-width: 1320px) {
	#navbar { margin-left: 180px; width: auto!important; }
	.views_slideshow_slide .views-field-field-kuvaus > .field-content h1 { font-size: 3em; }
}
@media screen and (max-width: 1200px) {
	#navbar { margin-top: 30px; }
	#navbar li.sf-depth-1 a { font-size: 18px; }
	h1 { font-size: 2.8em!important; }
	h2, h2.title, .region-footer h2 { font-size: 1.8em!important; }
	.field--type-text-with-summary, .field--type-text-long { padding: 0 25px; }
	.view-nostot .views-row, .view-display-id-block_2 .views-row { width: 30%; }
	#navbar li.sf-depth-1 a { padding: 10px; }
}
@media screen and (max-width: 1024px) {
	#block-highcontrast { top: 0; padding: 4px 10px; }
	.nostolaatikko .nostotitle, .views-row a:focus .nostotitle { font-size: 18px; }
	.row > div.col-sm-12 { background: #fff; }
	section .region-content {  }
	.page-header { top: 150px; }
	.views_slideshow_slide .views-field-field-kuvaus { top: 5%; }
	.views_slideshow_slide .views-field-field-kuvaus > .field-content { font-size: 18px; }
	iframe { max-width: 100%!important; }
	

}
@media screen and (max-width: 768px) {
	#navbar { margin-left: 0px; margin-right: 15px; margin-top: 40px;  }
	.row > div.col-sm-12 { width: 100%; background: #fff; }
	h1 { font-size: 30px!important; }
	h2, h2.title, .region-footer h2 { font-size: 22px!important; }
	.navbar-collapse.in { overflow-y: visible!important; }
	.page-header { top: 50px; }
	article .field img.align-right, article .field img.align-left { max-width: 50%; height: auto;}
	h2.title::after { width: 80px; }
	h2.title.text-align-center::after { left: 40%; }
	.view-nostot .nostolaatikko .nostotitle, .view-display-id-block_2 .nostolaatikko .nostotitle { font-size: 18px; line-height: 1.1em; }
	#block-highcontrast { top: -30px; }
	section .region-content { margin-top: 0; }
	#navbar li.sf-depth-1 > ul { margin-top: 0; }
	#views_slideshow_cycle_main_slideshow-block_1 .views_slideshow_cycle_teaser_section { min-width: 100%; height: 200px!important;  }
	
	/*cookie banneri */
	.eu-cookie-compliance-banner { font-size: 14px; line-height: 15px; }
	.eu-cookie-compliance-banner button { font-size: 14px; }
	.eu-cookie-compliance-categories-buttons { max-width: 100%; }
	.eu-cookie-compliance-banner--categories .eu-cookie-compliance-buttons { width: 100%; float: none; margin: 5px 0; }
	.eu-cookie-compliance-popup-open #sliding-popup { max-height: 100%; overflow: auto; }
	.eu-cookie-compliance-popup-open .eu-cookie-withdraw-tab { transform: initial!important; }
	.eu-cookie-compliance-popup-open .eu-cookie-compliance-banner { padding-top: 20px; }
	/*cookie banneri */
	
}
@media screen and (max-width: 600px) {
	ul.sf-menu li.sf-depth-1 { width: 100%; border-bottom: 1px solid #333; }
	ul.sf-menu li.sf-depth-1 ul { border: 0; padding-left: 28px!important; }
	.view-nostot .views-row, .view-display-id-block_2 .views-row { width: 49%; padding: 0 0 5px 0!important; }
	.nostolaatikko { margin: 0!important; }
	.view-nostot .views-row, .view-display-id-block_2 .views-row { }
	.view-display-id-block_2 .views_slideshow_cycle_slide img { min-width: auto; min-height: auto; }
	#views_slideshow_cycle_main_slideshow-block_1 .views_slideshow_cycle_teaser_section {  }

}
@media screen and (max-width: 390px) {
	article .field img.align-right, article .field img.align-left { max-width: 100%; width: 100%; margin: 10px 0; height: auto; display: block; padding: 15px 0;}
}