

@media(max-height: 900px) {    
    deck cards card[yes] {
        height: 80%;  
        width: 70%;        
        margin: 5% 15%;
    }
    
    deck cards card[yes] [description] {
        font-size: 2.5em;
        line-height: 1em;
        letter-spacing: -1px;
    }

}
@media(max-height: 800px) {
    deck cards card[yes] nest {
        height: 100% !important;
    }
}

@media(max-height: 700px) {
    body[landing] nav[home] a {
        font-size: 1em !important;
        padding: 15px 35px !important;
    }
    body[landing] div[base][wrap] main cover {
        align-items: start !important;
    }
    
    deck cards card[yes] {
        height: 80%;  
        width: 70%;        
        margin: 5% 15%;
    }
    
    deck cards card[yes] [description] {
        font-size: 2em;
        line-height: 1em;
        letter-spacing: -1px;
    }
    [dir] {
        top: 15px;
        right: 15px;
    }
    nav[nav], a[nav] {
        padding: 20px 22px !important;
        font-size: 1em !important;
        margin-right: 10px !important;
    }
    slide content {
        width: 90%;
    }

}
@media(max-height: 600px) {
    slide h1,
    slide [label] {
        font-size: 3.5em !important;
        line-height: 1em !important;
    }
    slide content {
        padding: 35px;
    }
    slide[frame] photo {
        border: 35px solid white;
    }

}

@media(max-width: 1500px) {    
    deck cards card[yes] [description] {
        font-size: 2.5em;
        line-height: 1em;
        letter-spacing: -1px;
    }
}
@media (max-width: 1200px) {
    deck cards card[yes] {
        /* height: 80%;
        width: 70%;
        margin: 5% 15%; */
    }
}
@media(max-width: 1000px) {
    deck cards card[yes] nest {
        /* height: 75% !important; */
        flex: 1 !important;
    }
}
@media(max-width: 700px) {

    body {
        align-items: start !important;
        overflow: hidden !important;
    }
    body[landing] main header {
        display: block !important;
        margin: 0px !important;

        margin: 0px !important;
        margin: 100px 0px 100px !important;
        margin: 10px 0px 25px !important;
        flex-direction: column !important;
    }
    body[landing] main header [content] {
        display: flex !important;
            justify-content: center !important;
            text-align: center;
        padding: 0px !important;

        width: 60% !important;
        flex: 1 !important;

        width: 70% !important;
        margin: 0 15% !important;
        display: block !important;

        padding: 10px 35px !important;
        width: 100% !important;
        margin: 0 0 !important;
    }
    body[landing] main header [content] [description] {
        font-size: 1.35em !important;
        width: 100% !important;
    }







    /* body[landing] main header [logo] {
        padding: 0px !important;
            justify-content: center !important;
            text-align: center;
        flex: 1 !important;
    } */
    body[landing] main header [logo] {
        display: flex !important;
            flex: 1 !important;
            justify-content: right !important;
        padding: 0px !important;

        display: block !important;
        position: fixed !important;
            top: 0 !important;
            right: 0 !important;
        width: 125px !important;        
    }
    body[landing] main header [logo] logo {
        display: block !important;
        height: auto !important;
        padding: 7px !important;
        width: 100% !important;
    }

    body[landing] main [logo] logo {}
    body[landing] main [logo] logo img {
        height: auto !important;
        width: 200px !important;
        width: 125px !important;
        width: 250px !important;

        display: block !important;
        height: auto !important;
        width: 100% !important;
    }

    body[landing] main [content] {
        padding: 0px !important;
        justify-content: center !important;
        
    }
    body[landing] nav[home] {
        display: block !important;
        text-align: center !important;
    } 

    body[landing] div[base][wrap] main cover {
        align-items: start !important;
    }



    nav[nav],
    a[nav] {
        padding: 20px 22px !important;
        font-size: 1em !important;
        margin-right: 10px !important;
    }
    
    nav[nav]:last-of-type,
    a[nav]:last-of-type {
        margin-right: 0px !important;
    }


    branch h1[title] {
        font-size: 5em !important;
        font-size: 3em !important;
        letter-spacing: -2px !important;
        line-height: .85em !important;
    }
    branch h6 {
        font-size: 1.5em !important;
        letter-spacing: -1px !important;
        line-height: 1em !important;
    }


    slide {
        display: block;
        display: flex;
        overflow-y: auto !important;
        overflow-x: hidden !important;
        padding-bottom: 100px;
    }
    
    slide h1, 
    slide [label] {
        font-size: 2.5em !important;
        line-height: 1em !important;
    }  

    slide h1 b,
    slide [label] b {
        margin-bottom: 25px;
    }
        
    slide content {
        overflow: visible;
        padding: 35px;
        width: 100%;
    }




    slide photo[active][zoom1] [zoom] {
        height: 100% !important;
        width: auto !important;
    }
    slide photo[active][zoom2] [zoom] {
        display: block !important;
        height: 150% !important;
        width: auto !important;
    }
    slide photo[active][zoom3] [zoom] {
        display: block !important;
        height: 200% !important;
        width: auto !important;
    }  
    

    slide photo[active][zoom2],    
    slide[fit] photo[active][zoom2],
    slide[split] photo[active][zoom2]{
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        height: 100% !important;
        z-index: 9999999999999999999999999999999999999999 !important;
        background-size: cover;
        padding: 0 !important;
        border: none !important;
        border-radius: 0 !important;
    }

    slide photo[active][zoom2],
    slide[fit][nocover] photo[active][zoom2],
    slide[split][nocover] photo[active][zoom2] {
        height: 100% !important;
        /* height: 200% !important; */
        width: 100% !important;
        overflow: auto !important;
        display: flex !important;
        justify-content: center !important;
        flex: 1 !important;
        margin: auto !important;
        text-align: center !important;
    }


    [dir][zoom2] {
        bottom: unset !important;
        top: 100% !important;
        opacity: .35 !important;
        pointer-events: none !important;
    }


    slide photo over {
        display: flex !important;
    }
    slide photo over row {
        display: none;
    }
    slide photo over row[bubble] {
        /* height: 100%; */
        /* left: 0; */
        /* width: auto; */
        /* position: absolute; */
        /* top: 0; */
        /* left: 0; */
        /* right: 0; */
        /* bottom: 0; */
        flex: 1 !important;
        filter: drop-shadow(15px -36px 0px #1100bf80);
    }
    slide photo over row[bubble] bubble {
        height: auto !important;
        top: 0;
        bottom: 0;        
    }
    
    slide[flexblock] {
        display: block !important;
    }
    slide[bottomstart] {
        align-items: end !important;
    }
    slide[centerstart] {
        align-items: start !important;
    }

    slide[split] {
        display: block;
    }
    slide[split] photo {
        height: auto;
        width: 100%;
        border-radius: 25px 75px 50px 150px !important;
        overflow: hidden !important;
    }
    slide[split][nocover] photo {
        height: 50% !important;
    }
    slide[split] photo over {
        /* flex-direction: unset; */
        height: auto;
        display: block !important;
    }

    slide[split] photo over row {
        display: block;
        width: 100%;
    }

    slide[split] photo over row[bubble] {
        /* height: 100%; */
        flex: 1;
        width: 100%;
        filter: drop-shadow(5px -15px 0px #1100bf80);
    }
    slide[split] photo over row[bubble] bubble {
        height: 500px !important;
        height: auto !important;
        top: 0;
        bottom: 0;
        
    }

    slide[nocover] photo over {
        display: flex !important;
    }
    slide[nocover] photo over row {
        display: none !important;
    }
    slide[nocover] photo over row:last-of-type {
        display: none !important;
    }
    slide:not([split]) {
        align-items: start !important;
        /* align-items: center !important; */
    }
    slide:not([split]) photo  {
        background-repeat: repeat !important;
        background-size: contain !important;    
    }
    slide:not([split]) photo over row[bubble] bubble svg {
        height: 150% !important;
        width: auto !important;
        position: absolute;
        top: unset;
        bottom: 0;      
    }
    slide:not([split],[fit]) photo over row:not([bubble]) {
        display: none !important;   
    }
    slide:not([split],[fit]) photo over row:last-of-type {
        display: none !important;   
    }

    slide:not([split]) photo over row:last-of-type {
        flex: 0 0 80px !important;
        display: block ;
    }
    slide cover {
        /* display: none !important; */
    }


    /* slide content [label] {
        font-size: 4em !important;
        line-height: 1.25em !important;
    } */


    slide content [description] {
        font-size: 1.5em !important;
        line-height: 1.15em !important;
        font-weight: normal !important;
    }

    slide content [description] ul {
        border: none !important;
        margin: 0px 0 20px !important;
        padding: 0px !important;
    }
    
    slide content [description] li {
        font-size: 1.25em !important;
        line-height: 1.15em !important;
        font-weight: normal !important;
        padding: 35px 0px !important;
    }
    slide content [description] li:first-of-type {
        padding: 0px 0px 35px 0px !important;
    }
    slide[year] [label] {
        font-size: 5em !important;
        line-height: 1.15em !important;
    }
    slide[large] [label] {
        font-size: 5em !important;
        line-height: 1.15em !important;

        font-size: 3em !important;
        line-height: .85em !important;
    }
    slide[frame] photo {
        border: none !important;
    }

    slide[stickytext][textbottom] content {
        margin-bottom: 75px;
    }


    decision {
        overflow-y: auto !important;
        overflow-x: hidden !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 5% !important;

        /* margin: 0 5% !important;
        flex: 0 0 90%;
        width: 90% !important; */
    }
    tree {
        display: block !important;
    }
    tree branch {
        height: auto !important;
    }
    tree {
        display: block !important;
    }
    tree branch {
        /* display: none !important; */
        height: unset !important;
    }
    tree branch.active {
        display: block !important;
    }
    tree branch.getstarted {
        display: none !important;
    }
    tree branch.getstarted.active {
        display: flex !important;
        align-items: center !important;
        height: 100% !important;
        width: 100% !important;
    }


    /* deck cards card[yes] {
        left: 0 !important;
        margin: 15% 5% !important;
        width: 90% !important;
        height: 70% !important;
    }     */
    deck cards card[yes] {
        left: 0 !important;
        margin: 0 0 !important;
        width: 100% !important;
        height: 100% !important;
    }
    deck cards card[yes] nest {
        height: 100% !important;
        flex: 1 !important;
    }
    deck cards card content [description] {
        font-size: 2em !important;
    }



    family,
    family[large][columns] {
        padding: 0px !important;
    }


    family this[done][active] {
        padding: 70px 50px !important;
    }




    slide[nocover] photo over {
        display: none !important;
    }

}