/* 

1. Add your custom Css styles below
2. Place the this code in your template: 

 <link href="css/custom.css" rel="stylesheet">

 */

 /* -----BODY ---------------*/
 html {
   font-size: 14px; 
}

@media all and (max-width: 768px) {
   html {
      font-size: 14px; 
  } 
}
body {
   font-size: 14px;
   line-height: 22px;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-family: "Open Sans", "Helvetica", "Arial", sans-serif;
   color: #565656;
   font-weight: 400; 
}

h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
   font-family: 'Open Sans', 'Helvetica', 'Arial', sans-serif;
   color: #252525;
   margin: 0;
   font-weight: 300;
   letter-spacing: 1px; 
}
p {
   font-family: "Open Sans";
   font-size: 14px;
   font-style: normal;
   font-weight: 300;
   text-transform: none;
   line-height: 22px;
   letter-spacing: 0;
   /*color: #7b7b7b;*/
   color: #333;
}
a:hover {
   color: #022e9e;
}


/* ----------------------------------------------------------------
    SLIDER
    -----------------------------------------------------------------*/

    #slider {
    	overflow: visible;
    }
    .inspiro-slider .slide {
    	background-position: top center;
    	background-repeat: repeat-y;
    	background-size: 100%;
    }
/*.inspiro-slider .slide-captions .col-md-6 {
	background: #011c60f0;
	padding: 25px 40px;
	display: table;
	}*/
	.inspiro-slider .slide-captions h2, 
    .slide-captions h2 {
      font-family: 'Open Sans', 'Helvetica', 'Arial', sans-serif;
      font-size: 30px;
      font-weight: 600;
      line-height: 34px;
      letter-spacing: 0px;
      margin-bottom: 10px;
      color: #fff;
      text-shadow: 0 3px 4px #333;
      text-transform: uppercase;
  }
  .inspiro-slider .slide-captions .lead, 
  .slide-captions .lead {
      font-family: "Open Sans";
      font-size: 18px;
      font-style: normal;
      font-weight: 300;
      line-height: 24px;
      margin-bottom: 20px;
      text-transform: none;
      letter-spacing: 0;
      color: #7b7b7b;
      color: #fff !important; 
      text-shadow: 0 3px 3px #333;
  }
  .inspiro-slider .slide-captions .btn, 
  .slide-captions .btn {
      background: #ffcb00;
      border-color: #ffcb00;
  }
  .inspiro-slider .slide-captions .btn:hover, 
  .slide-captions .btn:hover {
      background-color: #011c60;
      border-color: #011c60;
  }

  /* new slider */
  .slide {

  }
  .slide .container {
    position: absolute;
    top: 80%;
    left: 0%;
    right: 0%;
    height: 230px;
    background: transparent;
    z-index: 100;
}
.slide:after {
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 10;
    -moz-box-shadow: inset 0 5px 15px -5px rgba(0,0,0,1), inset 0 -100px 120px -20px rgba(0,0,0,1);
    -webkit-box-shadow: inset 0 5px 15px -5px rgba(0,0,0,1), inset 0 -100px 120px -20px rgba(0,0,0,1);
    box-shadow: inset 0 5px 15px -5px rgba(0,0,0,1), inset 0 -100px 120px -20px rgba(0,0,0,1);
}
.owl-carousel .owl-controls .owl-dots {
    margin-bottom: 20px;
    margin-top: -30px;
    position: relative;
}


/* ----------------------------------------------------------------
    LOGO
    -----------------------------------------------------------------*/

    #header {
    	border-bottom: none;
    }
    #header #header-wrap {
    	background-color: #ffffff;
    	border-bottom: none;
    }
    #header #header-wrap #logo {
    	float: left;
    	font-size: 28px;
    	position: relative;
    	z-index: 1;
    	transition: all .4s ease-in-out;
    	height: 80px;
    	left: -20px;
    	background: #011c60;
    }
    #header #header-wrap #logo:before {
    	content: '';
    	background: #011c60;
    	width: 1000px;
    	height: 80px;
    	left: -1000px;
    	position: absolute;
    }
    #header #header-wrap #logo img {
    	filter: brightness(0) invert(1);
    }

    /* topbar */
    #topbar .top-menu {
    	float: right;
    }
    #topbar .top-menu img {
    	position: relative;
    	top: -1.5px;
    	margin-right: 3px;
    	border: 1px solid #eee;
    	border-radius: 50%;
    }
    #topbar .top-menu > li > a {
    	margin-right: 0;
    	margin-left: 15px;
    }
    #topbar .top-menu > li > a:hover {
    	color: #565656;
    	text-decoration: underline;
    }


/* ----------------------------------------------------------------
    MAINMENU
    -----------------------------------------------------------------*/

    #mainMenu nav > ul > li > a {
    	position: relative;
        font-family: "Montserrat", "Helvetica", "Arial", sans-serif;
        padding: 11px 7px;
        font-size: 12px;
        font-weight: 500;
        letter-spacing: 0px;
        color: #252525;
        text-transform: uppercase;
        border-radius: 0;
        border-width: 0;
        border-style: solid;
        border-color: transparent;
        transition: all .3s ease;
        line-height: normal;
    }
    #mainMenu nav > ul > li > a:hover, 
    #mainMenu nav > ul > li:hover > a {
    	color: #fff;
    	background: #011c60;
    }
    #mainMenu nav > ul > li .dropdown-menu > li > a:hover, 
    #mainMenu nav > ul > li .dropdown-menu > li > a:active, 
    #mainMenu nav > ul > li .dropdown-menu > li > span:focus,
    #mainMenu nav > ul > li .dropdown-menu > li > span:hover,
    #mainMenu nav > ul > li .dropdown-menu > li > span:active, 
    #mainMenu nav > ul > li .dropdown-menu > li.current > a,
    #mainMenu nav > ul > li .dropdown-menu > li.current > span, #mainMenu nav > ul > li .dropdown-menu > li:hover > a,
    #mainMenu nav > ul > li .dropdown-menu > li:hover > span, #mainMenu nav > ul > li .dropdown-menu > li:focus > a,
    #mainMenu nav > ul > li .dropdown-menu > li:focus > span, #mainMenu nav > ul > li .dropdown-menu > li:active > a,
    #mainMenu nav > ul > li .dropdown-menu > li:active > span, #mainMenu nav > ul > li .dropdown-menu > li.hover-active > a,
    #mainMenu nav > ul > li .dropdown-menu > li.hover-active > span {
    	color: #022e9e !important;
    }
    #mainMenu nav > ul > li {
    	margin-left: 0px;
    }

    /* extra */
    #header .header-extras > ul > li {
    	float: left;
    	margin-left: 15px;
    	border: 0;
    }


/* ----------------------------------------------------------------
    TITLE
    -----------------------------------------------------------------*/

    .tip-title {
    	text-align: center;
    }
    .tip-title h3 {
    	font-family: 'Montserrat'; 
    	font-weight: 600; 
    	letter-spacing: 2px; 
    	margin-bottom: 10px;
    }
    .tip-title h3 img {
    	width: 24px; 
    	height: 24px; 
    	position: relative; 
    	top: -2px;
    	margin-bottom: -2px;
    	margin-right: 10px; 
    }
    .tip-title p {
    	font-size: 12px; 
    	text-transform: uppercase; 
    	letter-spacing: 2px;
    	position: relative;
    	z-index: 1;
    }
    .tip-title p span {
    	background: #f8f8f8;
    	padding-left: 10px;
    	padding-right: 10px;
    }
    .tip-title p span:before {
    	content: '';
    	width: 100%;
    	height: 1px;
    	background: #eee;
    	position: absolute;
    	top: 10px;
    	z-index: -1;
    	left: 0;
    }
    .tip-title p.lead {
    	font-size: 16px;
    	letter-spacing: 0.5px;
    	text-transform: none;
    }
    .tip-title p.lead strong {
    	font-weight: 600;
    }


/* ----------------------------------------------------------------
    GRID
    -----------------------------------------------------------------*/

    .grid-articles .post-entry {
    	overflow: hidden;
    }
    .grid-articles .post-entry:first-child, 
    .grid-articles .post-entry {
    	width: 33.333333%;
    }
    .grid-articles .post-entry:first-child .post-entry-meta .post-entry-meta-title h2, 
    .grid-articles .post-entry:first-child .post-entry-meta .post-entry-meta-title h2 a, 
    .grid-articles .post-entry .post-entry-meta .post-entry-meta-title h2, 
    .grid-articles .post-entry .post-entry-meta .post-entry-meta-title h2 a {
    	color: #fff;
    	font-family: "Montserrat", sans-serif;
    	font-size: 18px !important;
    	font-weight: 400;
    	line-height: 1.2;
    	margin: 0 0 20px;
    	text-align: center;
    	text-shadow: 0 3px 3px #333;
    }
    .grid-articles .post-entry .post-entry-meta {
    	padding: 0 20px 60px;
    	text-align: center;
    }
    .grid-articles .post-entry:hover img {
    	transform: scale(1.1);
    	-webkit-transform: scale(1.1);
    	transition: all 0.5s;
    }
    .grid-articles .post-entry:before {
    	background: linear-gradient(to bottom, transparent 20%, rgba(1, 28, 96, 0.9) 100%);
    }


/* ----------------------------------------------------------------
    WHY US
    -----------------------------------------------------------------*/

    .whyus-image:before {
    	content: '';
    	width: 50px;
    	height: 350px;
    	position: absolute;
    	top: 50px;
    	left: -5px;
    	background: #011c60;
    }
    .whyus-image img {
    	width: 600px; 
    	height: auto; 
    	margin-left: 30px;
    }
    .whyus-detail {
    	background-color: #011c60; 
    	background-image: url(../images/bg-blue.jpg);
    	background-position: right bottom;
    	background-size: 220px auto;
    	background-repeat: no-repeat;
    	min-height: 330px; 
    	width: 100%; 
    	margin-top: 50px;
    	box-shadow: 0 0 22px #969696;
    	padding: 30px 30px;
    }

    .icon {
    	padding: 0px 5px;
    }
    .icon-box {
    	height: 70px;
    	margin-bottom: 10px;
    }
    .icon-box.clean .icon i {
    	color: #fff;
    }
    .icon-box .icon {
    	height: 55px;
    	position: absolute;
    	width: 55px;
    	margin-left: -12px;
    }
    .icon-box img {
    	width: 70px;
    	height: auto;
    }
    .icon-box h3, .icon-box h5 {
    	font-family: "Montserrat", "Helvetica", "Arial", sans-serif;
    	letter-spacing: 0px;
    	font-size: 15px;
    	line-height: 25px;
    	font-weight: 400;
    	color: #fff;
    }
    .icon-box.medium > h3 {
    	font-size: 12px;
    	line-height: 1.25;
    	margin: 0px 0px 0px 75px;
    }


/* ----------------------------------------------------------------
    TABS
    -----------------------------------------------------------------*/

    .tabs-content {
    	position: relative;
    	z-index: 2;
    	padding: 30px 30px 15px;
    	margin-bottom: 20px;
    	border: 1px solid transparent;
    	border-color: transparent;
    	overflow: hidden;
    	top: -130px; 
    	margin-bottom: -130px;
    }
    .tabs-content .tab-detail {
    	position: relative;
    	top: 120px;
    	margin-bottom: 120px;
    }
    .tabs-content .tab-image {
    	text-align: center;
    }
    .tabs-content .tab-image img {
    	width: 400px;
    	height: auto;
    	position: relative;
    	top: 50px;
    	margin-bottom: 0px;
    }
    .dl-horizontal dt {
    	width: 150px;
    	text-align: left;
    	color: #022577;
    }
    .dl-horizontal dd {
    	margin-left: 160px;
    	color: #7b7b7b;
    }
    .dropcap {
    	background: transparent;
    	font-size: 20px;
    	height: 45px;
    	line-height: 45px;
    	margin: -5px 10px 0 0;
    	text-align: center;
    	width: 45px;
    }
    .dropcap.dropcap-colored {
    	background-color: #ffcb00;
    	color: #ffffff;
    }

    /* navigation */
    .testimonials-logo {
    	margin-bottom: 0px;
    	padding-left: 0px;
    	border-bottom-width: 0px;
    	list-style: none; 
    	background: #fff;
    }
    .testimonials-logo::after, .testimonials-logo::before {
    	content: ' ';
    	display: table; 
    }
    .testimonials-logo::after {
    	clear: both; 
    }
    .testimonials-logo li {
    	position: relative;
    	display: block;
    	float: left;
    	margin: 0px 0px -1px; 
    }
    .testimonials-logo li a {
    	border: 1px solid transparent;
    	display: block;
    	font-size: 13px;
    	font-style: normal;
    	font-weight: 100;
    	letter-spacing: 0.5px;
    	margin-right: -1px;
    	padding: 10px 16px;
    	position: relative;
    	text-transform: uppercase; 
    	background: #fff;
    }
    .testimonials-logo li a i:first-child {
    	margin-right: 8px; 
    }
    .testimonials-logo li a img {
    	max-width: none; 
    }
    .testimonials-logo li.active a:focus {
    	cursor: default; 
    }
    .testimonials-logo li a,
    .testimonials-logo li a:focus,
    .testimonials-logo li a:hover {
    	text-decoration: none;
    	outline: 0; 
    }

    .testimonials-logo ul {
    	margin: 0 auto;
    	width: 100%;
    	text-align: center;
    }												
    .testimonials-logo li a img {
    	width: auto;
    	height: 39px;
    	margin: 0 auto;
    }
    .testimonials-logo li a {
    	color: #70767a;
    	border-color: transparent;
    	background: transparent;
    	text-align: center;
    	border-color: #fff;
    	color: #1c202a;
    	background: #fff;
    }
    .testimonials-logo li:hover a {
    	border-color: #011c60;
    	color: #1c202a;
    	background: #011c60;
    }
    .testimonials-logo li:hover a img {
    	opacity: 1;
    	filter: brightness(0) invert(1);
    }


/* ----------------------------------------------------------------------
    FOOTER
    -------------------------------------------------------------------------*/

    footer {
    	padding: 0;
    	background: #011c60;
    }
    footer .widget {
    	margin-bottom: 30px;
    }
    .footer-content {
    	padding: 45px 0 0 0;
    	color: #eee;
    }
    .footer-content h4 {
    	font-size: 14px;
    	font-weight: 600;
    	color: #eee;
    	letter-spacing: 2px;
    }
    .footer-content i {
    	width: 15px;
    	margin-right: 5px;
    }
    .footer-content a {
    	font-size: 14px;
    	color: #eee;
    }
    .footer-content a:hover {
    	opacity: 0.5;
    }
    .footer-content .btn {
    	color: #fff;
    	color: #011c60;
    	padding: 6.5px 7px;
    	position: relative;
    	top: 2px;
    	margin-right: 5px;
    	background: #ffcb00;
    	border-color: #ffcb00;
    }
    .footer-content .btn i {
    	margin-right: 0;
    }
    .footer-content .btn:hover {
    	color: #eee;
    	background: #086cf0;
    	border-color: #086cf0;
    	opacity: 1;
    }
    .footer-content .btn:hover img {
    	filter: brightness(0) invert(1);
    }
    #footer.footer-light .widget h4, 
    #footer.footer-light span, 
    .widget > h4 {
    	font-size: 14px;
    	font-weight: 600;
    	font-family: 'Montserrat', sans-serif;
    	letter-spacing: 2px;
    	text-transform: uppercase;
    	margin-bottom: 20px;
    }
    .copyright-content {
    	border-top: 1px solid #022068;
    	min-height: 30px;
    	padding: 15px 0;
    }
    .copyright-text {
    	font-size: 13px;
    	font-weight: 600;
    	letter-spacing: 1px;
    }


/* ----------------------------------------------------------------
	SYSTEM RESET
	-----------------------------------------------------------------*/

	/* content */
	.content {
		float: left;
		padding-left: 0px;
		margin-bottom: 20px;
		width: 100%;
	}

	/* image */
	.sys-products .body .lists .lists-item .body-image img, 
	.sys-galleries .body .lists .lists-item .body-image img, 
	.sys-articles .body .lists .lists-item .body-image img {
		max-height: none;
		width: 100%;
		height: auto;
	}

	/* form group */
	.form-group > label, 
	.form-group label, 
	.table>thead:first-child>tr:first-child>th { font-weight: 400; }
	.form-control:focus { border-color: #011c60; }


	/* font */
	.sys-product .body .product-detail .title h1, 
	.sys-article .body h1, 
	.sys-clip .body h1, 
	.sys-gallery .body h1 {
		font-size: 26px;
	}
	.sys-page .body .title h1, 
	.sys-product .body .product-detail .title h1, 
	.sys-article .body h1, 
	.sys-clip .body h1,  {
		font-size: 26px;
	}
	.sys-products .body .lists.column-3 .lists-item .title a h2, 
	.sys-articles .body .lists .lists-item h2, 
	.sys-clips .body .lists .lists-item h2, 
	.sys-contacts .body .title h2, 
	.sys-galleries .body .lists .lists-item h2, 
	.sys-confirm-payment h2  {
		font-size: 20px;
	}

	/* product */
	.sys-product .body .product-detail .social-share {
		padding-left: 0;
		padding-bottom: 20px;
	}
	.sys-products .body .lists.column-3 .lists-item .price, 
	.sys-product .body .product-detail .price {
		font-weight: 400;
	}
	.sys-products .body .lists .lists-item .body-image img {
		z-index: 100;
	}
	.sys-products .body .lists .lists-item .mdate, 
	.sys-products .body .lists .lists-item .viewed {
		font-size: 12px !important;
	}
	.sys-products .body .lists .lists-item .product-addtocart-box {
		padding-bottom: 0px;
	}
	.sys-products .body .lists .lists-item .product-addtocart-box .form-group, 
	.sys-products .body .lists .lists-item .product-addtocart-box .form-group .btn-org {
		margin-bottom: 0;
	}

	/* contact */
	.sys-contacts .body .detail, 
	.sys-contacts .body .image-maps, 
	.sys-contacts .body .google-maps, 
	.sys-contacts .body .contact-form, 
	.sys-breadcrumb .breadcrumb {
		margin-bottom: 20px;
	} 

	/* confirm payment */
	.sys-confirm-payment .confirm-payment-box .col-xs-12.col-sm-3.col-md-3.col-lg-3 .row .col-xs-12.col-sm-12.col-md-12.col-lg-12 {
		padding-left: 0;
	}

	/* button */
	.btn-org, 
	.btn-primary, 
	.btn-default, 
	.btn-facebook, 
	.btn-member-register { 
		color: #fff; 
		margin: 0; 
		background-color: #011c60; 
		border-color: #011c60; 
		transition: all .2s ease-out; 
		letter-spacing: 0; 
		border-radius: 0;
		font-weight: 400;
		font-size: 14px;
		font-family: 'Prompt', sans-serif;
		margin-bottom: 10px;
		border-radius: 25px;
	}
	.btn-org:hover, 
	.btn-primary:hover, 
	.btn-default:hover, 
	.btn-facebook:hover, 
	.btn-member-register:hover { 
		color: #fff; 
		background-color: #ffcb00 !important; 
		border-color: #ffcb00 !important; 
	}
	.btn-facebook {
		background-color: #3b5998 ! important;
		border-color: #3b5998 !important;
		color: #ffffff ! important;
	}
	.btn-addtocart { 
		width: 100%;
	}

	span.facebook { color: #3a5795; }
	span.twitter { color: #1da1f2; }
	span.pinterest { color: #e63d44; }
	span.google-plus { color: #d95332; }
	span.line-chat { color: #00c300; }
	span.facebook:hover, 
	span.twitter:hover, 
	span.pinterest:hover, 
	span.google-plus:hover, 
	span.line-chat:hover { 
		color: #011c60; 
	}


    .tip-testimonial .tabs-content .tab-image img{
        height: 430px;
        width: auto;
    }



    /* tag */
    .tags .badge {
      display: inline-block;
      min-width: 10px;
      padding: 5px 10px;
      font-size: 12px;
      font-weight: 300;
      color: #999;
      line-height: 1;
      vertical-align: baseline;
      white-space: nowrap;
      text-align: center;
      background-color: transparent;
      border: 1px solid #999;
      border-radius: 15px;
      letter-spacing: -0.5px;
      margin-right: 2px;
  }
  .tags .badge:hover {
      color: #fff;
      background-color: #011c60;
      border: 1px solid #011c60;
  }

  /* other */
  .mdate, 
  .viewed {
      font-size: 14px;
  }
  .detail-text {
      padding: 10px 0;
  }
  h2:active {
      color: #011c60;
  }


  /* -------------- BOOTSTRAP 5 COLUMNS ----*/
  .col-xs-15, .col-sm-15, .col-md-15, .col-lg-15 {
      position: relative;
      min-height: 1px;
      padding-right: 10px;
      padding-left: 10px;
  }
  .col-xs-15 {
      width: 20%;
      float: left;
  }

  @media (min-width: 768px) {
      .col-sm-15 {
       width: 20%;
       float: left;
   }
}

@media (min-width: 992px) {
  .col-md-15 {
   width: 20%;
   float: left;
}
}

@media (min-width: 1200px) {
  .col-lg-15 {
   width: 20%;
   float: left;
}
}


/* LOCATION MAP */
.tip-location .sright{ margin-top: -155px;}
.tip-location .sright .inner-wrap a{ 
    position: absolute;
    top: 45%;
    left: 0;
    right: 0;
    margin: 0 auto;
    display: inline-block;
    max-width: 200px;
    visibility: hidden;
}
/*.tip-location .sright .inner-wrap:hover a{ visibility: visible;}
.tip-location .sright .inner-wrap img{ transition: all .3s ease-out;}
.modal-location .modal-content{ padding: 15px 10px;}
.modal-location .modal-header{ padding-top: 0; padding-bottom: 0;}
.modal-location .modal-footer{ margin-top: 0; padding: 0 15px;}
.modal-location .modal-body{ text-align: center;}
.modal-location .modal-lg{ width: 800px;}
*/


.map-mark-wrap img{width: 100%;}

/*screen*/
@media (max-width: 991px){}
/*iPad*/
@media (max-width: 768px){
    .tip-location .sright{ margin-top: 20px;}
    .modal-location .modal-lg{ width: 100%; margin: 0;}

    /* new map responsive*/
    .map-mark-wrap{
        width: 100%;
        position: relative;
        height: 559px !important;
        overflow-x: scroll;
    }
    .map-mark-wrap img{
        width: 737px !important;
        height: 559px !important;
        max-width: none;
        position: absolute;
        right: -70px;
        bottom: 0;

       /* width: 555px !important;
        height: 421px !important;
        max-width: none;
        position: absolute;
        right: -70px;
        right: initial;
        left: 0;
        bottom: 0;*/
    }

    .map-mark-wrap map{
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
    }
    .map-mark-wrap map area{ position: absolute; display: inline-block; z-index: 5;width: 50px; height: 20px; }
    .map-mark-wrap map area:nth-child(1){ left: 65%; top: 335px; }
    .map-mark-wrap map area:nth-child(2){ left: 61.5%; top: 412px;}
    .map-mark-wrap map area:nth-child(3){ left: 60.5%; top: 83%; }
    .map-mark-wrap map area:nth-child(4){ left: 67.5%; top: 80.5%;}
    .map-mark-wrap map area:nth-child(5){ left: 82.5%; top: 384px; width: 60px;}
    .map-mark-wrap map area:nth-child(6){ left: 83.5%; top: 363px; width: 60px; }
    .map-mark-wrap map area:nth-child(7){ left: 69%; top: 368px; width: 65px; height: 25px;}
    .map-mark-wrap map area:nth-child(8){ left: 69%; top: 403px; width: 65px; height: 25px;}
    .map-mark-wrap map area:nth-child(9){ left: 400px; bottom: 0; width: 65px; height: 25px;}
}

@media (max-width: 737px){
    .map-mark-wrap map area:nth-child(1){ left: 43%;}
    .map-mark-wrap map area:nth-child(2){ left: 37.5%;}
    .map-mark-wrap map area:nth-child(3){ left: 35.5%;}
    .map-mark-wrap map area:nth-child(4){ left: 47%;}
    .map-mark-wrap map area:nth-child(5){ left: 71.5%;}
    .map-mark-wrap map area:nth-child(6){ left: 73.5%;}
    .map-mark-wrap map area:nth-child(7){ left: 49%;}
    .map-mark-wrap map area:nth-child(8){ left: 49%;}
    .map-mark-wrap map area:nth-child(9){ left: 125px;}
}
@media (max-width: 414px) {
 .map-mark-wrap map area:nth-child(1){ left: 32.5%;}
 .map-mark-wrap map area:nth-child(2){ left: 26%;}
 .map-mark-wrap map area:nth-child(3){ left: 23.5%;}
 .map-mark-wrap map area:nth-child(4){ left: 37%;}
 .map-mark-wrap map area:nth-child(5){ left: 66%;}
 .map-mark-wrap map area:nth-child(6){ left: 68%;}
 .map-mark-wrap map area:nth-child(7){ left: 40%;}
 .map-mark-wrap map area:nth-child(8){ left: 40%;}
 .map-mark-wrap map area:nth-child(9){ left: 60px;}
}
@media (max-width: 375px) {
    .map-mark-wrap map area:nth-child(1){ left: 25%;}
    .map-mark-wrap map area:nth-child(2){ left: 17.5%;}
    .map-mark-wrap map area:nth-child(3){ left: 15%;}
    .map-mark-wrap map area:nth-child(4){ left: 30%;}
    .map-mark-wrap map area:nth-child(5){ left: 62.5%;}
    .map-mark-wrap map area:nth-child(6){ left: 64.5%;}
    .map-mark-wrap map area:nth-child(7){ left: 33.3%;}
    .map-mark-wrap map area:nth-child(8){ left: 33.5%;}
    .map-mark-wrap map area:nth-child(9){ left: 15px;}
}
/*iphone5*/
@media (max-width: 320px) {
    .tip-location .sright{ padding: 0 !important;}
    .map-mark-wrap map area:nth-child(9){ left: -30px;}
}





/* ----------------------------------------------------------------
    SERVICE
    ---------------------------------------------------------------- */

    .service-box {  }
    .service-box .service-img { background: #011c60; }
    .service-box .service-img img { width: 100%; height: auto; }
    .service-box .service-detail { background: rgba(248, 248, 248, 0.6); padding: 30px 20px; text-align: center; min-height: 195px; }
    .service-box .service-detail h3 { text-transform: uppercase; font-size: 14px; font-family: 'Montserrat'; font-weight: 600; margin-bottom: 10px; letter-spacing: 0; }
    .service-box .service-detail p { line-height: 20px; margin: 0; font-size: 12px; }
    .service-box .service-detail p em { letter-spacing: 1px; }
    .service-box .service-detail .btn { margin: 0; margin-top: 10px; }

    .service-box .service-img.top::after { 
      width: 0;
      height: 0;
      border-left: 30px solid transparent;
      border-right: 30px solid transparent;
      border-top: 30px solid #fafafa;
      position: absolute;
      z-index: 100;
      bottom: 45%;
      left: 35%;
      content: '';
  }

  .service-box .service-img.bottom::after { 
      width: 0;
      height: 0;
      border-left: 30px solid transparent;
      border-right: 30px solid transparent;
      border-bottom: 30px solid #fafafa;
      position: absolute;
      z-index: 100;
      top: 45%;
      left: 35%;
      content: '';
  }

  .tip-location .sright .dl-map-btn{
    margin-top: 20px;
    float: right;
}


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

.effect.social-links {
    text-align: left;
    position: relative;
}
.effect.social-links img {
    -webkit-transition: opacity 0.35s;
    transition: opacity 0.35s;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}
.effect.social-links h3 {
    -webkit-transition: -webkit-transform 0.25s;
    transition: transform 0.25s;
    -webkit-transform: translate3d(0, 20px, 0);
    transform: translate3d(0, 20px, 0);
}
.effect.social-links p {
    display: inline;
    left: auto;
    margin-top: -20px;
    /* margin-left: -28px;*/
    position: absolute;
    text-align: center;
    top: 50%;
    width: 100%;
}
.effect.social-links a i {
    margin: 0 4px;
    color: #fff;
    font-size: 146%;
}
.effect.social-links:hover img {
    opacity: 0.6;
}
.effect.social-links:hover h3 {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}
.effect.social-links:hover .image-box-content::before {
    opacity: 0.7;
    -webkit-transform: rotate3d(0, 0, 1, 20deg);
    transform: rotate3d(0, 0, 1, 20deg);
}
.effect.social-links p a i {
    border-radius: 50%;
    height: 42px;
    width: 42px;
    line-height: 44px;
    background: hsla(0, 0%, 0%, 0.5);
    opacity: 0;
    -webkit-transition: opacity 0.25s, -webkit-transform 0.25s;
    transition: opacity 0.25s, transform 0.25s;
    -webkit-transform: translate3d(0, 30px, 0);
    transform: translate3d(0, 30px, 0);
}
.effect.social-links:hover p i {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0) rotate(0deg);
    transform: translate3d(0, 0, 0) rotate(0deg);
}
.effect.social-links:hover p a:nth-child(3) i {
    -webkit-transition-delay: 0.05s;
    transition-delay: 0.05s;
}
.effect.social-links:hover p a:nth-child(2) i {
    -webkit-transition-delay: 0.1s;
    transition-delay: 0.1s;
}
.effect.social-links:hover p a:first-child i {
    -webkit-transition-delay: 0.15s;
    transition-delay: 0.15s;
}
.effect.social-links:hover p a i:hover {
    -webkit-transition: all 0.5s ease 0s;
    transition: all 0.5s ease 0s;
    -webkit-transition-delay: rotate 1s;
    transition-delay: rotate 1s;
    -webkit-transform: translate3d(0, 0, 0) rotate(360deg);
    transform: translate3d(0, 0, 0) rotate(360deg);
}
.effect .image-box-content p i {
    z-index: 2;
}

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


/* DEMO x */
.tip-intro .text-left p.lead{ color: #333;}
.inspiro-slider .slide-captions h2, .slide-captions h2{ margin-top: -40px;}
.tip-whyus .artc-item{
 float: left;
 clear: none !important;
 margin-bottom: 30px;
}
.tip-whyus .artc-item img{ width: 100%;}
.tip-whyus .artc-item .htitle{line-height: normal; /*max-height: 40px;*/ /*overflow: hidden;*/}
.tip-whyus .artc-item .htitle a{ font-weight: 600;}
.tip-whyus .artc-item .inwrap{ box-shadow: 0px 2px 12px rgba(204, 204, 204, 0.51); text-align: center; height: 374px; overflow: hidden;}
.tip-whyus .artc-item .info-wrap{ padding: 15px; border-top: 1px solid #f7f7f7;}
.tip-whyus .artc-item a.btn{ margin-bottom: 15px;}

.slide .slide-captions .text-small-x{ font-size: 15px; text-shadow: 0px 2px 3px #333;}

#topbar .top-menu > li {
    float: left;
}
#topbar .top-menu > li > a {
    float: left;
}



/* ----------------------------------------------------------------
    RESPONSIVE
    -----------------------------------------------------------------*/

    @media(max-width: 1024px) {
        #topbar .col-md-10 { widows: 100%; float: left !important; }
        #mainMenu nav > ul > li > a { padding: 11px 3px; font-size: 10.5px; }
    }

    @media(max-width: 991px) {
        .inspiro-slider .slide-captions h2, .slide-captions h2{ margin-top: 0px;}
        .slide { position: relative;}
        .slide-captions{ position: absolute; bottom: 0px;}

        #header #mainMenu:not(.menu-overlay) nav > ul > li > a { padding: 5px 0; text-align: center; }
        #header #mainMenu:not(.menu-overlay) nav > ul > li.dropdown:before { display: none; }
        #header #mainMenu:not(.menu-overlay) nav > ul > li .dropdown-menu > li > a { text-align: center; }

        #header #header-wrap #logo { background: #fff; }
        #header #header-wrap #logo img { filter: brightness(1) invert(0); }
        #header #header-wrap #logo:before { display: none; background: #fff; }

        .slide .container { top: 40%; height: 130px; }

        .grid-articles:not(.post-carousel) .post-entry:first-child, 
        .grid-articles:not(.post-carousel) .post-entry { width: 100%; }

        .tip-intro .tip-title.text-center { margin-top: 30px; }

        .tip-warehouse .btn.btn-rounded { margin: 40px 0 30px !important; }

        .tip-location .col-md-5 img { width: 100% !important; top: 20px !important; margin-bottom: 20px !important; }
        .tip-location .m-b-30 { margin-bottom: 0 !important; }
        .tip-location .sright { margin-top: 30px; text-align: center; }
        .tip-location .sright .inner-wrap { text-align: center; }
        .tip-location .sright .dl-map-btn { float: none; }

        .tip-whyus .whyus-image img { width: 96%; }
        .tip-whyus .whyus-detail { display: table; height: auto; }
        .tip-whyus .whyus-detail .icon-box { height: auto; }
        .tip-whyus .artc-item .inwrap { height: auto; }
        .tip-whyus .artc-item .info-wrap { min-height: 70px; }
        /*.tip-whyus .artc-item a.btn { display: none; }*/

        .tabs-content .tab-image img { width: 300px; top: 20px; margin-bottom: 20px; }
        .tip_tabs_testimonial .tabs-content { margin-bottom: 0; }
        .tip_tabs_testimonial .tabs-navigation li { float: left; width: 20% !important; }
        .tip_tabs_testimonial .tabs-content .tab-detail .dl-horizontal { margin-left: 0 !important; }
        .tip_tabs_testimonial .tabs-content .tab-detail { padding: 20px 0px 0; }

        .footer-content .col-md-3, 
        .footer-content .col-md-4 { width: 25%; float: left; }
        .footer-content .col-md-5, 
        .footer-content .col-md-3 .col-md-6 { width: 50%; float: left; clear: none; }
        .footer-content .col-md-3.p-l-0 { padding-left: 15px !important; }

    }

    @media(max-width: 785px) {
      #topbar .top-menu > li:first-child > a{ margin-left: 10px;}
      #topbar .top-menu > li:first-child > a:first-child{ margin-left: 0px;}
      #sh_index_z1_content_1_html a strong{ display: none;}
  }

  @media(max-width: 600px) {
    .inspiro-slider .slide-captions h2, .slide-captions h2 { font-size: 26px; line-height: 30px; }
    .inspiro-slider .slide-captions .lead, .slide-captions .lead { font-size: 18px; line-height: 20px; }

    .grid-articles:not(.post-carousel) .post-entry:first-child, 
    .grid-articles:not(.post-carousel) .post-entry { width: 100%; }

    .tip-whyus .artc-item { width: 50% !important; }

    .tip-whyus .whyus-image img { width: 100%; margin-left: 0; }
    .tip-whyus .whyus-image:before { display: none; }
    .tip-whyus .whyus-detail { margin-top: 0; }

    .tip_tabs_testimonial { padding-bottom: 180px !important; }
    .tip-testimonial .tip-title { padding-left: 15px !important; }
    .tabs-content { padding: 0; }
    .tabs-content .tab-detail { top: 140px; margin-bottom: 140px; padding: 0; }
    .dl-horizontal dd { margin-left: 0; margin-bottom: 15px; }

    .footer-content { padding: 15px 0 0 0; }
    .footer-content .col-md-3 { width: 100%; }
    .footer-content .col-md-3 img { width: 50% !important; }
    .footer-content .col-md-4 { width: 35%; }
    .footer-content .col-md-5 { width: 65%; } 
}

@media(max-width: 480px) {
    #topbar .col-md-10 {padding: 0px;}
    #topbar .top-menu > li a {
    font-size: 12px;
}
    .slide-captions{ position: absolute; bottom: 60px;}

    .inspiro-slider .slide-captions h2, .slide-captions h2 { font-size: 22px; line-height: 26px; }
    .inspiro-slider .slide-captions .lead, .slide-captions .lead { font-size: 14px; line-height: 18px; }

    .tip-whyus .artc-item { padding: 0 10px; }

    .tip_tabs_testimonial .tabs-navigation li { float: left; width: 33.3% !important; }

    .tip-whyus .artc-item { margin-bottom: 20px; }
}

/* iPhone 6 Plus */
@media(max-width: 414px) {
    .inspiro-slider .slide-captions .text-right, 
    .inspiro-slider .slide-captions .text-left, 
    .inspiro-slider .slide-captions h2, 
    .inspiro-slider .slide-captions .lead { text-align: center !important; }
    .inspiro-slider .slide-captions h2 { font-size: 28px; line-height: 32px; }
    .inspiro-slider .slide-captions .lead { font-size: 14px; line-height: 20px; }
    .inspiro-slider .slide-captions h2 br,  
    .inspiro-slider .slide-captions .lead br { display: none; }

    .slide { height: 250px; position: relative;}
    .slide .container { top: 60%; }

    .inspiro-slider .slide-captions h2, .slide-captions h2 { font-size: 18px; line-height: 22px; }

    .tip-location { padding-top: 60px !important; }

    .tip-whyus .whyus-detail { padding: 30px 15px; }

    .tip_tabs_testimonial .tabs-content .tab-detail { padding: 20px !important; }

    .footer-content .col-md-4, 
    .footer-content .col-md-5 { width: 100%; } 

    .tip-whyus .artc-item .htitle {
        /*height:100px;*/
        max-height: none;
    }
}

/* iPhone 6 */
@media(max-width: 375px) {
    #header #header-wrap #logo a > img { height: 60px; margin-top: 10px; }
    .inspiro-slider .slide-captions .lead, .slide-captions .lead, 
    .slide .slide-captions .text-small-x { font-size: 12px; line-height: 1.2; }
}

/* Galaxy S5 */
@media(max-width: 360px) {
    .grid-articles:not(.post-carousel) .post-entry:first-child, 
    .grid-articles:not(.post-carousel) .post-entry { width: 100%; }
    .tabs-content .tab-image img { width: 100%; }

    .tip_tabs_testimonial { padding-bottom: 150px !important; }
    .tip_tabs_testimonial .tabs-content .tab-detail { padding: 0px !important; }
}

/* iPhone 5 */
@media(max-width: 320px) {

    .slide { height: 200px; } 

    .tip-whyus .artc-item { width: 100% !important; }
    .tip-whyus .artc-item .info-wrap { min-height: 0; }

    .tip_tabs_testimonial { padding-bottom: 120px !important; }

    .inspiro-slider .slide-captions .lead, 
    .slide-captions .lead { 
        text-overflow: ellipsis;
        overflow: hidden;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical; 
    }
}