/*
Theme Name: Vantage lapsiteema for liukuovilaskuri
Theme URI: https://yesdesign.fi
Template: vantage
Author: Mika Välimäki
Author URI: https://yesdesign.fi
Description: Lapsiteema tehty liukuovilaskuria varten
Tags: custom for Keittiövalinta
Version: 1.0.0.1504165655
Updated: 2017-08-31 07:47:35

*/

.tooltip .tooltiptext {
    width:170px !important;
}
#shipping_options {
    width:96% !important;
    margin-bottom: 5px !important;
}
.uusi-tiedot-col {
    width: 30vw;
}

.uusi-tiedot-col .hoverred {
    position: relative;
    top: 50px;
}

#flex-main-container {
    justify-content: flex-start !important;
    width: 100% !important;
}

#flex-main-container .flex-column {
align-items: flex-start;
}

#flex-main-container .outer-flex.valumo-mod {
    margin-left: 50px;
    width: 66% !important;
}

#flex-main-container {
    align-items: flex-start;
}

#flex-main-container .info { max-width: 650px !important; }

#flex-main-container .kaappi { justify-content: inherit !important;}

#samat .tooltiptext {
    min-width: 250px;
}

.valitsijat input,
#nf-form-2-cont input {
    border: 1px solid #ccc !important;
}

.collapsed.tilaus-tiedot {
    margin-left: 20vw !important;
    display: flex;
    flex-direction: row;
    width: 100%;
}

.hoverred { margin-right: 20px; }

#avaa-ohje { 
    display: block; 
    margin-right: 15px;
    padding: 0;
} 

.tilaus-tiedot > div { 
    padding-top: 8px !important; 
    
}

.valumo-hidden { display: none; }

.valitsijat { 
    width: 33vw !important;
    margin-left: 30px !important;
}

.valitsijat .show { margin-right: 40px; }

.collapsed.tilaus-tiedot { 
    margin-left: 0 !important; 
    flex-direction: column !important;
}

input[id=korkeus], input[id=leveys] {
    -moz-appearance: textfield;
    -webkit-appearance: textfield;
    margin: 0 10px;
    padding:10px 0px;
    /*inline-size: -webkit-fill-available;*/
    /*min-height: -webkit-fill-available;*/
}

#valitsijat-container { display: flex; }
#tilaa { 
    margin-top: 10px;  
    max-width: 100% !important;
}

/*.kaappi { flex-wrap: wrap; } */ /* Korjaa kaappien taitto-ongelman, mutta samalla katkaiseen ohjevideon */
.doorframe { margin-bottom: 150px !important; }

#siirry-tilaamaan {
   width: 140px;
    font-family: "Alegreya Sans SC";
    padding: 5px 5px;
    background: #d13a23;
    opacity: 0.8;
    color: #fff;
    text-shadow: 0 1px 0 rgba(0,0,0,.05);
    text-align: center;
    cursor: pointer;
    position: fixed;
    right: -55px;
    top: 140px;
    height: 35px;
    text-decoration: none;
    font-size: 1em;
    font-weight: bold;
    transform: rotate(-90deg);
}

#siirry-tilaamaan span {
    display: block;
    transform: rotate(-90deg);
}

input#korkeus:invalid:focus + .ok::after {
    content: "" !important;
    color: inherit !important;
}

.kaappi { 
    flex-wrap: wrap; 
    max-height: none !important;
}

.videoWrapper { min-height: 300px; }

.outer-flex { 
    height: 100% !important; 
    min-height: 850px;
}

.referenssi-hero {
	aspect-ratio: 3/2;
	object-fit: cover;
}

.entry-content .wp-caption {
	padding: 15px;
	border: none;
	box-shadow: none;
}

@media screen and (max-width: 1280px) {
    
    /*
    #tilaa { max-width: 20vw !important; }

    .tilaus-tiedot {
        flex-direction: row;
        position: fixed;
        right: 100px;
        top: 50px;
        width: 500px !important;
        border: solid 1px;
    }
    */
}

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

    .valitsijat {
        width: 40vw !important;
        margin-left: 0px !important;
    }
}

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

    .valitsijat {
        width: 80% !important;
    }
    
    #flex-main-container .outer-flex.valumo-mod {
        margin-left: 0px;
        width: 80% !important;
        margin-top: 50px;
    }

}

@media screen and (max-width: 360px) {
     
     .valitsijat {
         width: 100% !important;
     }
     
     #valitsijat-container {
         flex-direction: column;
         align-items: center !important;
     }

    #flex-main-container .outer-flex.valumo-mod {
        margin-left: 0px;
        width: 100% !important;
        margin-top: 50px;
    }
    
    .kaappi {
        flex-direction: column;
    }
    
    #main {
        padding: 5px;
    }
    
    .valitsijat .show { margin-right: 0px !important; }

}

@media screen and (max-width: 767px) {
    .tilaus-tiedot span.sum {
            font-size: 1.2em !important;
    }
}