/*
Theme Name: SmileSpa
Theme URI: http://oskarioksanen.fi/
Author: Oskari Oksanen
Author URI: http://oskarioksanen.fi
Description: Custom template built on Underscores (http://underscores.me/) and Foundation 6 (http://foundation.zurb.com/)
Version: 1.0
Text Domain: smilespa
*/


/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Elements
# Header
# Footer
# Typography
	## Lists
# Forms
# Navigation
	## Links
	## Menus
# Accessibility
# Alignments
# Content
	## Posts and pages
	## ACF content blocks
# Media
	## Video Embeds
	## Captions
# Helpers
--------------------------------------------------------------*/


/*--------------------------------------------------------------
# Elements
--------------------------------------------------------------*/


html {
    position: relative;
    min-height: 100%;
}

body {
    background-color: #fff;
    background-position: bottom right;
    background-repeat: no-repeat;
    /* Uncomment for sticky footer | body bottom-margin = footer height */
    margin: 0; 
    min-height: 100%;
    overflow-x: hidden;
}
body.page-template-page-contact {
	background-image: none;
}

#page {
    padding-bottom: 2rem;
}

@media screen and (min-width: 40em) {
    body {
        /* Uncomment for sticky footer | body bottom-margin = footer height */
        /*margin: 0 0 14.2rem; */
    }
}
@media screen and (min-width: 64em) {
    body {
        /* Uncomment for sticky footer | body bottom-margin = footer height */
        /*margin: 0 0 14.2rem; */
    }
}


/*--------------------------------------------------------------
# Header
--------------------------------------------------------------*/

#masthead {
    background-color: rgba(255, 255, 255, 0.92);
    padding-top: 0.625rem;
    padding-bottom: 0.625rem;
    width: 100%;
    z-index: 1;
}
#home-link {
	display: inline-block;
}
#header-logo {
    height: 2.5rem;
    width: auto;
}

@media screen and (min-width: 40em) {
    #masthead {
        padding-bottom: 0.9375rem;
        padding-top: 0.9375rem;
    }
    #header-logo {
        height: 3rem;
    }
}

@media screen and (min-width: 72em) {
    #masthead {
        background-color: rgba(255, 255, 255, 0.92);
        padding-bottom: 1rem;
        padding-top: 1rem;
        transition: all 0.35s ease-in-out;
        /*transition-delay: .5s;*/
    }
    .home #masthead {
        background-color: rgba(255, 255, 255, 0);
        /*transition-delay: .5s;*/
    }
    .home #masthead.is-stuck {
        background-color: rgba(255, 255, 255, 0.92);
    }
	#masthead.is-stuck #header-logo {
		/*height: 3.4rem;*/
	}
}


/*--------------------------------------------------------------
# Footer
--------------------------------------------------------------*/

footer#colophon {
    background-color: #f7f5f5;
    background-position: 0 0, top right;
    background-repeat: no-repeat, no-repeat;
    border-top: 0.5rem solid #d7d1d3;
    color: #999597;
    float: left;
    height: auto;
    padding: 2.5rem 0 1.5rem;
    width: 100%;
}
footer#copyright {
    background-color: #f7f5f5;
    border-top: 1px solid #d7d1d3;
    color: #999597;
    float: left;
    height: auto;
    padding: 1rem 0;
    width: 100%;
}
/*footer#colophon > .row > .column,
footer#colophon > .row > .columns {
    padding-bottom: 0.5rem;
}*/
footer .column,
footer .columns {
    padding-bottom: 1.5rem;
}
footer .column:last-child,
footer .columns:last-child {
    padding-bottom: 0;
}
footer a.some {
    margin-right: .6rem;
}
footer a.some:last-child {
    margin-right: 0;
}
footer .logo {
    margin-bottom: .6rem;
    max-width: 80%;
    width: 8rem;
}
footer .icons img {
    max-height: 9.375rem;
    margin-left: 1rem;
}
footer .icons img:first-child {
    margin-left: 0;
}
footer .social {
    margin: 1.5rem 0;
}

@media screen and (min-width: 40em) {
    footer#colophon {
        /* Uncomment for sticky footer | body bottom-margin = footer height */
        /*bottom: 3.2rem;
        height: 11rem;
        left: 0;
        position: absolute;*/
        /* End sticky footer styles */
    }
    footer#copyright {
        /* Uncomment for sticky footer | body bottom-margin = footer height */
        /*bottom: 0;
        height: 3.2rem;
        left: 0;
        position: absolute;*/
        /* End sticky footer styles */
    }
}


/*--------------------------------------------------------------
# Typography
--------------------------------------------------------------*/

body, input, select, textarea {
    color: #2b2527;
    font-family: 'Raleway', sans-serif;
    font-size: 18px;
    font-size: 1.125rem;
    font-weight: 300;
    line-height: 1.75;
}

#page > footer {
    font-size: 1rem;
}

h1, h2, h3, h4, h5, h6 {
    clear: both;
    color: #dd0067;
    font-family: 'Raleway', sans-serif;
    font-weight: 300;
    text-transform: uppercase;
}
.landingpage .intro h1,
.landingpage .intro h2,
.landingpage .intro h3,
.landingpage .intro h4,
.landingpage .intro h5,
.landingpage .intro h6 {
    text-transform: none;
}
h1:focus, 
h2:focus, 
h3:focus, 
h4:focus, 
h5:focus, 
h6:focus {
    outline: none;
}

#page > footer h1, 
#page > footer h2, 
#page > footer h3, 
#page > footer h4, 
#page > footer h5, 
#page > footer h6 {
    color: #999597;
    text-transform: none;
}

h1 {
    line-height: 1.4;
    margin-bottom: 1.5rem;
}

h2 {
    line-height: 1.4;
    margin-bottom: 1.25rem;
}

h3 {
    line-height: 1.4;
    margin-bottom: 1rem;
}

.article h3 {
    font-size: 1.1875rem;
    text-transform: none;
}

.webshop-product h3 {
    color: #2d2b28;
    font-size: 1.1875rem;
    font-weight: 700;
    text-transform: none;
}

h4 {
    line-height: 1.4;
    margin-bottom: 1rem;
}

h5 {
    line-height: 1.4;
    margin-bottom: 1rem;
}

#page > footer h5 {
    font-size: 1rem;
    letter-spacing: 0.015rem;
}

h6 {
    line-height: 1.4;
    margin-bottom: 1rem;
}

#page > footer h6 {
    font-size: 1rem;
    letter-spacing: 0.015rem;
}


p + h1,
p + h2,
p + h3,
p + h4,
p + h5,
p + h6,
ul + h1,
ul + h2,
ul + h3,
ul + h4,
ul + h5,
ul + h6,
ol + h1,
ol + h2,
ol + h3,
ol + h4,
ol + h5,
ol + h6 {
    margin-top: 2rem;
}

p {
    font-family: 'Raleway', sans-serif;
    line-height: 1.5;
    margin-bottom: 0.75em;
}
.landingpage .intro p {
    font-size: 1.25rem;
}
.pricelist td.info p {
    color: #999597;
    font-size: 0.9rem;
}
form p {
    display: block;
    font-size: 1rem;
    clear: both;
    width: 100%;
}
p.copyright {
    font-size: 0.875rem;
    float: left;
    margin: 0;
}
p.product_price {
    color: #dd0067;
    font-size: 1.1875rem;
    line-height: 1;
}
p.product_price span {
    color: #999597;
    font-size: 0.875rem;
}
.landingpage .intro p.small {
    font-size: 0.875rem;
}

@media print, screen and (min-width: 40rem) {

    h1 {
        font-size: 2.25rem;
    }
    
    .intro h1,
    .intro h2 {
        font-size: 1.85rem;
        line-height: 1.2;
    }

    h2 {
        font-size: 1.875rem;
    }

    h3 {
        font-size: 1.5625rem;
    }

    .article h3,
    .webshop-product h3 {
        font-size: 1.35rem;
    }

    h4 {
        font-size: 1.25rem;
    }

    h5 {
        font-size: 1.125rem;
    }

    h6 {
        font-size: 1rem;
    }

    p.product_price {
        font-size: 1.5625rem;
    }

    p.product_price span {
        font-size: 1rem;
    }
}

@media screen and (min-width: 52em) {
    
    .intro h1,
    .intro h2 {
        font-size: 2.4rem;
    }

}

@media screen and (min-width: 64em) {

    h1 {
        font-size: 3rem;
    }
    
    .intro h1,
    .intro h2 {
        font-size: 2.8rem;
    }

    h2 {
        font-size: 2.5rem;
    }

    h3 {
        font-size: 1.9375rem;
    }

    .article h3,
    .webshop-product h3 {
        font-size: 1.5rem;
    }

    h4 {
        font-size: 1.5625rem;
    }

    h5 {
        font-size: 1.25rem;
    }

    h6 {
        font-size: 1.125rem;
    }

    p.product_price {
        font-size: 1.9375rem;
    }

    p.product_price span {
        font-size: 1.125rem;
    }
}

@media screen and (min-width: 80em) {
    
    .intro h1,
    .intro h2 {
        font-size: 3.4rem;
    }

}

dfn, cite, em, i {
    font-style: italic;
}

blockquote {
    margin: 0 1.5em;
}

address {
    margin: 0 0 1.5em;
}

pre {
    background: #eee;
    color: #2b2527;
    font-family: "Courier 10 Pitch", Courier, monospace;
    font-size: 15px;
    font-size: 0.9375rem;
    line-height: 1.6;
    margin-bottom: 1.6em;
    max-width: 100%;
    overflow: auto;
    padding: 1.6em;
}

code, kbd, tt, var {
    font-family: Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
    font-size: 15px;
    font-size: 0.9375rem;
}

abbr, acronym {
    border-bottom: 1px dotted #666;
    cursor: help;
}

mark, ins {
    background: #fff9c0;
    text-decoration: none;
}

big {
    font-size: 125%;
}
::selection {
    background: rgba(221,0,103,.175);
    /*color: #fff;*/
}
::-moz-selection {
    background: rgba(221,0,103,.175);
    /*color: #fff;*/
}


/*--------------------------------------------------------------
## Lists
--------------------------------------------------------------*/

.entry-content ul li {
    list-style-type: none;
}

.entry-content ul li::before {
    display: inline;
    content: "•";
    padding-right: 0.4rem;
}

li.orbit-slide::before {
    content: '';
    padding-right: 0;
}
ul#internal-links,
ul#related-links {
    list-style-type: none;
    margin: 0;
}


/*--------------------------------------------------------------
# Forms
--------------------------------------------------------------*/


/* Default buttons */

button, a.button, input[type="button"], input[type="reset"], input[type="submit"] {
    background-color: #dd0067;
    border: 1px solid;
    border-color: #dd0067;
    border-radius: 2rem;
    color: #fff;
    display: inline-block;
    font-weight: 400;
    line-height: 1;
    padding: 1em 2em;
    text-decoration: none;
    text-transform: uppercase;
    transition: all 0.2s ease-in-out;
}

button:hover, a.button:hover, input[type="button"]:hover, input[type="submit"]:hover {
    background-color: #dd0067;
    border: 1px solid #dd0067;
    color: #fff;
}

button:focus, a.button:focus, input[type="button"]:focus, input[type="submit"]:focus, button:active, a.button:active, input[type="button"]:active, input[type="submit"]:active {
    background-color: #dd0067;
    border: 1px solid;
    color: #fff;
}
a.button:visited:not(.ghost) {
    color: #fff;
}
button.ghost, a.button.ghost, input.ghost[type="button"], input[type="reset"], input.ghost[type="submit"], a.button.ghost:visited, .woocommerce a.button:visited {
    background-color: transparent;
    border-color: #dd0067;
    color: #dd0067;
}

button.ghost:hover, a.button.ghost:hover, input.ghost[type="button"]:hover, input[type="reset"]:hover, input.ghost[type="submit"]:hover {
    background-color: #dd0067;
    border-color: #dd0067;
    color: #fff;
}

button.ghost:focus, a.button.ghost:focus, input.ghost[type="button"]:focus, input[type="reset"]:focus, input.ghost[type="submit"]:focus, button:active, a.button:active, input.ghost[type="button"]:active, input[type="reset"]:active, input.ghost[type="submit"]:active {
    background-color: #dd0067;
    border-color: #dd0067;
    color: #fff;
}

.landingpage .intro a.button[href*="/ajanvaraus"] {
    background: url('img/icon-clock-white.svg') 1em 50% #dd0067 no-repeat;
    background-size: 24px;
    color: #fff;
    display: inline-block;
    font-size: 1.25rem;
    font-weight: 400;
    line-height: 1;
    margin: 1.5rem 0;
    padding: 0.875rem 1.25em 0.875rem 2.875em;
    text-transform: uppercase;
}

label {
    display: block;
    margin: 0;
    font-size: 1.125rem;
    font-weight: 300;
    line-height: 1.8;
    color: #2d2b28;
    float: left;
}

input[type="text"], input[type="email"], input[type="url"], input[type="password"], input[type="search"], input[type="number"], input[type="tel"], input[type="range"], input[type="date"], input[type="month"], input[type="week"], input[type="time"], input[type="datetime"], input[type="datetime-local"], input[type="color"], textarea {
    color: #2d2b28;
    border-radius: 2px;
    font-size: 1rem;
}

select {
    border: 1px solid #2d2b28;
    border-radius: 2px;
    height: auto;
}

input[type="text"]:focus, input[type="email"]:focus, input[type="url"]:focus, input[type="password"]:focus, input[type="search"]:focus, input[type="number"]:focus, input[type="tel"]:focus, input[type="range"]:focus, input[type="date"]:focus, input[type="month"]:focus, input[type="week"]:focus, input[type="time"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="color"]:focus, textarea:focus {
    color: #2d2b28;
}

textarea {
    width: 100%;
}


/*--------------------------------------------------------------
# Navigation
--------------------------------------------------------------*/


/*--------------------------------------------------------------
## Links
--------------------------------------------------------------*/

a {
    color: #dd0067;
    transition: all 0.2s ease-in-out;
}

a:visited {
    color: #dd0067;
}

a:hover, 
a:focus, 
a:active {
    color: #dd0067;
}

.pricelist td a,
.pricelist td a:visited,
.pricelist td a:hover,
.pricelist td a:focus,
.pricelist td a:active {
    color: #2b2527;
}
.webshop-product h3 a,
.webshop-product h3 a:visited,
.webshop-product h3 a:hover,
.webshop-product h3 a:focus,
.webshop-product h3 a:active {
    color: #2b2527;
}

ul#internal-links a,
ul#related-links a {
    padding-left: 1.15rem;
    position: relative;
    white-space: nowrap;
}
ul#internal-links a:before,
ul#related-links a:before {
    /*content: "→";*/
    bottom: 0.35rem;
    content: "\25B6";
    display: inline-block;
    font-size: 0.5rem;
    left: 0.15rem;
    position: absolute;
    transition: 0.2s all ease-in-out;
}
ul#internal-links a:hover:before,
ul#related-links a:hover:before {
    left: 0.35rem;
}

#page > footer a,
#page > footer a:visited {
    color: #999597;
    display: inline-block;
    line-height: 1.05;
}
#page > footer a:hover, 
#page > footer a:focus, 
#page > footer a:active {
    color: #2b2527;
}
#page > footer a[href^="tel:"],
#page > footer a[href^="mailto:"] {
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 0.9rem;
    padding-left: 1.5rem;
}
#page > footer a[href^="tel:"] {
    background-image: url('img/icon-tel.svg');
}
#page > footer a[href^="mailto:"] {
    background-image: url('img/icon-email.svg');
}

#page > footer .social a {
    border-bottom: 0 !important;
    margin-right: 0.5rem;
}
#page > footer .social a:last-child {
    margin-right: 0;
}

a.fb-icon-home {
    display: inline-block;
    line-height: 1;
    margin-left: 0.6rem;
    max-width: 1.75rem;
}
a.fb-icon-home img {
    margin-top: -0.5rem;
}

a.no-border,
a.no-border:hover {
    border-bottom: 0 !important;
}

a.oo-logo {
    border: 0 !important;
    display: inline-block;
    float: right;
    height: 1.75rem;
    width: 1.75rem;
    line-height: 1;
    outline: 0;
    margin-top: -0.35rem;
}

/* Scroll to top */

#scroll-top {
    /*background: url('img/icon-top.svg');*/
    bottom: 3rem;
    display: none;
    position: fixed;
    right: 1rem;
    z-index: 99999;
}
#scroll-top a {
    display: inline-block;
    -webkit-border-radius: 0.25rem;
    border-radius: 0.25rem;
    height: 3rem;
    opacity: 0.25;
    overflow: hidden;
    width: 3rem;
}
@media screen and (min-width: 40em) {
    #scroll-top {
        bottom: 3rem;
        height: 3rem;
        right: 3rem;
        width: 3rem;
    }
    #scroll-top a:hover {
        opacity: 0.75;
    }
}

/*--------------------------------------------------------------
## Menus
--------------------------------------------------------------*/

#site-navigation {
    clear: right;
    float: right;
    left: 0;
    position: absolute;
    width: 100%;
}

/* Foundation Motion UI animation properties */
#site-navigation .hinge-in-from-top.mui-enter{
    transition-duration:.25s;
    transition-timing-function:ease-in-out;
}
#site-navigation .hinge-out-from-top.mui-leave{
    transition-duration:.25s;
    transition-timing-function:ease-in-out;
}

ul#primary-menu {
	background-color: rgba(255, 255, 255, 0.98);
	box-shadow: 0px 6px 6px rgba(0, 0, 0, 0.05);
    display: none;
    margin: 0;
    padding: 1rem 0 2rem;
}
ul#primary-menu > li {
    margin: 0;
    display: inline-block;
    text-align: center;
    width: 100%;
}
ul#primary-menu > li:last-child {
    margin: 0.5rem 0;
}

ul#primary-menu > li a {
    border-bottom: 0;
    color: #2b2527;
    display: inline-block;
    font-family: 'Raleway', sans-serif;
    font-size: 0.9375rem;
    font-weight: 400;
    letter-spacing: 0.05rem;
    padding: 0.75rem;
    position: relative;
    text-transform: uppercase;
    transition: all 0.2s ease-in-out;
}
#primary-menu .highlight a {
    background: url('img/icon-clock-white.svg') 1em 50% #dd0067 no-repeat;
    background-size: 16px;
    border: 1px solid #dd0067;
    border-radius: 2rem;
    color: #fff;
    display: inline-block;
    font-weight: 400;
    line-height: 1;
    padding: 0.5em 1.25em 0.5em 2.5em;
    text-decoration: none;
    text-transform: uppercase;
    transition: all 0.2s ease-in-out;
}

#primary-menu .highlight a:hover,
#primary-menu .highlight a:focus,
#primary-menu .highlight a:active {
    background-color: #dd0067;
    border: 1px solid #dd0067;
    color: #fff;
}

ul#primary-menu > li.current-page-ancestor a, 
ul#primary-menu > li.current-menu-item a,
body.single-projects ul#primary-menu > li.projects-parent a,
body.single-projects ul#primary-menu:hover > li.projects-parent a:hover,
ul#primary-menu:hover > li.current-page-ancestor a:hover,
ul#primary-menu:hover > li.current-menu-item a:hover,
ul#primary-menu > li a:hover, 
ul#primary-menu > li a:active, 
ul#primary-menu > li a:focus {
    color: #dd0067;
}

ul#primary-menu:hover > li.current-page-ancestor a,
ul#primary-menu:hover > li.current-menu-item a,
body.single-projects ul#primary-menu:hover > li.projects-parent a {
    color: #2b2527;
}

ul#primary-menu > li.highlight.current-menu-item a,
ul#primary-menu > li.highlight.current-menu-item a:hover {
    color: #fff;
}
.cart-link.mobile {
    display: block;
    float: right;
    margin-right: 1rem;
}
ul#primary-menu > li.cart-link.desktop {
	display: none;
}
.posts-navigation .nav-next {
    float: right;
}

.posts-navigation .nav-previous {
    float: left;
}

#footer-menu-container,
#store-menu-container {
    /*
    border-top: 1px solid #d7d1d3;
    margin-top: 1.5rem;
    */
    padding-top: 1.5rem;
    width: 100%;
}
#store-menu-container {
    border-top: 1px solid #d7d1d3;
    margin-top: 1.5rem;
}

#footer-menu,
#store-menu {
    font-size: 0;
}
#footer-menu li,
#store-menu li {
    display: block;
    margin: 0;
    padding: 0.15rem 0.75rem;
}

#footer-menu li a,
#store-menu li a {
    border-bottom: 0;
    display: block;
    font-size: 0.85rem;
    font-weight: 300;
    line-height: 1.5;
    padding: 0;
}

#footer-menu li a:hover, 
#footer-menu li a:active, 
#footer-menu li a:focus,
#store-menu li a:hover, 
#store-menu li a:active, 
#store-menu li a:focus {
}

/* Small menu. */
.menu-toggle {
    display: block;
    float: right;
    line-height: 1.25;
    padding: 0.5rem;
}

@media screen and (min-width: 40em) {
}

/* Breakpoint for full menu */
@media screen and (min-width: 72em) {
	#site-navigation {
		left: auto;
	    position: relative;
	    width: auto;
	}
    .menu-toggle {
        display: none;
    }
    ul#primary-menu {
    	background-color: transparent;
    	box-shadow: none;
	    clear: right;
        display: block;
	    float: right;
        padding: 0.5rem 0;
    }
    ul#primary-menu > li {
        clear: none;
        display: table-cell;
        float: none;
        margin: 0;
        text-align: center;
        width: auto;
    }
    ul#primary-menu > li:last-child {
        margin: 0;
    }
    ul#primary-menu > li a {
        display: block;
        margin-left: 1rem;
        padding: 0.5rem;
    }
	ul#primary-menu > li.cart-link.desktop {
		display: table-cell;
	}
	.cart-link.mobile {
		display: none;
	}
    #footer-menu li,
    #store-menu li {
        border-right: 1px solid #d7d1d3;
        display: inline-block;
        margin: 0;
        padding: 0.15rem 0.75rem;
    }

    #footer-menu li:last-child,
    #store-menu li:last-child {
        border-right: 0;
    }
}


/*--------------------------------------------------------------
## Social media icons
--------------------------------------------------------------*/

.social {
    margin-bottom: 2rem;
    margin-top: 0.5rem;
}
ul#social-media {
    margin: 0.5rem 0 2rem;
}

ul#social-media li {
    display: inline;
    list-style-type: none;
    margin: 0 0.5rem;
}

ul#social-media img {
    max-height: 1.75rem;
    max-width: 1.75rem;
}

ul#social-media a {
    opacity: 0.6;
    border: 0;
}

.social > a:hover, .social > a:active, .social > a:focus {
    border: 0;
    opacity: 1;
}

.social > a {
    margin-right: 0.75rem;
}

ul#social-media a:hover, ul#social-media a:active, ul#social-media a:focus {
    border: 0;
    opacity: 1;
}


/*--------------------------------------------------------------
# Accessibility
--------------------------------------------------------------*/


/* Text meant only for screen readers. */

.screen-reader-text {
    clip: rect(1px, 1px, 1px, 1px);
    position: absolute !important;
    height: 1px;
    width: 1px;
    overflow: hidden;
}

.screen-reader-text:focus {
    background-color: #fff;
    border-radius: 3px;
    box-shadow: 2px 2px 5px 0px rgba(0, 0, 0, 0.2);
    clip: auto !important;
    color: #404040;
    display: block;
    font-size: 14px;
    font-size: 0.875rem;
    font-weight: bold;
    height: auto;
    left: 5px;
    line-height: normal;
    padding: 15px 23px 14px;
    text-decoration: none;
    top: 5px;
    width: auto;
    z-index: 100000;
}


/* Do not show the outline on the skip link target. */

#content[tabindex="-1"]:focus {
    outline: 0;
}


/*--------------------------------------------------------------
# Alignments
--------------------------------------------------------------*/

.alignleft {
    display: inline;
    float: left;
    margin-bottom: 1.5em;
    margin-right: 1.5em;
}

.alignright {
    display: inline;
    float: right;
    margin-bottom: 1.5em;
    margin-left: 1.5em;
}

.aligncenter {
    clear: both;
    display: block;
    margin-left: auto;
    margin-right: auto;
}

@media screen and (min-width: 40em) {
}


/*--------------------------------------------------------------
# Content
--------------------------------------------------------------*/



/*--------------------------------------------------------------
## Content blocks
--------------------------------------------------------------*/

/*--------------------------------------------------------------
### Common
--------------------------------------------------------------*/


.block {
    padding-bottom: 2.8125rem;
    padding-top: 2.8125rem;
}
.block + .block:not(.background-dark, .background-light, .services-links) {
    padding-top: 0;
}
.block.services-links:last-child {
    padding-bottom: 0;
}
.block.padding-bottom-none {
    padding-bottom: 0;
}
.block.padding-top-none {
    padding-top: 0;
}
.block.padding-bottom-low {
    padding-bottom: 0.9375rem;
}
.block.padding-top-low {
    padding-top: 0.9375rem;
}
.block.padding-bottom-high {
    padding-bottom: 4.6875rem;
}
.block.padding-top-high {
    padding-top: 4.6875rem;
}
@media screen and (min-width: 40em) {
    .block {
        padding-bottom: 3.75rem;
        padding-top: 3.75rem;
    }
    .block.padding-bottom-low {
        padding-bottom: 1.25rem;
    }
    .block.padding-top-low {
        padding-top: 1.25rem;
    }
    .block.padding-bottom-high {
        padding-bottom: 6.25rem;
    }
    .block.padding-top-high {
        padding-top: 6.25rem;
    }
}
@media screen and (min-width: 64em) {
    .block {
        padding-bottom: 5.625rem;
        padding-top: 5.625rem;
    }
    .block.padding-bottom-low {
        padding-bottom: 1.875rem;
    }
    .block.padding-top-low {
        padding-top: 1.875rem;
    }
    .block.padding-bottom-high {
        padding-bottom: 9.375rem;
    }
    .block.padding-top-high {
        padding-top: 9.375rem;
    }
}


/*--------------------------------------------------------------
### Basic content (1/2 col)
--------------------------------------------------------------*/

.basic-2-col > .grid-x > .cell {
    margin-bottom: 3rem;
}
@media screen and (min-width: 40em) {
}
@media screen and (min-width: 64em) {
    .grid-x.cols-50-50 .large-6 {
        -ms-flex: 0 0 48%;
        flex: 0 0 48%;
        max-width: 48%;
    }
    .basic-2-col > .grid-x > .cell {
        margin-bottom: 0;
    }
}


/*--------------------------------------------------------------
## Posts and pages
--------------------------------------------------------------*/

.home .intro,
.landingpage .intro {
    border-bottom: 0.5rem solid #d7d1d3;
    height: auto;
    margin-bottom: 2rem;
    position: relative;
}

@media screen and (max-width: 63.9375em) {
    .home .intro,
    .landingpage .intro {
        background: #f7f5f5 !important;
    }
    .home .intro .content,
    .landingpage .intro .content {
        padding: 2rem 0.6735rem 1rem;
        text-align: center;
    }
}
.home .intro .content,
.landingpage .intro .content {
    position: relative;
}
#content > .row:first-child {
    margin-top: 1.5rem;
}
#content > .row.expanded:first-child {
    margin-top: 0;
}
#content > .row:last-child,
#content > .row.map:last-child {
    margin-bottom: 1.5rem;
}
#content > .row + .row {
    margin-top: 2rem;
}
.section-heading {
    text-align: center;
}
.home .section-heading {
    margin-bottom: 1rem;
    text-align: center;
}
.section-footer {
}
.single-post .post-date {
	font-size: 1rem;
    color: #acacac;
}
.single-post .share-links,
.single-projects .share-links {
    margin-bottom: 2rem;
}

.page-template-page-experiences .row.content .columns figure.wp-caption,
.page-template-page-experiences .row.content .columns img,
.page-template-page-experiences .entry-content p img,
.page-template-page-seopage .row.content .columns figure.wp-caption,
.page-template-page-seopage .row.content .columns img,
.page-template-page-seopage .entry-content p img,
.single-experiences .row.content .columns figure.wp-caption,
.single-experiences .row.content .columns img,
.single-experiences .entry-content p img {
	border: 15px #fff solid;
	box-shadow: 2px 2px 10px rgba(0,0,0,0.15);
	margin-top: 0.5rem;
	margin-bottom: 1.75rem;
}
.row.content .columns figure.wp-caption > img,
.entry-content p figure.wp-caption > img {
	border: 0;
	box-shadow: none;
	margin-top: 0rem;
	margin-bottom: 0rem;
}
.row.content .columns p > img,
.entry-content p > img {
	margin-top: 0.5rem;
	margin-bottom: 0.85rem;
}

footer.entry-footer {
    margin-top: 3rem;
}

@media screen and (min-width: 40em) {
    #content > .row:first-child {
        margin-top: 3rem;
    }
    #content > .row:last-child {
        margin-bottom: 3rem;
    }
    #content > .row + .row {
        margin-top: 3rem;
    }
    .home .section-heading {
        margin-bottom: 1.5rem;
        margin-top: 2rem;
    }
    .single-post .share-links,
    .single-projects .share-links {
        margin-bottom: 3rem;
    }
    .entry-content img.alignleft {
    	margin-right: 1.5rem;
        max-width: 50%;
    }
    .entry-content img.alignright {
    	margin-left: 1.5rem;
        max-width: 50%;
    }
}

@media screen and (min-width: 64em) {
    .home #content {
        margin-top: -6rem;
    }
    .home .intro,
    .landingpage .intro {
        background-position: 55% top;
        background-size: cover;
        background-repeat: no-repeat;
        height: calc( 100vh + 0.5rem );
        margin-bottom: 4rem;
    }
    .landingpage .intro {
        background-position: 55% 45%;
        margin-bottom: 0;
    }
    .landingpage .intro {
        height: calc( 70vh + 0.5rem );
    }
    .home .intro .content,
    .landingpage .intro .content {
        position: absolute;
        right: 2rem;
        top: 50%;
        transform: translateY(-45%);
        width: 55%;
    }
    .home .section-heading {
        margin-bottom: 2rem;
    }
    .single-post .share-links,
    .single-projects .share-links {
        margin-bottom: 4rem;
    }
    #content > .row:last-child {
        margin-bottom: 4rem;
    }
}

@media screen and (min-width: 80em) {
    .home .intro {
        background-position: 50% top;
    }
    .landingpage .intro {
        background-position: 50% 42%;
    }
    .home .intro .content,
    .landingpage .intro .content {
        right: 5%;
        top: 50%;
        transform: translateY(-45%);
        width: 45%;
    }
    .landingpage .intro .content {
        transform: translateY(-50%);
    }
}

/*--------------------------------------------------------------
### Hero images
--------------------------------------------------------------*/

.hero-img {
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: cover;
    border-bottom: 0.5rem solid #d7d1d3;
    height: 200px;
    margin-bottom: 2rem;
    position: relative;
    width: 100%;
}
.home .hero-img,
.landingpage .hero-img {
    background-position: 50% 15%;
    display: none;
    height: 75vh;
    margin-bottom: 0;
}

@media screen and (max-width: 63.9375em) {
    .home .hero-img,
    .landingpage .hero-img {
        background-position: 15%;
        display: block;
    }
}

@media screen and (min-width: 47.9375em) {
    .home .hero-img,
    .landingpage .hero-img {
        height: 50vh;
    }
}

@media screen and (min-width: 64em) {
    .hero-img {
        margin-bottom: 3rem;
        height: 350px;
    }
}

@media screen and (min-width: 75em) {
    .hero-img {
        margin-bottom: 3rem;
        height: 500px;
    }
}

/*--------------------------------------------------------------
### Latest News
--------------------------------------------------------------*/

.articles .article,
.featured-articles .article {
    margin-bottom: 2rem;
}
.articles .article .content {
    border-bottom: 1px solid #d7d1d3;
    padding-bottom: 1rem;
}
.articles .article:last-child .content {
    border-bottom: 0;
}
.featured-articles .article .bg {
    background-color: #f7f5f5;
    border-bottom: 0.5rem solid #d7d1d3;
    transition: all 0.35s ease-in-out;
}
.featured-articles .article .bg:hover {
    border-bottom-color: #dd0067;
}
.featured-articles .article .content {
    padding: 1.25rem .625rem;
}

@media screen and (min-width: 40em){
    .featured-articles .article .content {
        padding: 1.5rem 1.25rem;
    }
}
@media screen and (min-width: 64em){
    .featured-articles .article .content {
        padding: 2.25rem 1.75rem;
    }
}


/*--------------------------------------------------------------
### Products
--------------------------------------------------------------*/

.webshop-product {
    margin-bottom: 2rem;
}
.webshop-product img {
    max-height: 12rem;
}
.webshop-product.large img {
    max-height: 100%;
}

@media screen and (min-width: 40em) {
    .webshop-product {
        margin-bottom: 3rem;
    }
}
@media screen and (min-width: 64em) {
    .webshop-product {
        margin-bottom: 4rem;
    }
}


/*--------------------------------------------------------------
### Ratings / Experiences
--------------------------------------------------------------*/

.landingpage .ratings {
    margin-top: 4rem;
}
.exp-featured-image {
    max-width: 200px;
}
.row.rating-channel {
    margin-bottom: 2rem;
}
.rating-channel-logo {
    max-width: 5rem;
}
.rating {
    margin-bottom: 1.5rem;
}
.landingpage .rating {
    margin-bottom: 0;
    margin-top: 2.5rem;
}
.rating .button {
    margin-top: 1rem;
}
.star-rating {
    unicode-bidi: bidi-override;
    color: #f7f5f5;
    font-size: 32px;
    margin: 0 auto;
    position: relative;
    padding: 0.5rem;
    text-align: center;
    width: 139px;
}
.star-rating.small {
    unicode-bidi: bidi-override;
    color: #f7f5f5;
    float: none;
    font-size: 16px;
    height: 15px;
    width: 72px;
    margin: 0 auto;
    position: relative;
    padding: 0;
}
.star-rating-top {
    color: #dd0067;
    margin: 0.5rem;
    position: absolute;
    z-index: 1;
    display: block;
    top: 0;
    left: 0;
    overflow: hidden;
    text-shadow: 0px 1px 0 #a2a2a2;
}
.star-rating-bottom {
    padding: 0;
    display: block;
    z-index: 0;
    text-shadow: 0px 1px 0 #a2a2a2;
}
.star-rating-bottom,
.star-rating-top {
    background-size: 139px;
    background-repeat: no-repeat;
    background-position: top left;
    height: 28px;
    width: 139px;
}
.star-rating.small .star-rating-bottom,
.star-rating.small .star-rating-top {
    background-size: 72px;
    background-repeat: no-repeat;
    background-position: top left;
    height: 15px;
    width: 72px;
}
.star-rating.small .star-rating-top {
    margin: 0;
}
.star-rating-numerical {
    color: #d7d1d3;
    font-family: Helvetica, Arial, sans-serif;
    font-size: 1.125rem;
    font-weight: 600;
    text-align: center;
}
.review h5 {
    margin-bottom: 0;
}
.review .photo {
    float: left;
    padding: 0 1rem;
    width: 100%;
}
.review .photo img {
    border-radius: 50%;
    display: inline-block;
    margin-bottom: 1.5rem;
    max-width: 50px;
}
.review .content {
    float: left;
    padding: 0 1rem;
    width: 100%;
}
.review .content.full-width {
    width: 100%;
}
.review .text {
    float: left;
    width: 100%;
}

.reviews-slider-wrap {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
    position: relative;
}
/* Slick default CSS */
.slick-slider
{
    position: relative;

    display: block;
    box-sizing: border-box;

    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;

    -webkit-touch-callout: none;
    -khtml-user-select: none;
    -ms-touch-action: pan-y;
        touch-action: pan-y;
    -webkit-tap-highlight-color: transparent;
}

.slick-list
{
    position: relative;

    display: block;
    overflow: hidden;

    margin: 0;
    padding: 0;
}
.slick-list:focus
{
    outline: none;
}
.slick-list.dragging
{
    cursor: pointer;
    cursor: hand;
}

.slick-slider .slick-track,
.slick-slider .slick-list
{
    -webkit-transform: translate3d(0, 0, 0.01);
       -moz-transform: translate3d(0, 0, 0.01);
        -ms-transform: translate3d(0, 0, 0.01);
         -o-transform: translate3d(0, 0, 0.01);
            transform: translate3d(0, 0, 0.01);
}

.slick-track
{
    position: relative;
    top: 0;
    left: 0;

    display: block;
    margin-left: auto;
    margin-right: auto;
}
.slick-track:before,
.slick-track:after
{
    display: table;

    content: '';
}
.slick-track:after
{
    clear: both;
}
.slick-loading .slick-track
{
    visibility: hidden;
}

.slick-slide
{
    display: none;
    float: left;

    height: 100%;
    min-height: 1px;
}
[dir='rtl'] .slick-slide
{
    float: right;
}
.slick-slide img
{
    display: block;
}
.slick-slide.slick-loading img
{
    display: none;
}
.slick-slide.dragging img
{
    pointer-events: none;
}
.slick-initialized .slick-slide {
    float: none;
    display: inline-block;
    vertical-align: middle;
}
.slick-loading .slick-slide
{
    visibility: hidden;
}
.slick-vertical .slick-slide
{
    display: block;

    height: auto;

    border: 1px solid transparent;
}
a.slick-arrow {
    border: none;
    color: #e5dcd3;
    font-family: Helvetica, Arial, sans-serif;
    font-size: 3rem;
    font-weight: 200;
    opacity: 0.5;
    padding: 0 0.25rem;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    transition: all 0.5s ease-in-out;
    z-index: 1;
}
a.slick-arrow:hover,
a.slick-arrow:focus,
a.slick-arrow:active {
    border: none;
    color: #e5dcd3;
    opacity: 0.85;
}
#slick-next1,
#slick-next2 {
    right: 0;
}
#slick-prev1,
#slick-prev2 {
    left: 0;
}
.slick-arrow.slick-hidden {
    display: none;
}
@media screen and (min-width: 40em) {
    .star-rating.small {
        margin: 0;
    }
    .review .photo {
        float: left;
        padding: 0 1rem;
        width: 20%;
    }
    .review .photo img {
        display: inline-block;
        margin-bottom: 0;
    }
    .review .content {
        float: left;
        padding: 0 1rem;
        width: 80%;
    }
    .review .content.full-width {
        width: 100%;
    }
    .review .text {
        float: left;
        width: 100%;
    }
    a.slick-arrow {
        font-size: 4rem;
        padding: 0;
    }
    #slick-next1,
    #slick-next2 {
        right: -0.5rem;
    }
    #slick-prev1,
    #slick-prev2 {
        left: -0.5rem;
    }
    .slick-slide {
        padding-left: 1rem;
        padding-right: 1rem;
    }
}
@media screen and (min-width: 64em) {
    #slick-next1,
    #slick-next2 {
        right: -1rem;
    }
    #slick-prev1,
    #slick-prev2 {
        left: -1rem;
    }
    a.slick-arrow {
        font-size: 5rem;
    }
    .slick-slide {
        padding-left: 1.5rem;
        padding-right: 1.5rem;
    }
}


/*--------------------------------------------------------------
### Price lists
--------------------------------------------------------------*/

table.pricelist {
    border-collapse: collapse;
    border: 0;
    margin-bottom: 1rem;
}
table.pricelist tbody {
    background-color: transparent;
    border: 0;
}
table.pricelist tbody tr {
    background-color: transparent;
}
table.pricelist tbody tr:nth-child(2) {
    background-color: #F7F5F5;
}
.pricelist.hover tr:first-child:hover {
    background: transparent;
}
.pricelist tr:last-child {
    border-bottom: 1px solid transparent;
}
.pricelist th {
    text-align: left;
}
.pricelist th.group-title {
    font-weight: 300;
    padding-top: 1rem;
}
.pricelist th,
.pricelist td {
    line-height: 1.5;
    padding-bottom: 0;
    padding-top: 0;
}
.pricelist h2 {
    font-size: 125%;
}
.pricelist .note p {
    margin-bottom: 0;
}
.pricelist .booking {
    padding-bottom: 1rem;
    width: 10rem;
}
.pricelist .booking a.button.ghost {
    font-size: 0.8735rem;
    margin-top: 1rem;
    padding: 0.3rem 1rem;
    white-space: nowrap; 
}
.pricelist .group-title a.button.ghost {
    margin-top: 1rem; 
}

@media screen and (min-width: 40em) {
    table.pricelist {
        margin-bottom: 2rem;
    }
}
@media screen and (max-width: 47.9375em) {
    .pricelist h2 {
        font-size: 90%;
    }
    .pricelist th:first-child,
    .pricelist td:first-child {
        padding-top: 1rem;
    }
}
@media screen and (min-width: 48em) {
    .pricelist tbody tr:nth-child(2) th {
        padding-bottom: 1rem;
        padding-top: 1rem;
    }
    table.pricelist tbody tr:nth-child(n+3) td {
        border-bottom: 1px solid #F7F5F5;
    }
    .pricelist th {
        text-align: center;
    }
    .pricelist th.title,
    .pricelist th.note {
        text-align: left;
    }
    .pricelist th.group-title {
        padding-bottom: 1rem;
        padding-top: 2rem;
    }
    .pricelist td {
        line-height: 1.75;
        padding: .5rem .625rem;
        vertical-align: top;
    }
    .pricelist .duration,
    .pricelist .price,
    .pricelist .price_kela,
    .pricelist .booking {
        text-align: center;
        white-space: nowrap; 
    }
    .pricelist .booking {
        padding-bottom: 0;
    }
    .pricelist .booking a.button.ghost {
        margin-top: 0;
        margin-bottom: 0.15rem;
    }
}
@media screen and (min-width: 64em) {
    table.pricelist {
        margin-bottom: 3rem;
    }

}

/*--------------------------------------------------------------
### Contact Block
--------------------------------------------------------------*/

.row.contact {
    margin-bottom: 2rem;
}
.contact a {
    white-space: nowrap;
}
.contact a[href^="tel:"],
.contact a[href^="mailto:"] {
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 0.9rem;
    padding-left: 1.5rem;
}
.contact a[href^="tel:"] {
    background-image: url('img/icon-tel.svg');
}
.contact a[href^="mailto:"] {
    background-image: url('img/icon-email.svg');
}

/* Yleiset yhteystiedot */
.contact-info {
    margin-bottom: 2rem;
}

/* Henkilöiden yhteystiedot */
.person {
    padding-top: 1rem;
    margin-bottom: 0.5rem;
}
.person img {
    border-radius: 50%;
    margin-bottom: 1rem;
    max-width: 8rem;
}
.person img.language {
    border-radius: 0;
    display: inline-block;
    padding: 0.25rem;
    max-width: 1.75rem;
    margin-bottom: 0.5rem;
}
.person .name,
.person .tel,
.person .email,
.office .tel,
.office .email {
    margin-bottom: 0;
}
.person .name {
}
.person .title {
    font-size: 85%;
    margin-bottom: 0.5rem;
}
.person a.button {
    margin-bottom: 1rem;
    margin-top: 1rem;
}
.payment-methods {
    margin-bottom: 2rem;
}
img.payment-method {
    margin-bottom: 1.25rem;
    margin-right: 0.75rem;
    vertical-align: top;
}
@media screen and (min-width: 40em) {
    .row.contact {
        margin-bottom: 4rem;
    }
    .contact-info {
        border-right: 1px solid #d7d1d3;
        padding-bottom: 1.5rem;
        padding-top: 1.5rem;
    }
    .personnel {
        padding-bottom: 1.5rem;
        padding-top: 1.5rem;
    }
    .personnel h5:first-child {
        padding-left: 2rem;
    }
    .person {
        margin-bottom: 1.5rem;
    }
    .person img {
        margin-bottom: 1.5rem;
        max-width: 80%;
        padding: 10%;
    }
    .person img.placeholder {
        /*padding: 1rem;*/
    }
}

@media screen and (min-width: 64em) {
    .row.contact {
        margin-bottom: 4rem;
    }
    .person {
        margin-bottom: 2rem;
    }
    .person img {
        margin-bottom: 2rem;
        max-width: 80%;
        padding: 1rem;
    }
}

/*--------------------------------------------------------------
### Google Maps
--------------------------------------------------------------*/

.gmaps {
    border-bottom: 0.5rem solid #d7d1d3;
    height: 300px;
    margin-bottom: 2rem;
    width: 100%;
}

.gm-style .gm-style-iw {
    font-size: 1rem;
}
.gm-style .gm-style-iw h4 {
    font-size: 1.1rem;
}
.gm-style .gm-style-iw a {
    white-space: nowrap;
}
.gm-style .gm-style-iw a[href^="tel:"],
.gm-style .gm-style-iw a[href^="mailto:"] {
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 0.9rem;
    padding-left: 1.5rem;
}
.gm-style .gm-style-iw a[href^="tel:"] {
    background-image: url('img/icon-tel.svg');
}
.gm-style .gm-style-iw a[href^="mailto:"] {
    background-image: url('img/icon-email.svg');
}


/* fixes potential theme css conflict */

.gmaps img {
    max-width: inherit !important;
}

@media screen and (min-width: 40em) {
    .gmaps {
        height: 400px;
        margin-bottom: 4rem;
    }
    .gm-style-iw > div {
        padding: 1rem;
    }
}

@media screen and (min-width: 64em) {
    .gmaps {
        height: 500px;
    }
}

.marker {
    display: none;
}


/*--------------------------------------------------------------
### Popup notification
--------------------------------------------------------------*/
#jquery-modal-popup .content {
    margin-bottom: 1.5rem;
    margin-top: 1rem;
}


/*--------------------------------------------------------------
# Media
--------------------------------------------------------------*/


/* Make sure embeds and iframes fit their containers. */

embed, iframe, object {
    max-width: 100%;
}


/*--------------------------------------------------------------
## Video Embeds
--------------------------------------------------------------*/

.embed-container {
    margin-bottom: 2rem;
    position: relative;
    padding-bottom: 53%;
    padding-top: 30px;
    height: 0;
    overflow: hidden;
}

.embed-container iframe,  
.embed-container object,  
.embed-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.entry-content img, 
.entry-content iframe, 
.entry-content object, 
.entry-content embed {
    max-width: 100%;
}

@media screen and (min-width: 40em) {
    .embed-container {
        margin-bottom: 3rem;
    }
}

@media screen and (min-width: 64em) {
    .embed-container {
        margin-bottom: 4rem;
    }
}


/*--------------------------------------------------------------
## Captions
--------------------------------------------------------------*/

.wp-caption {
    margin-bottom: 1.5em;
    max-width: 100%;
}

.wp-caption img[class*="wp-image-"] {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.wp-caption .wp-caption-text {
	margin: 0.8075em 0 0;
	font-size: 0.8375rem;
	text-align: left;
}

#content .columns img + .wp-caption-text {
	margin-top: 0.5rem;
} 

.wp-caption-text {
    text-align: center;
}


/*--------------------------------------------------------------
# Helpers
--------------------------------------------------------------*/