/*
Theme Name: DeluxeRoofing 
Theme URI: 
Author: Soms Support
Author URI: 
Description: Description
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: DeluxeRoofing 
Tags:
*/
/** LOADER STYLE **/
#loader { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: #fff; z-index: 99999999999; }
.spinner{ position: absolute; width: 100px; height: 100px; top: 50%; left: 50%; margin-left: -40px; margin-top: -40px; -webkit-animation: muter 2.0s infinite linear; animation: muter 2.0s infinite linear; -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; -ms-transform-style: preserve-3d; transform-style: preserve-3d; }
@-webkit-keyframes muter{ from{-webkit-transform: rotateY(0deg);}
  to{-webkit-transform: rotateY(-360deg); }
}
@keyframes muter{
  from{ -moz-transform: rotateY(0deg); -ms-transform: rotateY(0deg); transform: rotateY(0deg); } 
  to{ -moz-transform: rotateY(-360deg); -ms-transform: rotateY(-360deg); transform: rotateY(-360deg); } 
}

/* The Modal (background) */
.modal, .modal2, .modal-portofolio {display: none;position: fixed;z-index: 5; padding-top: 100px;left: 0;top: 0;width: 100%; height: 100%; overflow: auto; background-color: rgb(0,0,0); background-color: rgba(0,0,0,0.4); }
/* Modal Content */
.modal-content {position: relative;background-color: #fefefe;margin: auto;padding: 0;border: 1px solid #888;width: 400px;box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);-webkit-animation-name: animatetop;-webkit-animation-duration: 0.4s;animation-name: animatetop;animation-duration: 0.4s}
/* Add Animation */
@-webkit-keyframes animatetop {from {top:-300px; opacity:0} to {top:0; opacity:1}}
@keyframes animatetop {from {top:-300px; opacity:0}to {top:0; opacity:1}}
/* The Close Button */
.close, .close2, .close-portofolio {color: white;float: right;font-size: 28px;font-weight: bold;}
.modal-header .close, .modal-header .close2 {margin-top: 10px;}
h2.title-enquire {text-align: center;}
.close:hover,
.close:focus, .close2:hover,
.close2:focus {color: #000;text-decoration: none;cursor: pointer;}
.modal-header {padding: 2px 16px;background-color: #4c7ad0;color: white;}
.modal-body {padding: 20px 35px;}
.modal-body .wpcf7 .wpcf7-form textarea {height: 70px;width: 100%;border-radius: 5px;border-color: #8b898a;border-width: 1px;border-image: none;border-style: solid;padding: 0 5px;}
.modal-body .wpcf7 .wpcf7-form input {width: 100%;border-radius: 5px;border-color: #8b898a;border-width: 1px;border-image: none;border-style: solid;height: 27px;padding: 0 5px;}
.modal-body .wpcf7 .wpcf7-form input.wpcf7-submit {width: 100%;margin-top: 10px;background: #105592;border-color: transparent;padding: 5px 10px;height: 38px;font-size: 20px;color: #fff;text-transform: uppercase;}
.modal-body .wpcf7 .wpcf7-form p.sub-button {margin-bottom: 0;}
.modal-body .wpcf7 .wpcf7-form textarea::-webkit-input-placeholder, .modal-body .wpcf7 .wpcf7-form input::-webkit-input-placeholder {color: #888484;font-family: FontAwesome, 'Open sans';font-weight: 100;font-style: normal;font-size: 16px;}
.modal-body div.wpcf7-response-output {margin: 0;padding: 0.2em 1em;}
.modal-body div.wpcf7-validation-errors {border: 2px solid #5cb85c;}
.modal-description p {font-size : 15px;color: #000 ;font-family: 'Open sans';text-align: center;}
.g-recaptcha {display: block;width: 94%;margin: auto;}
.page-header {padding-bottom: 9px;margin: 40px 0 20px;border-bottom: 1px solid #fff;}

/*   HEADER  */
.navbar-default{background:#fff;border:none !important;z-index: 2;opacity : 0;transition: opacity .1s cubic-bezier(.694,.0482,.335,1);}
.logo-image-small img { width: 43%; }
.navbar-default .menu-section {padding: 15px 0 5px 0;}
.navbar-default .menu-header {margin-top: 0px;}
.navbar-default .contact-box span {font-size: 20px;color: #000;font-family: 'Open sans';font-weight: 300;}
.navbar-default .contact-box i {font-size: 20px;color: #2f238f;margin-right: 15px;}

#header { background: #fff; padding: 5px 0; }
.logo-image img {width: 70%;}
.menu-section { padding : 45px 0 5px 0 ; }
.contact-section { text-align: right; display: block; }
.contact-box { display: inline-block; margin-left: 50px; }
.contact-box i { font-size : 30px; color: #2f238f; margin-right: 15px; }
.contact-box span { font-size: 30px; color: #000; font-family: 'Open sans'; font-weight: 300;  }
.menu-header {margin-top: 15px;}
/**  SF-MENU  **/
.header-menu {margin-top: 0; text-align: right;margin: 0; }
.header-menu li { list-style: none; display: inline-block; text-align: right; margin: 0px 0 0 10px; padding: 3px 0px;}
.header-menu a { color: #fff; text-decoration: none; font-size: 23px; font-family: 'Open sans'; font-weight: 600; padding: 3px 5px;}
.header-menu a:hover { background: #aaaaaa; }
.contact-box a, .featured-menu a { text-decoration: none; }

.sf-menu{ float: none;margin-bottom: 0;text-align: right;font-family: 'Open Sans'; margin-right: 0;}
.sf-menu li a{border: none;padding: 8px 6px;color: #2f248c;display: block;text-transform: capitalize;font-weight: 400;font-size: 22px;}
.sf-menu li { background: transparent; }
.sf-menu li{ text-transform: uppercase;display: inline-block;float: none;}
.sf-menu li:hover {color: #000; background: transparent; }
.sf-menu ul{ box-shadow: none; min-width: 0; }
.sf-menu li a:hover {color: #888888; background: transparent; }
.sf-menu li+li{ margin-left: 45px; border-radius: 7px; }
.sf-menu li.current-menu-item {background: transparent; border-radius: 7px;}
.sf-menu li.current-menu-item a {color: #fff;background: transparent; border-radius: 7px;}
.sf-menu li:not(:last-child):before {content: "/";position: absolute;top: 8px;right: -24px;font-weight: 300;font-size: 24px;color: #2f248c;}
a.showmenu { display: none; }

/*---------------------------------------------------------------------*/
/*  HOMEPAGE  */
/** SLIDE STYLE **/
.owl-carousel .owl-item{ -webkit-backface-visibility: visible; /** prevent chrome image glitch **/ }
.owl-carousel .owl-item img{ height: auto; width: 100%; max-width: 100%; margin: 0 auto; display: block;}
.owl-carousel .owl-item .item { height: auto; width: 100%; max-width: 100%; margin: 0 auto; display: block;}
.owl-theme .owl-controls .owl-dots{ position: absolute; bottom: 12px; right: 0; left: 0; text-align: center; }
.owl-theme .owl-controls .owl-dot{ display: none; zoom: 1; *display: inline;/*IE7 life-saver */ }
.owl-theme .owl-controls .owl-dot span{ display: block; width: 17px; height: 17px; border-radius: 50%; background: #0859d7; margin: 0 3px; }
.owl-theme .owl-controls .owl-dot.active span, .owl-theme .owl-controls.clickable .owl-dot:hover span{ background: #0d47a1; }

.home-slider .slide{ font-size: 25px; color: #fefeff; text-align: center; line-height: 1; font-weight: 600; }
.slider-wrap .owl-theme .owl-controls .owl-nav div.owl-prev {left: 15px;}
.slider-wrap .owl-theme .owl-controls .owl-nav div.owl-next {right: 15px;}
.slider-wrap .owl-theme .owl-controls .owl-nav div {position: absolute;margin-top: -78px;top: 70%;border-radius: 50%;opacity: 1;color: #074157;background: rgba(255, 255, 255, 0.42);webkit-box-shadow: 0px 5px 2em 0px rgba(31,31,31,0.43);-moz-box-shadow: 0px 5px 2em 0px rgba(31,31,31,0.43);box-shadow: 0px 5px 2em 0px rgba(31,31,31,0.43);padding: 0 18px;}
.navigation .owl-prev:before{ content: "\f0a8";}
.slider-wrap .owl-nav .owl-prev i, .slider-wrap .owl-nav .owl-next i {font-size: 38px;padding: 4px 0px;font-weight: bold;} /* navigation slider */
.home-slider .slide {font-size: 32px;position: initial;right: 0;bottom: 0%;color: #fff;font-weight: 300;text-align: left;font-family: 'Open Sans';background: rgba(0, 0, 0, 0.58);width: fit-content;height: 65px;margin-left: 0;padding: 15px;}
.slider-wrap .container {position: absolute;right: 0;left: 0;bottom: 10%;}

.animated  {
  -webkit-animation-duration : 3s  ;
  animation-duration : 3s  ;

  -webkit-animation-delay : 500ms  ;
  animation-delay : 500ms  ;
}

.animate-out {
  -webkit-animation-delay : 0ms  ;
  animation-delay : 0ms  ;
}
/**  WELCOME  **/
#welcome { background: #fff; padding: 35px 0 75px 0; }
.content-welcome {color: #000;font-family: 'Open sans';font-weight: 300;line-height: 1.8;font-size: 18px;text-align: center;}
.content-welcome p { font-size: 18px; }
.content-welcome h1 { font-size: 48px; }
/**  ABOUT US  **/
#about-us-nav,#portofolio-nav, #services-nav, #project-nav, #contact-nav { width: 100%; height: 96px; margin-top: -96px; }
#about-us { background: url('image/BG image portfolio.jpg') 50% 55% repeat fixed; background-size: cover;/* background-position: top; */}
.the-hidden { background: rgba(0, 0, 0, 0.75); padding: 60px 0;}
.center-text { font-family: 'Open sans'; text-align: center; font-weight: 600;}
.center-text span {font-size: 75px; color: #fff; }
.sidebar-about-us { text-align: left; margin-top: 20px;}

/**  SINGLE GALLERY  **/
#single-gallery { background: #fff; padding: 25px 0px;  }
.single-gallery { font-family: 'Open sans'; text-align: center; font-size: 18px; color: #000; font-weight: 300;}
.single-gallery p { line-height: 1.8; }
.image-gallery {margin: 20px 0;}
.image-gallery .img-responsive { margin: auto; }
.image-gallery img { border: 20px solid #fff; webkit-box-shadow: 0px 0px 1px 1px rgba(0,0,0,0.28);-moz-box-shadow: 0px 0px 1px 1px rgba(0,0,0,0.28);box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.28); }
/**  PORTFOLIO  **/
#portofolio-bg { background: url('image/portfolio BG image.jpg') 50% 100% repeat fixed; background-size: cover; } 
#portofolio { background: #c5c5c5; padding: 65px 0 125px 0; text-align: center; }
.title-portofolio { text-align: center; font-family: 'Open sans'; font-size: 48px; color: #313540; margin-bottom: 35px;}
#portofolio .owl-theme .owl-controls {margin-top: 10px;text-align: center;position: relative;right: 0;left: 0;bottom: 0;top: 10px;}
#portofolio .owl-theme .owl-controls .owl-nav div.owl-prev {position: absolute;margin-top: 0;top: 70%;border-radius: 0px;opacity: 1;color: #fff;background: #364aeb;padding: 5px 14px;}
#portofolio .owl-theme .owl-controls .owl-nav div.owl-prev {right: 45px;}
#portofolio .owl-theme .owl-controls .owl-nav div.owl-next {position: absolute;margin-top: 0;top: 70%;border-radius: 0px;opacity: 1;color: #fff;background: #2f238f;padding: 5px 14px;}
#portofolio .owl-theme .owl-controls .owl-nav div.owl-next {right: 0px;}
#portofolio .owl-theme .owl-controls .owl-nav div.owl-prev i, #portofolio .owl-theme .owl-controls .owl-nav div.owl-next i { font-size: 20px; }
.image-portofolio img { border: 15px solid #fff; webkit-box-shadow: 0px 0px 1px 1px rgba(0,0,0,0.28);-moz-box-shadow: 0px 0px 1px 1px rgba(0,0,0,0.28);box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.28); }

.overlay {position: absolute;top: 0;bottom: 0;left: 0;right: 0;background: rgba(0,0,0,0.5);transition: opacity 200ms;visibility: hidden;opacity: 0;
  &.light {background: rgba(255,255,255,0.5);}
  .cancel {position: absolute;width: 100%;height: 100%;cursor: default;}
  &:target {visibility: visible;opacity: 1;}
}

.popup {margin: 75px auto;padding: 20px;background: #fff;border: 1px solid #666;width: 300px;box-shadow: 0 0 50px rgba(0,0,0,0.5);position: relative;
  .light & {border-color: #aaa;box-shadow: 0 2px 10px rgba(0,0,0,0.25);}
  h2 {margin-top: 0;color: #666;font-family: "Trebuchet MS", Tahoma, Arial, sans-serif;}
  .close-portofolio {position: absolute;width: 20px;height: 20px;top: 20px;right: 20px;opacity: 0.8;transition: all 200ms;font-size: 24px;font-weight: bold;text-decoration: none;color: #666;
    &:hover {opacity: 1;}}
  .content {max-height: 400px;overflow: auto;}
  p {margin: 0 0 1em;&:last-child {margin: 0;}
  }
}
.portofolio-caption { font-family: 'Open sans'; font-weight: 300; font-size: 26px; text-align: center;margin-top: 15px; margin-bottom: 20px; color: #000; }
.portofolio-section a:hover { text-decoration: none; }
/**  SERVICES  **/
#services { background: url('image/bg image portflio.jpg') 50% 100% repeat fixed; background-size: cover; }
.services-gallery { background: #fff; padding: 40px 0px; }
.image-services { margin-bottom: 10px; background: #fff; border : webkit-box-shadow: 0px 0px 1px 1px rgba(0,0,0,0.28);-moz-box-shadow: 0px 0px 1px 1px rgba(0,0,0,0.28);box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.28); padding: 8px; }
.shadow { position: relative; background: rgba(0, 0, 0, 0.31); }
.shadow-image span { position: absolute;color: #fff;font-family: 'Open sans';font-size: 48px;vertical-align: middle;text-align: center;line-height: 1.2;font-weight: 300;display: flex;justify-content: center;align-items: center;width: 100%;height: 100%;}
.shadow-image {background: rgba(0, 0, 0, 0.31);position: absolute;    width: 100%;height: 100%;top: 0px;left: 0px }
.shadow-image p { margin: 0; }
.service-description { margin-top: 5px; margin-bottom: 25px; font-family: 'Open sans'; text-align: left; font-weight: 300; font-size: 16px; color: #000; }
.service-description p { margin: 0; line-height: 1.5;  }
/** RECENT PROJECT **/

#recent-project { background: url('image/header customer testimonial BG image.jpg') 50% 100% repeat fixed; background-size: cover;}
#project { background: #fff; padding: 60px 0 100px 0; text-align: center; }
#project .owl-theme .owl-controls {margin-top: 10px;text-align: center;position: relative;right: 0;left: 0;bottom: 0;top: 10px;}
#project .owl-theme .owl-controls .owl-nav div.owl-prev {position: absolute;margin-top: 0;top: 70%;border-radius: 0px;opacity: 1;color: #fff;background: #364aeb;padding: 5px 14px;}
#project .owl-theme .owl-controls .owl-nav div.owl-prev i, #project .owl-theme .owl-controls .owl-nav div.owl-next i { font-size: 20px; }
#project .owl-theme .owl-controls .owl-nav div.owl-prev {right: 45px;}
#project .owl-theme .owl-controls .owl-nav div.owl-next {position: absolute;margin-top: 0;top: 70%;border-radius: 0px;opacity: 1;color: #fff;background: #2f238f;padding:5px 14px;}
#project .owl-theme .owl-controls .owl-nav div.owl-next {right: 0px;}

.slide-testimonial {margin-bottom: 0;}
.slide-testimonial p {text-align: left; font-size: 18px; margin-bottom: 5px; color: #000; padding: 2px; font-weight: 300; font-family: 'Open Sans'; text-align: center;}
.slide-testimonial .bx-wrapper {margin-bottom: 0px;}
.slide-testimonial .bx-viewport { width: 100% !important; margin-right: 5px; border: none; box-shadow: none;}
.slide-testimonial span { text-align: left; font-size: 18px; margin-bottom: 5px; color: #cba76a;font-style: italic;font-family: 'Open sans';text-transform: capitalize;}
.slide-testimonial .bx-wrapper .bx-pager {padding-top: 0px;bottom: 2px;bottom: -30px;text-align: center;}
.slide-testimonial .bx-wrapper .bx-pager.bx-default-pager a {background: #7e7a98;width: 10px;height: 10px;border-radius: 50%;margin: 0 3px;}
.slide-testimonial .bx-wrapper .bx-pager.bx-default-pager a:hover, .bx-wrapper .bx-pager.bx-default-pager a.active {background: #2e2187;}
.slide-testimonial .bx-controls-direction { display: none; }
.copyright { background : #000; padding: 3px;}
.copyright p { text-align: center; font-size: 23px; font-family: 'Open Sans'; color: #fff; }
.copyright a { color: #f387d8; text-decoration: none; }
.entry-title {color: #eeb1d0;}
.bxslider span { color: #878783; }

/**  PARTNER CONTENT  **/
.partners { padding: 25px 0 60px 0; background: #c5c5c5; }
.image-partner { text-align: center; vertical-align: middle; }
.image-partner img { margin: 0px 55px }
.image-partner span { color: #313540; font-family: 'Open sans'; font-size: 47px; font-weight: 600; margin-bottom: 15px; display: block;}

/*---------------------------------------------------------------------*/
/*  FOOTER  */
/** CONTACT SECTION **/
.contact-handle { margin: 45px 0 40px 0; text-align: left;}
.contact-section-footer { background: #eeeeee; padding: 35px 0; }
.icon-contact {     background: #4b79cd;padding: 20px;border-radius: 46px;display: inline-block;width: 70px;height: 70px;text-align: center;vertical-align: middle;margin-right: 10px;}
.icon-contact i { color: #fff; font-size: 30px; }
.info-contact { display: inline-block;vertical-align: text-top;text-align: left;margin-top: -5px;}
.info-contact .info-title-contact { font-family: 'Open Sans'; color: #4b79cd; font-size: 22px; margin-bottom: 8px; font-weight: 300;margin: 0;}
.info-contact .desc-contact { font-family: 'Open Sans'; color: #000; font-size: 18px; font-weight: 300;}
.desc-contact p { margin-bottom: 0px; }

.contact-form { background: #eeeeee; padding: 20px; border: solid 1px #acacac; margin-top: 25px;}
.contact-form input[type=text], .contact-form input[type=number], .contact-form input[type=email] {font-family: 'Open sans'; width: 100%;margin: 0px 0 5px 0px;box-sizing: border-box;border: none;padding: 5px 10px;}
.contact-form textarea { width: 100%;padding: 5px 10px;border: none;height: 120px;font-family: 'Open sans';}
.contact-form input[type=submit] { padding:7px 21px; color: #fff; font-family: 'Open sans'; font-size: 15px; text-decoration: none; background: #4b79cd; text-align: right; border: none;}
.contact-form .submit { text-align: right; }
.contact-form .wpcf7 .ajax-loader {float: left;}
.contact-form #spin { display: none; }

/** FOOTER MENU */
.footer-nav { padding: 25px 0; background: #364aeb;  }
.footer-navigation { font-family: 'Open sans'; color: #fff; }
.footer-menu { list-style: none; color: #fff; text-align: center; margin: 0; }
.footer-menu li { display: inline-block; font-size: 23px; }
.footer-menu li+li:before {content: "/";font-size: 20px;color: #fff; font-weight: 300;}
.footer-menu li+li { margin: 0 10px; }
.footer-menu a { color: #fff; margin-left: 20px; text-decoration: none; font-weight: 300;}
 
/* COPYRIGHT */
.copyright {background: #fff; padding: 30px 0px; text-align: center; }
.copyright-text { color: #313540;font-size: 23px; font-family: 'Open sans'; font-weight: 300; }
.copyright-text a { color: #313540 ; text-decoration: none;}
/* PAGE  */
/* EXTRA STYLE  */
.hidden-sm {visibility: hidden;display: none;}
@media (max-width: 320px) { /* Iphone 5 */

}
@media (max-width: 420px) {
.modal-content {
    width: 95%;
}
}
@media (max-width: 767px){ /** mobile only **/
/*   HEADER  */
.hidden-sm {visibility: visible;display: block;}
.navbar-default .menu-header {margin-top: -30px;}
.menu-header {margin-top: -28px;}
.logo-image img {width: 55%;margin: auto;}
.contact-box span {font-size: 16px;color: #000;font-family: 'Open sans';font-weight: 300;}
.contact-box i {font-size: 18px;color: #2f238f;margin-right: 5px;}
.contact-section {text-align: center;display: block;}
.contact-box {display: inline-block;margin-left: 15px;}
.logo-image-small img {width: 28%;margin: auto;}
.menu-section {padding: 15px 0 5px 0;}
.navbar-default .menu-section {padding: 5px 0 5px 0;}
.navbar-default .contact-box span {font-size: 14px;color: #000;font-family: 'Open sans';font-weight: 300;}
.navbar-default .contact-box i {font-size: 12px;color: #2f238f;margin-right: 8px;}
.navbar-default .contact-box { display: block; }
/**  SF-MENU  **/
.sf-menu, .sf-menu li:hover > ul, .sf-menu li.sfHover > ul{ display: none; }
.sf-menu.menu-show, .sf-menu ul.menu-show{ display: block !important; margin-top: 30px; text-align: left;}
.sf-menu {margin-right: 0px;}
.sf-menu li{ float: none; }
.sf-menu li{ display: block; }
.sf-menu li+li{ border: none; padding-bottom: 5px; padding-bottom: 5px; margin: 5px 10px;}
.sf-menu ul{ position: static; margin: 10px; }
.sf-menu ul li{ background: transparent; }
.sf-menu li {background: transparent ; margin: 0px 10px;}
.sf-menu ul li+li {border-top: 1px solid #e1e1e1;padding-top: 10px;}
a.showmenu {font-size: 20px;color: #2d2d2c;display: block;position: relative;margin-left: 0px;margin-top: 0; width: 10%;}
.navbar-default a.showmenu {font-size: 20px;color: #2d2d2c;display: block;position: absolute;margin-left: 0px;margin-top: 0; width: 10%; top: -30px;}
.sf-menu li a {border: none;padding: 5px 0px;color: #2f248c;display: block;text-transform: capitalize;font-weight: 400;font-size: 18px;}
.sf-menu li:not(:last-child):before {content: none;}
/*---------------------------------------------------------------------*/
/*  HOMEPAGE  */
/**  SLIDER  **/
.slider-wrap .container {position: absolute;right: 0;left: 0;bottom: -7%;padding: 0;}
.home-slider .slide {font-size: 14px;position: initial;right: 0;bottom: 0%;color: #fff;font-weight: 300;text-align: center;font-family: 'Open Sans';background: rgba(0, 0, 0, 0.58);width: 100%;height: 40px;margin-left: 0;padding: 10px 10px;}
/*WELCOME*/
#welcome {background: #fff;padding: 0px 15px 55px 15px;}
.content-welcome h1 {font-size: 36px;}
.content-welcome p {font-size: 16px;}
.center-text span {font-size: 32px;color: #fff;}
.the-hidden {background: rgba(0, 0, 0, 0.31);padding: 30px 0;}

/*PORTOFOLIO*/
.title-portofolio {text-align: center;font-family: 'Open sans';font-size: 48px;color: #313540;margin-bottom: 15px;}
.portofolio-caption {font-family: 'Open sans';font-weight: 300;font-size: 20px;text-align: center;margin-top: 15px;margin-bottom: 20px;color: #000;text-decoration: none!important;}

/*ABOUT US*/
.sidebar-about-us {text-align: left;margin-top: 20px;margin-bottom: 35px;}
/*GALLERY*/
.single-gallery {font-family: 'Open sans';text-align: center;font-size: 16px;padding: 0 15px;color: #000;}
/**  SERVICES  **/
.shadow-image {background: rgba(0, 0, 0, 0.31);position: absolute;width: 100%;height: 100%;top: 0px;left: 0;}
.shadow-image span {position: absolute;color: #fff;font-family: 'Open sans';font-size: 27px;vertical-align: middle;text-align: center;line-height: 1.2;font-weight: 400;display: flex;justify-content: center;align-items: center;width: 100%;height: 100%;}
.image-services {margin-bottom: 25px;position: relative;background: #fff;border: webkit-box-shadow: 0px 0px 1px 1px rgba(0,0,0,0.28);-moz-box-shadow: 0px 0px 1px 1px rgba(0,0,0,0.28);box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.28);padding: 5px;}
/**  MAIN CONTENT  **/

.portofolio-section { padding: 0 15px; }
/**  PROJECT  **/
.project-section { padding: 0 15px; }
/**  PARTNER IMAGE  **/

/**  testimonials  **/
.slide-testimonial p {text-align: left;font-size: 16px;margin-bottom: 5px;color: #000;padding: 2px;font-weight: 400;font-family: 'Open Sans';text-align: center;}
/**  OUR PARTNERS  **/
.image-partner img {margin: 16px 10px;width: 35%;}
.image-partner span {color: #313540;font-family: 'Open sans';font-size: 25px;font-weight: 600;margin-bottom: 15px;display: block;}
/*---------------------------------------------------------------------*/
/*  FOOTER  */
.footer-menu {list-style: none;color: #fff;text-align: center;margin: 0;padding: 0;}
.footer-menu li {display: inline-block;font-size: 14px;}
.copyright-text {color: #313540;font-size: 12px;font-family: 'Open sans';font-weight: 300;padding: 0 15px;}
.footer-nav {padding: 15px 0;background: #364aeb;}
.contact-handle {
    margin: 0px 0 20px 0;
    text-align: left;
}
.icon-contact {background: #4b79cd;padding: 15px;border-radius: 46px;display: inline-block;width: 50px;height: 50px;text-align: center;vertical-align: middle;margin-right: 10px;}
.icon-contact i {color: #fff;font-size: 20px;}
.info-contact .info-title-contact {font-family: 'Open Sans';color: #4b79cd;font-size: 17px;margin-bottom: 8px;font-weight: 300;margin: 0;}
.info-contact .desc-contact {font-family: 'Open Sans';color: #000;font-size: 16px;font-weight: 300;}
/**  COPYRIGHT  **/
.copyright {
    background: #fff;
    padding: 12px 0px;
    text-align: center;
}
/* PAGE  */

/* EXTRA STYLE  */
.g-recaptcha {transform: scale(0.74);-webkit-transform: scale(0.74);transform-origin: 0 0;-webkit-transform-origin: 0 0;}
#about-us-nav, #portofolio-nav, #services-nav, #project-nav, #contact-nav {width: 100%;height: 57px;margin-top: -90px;}

}
@media (max-width: 991px) and (min-width: 768px) {
/*   HEADER  */
.contact-box span {font-size: 20px;color: #000;font-family: 'Open sans';font-weight: 300;}
.contact-box i {font-size: 20px;color: #2f238f;margin-right: 15px;}
.menu-section {padding: 10px 0 5px 0;}
.menu-header {margin-top: 5px;}
.sf-menu li a {border: none;padding: 8px 4px;color: #2f238f;display: block;text-transform: capitalize;font-weight: 600;font-size: 13px;}
.sf-menu li+li {margin-left: 20px;border-radius: 7px;}
.sf-menu li:not(:last-child):before {content: "/";position: absolute;top: 5px;right: -15px;font-weight: 300;font-size: 20px;color: #2f248c;}
.main-menu { padding : 5px 0px;margin-top: 10px; }
/**  SF-MENU  **/

/*---------------------------------------------------------------------*/
/*  HOMEPAGE  */
/**  SLIDER  **/
.home-slider .slide {font-size: 20px;position: initial;right: 0;bottom: 0%;color: #fff;font-weight: 300;text-align: left;font-family: 'Open Sans';background: rgba(0, 0, 0, 0.58);width: fit-content;height: 41px;margin-left: 0;padding: 10px;}
/* WELCOME*/
.content-welcome p {font-size: 16px;}
.content-welcome {color: #000;font-family: 'Open sans';text-align: center;padding: 0 15px;}
/*ABOUT US*/
.single-gallery {font-family: 'Open sans';text-align: center;font-size: 16px;color: #000;padding: 0 15px;}
.image-gallery img { width: 100%; }
/* PORTOFOLIO */
.portofolio-section { padding : 0 15px; }
.image-portofolio {margin: 5px;}
.portofolio-caption {font-family: 'Open sans';font-weight: 300;font-size: 22px;text-align: center;margin-top: 15px;margin-bottom: 20px;color: #000;text-decoration: none!important;}

/**  SERVICE  **/
.shadow-image span {position: absolute;color: #fff;font-family: 'Open sans';font-size: 28px;vertical-align: middle;text-align: center;line-height: 1.2;font-weight: 300;display: flex;justify-content: center;align-items: center;width: 100%;height: 100%;}
.shadow-image {background: rgba(0, 0, 0, 0.31);position: absolute;width: 100%;height: 100%;top: 0;left: 0;}

/**  PROJECT  **/
#project .owl-theme .owl-controls .owl-nav div.owl-next {right: 15px;}
#project .owl-theme .owl-controls .owl-nav div.owl-prev {right: 57px;}

/**  PARTNERS IMAGE  **/
.image-partner img {margin: 0px 20px;width: 18%;}
.image-partner span {color: #313540;font-family: 'Open sans';font-size: 35px;font-weight: 600;margin-bottom: 15px;display: block;}
/** CONTACT SECTION **/
.icon-contact {background: #4b79cd;padding: 14px;border-radius: 30px;display: inline-block;width: 50px;height: 50px;text-align: center;vertical-align: middle;margin-right: 10px;}
.icon-contact i {color: #fff;font-size: 20px;}
.info-contact .desc-contact {font-family: 'Open Sans';color: #000;font-size: 17px;font-weight: 300;}
/*---------------------------------------------------------------------*/
/*  FOOTER  */
.footer-menu li {display: inline-block;font-size: 18px;}

/**  COPYRIGHT  **/
.copyright-text {color: #313540;font-size: 18px;font-family: 'Open sans';font-weight: 300;}

/* EXTRA STYLE  */
.center-text span {font-size: 55px;color: #fff;}
.the-hidden {background: rgba(0, 0, 0, 0.31);padding: 35px 0;}
}

@media (max-width: 1200px) and (min-width: 992px){
/*   HEADER  */


/**  SF-MENU  **/
.sf-menu li a {border: none;padding: 8px 6px;color: #2f248c;display: block;text-transform: capitalize;font-weight: 600;font-size: 15px;}
.sf-menu li:not(:last-child):before {content: "/";position: absolute;top: 3px;right: -26px;font-weight: 300;font-size: 24px;color: #2f248c;}
/*---------------------------------------------------------------------*/
/*  HOMEPAGE  */
/**  SLIDER  **/
/*portofolio*/
.portofolio-caption {font-family: 'Open sans';font-weight: 300;font-size: 22px;text-align: center;margin-top: 15px;margin-bottom: 20px;color: #000;text-decoration: none!important;}
/**  SERVICE  **/
.shadow-image {background: rgba(0, 0, 0, 0.31);position: absolute;width: 100%;height: 100%;top: 0;left: 0;}
.shadow-image span {position: absolute;color: #fff;font-family: 'Open sans';font-size: 38px;vertical-align: middle;text-align: center;line-height: 1.2;font-weight: 300;display: flex;justify-content: center;align-items: center;width: 100%;height: 100%;}
.image-portofolio { margin: 5px; }
/**  ALLIANCE CONTENT  **/
/**  PARTNER CONTENT  **/
.image-partner img {margin: 0px 30px;}
/**  CONTACT SECTION  **/

/*---------------------------------------------------------------------*/

/*  FOOTER  */
.footer-menu li {display: inline-block;font-size: 20px;}
/**  COPYRIGHT  **/
.copyright-text {color: #313540;font-size: 20px;font-family: 'Open sans';font-weight: 300;}
/* PAGE  */

/* EXTRA STYLE  */
}

@media (max-width: 320px) {

}