body{
    margin:0;
    font-family: 'Bitter', serif;
    background-color:white;
}

a{
    text-decoration:none;
}

a:link{
    color:#00427C;
}

a:visited{
    color:#00427C;
}

a:active{
    color:#00427C;
}

.preloading{
    display:none;
}

#start_image{
    position:relative;
    background-color:#4A96CD;
    width:100%;
    max-width:2048px;
    display:block;
    margin:0 auto;
    z-index:3;
}

#cover_img{
    top:-1500px;
    opacity:0;
    width:100%;
    height:auto;
    position:relative;
/*    max-width:2048px;
    display:block;
    margin:0 auto;*/
}

#bar{
    position:absolute;
    top:49.5%;
    opacity:0;
    width:100%;
    height:26.3%;
    max-width:2048px;
    
}

#logo_animation{
    margin:0 auto;
    display:block;
    height:100%;
}

#menu_button_elem{
    z-index:7;
    width:6%;
    max-width:123px;
    position:fixed;
    top:0;
    left:0;
    margin:0;
    border:none;
    border-image-width:0;
    padding:0;
    background-color:transparent;
    transition:opacity 1s linear;
    -webkit-transition:opacity 1s linear; /* Safari */
    -moz-transition:opacity 1s linear; /* Firefox */
    -o-transition:opacity 1s linear; /* Opera */
}

#menu_button_elem img{
    width:100%;
}

#side_menu {
    background-color:rgba(255,255,255,0.15);
    height:100%;
    width:25%;
    position:fixed;
    top:0;
    left:-1000px;
    border-right:4px solid #00427C;
    z-index:10;
}

#side_menu ul{
    margin-top:30%;
    list-style-type:none;
    color:#00427C;
}

#side_menu ul li{
    padding-top:5px;
}

#logo_item img{
    width:80%;
}

.line_item div{
    background-color:#00427C;
    width:60%;
    height:2px;
    margin:20px;
}

#veil{
    z-index:5;
    opacity:0;
    background-color:rgba(255,255,255,0.75);
    height:100%;
    width:100%;
    position:fixed;
    top:0;
    left:-200%;
    transition:opacity 1s linear;
    -webkit-transition:opacity 1s linear; /* Safari */
    -moz-transition:opacity 1s linear; /* Firefox */
    -o-transition:opacity 1s linear; /* Opera */
}

.h_small_line{
    background-color:#00427C;
    width:5%;
    height:2px;
    margin:0;
    padding:0;
    display:inline-block;
    margin:0 7px;
}

img.header_dots{
    padding:0 2px;
    width:1.3%;
    margin-top:15px;
}

.header_class h2{
    display:inline;
    font-style:normal;
    font-size:160%;
}

.col_class{
    width:32%;
    text-align:center;
    display:inline-table;
    margin-top:35px;
    margin-bottom:50px;
}

.col_class img{
    width:30%;
}

.col_class p{
    font-size:medium;
    margin-left:25px;
    margin-right:25px;
    line-height:150%;
}

.col_class h2{
    font-weight:400;
    margin-left:25px;
    margin-right:25px;
    font-size:120%;
    color:#4A96CD;
}

.dots{
    padding:0 2px;
}

.little_dots{
    padding:0 2px;
}

.blue_line{
    height:2px;
    width:40%;
    background-color:#4A96CD;
    display:inline-block;
}

#first_line{
    height:8px;
}

#content ul{
    margin-left:7%;
    padding-left:3%;
    margin-right:3%;
    border-left:18px solid #4A96CD;
    color:#87888A;
    font-size:medium;
    line-height:170%;
}

#funct_icon{
    /*background-color:#4A96CD;*/
}

#custom_ul{
    display:none;
}

#specs_div{
    display:none;
}

.blue_bar{
    width:100%;
    height:100%;
    background-color:#4A96CD;
}

#about_div{
    position:absolute;
    text-align:center;
    width:100%;
    top:50%;
    color:#4A96CD;
}

#tabtus_div{
    position:fixed;
    width:25%;
    height:100%;
    left:0;
    top:-25%%;
    background-color:#4A96CD;
}

#monkey_div{
    position:fixed;
    width:25%;
    height:100%;
    top:0;
    right:0;
    background-color:#4A96CD;
}

.square_image{
    width:100%;
    padding:0;
}

.square_class{
    background-color:white;
    border:2px solid #4A96CD;
}

.details_text h3{
    color:white;
    font-weight:700;
}

.details_text p{
    color:white;
    font-weight:400;
    font-size:80%;
    
    margin-left:2%;
    padding:0;
    text-align:center;
}

.details_text{
    visibility:hidden;
    opacity:0;
    position:fixed;

    width:20%;
    height:20%;
    
    margin:2%;
    
    transform:rotate(-45deg);
    -ms-transform:rotate(-45deg); /* IE 9 */
    -webkit-transform:rotate(-45deg); /* Opera, Chrome, and Safari */
}

.details_text p a{
    font-weight:700;
    color:#9AB5A7;
}

.details_text p a:link{
    font-weight:700;
    color:#9AB5A7;
}

.details_text p a:visited{
    font-weight:700;
    color:#9AB5A7;
}

.details_text p a:active{
    font-weight:700;
    color:#9AB5A7;
}

#tabtus_text{
    top:0;
    left:0;
}

#monkey_text{
    top:0;
    right:0;
}

.transitional_class{
    transition:top 1s ease-out, left 0.7s ease, right 0.7s ease, opacity 2s linear, transform 1s ease-out;
    -webkit-transition:top 1s ease-out, left 0.7s ease, right 0.7s ease, opacity 2s linear, -webkit-transform 1s ease-out; /* Safari */
    -moz-transition:top 1s ease-out, left 0.7s ease, right 0.7s ease, opacity 2s linear, transform 1s ease-out; /* Firefox */
    -o-transition:top 1s ease-out, left 0.7s ease, right 0.7s ease, opacity 2s linear, -webkit-transform 1s ease-out; /* Opera */
}

@media (max-device-width:480px) , (max-width:480px){
   /* styles for browsers smaller than 480px*/
   #menu_button_elem{
        width:10%;
    }
    
    #veil{
        background-color:rgba(255,255,255,0.9);
    }
   
    #content ul{
        border:none;
        font-size:1.7em;
    }
    
    h2{
        font-size:1.7em;
    }

    #side_menu {
        width:100%;
    }
    
    #side_menu ul li{
        padding-top:5%;
        font-size:200%;
    }
}

@media (min-device-width: 481px) and (max-device-width: 1136px) and (orientation:portrait) {
    #menu_button_elem{
        width:10%;
    }
    
    #veil{
        background-color:rgba(255,255,255,0.9);
    }
   
    #content ul{
        border:none;
        font-size:1.7em;
    }
    
    h2{
        font-size:1.7em;
    }

    #side_menu {
        width:100%;
    }
    
    #side_menu ul li{
        padding-top:5%;
        font-size:200%;
    }
}

@media (min-device-width: 481px) and (max-device-width: 1136px) and (orientation:landscape) {
    #logo_item{
        display:none;
    }
    
    #menu_button_elem{
        width:10%;
    }
    
    #veil{
        background-color:rgba(255,255,255,0.9);
    }
   
    #content ul{
        border:none;
        font-size:1.7em;
    }
    
    h2{
        font-size:1.7em;
    }

    #side_menu {
        width:100%;
    }
    
    #side_menu ul {
        margin-top:0%;
        text-align:center;
    }
    
    #side_menu ul li{
        padding-top:5%;
        font-size:150%;
    }
    
    .line_item{
        display:none;
    }
}
