.page,body,html{height:100%}
body{overflow:hidden}
.h1,.h2,.h3,.h4,.h5,.h6,body,h1,h2,h3,h4,h5,h6,html{font-family:Yantramanav,Helvetica Neue,Helvetica,Roboto,Arial,sans-serif}
.page{display:flex;flex-direction:column}
.page-header{flex:0 0 auto;background-color:#dcdcdc; position: relative;}
.page-content{flex:1 1 auto;position:relative;overflow-y:auto;}
.home-content { overflow: hidden;}
.top{position:fixed;top:0;height:60px;background:#ff0}
.row{max-width:100%}.menu-icon::after{background:#000;box-shadow:0 7px 0 #000e,0 14px 0 #000;content:''}
a { color: #000; }
.modal-cs a {text-decoration: underline; }
.main-banner.slick-initialized.slick-slider { z-index: 0;}
.main-banner-bg { min-height: 100vh; background-size: cover;}
.main-video video { width: 100%; }

/* NAVIGATION */
.topbar-responsive .menu .active>a { border-bottom: 2px solid #000; background-color: transparent; color: #000;}
div#topbar-responsive { margin-left: auto; }
.topbar-responsive .menu .active>a{background-color:#000;color:#fff}
.top-bar-title { width: auto; background-color: white; text-align: center; margin: 0;  margin-left: 5%; display: block;}
a.topbar-responsive-logo img { width: 162px; height: auto;}
.topbar-responsive { background: transparent; padding: 0; position: relative; z-index: 3; width: 100%; background-color: rgba(255,255,255,1.0); height: 65px; box-shadow: 0px 1px 25px rgba(88, 88, 88, 0.2);}
.topbar-responsive .topbar-responsive-logo { background: transparent; vertical-align: middle; }
.topbar-responsive .menu { background: transparent; margin-left: auto; padding-left: 10px; }
.topbar-responsive .menu li:last-of-type { margin-right: 0; }
.topbar-responsive .menu a { color: #5d5a5a; transition: color 0.15s ease-in; font-size: 1.0em; margin: 0 0.3em; text-transform: uppercase; font-weight: 450; letter-spacing: 0.2em;}
.topbar-responsive .menu li:hover { background-color: #fff; color: #3c3c3c; -webkit-transition: background 0.8s ease-in-out; -moz-transition: background 0.8s ease-in-out; -ms-transition: background 0.8s ease-in-out; -o-transition: background 0.8s ease-in-out; transition: background 0.8s ease-in-out; }
.topbar-responsive .menu li:hover a{ color: #000; }
.topbar-responsive .menu li.active a{ color: #fff; }
.top-bar-right { display: block ;}
.top-bar-right.social-mobile { display: none ;}
ul.menu.social-links { margin-right: 2%; }
.dropdown.menu.medium-horizontal > li.opens-left > .is-dropdown-submenu { background-color: #fff; box-shadow: 5px -2px 12px rgba(0,0,0,0.2); min-width: 100%;}
.dropdown.menu.medium-horizontal > li.is-dropdown-submenu-parent.is-active.opens-right > a::after { color: #000; }
.social-links li { color: #fff; padding: 2%; font-size: 20px; margin-right: 10px; display: inline;}
.topbar-responsive .menu.social-links li:last-of-type { margin-right: 0px; }
.topbar-responsive .social-links li a:hover { background-color: transparent; color: #252525; }
.topbar-responsive .social-links li:hover { background-color: transparent; color: #fff; }
.topbar-responsive .menu .topbar-responsive-button{color:#fefefe;border-color:#fefefe;border-radius:5000px;transition:color .15s ease-in,border-color .15s ease-in}
.topbar-responsive .menu .topbar-responsive-button:hover{color:#c6d1d8;border-color:#c6d1d8}
.top-bar-right { display: block;}

/************************ Expand content *****************************/
.expnd-content-outer { position: absolute; z-index:3; color: #fff; display: none; bottom:0; height: calc(100% - 65px); padding: 2em;}
#marketing-comp .expnd-content-outer {  background: -moz-linear-gradient(top, rgba(125,185,232,0) 0%,rgba(224,103,123,0.59) 9%,rgba(224,83,106,0.86) 46%,rgba(226,53,83,0.99) 99%,rgba(226,53,83,1) 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(top, rgba(125,185,232,0) 0%,rgba(224,103,123,0.59) 9%,rgba(224,83,106,0.86) 46%,rgba(226,53,83,0.99) 99%,rgba(226,53,83,1) 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom, rgba(125,185,232,0) 0%,rgba(224,103,123,0.59) 9%,rgba(224,83,106,0.86) 46%,rgba(226,53,83,0.99) 99%,rgba(226,53,83,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#007db9e8', endColorstr='#e23553',GradientType=0 ); /* IE6-9 */
}
.expnd-content-inner { height: 500px; }
#picture-comp .expnd-content-outer {
  background: -moz-linear-gradient(top, rgba(125,185,232,0) 0%, rgba(106, 42, 131) 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(top, rgba(125,185,232,0) 0%,rgba(106, 42, 131) 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom, rgba(125,185,232,0) 0%,rgba(106, 42, 131) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#007db9e8', endColorstr='#673AB7',GradientType=0 ); /* IE6-9 */
}
#technology-comp .expnd-content-outer {
  background: -moz-linear-gradient(top, rgba(125,185,232,0) 0%, rgba(103, 58, 183) 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(top, rgba(125,185,232,0) 0%,rgba(103, 58, 183) 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom, rgba(125,185,232,0) 0%,rgba(103, 58, 183) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#007db9e8', endColorstr='#673AB7',GradientType=0 ); /* IE6-9 */
}
#media-comp .expnd-content-outer {
  background: -moz-linear-gradient(top, rgba(125,185,232,0) 0%,rgba(244,201,122,0.3)10%,rgba(247,197,98,0.56) 30%,rgba(249,183,49,1) 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(top, rgba(125,185,232,0) 0%,rgba(244,201,122,0.3)10%,rgba(247,197,98,0.56) 30%,rgba(249,183,49,1) 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom, rgba(125,185,232,0) 0%,rgba(244,201,122,0.3)10%,rgba(247,197,98,0.56) 30%,rgba(249,183,49,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#007db9e8', endColorstr='#f9b731',GradientType=0 ); /* IE6-9 */
}

.com-icon { width: 80px; text-align: center; margin: 0 auto;}
.expnd-content-inner { position: absolute; bottom: 10%; left: 0; padding: 2em; width: 100%; text-align: center}
.expnd-content-inner p { font-size: 0.9rem; font-weight: bold; letter-spacing: 0.05em;}
.expnd-content-inner hr { border-bottom: 1px solid #fff;}
.expnd-content-inner h5 { margin-top: 0.8em; font-weight: bold;}
.site-visit a { font-weight: bold; color: #fff; border: 3px solid #fff; padding: 0.3em 0.5em; }
.site-visit a:hover { background-color: rgba(0,0,0,0.5)}
.site-visit { line-height: initial; margin: 1.0em 0; }
.expnd-content-inner .desc { height: 430px; }
.expnd-content-inner button.close-button { bottom: 0%; top: 0; }
.expnd-content-inner .close-button span { bottom: 0; position: absolute; color: #fff; right: 5% }
.expnd-content-inner a { color: #c7edfd; }
.expnd-content-inner a:hover { color: #909ce0; }
/* ****************************** Download ***************************************/
/* Floating Contact Form */
.floating-form .modal-content { min-height: 100vh; border-radius: 0;}
.floating-form .modal-body { min-height: 80vh; height: 100%;}
.floating-form { max-width: 50%; width: 30%; height: 570px; padding: 15px; background: #fff; border: 1px solid #ddd; right: 10px; position: fixed; z-index: 15; top: 30%; transition: 0.5s; transform: translate(104%, 0%);}
.contact-opener { position: absolute; left: -115px; transform: rotate(-90deg); top: 14%; background-color: red; padding: 9px; color: red; text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.43); cursor: pointer; border-top-right-radius: 10px; border-top-left-radius: 10px;}
.contact-opener i { margin-right: 10px; }
.floating-form-heading { font-weight: bold; margin-bottom: 0.4em; font-size: 25px; padding-bottom: 3px; text-align: center;}
.floating-form label{ display: block; margin: 5px;}
.floating-form label > span{ width: 20%; font-weight: bold; float: left; padding-top: 8px; padding-right: 5px;}

.floating-form .tel-number-field{ width: 40px; text-align: left;}
.floating-form  .long{ width: 120px;}
#dlform_body input { width: 100%; margin-bottom: 0;}
#dlform_body .submit-wrap input { width: 30%;}
.floating-form.open{ -ms-transform: translate(4%, -24%); -webkit-transform: translate(4%, -24%); transform: translate(4%, -24%); }
.floating-form input.input-field,
.floating-form .tel-number-field,
.floating-form .textarea-field,
.floating-form .select-field{
  -webkit-transition: all 0.30s ease-in-out;
  -moz-transition: all 0.30s ease-in-out;
  -ms-transition: all 0.30s ease-in-out;
  -o-transition: all 0.30s ease-in-out;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  border: 1px solid #C2C2C2;
  box-shadow: 1px 1px 4px #EBEBEB;
  -moz-box-shadow: 1px 1px 4px #EBEBEB;
  -webkit-box-shadow: 1px 1px 4px #EBEBEB;
  border-radius: 3px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  padding: 7px;
  outline: none;
}
.floating-form .input-field:focus,
.floating-form .tel-number-field:focus,
.floating-form .textarea-field:focus,
.floating-form .select-field:focus{ border: 1px solid #2e3b88;}
.floating-form .textarea-field{ height:100px; width: 100%;}
.floating-form input[type="button"],
.floating-form input[type="submit"], .contact-opener { background-color: #505156; display: inline-block; cursor: pointer; color: #FFFFFF; padding: 12px 23px; text-decoration: none;}
.floating-form input[type="submit"]{margin-top: 14px;}
.floating-form input[type="button"]:hover, .floating-form input[type="submit"]:hover, .contact-opener { background-color: #272935; color:#fff; font-size: 16px; font-weight: bold;}
.floating-form .success{ background: #D8FFC0; padding: 5px 10px 5px 10px; margin: 0px 0px 5px 0px; border: none; font-weight: bold; color: #2E6800; border-left: 3px solid #2E6800;}
.floating-form .error { background: #FFE8E8; padding: 5px 10px 5px 10px; margin: 0px 0px 5px 0px; border: none; font-weight: bold; color: #FF0000; border-left: 3px solid #FF0000;}
.floating-form label > span { width: 100%;}
.form-group { margin-bottom: 5px;}
.submit-wrap #submit_btn { width: 30%; }
.submit-wrap { text-align: center; }
.inner-service-wrap { min-height: 95vh; height: 100%;}
.inner-service-wrap h1 { text-align: left;}
.inner-service-form { margin-top: 4em;}
.inner-service .form-group { margin-bottom: 3rem;}
.modal-dialog.modal-full { overflow: auto; height: 100%; }
.modal-content { height: 100%; overflow: auto; }
.submit-inner-wrap { text-align: center; }
.inner-submit { background: #472f91; color: #fff; text-transform: uppercase; padding: 1em 4em; font-weight: bold}
.inner-submit:hover { background-color: #33216b; color: #fff; }
.alert-success { display: none; }
.alert-error{ background: #FFE8E8; padding: 5px 10px 5px 10px; margin: 0px 0px 5px 0px; border: none; font-weight: bold; color: #FF0000; border-left: 3px solid #FF0000;}
.open-form.alert-success { display: none; text-align: center; width: 90%; margin: 0 auto; font-size: 18px;  padding: 0.5em}
.form-control:focus{ border-color: #472f91; outline: 0; -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(71,47,145,.6); box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(71,47,145,.6); }
.inner-service-wrap h1 {padding-left: 0.5em;  margin-bottom: 1.0em;}
.inner-service-wrap h1:before { content: ''; position: absolute; height: 50px; top: 0px; left: 0; border-left: solid 5px #472f91; margin-right: 2rem; }
.inner-service-form #message { height: 90px; width: 100% !important;}
.recaptcha_widget { text-align: center; }
.g-recaptcha { display: inline-block; }

/* -------------------------------- FOOTER -----------------------------------------  */
footer { flex: 0 0 auto; background-color: #fff; border-top: 1px solid #000;}
footer::-webkit-scrollbar {  display: none; }
footer p { margin: 0.2% 1%; font-size: 0.8vw;  }
.company-wrap { background-color: #000; min-height: 100vh; color: #fff; }
.company-intro p { line-height: 3.0em; }
p.copyright { float: left; }
p.privacypolicy { float: right; color: #000; }
.privacypolicy a { color: #000; border-bottom: 1px solid #000; }
.row.company-section { margin: 0; }

/* About Us */
.core-value-wrap { margin: 0.5em 0 2em 0; }
.core-value ul { columns: 2; -webkit-columns: 2; -moz-columns: 2; list-style-type: none;}
.core-value h3:before, .mission-wrap h3:before, .vision-wrap h3:before { content: ""; position: relative; background-image: url(../img/holding-icon.png); height: 35px; display: inline-block; width: 1.5rem; float: left; background-size: contain; background-repeat: no-repeat; opacity: 0.6; vertical-align: bottom;}
.core-value h3 { margin-bottom: 1em; }
.inner-content { width: 80%; margin: 0 auto;}
#about-tabs { border: 0; }
#about-tabs .tabs-title>a:focus, #about-tabs .tabs-title>a[aria-selected=true] { background-color: transparent;}
#about-tabs .tabs-title>a { color: #000; font-size: 1.2em; position: relative; padding: 0.5em 1em;}
.core-value { margin-top: 1em; }
.mission-vision-wrap { margin-top: 1.5em; }
#about-tabs a:focus { outline: none; }
.about-us-content .tabs-panel { padding: 0; }
.about-us-content .tabs-content { margin-left: 10px; border: 0;}
#about-tabs .tabs-title>a[aria-selected=true]:before { content: ""; border-left: 3px solid #44539f; margin-right: 10px; position: absolute; top: 0; left: 0; display: block; right: 0; bottom: 0; }
.tabs#about-tabs.vertical>li { height: 60px; }
.deeplus-holding-logo-wrap img { width: 160px; margin-bottom: 20px; }
.core-value ul li:before { content: "\f111"; font-family: FontAwesome; font-style: normal; font-weight: normal; margin-right: 10px; font-size: 8px; }
.about-us-img-wrap { height: 400px; }
.about-us-img-wrap img { height: 100%; width: 100%; object-fit: cover; }

/* BRANDS */
.site-btn-wrap { text-align: center; margin-top: 2em;}
a.site-btn { position: relative; margin: 10px; padding: 10px 15px; text-align: center; text-transform: uppercase;position: relative; overflow: hidden; transition: .5s; background-color: #fff;color: #000; border: 2px solid #000}
a.site-btn:hover{ box-shadow: inset 8.5em 0 0 0 #000; color: #fff; background-color: #000; border: 1px solid #000;}

/* HOLDING LIST */
.company-section { height: 90px;}
.row.holding-row img { width: 140px; margin: 2% 0%;}
.direct-btn { text-align: center; line-height: 68px;}
.direct-btn a { border: 1.5px solid #000; padding: 10px 15px; margin: 3% 0%; display: none;}
.direct-btn a:before { content: "\f178"; font-family: FontAwesome; font-style: normal; font-weight: normal; text-decoration: inherit; color: #000;  font-size: 18px;  left: 0; }
.holding-list { width: 100%; position: initial; height: auto; margin: 0 auto; bottom: 0; background-color: #fff; z-index: 9; }
.com-logo { text-align: center; }
.holding-list .columns { float: left; padding:0;}
.company-section { border: 0.5px solid #dedede; line-height: 80px; border-right: 0;}
ul.menu.social-links li a { margin: 0; padding: 0.7rem 0.5rem; }
.row.company-section:hover .com-logo { box-shadow: 0 -1px 32px 0px rgba(0,0,0,0.6); z-index: 2; -webkit-transition: all 200ms ease-in; -webkit-transform: scale(1.05, 1.05) translateY(-2.5%); -ms-transition: all 200ms ease-in; -ms-transform: scale(1.05, 1.05) translateY(-2.5%); -moz-transition: all 200ms ease-in; -moz-transform: scale(1.05, 1.05) translateY(-2.5%); transition: all 200ms ease-in; transform: scale(1.05, 1.05) translateY(-2.5%); background-color: #fff; }
.know-more { margin-top: 3em; }
.company-list:nth-child(1):hover .com-logo { border-top: 7px solid #ffc517; }
.company-list:nth-child(2):hover .com-logo { border-top: 7px solid #e13553; }
.company-list:nth-child(3):hover .com-logo { border-top: 7px solid #6e2b88; }
.company-list:nth-child(4):hover .com-logo { border-top: 7px solid #472f91; }
.pop-overlay { position: absolute; background-color: rgba(0,0,0,0.1); width: 100%; height: 100%; top: 0; left: 0;display: none}
.show { display: block}
/*  SLIDE */
.social-bar.hide-for-small-only {  margin-left: 10px; display: block; width: 10%; }
.slider-home.item.lazyOwl { min-height: 70vh; height:auto !important; height: 100%; background-size: cover; background-position: 50%;}
/* MODAL */
.modal-cs img { width: 200px; }
.modal-cs { text-align: center; height: 45vh; max-height: auto; min-height: auto; margin: 0 auto; top: 50%; bottom: 0; }
#cs-notice { min-height: 40vh; height: auto; text-align: center; }
.cs-notice-wrap { transform: translateY(50%); }
.cs-notice-wrap a { color: #000; text-decoration: underline; }

/* ======================== Slide Description ============================== */
.banner-desc-area { top: auto; width: 50%; bottom: 15%; left: 5%; position: absolute;}
.slide-desc--top { position: absolute; top: 25%; left: 38%; width: 100%;}
.slide-desc--bottom { position: absolute; top: 25%; right: 0; width: 50%; color: #fff;}
.slide-desc-wrap:before { position: absolute; content: ""; width: 50%; height: 3px; background: #fff; display: block; left: 0; top: 0; -webkit-transform: scaleX(0); transform: scaleX(0); -webkit-transform-origin: top left; transform-origin: top left; -webkit-transition: all 0.2s 0.4s; transition: all 0.2s 0.4s; }
.slide-desc-wrap:after { position: absolute; content: ""; width: 50%; height: 3px; background: #fff; display: block; right: 0; top: 0; -webkit-transform: scaleX(0); transform: scaleX(0); -webkit-transform-origin: top right; transform-origin: top right; -webkit-transition: all 0.2s 0.4s; transition: all 0.2s 0.4s; }
.slide-desc:before, .slide-desc--top:before { position: absolute; content: ""; width: 3px; height: 100%; background: #fff; display: block; left: 0; top: 0; -webkit-transform: scaleY(0); transform: scaleY(0); -webkit-transform-origin: bottom left; transform-origin: bottom left; -webkit-transition: all 0.2s 0.2s; transition: all 0.2s 0.2s; }
.slide-desc:after, .slide-desc--top:after { position: absolute; content: ""; width: 3px; height: 100%; background: #fff; display: block; right: 0; top: 0; -webkit-transform: scaleY(0); transform: scaleY(0); -webkit-transform-origin: bottom right; transform-origin: bottom right; -webkit-transition: all 0.2s 0.2s; transition: all 0.2s 0.2s; }
.slide-desc:hover:before, .slide-desc--top:hover:before { -webkit-transform: scaleY(1); transform: scaleY(1); }
.slide-desc:hover:after, .slide-desc--top:hover:after { -webkit-transform: scaleY(1); transform: scaleY(1); }
.slide-desc:hover h2:after ,.slide-desc--top:hover h2:after { -webkit-transform: scaleX(1); transform: scaleX(1); }
.slide-desc:hover .slide-desc-wrap:before, .slide-desc--top:hover .slide-desc-wrap:before {  -webkit-transform: scaleX(1); transform: scaleX(1); }
.slide-desc:hover .slide-desc-wrap:after, .slide-desc--top:hover .slide-desc-wrap:after { -webkit-transform: scaleX(1); transform: scaleX(1); }
.slide-desc { position: relative; }
.slide-desc-wrap{ border: 2px solid rgba(255,255,255,0.5); padding: 1em; background-color: rgba(0,0,0,0.23); position: relative;}
.slide-desc h2,.slide-desc--top h2 { cursor: pointer; display: inline-block; color: #fff;  text-transform: uppercase; font-weight: 600; letter-spacing: 0.15em;}
.slide-desc h6,.slide-desc--top h6 { color: #fff; font-weight: bold;}
.slide-desc h2:after, .slide-desc--top h2:after { position: absolute; content: ""; width: 100%; height: 3px; background: #fff; display: block; left: 0; bottom: 0; -webkit-transform: scaleX(0); transform: scaleX(0); -webkit-transition: all 0.2s; transition: all 0.2s; }
.slide-desc--top.desc-right { top: 30%; }
.know-more a{ color: #fff;  text-transform: uppercase; border-top: 2px solid #fff; padding-top: 10px; font-weight: bold; height: 80px; opacity: 0.8;}
.know-more a:hover { opacity: 1}
.new-banner-desc-area { position: relative;}
.main-video:before {
  content: "";
  width: 100%;
  display: block;
  height: 100%;
  background: #473180;
  background: -moz-linear-gradient(-45deg, #473180 0%, #473180 27%, #803f80 46%, #c84356 65%, #df8035 89%, #df8035 100%);
  background: -webkit-linear-gradient(-45deg, #473180 0%,#473180 27%,#803f80 46%,#c84356 65%,#df8035 89%,#df8035 100%);
  background: linear-gradient(135deg, #473180 0%,#473180 27%,#803f80 46%,#c84356 65%,#df8035 89%,#df8035 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#473180', endColorstr='#df8035',GradientType=1 );
  position: absolute;
  opacity: 0.5;
}


@media screen and (max-width: 39.9375em) {
  .topbar-responsive .menu a { padding: 0.875rem 0; }
}

@media(max-width: 1024px) {
  .floating-form { width: 60%; }
}

@media screen and (max-width: 39.9375em) {
  .topbar-responsive .menu .topbar-responsive-button { width: 100%; margin: 0.875rem 0; }
}

@media screen and (max-width: 39.9375em) {
  .topbar-responsive .top-bar-title { position: relative; width: 100%; }
  .topbar-responsive .top-bar-title span { position: absolute; right: 0; border: 1px solid #fefefe; border-radius: 5px; padding: 0.25rem 0.45rem; top: 45%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); }
  .topbar-responsive .top-bar-title span .menu-icon { margin-bottom: 4px; }
}

@media screen and (max-width: 860px){
  .top-bar-right { flex: 0 0 auto; }
}


@media screen and (max-width: 1300px){
  .topbar-responsive .menu a { color: #fefefe; transition: color 0.15s ease-in; font-size: 0.8em; margin: 0 0.3em; text-transform: uppercase; font-weight: bold; }
  .expnd-content-inner p { font-size: 0.8rem; }
}


@media screen and (max-width: 860px){
  body { overflow: auto; }
  .top-bar-right.social-mobile { display: block; background-color: #000; }
  .page-content { flex: none; overflow: hidden; }
  p.copyright { float: left; width: 100%; }
  footer p { font-size: 0.8em; line-height: 2; }
  [type='text'], [type='password'], [type='date'], [type='datetime'], [type='datetime-local'], [type='month'], [type='week'], [type='email'], [type='number'], [type='search'], [type='tel'], [type='time'], [type='url'], [type='color'], textarea {
    border: 0; border-bottom: 1px solid #cacaca; box-shadow: none; color: rgba(0,0,0,0.8);  width: 100%; margin: auto 0 1rem; font-size: 3vw; text-align: center }
    input#message { font-size: 3vw;}
    .holding-list { height: 100%; }
  }


  /* =========== Our Company ==================== */
  .contact-title, .career-title, .about-us-title, .our-bussiness-title { text-align: center;  font-size: 14px; padding-top: 2em;}
  .contact-title h1, .career-title h1, .about-us-title h1, .our-bussiness-title h1{ font-size: 25px; font-weight: bold; letter-spacing: 2px; text-transform: uppercase; margin-bottom: 0.2rem;}
  .our-bussiness-content { padding-top: 1em; }
  .company-intro { text-align: left;}
  .comp-logo img { width: 150px;}
  .categories-company p { text-align: center; font-size: 18px;}
  .about-us-content hr { max-width: 80%; }
  .strips { min-height: 50vh; text-align: center; color: white; position: relative; margin-top: 2em; }
  .strips__strip { will-change: width, left, z-index, height; position: absolute; width: 25%; height: 300px; overflow: hidden; cursor: pointer; -webkit-transition: all 0.6s cubic-bezier(0.23, 1, 0.32, 1); transition: all 0.6s cubic-bezier(0.23, 1, 0.32, 1); }
  .strips__strip:nth-child(1) {left: 0;}
  .strips__strip:nth-child(2) {left: 25%;}
  .strips__strip:nth-child(3) { left: 50%;}
  .strips__strip:nth-child(4) { left: 75%;}
  article.strips__strip.strips__strip--expanded .strip__content { background-image: none; margin: 0; }
  .strips__strip:nth-child(1).strips__strip--expanded .strip__content { background-color: #ffc517; }
  .strips__strip:nth-child(2).strips__strip--expanded .strip__content { background-color: #e13553; }
  .strips__strip:nth-child(3).strips__strip--expanded .strip__content { background-color: #8b3f98; }
  .strips__strip:nth-child(4).strips__strip--expanded .strip__content { background-color: #472f91; }
  .strips__strip:nth-child(1) .strip__content { background-image: url('../img/mediabg.jpg'); -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); -webkit-animation-name: strip1; animation-name: strip1; -webkit-animation-delay: 0.1s; animation-delay: 0.1s; margin-left: 0;}
  .strips__strip:nth-child(2) .strip__content { background-image: url('../img/marketing.jpg'); -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); -webkit-animation-name: strip2; animation-name: strip2; -webkit-animation-delay: 0.2s; animation-delay: 0.2s; }
  .strips__strip:nth-child(3) .strip__content { background-image: url('../img/picture.jpg'); -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); -webkit-animation-name: strip3; animation-name: strip3; -webkit-animation-delay: 0.3s; animation-delay: 0.3s; }
  .strips__strip:nth-child(4) .strip__content { background-image: url('../img/tech.jpg'); -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); -webkit-animation-name: strip2; animation-name: strip2; -webkit-animation-delay: 0.2s; animation-delay: 0.2s; }

  .bussiness-info { padding: 0 3em; }

  @media screen and (max-width: 760px) {
    .contact-title, .career-title, .about-us-title, .our-bussiness-title { padding-top: 0em;}
    .strips { min-height: 200vh; }
    .strips__strip { height: 200px; }
    .strips__strip:nth-child(1) { top: 0; left: 0; width: 100%; }
    .strips__strip:nth-child(2) { top: 40vh ; left: 0; width: 100%; }
    .strips__strip:nth-child(3) { top: 80vh; left: 0; width: 100%; }
    .strips__strip:nth-child(4) { top: 120vh; left: 0; width: 100%; }
  }
  .strips .strip__content { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1); animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1); -webkit-animation-fill-mode: both; animation-fill-mode: both; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; position: absolute; top: 0; left: 0; width: 100%; height: 100%; text-decoration: none; margin: 0 2%; background-size: cover; background-position: 50%; }
  .strips .strip__content:hover:before { -webkit-transform: skew(-30deg) scale(3) translate(0, 0); transform: skew(-30deg) scale(3) translate(0, 0); opacity: 0.1; }
  .strips .strip__content:before { content: ""; position: absolute; z-index: 1; top: 0; left: 0; width: 100%; height: 100%; background: white; opacity: 0.05; -webkit-transform-origin: center center; transform-origin: center center; -webkit-transform: skew(-30deg) scaleY(1) translate(0, 0); transform: skew(-30deg) scaleY(1) translate(0, 0); -webkit-transition: all 0.6s cubic-bezier(0.23, 1, 0.32, 1); transition: all 0.6s cubic-bezier(0.23, 1, 0.32, 1); }
  .strips .strip__inner-text { will-change: transform, opacity; position: absolute; z-index: 5; top: 50%; left: 50%; width: 70%; -webkit-transform: translate(-50%, -50%) scale(0.5); transform: translate(-50%, -50%) scale(0.5); opacity: 0; -webkit-transition: all 0.6s cubic-bezier(0.23, 1, 0.32, 1); transition: all 0.6s cubic-bezier(0.23, 1, 0.32, 1); }
  .strips__strip--expanded { width: 100%; top: 0 !important; left: 0 !important; z-index: 3; cursor: default; height: 400px; max-height: 100%; }
  @media screen and (max-width: 760px) {
    .strips__strip--expanded { min-height: 100vh; height: 100%;}
  }
  .strips__strip--expanded .strip__content:hover:before { -webkit-transform: skew(-30deg) scale(1) translate(0, 0); transform: skew(-30deg) scale(1) translate(0, 0); opacity: 0.05;}
  .strips__strip--expanded .strip__title { opacity: 0;}
  .strips__strip--expanded .strip__inner-text { opacity: 1; -webkit-transform: translate(-50%, -50%) scale(1); transform: translate(-50%, -50%) scale(1); }

  .strip__title { display: block; margin: 0; position: relative; z-index: 2; width: 100%; font-size: 2.5vw; text-transform: uppercase; color: white; -webkit-transition: all 0.6s cubic-bezier(0.23, 1, 0.32, 1); transition: all 0.6s cubic-bezier(0.23, 1, 0.32, 1); }
  .strip__content:after { content: ""; background-color: rgba(0,0,0,0.3); width: 100%; height: 100%; position: absolute; left: 0; right: 0; }
  .strips__strip:nth-child(1).strips__strip--expanded .strip__content:after { content: ""; background-color: rgba(0,0,0,0.1); width: 100%; height: 100%; position: absolute; left: 0; right: 0; }
  .strip__inner-text a { color: #fff; text-transform: uppercase; border: 2px solid #fff; padding: 0.5em; margin-top: 2%;}
  .strip__inner-text a:hover { background-color: rgba(0,0,0,0.3); }
  .strip__inner-text p { margin-bottom: 2em; }
  .strips__strip--expanded .overlay { display: none}
  /* .strips__strip .overlay:after { content:""; transition: all 0.2s ease-in-out; width: 0px; font-weight: normal; font-size: 18px; color: #fff; position: absolute; right: 0; bottom: 0; border-left: transparent 40px solid; border-top: transparent 40px solid; border-right: #000 40px solid; border-bottom: #000 40px solid; z-index: 2;}
  .strips__strip .overlay:before { position: absolute; height: 0px; content: "\f067"; font-family: FontAwesome; font-style: normal; left: 91%; bottom: 0; top: 91%; z-index: 3; } */
  .strip__title::before { content: ""; background-image: url(../img/holding-icon.png); display: inline-block; top: 0; z-index: 3; vertical-align: sub; width: 30px; background-size: contain; background-repeat: no-repeat; height: 50px; }

  @media screen and (max-width: 760px) and (orientation: landscape){
    .strips { min-height: 300vh; }
    .strips__strip { height: 200px; }
    .strips__strip:nth-child(2) { top: 62vh; }
    .strips__strip:nth-child(3) { top: 125vh; }
    .strips__strip:nth-child(4) { top: 185vh; }
    .strips .strip__content { background-size: cover; background-position: 50%; }
  }

  @media screen and (max-width: 760px) {
    .strip__title { font-size: 28px; }
    .company-intro { margin-top: 2em; text-align: center; }
    .core-value h3:before, .mission-wrap h3:before, .vision-wrap h3:before { content: ""; height: 35px; vertical-align: middle; float: none; }
  }

  .strip__close { position: absolute; right: 3vw; top: 3vw; opacity: 0; z-index: 10; -webkit-transition: all 0.6s cubic-bezier(0.23, 1, 0.32, 1); transition: all 0.6s cubic-bezier(0.23, 1, 0.32, 1); cursor: pointer; -webkit-transition-delay: 0.5s; transition-delay: 0.5s; }
  .strip__close--show { opacity: 1; }

  /* ==================== Career Page ========================= */
  li.accordion-item img { width: 30px; height: auto; margin-right: 10px;}
  .accordion-title { color: #000; font-weight: 600; font-size: 15px; letter-spacing: 2px; }
  .accordion-content .description { font-weight: bold;}

  .file-uploader { display: block; margin-bottom: 10px; width: 80%; border-radius: 10px; border: 2px solid #000; overflow: hidden;}
  .file-btn {display: inline-block; height: 100%;}
  .file-btn label.button { margin: 0; background-color: #000; color: #fff; padding: 0.85em 3em;height: 100%;}
  .uploadfile-name { display: inline-block; vertical-align: middle; margin-left: 5%;}
  .file-uploader.row { border: 2px solid #000;  width: 83%; border-radius: 10px; margin-left: 0px;}
  .accordion-title:hover,.accordion-title:focus { color: #444444; }
  .thank-you { border: 3px solid #50b640; color: #50b640; padding: 0.5em; width: 90%; border-radius: 10px; margin: 0 auto;}
  #msg-div{ display: none;}

.intern-form [type='text'],.intern-form [type='password'], .intern-form [type='date'], .intern-form [type='datetime'], .intern-form [type='datetime-local'], .intern-form [type='month'], .intern-form [type='week'], .intern-form [type='email'], .intern-form [type='number'], .intern-form [type='search'], .intern-form [type='tel'], .intern-form [type='time'], .intern-form [type='url'], .intern-form [type='color'], .intern-form textarea {
  margin: 0 0 0.5rem;
}
.intern-form table tbody tr:nth-child(even) { background-color: transparent; }
.available-period input { width: 15%; display: inline-block;}
.contribute-checkbox { margin-right: 10px; }
.intern-form input::placeholder { font-size: 16px; }
.error { color: red;}
  /* ========= CONTACT US ============== */
  .grid-container.contact-detail, .grid-container.career-detail { max-width: 80em; text-align: left; margin: 0 auto; min-height: 80vh; }
  .enquiryform, .careerform { margin: 5% auto;  overflow: hidden; }
  [type='text'], [type='password'], [type='date'], [type='datetime'], [type='datetime-local'], [type='month'], [type='week'], [type='email'], [type='number'], [type='search'], [type='tel'], [type='time'], [type='url'], [type='color'], textarea {
    border: 0;
    border-bottom: 1px solid #cacaca;
    box-shadow: none;
    color: rgba(0,0,0,0.8);
    width: 80%;
    margin: 0 0 3rem;
  }
  input#message { border: 0; border-bottom: 1px solid #cacaca; box-shadow: none; color: rgba(0,0,0,0.8); width: 80%; height: 2.4375rem; margin: 0 0 3rem; padding: 0.5rem;}
  input.button { background-color: #000; padding: 0.8rem 1.8rem; text-transform: uppercase; border: 1px solid #000;}
  .button:focus, input.button:hover { background-color: #ffff; color: #000; border: 1px solid #000; }
  .contact-detail iframe { max-width: 100%; }
  .contact-info { margin-bottom: 1rem; }
  .row.company-section { margin: 0;}
  .contact_map { text-align: center; }


  /* ===================== MEDIA QUERY ================================ */
  @media screen and (max-width: 1300px){
    .com-icon { width: 60px;}
  }

  @media screen and (max-width: 39.9375em) {
    .topbar-responsive .menu a { padding: 0.875rem 0; }
  }

  @media screen and (max-width: 39.9375em) {
    .topbar-responsive .menu .topbar-responsive-button { width: 100%; margin: 0.875rem 0; }
  }

  @media screen and (max-width: 39.9375em) {
    .topbar-responsive { padding: 0.75rem; }
    .topbar-responsive .top-bar-title { position: relative; width: 100%;}
    .topbar-responsive .top-bar-title span { position: absolute; right: 5%; border: 1px solid #fefefe; border-radius: 5px; padding: 0.25rem 0.45rem; top: 35%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); }
    .topbar-responsive .top-bar-title span .menu-icon { margin-bottom: 4px; }
  }

  @media screen and (max-width: 39.9375em) {
    .topbar-responsive-links { -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-duration: 0.5s; animation-duration: 0.5s; width: 100%; -webkit-animation: fadeIn 1s ease-in; animation: fadeIn 1s ease-in; }
  }
  @media screen and (max-width: 1200px){
    #topbar-responsive { margin-left: auto; display: block; }
    .slide-desc--top { top: 23%; width: 66%; }
    .row.holding-row img { width: 160px; margin: 2% 0%;}
    .company-section { line-height: 60px; }
    .holding-list { height: 60px; }
  }

  @media screen and (max-width:1023px) and (orientation: portrait){
    .simple.vertical.medium-horizontal.dropdown.menu { background-color: #000; width: 100%; }
    .simple.vertical.medium-horizontal.dropdown.menu li { width: 100%; }
  }

  @media screen and (max-width:1200px) and (orientation: portrait){
    .menu-icon { margin-left: 2%; }
    .about-content, .contact-content { padding-top: 18%; }
  }


  @media print, screen and (min-width: 40em){
    .top-bar { -ms-flex-wrap: wrap; flex-wrap: wrap; flex-direction: row; justify-content: flex-start; }
    .dropdown.menu.medium-horizontal > li.is-dropdown-submenu-parent > a::after {
      display: block;
      width: 0;
      height: 0;
      border: inset 6px;
      content: '\f067';
      font-size: 0.5em;
      font-family: FontAwesome;
      border: 0;
      right: 10px;
      left: auto;
      margin-top: -3px;
    }
    .row.holding-row img { margin: 0; max-width: 100%; }
  }


  @media screen and (max-width: 568px) and (orientation: landscape) {
    .slide-desc { top: 40%; }
    .slide-desc-wrap { padding: 1em; }
    .slide-desc { top: 68%; }
    .company-section { min-height: 105px;}
    .slide-desc--top { top: 24%; left: 6%;  width: 100%;}
    .slide-desc h2, .slide-desc--top h2 { font-size: 1.0rem;  }
    .company-section { line-height: 30px; }
  }

  @media screen and (max-width: 1300px){
    a.topbar-responsive-logo img { width: 160px;}
    .topbar-responsive .menu a { color: #000; transition: color 0.15s ease-in; font-size: 0.8em; margin: 0 0.3em; text-transform: uppercase; font-weight: bold;}
    .company-section { border: 0.5px solid #000; min-height: 100%; height: 100%;}
    .direct-btn a { border: 3px solid #000; padding: 5px 9px; margin: 3% 0%; }
    .direct-btn { text-align: center; line-height: 60px; }
    .contact-info { margin-bottom: 0rem; font-size: 100%; font-size: 1vw; }
    [type='text'], [type='password'], [type='date'], [type='datetime'], [type='datetime-local'], [type='month'], [type='week'], [type='email'], [type='number'], [type='search'], [type='tel'], [type='time'], [type='url'], [type='color'], textarea {
      border: 0;
      border-bottom: 1px solid #cacaca;
      box-shadow: none;
      color: rgba(0,0,0,0.8);
      width: 100%;
      margin: 0px 0 1rem;
      font-size: 1vw;
    }

    input#message { border: 0; border-bottom: 1px solid #cacaca; box-shadow: none; color: rgba(0,0,0,0.8); width: 100%; height: 2.4375rem; margin: 0 0 1rem; padding: 0.5rem; }
    .know-more{min-height:auto;}
    .right-skew:before { content: ''; position: absolute; -webkit-transform: skew(-6deg); -ms-transform: skew(-6deg); transform: skew(-6deg); }
    .career-content, .contact-content{ width: 100%; }
    .our-bussiness-content{ max-height: 100%; margin: 0 0% 0 0%;  width: 100%; }
    .slide-desc { margin: 0; }

  }


  @media screen and (max-width: 860px) {
    .banner-desc-area { top: auto; width: 100%; bottom: 7%; }
    .topbar-responsive { padding: 0; }
    .about-content, .contact-content, .about-us-content { padding-top: 5%; }
    .top-bar-right { flex: 0 0 auto; }
    .social-links li { color: #fff; padding: 0; font-size: 20px; margin-right: 19px; text-align: center; }
    .menu.simple li + li { margin-left: 0rem; }

    /* Banner */
    .owl-next { left: 85%; }
    .owl-prev {left: 5%;}

    /* Navigation */
    .topbar-responsive { padding: 0; position: relative;}
    .topbar-responsive .social-links li { width: 15%; border: 0; }
    .top-bar-right.social-mobile { display: block; background-color: #fff;}
    .dropdown.menu.vertical > li .is-dropdown-submenu { position: relative; text-align: center; background: transparent;}
    .topbar-responsive .menu { padding-left: 10px; padding-right: 10px;}
    #topbar-responsive {  position: absolute; height: 500px; z-index: 9999; top: 100%; overflow: auto; bottom: 0; left: 0; right: 0;}
    .slide-desc--top { top: 15%; left: 5%; width: 100%; }
    .slide-desc-wrap { padding: 1.4em; }
    .slide-desc { top: 33%; width: 80%; }

    /* footer */
    footer { position: relative; top: 0; width: 100%; background-color: #fff; text-align: center; overflow: hidden;}
    footer p { font-size: 0.8em; line-height: 2; }
    .topbar-responsive li { width: 100%; text-align: center; border-bottom: 2px solid rgba(255,255,255,0.2); padding: 3px; }
    .top-bar-title { margin-left: 0; width: 100%;}
    .direct-btn a { padding: 0px 4px;  margin: 3% 0%; }
    .com-logo { padding: 0% 7%;}
    .company-section { border: 0.5px solid #000; min-height: 100%;}
    .expnd-content-outer { position: relative;}
    .holding-list .columns { float: none; }
    .direct-btn { line-height: 50px; }
    .menu-icon { margin-left: 2%; }
    .dropdown.menu.medium-horizontal > li.is-dropdown-submenu-parent > a::after { content: '\f067'; font-size: 0.5em; font-family: FontAwesome; border: 0; right: 0;  color: #fff; left: auto; }
    .grid-container.contact-detail { max-width: 43em; text-align: left; margin: 0 auto; overflow: hidden; }
    .contact-info { font-size: 3vw; }
    [type='text'], [type='password'], [type='date'], [type='datetime'], [type='datetime-local'], [type='month'], [type='week'], [type='email'], [type='number'], [type='search'], [type='tel'], [type='time'], [type='url'], [type='color'], textarea {
      border: 0; border-bottom: 1px solid #cacaca; box-shadow: none; color: rgba(0,0,0,0.8);  width: 100%; margin: auto 0 1rem; font-size: 3vw; text-align: center }
      input#message { font-size: 3vw; text-align: center;}
      p.copyright {float: left; width: 100%; }
      .privacypolicy { float: left ;width: 100%; color: #000; }
      input.button { text-align: center; margin: 0 auto; }
      .direct-btn a { border: 1.5px solid #000; margin: 3% 0%; }
      .direct-btn a:before { font-size: 11px; }
      .about-content, .contact-content, .career-content{  margin: 0 auto; }
      .accordion-title { font-size: 15px; padding: 1.25rem 2rem;}
      .media-wrap { overflow: auto; position: relative;  max-height: 100%; display: inline;}
      .right-skew:before { content: '';  position: absolute; display:none }
      .about-content, .contact-content, .career-content { width: 100%;  height: 100%;}
      .topbar-responsive { height: 100%; }
      .main-banner .slick-slide { height: initial; }

      /* upload file */
      .file-uploader {  width: 100%; }
      .file-uploader.row { border: 2px solid #000; width: 100%; border-radius: 10px; margin: 0 auto; margin-bottom: 10px;}
      .file-btn { width: 100%; }
      .file-btn label.button{ width: 100%;}
      .upload-note p { text-align: center}
      .input-group-button { width: 100%; }
      #pagepiling { height: 100%; min-height: 90vh; width: 100%; margin-left: auto; }
      .grid-sizer, .grid-item { width: 33.33%;}
      .grid.popup-gallery { margin-left: 0;}
      .contact-wrap, .career-wrap { position: relative; max-height: unset; height: 100%; }
      .about-content, .contact-content, .career-content { width: 100%; height: 100%; overflow: auto; position: relative; max-height: unset; }
      .owl-carousel .owl-stage-outer { overflow-y: hidden; }
      .banner-slider {overflow: auto; min-height: 100vh; height: 100%;}
      .modal-cs { height: 70vh; }
      #main-content { overflow: auto; height: 100%; min-height: auto;}
      .top-bar .accordion-menu .nested.is-accordion-submenu { background: rgba(255,255,255,0.8); color: #000; padding: 0; margin-left: 0; margin-right: 0; }
      .gallery-list { width: 100%; min-height: 200vh; height: 100%;  }
      .gallery-title h3 { width: 30%; }
      .career-content, .contact-content, .about-us-content, .our-brands-content { width: 100%; max-height: 100%; height: 100%; overflow: hidden;}
      .strips .strip__content{ margin: 0;}
      .slider-home.item.lazyOwl { min-height: 100vh; }
      .thank-you { border: 3px solid #50b640; color: #50b640; padding: 0.5em; width: 100%; border-radius: 10px; }
      [type='text'], [type='password'], [type='date'], [type='datetime'], [type='datetime-local'], [type='month'], [type='week'], [type='email'], [type='number'], [type='search'], [type='tel'], [type='time'], [type='url'], [type='color'], textarea { text-align: center }
      ul.menu.social-links { width: 15%; margin: auto; }
      .core-value h3 { text-align: center; }
      .mission-wrap { text-align: center; margin-top: 2em; }
      .vision-wrap { text-align: center; margin-top: 2em; }

      /* Our Business */
      .strips__strip .overlay:before { left: 90%; top: 85%; }
      #media-comp .expnd-content-outer { background: #f58522; }
      #marketing-comp .expnd-content-outer { background: #e23553; }
      #picture-comp .expnd-content-outer { background: #6e2b88; }
      #technology-comp .expnd-content-outer { background: #472f91; }
      .expnd-content-inner { position: relative; height: 100%;}
      .expnd-content-inner .desc { height: auto; }
      .bussiness-info { padding: 0 1em; }
      .our-bussiness-wrap { padding-top: 2em; }
      .pop-overlay { display: none}
      .deeplus-holding-logo-wrap img {margin-top: 20px; }
      #about-tabs { padding: 0 5em; text-align: center;}
      #about-tabs .tabs-title>a[aria-selected=true]:before { content: ""; border-left: 0; border-bottom: 3px solid #44539f;}
      #about-tabs .tabs-title>a { padding: 0.5em 0em;}
      #about-tabs .tabs-title>a:focus, #about-tabs .tabs-title>a[aria-selected=true] { background-color: #44539f; color: #fff; }
    }

    @media screen and (max-width: 860px) and (orientation: landscape) {
      .slide-desc { top: 65%; width: 61%; }
      .social-mobile { display: none}
      .slide-desc h2, .slide-desc--top h2 { font-size: 1.5rem; }
      .slide-desc--top { top: 28%; left: 6%; width: 100%; }
      .slide-desc { top: 51%; width: 61%; }
      .topbar-responsive li { width: 100%; text-align: center; padding: 3px; }
      #topbar-responsive { flex: auto; }
      .company-section { border: 0.5px solid #000; min-height: 100%;}
      .simple.vertical.medium-horizontal.dropdown.menu { background-color: #fff; }
      .accordion-menu .is-accordion-submenu-parent:not(.has-submenu-toggle) > a::after { content: '\f067'; font-size: 0.5em; font-family: FontAwesome; border: 0; right: 40%;}
      .direct-btn { line-height: 40px; }
      .row.holding-row img {width: 150px; margin: 2% 0%; }
      .file-uploader { width: 50%;  margin: 1% auto; }
      .dropdown.menu.medium-horizontal > li.is-dropdown-submenu-parent > a::after { right: 0; left: auto; margin-left: 0; }
      .file-uploader.row { width: 50%; }
      .holding-list { height: 59px; }
      .slider-home { min-height: 200vh; }
      .slide-desc-wrap { padding: 0.4em; }
      .marketing-brands img { margin-right: 0; }
      .career-content, .contact-content, .about-us-content, .our-brands-content { overflow: auto; }
      .know-more { min-height: auto; }
      #cs-notice { min-height: 80vh; height: auto; text-align: center; }
      .strips__strip .overlay:before { left: 95%; }
      ul.menu.social-links { width: 20%; margin: auto; }
    }

    @media screen and (max-width: 860px){
      .top-bar-title { margin-left: 0; width: 100%; }
      .topbar-responsive { height: 100%; }
      #topbar-responsive { position: absolute; height: 500px; z-index: 9999; top: 100%; overflow: auto; bottom: 0; left: 0; right: 0; }
      .row, .top { max-width: 100%; }
      .floating-form { max-width: 90%; width: 90%; height: 600px; padding: 5px; top: 25%; }
      #dlform_body .submit-wrap input { width: 60%;}
      .topbar-responsive .menu a { color: #000; }
    }

    @media screen and (max-width: 860px) and (orientation: portrait){
      .direct-hidden-small { display: none;}
      .marketing-brands img { margin-right: 0; margin-bottom: 2em; }
    }

    @media screen and (max-width: 860px) and (orientation: landscape){
      .slider-home.item.lazyOwl { min-height: 200vh;}
      .floating-form-heading { font-size: 1.2rem; }
      .form-group  {float: left; width: 50%; }
      .floating-form { height: 400px; max-width: 90%; width: 90%; padding-top: 5px; top: 25%; }
      .contact-opener { top: 32%; }
      .submit-wrap { width: 100%; }
      #dlform_body .submit-wrap input { width: 100%; }
      .holding-list .columns { width: 100%; }
    }

    @media screen and (max-width: 640px){
      .topbar-responsive .menu { background: rgba(0,0,0,0.8); }
      .slick-slide { height: 100vh; }
    }

    @media screen and (max-width: 640px) {
      .topbar-responsive { position: relative; }
      .topbar-responsive li { width: 80%; text-align: center; border-bottom: 2px solid rgba(255,255,255,0.2); padding: 3px; }
      .topbar-responsive .menu { background: rgba(255,255,255,0.8); }
      a.topbar-responsive-logo img { width: 180px;}
    }

    @media screen and (max-width: 860px) and (orientation: portrait){
      .direct-hidden-small { display: none;}
      .marketing-brands img { margin-right: 0; margin-bottom: 2em; }
    }

    @media screen and (max-width: 580px) {
      .slide-desc { top: 56%; width: 90%; }
      ul.menu.social-links { width: 25%; margin: auto; }
    }


    @media screen and (max-width: 400px){
      .slide-desc--top { top: 5%; left: 5%; width: 100%; }
      .modal-cs { height: 72vh; }
      .file-btn { width: 100%; }
      .file-btn label.button{ width: 100%;}
    }


    /* ======================= Media Animation =================================== */
    @-webkit-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
    @-moz-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
    @keyframes fadeIn { from { opacity:0; } to { opacity:1; } }

    .fadeIn {
      opacity:0;  /* make things invisible upon start */
      -webkit-animation:fadeIn ease-in 1;  /* call our keyframe named fadeIn, use animattion ease-in and repeat it only 1 time */
      -moz-animation:fadeIn ease-in 1;
      animation:fadeIn ease-in 1;

      -webkit-animation-fill-mode:forwards;  /* this makes sure that after animation is done we remain at the last keyframe value (opacity: 1)*/
      -moz-animation-fill-mode:forwards;
      animation-fill-mode:forwards;

      -webkit-animation-duration:1s;
      -moz-animation-duration:1s;
      animation-duration:1s;
      -webkit-animation-delay: 0.5s;
      -moz-animation-delay: 0.5s;
      animation-delay: 0.5s;
    }



    @-webkit-keyframes strip1 {
      0% {
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
      }
      100% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
      }
    }

    @keyframes strip1 {
      0% {
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
      }
      100% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
      }
    }
    @-webkit-keyframes strip2 {
      0% {
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
      }
      100% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
      }
    }
    @keyframes strip2 {
      0% {
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
      }
      100% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
      }
    }
    @-webkit-keyframes strip3 {
      0% {
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0);
      }
      100% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
      }
    }
    @keyframes strip3 {
      0% {
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0);
      }
      100% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
      }
    }
    @-webkit-keyframes strip4 {
      0% {
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
      }
      100% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
      }
    }
    @keyframes strip4 {
      0% {
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
      }
      100% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
      }
    }
    @-webkit-keyframes strip5 {
      0% {
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0);
      }
      100% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
      }
    }
    @keyframes strip5 {
      0% {
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0);
      }
      100% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
      }
    }

    /* ===================== Animation ============================= */
    @-webkit-keyframes after {
      0% {
        width: 0;
        height: 2px;
      }
      75% {
        width: calc(100% + 2px);
        height: 2px;
      }
      100% {
        height: calc(100% + 2px);
        width: calc(100% + 2px);
      }
    }

    @keyframes after {
      0% {
        width: 0;
        height: 2px;
      }
      75% {
        width: calc(100% + 2px);
        height: 2px;
      }
      100% {
        height: calc(100% + 2px);
        width: calc(100% + 2px);
      }
    }
    @-webkit-keyframes before {
      0% {
        width: 0;
        height: 2px;
      }
      75% {
        width: calc(100% + 4px);
        height: 2px;
      }
      100% {
        height: calc(100% + 4px);
        width: calc(100% + 4px);
      }
    }
    @keyframes before {
      0% {
        width: 0;
        height: 2px;
      }
      75% {
        width: calc(100% + 4px);
        height: 2px;
      }
      100% {
        height: calc(100% + 4px);
        width: calc(100% + 4px);
      }
    }

    @-webkit-keyframes fadeIn {
      from {
        opacity: 0;
      }
      to {
        opacity: 1;
      }
    }

    @keyframes fadeIn {
      from {
        opacity: 0;
      }
      to {
        opacity: 1;
      }
    }

    @-webkit-keyframes slideDown {
      0% {
        -webkit-transform: translateY(-100%);
        transform: translateY(-100%);
      }
      100% {
        -webkit-transform: translateY(0%);
        transform: translateY(0%);
      }
    }

    @keyframes slideDown {
      0% {
        -webkit-transform: translateY(-100%);
        transform: translateY(-100%);
      }
      100% {
        -webkit-transform: translateY(0%);
        transform: translateY(0%);
      }
    }


    @keyframes showTab{
      from {opacity: 0; top: 5px}
      to {opacity: 1; top: 0;}
    }