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

/* First loading elements about break */

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

    body{
	    padding:0px;
	    margin:0px;
	    background-color: rgba(104, 158, 213, 1.0);
    }  
    
    img.logo{
        width:15vw;
        height:auto;
        position:fixed;
        top:3vw;
        left:3vw;
        z-index:10000;
    }

    .home_top{
        width: 100vw;
        height: 100vh;
        background-color: rgba(104, 158, 213, 1.0);
        display:block;
    }
    
    .home_top 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);
    }
    
    .home_top .table{
        width:45vw;
        height:3vw;
        position:absolute;
        bottom:-5vw;
        right:0vw;
        background-color:rgba(47,81,142,1.0);
    }
    
    .home_top img.laptop{
        width:35vw;
        position:absolute;
        bottom:3vw;
        right:-2vw;
        opacity: 0;
    } 
    
    .home_top img.nextarrow{
        width:3vw; 
        z-index: 4000;
        position:absolute;
        bottom:1vw;
    }
    
    .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);
    }
    
       /* width */
::-webkit-scrollbar {
  width: 0.5vw;
}

/* Track */
::-webkit-scrollbar-track {
  box-shadow: inset 0 0 5px grey; 
  border-radius: 2vw;
}
 
/* Handle */
::-webkit-scrollbar-thumb {
  background: rgba(43,40,96,1.0);; 
  border-radius: 2vw;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: rgba(99,52,137, 1.0); 
}
    
}

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

    body{
	    padding:0px;
	    margin:0px;
	    background-color: rgba(104, 158, 213, 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);
    }

    .home_top{
        width: 100vw;
        height: 100vh;
        background-color: rgba(104, 158, 213, 1.0);
        display:block;
    }
    
    .home_top h1{
        font-family: calder-dark-grit-shadow, sans-serif;
        font-weight: 400;
        font-style: normal;
        font-size:10vw;
        float:left;
        position:relative;
        top:50vw;
        left:5vw;
        width:90vw;
        text-align:center;
        color:rgba(255,255,255,1.0);
    }
    
    .home_top .table{
        width:45vw;
        height:3vw;
        position:absolute;
        bottom:-5vw;
        right:0vw;
        background-color:rgba(47,81,142,1.0);
        display:none;
    }
    
    .home_top img.laptop{
        width:80vw;
        position:absolute;
        bottom:10vw;
        left:10vw;
        opacity: 0;
    } 
    
    .home_top img.nextarrow{
        width:10vw; 
        z-index: 4000;
        position:absolute;
        bottom:1vw;
    }
    
    .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;
    }
    
       /* width */
::-webkit-scrollbar {
  width: 0.5vw;
}

/* Track */
::-webkit-scrollbar-track {
  box-shadow: inset 0 0 5px grey; 
  border-radius: 2vw;
}
 
/* Handle */
::-webkit-scrollbar-thumb {
  background: rgba(43,40,96,1.0);; 
  border-radius: 2vw;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: rgba(99,52,137, 1.0); 
}
    
}