

.body_close{
    overflow:hidden;
    position:relative;
    left:0;
}

.body_open_left{
    left:220px;
}

.body_open_right{
    left:-220px;
}

/* OVERALL MENUS */

.srl_menu{
    margin-top: 112px;
    height:100%;
}

.prl_menu{
    margin-top:450px;
    height:100%;
}

.list_menu{
    list-style:none;
    padding:0;
    margin-right:-1px;
    width:158px;
}
.list_menu2{
    list-style:none;
    padding:0;
	margin-top:0px;
	xmargin-right:57px;
   
	
	
}

.list_menu h2{
    color:#ffffff;
    padding:12px 0 0 3px;
    height:32px;margin:0px;
    font-size:15px; xmargin-right:50px;
}

.list_menu li {
   
    width:150px;
    padding:8px 10px 8px 3px;
}
.list_menu li a { color:#f5f5f5;
    font-weight: 600;}


.list_menu2 h2 {
    color:#fff;
    padding:12px 0 0 10px;
    height:32px;
    margin:0px;
    font-size: 22px;
}

.list_menu2 li{
    color:#f5f5f5;
    font-weight: 100;
    width:160px; xmargin-right:50px;
    padding:8px 10px 8px 10px;
}

/* BUTTONS */

.button{
    border:none;
    outline:none;
    width: 68px;
    height:220px;
    padding:0;
    cursor:pointer;
}


.button2{
    border:none;
    outline:none;
    width: 61px;
    height: 217px;
    padding:0;
    cursor:pointer;
}

.button img{
    margin-right:5px;
    margin-top: -4px;
}

.sbutton{
	background-color:transparent;
    xbackground-color:#e74c3c;
    xborder-bottom:solid 1px #c0392b;
}

.pbutton{
    xbackground-color:#3498db;
    xborder-bottom:solid 1px #2980b9;
}

/* TRANSITIONS */

.slide_left_open,.slide_left_close,.slide_right_open,.slide_right_close,.slide_top_open,.slide_top_close,.push_left_open,.push_left_close,.body_close,.body_open_left,.body_open_right,.push_right_open,.push_right_close{
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	transition: all 0.3s ease;
}

/* MEDIA QUERIE EXAMPLES */

@media only screen and (max-width : 480px) {
    
    #slide_top > nav a{
        padding: 20px 0 25px 0;
    }
	
}




/* SLIDE LEFT MENU */

.slide_left_close{
    position:fixed;
    left:-158px;
} 

.slide_left_open{
    left:0px; z-index:10000;
}

/*-- if want auto --*/
#slide_left{height:200px;z-index:999;}
#slide_left:hover{left:0px;z-index:999;}
#slide_left:after{position:fixed;left:-158px;z-index:999;}
#slide_left > ul{float:left;margin: 0px;border:1px solid #445067;background-color:#030f19;padding-left:5px;}
#slide_left > ul > h2{padding-bottom:30px; color:#ffffff;border-bottom:solid 1px #ffffff; font-weight:bold;}

}

#slide_left ul li{
    xbackground-color:#f46354;
}

#slide_left ul li:hover{
    xbackground-color:#f35a4a;
}


#slide_left2{height:200px;z-index:999;}
#slide_left2:hover{left:0px;z-index:99;}
#slide_left2:after{position:fixed;left:-158px;z-index:99;}
#slide_left2 > ul{float:left;margin: 0px;border:1px solid #445067;background-color:#030f19;padding-left:5px;}
#slide_left2 > ul > h2{padding-bottom:30px; color:#ffffff;border-bottom:solid 1px #ffffff; font-weight:bold;}

/* SLIDE RIGHT MENU */

.slide_right_close{
    position:fixed;
    right:-182px;/* ok */
}

.slide_right_open{
    right:-20px; /* ok */z-index:10000;
}

/*--- right side auto */
#slide_right{
 height: 200px;
 z-index:999;
}
#slide_right:hover{
 right:-20px; 
 z-index:99;
}
#slide_right:after{
 position:fixed;
     right:-182px;/* ok */
 z-index:99;
}



#slide_right > ul{
    float:right;  border:1px solid #445067; 
    background-color:#030f19;
}

#slide_right > ul > h2{ padding-bottom:30px; color:#fff;
    border-bottom:solid 1px #fff; font-weight:bold;
}
#slide_right ul {margin: 0px;margin-right:20px;}
#slide_right ul li{
    xbackground-color:#f46354;
}
#slide_right ul li:hover{
    xbackground-color:#f35a4a;
}

/* SLIDE TOP MENU */

#slide_top{
    position: absolute;
    width: 100%;
    text-align: center;
}

.slide_top_close{
    top:-236px;
}

.slide_top_open{
    top:-300px;
}

#slide_top > nav{
    padding:0;
    margin:0;
    background-color:#f46354;
    height:100%;
    overflow:hidden;
}

#slide_top > h2{
    color:#f5f5f5;
    width:100%;
    padding:10px 0;
    background-color:#e74c3c;
}

#slide_top > nav a{
    float:left;
    color:#f5f5f5;
    font-weight: 600;

    width:20%;
    padding: 36px 0;
}

#slide_top > nav a:hover{
    background-color: #f35a4a;
}

/* PUSH RIGHT MENU */

.push_right_close{
    position:fixed;
    right:-220px;
}

.push_right_open{
    right:0px;
}

#push_right > ul{
    float:right;
    xbackground-color:#3498db;
}

#push_right > ul > h2{
    border-bottom:solid 1px #2980b9;
}

#push_right ul li{
    xbackground-color:#6badda;
}

#push_right ul li:hover{
    xbackground-color:#4fa3dc;
}

/* PUSH LEFT MENU */

.push_left_close{
    position:fixed;
    left:-220px;
}

.push_left_open{
    left:0px;
}

#push_left > ul{
    float:left;
    background-color:#3498db;
}

#push_left > ul > h2{
    border-bottom:solid 1px #2980b9;
}

#push_left ul li{
    background-color:#6badda;
}

#push_left ul li:hover{
    background-color:#4fa3dc;
}



.mobileBox {
	border:1px solid #636159;
	width:140px;
	height: 43px;
	margin-bottom:6px;
	-webkit-border-radius: 5px 5px 5px 5px;
	border-radius: 5px 5px 5px 5px;
	text-transform: uppercase;
	background: #091521;
	display: flex;
	flex-direction: column;
	justify-content: center;
	overflow: auto;
}
.mobileBox h4 { font-size:15px; margin:0px; padding:0px;text-shadow: 0px 1px 1px #0055a5;}
.mobileBox p { font-size:12px;text-shadow: 0px 1px 1px #004177;}

.mobileBox:hover {opacity:0.8;}


.mobileBox img {
}

.srl_menu-2 {
    z-index: 1000;
    margin-top: 350px;
    height: 100%;
}
.mobileBox2 {
    border: 1px solid #636159;
    width: 140px;
    height: 58px;
    margin-bottom: 6px;
    -webkit-border-radius: 5px 5px 5px 5px;
    border-radius: 5px 5px 5px 5px;
    text-transform: uppercase;
    background: #091521;
    display: flex;
    flex-direction: column;
    justify-content: center;
    overflow: auto;
    font-size: 17px;
}