@charset "utf-8";
/* CSS Document */

@media screen and (min-width: 1024px){
 
    
    html{
	    scroll-behavior: smooth;
        max-width: 100vw;
        overflow-x: hidden;
    }

    body{
	    padding:0px;
	    margin:0px;
	    background-color:rgba(32,34,66,1.0);
    }
    
    img.logo{
        width:15vw;
        height:auto;
        position:fixed;
        top:3vw;
        left:3vw;
        z-index:10000;
    }
    
    .menu{
        width:20vw;
        position:fixed;
        top:10vw;
        right:0vw;
        text-align: right;
        z-index:5000;
    }
    
    .menu a{
        font-family: calder-lc, sans-serif;
        font-weight: 400;
        font-style: normal;
        width:15vw;
        display:inline-block;
        right:0vw;
        background-color:rgba(120, 213, 228, 1.0);
        margin-bottom:0.5vw;
        text-decoration:none;
        color:rgba(0,0,0,1.0);
        text-align:center;
        padding:1vw;
        transition:0.8s;
    }
    
    .menu a:hover{
        width:17vw;
        transition:0.8s;   
    }
    
    .menu a:active{
        width:18vw;
        transition:0.8s;   
        color:rgba(47,81,142,1.0);
        background-color:rgba(255,255,255,1.0);
    }
        
    h1{
        font-family: calder-dark-grit-shadow, sans-serif;
        font-weight: 400;
        font-style: normal;
        font-size:5vw;
        float:left;
        position:relative;
        top:10vw;
        left:3vw;
        width:50vw;
        color:rgba(255,255,255,1.0);
        display:block;
    }
    
    
    p{
        font-family: calder-lc, sans-serif;
        font-weight: 400;
        font-style: normal;
        font-size:1.1vw;
        float:left;
        position:relative;
        top:10vw;
        left:3vw;
        width:50vw;
        color:rgba(255,255,255,1.0);
        display:block;
        padding-bottom:5vw;
    }
    
    p img{
        width:30vw;
        height:auto;
    }
    
    a.article{
        font-family: calder-lc, sans-serif;
        font-weight: 400;
        font-style: normal;
        font-size:1.1vw;
        color:rgba(255,255,255,1.0);
        text-decoration:underline;
    }
    
    a.article:hover{
        color:rgba(120, 213, 228, 1.0);
    }
    
    img.feature{
        width:35vw;
        position:absolute;
        bottom:3vw;
        right:-2vw;
        opacity: 0;
    } 
    
    iframe{
        width:30vw;
        height:15vw;
        border:none;
    }
    
    
}

@media screen and (max-width: 1023px){
 
    
    html{
	    scroll-behavior: smooth;
        max-width: 100vw;
        overflow-x: hidden;
    }

    body{
	    padding:0px;
	    margin:0px;
	    background-color:rgba(32,34,66,1.0);
    }
    
    img.logo{
        width:60vw;
        height:auto;
        position:fixed;
        padding:10vw 20vw 10vw 20vw;
        top:0vw;
        left:0vw;
        z-index:10000;
        display:block;
        background-color:rgba(0,0,0,0.7);
    }
    
    .menu{
        width:100vw;
        position:fixed;
        top:30vw;
        left:0vw;
        text-align: left;
        z-index:12000;
        background-color:rgba(120, 213, 228, 1.0);
    }
    
    .menu a{
        font-family: calder-lc, sans-serif;
        font-weight: 400;
        font-style: normal;
        font-size:6vw;
        width:20vw;
        height:16vw;
        display:inline-block;
        background-color:rgba(120, 213, 228, 1.0);
        margin-bottom:0.5vw;
        text-decoration:none;
        color:rgba(0,0,0,1.0);
        text-align:center;
        padding:1vw;
        transition:0.8s;
        vertical-align: middle;
    }
        
    h1{
        font-family: calder-dark-grit-shadow, sans-serif;
        font-weight: 400;
        font-style: normal;
        font-size:10vw;
        margin-top:50vw;
        margin-left:10vw;
        width:80vw;
        color:rgba(255,255,255,1.0);
        display:block;
        text-align:center;
    }
    
    
    p{
        font-family: calder-lc, sans-serif;
        font-weight: 400;
        font-style: normal;
        font-size:5vw;
        margin-top:5vw;
        margin-left:10vw;
        width:80vw;
        color:rgba(255,255,255,1.0);
        display:block;
        padding-bottom:5vw;
    }
    
    p img{
        width:80vw;
        height:auto;
    }
    
    a.article{
        font-family: calder-lc, sans-serif;
        font-weight: 400;
        font-style: normal;
        font-size:5vw;
        color:rgba(120, 213, 228, 1.0);
        text-decoration:underline;
    }
    
    img.feature{
        width:80vw;
        display:block;
        top:40vw;
        margin-left:10vw;
        opacity: 0;
    } 
    
    iframe{
        width:80vw;
        height:50vw;
        border:none;
    }
    
    
}