/*-----
offcanvas
--------*/
/*burger icon hide desktop*/
@media(min-width:992px){
  a#offcanvas-toggler { display: none !important; }
}
.sp-slider .sp-dots {
    bottom: 10px !important;
}




/*------
header
-----*/
.logo-image {  height: 60px !important;}

/*------
menu
------*/
.sp-megamenu-parent>li:hover>a,
.sp-megamenu-parent>li.active>a,.sp-megamenu-parent>li.active:hover>a {color: #3598bf;}

.sp-megamenu-parent .sp-dropdown li.sp-menu-item.active>a,
.sp-megamenu-parent .sp-dropdown li.sp-menu-item:hover>a{
    color: #3498bf;
}

/*div#sp-menu li.sp-menu-item:last-child a*/
#sp-menu > div > nav > ul > li:nth-child(7) > a{
    background:#3598bf;
    max-height:40px;justify-content:center;align-content:center;
    padding:10px 25px;color:white; 
    border-radius:8px;
}
/*----
mobile menu
-----*/
@media (max-width: 575px) {
    #sp-header {  height: 60px;}
}

/*----
page title
-----*/
.sp-page-title {
    background: #3498bf;
    text-align: center;
}

/*----
 menu button
-----*/
button.menu-btn {
    background: #3498bf;
    padding:8px 25px;font-size:14px;
    border:none;border-radius:5px;position:relative;bottom:-8px;
}
button.menu-btn a{color: white;}

/*-----
button position on small device
-----*/
@media(max-width:991px) and (min-width:768px){
    div#sp-menu { margin-top: -10px;}
}

/*-----
mobile
-----*/

@media(max-width:386px){
    div#sp-menu { margin-top: -4em;display: contents;}
}

@media(max-width:480px){
    .logo-image{height:45px !important;margin-top:5px}
}
@media(max-width:349px){
    div#sp-menu { scale:.85;transform:translate(20px,0px);}
}


/*-----
dropdown menu colour
------*/
.offcanvas-menu .offcanvas-inner ul.menu>li a:hover, .offcanvas-menu .offcanvas-inner ul.menu>li a:focus, .offcanvas-menu .offcanvas-inner ul.menu>li span:hover, .offcanvas-menu .offcanvas-inner ul.menu>li span:focus,.offcanvas-menu .offcanvas-inner ul.menu li.active a{
    color: #3498bf;
}
.offcanvas-menu .offcanvas-inner ul.menu>li>ul li a {font-size: 16px;}
.offcanvas-menu .offcanvas-inner ul.menu>li>ul li  { padding:5px 0;}

ul.menu-child li a{
    color: #666 !important;
}
ul.menu-child li.active > a,
ul.menu-child li:hover a{
    color: #3498bf !important;
}