.overlay-styles {           
    height: 100%;
    width: 100%;
    position: fixed; 
    z-index: 1; 
    left: 0;
    top: 0;
    background-color: #135eacd9; 
    opacity: 0.87;
    overflow-x: hidden; 
    transition: 2s;  
}

.overlay-content-styles {
    position: absolute;
    top: 10%;
    left: 5%;
    text-align: center;           
    width: 50%;
    transition: 0.2s;
    z-index: 10;

}
@media(max-width: 600px){
    .overlay-content-styles {
        position: absolute;
        top: 10%;
        left: -7%;
        text-align: center;           
        width: 50%;
        transition: 0.2s;
        z-index: 10;
    
    }

}
@media(min-width: 768px) and (max-width: 1023px){
    .overlay-content-styles {
        position: absolute;
        top: 10%;
        left: -1%;
        text-align: center;           
        width: 50%;
        transition: 0.2s;
        z-index: 10;
    
    }

}        

.overlay-content-styles > h3 {
    color: rgb(255, 174, 0);
    background: white;
    border: 2px solid #ccc;
    margin: 0;
    border-radius: 20px;
    padding: 0;
}

.close-button-styles {
    position: fixed;
    top: 0;
    right: 0;
    margin-right: 20px;
    margin-top: 20px;
    display: block;
    cursor: pointer;
    color: rgb(255, 255, 255) !important;
    z-index: 20;
    font-size: 20px;
    border: 1px solid rgb(255, 255, 255);
    padding: 2px 5px;
    border-radius: 5px;
    opacity: 0.5;
}

.container-overlay-sbmenu {
height:100%;
}
.classa {
color:#fff;
text-decoration:none;
border-bottom:1px dotted #fff;
padding:0px 0px 10px 0px;
width:100%;
display:block;
height:100%;
font-size: 14px;
text-align: left;
}


.classli {
padding:20px 20px 0 20px;
width:100%;
color:#fff;
}
@media(max-width: 600px){
    .classli {
        padding:20px 55px 0 20px;
        width:100%;
        color:#fff;
        }

}
.container-overlay-sbmenu ul {height:100%;}
.container-overlay-sbmenu > ul {
width:250px;
background-color:#135eac00;
position:relative;
overflow:visible;
list-style: none;

}
@media(min-width: 768px) and (max-width: 1024px){
    .container-overlay-sbmenu > ul {
        width:200px;
        background-color:#135eac00;
        position:relative;
        overflow:visible;
        list-style: none;
    }
        

}
@media (max-width: 600px){
.container-overlay-sbmenu > ul {

border-right: none;
}

}
.container-overlay-sbmenu > ul > li {}
.container-overlay-sbmenu > ul > li:hover {background-color: #063260; color: #ffffff !important;}
.container-overlay-sbmenu > ul > li > ul {
display:none;
position:absolute;
right:-250px;
top:0;
width:250px;
background-color:#135eac00;
border-left: 2px solid white;
height: 545px;
}
@media(min-width: 768px) and (max-width: 1024px){
    .container-overlay-sbmenu > ul > li > ul {
        
        width:190px;
        left: 201px;
        
    }

}
.container-overlay-sbmenu > ul > li.active {
    background-color: white;
    color: rgb(255, 174, 0);

}
/* 5th  submenu */
.container-overlay-sbmenu > ul > li > ul > li > ul > li > ul > li > .classul {
display: none !important;
position: absolute;
right: -250px;
top:0;
width:250px;
background-color:#135eac00;
border-left: 2px solid white;
}
.container-overlay-sbmenu > ul > li > ul > li > ul > li > ul > li:hover ul {
display:block !important;
}
@media (max-width: 600px){
.container-overlay-sbmenu > ul > li > ul > li > ul > li > ul > li:hover ul {
display: inline-block !important;
position: inherit;
}

}
/*end 5th submenu */
/* 4th  submenu */
.container-overlay-sbmenu > ul > li > ul > li > ul > li > ul {
display:none !important;
position:absolute;
right:-250px;
top:0;
width:250px;
background-color:#135eac00;
border-left: 2px solid white;
}
@media(min-width: 768px) and (max-width: 1024px){
    .container-overlay-sbmenu > ul > li > ul > li > ul > li > ul {
        
        width: 181px;
        left: 183px;
       
    }

}
.container-overlay-sbmenu > ul > li > ul > li > ul > li:hover ul {
display:block !important;
padding-left: 20px;
}
/*end 4th submenu */

.container-overlay-sbmenu > ul > li:hover > ul {
display:block;
list-style: none;
padding: 0;
margin: 0;
}
@media (max-width: 600px){
.container-overlay-sbmenu > ul > li:hover > ul {
display: inline-block;
position: inherit;
margin-left: 8px;
padding-right: 60px;
width: 285px;

}

}
.container-overlay-sbmenu > ul > li > ul >li:hover {background-color: #063260;;
color: #135eac;}
.container-overlay-sbmenu > ul > li > ul > li > ul {
display:none;
position:absolute;
right:-250px;
top:0;
width:250px;
background-color:#135eac00;
border-left: 2px solid white;
height: 545px;
}
@media (min-width: 768px) and (max-width: 1024px){
    .container-overlay-sbmenu > ul > li > ul > li > ul {
        display:none;
        position:absolute;
        right:-250px;
        top:0;
        width:186px;
        left: 187px;
        background-color:#135eac00;
        border-left: 2px solid white;
        height: 545px;
    }



}
@media (max-width: 600px){
    .container-overlay-sbmenu > ul > li > ul > li > ul {
        height: 100%;
    }



}
.container-overlay-sbmenu > ul > li > ul > li:hover ul {
display:block;
list-style: none;
padding: 0;
margin: 0;
}
@media (max-width: 600px){
.container-overlay-sbmenu > ul > li > ul > li:hover ul {
display: inline-block;
position: inherit;
margin-left: -14px;
}

}
.container-overlay-sbmenu > ul > li > ul > li > ul > li:hover {background-color:#063260;}
.container-overlay-sbmenu > ul > li > ul > li ul li ul li {
padding: 20px 2px 0 2px;
}
.angle-right::after{
content: "\276F";
display: inline-block;

text-align: right;
float: right;
color: rgb(255, 174, 0);

}
a:hover{
    color: white;
    text-decoration: none;
}
.container-overlay-sbmenu > ul > li > ul > li ul li ul li:hover{
    background-color: #063260;
}
.container-overlay-sbmenu > ul > li > .brdr{
    height: 480px !important;
}
.container-overlay-sbmenu > ul > li > .brdr2{
    height: 1240px !important;
}
.container-overlay-sbmenu > ul > li > ul > li > .brdr3{
    height: 1240px !important;

}
@media(max-width: 600px){
    .container-overlay-sbmenu > ul > li > ul > li > .brdr3{
        height: 100% !important;
    
    }

}