/*RESET*/
html, body{
    height : 100%;
    min-height:100%;
    margin:0px;
    background-color:#000;
}
/*FLEX*/
.flexer{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
}
.flexer .demie{
    flex-basis: calc(33% - 48px);
    margin-bottom: 24px;
    margin-top: 24px;
}
.flexer .demie img{
    max-width: 250px !important;
}
/*FRAMEWORK*/
#menu_home{
    background-color:#000;
    background : url('../images/menubg.png') repeat left top;
    background-color:rgba(0,0,0,0.7);
    width : 240px;
    height : 100%;
    left:0px !important;
    min-height:818px;
    position:fixed;
    z-index:4;
    transition:all 1s ease;
    opacity:1 !important;
}
#menu_home.docked{
    left:0px !important;
    opacity:1 !important;
}
#menu_home.undocked{
    left:0px !important;
    opacity:1 !important;
}

#slider{
    height:480px;
    position:relative;
}
.newsection{
    padding-top:24px;
    padding-right:60px;
    padding-left:264px;/*respect menu width*/
    position:relative;
    z-index:3;
    transition:all 1s ease;
    padding-bottom:120px;
}
#supersized{
    position:relative !important;
    z-index:1 !important;
}
#supersized li{
    position:absolute !important;
}
/*CONTENT NEW SECTION*/
.newsection{
    color:#FFF;
}
/*OLD CONTENT*/
#c_circle{
    position:absolute;
    top:-60px;
    width:100%;
    height:100%;
    text-align:center;
    z-index:2;
}
#c_circle div{
    /*
    background-color:#FFF;
    border-radius:125px;
    */
    background-image:url('../images/main-badge.png');
    background-repeat:no-repeat;
    background-position:center;
    /*width:600px;*/
    max-width:100%;
    height:513px;
    position:relative;
    margin:auto;
    margin-left:240px;/*respect menu width*/
    transition:all 1s ease;
    /*bottom:-15%;*/
}

/*MENU*/
.menu_toggle_bt{
    position:fixed;
    color:white;
    top:-36px;
    left:16px;
    transition:all 1s ease;
}
#logo{
    text-align:center;
}
#menu_home li a, #menu_home li span {
    display: inline-block;
    padding-left:8px;
    margin-left:20px;
    padding-right:20px;
    margin-bottom:12px;
    width:100%;
    height:auto;
    text-shadow:#000000 0 0 0px;
    border-left:#FFF solid 3px;
}
#menu_home li a:hover, #menu_home .current{
    background-image:url("../images/menuitembg.png");
}
#menu_home li span a{
    padding-left : 0;
    padding-right : 0;
}

html>body #menu_home li a { /* IE HACK... AGAIN! */
    width: auto;
}

html>body #menu_home li span { /* IE HACK... AGAIN! */
    width: auto;
}
#menu_home a, #social_menu a, #menu_home span{
    text-transform: uppercase;
    color : #fff;
    text-decoration: none;
    cursor: pointer;	
    font-family: 'Dosis', sans-serif;
    font-weight:400;
    font-size:20px;
}

#menu_home ul{
    list-style : none; 
    margin  : 0;
    padding-left : 0px;
    padding-right : 0px;
    padding-top : 8px;
    padding-bottom: 8px;
}
#social_menu{
    /*position:relative;
    bottom:60px;*/
}
#social_menu li a{
    font-size:12px;
    text-transform:lowercase;
    border:0px;
    vertical-align:middle;
}
#social_menu li a img{
    vertical-align:middle;
}
.sub_menu{
    display : none;
}
.menu_open{
    display : block !important;
}
.sub_menu ul{
    padding-top : 5px;
}

.sub_menu li{
    min-height : 23px; 
}

.sub_menu a{
    font-size: 26px !important;
    height : 23px !important; 
}
@media screen and (max-height: 680px){
    #menu_home a, #social_menu a, #menu_home span{
        font-size:16px;
    }
}
@media screen and (max-height: 600px){
    #logo{
        display:none;
    }

}
@media screen and (max-width: 600px){
    .newsection{
        padding-left: 20px!important;
        padding-right: 20px!important;
    }
}
@media screen and (max-height: 380px){
    #menu_home{
        position:relative;
        height:0px;
        min-height:500px;
        margin-bottom:-500px;/*=min-height of the menu*/
        overflow:visible;
    }
}
@media screen and (max-width: 820px){
    #menu_home, #menu_home.docked{
        left:-240px !important;
        opacity:.25 !important;
    }
    #menu_home.undocked{
        left:0px !important;
        opacity:1 !important;
    }
    .newsection{
        padding-left:60px;
    }
    #c_circle div{
        /*margin-left:3%;
        margin-right:3%;
        max-width:94%;*/
        margin-left:0px;
        background-size:94%;
    }
    .menu_toggle_bt{
        position: fixed;
        text-align: right;
        top:0px;
        left:0px;
        width:100%;
        height: 50px;
        z-index: 3;
        transition: all 1s ease;
        opacity: 1 !important;
    }

    .menu_toggle_bt button{
        background-color:transparent;
        border:none;
    }
    .menu_toggle_bt button p{
        text-decoration: none;
        line-height:50px;
        color:#fff;
        font-size: 50px;
        margin-right: 9px;
        margin-top:5px;

    }
    .menu_toggle_bt button p:focus, .menu_toggle_bt button:focus{
        outline:none;
    }

}
