@media (min-width: 768px){
.menuarea {                   position: relative;}

ul.menu{margin:0px;padding:0px}

ul.menu li:nth-child(1) .sprite{background-position: 40px -0px}
ul.menu li:nth-child(2) .sprite{background-position: 40px -32px}
ul.menu li:nth-child(3) .sprite{background-position: 40px -64px}
ul.menu li:nth-child(4) .sprite{background-position: 40px -96px}
ul.menu li:nth-child(5) .sprite{background-position: 40px -128px}
ul.menu li:nth-child(6) .sprite{background-position: 40px -160px}
ul.menu li:nth-child(7) .sprite{background-position: 40px -192px}
ul.menu li:nth-child(8) .sprite{background-position: 40px -224px}
ul.menu li:nth-child(9) .sprite{background-position: 40px -255px}

ul.menu li:nth-child(1):hover .sprite{background-position: 0px -0px}
ul.menu li:nth-child(2):hover .sprite{background-position: 0px -32px}
ul.menu li:nth-child(3):hover .sprite{background-position: 0px -64px}
ul.menu li:nth-child(4):hover .sprite{background-position: 0px -96px}
ul.menu li:nth-child(5):hover .sprite{background-position: 0px -128px}
ul.menu li:nth-child(6):hover .sprite{background-position: 0px -160px}
ul.menu li:nth-child(7):hover .sprite{background-position: 0px -192px}
ul.menu li:nth-child(8):hover .sprite{background-position: 0px -224px}
ul.menu li:nth-child(9):hover .sprite{background-position: 0px -255px}




ul.menu > li{
 display: inline-block;
 text-align:center;
 vertical-align:top;
 width: 11.1%;;/* width: 12.48%;*/
 font-size:11px;
 height:85px;
 padding-top:10px;
 padding-bottom:10px;
 font-family:roboto;
 list-style:none;
 transition: all 0.2s ease;
}

.menuarea  ul.menu  ul.items {padding: 20px;}
.menuarea ul.items li a.submenu {
    font-size: 14px;
}


.menuarea ul.items li a.submenu span.labe0l{
    display: inline-block;
    width: 75%;
    vertical-align: top;
}


.menuarea ul.items li{font-size:13px}
.menuarea ul.items li.decorative_img 
{
    width: 65% !important;
    margin-left: auto;
    text-align: right;
}

.menuarea ul.items li.decorative_img img{width:100% !important}


ul.menu>li:nth-child(n+3)>a {
    border-left: 1px solid rgba(204,228,247,0.20);
}
ul.menu>li>a{ display: block;padding-left:5px;padding-right:5px;    height: 62px;	}

ul.menu > li .sprite{
 display:block;
 margin-left:auto;
 margin-right:auto;
 width:40px;
 height:32px;
 background:url('/files/filtericons/menu_sprite1.png');
}
ul.menu > li:hover { background: #ffd500;}

/*ul.menu > li:hover a{color:#444;text-decoration:none}*/

ul.menu > li:hover> a{color:#444;text-decoration:none}
.menuarea ul.items li a{color:#444;}
.menuarea ul.items li a:hover{color:#0078d7;}


ul.menu > li  li a{color:#444;text-decoration:none}
ul.menu ul.items img{width:auto !important;max-width:auto;}
ul.menu ul.items>li{font-weight:700}
ul.menu ul.items>li li{font-weight:400}

ul.menu> li> ul.items{
 -moz-transition: all 0.01s ease-out;
 -o-transition: all 0.01s ease-out;
 -webkit-transition: all 0.01s ease-out;
 transition-delay:0.6s;

/* height:0px;*/
 overflow:hidden;
 background:#f2f3f5;
 top:85px;
 left:15px;
 right:17px;
 display:block;
 position:absolute;
 z-index:1000;
 text-align:left;
 opacity: 0;
 visibility:hidden;
 border:2px solid #ffd500;
 padding-top:10px;
 padding-bottom:10px;


}

ul.menu >li:hover> ul.items{

  opacity: 1;
	visibility: visible;

}

ul.menu >li> ul.items> li{display: inline-block;vertical-align:top;width:32%;padding-right:10px}
ul.menu >li> ul.items ul {margin:0px;padding:0px;}
ul.menu >li> ul.items> li li{list-style:none;padding:5px 40px;}
ul.items li a:hover {text-decoration:underline !important}

li.arr_menu{padding:5px 0px !important;}
li.arr_menu span.img{text-align:center} 
li.arr_menu span img{margin-left:auto;margin-right:auto}
li.arr_menu span{
    display: inline-block;
    vertical-align: middle;
    min-width: 55px;
}

ul.menu li.red  {    background: #EC3843;list-style:none;	}
ul.menu li.red:hover{ background:#f44e59}
ul.menu li.red:hover a{color:#fff !important}
}


@media (max-width: 767px){
 .userlinks .items{text-align:center !important}
 .userlinks{background:#0078d7;}
 .userlinks a{color:#fff !important;font-size:24px}

 
.menuarea ul.items li.decorative_img{display:none !important;}
.footer b{font-size:18px !important}
 #body{  transition: 0.3s;  position:relative;  left:0px;}
 .mmenu_border{ width: 100%; left: 300px !important; position: fixed !important; top:0px; }
 .mmenu_border > #mobile_menu_bg {   background: #444; position: absolute; left: 0px;  top: 0px; bottom: 0px; opacity: 0.9; width: 100%;  display: block !important; z-index: 800;}
 .mmenu_border > #mobile_menu_bg i{ color: #fff;margin-top: 10px;margin-left: 10px;font-size: 24px;}
 #mobile_menu_bg{    display: none;}

 .menuarea{position:fixed;top:0px;left:-300px; width:300px;bottom:0px; transition: 0.3s; background: #fff;overflow-x:hidden;    z-index: 1;}
 .menuarea li.hide_menu, .menuarea li.show_menu,.menuarea li.hide_sub_menu{position:absolute;top:0px;left:300px; width:300px;bottom:0px; transition: 0.3s; background: #fff;}
  .col-md-12.menuarea {    padding: 0px;}
 .menuarea ul {margin:0px;padding:0px}
 .menuarea a{color:#444}
 .show_menu{left:0px !important;}
 .hide_menu{left:-300px !important;}
 .hide_sub_menu {left:300px;}
 .menuarea li{list-style:none;  }
 .menuarea img{display:none}
 .menuarea li.show_menu ul ul, .menuarea.show_menu >ul ul{display:none}
 .menuarea.show_menu li.show_menu >ul{display:block}
 
 .menuarea li.show_menu> ul ul{display:none}
 .menuarea a{border-bottom:1px solid #dadada;display:block; width:100%;text-decoration:none;color:#444;}

 .menuarea li.show_menu>a{background:#d6effb;}
 .menuarea li.show_menu .sprite{display:none;}
 .menuarea li.show_menu>a:before{
 width:30px;
 height:30px;
 color: #444;
 padding:10px;
 content: "\f104";
 font-family:FontAwesome, roboto;
 }
 .menuarea a div.mmenu, .menuarea .arr_menu a{vertical-align:middle;display:inline-block; padding: 15px;    width: 239px;}
 
li.show_menu>.submenu:after { content: " " !important;display:none;}
.submenu:after{
 width:30px;
 height:30px;
 color: #444;
 padding:10px;
 content: "\f105";
 font-family:FontAwesome, roboto;
}
 .menuarea .arr_menu a{width:100%}
 .menuarea .arr_menu ul{display:block !important}

}

@media (min-width: 768px) and (max-width: 991px){
 ul.menu > li{ font-size:11px !important;}
}