/*
Theme Name: V2 Technosys Modern
Theme URI: https://www.v2technosys.com/
Description: Custom theme for V2 Technosys hosting and services. Built on Bootstrap 3, jQuery, FontAwesome 6.
Author: V2 Technosys
Author URI: https://www.v2technosys.com/
Version: 1.2.260608-1642
*/

/* ==========================================================================
   v2-modern FOUNDATION TOKENS (Phase 1.A)
   Declared for use across all future modern CSS. No active rules here.
   ========================================================================== */
:root {
  /* Primary brand: orange */
  --brand-orange:        #f76605;
  --brand-orange-dark:   #f26402;
  --brand-orange-light:  #f98131;
  --brand-orange-bright: #f67620;
  --brand-orange-deep:   #fd6905;

  /* Secondary brand: blue/navy */
  --brand-navy:          #121a37;
  --brand-blue:          #023575;
  --brand-blue-mid:      #36498c;
  --brand-blue-light:    #418ac2;
  --brand-blue-pale:     #dceff9;

  /* Neutrals: text */
  --text-darkest:        #000;
  --text-dark:           #222;
  --text-medium:         #333;
  --text-mid:            #4e4a49;
  --text-light:          #777;
  --text-light-gray:     #888;
  --text-muted:          #a6a6b3;

  /* Neutrals: backgrounds & borders */
  --bg-white:            #fff;
  --bg-offwhite:         #f9f9f9;
  --bg-very-light:       #f2f2ff;
  --border-soft:         #ddd;
  --border-medium:       #ccc;

  /* Semantic */
  --success:             #27ae60;

  /* Effects */
  --shadow-soft:         rgba(0, 0, 0, 0.1);
  --shadow-medium:       rgba(0, 0, 0, 0.7);
  --shadow-strong:       rgba(0, 0, 0, 0.8);
  --overlay-orange-30:   rgba(244, 101, 1, 0.3);
  --overlay-orange-50:   rgba(244, 101, 1, 0.5);

  /* Layout */
  --container-max-sm:    750px;
  --container-max-md:    970px;
  --container-max-lg:    1170px;
  --container-padding:   15px;
  --grid-gutter:         30px;

  /* Breakpoints (reference) */
  --bp-sm:               768px;
  --bp-md:               992px;
  --bp-lg:               1200px;
}



/* ==========================================================================
   v2-modern GRID SYSTEM (Phase 1.B)
   Flexbox-based replacement for Bootstrap 3 grid.
   Same class names (container/row/col-*) - HTML markup unchanged.
   ========================================================================== */

.container,
.container-fluid {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--container-padding);
  padding-right: var(--container-padding);
  box-sizing: border-box;
}
.container { max-width: 100%; }
@media (min-width: 768px)  { .container { max-width: var(--container-max-sm); } }
@media (min-width: 992px)  { .container { max-width: var(--container-max-md); } }
@media (min-width: 1200px) { .container { max-width: var(--container-max-lg); } }

.row {
  display: flex;
  flex-wrap: wrap;
  margin-left: calc(var(--grid-gutter) / -2);
  margin-right: calc(var(--grid-gutter) / -2);
}
.row::after { content: ""; display: table; clear: both; }

[class*="col-xs-"],
[class*="col-sm-"],
[class*="col-md-"],
[class*="col-lg-"] {
  position: relative;
  width: 100%;
  min-height: 1px;
  padding-left: calc(var(--grid-gutter) / 2);
  padding-right: calc(var(--grid-gutter) / 2);
  box-sizing: border-box;
}

.col-xs-1  { flex: 0 0 8.333333%; max-width: 8.333333%; }
.col-xs-2  { flex: 0 0 16.666667%; max-width: 16.666667%; }
.col-xs-3  { flex: 0 0 25.0%; max-width: 25.0%; }
.col-xs-4  { flex: 0 0 33.333333%; max-width: 33.333333%; }
.col-xs-5  { flex: 0 0 41.666667%; max-width: 41.666667%; }
.col-xs-6  { flex: 0 0 50.0%; max-width: 50.0%; }
.col-xs-7  { flex: 0 0 58.333333%; max-width: 58.333333%; }
.col-xs-8  { flex: 0 0 66.666667%; max-width: 66.666667%; }
.col-xs-9  { flex: 0 0 75.0%; max-width: 75.0%; }
.col-xs-10 { flex: 0 0 83.333333%; max-width: 83.333333%; }
.col-xs-11 { flex: 0 0 91.666667%; max-width: 91.666667%; }
.col-xs-12 { flex: 0 0 100%; max-width: 100%; }

@media (min-width: 768px) {
.col-sm-1  { flex: 0 0 8.333333%; max-width: 8.333333%; }
.col-sm-2  { flex: 0 0 16.666667%; max-width: 16.666667%; }
.col-sm-3  { flex: 0 0 25.0%; max-width: 25.0%; }
.col-sm-4  { flex: 0 0 33.333333%; max-width: 33.333333%; }
.col-sm-5  { flex: 0 0 41.666667%; max-width: 41.666667%; }
.col-sm-6  { flex: 0 0 50.0%; max-width: 50.0%; }
.col-sm-7  { flex: 0 0 58.333333%; max-width: 58.333333%; }
.col-sm-8  { flex: 0 0 66.666667%; max-width: 66.666667%; }
.col-sm-9  { flex: 0 0 75.0%; max-width: 75.0%; }
.col-sm-10 { flex: 0 0 83.333333%; max-width: 83.333333%; }
.col-sm-11 { flex: 0 0 91.666667%; max-width: 91.666667%; }
.col-sm-12 { flex: 0 0 100%; max-width: 100%; }
}

@media (min-width: 992px) {
.col-md-1  { flex: 0 0 8.333333%; max-width: 8.333333%; }
.col-md-2  { flex: 0 0 16.666667%; max-width: 16.666667%; }
.col-md-3  { flex: 0 0 25.0%; max-width: 25.0%; }
.col-md-4  { flex: 0 0 33.333333%; max-width: 33.333333%; }
.col-md-5  { flex: 0 0 41.666667%; max-width: 41.666667%; }
.col-md-6  { flex: 0 0 50.0%; max-width: 50.0%; }
.col-md-7  { flex: 0 0 58.333333%; max-width: 58.333333%; }
.col-md-8  { flex: 0 0 66.666667%; max-width: 66.666667%; }
.col-md-9  { flex: 0 0 75.0%; max-width: 75.0%; }
.col-md-10 { flex: 0 0 83.333333%; max-width: 83.333333%; }
.col-md-11 { flex: 0 0 91.666667%; max-width: 91.666667%; }
.col-md-12 { flex: 0 0 100%; max-width: 100%; }
}

@media (min-width: 1200px) {
.col-lg-1  { flex: 0 0 8.333333%; max-width: 8.333333%; }
.col-lg-2  { flex: 0 0 16.666667%; max-width: 16.666667%; }
.col-lg-3  { flex: 0 0 25.0%; max-width: 25.0%; }
.col-lg-4  { flex: 0 0 33.333333%; max-width: 33.333333%; }
.col-lg-5  { flex: 0 0 41.666667%; max-width: 41.666667%; }
.col-lg-6  { flex: 0 0 50.0%; max-width: 50.0%; }
.col-lg-7  { flex: 0 0 58.333333%; max-width: 58.333333%; }
.col-lg-8  { flex: 0 0 66.666667%; max-width: 66.666667%; }
.col-lg-9  { flex: 0 0 75.0%; max-width: 75.0%; }
.col-lg-10 { flex: 0 0 83.333333%; max-width: 83.333333%; }
.col-lg-11 { flex: 0 0 91.666667%; max-width: 91.666667%; }
.col-lg-12 { flex: 0 0 100%; max-width: 100%; }
}

/* End v2-modern grid */

/* ==========================================================================
   v2-modern COMPONENTS (Phase 2)
   Bootstrap 3 component replacements - same class names, modern CSS.
   ========================================================================== */

/* === Panels (card style) === */
.panel {
  margin-bottom: 20px;
  background-color: var(--bg-white);
  border: 1px solid transparent;
  border-radius: 4px;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
}
.panel-default { border-color: var(--border-soft); }
.panel-heading {
  padding: 10px 15px;
  border-bottom: 1px solid transparent;
  border-top-left-radius: 3px;
  border-top-right-radius: 3px;
}
.panel-default > .panel-heading {
  color: var(--text-medium);
  background-color: #f5f5f5;
  border-color: var(--border-soft);
}
.panel-title { margin-top: 0; margin-bottom: 0; font-size: 16px; color: inherit; }
.panel-title > a, .panel-title > a:hover, .panel-title > a:focus { color: inherit; text-decoration: none; }
.panel-body { padding: 15px; }
.panel-group { margin-bottom: 20px; }
.panel-group .panel { margin-bottom: 0; border-radius: 4px; }
.panel-group .panel + .panel { margin-top: 5px; }
.panel-collapse > .panel-body { border-top: 1px solid var(--border-soft); }

/* === Buttons (base; .btn-read custom styling stays from legacy CSS) === */
.btn {
  display: inline-block;
  margin-bottom: 0;
  font-weight: 400;
  text-align: center;
  vertical-align: middle;
  touch-action: manipulation;
  cursor: pointer;
  background-image: none;
  border: 1px solid transparent;
  white-space: nowrap;
  padding: 6px 12px;
  font-size: 14px;
  line-height: 1.42857143;
  border-radius: 4px;
  user-select: none;
  text-decoration: none;
  transition: all 0.15s ease-in-out;
}
.btn:hover, .btn:focus, .btn.focus { text-decoration: none; outline: 0; }
.btn:active, .btn.active { background-image: none; outline: 0; box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125); }
.btn:disabled, .btn[disabled] { cursor: not-allowed; opacity: 0.65; box-shadow: none; }

/* === Forms === */
.form-control {
  display: block;
  width: 100%;
  height: 34px;
  padding: 6px 12px;
  font-size: 14px;
  line-height: 1.42857143;
  color: var(--text-mid);
  background-color: var(--bg-white);
  background-image: none;
  border: 1px solid var(--border-medium);
  border-radius: 4px;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
  box-sizing: border-box;
}
.form-control:focus {
  border-color: #66afe9;
  outline: 0;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6);
}
.form-control::placeholder { color: var(--text-light); opacity: 1; }
.form-control:disabled, .form-control[readonly] { background-color: var(--bg-offwhite); opacity: 1; }
.form-group { margin-bottom: 15px; }
.form-inline .form-group { display: inline-block; margin-bottom: 0; vertical-align: middle; }
.form-inline .form-control { display: inline-block; width: auto; vertical-align: middle; }

/* === Input Groups (flexbox-based) === */
.input-group { position: relative; display: flex; width: 100%; }
.input-group > .form-control { flex: 1 1 auto; width: 1%; margin-bottom: 0; }
.input-group-btn, .input-group-prepend { display: flex; align-items: stretch; white-space: nowrap; }
.input-group-btn:first-child > .btn,
.input-group-prepend:first-child > .btn { margin-right: -1px; border-top-right-radius: 0; border-bottom-right-radius: 0; }
.input-group-btn:last-child > .btn,
.input-group-prepend:last-child > .btn { margin-left: -1px; border-top-left-radius: 0; border-bottom-left-radius: 0; }

/* === Text Utilities === */
.text-left { text-align: left; }
.text-right { text-align: right; }
.text-center { text-align: center; }
.text-justify { text-align: justify; }
.text-nowrap { white-space: nowrap; }

/* === Collapse (basic; BS3 JS still handles toggle) === */
.collapse { display: none; }
.collapse.in { display: block; }
.collapsing { position: relative; height: 0; overflow: hidden; transition-property: height, visibility; transition-duration: 0.35s; transition-timing-function: ease; }

/* End v2-modern Phase 2 */

/* ==========================================================================
   v2-modern COMPONENTS PART 2 (Phase 3)
   breadcrumb, media object, pagination, thumbnail
   ========================================================================== */

/* === Breadcrumb === */
.breadcrumb {
  padding: 8px 15px;
  margin-bottom: 20px;
  list-style: none;
  background-color: var(--bg-offwhite);
  border-radius: 4px;
}
.breadcrumb > li { display: inline-block; }
.breadcrumb > li + li:before {
  content: "/\00a0";
  padding: 0 5px;
  color: var(--text-light);
}
.breadcrumb > .active { color: var(--text-light); }

/* === Media object === */
.media {
  display: flex;
  align-items: flex-start;
  margin-top: 15px;
}
.media:first-child { margin-top: 0; }
.media-left, .media-right, .media-body { display: block; }
.media-left { padding-right: 10px; }
.media-right { padding-left: 10px; }
.media-body { flex: 1 1 0%; overflow: hidden; }
.media-heading { margin-top: 0; margin-bottom: 5px; }

/* === Pagination === */
.pagination {
  display: inline-block;
  padding-left: 0;
  margin: 20px 0;
  border-radius: 4px;
}
.pagination > li { display: inline; }
.pagination > li > a,
.pagination > li > span {
  position: relative;
  float: left;
  padding: 6px 12px;
  margin-left: -1px;
  line-height: 1.42857143;
  color: var(--brand-blue);
  text-decoration: none;
  background-color: var(--bg-white);
  border: 1px solid var(--border-soft);
}
.pagination > li:first-child > a,
.pagination > li:first-child > span {
  margin-left: 0;
  border-top-left-radius: 4px;
  border-bottom-left-radius: 4px;
}
.pagination > li:last-child > a,
.pagination > li:last-child > span {
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
}
.pagination > li > a:hover,
.pagination > li > span:hover { background-color: var(--bg-offwhite); }
.pagination > .active > a,
.pagination > .active > span {
  z-index: 3;
  color: var(--bg-white);
  background-color: var(--brand-orange);
  border-color: var(--brand-orange);
  cursor: default;
}
.pagination > .disabled > a,
.pagination > .disabled > span { color: var(--text-light); cursor: not-allowed; }

/* === Thumbnail === */
.thumbnail {
  display: block;
  padding: 4px;
  margin-bottom: 20px;
  line-height: 1.42857143;
  background-color: var(--bg-white);
  border: 1px solid var(--border-soft);
  border-radius: 4px;
  transition: border 0.2s ease-in-out;
}
.thumbnail > img,
.thumbnail a > img {
  margin-right: auto;
  margin-left: auto;
  display: block;
  max-width: 100%;
  height: auto;
}
.thumbnail .caption { padding: 9px; color: var(--text-medium); }

/* End v2-modern Phase 3 */

/* ==========================================================================
   v2-modern NAV (Phase 4)
   .nav + .navbar-nav base styles. Custom .main-nav styling preserved from
   legacy style.css. Mobile menu JS still BS3-driven (Phase 5 will replace).
   ========================================================================== */

.nav {
  padding-left: 0;
  margin-bottom: 0;
  list-style: none;
}
.nav > li {
  position: relative;
  display: block;
}
.nav > li > a {
  position: relative;
  display: block;
  padding: 10px 15px;
  text-decoration: none;
}

.navbar-nav {
  margin: 0;
  padding-left: 0;
  list-style: none;
}
@media (min-width: 768px) {
  .navbar-nav {
    display: flex;
    flex-wrap: wrap;
  }
  .navbar-nav > li {
    display: block;
  }
}

/* End v2-modern Phase 4 */

/* ==========================================================================
   v2-modern FIXES (Phase 6) - Post-migration layout adjustments
   ========================================================================== */

/* Main nav fills row width (Flexbox .row defaults to content-sized children) */
#header .row > .main-nav,
#header .row > nav.main-nav {
  flex: 1 1 auto;
  width: 100%;
}

/* Container explicitly centered (defensive override) */
#header .container {
  margin-left: auto;
  margin-right: auto;
}

/* Absolute .nav-btn positioned relative to .container, not .row */
#header .row {
  position: static;
}

/* Enquire Now button stretches to match nav menu height exactly */
#header .nav-btn {
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  display: flex;
  align-items: stretch;
}

#header .nav-btn a {
  display: flex;
  align-items: center;
  padding: 0 35px;
  line-height: 1.2;
}

/* End v2-modern Phase 6 */

html{scroll-behavior:smooth}.bold{font-weight:700}.italic{font-style:italic}.underline{text-decoration:underline}.line{text-decoration:line-through}.justify{text-align:justify}.left{text-align:left}.right{text-align:right}.center{text-align:center}.b0{bottom:0}.b5{bottom:5px}.t0{top:0}.t5{top:5px}.t-30{top:-30px}.l0{left:0}.l5{left:5px}.r0{right:0}.r5{right:5px}.absolute{position:absolute}.relative{position:relative}.block{display:block}.none{display:none}.fltleft{float:left}.fltright{float:right}.case{text-transform:capitalize}.lase{text-transform:lowercase}.uase{text-transform:uppercase}a.tdnone:link{text-decoration:none}a.tdnone:visited{text-decoration:none}a.tdnone:hover{text-decoration:none}a.lblack:link{color:#000}a.lblack:visited{color:#000}a.lblack:hover{color:#000}a.lwhite:link{color:#fff}a.lwhite:visited{color:#fff}a.lwhite:hover{color:#fff}a.lblue:link{color:#418ac2}a.lblue:visited{color:#418ac2}a.lblue:hover{color:#418ac2}a.lred:link{color:#f30}a.lred:visited{color:#f30}a.lred:hover{color:#f30}.green{color:green}.red{color:red}.black{color:#000}.white{color:#fff}.yellow{color:#fcf500}.blue{color:#2196f3}.fs12{font-size:12px}.fs14{font-size:14px}.fs16{font-size:16px}.fs18{font-size:18px}.fs20{font-size:20px}.fs22{font-size:22px}.fs24{font-size:24px}.fs36{font-size:36px}.fs45{font-size:45px}.bgwhite{background-color:#fff}.bgblack{background-color:#000}.bgblue{background-color:#1995dc}.bgred{background-color:#d01b1b}.bgorange{background-color:#f56e12}.mg0{margin:0}.mg5{margin:5px}.mg10{margin:10px}.mgt0{margin-top:0}.mgt10{margin-top:10px}.mgt20{margin-top:20px}.mgt40{margin-top:40px}.mgt50{margin-top:50px}.mgt70{margin-top:70px}.mgb10{margin-bottom:10px}.mgb20{margin-bottom:20px}.mgb30{margin-bottom:30px}.mgl5{margin-left:5px}.mgl10{margin-left:10px}.mgl20{margin-left:20px}.mgr5{margin-right:5px}.mgr10{margin-right:10px}.mgr20{margin-right:20px}.w20{width:20%}.w25{width:25%}.w33{width:33%}.w50{width:50%}.w100{width:100%}.pd0{padding:0}.pd3{padding:3px}.pd5{padding:5px}.pd10{padding:10px}.pd20{padding:20px}.pd30{padding:30px}.pdt10{padding-top:10px}.pdt20{padding-top:20px}.pdb10{padding-bottom:10px}.pdb20{padding-bottom:20px}.border1{border:1px solid}.border2{border:2px solid}.bblack{color:#000}.bwhite{color:#fff}.bradius3{border-radius:3px}.bradius6{border-radius:6px}.bradius9{border-radius:9px}.border-bottom{border-bottom:1px solid #ddd;padding-bottom:10px}.border-right{border-right:1px solid #e2e2e2}.sdivider{height:6px;background:#ddd;display:block;width:100%;clear:both}.vdivider{border-right:6px solid #ddd}.video-container{position:relative;padding-bottom:56.25%;height:0;overflow:hidden}.video-container iframe,.video-container object,.video-container embed,.video-container video{position:absolute;top:0;left:0;width:100%;height:100%}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-thumb{background:#f86903}::-webkit-scrollbar-track{background:#000}body{font-family:montserrat,sans-serif}a,a:hover,a:focus{text-decoration:none}.top-bar{position:relative;display:block;background:#121a37;padding:12.5px 0}.top-bar ul{list-style:none;margin:0;padding:0}.top-bar li{display:inline-block}.top-bar li a{display:block;font-family:montserrat,sans-serif}.top-right{text-align:right}.top-left li{position:relative;display:inline-block;margin-right:15px}.top-left li a{font-size:14px;font-weight:500;color:#a6a6b3}.top-left .fa,.top-left .fas{position:relative;font-size:18px;margin-right:8px;color:#f86a03;font-weight:700}.top-right li{position:relative;display:inline-block}.top-right li:nth-child(1) .fa,.top-right li:nth-child(2) .fa,.top-right li:nth-child(3) .fa{padding:0;margin-left:0}.top-right li:nth-child(1),.top-right li:nth-child(2),.top-right li:nth-child(3){margin:0 16px}.top-right li a{font-size:14px;font-weight:500;color:#a6a6b3}.top-right .fa{padding:5px;margin-left:3px}.top-right li:nth-child(1):before,.top-right li:nth-child(2):before,.top-right li:nth-child(3):before{position:absolute;content:"";background:rgba(255,255,255,.2);width:1px;height:20px;top:3px;right:-17px}.mobile-mode-contact{display:none}a.head-logo{max-width:130px;display:none;margin:0 auto;width:100%;position:absolute;left:55px;top:5px}a.head-logo img{width:100%}.logo a{display:inline-block}.logo-social2{display:none}.logo-social2 h3{margin-top:30px;text-align:left;padding:5px 16px;color:#fff;font-size:17px;margin-bottom:10px}.logo-social2 ul li:nth-child(1){margin-left:0!important}.logo-social2 ul li{display:inline-block;margin:5px 10px}.logo-social2 ul li a{display:block;background:#ccc;color:#333;height:30px;width:30px;transition:all .3s;border-radius:50%;text-align:center;line-height:27px;padding:1px 8px;font-size:14px;border:1px solid #fff}#logo-header{background:#fff;padding:14px 0 40px;box-shadow:0 0 30px rgba(127,137,161,.3)}#logo-header .logo-social{text-align:center}#logo-header .logo-social ul{margin:0;padding:0;list-style:none}#logo-header .logo-social li{display:inline-block;line-height:72px;margin-right:5px}#logo-header .logo-social li a{color:#222}#logo-header .logo-social li a:hover{color:#fff}#logo-header .logo-social li a i{line-height:35px;width:35px;height:35px;background:#ccc;display:inline-block;border-radius:50%;box-shadow:0 0 2px #888;text-align:center}#logo-header .logo-social li a i:hover{background:#fd6905;-webkit-transition:background-color 1s ease-out;-moz-transition:background-color 1s ease-out;-o-transition:background-color 1s ease-out;transition:background-color 1s ease-out}.partner{text-align:right;padding:20px 0}.partner a{display:inline-block;margin:0 10px;padding:0 5px;position:relative}.partner a img{width:135px}.foot-partner{padding:20px 0;display:none}.foot-partner a{display:inline-block;margin:0 10px;position:relative;background:#fff}.foot-partner a img{width:135px}.details-right{position:relative;display:block;padding:22px 0;background:#27ae60}.call-us{position:relative;margin-top:15px;text-align:right}.call-us>i{font-size:38px;display:inline-block;margin-right:10px;color:#fd6905}.call-us>span{display:inline-block;color:#777;font-size:16px;line-height:1.3}.call-us>span>strong{display:block;font-size:16px;color:#222}.call-us>span>strong a{color:#222}.sticky{background:#121a37!important;position:fixed!important;top:0!important;width:100%;transition:all .5s}#header{display:block;min-height:50px;position:relative;z-index:10;transition:all .5s;background:0 0;width:100%;top:-30px}#header .container{background:#121a37;position:relative;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px}.main-nav,.main-nav *{margin:0;padding:0;list-style:none}.main-nav>ul{padding-left:20px}.main-nav>ul>li{position:relative;white-space:nowrap;float:left;padding:5px}.main-nav a{display:block;position:relative;color:#fff;font-size:14px!important;transition:.3s;text-transform:capitalize;font-size:14px;font-weight:500}.main-nav .drop-down ul{display:block;position:absolute;left:0;top:calc(100%+30px);z-index:99;opacity:0;visibility:hidden;padding:10px 0;background:#fff;box-shadow:0 0 30px rgba(127,137,161,.25);transition:ease all .3s;padding-left:15px}.main-nav .drop-down:hover>ul{opacity:1;top:100%;visibility:visible}.main-nav .drop-down li{min-width:180px;position:relative}.main-nav .drop-down ul a{padding:10px 20px;font-size:14px;color:#253d52;text-decoration:none}.main-nav .drop-down ul a:hover,.main-nav .drop-down ul .active>a,.main-nav .drop-down ul li:hover>a{color:#f86903}.main-nav .drop-down>a:after{content:"\f107";font-family:FontAwesome;padding-left:10px}.main-nav .drop-down .drop-down ul{top:0;left:calc(100% - 30px)}.main-nav .drop-down .drop-down:hover>ul{opacity:1;top:0;left:100%}.main-nav .drop-down .drop-down>a{padding-right:35px}.main-nav .drop-down .drop-down>a:after{content:"\f105";position:absolute;right:15px}.mobile-nav{position:fixed;top:0;bottom:0;z-index:999999;overflow-y:auto;left:-260px;width:260px;padding-top:18px;border-right:1px solid #ee4b3c;background:#121a37;transition:.4s}.mobile-nav *{margin:0;padding:0;list-style:none}.mobile-nav a{position:relative;display:block;padding:5px 15px;font-size:15px;font-weight:400;color:#fff}.mobile-nav a:hover,.mobile-nav .active>a,.mobile-nav li:hover>a,.mobile-nav li:focus>a{color:#fff;text-decoration:none;background:0 0!important}.nav>li>a:focus,.nav>li>a:hover{text-decoration:none;background-color:transparent!important}.mobile-nav .drop-down>a:after{content:"\f078";font-family:FontAwesome;padding-left:10px;position:absolute;right:15px;font-size:13px}.mobile-nav .active.drop-down>a:after{content:"\f077"}.mobile-nav .drop-down>a{padding-right:35px}.mobile-nav .drop-down ul{display:none;overflow:hidden}.mobile-nav .drop-down li{padding-left:20px}.mobile-nav-toggle{position:absolute;margin-top:-10px;float:left;left:10px;top:18px;z-index:9998;border:0;background:0;font-size:25px;transition:all .4s;outline:none!important;line-height:1;cursor:pointer;text-align:right;display:none}.mobile-nav-toggle i{margin:10px 18px 0 0;color:#121a37}.mobile-nav-overly{width:100%;height:100%;z-index:9997;top:0;left:0;position:fixed;background:rgba(0,0,0,.8);overflow:hidden;display:none}.mobile-nav-overly .fa-times{position:absolute;right:20px;top:20px;color:#fff;cursor:pointer;font-size:20px}.mobile-nav-active{overflow:hidden}.mobile-nav-active .mobile-nav{left:0}.mobile-nav-active .mobile-nav-toggle i{color:#fff}.navbtn{background:#27ae60;color:#fff;padding:5px 15px;margin:10px 5px 5px;font-size:12px}.navbtn a{color:#fff;font-size:12px}.nav-btn{transition:background-position 1s;background:#f76605;position:absolute;right:0;top:0;color:#fff;font-size:14px;font-weight:700;-webkit-border-top-right-radius:5px;-webkit-border-bottom-right-radius:5px;-moz-border-radius-topright:5px;-moz-border-radius-bottomright:5px;border-top-right-radius:5px;border-bottom-right-radius:5px}.nav-btn a{color:#fff;text-decoration:none;padding:20px 40px;display:inline-block}.nav-btn:hover{background-position:-100% 0}.bg-img{min-width:100%;min-height:50vh;background-repeat:no-repeat;background-position:center;background-size:cover;position:relative;top:-60px;margin-bottom:-60px}.bg-img:before{content:"";position:absolute;left:0;right:0;top:0;bottom:0;background-color:rgba(0,0,0,.7)}.bg-img .bg-img-caption{position:absolute;top:50%;left:36%;transform:translate(-50%,-50%);z-index:1;color:#fff;padding:10px;max-width:800px;width:100%;text-align:left}.bg-img .bg-img-caption h2{margin:0;text-align:left;text-transform:capitalize;font-size:40px;line-height:54px;font-weight:700}.bg-img .bg-img-caption p{margin-top:10px;font-size:14px;line-height:22px;color:#ccc}.bg-img .bg-img-caption a{display:inline-block;background:#f76605;color:#fff;text-align:inherit;line-height:14px;border-width:0;padding:16px 30px;font-weight:500;font-size:16px;margin-top:2%}.bg-img .bg-img-caption a i{margin-left:5px}#src-domain{padding-top:30px;padding-bottom:35px;overflow-x:hidden}.domain-wrap h1{padding:0;margin:0;text-align:center;font-size:35px;font-weight:700}.domain-wrap p{text-align:center;margin-top:20px;margin-bottom:30px;letter-spacing:2px;font-size:16px;line-height:18px;color:#777}.dom-search{width:100%;border:1px solid #d5d5d5;border-radius:32px!important;overflow:hidden;height:50px;position:relative}.dom-search .form-control{padding:0 30px}.dom-search input[type=text]{border:0;width:100%;height:50px;border-radius:0;box-shadow:none!important}.dom-search .input-group-prepend{padding:13px 20px;position:absolute;right:164px;top:50%;transform:translateY(-50%);z-index:9}.dom-search .dom-btn{min-width:180px!important;height:40px!important;border-radius:32px!important;text-align:center!important;color:#fff!important;background:#f26402!important;background:-moz-linear-gradient(left,#f26402 0,#f98131 100%)!important;background:-webkit-linear-gradient(left,#f26402 0,#f98131 100%)!important;background:linear-gradient(to right,#f26402 0,#f98131 100%)!important;font-size:14px!important;line-height:14px!important;letter-spacing:2px!important;text-transform:uppercase!important}.domain-details{text-align:center;width:100%;margin-top:20px}.domain-details ul{margin:0;padding:0;list-style:none}.domain-details ul li{display:inline-block;margin:10px;color:#f86805;font-size:30px;font-weight:900;line-height:10px;border-right:1px solid #cfd4dc;padding-right:20px;letter-spacing:2px}.domain-details li:last-child{border-right:0}.domain-details ul li span{font-size:14px;line-height:18px;color:#121a37;font-weight:700}.transfer-domain{text-align:center;margin:40px 0 0}.transfer-domain a{display:inline-block;background:#f76605;padding:10px 15px;color:#fff;font-size:15px;text-transform:capitalize;border:1px solid #f76605;transition:all .3s;border-radius:5px;font-weight:700}.transfer-domain a:hover{background:0 0;color:#f76605}span.since1{display:block;font-weight:700;text-transform:capitalize;font-size:13px;background:0 0;padding-left:30px;margin-top:-8px;color:#4e4a49}span.since2{display:none}.about{background-repeat:no-repeat;background-position:center top;background-size:cover;position:relative;padding:20px 0 200px}.about:before{content:"";position:absolute;left:0;right:0;top:0;bottom:0;background-color:rgba(0,0,0,.8)}.ab-wrap{color:#fff;padding-top:70px;padding-bottom:30px}.ab-heading{color:#ec6d1e;font-size:20px;text-transform:uppercase;text-align:center;position:relative;margin:0 0 10px;padding-bottom:18px}.ab-heading:after{width:100px;background:#fff;height:4px;content:"";position:absolute;bottom:0;left:50%;transform:translate(-50%,0%);-webkit-transform:translate(-50%,0%)}.ab-details{margin-bottom:20px;padding:10px}.ab-details h2{font-size:55px;line-height:30px;font-weight:600;text-align:center;margin-bottom:35px}.ab-details p{padding:0 80px;font-size:16px;line-height:30px;letter-spacing:1px;text-align:center}#features{background:#f7f7f7;position:relative;padding:50px 0}.fe-wrap{display:inline-block;position:relative}.fe-details{background:#fff;padding:10px 30px;text-align:center;box-shadow:0 0 2px 2px rgba(0,0,0,.1);-webkit-border-radius:10px;-moz-border-radius:10px;border-radius:10px}.fe-details i{font-size:30px;color:#f67620;margin:40px 0 20px}.fe-details h2{margin:0;padding:10px 0;font-size:22px;line-height:22px;font-weight:700;color:#222}.fe-details p{font-size:14px;line-height:26px;letter-spacing:0;padding-bottom:14px}.fe-bot-caption{position:relative;margin:30px auto}.fe-bot-caption>i{font-size:25px;display:inline-block;color:#fd6905;margin-right:15px;vertical-align:top}.fe-bot-caption>p{display:inline-block;color:#222;font-size:16px;line-height:24px}.fe-bot-caption>p>span{display:block;font-size:14px;line-height:24px;color:#999}.counter-padding{padding:0;margin-top:20px}.counter{background:#f67620;padding:40px;color:#fff;text-align:center;margin-top:20px;border-right:1px solid #222}.counter-value{position:relative}.counter-value:after{position:absolute;content:"\f067";font-family:fontAwesome;font-size:22px;top:50%;transform:translateY(-50%);margin-left:10px}#counter .col-md-3:first-child .counter{-webkit-border-top-left-radius:10px;-webkit-border-bottom-left-radius:10px;-moz-border-radius-topleft:10px;-moz-border-radius-bottomleft:10px;border-top-left-radius:10px;border-bottom-left-radius:10px}#counter .col-md-3:last-child .counter{border-right:0;-webkit-border-top-right-radius:10px;-webkit-border-bottom-right-radius:10px;-moz-border-radius-topright:10px;-moz-border-radius-bottomright:10px;border-top-right-radius:10px;border-bottom-right-radius:10px}.counter i{font-size:55px;line-height:55px;font-weight:500;margin-bottom:20px}.counter p{font-size:40px;line-height:40px;font-weight:500}.counter span{position:relative;top:12px;font-size:16px;font-weight:700}#products{margin-top:-185px}.pro-heading h1{margin:0;color:#fff;font-size:35px;line-height:45px;padding:0 0 0 60px;font-weight:700;letter-spacing:0;text-align:right;text-transform:capitalize}.pro-caption p{margin:0;font-size:14px;line-height:25px;color:#fff;font-weight:400;padding:0 90px 0 32px;border-left:2px solid #f67620}.pro-details{margin-top:50px;text-align:center;padding:5px 15px;box-shadow:0 0 2px 2px rgb(142 142 142/50%);border-radius:10px;transition:all .5s;min-height:350px;margin-bottom:10px;position:relative;background:#fff}.pro-details a{display:block;text-decoration:none;transition:all .5s}.pro-details .read-btn{position:absolute;left:0;right:0;bottom:15px;width:115px;margin:auto}.pro-details:hover{background:#f67620;color:#fff}.pro-details:hover h2,.pro-details:hover p{color:#fff}.pro-details:hover a{text-decoration:none}.pro-details:hover span{color:#fff;font-weight:700}.pro-details i{font-size:35px;line-height:45px}.pro-details h2{font-size:22px;line-height:26px;font-weight:700;color:#222;transition:all .5s;margin-top:5px}.pro-details p{font-size:14px;line-height:25px;margin-top:20px;color:#222;transition:all .5s}.read-btn{color:#f67620;margin-top:10px;display:inline-block;transition:all .5s}#web-plan{background:rgba(199,198,198,.1);margin-top:50px}.plan-head{margin-top:50px;text-align:center}.plan-head span{color:#f67620;font-size:20px;line-height:25px;text-transform:uppercase;text-align:center;position:relative;margin:0 0 50px;padding-bottom:18px}.plan-head h1{margin:10px 0 20px;padding:0 0 20px;position:relative}.plan-head h1:after{width:100px;background:#f67620;height:2px;content:"";position:absolute;bottom:0;left:50%;transform:translate(-50%,0%);-webkit-transform:translate(-50%,0%)}.plan-head p{font-size:14px;line-height:22px;letter-spacing:1px;font-weight:500}.plan-wrap{background:#fff;margin-top:50px;margin-bottom:20px;padding:30px;box-shadow:0 0 2px 2px rgba(199,198,198,.4);border-radius:5px}.plan-caption{text-align:center}.plan-caption h2{margin:0 0 32px;font-size:28px;line-height:28px;font-weight:700}.plan-caption p{font-size:25px;line-height:30px;font-weight:600}.plan-caption p span{font-size:12px;line-height:16px;letter-spacing:1px;color:#f67620;font-weight:700}.plan-details{display:grid;margin:auto}.plan-wrap ul{margin:0;padding:0;list-style:none}.plan-wrap li{margin:5px 0;padding:10px 0;border-bottom:rgba(199,198,198,.3) solid 1px;text-align:center;color:#888;font-size:14px;line-height:18px;letter-spacing:1px}.plan-btn{background:#f67620;margin:20px auto;display:inline-block;padding:10px 20px;color:#fff;font-size:14px;line-height:18px}.plan-btn:hover{background:#222;text-decoration:none;color:#fff}.con-padding{padding:0}.con-left.section1,#contact .section2{display:flex;justify-content:center;align-items:center;flex-flow:column;color:#fff;text-align:center;height:60vh}.section1{background:#f86706}#contact .section2{background:#121a37}.con-left i{font-size:50px;line-height:50px;font-weight:700;position:relative}.con-left i:hover{color:#252a3d}.con-left h2{margin:0;font-size:24px;position:relative;font-weight:700;padding-bottom:20px;padding-top:20px;letter-spacing:1px;font-family:montserrat,sans-serif}.con-left h2:after{content:'';position:absolute;top:100%;width:80px;height:1px;background:#fff;left:0;right:0;margin:auto}.con-left p{padding:20px 100px;font-size:16px;line-height:25px;letter-spacing:1px;position:relative;color:#fff;text-transform:capitalize}.con-btn{background-color:#25201f;position:relative;color:#fff;cursor:pointer;padding:12px 30px;font-size:14px;border-radius:5px;text-transform:uppercase;-webkit-transition:all .3s ease-in-out 0s;-o-transition:all .3s ease-in-out 0s;transition:all .3s ease-in-out 0s}.con-btn:hover{text-decoration:none;color:#222;background:#fff}.con-right i{font-size:50px;line-height:50px;font-weight:700;position:relative}.con-right i:hover{color:#f67620}.con-right h2{margin:0;font-size:24px;position:relative;font-weight:700;padding-bottom:20px;padding-top:20px;letter-spacing:1px;font-family:montserrat,sans-serif}.con-right h2:after{content:'';position:absolute;top:100%;width:80px;height:1px;background:#fff;left:44%}.con-right span{display:grid;margin-top:10px;margin-bottom:10px;position:relative}.con-right span a{color:#fff;display:block;font-size:16px;line-height:30px;letter-spacing:1px;text-decoration:none}.con-right span a:hover{color:#f67620}.con-right address{font-size:16px;line-height:25px;letter-spacing:1px;position:relative;margin-bottom:5px}.con-right label{margin:0;display:inline-block;font-size:16px;line-height:25px;letter-spacing:1px;font-weight:700;position:relative}.space{position:absolute;z-index:9;top:50%;right:-22px;display:inline-block;padding:11px 12px;border-radius:8px;-webkit-border-radius:8px;-moz-border-radius:8px;-ms-border-radius:8px;-o-border-radius:8px;background:#fff;color:#222;font-weight:700}.page-img{min-width:100%;min-height:50vh;background-repeat:no-repeat;background-position:center;background-size:cover;position:relative;top:-60px;margin-bottom:-60px}.page-img:before{content:"";position:absolute;left:0;right:0;top:0;bottom:0;background-color:rgb(18,26,55,.8)}.page-img .page-img-caption{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:1;color:#fff;padding:10px;max-width:800px;width:100%;text-align:left}.page-img .page-img-caption h2{margin:0;text-align:center;text-transform:capitalize;font-size:50px;line-height:58px;font-weight:700;margin-bottom:20px;letter-spacing:1px}.page-img .page-img-caption ul,.page-img .page-img-area ul{list-style:none;margin:0;padding:0;text-align:center}.page-img .page-img-caption ul li,.page-img .page-img-area ul li{background:#fff;display:inline-block;margin:0 5px 0 0;padding:0 7px}.page-img .page-img-caption ul li:hover,.page-img .page-img-area ul li:hover{background:#f67620}.page-img .page-img-caption ul li a,.page-img .page-img-area ul li a{color:#222;font-size:14px;text-decoration:none;text-transform:capitalize;line-height:22px}.page-img .page-img-caption ul li a:hover,.page-img .page-img-area ul li a:hover{color:#fff}.column{cursor:pointer;color:#222}.containerTab{color:#222}.tab-row:after{content:"";display:table;clear:both}.closebtn{float:right;color:red;font-size:35px;cursor:pointer}#w-gsuite{background:#fff;padding:60px 0}.page-img-area{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:1;padding:10px;color:#fff;max-width:800px;width:100%;text-align:center}.gsuite-heading{padding:70px 10px}.gsuite-img img{width:100%;padding:40px}.page-img-area h1{margin:0;font-size:40px;line-height:45px;padding:0 0 5px;font-weight:700}.page-img-area p{font-size:22px;line-height:28px;letter-spacing:2px;padding:5px 0;font-weight:600}.page-img-area span{font-size:18px;line-height:25px;font-weight:400;letter-spacing:0;padding:0;margin-bottom:20px;display:inline-block}.gsuite-heading h2{margin:0;text-align:left;padding:0 0 10px;font-weight:800;line-height:50px;font-size:40px}.gsuite-heading p{text-align:left;font-size:14px;font-weight:500;line-height:27px;letter-spacing:1px;margin:10px 0 0}.row-eq-height .col-md-4 .gsuite-caption{min-height:230px}.gsuite-caption{text-align:center;font-size:14px;line-height:25px;letter-spacing:1px;border-right:1px solid rgba(0,0,0,.1);border-bottom:1px solid rgba(0,0,0,.1);transition:.9s all;padding:30px}#w-gsuite .col-md-4:last-child .gsuite-caption{border-right:0 solid rgba(0,0,0,.1)}.gsuite-caption:hover{background:#121a37;color:#fff;transition-timing-function:linear}.gsuite-caption i{color:#f67620;font-size:50px;line-height:50px;margin:0 0 20px;font-weight:500}.gsuite-caption:hover i{color:#fff}.gsuite-caption p{font-weight:500}#gsuite-features{background:#f3f3f3;padding:50px 0 30px}#gsuite-features .plan-head{margin-top:0;margin-bottom:30px}#gsuite-features .plan-head p{line-height:25px}.g-fe-wrap{background:#fff;padding:30px;text-align:center;min-height:360px;box-shadow:0 5px 15px 0 #dceff9;margin-bottom:30px;-webkit-border-radius:40px;-moz-border-radius:40px;border-radius:40px}.g-fe-wrap:hover{min-height:360px;background:-webkit-linear-gradient(bottom,#121a37 0,#36498c 100%);background:-o-linear-gradient(top,#121a37 0,#36498c 100%);background:-moz-linear-gradient(to top,#121a37 0,#36498c 100%);background:linear-gradient(to top,#121a37 0,#36498c 100%);position:relative;-webkit-box-shadow:0 15px 45px 0 #dceff9;-moz-box-shadow:0 15px 45px 0 #dceff9;box-shadow:0 15px 45px 0 #dceff9}.g-fe-icon i{font-size:80px;line-height:80px}.g-fe-wrap:hover i{color:#fff}.g-fe-details h2{font-weight:700;font-size:24px;line-height:32px;margin-bottom:15px;color:#222}.g-fe-wrap:hover h2{color:#fff}.g-fe-details p{color:#222;margin-bottom:15px;font-weight:400;font-size:16px;line-height:28px}.g-fe-wrap:hover p{color:#fff}#apps{padding:20px 20px 70px;background:#121a37}.appspd{padding:0}#apps .plan-head{color:#fff;margin-bottom:30px}.app-wrap{min-height:252px;background:#fff;padding:30px;margin:2px 2px 0 0;text-align:center}.app-img img{width:60px;height:60px}.app-wrap:hover img{cursor:pointer;position:relative;top:-5px}.app-details h4{margin:20px 0 0;color:#222}.app-details p{font-size:12px;line-height:18px;letter-spacing:1px;margin-top:10px}#g-data{padding:30px 0}#g-data .plan-head{margin:0 0 20px}.g-data-details{margin:8px 0 15px}.g-data-details p{font-size:14px;line-height:25px;letter-spacing:1px;font-weight:600}.g-data-list ul{margin:0;padding:0;list-style:none}.g-data-list ul li{padding:5px 0;margin-bottom:5px;font-size:14px;line-height:25px;letter-spacing:1px}.g-data-list ul li i{color:#f67620}#g-suite-plan .plan-wrap{margin-bottom:30px;--min-height:940px}#g-suite-plan .plan-caption strong{font-size:14px;line-height:25px;letter-spacing:1px;margin:9px 0 0;display:inline-block;border-bottom:rgba(199,198,198,.3) solid 1px;padding-bottom:12px}#g-faq,#office365-faq{padding:10px 30px}#g-faq .faq-wrap,#office365-faq .faq-wrap,#zoho-faq .faq-wrap{padding:10px 20px}#g-faq .plan-head{margin-top:30px;padding-bottom:20px}#g-faq .panel-default .panel-heading-custom,#office365-faq .panel-default .panel-heading-custom,#zoho-faq .panel-default .panel-heading-custom{background:#fff;cursor:pointer}#g-faq .panel-default .panel-heading-custom h4,#office365-faq .panel-default .panel-heading-custom h4,#zoho-faq .panel-default .panel-heading-custom h4{color:#333;display:inline-block}#g-faq .panel-default .panel-heading-custom i,#office365-faq .panel-default .panel-heading-custom i,#zoho-faq .panel-default .panel-heading-custom i{color:#000;display:inline-block;float:right;font-size:12px;line-height:16px}#g-faq .panel-default .panel-body-custom,#office365-faq .panel-default .panel-body-custom,#zoho-faq .panel-default .panel-body-custom{background:#fff;border-top:#fff solid 1px!important;font-weight:400}#office-365-apps{background:#121a37;color:#fff;padding:0 0 60px}#office-365-apps .app-wrap{min-height:280px}#office-365-apps .plan-head{margin-bottom:30px}#office-365-apps .app-details h4{color:#222}#office-365-apps .app-details p{font-size:12px;line-height:18px;letter-spacing:1px;margin-top:10px;color:#222;font-weight:400}#office-365-apps .app-details a{color:#121a37;text-decoration:none}#office365-features{background:#f5f6f9;padding:0 0 50px}.off-fe-wrap{min-height:380px;background:#d2d2d2;padding:30px;border:2px solid #fbfbfb;margin-top:30px;border-radius:5px;transition:box-shadow .2s ease,z-index 0s .2s ease,-webkit-transform .2s ease;transition:box-shadow .2s ease,transform .2s ease,z-index 0s .2s ease;transition:box-shadow .2s ease,transform .2s ease,z-index 0s .2s ease,-webkit-transform .2s ease;text-align:center;box-shadow:0 1px 5px 1px rgba(0,0,0,.05)}.off-fe-wrap:hover{transform:translate3d(0,-5px,0);-webkit-transform:translate3d(0,-5px,0);-webkit-box-shadow:0 10px 40px rgba(0,0,0,.1);box-shadow:0 10px 40px rgba(0,0,0,.1)}.off-fe-wrap i{display:inline-block;color:#f67620;font-size:25px;width:70px;height:70px;line-height:70px;margin-bottom:20px;position:relative;z-index:1;border-radius:20px;-webkit-transition:all .4s;transition:all .4s;background:#f2f2ff}.off-fe-wrap i:after{content:'';width:100%;height:100%;top:0;left:0;position:absolute;border-radius:20px;background:#f2f2ff;z-index:-1;-webkit-transform:rotate(45deg);transform:rotate(45deg);-webkit-transition:all .4s;transition:all .4s}.off-fe-details h4{margin:0 0 10px;font-size:24px;font-weight:600;line-height:30px}.off-fe-details p{font-size:12px;line-height:22px;letter-spacing:1px;font-weight:500}#office365-plan .plan-wrap{--min-height:780px}#office365-plan .plan-details{font-weight:400}#w-zoho{overflow-x:hidden}#w-zoho1{background:#f9f9f9;overflow-x:hidden}.service-image img{width:100%;padding:40px}.service-detail-wrap{padding:70px 0}.service-detail-wrap h2{margin:0;padding:0 0 10px;font-weight:600;line-height:40px;font-size:25px}.service-detail-wrap p{font-size:17px;line-height:25px;padding:5px 0;font-weight:400}#zoho-features{padding:0 0 60px}.bg1{margin:100px 0}#zoho-mob{padding:40px 0;background:#eee}.mob-img img{width:60%;padding:20px 60px;position:relative;left:102px}.mob-img:before{content:'';background:url(https://projects.boxarts.com/wp-content/themes/v2zohomail/imgs/mobile-pattern.png) no-repeat 0 0/100%;position:absolute;top:10%;left:-5%;bottom:0;right:0;height:100%;margin:auto;max-width:352px}.mob-title h4{font-size:36px;line-height:40px;font-weight:800;letter-spacing:1px}.mob-details p{font-size:17px;line-height:25px;margin:20px 0;padding:0 80px 0 0}.apps-download-img img{margin:10px;text-align:center}#zohomail-plan .container{max-width:800px;margin:auto}#zohomail-plan .plan-details{font-weight:400}#web-plan .plan-wrap ul li:nth-child(n+4){display:none}#web-plan .btn-read{text-align:center}#web-plan .btn-read span{background:#f9f9f9;padding:10px 20px;position:relative;top:12px;border:rgb(244,101,1,.2) solid 1px;display:inline-block}#web-plan .btn-read span:hover{border:rgb(244,101,1,.5) solid 1px}#g-suite-plan .plan-wrap ul li:nth-child(n+4){display:none}#g-suite-plan .btn-read{text-align:center}#g-suite-plan .btn-read span{background:#f9f9f9;padding:10px 20px;position:relative;top:12px;border:rgb(244,101,1,.2) solid 1px;display:inline-block}#g-suite-plan .btn-read span:hover{border:rgb(244,101,1,.5) solid 1px}#office365-plan .plan-wrap ul li:nth-child(n+4){display:none}#office365-plan .btn-read{text-align:center}#office365-plan .btn-read span{background:#f9f9f9;padding:10px 20px;position:relative;top:12px;border:rgb(244,101,1,.2) solid 1px;font-weight:400;display:inline-block}#office365-plan .btn-read span:hover{border:rgb(244,101,1,.5) solid 1px}#zohomail-plan .plan-wrap ul li:nth-child(n+4){display:none}#zohomail-plan .btn-read{text-align:center}#zohomail-plan .btn-read span{background:#f9f9f9;padding:10px 20px;position:relative;top:12px;border:rgb(244,101,1,.2) solid 1px;display:inline-block}#zohomail-plan .btn-read span:hover{border:rgb(244,101,1,.5) solid 1px}#seoid1{overflow-x:hidden}#seiid2{background:#f9f9f9;overflow-x:hidden}#seo-features{padding:0 0 60px}#semid1{overflow-x:hidden}#semid2{background:#f9f9f9;overflow-x:hidden}#sem-features{padding:0 0 60px}#smmid1{overflow-x:hidden}#smmid2{background:#f9f9f9;overflow-x:hidden}#smm-features{padding:0 0 60px}.contact-banner{background-image:url(https://www.v2technosys.com/wp-content/uploads/2020/11/banner-1.jpg);min-width:100%;min-height:35vh;background-repeat:no-repeat;background-position:center;background-size:cover;position:relative;top:-60px;margin-bottom:-60px}.contact-banner:before{content:"";position:absolute;left:0;right:0;top:0;bottom:0;background-color:rgba(0,0,0,.7)}.contact-title{position:relative;text-align:center;padding:55px 0}.contact-title h2{font-size:35px;color:#fff;margin:15px 0 30px;position:relative}.contact-title h2:after{content:'';position:absolute;width:80px;height:1px;background:#fff;left:0;right:0;bottom:-10px;margin:auto}.contact-title p{font-size:17px;color:#fff}select#tech-service option{color:#000}.contact-main{position:relative;padding:0;overflow-x:hidden}.form-wrap{border-radius:0;padding:40px 15px 15px 100px;background:#f76605}.address-wrap{background:#121a37;padding:15px 100px 15px 40px;position:relative}.address-wrap:after{content:"";position:absolute;left:0;right:0;top:0;bottom:0;background-color:rgb(37,42,61,.8)}.contact-main label{color:#fff}.form-wrap .form-control{border-radius:5px;height:50px;margin-bottom:20px;width:100%!important;margin-top:8px;background:0 0;color:#fff}.form-wrap .form-check{justify-content:start;padding:15px}.contact-submit{background:#023575;color:#fff;padding:6px 30px;font-size:20px;border:1px solid #023575;transition:all .5s}.contact-submit:hover{background:#fff;color:#023575}#message{height:auto!important}#email2,#email_hidden{display:none}.form-wrap .form-control::placeholder{color:#fff;opacity:1}.form-wrap .form-control:-ms-input-placeholder{color:#fff}.form-wrap .form-control::-ms-input-placeholder{color:#fff}.address-book{position:relative;z-index:1}.address-book h2{color:#fff;text-transform:uppercase;margin-bottom:30px;position:relative}.address-book h2:after{content:'';position:absolute;width:80px;height:1px;background:#fff;left:5px;bottom:-10px}.address-link p{display:flex;justify-content:flex-start;align-items:center}.address-link p span{display:inline-block;width:30px;font-size:17px;color:#fff;padding:5px 0}.address-link a{display:inline-block;color:#fff;padding:5px 0;margin-bottom:5px;width:calc(100% - 50px);font-size:17px;text-decoration:none}.postal p{color:#fff;display:flex;justify-content:start;align-items:flex-start}.postal span{font-weight:700;display:inline-block;width:30px;padding:7px 0;font-size:17px}.postal font{display:inline-block;color:#fff;padding:5px 0;margin-bottom:5px;width:calc(100% - 50px);font-size:17px}#footer{background:#121a37;padding:60px 0 15px;color:#fff}.foo-wrap{padding-bottom:30px}.foo-about p{font-size:14px;line-height:26px;letter-spacing:1px;margin-bottom:20px;text-align:justify}#footer .foo-about ul{margin:0;padding:0;list-style:none}#footer .foo-about li{display:inline-block;margin-right:5px}#footer .foo-about li a{color:#222}#footer .foo-about li a:hover{color:#fff}#footer .foo-about li a i{line-height:30px;width:30px;height:30px;background:#fff;display:inline-block;border-radius:50%;box-shadow:0 0 2px #888;text-align:center;border:1px solid #fff;transition:all .3s}#footer .foo-about li a i:hover{background:#333}.foo-wrap h2{margin:0 0 30px;font-size:20px;line-height:22px;font-weight:600;position:relative}.foo-wrap h2:after{position:absolute;content:"";height:1px;width:85px;background:#fff;left:0;bottom:-10px}.foo-wrap h2 img{width:150px;height:22px}.foo-content ul{list-style:none;margin:0;padding:0}.foo-content li{margin-bottom:5px}.foo-content li a{font-size:14px;line-height:22px;color:#fff;text-decoration:none;padding:0 0 5px;display:inline-block;position:relative}.foo-content li a:after{background:none repeat scroll 0 0 transparent;bottom:0;content:"";display:block;height:1px;left:0;position:absolute;background:#fff;transition:width .3s ease 0s,left .3s ease 0s;width:0}.foo-content li a:hover:after{width:100%;left:0}.footer-2{background:#091233;padding:20px 15px}.footer-2 p{margin:0;font-size:12px;color:#fff}.footer-2 p a{color:#fff}.about-page-content p{font-size:17px}.about-page-content{position:relative;padding:30px 0}.enquire-main{position:relative;padding:30px 0;background:#d9d9d9}.enquire-main label{color:#222}.enquire-main .form-wrap .form-control{color:#222!important}.enquire-main .form-wrap .form-control::placeholder{color:#222;opacity:1}.enquire-main .form-wrap .form-control:-ms-input-placeholder{color:#222}.enquire-main .form-wrap .form-control::-ms-input-placeholder{color:#222}.enquire-main .form-wrap{background:#fff;border:1px solid #d1d1d1}.enquire-address{position:relative;padding:50px 0;background:#a8a8a8}.enq-address-box p,.enq-address-box a{display:inline-block;width:calc(100% - 35px);font-size:14px;font-weight:600;padding-left:15px;color:#121a37}.enq-address-box a{padding:5px 5px 5px 15px;letter-spacing:.5px}.enq-address-box span{display:inline-block;width:30px;height:30px;vertical-align:top;font-size:20px;border:1px solid #121a37;text-align:center;line-height:30px;color:#121a37}@media all and (max-width:1199px){.bg-img .bg-img-caption{left:42%}}@media all and (max-width:1024px){.top-bar .container{width:100%}.logo-social2{display:block}.nav-btn{border-top-right-radius:0;border-bottom-right-radius:0}.bg-img{top:0;margin-bottom:0}.nav-btn a{padding:25px 20px}}@media all and (min-width:1920px){.form-wrap,.address-wrap{min-height:600px}}@media all and (min-width:991px) and (max-width:1900px){.form-wrap,.address-wrap{min-height:600px}}@media all and (max-width:991px){.logo,.logo-social,.call-us{text-align:center}#header{height:70px;top:0;background:#fff!important}span.since2{display:block;font-weight:700;text-transform:capitalize;font-size:13px;background:0 0;left:50px;margin-top:-8px;color:#4e4a49;position:absolute;bottom:0}.sticky{background:#fff!important}.mobile-nav-toggle{top:28px}#header .container{background:#121a37;position:initial}a.head-logo{display:flex;justify-content:center;align-items:center}a.head-logo img:nth-child(2){width:40px}.foot-partner{display:block}#logo-header{display:none}.main-nav{display:none}.mobile-nav-toggle{display:block}.nav>li{position:relative;display:block;width:100%;margin-bottom:10px}.nav>li>a{position:relative;display:block;padding:5px 15px;font-size:15px;line-height:1.5;font-weight:400}.fe-wrap{top:0;margin-bottom:0}.fe-details{margin-top:20px;box-shadow:0 0 2px 2px rgba(0,0,0,.1)}.fe-bot-caption{text-align:center}.ab-details p{padding:0}.counter{border-right:0;border-radius:10px;margin-top:0}.pro-heading h1{text-align:center;padding:0;font-size:25px;line-height:25px}.pro-caption p{padding:0 0 0 30px}.con-padding{padding:10px}.space{display:none}.gsuite-caption{border-right:0 solid rgba(0,0,0,.1)}.bg1{margin:100px 0;text-align:center}.mob-img img{left:150px}.service-detail-wrap{padding:60px 0;text-align:center}.service-detail-wrap p{padding:5px 20px}.app-wrap,#office-365-apps .app-wrap{margin-top:20px}.mob-img:before{top:15%;left:-3%;max-width:560px}.mob-details p{padding:0}.form-wrap,.address-wrap{padding:15px 120px;min-height:auto}.top-bar{display:none}.logo-social-wrap{display:none}.page-img,.contact-banner{top:0;margin-bottom:0}.pro-details{min-height:auto}.pro-details .read-btn{position:static}#products{margin-top:0}.about{padding:30px 0}.about .ab-wrap{padding-top:0;padding-bottom:20px}.ab-details p{font-size:14px!important;line-height:23px}#features{padding:30px 0}.enq-address-box{min-height:75px;margin-bottom:20px}}@media all and (max-width:767px){.bg-img .bg-img-caption{left:50%}.partner{text-align:center}.bg-img .bg-img-caption h2{font-size:30px;line-height:30px}.bg-img .bg-img-caption p{font-size:14px;line-height:18px}.ab-details p{padding:0 20px}.counter-padding{padding:15px}.app-wrap,#office-365-apps .app-wrap{margin:0 20px 20px}.top-left{text-align:center;margin-bottom:15px}.top-right{text-align:center}.ab-details h2{font-size:35px}.mob-img:before{top:15%;left:-8%;max-width:538px}.form-wrap,.address-wrap{padding:15px 20px}.address-book{padding:0 20px}.partner a img{width:100px}.partner a:first-child{margin-bottom:5px}.enq-address-box{min-height:auto}}@media all and (max-width:575px){.bg-img .bg-img-caption{left:50%;top:55%}.bg-img .bg-img-caption h2{font-size:21px;line-height:25px}.dom-wrap{padding:0!important}.domain-wrap h1{font-size:20px}.domain-details ul li{font-size:20px;text-align:left;width:100%}.dom-search .form-control{padding:0 15px}.ab-wrap{padding-top:25px}.ab-details h2{font-size:23px;margin-bottom:10px;margin-top:0}.ab-heading{margin:0 0 15px}.ab-details p{padding:0}.fe-bot-caption{text-align:left}.pro-heading{margin-top:20px}.pro-heading h1{font-size:20px}.pro-caption{margin-top:10px}.pro-details{margin-top:20px}.pro-details h2{font-size:17px;margin-top:0}.con-left,.con-right{padding:25px 0}.con-left h2,.con-right h2{font-size:18px;padding-bottom:10px;padding-top:10px}.con-left p{padding:15px}#contact .section2{min-height:auto;padding-bottom:20px}.section1{min-height:auto}.con-right i,.con-left i{font-size:30px}.bg-img .bg-img-caption{padding:10px 20px}.dom-search .input-group-prepend{right:100px}.dom-search .dom-btn{min-width:115px!important}.bg-img .bg-img-caption p{font-size:14px;line-height:18px}.bg-img .bg-img-caption p{column-count:1}#page-banner .page-img-area h1{font-size:20px;line-height:25px}.page-img-area span{font-size:15px;line-height:20px}#office365-faq .panel-default .panel-heading-custom i,#g-faq .panel-default .panel-heading-custom i,#zoho-faq .panel-default .panel-heading-custom i{display:none}.service-detail-wrap{padding:30px 0}.service-detail-wrap h2{line-height:normal;font-size:18px}.service-detail-wrap p{font-size:14px;line-height:22px;padding:0}.mob-img:before{top:-10%;left:-5%;max-width:322px}.mob-img img{left:101px;top:-48px}.fe-details i{font-size:25px;margin:15px 0}.fe-details h2{font-size:16px}.plan-head h1{font-size:18px}.plan-head span{font-size:15px;line-height:18px;margin:0;padding-bottom:0;display:block}.plan-head p{font-size:13px}.off-fe-details h4{font-size:18px;line-height:21px}.off-fe-wrap{padding:15px 10px}.off-fe-wrap{min-height:auto}#g-suite-plan .plan-wrap{margin-bottom:30px;min-height:auto;margin-top:0;padding:15px}.plan-caption h2{margin:0 0 32px;font-size:18px;line-height:26px}#g-faq .panel-default .panel-heading-custom h4,#office365-faq .panel-default .panel-heading-custom h4,#zoho-faq .panel-default .panel-heading-custom h4{font-size:14px;line-height:20px}.app-wrap{padding:15px;min-height:auto}}@media all and (max-width:400px){.foot-partner a img{width:120px}}@media all and (max-width:360px){.nav-btn a{padding:25px 5px}}

/* ==========================================================================
   v2-modern FIXES (Phase 7) - Appended at END for cascade priority
   ========================================================================== */

/* 7.1 Hero banner: caption positioned within banner (not too high, not too left) */
.bg-img .bg-img-caption {
  top: 45% !important;
  left: 50% !important;
  max-width: 1000px !important;
  padding: 0 20px !important;
}

/* 7.2 Domain search: container centered + button flush right */
#src-domain .dom-wrap {
  margin-left: auto !important;
  margin-right: auto !important;
  float: none !important;
}
.dom-search { position: relative; }
.dom-search .input-group-prepend {
  right: 5px !important;
  top: 50% !important;
  padding: 0 !important;
  transform: translateY(-50%) !important;
  z-index: 9;
}

/* 7.3 + 7.4 About: vertical stack, centered, single-line heading */
#about .row {
  flex-direction: column !important;
  align-items: center !important;
}
#about .row > * {
  width: 100% !important;
  max-width: 1000px;
  flex: 0 0 auto;
}
#about .ab-wrap { text-align: center; padding-bottom: 10px; }
#about .ab-heading:after { left: 50%; transform: translateX(-50%); }
#about .col-md-6 { width: 100% !important; max-width: 1000px; }
#about .pro-heading h1 {
  text-align: center !important;
  padding: 0 !important;
  font-size: 32px !important;
  line-height: 1.3 !important;
  margin: 20px 0 15px !important;
}
#about .pro-caption p {
  text-align: center !important;
  padding: 0 60px !important;
  border-left: none !important;
  max-width: 800px;
  margin: 0 auto !important;
}

/* 7.5 Features cards: row layout (fe-wrap was inline-block) */
.fe-wrap {
  display: flex !important;
  flex-wrap: wrap !important;
  margin-left: -15px;
  margin-right: -15px;
  width: 100% !important;
}

/* Mobile */
@media (max-width: 767px) {
  .bg-img .bg-img-caption { top: 20% !important; left: 50% !important; transform: translate(-50%, 0) !important; }
  #about .pro-heading h1 { font-size: 22px !important; }
  #about .pro-caption p { padding: 0 20px !important; }
}


/* 7.6 Features bottom captions: icon-text vertically aligned via Flexbox */
.fe-bot-caption {
  display: flex !important;
  align-items: center !important;
  gap: 15px;
  text-align: left;
}
.fe-bot-caption > i {
  margin-right: 0 !important;
  flex-shrink: 0;
  vertical-align: middle;
}
.fe-bot-caption > p {
  display: block !important;
  margin: 0;
}

/* End v2-modern Phase 7 */

/* ==========================================================================
   v2-modern FIXES (Phase 8) - Missing BS3 utility classes
   ========================================================================== */

/* Column offsets (mobile-first, then breakpoint-specific) */
.col-xs-offset-1 { margin-left: 8.333333%; }
.col-xs-offset-2 { margin-left: 16.666667%; }
.col-xs-offset-3 { margin-left: 25%; }
.col-xs-offset-4 { margin-left: 33.333333%; }
.col-xs-offset-6 { margin-left: 50%; }

@media (min-width: 768px) {
  .col-sm-offset-1 { margin-left: 8.333333%; }
  .col-sm-offset-2 { margin-left: 16.666667%; }
  .col-sm-offset-3 { margin-left: 25%; }
  .col-sm-offset-4 { margin-left: 33.333333%; }
  .col-sm-offset-6 { margin-left: 50%; }
}

@media (min-width: 992px) {
  .col-md-offset-1 { margin-left: 8.333333%; }
  .col-md-offset-2 { margin-left: 16.666667%; }
  .col-md-offset-3 { margin-left: 25%; }
  .col-md-offset-4 { margin-left: 33.333333%; }
  .col-md-offset-6 { margin-left: 50%; }
}

@media (min-width: 1200px) {
  .col-lg-offset-1 { margin-left: 8.333333%; }
  .col-lg-offset-2 { margin-left: 16.666667%; }
  .col-lg-offset-3 { margin-left: 25%; }
}

/* Visibility utilities */
.hidden { display: none !important; visibility: hidden !important; }

/* BS3 responsive show/hide */
.hidden-xs, .hidden-sm, .hidden-md, .hidden-lg { }
.visible-xs, .visible-sm, .visible-md, .visible-lg { display: none !important; }

@media (max-width: 767px) {
  .hidden-xs { display: none !important; }
  .visible-xs { display: block !important; }
}
@media (min-width: 768px) and (max-width: 991px) {
  .hidden-sm { display: none !important; }
  .visible-sm { display: block !important; }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .hidden-md { display: none !important; }
  .visible-md { display: block !important; }
}
@media (min-width: 1200px) {
  .hidden-lg { display: none !important; }
  .visible-lg { display: block !important; }
}

/* End v2-modern Phase 8 */

/* ==========================================================================
   v2-modern Phase 9 - Design System (typography + buttons + card context)
   Brand orange: #f76605 | Secondary navy: #121a37
   ========================================================================== */

/* ── Design tokens ── */
:root {
  --color-primary: #f76605;
  --color-primary-dark: #d8590a;
  --color-secondary: #121a37;
  --color-secondary-hover: #1d2851;
  --color-text: #222;
  --color-text-muted: #777;
  --font-base: 'Montserrat', sans-serif;
  --leading-tight: 1.2;
  --leading-snug: 1.4;
  --leading-normal: 1.6;
  --radius-md: 6px;
  --radius-full: 999px;
}

/* ── Typography base ── */
body { font-family: var(--font-base) !important; font-size: 16px !important; line-height: var(--leading-normal) !important; color: var(--color-text) !important; letter-spacing: 0 !important; font-weight: 400 !important; }
p { font-family: var(--font-base) !important; font-size: 16px !important; line-height: var(--leading-normal) !important; letter-spacing: 0 !important; margin-bottom: 1em; }
small, .small { font-size: 14px !important; }
input, textarea, select, button { font-family: var(--font-base) !important; font-size: 14px; }

/* ── Heading scale (section-level: page heroes, section heads) ── */
h1, h2, h3, h4, h5, h6 { font-family: var(--font-base) !important; letter-spacing: 0 !important; color: var(--color-text); margin-top: 0; }
h1 { font-size: clamp(28px, 4.5vw, 44px) !important; line-height: var(--leading-tight) !important; font-weight: 700 !important; }
h2 { font-size: clamp(24px, 3.5vw, 36px) !important; line-height: var(--leading-tight) !important; font-weight: 700 !important; }
h3 { font-size: clamp(20px, 2.5vw, 28px) !important; line-height: var(--leading-snug) !important; font-weight: 600 !important; }
h4 { font-size: 20px !important; line-height: var(--leading-snug) !important; font-weight: 600 !important; }
h5 { font-size: 18px !important; font-weight: 600 !important; }
h6 { font-size: 16px !important; font-weight: 600 !important; }

/* ── CARD CONTEXT: smaller, tight titles ──
   Inside cards/columns, headings should fit naturally and not wrap unnecessarily. */
.pro-details h2,
.fe-details h2,
.gsuite-caption h2,
.g-fe-details h2,
.plan-caption h2,
.off-fe-details h4,
.app-details h4,
.foo-wrap h2,
.address-book h2,
.contact-title h2 {
  font-size: 20px !important;
  line-height: 1.3 !important;
  font-weight: 700 !important;
  margin-bottom: 12px !important;
}

/* Card body text — tight, readable */
.pro-details p,
.fe-details p,
.gsuite-caption p,
.g-fe-details p,
.plan-wrap li,
.foo-content li a {
  font-size: 14px !important;
  line-height: 1.55 !important;
  letter-spacing: 0 !important;
}

/* Plan/price cards: bigger price */
.plan-caption p { font-size: 22px !important; font-weight: 700 !important; }

/* Card icons: consistent size + spacing */
.pro-details i,
.fe-details i { font-size: 32px !important; margin: 20px 0 14px !important; }
.gsuite-caption i,
.g-fe-icon i { font-size: 44px !important; margin-bottom: 16px !important; }

/* ── Strategic page-hero h2 (KEEP large for impact) ── */
.bg-img-caption h2 { font-size: clamp(28px, 5vw, 48px) !important; }
.counter p { font-size: clamp(28px, 4vw, 40px) !important; }
.thankyou-wrap h1 { font-size: clamp(60px, 12vw, 130px) !important; }
.ab-details h2 { font-size: clamp(28px, 4vw, 40px) !important; }

/* ── Section heads (decorative orange "WHO WE ARE" style) ── */
.ab-heading,
.plan-head span { font-size: 14px !important; letter-spacing: 2px !important; font-weight: 600 !important; }
.plan-head h1 { font-size: clamp(24px, 3vw, 32px) !important; line-height: 1.3 !important; }
.plan-head p { font-size: 16px !important; line-height: 1.6 !important; }

/* ── Page banner / breadcrumb context ── */
.page-img-caption h2 { font-size: clamp(28px, 4.5vw, 44px) !important; line-height: 1.2 !important; }
.page-img-area h1 { font-size: clamp(28px, 4vw, 38px) !important; line-height: 1.2 !important; }

/* ── Title + text gap consistency (h + p siblings) ── */
h1 + p, h2 + p, h3 + p, h4 + p,
h1 + span, h2 + span, h3 + span,
.pro-heading h1 + p,
.pro-details h2 + p,
.fe-details h2 + p,
.gsuite-caption h2 + p {
  margin-top: 8px !important;
}

/* Card containers: consistent inner spacing */
.pro-details,
.fe-details,
.gsuite-caption,
.g-fe-wrap,
.plan-wrap {
  padding: 24px 20px !important;
}

/* ── UNIFIED BUTTON SYSTEM ── */
.btn, .btn-read,
.dom-btn, .plan-btn, .con-btn, .contact-submit,
.navbtn, .transfer-domain a, .nav-btn a,
.bg-img-caption a, .bg-img .bg-img-caption a,
button#close-thankyou,
button.btn, a.btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 12px 28px !important;
  font-family: var(--font-base) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  letter-spacing: 1px !important;
  line-height: 1.2 !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  border-radius: var(--radius-md) !important;
  border: none !important;
  cursor: pointer !important;
  transition: all 0.25s ease !important;
  background-image: none !important;
  min-width: 0 !important;
  height: auto !important;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08);
  vertical-align: middle;
}

.btn, .dom-btn, .plan-btn,
.transfer-domain a, .nav-btn a,
.bg-img-caption a, .bg-img .bg-img-caption a {
  background: var(--color-primary) !important;
  color: #fff !important;
}
.btn:hover, .dom-btn:hover, .plan-btn:hover,
.transfer-domain a:hover, .nav-btn a:hover,
.bg-img-caption a:hover, .bg-img .bg-img-caption a:hover {
  background: var(--color-primary-dark) !important;
  color: #fff !important;
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(247, 102, 5, 0.35) !important;
}

.con-btn, .contact-submit, button#close-thankyou {
  background: var(--color-secondary) !important;
  color: #fff !important;
}
.con-btn:hover, .contact-submit:hover, button#close-thankyou:hover {
  background: var(--color-secondary-hover) !important;
  color: #fff !important;
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(18, 26, 55, 0.35) !important;
}

.navbtn {
  background: transparent !important;
  color: var(--color-primary) !important;
  border: 2px solid var(--color-primary) !important;
  padding: 10px 26px !important;
}
.navbtn:hover { background: var(--color-primary) !important; color: #fff !important; }

.dom-btn { border-radius: var(--radius-full) !important; padding: 14px 35px !important; letter-spacing: 2px !important; }

#header .nav-btn { border-top-right-radius: 5px !important; border-bottom-right-radius: 5px !important; overflow: hidden; box-shadow: none !important; }
#header .nav-btn a { padding: 0 35px !important; border-radius: 0 !important; box-shadow: none !important; height: 100% !important; text-transform: none !important; font-size: 14px !important; }
#header .nav-btn a:hover { transform: none !important; box-shadow: none !important; }

.read-btn { display: inline-flex !important; align-items: center; color: var(--color-primary) !important; font-size: 13px !important; font-weight: 600 !important; letter-spacing: 1px !important; text-transform: uppercase !important; text-decoration: none !important; padding: 6px 0 !important; background: transparent !important; border: none !important; box-shadow: none !important; margin-top: 12px !important; }
.read-btn:hover { color: var(--color-primary-dark) !important; }

section { padding: 60px 0; }
@media (max-width: 767px) {
  section { padding: 40px 0; }
}


/* ── Hero/Banner overlay text — MUST be white on dark image bg ── */
.bg-img,
.bg-img-caption,
.bg-img .bg-img-caption,
.page-img,
.page-img-caption,
.page-img-area,
.contact-banner,
.contact-title {
  color: #fff !important;
}
.bg-img h1, .bg-img h2, .bg-img h3, .bg-img p,
.bg-img-caption h1, .bg-img-caption h2, .bg-img-caption h3, .bg-img-caption p, .bg-img-caption span,
.bg-img .bg-img-caption h1, .bg-img .bg-img-caption h2, .bg-img .bg-img-caption h3, .bg-img .bg-img-caption p,
.page-img-caption h1, .page-img-caption h2, .page-img-caption p,
.page-img-area h1, .page-img-area h2, .page-img-area p, .page-img-area span,
.contact-banner h1, .contact-banner h2, .contact-banner p,
.contact-title h2, .contact-title p {
  color: #fff !important;
}

/* ── Hero banner: tighten layout (no section padding, smaller height, text near top) ── */
#banner,
#page-banner {
  padding: 0 !important;
}
#banner .bg-img,
.bg-img {
  min-height: 38vh !important;
  top: 0 !important;
  margin-bottom: 0 !important;
}
.bg-img .bg-img-caption {
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  text-align: left !important;
  max-width: 1100px !important;
  padding: 0 30px !important;
}

/* Page banners (single posts: Google Workspace etc.) */
.page-img {
  min-height: 38vh !important;
  top: 0 !important;
  margin-bottom: 0 !important;
}
.page-img .page-img-area {
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
}

/* Contact banner */
.contact-banner {
  min-height: 28vh !important;
  top: 0 !important;
  margin-bottom: 0 !important;
}
.contact-banner .contact-title { padding: 30px 0 !important; }

/* ── RESTORE legacy floating-navbar overlap aesthetic ──
   Original design: navbar sits across the boundary between #logo-header (white) and
   banner (dark), so half the navbar visible on white and half on the dark banner.
   Achieved via three coordinated negative-top offsets. */

/* Pull navbar UP 30px into #logo-header bottom padding */
#header {
  top: -30px !important;
  position: relative !important;
  z-index: 10 !important;
}

/* Room for navbar to overlap into */
#logo-header {
  padding-bottom: 40px !important;
}

/* All banner variants: pull UP 60px so they overlap under navbar by 30px */
.bg-img,
.page-img,
.contact-banner,
#banner .bg-img,
#page-banner .page-img {
  top: -60px !important;
  margin-bottom: -60px !important;
  position: relative !important;
}

/* Banner heights preserved */
.bg-img,
.page-img {
  min-height: 38vh !important;
}
.contact-banner {
  min-height: 28vh !important;
}

/* On mobile/tablet (≤1024px), legacy uses flat layout (no overlap) */
@media all and (max-width: 1024px) {
  #header { top: 0 !important; }
  .bg-img, .page-img, .contact-banner {
    top: 0 !important;
    margin-bottom: 0 !important;
  }
}

/* ── Contact section: full-bleed colored panels, white text ── */
#contact {
  padding: 0 !important;
  margin: 0 !important;
}

/* Both panels: orange and navy, white text throughout */
#contact .section1,
#contact .section2,
.con-left,
.con-right,
.con-left.section1,
#contact .con-right.section2 {
  color: #fff !important;
}

/* All text descendants stay white (override Phase 9 dark heading color) */
.section1 h1, .section1 h2, .section1 h3, .section1 h4, .section1 h5, .section1 h6,
.section1 p, .section1 span, .section1 i, .section1 address, .section1 label, .section1 lebal,
.section2 h1, .section2 h2, .section2 h3, .section2 h4, .section2 h5, .section2 h6,
.section2 p, .section2 span, .section2 i, .section2 address, .section2 label, .section2 lebal,
.con-left h1, .con-left h2, .con-left h3, .con-left h4, .con-left p, .con-left span, .con-left address, .con-left label,
.con-right h1, .con-right h2, .con-right h3, .con-right h4, .con-right p, .con-right span, .con-right address, .con-right label, .con-right lebal {
  color: #fff !important;
}

/* Email/phone links stay white in navy panel */
.con-right a,
.con-right span a,
.con-right address a,
.section2 a {
  color: #fff !important;
}
.con-right a:hover,
.con-right span a:hover,
.section2 a:hover {
  color: #f76605 !important;
}

/* Reduce gap above contact (previous section's bottom padding stacks) */
#products,
#web-plan,
#features {
  padding-bottom: 30px !important;
}

/* ── Footer & empty-section cleanup ── */

/* Footer: all headings WHITE (Phase 9 dark h2 was overriding inheritance) */
#footer h1, #footer h2, #footer h3, #footer h4, #footer h5, #footer h6,
.foo-wrap h1, .foo-wrap h2, .foo-wrap h3, .foo-wrap h4,
.foo-about h2,
.footer-2 p, .footer-2 a {
  color: #fff !important;
}

/* Footer body text and links (defensive) */
#footer,
#footer p, #footer li, #footer li a, #footer span, #footer address {
  color: #fff !important;
}
#footer .foo-content li a:hover {
  color: #f76605 !important;
}

/* Empty #counter section: collapse (page 7 has no counter data → 120px wasted) */
#counter {
  padding: 0 !important;
}
#counter > .container > .row:empty,
#counter:not(:has(.counter)) {
  display: none !important;
}

/* Tighten gaps around contact section */
#features {
  padding-bottom: 30px !important;
}
#contact + * {
  margin-top: 0 !important;
}

/* ── FAQ accordion & Read More button polish ── */

/* FAQ section: cleaner spacing */
#zoho-faq,
#g-faq,
#office365-faq {
  padding: 40px 0 60px !important;
}
#zoho-faq .faq-wrap,
#g-faq .faq-wrap,
#office365-faq .faq-wrap {
  max-width: 900px;
  margin: 30px auto 0 !important;
  padding: 0 !important;
  width: 100%;
}

/* Each Q: card style */
#zoho-faq .panel,
#g-faq .panel,
#office365-faq .panel {
  background: #fff !important;
  border-radius: 8px !important;
  margin-bottom: 12px !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08) !important;
  overflow: hidden !important;
  border: 1px solid #eee !important;
}

/* Question header bar: full width, flex layout */
#zoho-faq .panel-heading-custom,
#g-faq .panel-heading-custom,
#office365-faq .panel-heading-custom {
  background: #fff !important;
  padding: 18px 24px !important;
  cursor: pointer !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  width: 100% !important;
  transition: background 0.2s !important;
  border: none !important;
}
#zoho-faq .panel-heading-custom:hover,
#g-faq .panel-heading-custom:hover,
#office365-faq .panel-heading-custom:hover {
  background: #fff8f3 !important;
}

/* Question text (h4) — full width, NOT inline-block */
#zoho-faq .panel-heading-custom h4,
#g-faq .panel-heading-custom h4,
#office365-faq .panel-heading-custom h4 {
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
  color: #222 !important;
  flex: 1 !important;
  text-align: left !important;
}
#zoho-faq .panel-heading-custom h4 span,
#g-faq .panel-heading-custom h4 span,
#office365-faq .panel-heading-custom h4 span {
  display: block !important;
}

/* Chevron icon — orange, rotates on expand */
#zoho-faq .panel-heading-custom i,
#g-faq .panel-heading-custom i,
#office365-faq .panel-heading-custom i {
  color: #f76605 !important;
  font-size: 14px !important;
  margin-left: 16px !important;
  float: none !important;
  display: inline-block !important;
  transition: transform 0.3s !important;
  line-height: 1 !important;
}

/* Rotate when expanded (BS3 toggles aria-expanded) */
#zoho-faq .panel:has(.panel-collapse.in) .panel-heading-custom i,
#g-faq .panel:has(.panel-collapse.in) .panel-heading-custom i,
#office365-faq .panel:has(.panel-collapse.in) .panel-heading-custom i {
  transform: rotate(180deg) !important;
}

/* Answer body */
#zoho-faq .panel-body-custom,
#g-faq .panel-body-custom,
#office365-faq .panel-body-custom {
  padding: 0 24px 20px !important;
  background: #fff !important;
  border-top: 1px solid #f0f0f0 !important;
}
#zoho-faq .panel-body-custom p,
#g-faq .panel-body-custom p,
#office365-faq .panel-body-custom p {
  font-size: 14px !important;
  line-height: 1.6 !important;
  color: #555 !important;
  margin: 16px 0 0 !important;
}

/* ── READ MORE button: solid orange, professional ── */
#web-plan .btn-read,
#g-suite-plan .btn-read,
#office365-plan .btn-read,
#zohomail-plan .btn-read {
  text-align: center !important;
  margin-top: 20px !important;
  padding: 0 20px 20px !important;
}

#web-plan .btn-read span,
#g-suite-plan .btn-read span,
#office365-plan .btn-read span,
#zohomail-plan .btn-read span {
  display: inline-block !important;
  background: #f76605 !important;
  color: #fff !important;
  border: none !important;
  padding: 11px 28px !important;
  font-weight: 600 !important;
  font-size: 13px !important;
  letter-spacing: 1px !important;
  text-transform: uppercase !important;
  border-radius: 6px !important;
  cursor: pointer !important;
  transition: all 0.25s ease !important;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08) !important;
  top: 0 !important;
  position: static !important;
}

#web-plan .btn-read span:hover,
#g-suite-plan .btn-read span:hover,
#office365-plan .btn-read span:hover,
#zohomail-plan .btn-read span:hover {
  background: #d8590a !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 6px 16px rgba(247, 102, 5, 0.35) !important;
  border: none !important;
}

/* ── Service image sizing (single product/service pages) ── */

/* Image container: centered with breathing room */
.service-image,
.gsuite-img {
  text-align: center !important;
  padding: 20px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 100%;
}

/* Image itself: constrained max-width, no padding, centered */
.service-image img,
.gsuite-img img {
  width: auto !important;
  max-width: 70% !important;
  height: auto !important;
  padding: 0 !important;
  margin: 0 auto !important;
  display: block !important;
}

/* Detail wrap: vertically center text with image */
.service-detail-wrap,
.gsuite-heading {
  padding: 40px 20px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  min-height: 100%;
}

/* Service section rows: align items center */
#semid1 .row,
#seoid1 .row,
#smmid1 .row,
#w-zoho .row,
#w-zoho1 .row,
#w-gsuite .row {
  align-items: center !important;
}

/* Mobile: stack and full width */
@media (max-width: 991px) {
  .service-image img,
  .gsuite-img img {
    max-width: 60% !important;
  }
  .service-image,
  .gsuite-img {
    padding: 10px !important;
  }
}

/* ── Dark-bg sections: white headings ONLY on direct section intro ── */

/* ONLY the .plan-head intro text (NOT cards inside) */
#apps .plan-head h1,
#apps .plan-head h2,
#apps .plan-head h3,
#apps .plan-head p,
#office-365-apps .plan-head h1,
#office-365-apps .plan-head h2,
#office-365-apps .plan-head h3,
#office-365-apps .plan-head p,
.about .ab-details h1,
.about .ab-details h2,
.about .ab-details h3,
.about .ab-details p,
.about .ab-wrap h1,
.about .ab-wrap h2,
.about .ab-wrap p {
  color: #fff !important;
}

/* Accent labels (orange section eyebrows) stay orange */
#apps .plan-head span,
#office-365-apps .plan-head span,
.about .ab-heading {
  color: #f76605 !important;
}

/* App cards on dark bg: KEEP their internal colors (dark text on white card) */
#apps .app-wrap,
#office-365-apps .app-wrap {
  color: #222 !important;
}
#apps .app-wrap h1, #apps .app-wrap h2, #apps .app-wrap h3, #apps .app-wrap h4,
#office-365-apps .app-wrap h1, #office-365-apps .app-wrap h2, #office-365-apps .app-wrap h3, #office-365-apps .app-wrap h4 {
  color: #222 !important;
}
#apps .app-wrap p, #apps .app-details p,
#office-365-apps .app-wrap p, #office-365-apps .app-details p {
  color: #555 !important;
}
#apps .app-wrap a,
#office-365-apps .app-wrap a {
  color: #121a37 !important;
}

/* ── Contact form: flexbox layout so col-sm-6 fields sit side-by-side ── */

/* Form itself becomes flex row (replaces missing .row wrapper) */
.form-wrap form,
.form-wrap form.form-inline,
.enquire-main form {
  display: flex !important;
  flex-wrap: wrap !important;
  width: 100% !important;
  margin: 0 -10px !important;
}

/* Form group padding to mimic BS3 gutter */
.form-wrap .form-group,
.enquire-main .form-group {
  padding: 0 10px !important;
  margin-bottom: 10px !important;
  display: block !important;
}

/* Form group col widths within flex form */
.form-wrap .form-group.col-sm-12,
.enquire-main .form-group.col-sm-12 {
  flex: 0 0 100% !important;
  max-width: 100% !important;
}
.form-wrap .form-group.col-sm-6,
.enquire-main .form-group.col-sm-6 {
  flex: 0 0 50% !important;
  max-width: 50% !important;
}

/* Submit button container also block-level */
.form-wrap form > .col-md-12,
.form-wrap form > .col-sm-12 {
  flex: 0 0 100% !important;
  max-width: 100% !important;
  padding: 0 10px !important;
  margin-top: 10px;
}

/* Form fields: clean styling */
.form-wrap .form-control,
.enquire-main .form-control {
  width: 100% !important;
  height: 48px !important;
  padding: 10px 14px !important;
  border: 1px solid rgba(255, 255, 255, 0.5) !important;
  border-radius: 6px !important;
  background: rgba(255, 255, 255, 0.08) !important;
  color: #fff !important;
  font-size: 14px !important;
  margin-top: 6px !important;
  transition: all 0.2s !important;
}
.form-wrap textarea.form-control {
  height: auto !important;
  min-height: 100px !important;
  resize: vertical;
}
.form-wrap .form-control:focus,
.enquire-main .form-control:focus {
  border-color: #fff !important;
  background: rgba(255, 255, 255, 0.15) !important;
  outline: none !important;
}

/* Mobile: stack everything */
@media (max-width: 767px) {
  .form-wrap .form-group.col-sm-6,
  .enquire-main .form-group.col-sm-6 {
    flex: 0 0 100% !important;
    max-width: 100% !important;
  }
}

/* ── Top-bar separator cleanup (orphan bar after Login/Sign up) ── */
/* Last visible item should not have trailing separator */
.top-right li:last-child:before {
  display: none !important;
  content: none !important;
  background: transparent !important;
  width: 0 !important;
}
/* If only one item, no separator at all */
.top-right ul li:only-child:before {
  display: none !important;
  content: none !important;
}

/* ── Phase 10: Mobile responsive polish ── */

/* Prevent horizontal scroll universally (defensive) */
html, body {
  overflow-x: hidden !important;
  max-width: 100vw;
}
* { -webkit-tap-highlight-color: rgba(247, 102, 5, 0.15); }

/* ──────── Tablet & phone (≤991px) ──────── */
@media (max-width: 991px) {
  /* Header simplified flat layout */
  #header {
    top: 0 !important;
    padding: 8px 0 !important;
  }
  #header .container {
    border-radius: 0 !important;
    background: #121a37 !important;
  }

  /* All banners: no overlap, reasonable height */
  .bg-img, .page-img, .contact-banner,
  #banner .bg-img, #page-banner .page-img {
    top: 0 !important;
    margin-bottom: 0 !important;
    min-height: 30vh !important;
  }

  /* Hero caption: centered, no offset, full-width-90% */
  .bg-img .bg-img-caption,
  .page-img .page-img-caption,
  .page-img-area {
    left: 50% !important;
    top: 50% !important;
    transform: translate(-50%, -50%) !important;
    text-align: center !important;
    padding: 20px !important;
    max-width: 92% !important;
  }

  /* Contact panels: collapse vertical height */
  .con-left.section1,
  #contact .section2,
  .con-left,
  .con-right {
    height: auto !important;
    min-height: 280px !important;
    padding: 50px 20px !important;
  }

  /* "OR" badge between contact panels — hide */
  .space {
    display: none !important;
  }

  /* Form & address wrap padding tight */
  .form-wrap {
    padding: 30px 25px !important;
  }
  .address-wrap {
    padding: 30px 25px !important;
  }

  /* Service section stacks; image smaller */
  .service-image img,
  .gsuite-img img {
    max-width: 55% !important;
  }
  .service-detail-wrap,
  .gsuite-heading {
    padding: 30px 20px !important;
    min-height: auto !important;
    text-align: center !important;
  }
  .service-detail-wrap h2,
  .gsuite-heading h2 {
    text-align: center !important;
  }

  /* Apps grid: 2 per row on tablet */
  #apps .col-md-3,
  #office-365-apps .col-md-3 {
    width: 50% !important;
    float: left;
  }

  /* Footer columns: stack with spacing */
  #footer .col-md-3 {
    margin-bottom: 30px !important;
  }
  #footer .foo-wrap h2:after {
    left: 50% !important;
    transform: translateX(-50%);
  }
  .foo-wrap {
    text-align: center;
  }
  .foo-content {
    text-align: center;
  }
}

/* ──────── Phone (≤767px) ──────── */
@media (max-width: 767px) {
  /* Hero text scales down */
  .bg-img .bg-img-caption h1,
  .bg-img .bg-img-caption h2 {
    font-size: 24px !important;
    line-height: 1.3 !important;
  }
  .bg-img .bg-img-caption p {
    font-size: 14px !important;
    line-height: 1.5 !important;
  }
  .page-img .page-img-caption h2,
  .page-img-area h1 {
    font-size: 24px !important;
    line-height: 1.3 !important;
  }

  /* Section padding tightened (overrides Phase 9 default) */
  section {
    padding: 35px 0 !important;
  }
  #contact {
    padding: 0 !important;
  }

  /* Card titles on phone */
  .pro-details h2,
  .fe-details h2,
  .gsuite-caption h2,
  .g-fe-details h2,
  .foo-wrap h2 {
    font-size: 18px !important;
  }

  /* App cards single column on phone */
  #apps .col-md-3,
  #office-365-apps .col-md-3 {
    width: 100% !important;
    float: none !important;
  }
  #apps .app-wrap,
  #office-365-apps .app-wrap {
    min-height: auto !important;
    margin: 0 0 12px !important;
  }

  /* Banner shorter on phone */
  .bg-img, .page-img {
    min-height: 28vh !important;
  }
  .contact-banner {
    min-height: 22vh !important;
  }

  /* FAQ: tighter padding */
  #zoho-faq, #g-faq, #office365-faq {
    padding: 20px 0 40px !important;
  }
  #zoho-faq .panel-heading-custom,
  #g-faq .panel-heading-custom,
  #office365-faq .panel-heading-custom {
    padding: 14px 16px !important;
  }
  #zoho-faq .panel-heading-custom h4,
  #g-faq .panel-heading-custom h4,
  #office365-faq .panel-heading-custom h4 {
    font-size: 14px !important;
  }
}

/* ──────── Small phone (≤480px) ──────── */
@media (max-width: 480px) {
  /* Hero text smallest */
  .bg-img .bg-img-caption h1,
  .bg-img .bg-img-caption h2,
  .page-img .page-img-caption h2,
  .page-img-area h1 {
    font-size: 20px !important;
  }

  /* Even tighter section padding */
  section {
    padding: 28px 0 !important;
  }

  /* Card padding tight */
  .pro-details, .fe-details, .gsuite-caption {
    padding: 20px 15px !important;
  }

  /* Form padding minimum */
  .form-wrap, .address-wrap {
    padding: 20px 15px !important;
  }

  /* Buttons keep ≥44px tap target */
  .btn, .dom-btn, .plan-btn, .con-btn, .contact-submit,
  .nav-btn a, .navbtn {
    min-height: 44px !important;
  }
}

/* ── Map section: full-bleed, no surrounding gap ── */
section.map,
.map {
  padding: 0 !important;
  margin: 0 !important;
}
section.map .mapouter,
.mapouter {
  margin: 0 !important;
  padding: 0 !important;
}
section.contact-main {
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
}
section.map + * {
  margin-top: 0 !important;
}
/* Footer flush against map */
#footer {
  margin-top: 0 !important;
}

/* End v2-modern Phase 9 */