/*-------------------------
           LOGO
-------------------------*/
img.sp-retina-logo.hidden-xs {height: 120px;width: auto;padding-top: 15px;margin-top: -30px;}
img.sp-default-logo.hidden-xs {height: 100px;width: auto;top: 12px;position: relative;}
img.sp-default-logo.visible-xs {height: 80px;width: 130px;padding-left: 5px;}

/*logo background white*/
div#sp-logo:before {content: '';background: white;width: 100%;height: 101%;top: 0px;left: 0;position: absolute;z-index: -1;}
@media screen and (min-width:768px){
#sp-top2 ul.sp-contact-info {padding-right: 50px; margin-bottom: 10px;}
#sp-top2 .sp-module-content {padding-right: 50px;}
div#sp-logo:before {content: '';background: white;width: 100%;height: 168%;top: -45px;left: 0;position: absolute;z-index: -1;}
div#sp-logo {justify-content: center;display: grid;top: -23px;position:relative;margin-top: -20px;}}
#sp-header {background: transparent none repeat scroll 0 0!important;height: 63px;}

/*logo when scroll*/
.menu-fixed div#sp-logo {top: 0px;}
.menu-fixed div#sp-logo:before {
    content: '';
    background: white;
    width: 101%;
    height: 101%;
    top: 0px;
    left: 0;
    position: absolute;
    z-index: -1;
    }

@media screen and (max-width:767px){
.menu-fixed div#sp-logo:before {height: 101%;}}

.menu-fixed img.sp-retina-logo.hidden-xs {height: 91px;width: auto;}
.menu-fixed img.sp-default-logo.hidden-xs {height: 65px;margin-top: 0px;}
/*-------------------------
        TOP BAR
-------------------------*/
section#sp-section-1 {height: 40px;}

@media screen and (max-width:767px){
section#sp-section-1 {justify-content: center;}}

#sp-top2 ul.sp-contact-info {margin-bottom: 10px;}
/*color*/
#sp-top2 i.fa.fa-phone,#sp-top2 i.fa.fa-envelope {color: white;}
#sp-top2 li a {color: #ffffff;font-size: 12px;}
#sp-top2 li a:hover {color: #000;font-size: 12px;}
@media screen and (min-width:1200px){
  div#sp-top2 {top: 6px;}}

/*-------------------------
        TOP 2
-------------------------*/

#sp-top2 .sp-module-content a {color: white;font-size: 12px;}
#sp-top2 .sp-module-content a:hover {color: #000;font-size: 12px;}
div#sp-top2 {text-align: right; position:relative; top:5px;}

@media screen and (max-width:767px){
#sp-top2 .sp-module-content a {color: white;font-size: 12px;}
#sp-top2 .sp-module-content {text-align:center;}
div#sp-top2 {text-align: right;}}

@media screen and (min-width:992px){
  #sp-top2 .sp-column {display: inline-flex;}}
/*-------------------------
         NAVBAR
-------------------------*/
@media screen and (min-width:768px){
div#sp-menu {padding-right: 45px; height: 80px!important;}
.menu-fixed div#sp-menu {padding-right: 45px; height: 71px!important;}}
div#sp-menu {background: #fe6b00;border-top: 1px solid white;position:relative;}

.sp-megamenu-parent >li >a {color: white!important; margin-top: -7px;}

@media screen and (min-width:1200px){
.sp-megamenu-parent >li >a{font-size: 13px;}}

/*-------------------------
      NAVBAR - HOVER
-------------------------*/
/*#sp-header.header-sticky .sp-megamenu-parent > li > a, .sp-megamenu-parent > li > span { color: #ffffff; }

#sp-header.header-sticky .sp-megamenu-parent >li >a:before { content: " "; position: absolute; height: 0px; width: 1px; background-color: #ffffff; top: -50px; left: 50%; transition: linear 200ms;}

#sp-header.header-sticky .sp-megamenu-parent >li.active a:before, #sp-header.header-sticky .sp-megamenu-parent >li >a:hover:before { height: 50px; width: 1px; }

.sp-megamenu-parent >li >a:before {content: " ";position: absolute;height: 0px;width: 1px;background-color: #ffffff;top: 0px;left: 50%;transition: linear 200ms;}

.sp-megamenu-parent >li.active a:before, .sp-megamenu-parent >li >a:hover:before {height: 30px;width: 1px;}

.sp-megamenu-parent > li > a, .sp-megamenu-parent > li > span { color: #545454; padding: 0px 16px; }

@media screen and (min-width:992px) and (max-width:1199px){
.sp-megamenu-parent > li > a, .sp-megamenu-parent > li > span {padding: 0px 11px;}}

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

/*-------------------------
      NAVBAR - HOVER 2
-------------------------*/
/*.sp-menu-item a:hover {border-bottom: 4px solid white;transition:0.3s ease;}
.sp-menu-item a {transition:0.3s ease;}
li.sp-menu-item.current-item.active a {
    background: white;
    color: black!important; border-bottom: 4px solid white;
}*/

/*-------------------------
      NAVBAR - HOVER 3
-------------------------*/
.sp-megamenu-parent >li a:before  {
    position: absolute;
    content: '';
    background: #fff;
    height: 2px;
    width: 0;
    bottom: 4px;
    left: 0;
    right: 0;
    margin: auto;
    transition: 0.5s;
}
.sp-megamenu-parent >li.active>a:before, .sp-megamenu-parent >li a:hover:before {
    position: absolute;
    content: '';
    background: #fff;
    height: 2px;
    width: 75%;
    bottom: 4px;
    left: 0;
    right: 0;
    margin: auto;
}
#sp-header.menu-fixed .sp-megamenu-parent >li a:before  {
    position: absolute;
    content: '';
    background: #ffffff;
    height: 2px;
    width: 0;
    bottom: 13px;
    left: 0;
    right: 0;
    margin: auto;
    transition: 0.5s;
}
#sp-header.menu-fixed .sp-megamenu-parent >li.active>a:before, #sp-header.menu-fixed .sp-megamenu-parent >li a:hover:before {
    position: absolute;
    content: '';
    background: #ffffff;
    height: 2px;
    width: 75%;
    bottom: 13px;
    left: 0;
    right: 0;
  margin: auto;}

.sp-menu-item:last-child {
    background: white;
    color: black!important;
    border-bottom: 4px solid white;
    height: 79px;
}

.menu-fixed .sp-menu-item:last-child {
    background: white;
    color: black!important;
    border-bottom: 4px solid white;
    height: 70px;
}

.sp-menu-item:last-child a {
    color: black!important;
}
.sp-menu-item:last-child a:hover {
    color: #fe6b00!important;
}


/*-------------------------
         OFFCANVAS
-------------------------*/
#offcanvas-toggler >i {color: white;}
.offcanvas-menu .offcanvas-inner .sp-module ul > li a {color: #fe6b00;}
.offcanvas-menu {background-color: rgb(255 255 255 / 1); border-left: 5px solid #fe6b00;}

.close-offcanvas{border: 1px solid #fa791e!important;color: #fc7c21!important;}
/*-------------------------
       PAGE TITLE
-------------------------*/
.sp-page-title {
    padding: 100px 0 100px 0;
    background-attachment: scroll;margin-top: 0px;}

@media screen and (min-width:992px){
.about-page .sp-page-title {
    padding: 100px 0 200px 0;
    background-attachment: scroll;
    margin-top: -15px;
  }}    

.sp-page-title h2, .sp-page-title h3 {
    color: #ffffff;
    font-weight: 700!important;
    font-size: 40px!important;
}
@media screen and (max-width:767px){
.sp-page-title {
  margin-top: 52px;
  padding: 50px 0 50px 0;
  }
  
.sp-page-title h2{font-size: 22px!important;}}
/*-------------------------
        FOOTER
-------------------------*/
#sp-bottom a {color: #ffffff;}
.company-info {color: white;}

#sp-bottom {background-position: 50% -4%!important;}
@media only screen and (max-width: 480px){
#sp-bottom {padding: 40px 0px 0px 0px !important;}}

#sp-bottom #sp-bottom3 ul.nav.menu li {margin-bottom: 7px;}
#sp-bottom4 a:hover {color: #fe6b00;}

#sp-bottom2 .sp-module ul >li:before, #sp-bottom3 .sp-module ul >li:before {
  position: absolute;
  content: ">";
  color: #fff;
  left: -15px;
  font-weight: 600;
  font-family: 'Poppins';
}

#sp-bottom .sp-module ul >li:hover:before {
  color: #fe6b00;
}
/*-------------------------
        COPYRIGHT
-------------------------*/
@media screen and (max-width:767px){#sp-footer {padding-bottom:90px;}}
div#sp-footer1 {border-top: 1px solid white;padding-top: 15px;}

/*-------------------------
        GOOGLE MAP
-------------------------*/
.google-map .txtdir, .google-map .dirto, .google-map .dirfrom, .google-map .diraddr {color: black;}
.google-map input#saddr {width: 100%;padding: 20px;}
.google-map input.button {
    background: #fe6b00;
    outline: none;
    border: 1px solid #cecece;
    padding: 4px 20px;
}