/* @import url('http://example.com/example_style.css'); */
@import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.css');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Nanum+Myeongjo&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
/***********************************************/
/* CSS @imports must be at the top of the file */
/* Add them above this section                 */
/***********************************************/

/*****************************************/
/* Start your style declarations here    */
/*****************************************/

/*  font-family: "Montserrat", sans-serif; 
 *  font-family: "Poppins", sans-serif;
 *  font-family: "Nanum Myeongjo", serif;
 * */





body { color: #1a1a1a; font-family: "Poppins", sans-serif; font-size: 16px; font-weight: 400; line-height: 24px; padding:0; margin:0; background:#f4f4f4; -webkit-font-smoothing: antialiased }
body, body * { cursor:none; }

.h1, h1 { font-size: 100px; letter-spacing: -2px; line-height: 1; margin: 0 0 10px; transition:ease color 0.4s; transition-delay:1s; }
.h1, .h2, h1, h2 { color: #1a1a1a; font-family: "Poppins", sans-serif; font-weight: 500; -webkit-font-smoothing: antialiased }
.h2, h2 { font-size: 48px; letter-spacing: -1.5px; line-height: 60px; margin: 0 0 15px; font-weight: 400; transition:ease color 0.4s; transition-delay:1s; }
.h3, h3 { font-size: 40px; line-height: 50px }
.h3, .h4, h3, h4 { color: #222; font-family: "Poppins", sans-serif; font-weight: 400; margin: 0 0 10px; -webkit-font-smoothing: antialiased }
.h4, h4 { font-size: 30px; line-height: 36px }
.h5, h5 { font-size: 26px; line-height: 34px }
.h5, .h6, h5, h6 { color: #222; font-family: "Poppins", sans-serif; font-weight: 400; margin: 0 0 10px; -webkit-font-smoothing: antialiased }
.h6, h6 { font-size: 16px; letter-spacing: .5px; line-height: 24px }

* { box-sizing:border-box; -webkit-box-sizing:border-box; -ms-box-sizing:border-box; -moz-box-sizing:border-box; }

.dark-bg.active h1, .dark-bg.active h2 { color:#f4f4f4 !important; }
.light-bg.active h1, .light-bg.active h2 { color:#1a1a1a !important; }

b, strong { font-weight: 700 }
.wrapper, .wrapper-xl { float: none; margin: 0 auto; max-width: 1240px; padding: 0 20px; width: 100%; }

a { display: inline-block; text-decoration: none; transition: all .4s ease; vertical-align: top; }
a, a:hover { color: #ff5119 }
img { height: auto; max-width: 100%; vertical-align: top }
.fullwidth { float: left; width: 100% }
.fl { display: flex; display: -webkit-flex }
.frw { flex-flow: row wrap; -webkit-flex-flow: row wrap }
.frr { flex-flow: row-reverse; -webkit-flex-flow: row-reverse }
.jfs { justify-content: flex-start; -webkit-justify-content: flex-start }
.jfe { justify-content: flex-end; -webkit-justify-content: flex-end }
.jsb { justify-content: space-between; -webkit-justify-content: space-between }
.jc { justify-content: center; -webkit-justify-content: center }
.ac { align-items: center; -webkit-align-items: center }
.afs { align-items: flex-start; -webkit-align-items: flex-start }
.afe { align-items: flex-end; -webkit-align-items: flex-end }
.text-center { text-align: center }
.section { padding-bottom: 100px; padding-top: 100px }

p { font-family: "Poppins", sans-serif; -webkit-font-smoothing: antialiased; font-size: inherit }
blockquote, blockquote p { background: linear-gradient(90deg, #ff5119, #ff2626); -webkit-background-clip: text; -webkit-text-fill-color: transparent; font-family: "Poppins", sans-serif; font-size: 32px; font-weight: 700 !important; line-height: 42px }
pre { color: #8a8f98; font-family: "Poppins", sans-serif; font-size: 14px; font-weight: 400; letter-spacing: 1px }

.btn a { font-size:16px; background:transparent; padding: 5px 10px; line-height: 28px; color:#1a1a1a; border-radius: 3px; margin: 10px 5px 0; text-transform: uppercase; font-weight: 500;  border:#1a1a1a solid 1px; }
.btn a:hover { background:#1a1a1a; color:#FFFFFF; }

/* Slider */
.slick-slider { position: relative; display: block; box-sizing: border-box; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; -khtml-user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent; }
.slick-list { float:left; width:100%; position: relative; display: block; overflow: hidden; margin: 0; padding: 0; }
.slick-list:focus { outline: none; }
.slick-list.dragging { cursor: pointer; cursor: hand; }
.slick-slider .slick-track, .slick-slider .slick-list { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
.slick-track { position: relative; top: 0; left: 0; display: block; margin-left: auto; margin-right: auto; }
.slick-track:before, .slick-track:after { display: table; content: ''; }
.slick-track:after { clear: both; }
.slick-loading .slick-track { visibility: hidden; }
.slick-slide { display: none; float: left; height: 100%; min-height: 1px; }
[dir='rtl'] .slick-slide { float: right; }
.slick-slide img { display: block; }
.slick-slide.slick-loading img { display: none; }
.slick-slide.dragging img { pointer-events: none; }
.slick-initialized .slick-slide { display: block; }
.slick-loading .slick-slide { visibility: hidden; }
.slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; }
.slick-arrow.slick-hidden { display: none; }
.slick-dots { display: flex !important; justify-content:center; float: left; padding: 0; list-style: none; width: 100%; }
.slick-dots li button { margin:5px; cursor:pointer; transition:ease all 0.4s; background:#CCCCCC; border:none; outline:none; width:10px; height:10px; border-radius:5px; font-size:0; }
.slick-dots li.slick-active button { background:#f5ad27; width:20px; }
.slick-arrow { cursor:pointer; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 50px; height: 50px; z-index: 1; background: transparent; border: none; font-size: 0; }
.slick-next { left:auto; right:0; }
.slick-arrow:before { position: absolute; content: ''; left: 0; top: 0; width: 30px; height: 30px; border-left: #FFFFFF solid 1px; border-bottom: #FFFFFF solid 1px; transform: translate(50%, -50%) rotate(45deg); transform-origin: left center; margin: 14px 0 0 10px; }
.slick-next:before { transform:rotate(225deg); transform-origin: right bottom; margin: -26px 0 0 -11px; }

/* .animated { opacity:0; } */

.header-section { position: absolute; left: 0; top: 0; width: 100%; z-index: 9; }

.header-logo { float: left; width: 25%; margin: 0 4% 0 0; }
.header-logo img { max-width:250px !important; width: 100%; }
.header-menu { float: left; width: 69%; }
.header-menu .hs-menu-wrapper > ul { list-style: none; padding: 0; margin: 0; display: flex; flex-flow: row wrap;  justify-content: flex-end; }
.header-menu .hs-menu-wrapper > ul > li > a { letter-spacing:-0.35px; position: relative; overflow: hidden; color:#1a1a1a; padding: 10px 20px; line-height: 28px; font-weight:500; }
.header-menu .hs-menu-wrapper > ul > li > a > span { transition: ease all 0.2s; }
.header-menu .hs-menu-wrapper > ul > li > a > span:last-child { font-family: "Nanum Myeongjo", serif; opacity:0; transform: translate(-50%, 100%); position: absolute; left: 50%; width: 100%; text-align: center; font-style: italic; }
.header-menu .hs-menu-wrapper > ul > li:hover > a { color:#f5ad27; }
.header-menu .hs-menu-wrapper > ul > li:not(:last-child):hover > a > span:first-child { transform:translateY(-100%); display: inline-block; opacity: 0; }
.header-menu .hs-menu-wrapper > ul > li:not(:last-child):hover > a > span:last-child { transform: translate(-50%, 0); opacity: 1; }
.header-menu .hs-menu-wrapper > ul > li:nth-last-child(3) > a { background: transparent; border-radius: 3px; font-weight: 600; margin: 4px 0 0 20px; padding:5px 10px; border:#1a1a1a solid 1px; }
.header-menu .hs-menu-wrapper > ul > li:nth-last-child(3):hover > a { background:#1a1a1a; color:#FFFFFF; }
.header-menu .hs-menu-wrapper > ul > li:nth-last-child(2) i { position: relative; top: -2px; margin: 0 0 0 10px; }
.header-menu .hs-menu-wrapper > ul > li:nth-last-child(1) i { font-size: 22px; }
.menu-toggle { display:none; }

.slt-black h2 { text-shadow:1px 1px #000000, -1px -1px #000000, 1px -1px #000000, -1px 1px #000000; color: #F4F4F4 !important; font-size: 80px; line-height: 1; }
.slt-white h2 { text-shadow:1px 1px #FFFFFF, -1px -1px #FFFFFF, 1px -1px #FFFFFF, -1px 1px #FFFFFF; color: #1a1a1a !important; font-size: 80px; line-height: 1;  }

.popup-section { display:none; position: fixed; left: 0; top: 0; width: 100%; height: 100vh; background: rgba(0, 0, 0, 0.5); z-index:10; }
.pop-open .popup-section { display:flex; }
.pop-inner { position:relative; max-width: 800px; display: flex; max-height: 90vh; overflow-y: auto; }
.pi-left { float: left; width: 50%; }
.pi-left img { object-fit: cover; height: 100% !important; }
.pi-right { float: left; width: 50%; background: #FFFFFF; padding: 40px; }
.pi-right h4 { font-weight: 500; }
.pi-right .hs-input { border: #CCCCCC solid 1px; outline: none; padding: 10px 20px; margin: 0 0 10px; width: 100%; border-radius: 3px; line-height: 26px; font-family: 'Poppins', sans-serif; }
.pir-close { cursor:pointer; position: absolute; right: 0; top: 0; width: 40px; height: 40px; text-align: center; line-height: 40px; font-size: 0px; color: #1a1a1a; }
.pir-close:before, .pir-close:after { position: absolute; content: ''; left: 50%; top: 50%; width: 20px; height: 3px; background: #000000; transform: translate(-50%, -50%) rotate(45deg); border-radius: 3px; }
.pir-close:after { transform: translate(-50%, -50%) rotate(-45deg); }
.pi-right .hs-button { font-family: 'Montserrat', sans-serif; font-size: 14px; background: #1a1a1a; color: #FFFFFF; border: none; padding: 10px 20px; border-radius: 3px; line-height: 28px; cursor: pointer; text-transform: uppercase; font-weight: 700; min-width: 120px; }
.pi-right .hs-button:hover  { background: #ff5119; border-color:#ff5119; color:#000000; }
.pi-right .hs-error-msgs { list-style: none; padding: 0; margin: 0 0 12px; font-size: 12px; line-height: 15px; color: red; }



.cursor-dot,
.cursor-dot-outline {
    pointer-events: none;
    position: absolute;
    top: 50%;
    left: 50%;
    border-radius: 50%;
    opacity: 0;
    transform: translate(-50%, -50%);
    transition: opacity 0.3s ease-in-out,
                transform 0.3s ease-in-out;
  z-index:11;
}
.cursor-dot circle, .cursor-dot-outline  circle { fill: #f7f8fa; }
.cursor-dot {
    width: 8px;
    height: 8px;
    mix-blend-mode: difference;
  z-index: 1001;    margin-top: -11px;
}

.cursor-dot-outline {
   /* width: 40px;
    height: 40px;
    background-color: rgba(0,0,0, 1);*/ 
    mix-blend-mode: difference;
   z-index: 1000;
    
}

@-moz-keyframes spin { 
    0% { -moz-transform: translate(-50%,-50%) rotate(0deg); } 
    100% { -moz-transform: translate(-50%,-50%) rotate(360deg); } 
}
@-webkit-keyframes spin { 
    0% { -webkit-transform: translate(-50%,-50%) rotate(0deg); } 
    100% { -webkit-transform: translate(-50%,-50%) rotate(360deg); } 
}
@keyframes spin { 
    0% { -webkit-transform: translate(-50%,-50%) rotate(0deg); transform: translate(-50%,-50%) rotate(0deg);  } 
    100% { 
        -webkit-transform: translate(-50%,-50%) rotate(360deg); 
        transform: translate(-50%,-50%) rotate(360deg); 
    } 
}

.hero-section { position:relative; color:#FFFFFF; min-height:100vh; }
.hs-inner { position:relative; z-index:1; max-width: 100%; }
.hs-inner > * { position: relative; z-index: 1; }
.hs-rotate { transform-origin:center; position:absolute; left:50%; top:50%; width:240px; height:240px; -webkit-animation:spin 4s linear infinite; -moz-animation:spin 4s linear infinite; animation:spin 4s linear infinite; opacity:1; }
.hs-rotate:before, .hs-rotate:after, .hs-rotate span:before, .hs-rotate  span:after { position: absolute; content: ''; left: 50%; top: 50%; width: 100px; height: 100px; transform: translate(-50%, -50%); background: red; filter: blur(90px); border-radius: 50%; margin: -70px 0 0 -70px; }
.hs-rotate span:before { background: green; margin: 70px 0 0 -70px; }
.hs-rotate span:after { background: blue; margin: 70px 0 0 70px; }
.hs-rotate:after { background: yellow; margin: -70px 0 0 70px; }
.hero-section h1 { text-shadow:1px 1px #000000, -1px -1px #000000, 1px -1px #000000, -1px 1px #000000; color:#f4f4f4; }
/* .hero-section h1 span { display: inline-block; overflow: hidden; vertical-align:top; } */
/* .hero-section h1 span span { transform: translateY(120%); display: inline-block; transition: ease all 0.4s; vertical-align:top; line-height:127px; padding: 0 3px 0 0; }
.hero-section h1 span:nth-child(2) span { transition-delay:0.1s; }
.hero-section h1 span:nth-child(3) span { transition-delay:0.2s; }
.hero-section h1 span:nth-child(4) span { transition-delay:0.3s; } */
.page-loaded .hero-section h1 span span { transform: translateY(0%); }
/* .hero-section h1 span:hover { color:#f5ad27; transition:ease all 0.4s; }
.hero-section h1 span:nth-child(2):hover { color:#000000; }
.hero-section h1 span:nth-child(3):hover { color:#f52727; }
.hero-section h1 span:nth-child(4):hover { color:#0367cb; } */
.hsi-text { max-width: 800px; float: none; display: inline-block; color: #1a1a1a; margin:20px 0 5px; }

.text-center .sec-heading h2 { background-position:center bottom 10px; }
.about-section { background: #1a1a1a; color: #ffffff; font-size: 20px; line-height: 30px; font-weight: 300; }
.as-inner h2 { position: absolute; left: 0; top: 0; font-size: 120px; text-shadow: 1px 1px rgba(255,255,255,0.1), -1px -1px rgba(255,255,255,0.1), 1px -1px rgba(255,255,255,0.1), -1px 1px rgba(255,255,255,0.1); color: #1a1a1a; line-height:1; }
.as-inner { position:relative; float: none; display: inline-block; padding: 130px 100px 0; background: #1a1a1a; max-width: 100%; border-radius: 20px; }

.logo-inner { overflow:hidden; }
.lg-slide { float: left; width: 270px; text-align: center; padding:0 20px; /*filter:brightness(0) grayscale(1);*/ }
.lg-slide img { object-fit:contain; height:60px !important; max-width: 160px !important; width: 100%; }
.lg-reverse { float:right; }
.lg-top { margin: 30px 0; transition:ease all 0.8s; }

.services-section { position:relative; }
.ss-left { float: left; width: 46%; position: sticky; top: 0; padding-top: 50px; }
.ss-right { float:left; width: 46%; margin-left:8%; }
.ssr-box { padding: 50px; background: #1a1a1a; color:#FFFFFF; margin: 0 0 40px; border-radius: 10px; }
.ssr-box h6 { font-weight:600; color:#ff5119; }

.hide { display:none; }

.ps-slides { margin: 70px 0 0; }
.ps-slide { position:relative; transition:ease transform 0.4s; overflow:hidden; border-radius:10px; }
.ps-slide .pss-image { position: relative; padding: 48% 0 0; height: 0; }
.ps-slide.slick-slide:not(.slick-current) { transform:scale(0.8); }
.pss-image img { position: absolute; left: 0; top: 0; width: 100%; height: 100%; height: 100% !important; width: 100%; object-fit: cover; }
.ps-info { opacity:0; position: absolute; left: 0; bottom: 0; padding: 60px 40px 40px; background:linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,0) 1%,rgba(0,0,0,0.6) 35%,rgba(0,0,0,1) 100%); } 
.ps-slide.slick-current .ps-info { opacity:1; }
.ps-slides .slick-arrow { opacity:0; width:100px; height:100px; margin-left:-20px; transition:ease all 0.4s; }
.ps-slides .slick-next { margin:0 -20px 0 0; }
.ps-slides:hover .slick-arrow, .ps-slides:hover .slick-next { margin:0; opacity:1; }
.ps-slides .slick-arrow:before { margin: -12px 0 0 10px; top: 50%; left: 50%; transform: translate(-50%, -50%) rotate(45deg); }
.ps-slides .slick-next:before { margin: 0 0 0 -8px; transform: translate(-50%, -50%) rotate(225deg); transform-origin: center; }
.ps-slides .slick-arrow:after { position: absolute; content: ''; left: 0; top: 0; width: 100%; height: 100%; background: #1a1a1a; filter: blur(20px); z-index: -1; opacity: 0; transition:ease all 0.4s; }
.ps-slides .slick-arrow:hover:after { opacity:0.7; }

.technology-section { position:relative; }
.ts-left { float: left; width: 100%; margin:40px 0 0; }
.tsl-box { padding: 30px 0; width: 23.5%; float: left; margin: 0 2% 0 0; }
.tsl-box:last-child { margin-right:0; }
.tsl-box h6 { text-transform:uppercase; font-weight:600; }
/* .tsl-box img { max-width:180px !important; } */
/* .technology-section h2 { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); } */
/* .technology-section .ts-inner { width: 600px; height: 600px; float: none; display: inline-block; border-radius: 50%; position:relative; }
.technology-section .tsi-box { max-width: 100px; background: #f4f4f4; position: absolute; left: 50%; top: 0; transform: translate(-50%, -50%); }
.technology-section .tsi-box:nth-child(2) { left:0; top:50%; }
.technology-section .tsi-box:nth-child(3) { left:auto; right:0; top:50%; transform:translate(50%, -50%); }
.technology-section .tsi-box:nth-child(4) { top:auto; bottom:0; transform:translate(-50%, 50%); } */

.testimonial-section .ts-slide { float:left; width:32%; margin: 40px 2% 0 0; border-radius:20px; position:relative; padding: 0; box-shadow: rgba(0,0,0,0.4) 0 0 20px -15px; }
.testimonial-section .ts-slide:nth-child(3n) { margin-right:0; }
.testimonial-section .ts-message { padding: 15px 30px; }
.testimonial-section .ts-slide .tss-image > span { float: none; display: inline-block; width: 50px; height: 50px; border-radius: 50%; overflow: hidden; position: absolute; left: 50%; top: 0; transform: translate(-50%, -50%); }
.testimonial-section .tss-image img { object-fit: cover; width: 100%; height: 100% !important; }
.ts-client { padding: 0 0 30px; }
.ts-client h6 { font-weight: 700; float: left; width: 100%; margin: 15px 0; }
.ts-client h6 span { float: left; width: 100%; color: #AAAAAA; }
 
.csi-form { float: left; width: 50%; }
.cs-inner form { max-width: 100%; width:100%; float: none; display: inline-block; padding: 40px; border-radius: 20px; margin: 0; box-shadow:rgba(0,0,0,0.5) 0 0 20px -15px; }
.cs-inner form .hs-form-field { margin:0 0 30px; }
.cs-inner form .hs-input { width: 100%; outline:none; border: none; padding: 10px 20px; border-radius: 5px; line-height: 28px; background: #f9f9f9; box-sizing: border-box; font-family: "Poppins", sans-serif; color:#FFFFFF; }
.cs-inner form .hs-input::-ms-input-placeholder { color: #000000; }
.cs-inner form .hs-input::placeholder { color: #000000; }
.cs-inner form .hs-form-field > label { display:none; }
.cs-inner form .hs-button { transition:ease all 0.4s; background: #1a1a1a; color: #FFFFFF; font-family: 'Montserrat', sans-serif; padding: 10px 20px; line-height: 28px; border: none; min-width: 120px; border-radius: 5px; font-weight: 700; text-transform: uppercase; cursor: pointer; font-size:14px; }
.cs-inner form .hs-button:hover { background: #ff5119; border-color:#ff5119; color:#000000; }
.csi-form .hs-error-msgs { text-align: left; list-style: none; padding: 0; font-size: 12px; color: red; margin: 0; } 
.csi-info { float: left; width: 50%; padding: 50px 50px 0 0; }
.csi-left { list-style: none; padding: 0px; margin: 30px 0 0; }
.csi-left li { position:relative; padding: 0 160px 0 45px; line-height: 30px; margin: 40px 0 0; }
.csi-left li a { color:#1a1a1a; }
.csi-left li a:hover { color:#ff882d; }
.csi-left li span { position: absolute; left: 0; top: 0; width: 30px; }

.footer-logo { float: left; width: 20%; }
.footer-copyright { color: #FFFFFF; font-size: 12px; text-align: right; float: left; width: 78%; margin: 0 0 0 2%; }

@media (min-width:992px){
  .header-menu .hs-menu-wrapper { display:block !important; }
}

@media (max-width:1300px){
  h1 { font-size:74px; }
  h2, .slt-black h2, .slt-white h2 { font-size:60px; }
  .wrapper { max-width:940px; }
  
  .header-logo { width:22%; margin: 0 3% 0 0; }
  .header-menu { width:75%; }
  
  .as-inner h2 { font-size:100px; }
  
  .header-menu .hs-menu-wrapper > ul > li > a { padding:10px 7px; }
  .header-menu .hs-menu-wrapper > ul > li:last-child > a { padding:10px 18px; margin:0 0 0 8px; } 
  
  .csi-left li { padding: 0 60px 0 45px; }
}

@media (max-width:991px){
  .wrapper { max-width:720px; }
  
  .header-logo { position:relative; z-index:10; }
  .menu-toggle { z-index:10; display:block; position: absolute; right: 50%; top: 24px; width: 30px; height: 20px; border-bottom:#1a1a1a solid 2px; transform: translateX(50%); margin-right: -325px; }
  .menu-toggle:before, .menu-toggle:after { position:absolute; content:''; left:0; bottom:7px; height:2px; border-bottom:#1a1a1a solid 2px; width:100%; }
  .menu-toggle:after { bottom:16px; }
  
  .header-menu .hs-menu-wrapper { display:none; position: absolute; left: 0; top: 0; width: 100%; height: 100vh; background: #FFFFFF; z-index: 9; padding: 70px 20px 20px; overflow-y: auto; justify-content: center; align-items: center; }
  .header-menu .hs-menu-wrapper > ul > li { width: 100%; text-align: center; }
  .hero-section h1 { font-size: 60px; line-height: 1.2; }
  .menu-open { overflow: hidden; }

  .header-menu .hs-menu-wrapper > ul > li:last-child > a, .header-menu .hs-menu-wrapper > ul > li:nth-last-child(2) i { margin:0; }
    
  .h2, h2 { font-size: 40px; line-height:1.2; }
  
  .as-inner { padding:100px 0 0; }
  .as-inner h2 { font-size: 80px; }
  
  .testimonial-section .ts-slide, .testimonial-section .ts-slide:nth-child(3n) { width:48%; margin-right:4%; }
  .testimonial-section .ts-slide:nth-child(2n) { margin-right:0; }
  
  .tsl-box img { max-height: 32px; width: auto; }
  
  .ss-left, .ss-right { float: left; width: 100%; position:static; }
  .ss-right { margin: 40px 0 0; } 
  .ss-right img { display:block; }
  .ss-left { padding:0; }
  .ssr-box:last-child { margin-bottom:0; }
  
  .ps-info { padding:60px 30px 20px; }
  .ps-info h4 { font-size: 24px; line-height: 30px; }
  
  .ts-left { margin:20px 0 0; }
  
  .csi-info { width:100%; padding:0; }
  .csi-form { margin:40px 0 0; width:100%; }
  
}

@media (max-width:767px){ 
  .wrapper { max-width:100%; }
  .h2, h2, h2, .slt-black h2, .slt-white h2 { font-size: 32px; }
    
  .header-logo { float: left; margin: 0; width: 100%; padding-right: 80px; }
  .header-logo img { max-width: 170px !important; }
  .menu-toggle { right: 20px; margin: 0; transform: none; top: 20px; }
  .hero-section h1 { font-size: 44px; }
  .hsi-text { margin:0 0 5px; }
  
  .about-section { font-size:16px; line-height:26px; }
  .as-inner { padding: 0; }
  .as-inner h2 { font-size: 50px; position:static; }
  
  .ps-slides { margin: 30px 0 0; } 
  
  .ssr-box { padding: 30px; }
  
  .ts-left { margin: 20px 0 0; display: flex; flex-flow: row wrap; justify-content: center; }
  .tsl-box { width:160px; }
  
  .cs-inner form { padding:25px; }
  .testimonial-section .ts-slide, .testimonial-section .ts-slide, .testimonial-section .ts-slide:nth-child(3n) { margin:30px 0 20px; width:100%; }
  
  .header-menu .hs-menu-wrapper > ul > li:last-child > a { margin:0; } 
  .csi-left li { padding: 0 0px 0 45px; }
  
  .pop-inner { flex-flow:row wrap; }
  .pi-left, .pi-right { width:100%; }
  .pi-left img { height:100px !important; }
  .pi-right { padding:30px; }
  .pi-right h4 { font-size: 24px; line-height: 30px; }
  .pir-close { top:100px; }
  
  .footer-logo { float: left; width: 100%; text-align: center; }
  .footer-logo img { max-width:150px !important; }
  .footer-copyright { width:100%; margin:10px 0 0; text-align:center; } 
}

















/* CSS variables */

:root {
  --column-gap: 2.13%;
  --column-width-multiplier: 8.333;
}

/* Mobile layout */

.row-fluid {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
}


  .row-fluid .span1,
  .row-fluid .span2,
  .row-fluid .span3,
  .row-fluid .span4,
  .row-fluid .span5,
  .row-fluid .span6,
  .row-fluid .span7,
  .row-fluid .span8,
  .row-fluid .span9,
  .row-fluid .span10,
  .row-fluid .span11,
  .row-fluid .span12{
  min-height: 1px;
  width: 100%;
}

/* Desktop layout */

@media (min-width: 768px) {
  .row-fluid {
    flex-wrap: nowrap;
    justify-content: space-between;
  }