@import url('https://fonts.googleapis.com/css?family=Oswald:200,300,400,500,600,700');
 @import url('https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i,800,800i');

 /* use style sheet */

 @import url(font-awesome-all.css);
 @import url(flaticon.css);
 @import url(owl.css);
 @import url(bootstrap.css);
 @import url(jquery.fancybox.min.css);
 @import url(animate.css);
 @import url(settings.css);
 @import url(layers.css);
 @import url(navigation.css);



 /*** 

====================================================================
  Reset
====================================================================

 ***/
 * {
   margin: 0px;
   padding: 0px;
   border: none;
   outline: none;
 }


 /*** 

====================================================================
  Global Settings
====================================================================

 ***/


 body {
   font-size: 15px;
   color: #222222;
   line-height: 24px;
   font-weight: 400;
   background: #ffffff;
   font-family: 'Open Sans', sans-serif;
   background-size: cover;
   background-repeat: no-repeat;
   background-position: center top;
   -webkit-font-smoothing: antialiased;
 }

 @media (min-width:1200px) {
   .container {
     max-width: 1300px;
     padding: 0px;
   }
 }

 @media (min-width:1200px) {
   .containers {
     max-width: 1400px;
     padding: 0px;
   }
 }

 .auto-container {
   position: static;
   max-width: 1200px;
   padding: 0px 15px;
   margin: 0 auto;
 }

 .container-fluid {
   padding: 0px 0px;
 }

 .small-container {
   max-width: 680px;
   margin: 0 auto;
 }

 .boxed_wrapper {
   position: relative;
   overflow-x: hidden;
   margin: 0 auto;
   width: 100%;
   min-width: 300px;
 }


 a {
   text-decoration: none;
   transition: all 500ms ease;
   -moz-transition: all 500ms ease;
   -webkit-transition: all 500ms ease;
   -ms-transition: all 500ms ease;
   -o-transition: all 500ms ease;
 }

 a:hover {
   text-decoration: none;
   outline: none;
   color: #f2be00;
 }

 input,
 button,
 select,
 textarea {
   font-family: 'Open Sans', sans-serif;
   font-weight: 400;
   font-size: 15px;
 }

 ul,
 li {
   list-style: none;
   padding: 0px;
   margin: 0px;
 }

 input {
   transition: all 500ms ease;
 }

 button:focus,
 input:focus,
 textarea:focus {
   outline: none;
   box-shadow: none;
   transition: all 500ms ease;
 }

 p {
   position: relative;
   font-family: 'Open Sans', sans-serif;
   color: #222222;
   margin-bottom: 0px;
   font-style: normal;
   transition: all 500ms ease;
 }

 h1,
 h2,
 h3,
 h4,
 h5,
 h6 {
   position: relative;
   font-family: 'Oswald', Sans-Serif;
   font-weight: 400;
   color: #222222;
   margin: 0px;
   transition: all 500ms ease;
 }


 .centred {
   text-align: center;
 }

 .pull-left {
   float: left;
 }

 .pull-right {
   float: right;
 }

 figure {
   margin: 0px;
 }

 img {
   display: inline-block;
   max-width: 100%;
   height: auto;
 }

 @keyframes pulse {
   50% {
     box-shadow: 0 0 0 15px rgba(255, 255, 255, 0.20),
       0 0 0 50px rgba(255, 255, 255, 0.10);
   }
 }

 /** button **/

 .theme-btn {
   position: relative;
   display: inline-block;
   font-size: 20px;
   font-family: 'Passion One', Cursive;
   padding: 20px 40px;
   background: #ff7c4e;
   line-height: 26px;
   color: #ffffff;
   font-weight: 400;
   border-radius: 30px;
   text-transform: uppercase;
   transition: all 500ms ease;
   cursor: pointer;
   text-align: center;
   z-index: 1;
 }

 .theme-btn:hover {
   background: #3b3634;
   color: #ffffff;
   transform: translateY(-3px);
 }


 .pagination {
   position: relative;
   display: block;
 }

 .pagination li {
   display: inline-block;
   margin: 0px 5px;
 }

 .pagination li a {
   position: relative;
   display: inline-block;
   font-size: 18px;
   font-family: 'Playfair Display', sans-serif;
   height: 52px;
   font-weight: 900;
   width: 52px;
   line-height: 52px;
   text-align: center;
   color: #737879;
   background: #f4f3f0;
   transition: all 500ms ease;
 }

 .pagination li a:hover,
 .pagination li a.active {
   background: #f18f20;
   color: #ffffff;
 }

 .sec-pad {
   padding: 115px 0px 120px 0px !important;
 }

 .preloader {
   position: fixed;
   left: 0px;
   top: 0px;
   height: 100%;
   width: 100%;
   z-index: 999999;
   background-color: #ffffff;
   background-position: center center;
   background-repeat: no-repeat;
   background-image: url(../images/icons/preloader.gif);
 }

 .scroll-top {
   width: 50px;
   height: 50px;
   line-height: 50px;
   position: fixed;
   bottom: 105%;
   right: 50px;
   font-size: 16px;
   border-radius: 50%;
   z-index: 99;
   color: #ffffff;
   text-align: center;
   cursor: pointer;
   background: #f18f20;
   transition: 1s ease;
 }

 .scroll-top.open {
   bottom: 30px;
 }

 .scroll-top:hover {
   background: #222222;
 }

 .scroll-top span {
   color: #fff;
 }

 .scroll-top:after {
   position: absolute;
   z-index: -1;
   content: '';
   top: 100%;
   left: 5%;
   height: 10px;
   width: 90%;
   opacity: 1;
   background: -webkit-radial-gradient(center, ellipse, rgba(0, 0, 0, 0.25) 0%, rgba(0, 0, 0, 0) 80%);
   background: -webkit-radial-gradient(center ellipse, rgba(0, 0, 0, 0.25) 0%, rgba(0, 0, 0, 0) 80%);
   background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.25) 0%, rgba(0, 0, 0, 0) 80%);
 }

 /** sec-title **/

 .sec-title .top-title {
   position: relative;
   display: block;
   font-size: 14px;
   font-family: 'Oswald', sans-serif;
   color: #003087;
   line-height: 20px;
   font-weight: 300;
   margin-bottom: 1px;
   text-transform: uppercase;
 }

 .sec-title h1 {
   position: relative;
   display: block;
   font-size: 52px;
   color: #222222;
   line-height: 80px;
   font-weight: 700;
   text-transform: uppercase;
 }

 .sec-title h1 span {
   font-weight: 300;
 }

 .sec-title h1:before {
   position: absolute;
   content: '';
   background: url(../images/icons/title-icon.png);
   width: 236px;
   height: 18px;
   left: 0px;
   bottom: 0px;
   background-repeat: no-repeat;
   z-index: -1;
 }

 .sec-title.centred h1:before {
   right: 0px;
   margin: 0 auto;
 }

 .gray-bg {
   background: #f8f8f8;
 }

 .black-bg {
   background: #111111;
 }




 /*** 

====================================================================
                        Home-Page-One
====================================================================

***/


 /** main-header **/

 .main-header {
   position: relative;
   left: 0px;
   top: 0px;
   background: #ffffff;
   z-index: 999;
   width: 100%;
   transition: all 500ms ease;
   -moz-transition: all 500ms ease;
   -webkit-transition: all 500ms ease;
   -ms-transition: all 500ms ease;
   -o-transition: all 500ms ease;
 }

 .sticky-header {
   position: fixed;
   opacity: 0;
   visibility: hidden;
   background: #fff;
   left: 0px;
   top: 0px;
   width: 100%;
   z-index: 0;
   box-shadow: 0 0px 20px 0px #222222;
   transition: all 500ms ease;
   -moz-transition: all 500ms ease;
   -webkit-transition: all 500ms ease;
   -ms-transition: all 500ms ease;
   -o-transition: all 500ms ease;
 }

 .fixed-header .sticky-header {
   z-index: 999;
   opacity: 1;
   padding: 8px;
   visibility: visible;
   -ms-animation-name: fadeInDown;
   -moz-animation-name: fadeInDown;
   -op-animation-name: fadeInDown;
   -webkit-animation-name: fadeInDown;
   animation-name: fadeInDown;
   -ms-animation-duration: 500ms;
   -moz-animation-duration: 500ms;
   -op-animation-duration: 500ms;
   -webkit-animation-duration: 500ms;
   animation-duration: 500ms;
   -ms-animation-timing-function: linear;
   -moz-animation-timing-function: linear;
   -op-animation-timing-function: linear;
   -webkit-animation-timing-function: linear;
   animation-timing-function: linear;
   -ms-animation-iteration-count: 1;
   -moz-animation-iteration-count: 1;
   -op-animation-iteration-count: 1;
   -webkit-animation-iteration-count: 1;
   animation-iteration-count: 1;
 }


 /** header-style-one **/

 .header-style-one .outer-container {
   position: absolute;
   left: 0px;
   top: 0px;
   width: 100%;
 }

 .header-style-one .outer-container .outer-box {
   position: relative;
   border-bottom: 1px solid rgba(255, 255, 255, 0.10);
 }

 .header-style-one .logo-box {
   position: relative;
   padding: 15px;
   border-bottom-right-radius: 50px;
 }

 .header-style-one .nav-toggler .nav-btn {
   position: relative;
   display: block;
   color: #ffffff;
   font-size: 40px;
   height: 70px;
   width: 70px;
   line-height: 107px;
   background: #004687;
   border-bottom-left-radius: 50px;
   text-align: center;
   cursor: pointer;
   z-index: 1;
 }

 .header-style-one .nav-toggler .nav-btn .icon-bar {
   background: #ffffff;
   height: 2px;
   width: 28px;
   display: block;
   margin: 4px auto;
   text-align: center;
   cursor: pointer;
   transition: all 500ms ease;
 }

 .header-style-one .nav-toggler .nav-btn:hover .icon-bar:nth-child(2) {
   width: 22px;
 }

 .header-style-one .nav-toggler .nav-btn:hover .icon-bar:last-child {
   width: 16px;
 }

 /** header-style-two **/

 .header-style-two .logo-box {
   position: relative;
   margin-top: 26px;
 }

 .header-style-two .header-upper {
   position: absolute;
   left: 0px;
   top: -59px;
   width: 100%;
 }



 /** main-menu **/

 .main-header .nav-outer {
   position: relative;
   /*float: right;*/
 }

 .header-style-two .header-upper .inner-container {
   position: relative;
   display: block;
   background: #222222;
   padding: 0px 40px 0px 30px;
 }

 .header-style-two .header-upper .inner-container:before {
   position: absolute;
   content: '';
   background: rgba(198, 164, 126, 0.40);
   width: 1150px;
   height: 100%;
   left: 10px;
   top: 6px;
   z-index: -1;
 }

 .main-header .header-upper .menu-area,
 .main-header .header-upper .outer-box {
   position: relative;
   float: left;
 }

 .main-header .header-upper .outer-box {
   position: relative;
   margin-top: 43px;
 }

 .main-header .header-upper .outer-box .search-outer {
   position: relative;
   padding-left: 26px;
 }

 .main-header .header-upper .outer-box .search-outer:before {
   position: absolute;
   content: '';
   background: #ffffff;
   width: 1px;
   height: 20px;
   left: 0px;
   top: 1px;
 }

 .main-header .header-upper .menu-area {
   position: relative;
   display: block;
   margin-right: 14px;
 }

 .main-menu .navbar-collapse {
   padding: 0px;
 }

 .main-menu .navigation>li {
   position: relative;
   float: left;
   margin: 0px 8px;
 }

 .main-menu .navigation>li:first-child {
   margin-left: 0px;
 }

 .main-menu .navigation>li>a {
   position: relative;
   display: block;
   font-size: 18px;
   font-family: 'Oswald', sans-serif;
   color: #000;
   line-height: 26px;
   font-weight: 400;
   opacity: 1;
   letter-spacing: 1px;
   text-transform: uppercase;
   padding: 20px 10px 20px 10px;
   transition: all 500ms ease;
   -moz-transition: all 500ms ease;
   -webkit-transition: all 500ms ease;
   -ms-transition: all 500ms ease;
   -o-transition: all 500ms ease;
 }

 .main-menu .navigation>li.current>a,
 .main-menu .navigation>li:hover>a {
   color: #f18f20;
 }

 .main-menu .navigation {
   position: relative;
   /*padding: 8px;*/
 }

 .main-menu .navigation>li>ul {
   position: absolute;
   left: 0px;
   top: 100%;
   width: 250px;
   z-index: 100;
   display: none;
   background: #ffffff;
   border-top: 3px solid #f18f20;
   box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.10);
 }

 .main-menu .navigation>li>ul>li {
   position: relative;
   width: 100%;
   padding: 7px 30px;
   border-bottom: 1px solid #e5e5e5;
   transition: all 500ms ease;
 }

 .main-menu .navigation>li>ul>li:last-child {
   border-bottom: none;
 }

 .main-menu .navigation>li>ul>li>a {
   position: relative;
   display: block;
   font-family: 'Oswald', sans-serif;
   padding: 6px 0px;
   line-height: 24px;
   font-size: 14px;
   color: #222222;
   font-weight: 400;
   letter-spacing: 1px;
   text-align: left;
   text-transform: capitalize;
   transition: all 500ms ease;
   -moz-transition: all 500ms ease;
   -webkit-transition: all 500ms ease;
   -ms-transition: all 500ms ease;
   -o-transition: all 500ms ease;
 }

 .main-menu .navigation>li>ul>li:hover {
   background: #f18f20;
   border-bottom: 1px solid #f18f20;
 }

 .main-menu .navigation>li>ul>li:hover a {
   color: #ffffff;
   padding-left: 10px;
 }

 .main-menu .navigation>li>ul>li:last-child:hover {
   border-bottom: none;
 }

 .main-menu .navigation>li.dropdown:hover>ul {
   visibility: visible;
   opacity: 1;
 }

 .main-menu .navbar-collapse>ul li.dropdown .dropdown-btn {
   position: absolute;
   right: 15px;
   top: 8px;
   font-size: 18px;
   border: 1px solid #ffffff;
   color: #ffffff;
   width: 35px;
   height: 30px;
   line-height: 30px;
   text-align: center;
   cursor: pointer;
   z-index: 5;
   display: none;
 }

 .navbar-header {
   display: none;
 }

 /** sub-menu **/

 .main-menu .navigation>li>ul>li>ul {
   position: absolute;
   left: 100%;
   top: 0%;
   width: 350px;
   z-index: 100;
   display: none;
   padding: 0px 0px;
   background-color: #ffffff;
   border-top: 3px solid #f18f20;
   -webkit-box-shadow: 2px 2px 5px 1px rgba(0, 0, 0, 0.05), -2px 0px 5px 1px rgba(0, 0, 0, 0.05);
   -ms-box-shadow: 2px 2px 5px 1px rgba(0, 0, 0, 0.05), -2px 0px 5px 1px rgba(0, 0, 0, 0.05);
   -o-box-shadow: 2px 2px 5px 1px rgba(0, 0, 0, 0.05), -2px 0px 5px 1px rgba(0, 0, 0, 0.05);
   -moz-box-shadow: 2px 2px 5px 1px rgba(0, 0, 0, 0.05), -2px 0px 5px 1px rgba(0, 0, 0, 0.05);
   box-shadow: 2px 2px 5px 1px rgba(0, 0, 0, 0.05), -2px 0px 5px 1px rgba(0, 0, 0, 0.05);
 }

 .main-menu .navigation li>ul>li.dropdown:hover>ul {
   visibility: visible;
   opacity: 1;
   top: 0;
 }

 .main-menu .navigation>li>ul>li>ul>li {
   position: relative;
   width: 100%;
   margin: 0px;
   border-bottom: 1px solid #e5e5e5;
 }

 .main-menu .navigation>li>ul>li>ul>li:last-child {
   border-bottom: none;
 }

 .main-menu .navigation>li>ul>li>ul>li>a {
   position: relative;
   display: block;
   padding: 10px 30px !important;
   line-height: 24px;
   font-weight: 400;
   font-family: 'Oswald', sans-serif;
   font-size: 15px;
   letter-spacing: 1px;
   text-transform: capitalize;
   color: #222222 !important;
   transition: all 500ms ease;
   -moz-transition: all 500ms ease;
   -webkit-transition: all 500ms ease;
   -ms-transition: all 500ms ease;
   -o-transition: all 500ms ease;
 }

 .main-menu .navigation>li>ul>li>ul>li:hover>a {
   color: #ffffff !important;
   background: #f18f20;
   padding-left: 40px !important;
 }

 .main-menu .navigation>li>ul>li.dropdown>a:after {
   position: absolute;
   content: "\f105";
   font-size: 16px;
   color: #222;
   top: 6px;
   right: -12px;
   font-family: 'Font Awesome 5 Free';
   font-weight: 600;
   cursor: pointer;
   transition: all 500ms ease;
 }

 .main-menu .navigation>li>ul>li.dropdown:hover>a:after {
   color: #ffffff;
 }

 /** search box **/

 .main-header .search-outer {
   position: relative;
   left: 4px;
 }

 .search-outer .header-flyout-searchbar i:before {
   position: relative;
   font-size: 18px;
   color: #ffffff;
   margin: 0px;
   cursor: pointer;
   transition: all 500ms ease;
 }

 .wraper_flyout_search {
   position: fixed;
   top: 0;
   right: 0;
   bottom: 0;
   left: 0;
   z-index: 99999;
   opacity: 0;
   visibility: hidden;
   transition: all 0.3s ease-in-out;
   -webkit-transition: all 0.3s ease-in-out;
 }

 .wraper_flyout_search>.table {
   display: table;
   table-layout: fixed;
   width: 100%;
   height: 100%;
   margin: 0;
 }

 .wraper_flyout_search>.table>.table-cell {
   position: relative;
   display: table-cell;
   width: 100%;
   height: 100%;
   vertical-align: middle;
   text-align: center;
 }

 .wraper_flyout_search>.table>.table-cell>.flyout-search-layer {
   position: absolute;
   top: 0;
   right: 0;
   bottom: 0;
   z-index: 1;
   transform: translateX(100%);
   -webkit-transform: translateX(100%);
 }

 .wraper_flyout_search>.table>.table-cell>.flyout-search-layer:nth-child(1) {
   left: 0;
   background-color: rgba(0, 0, 0, 0.5);
   transition: all 0.3s ease-in-out 0s;
   -webkit-transition: all 0.3s ease-in-out 0s;
 }

 .wraper_flyout_search>.table>.table-cell>.flyout-search-layer:nth-child(2) {
   left: 300px;
   background-color: rgba(0, 0, 0, 0.4);
   transition: all 0.3s ease-in-out 0.3s;
   -webkit-transition: all 0.3s ease-in-out 0.3s;
 }

 .wraper_flyout_search>.table>.table-cell>.flyout-search-layer:nth-child(3) {
   left: 600px;
   background-color: rgba(0, 0, 0, 0.9);
   transition: all 0.9s ease-in-out 0.6s;
   -webkit-transition: all 0.9s ease-in-out 0.6s;
 }

 .wraper_flyout_search>.table>.table-cell>.flyout-search-close {
   position: absolute;
   top: 40px;
   right: 40px;
   width: 30px;
   z-index: 2;
   text-align: center;
   cursor: pointer;
 }

 .wraper_flyout_search>.table>.table-cell>.flyout-search-close>.flyout-search-close-line {
   width: 100%;
   height: 2px;
   float: left;
   margin-bottom: 5px;
   background-color: #fff;
 }

 .wraper_flyout_search>.table>.table-cell>.flyout-search-close>.flyout-search-close-line:nth-child(1) {
   transform: rotate(45deg);
   -webkit-transform: rotate(45deg);
 }

 .wraper_flyout_search>.table>.table-cell>.flyout-search-close>.flyout-search-close-line:nth-child(2) {
   margin-top: -7px;
   transform: rotate(-45deg);
   -webkit-transform: rotate(-45deg);
 }

 .wraper_flyout_search>.table>.table-cell .flyout_search {
   position: relative;
   z-index: 1;
   float: right;
   width: 100%;
   max-width: 500px;
   padding: 100px 40px 100px 40px;
   text-align: right;
 }

 .wraper_flyout_search>.table>.table-cell .flyout_search>.flyout-search-title {
   margin-bottom: 30px;
 }

 .wraper_flyout_search>.table>.table-cell .flyout_search>.flyout-search-title>*:last-child {
   margin-bottom: 0 !important;
 }

 .wraper_flyout_search>.table>.table-cell .flyout_search>.flyout-search-title h4 {
   margin-bottom: 20px;
   text-transform: uppercase;
   font-weight: 300;
   font-size: 35px;
   color: #fff;
   line-height: 45px;
   letter-spacing: 50px;
   opacity: 0;
   transition: all 1s ease-in-out 0s;
   -webkit-transition: all 1s ease-in-out 0s;
 }

 .wraper_flyout_search>.table>.table-cell .flyout_search>.flyout-search-bar .form-row {
   position: relative;
   padding: 0;
   margin: 0;
 }

 .wraper_flyout_search>.table>.table-cell .flyout_search>.flyout-search-bar .form-row input[type=search] {
   width: 100%;
   height: 60px;
   padding: 0px 40px 0px 0px;
   background-color: initial;
   border: none;
   border-bottom: 3px #dedede solid;
   box-shadow: initial;
   font-size: 20px;
   color: #fff;
 }

 .wraper_flyout_search>.table>.table-cell .flyout_search>.flyout-search-bar .form-row button[type=submit] {
   position: absolute;
   top: 17px;
   right: 0;
   z-index: 1;
   width: 40px;
   height: auto;
   background-color: initial;
   border: none;
   cursor: pointer;
 }

 .wraper_flyout_search>.table>.table-cell .flyout_search>.flyout-search-bar .form-row button[type=submit] i {
   font-size: 20px;
   color: #fff;
   line-height: 20px;
 }

 body.flyout-searchbar-active .wraper_flyout_search {
   opacity: 1;
   visibility: visible;
 }

 body.flyout-searchbar-active .wraper_flyout_search>.table>.table-cell>.flyout-search-layer {
   transform: translateX(0);
   -webkit-transform: translateX(0);
 }

 body.flyout-searchbar-active .wraper_flyout_search>.table>.table-cell .flyout_search>.flyout-search-title h4 {
   letter-spacing: 0;
   opacity: 1;
 }

 #hamburger-menu {
   width: 100%;
 }


 /** stricky-header **/

 .sticky-header .main-menu .navigation>li {
   margin: 0px;
 }

 .sticky-header .main-menu .navigation>li>a {
   padding: 15px !important;
 }

 .sticky-header .main-menu .navigation>li>a {
   color: #000;
 }

 .sticky-header .main-menu .navigation>li.current>a,
 .sticky-header .main-menu .navigation>li:hover>a {
   background: #f18f20;
   color: #ffffff;
 }

 .sticky-header .logo-box {
   position: relative;
   float: left;
   margin-top: 10px;
   padding: 0px;
 }

 .sticky-header .menu-area {
   position: relative;
   /*float: right;*/
 }

 .sticky-header .main-menu .navigation>li>a:before {
   display: none;
 }

 /** hidden-sidebar **/

 .hidden-bar {
   position: fixed;
   right: -350px;
   top: 0px;
   width: 350px;
   height: 100%;
   overflow-y: auto;
   border-left: 1px solid #231b26;
   z-index: 99999;
   opacity: 0;
   background-color: #22297A;
   visibility: hidden;
   -webkit-transition: all 0.5s ease;
   -moz-transition: all 0.5s ease;
   -ms-transition: all 0.5s ease;
   -o-transition: all 0.5s ease;
   transition: all 0.5s ease;
 }

 .side-content-visible .hidden-bar {
   right: 0px;
   opacity: 1;
   visibility: visible;
 }

 .hidden-bar .inner-box {
   position: relative;
   background-color: #22297A;
   padding: 55px 40px 50px;
 }

 .hidden-bar .inner-box .cross-icon {
   position: absolute;
   right: 30px;
   top: 30px;
   cursor: pointer;
   color: #ffffff;
   font-size: 20px;
 }

 .hidden-bar .inner-box h2 {
   position: relative;
   font-size: 28px;
   font-weight: 600;
   line-height: 1.2em;
   color: #ffffff;
   margin-bottom: 20px;
 }

 .mCSB_inside>.mCSB_container {
   margin-right: 0;
 }

 .form-back-drop {
   position: fixed;
   right: 0px;
   top: 0px;
   width: 100%;
   height: 100%;
   opacity: 0;
   background: rgba(0, 0, 0, 0.70);
   visibility: hidden;
   z-index: 9990;
   transition: all 0.5s ease;
   -moz-transition: all 0.5s ease;
   -webkit-transition: all 0.5s ease;
   -ms-transition: all 0.5s ease;
   -o-transition: all 0.5s ease;
 }

 .side-content-visible .form-back-drop {
   opacity: 1;
   visibility: visible;
 }

 .hidden-bar .side-menu {
   background-color: transparent;
   padding: 0;
   font-family: 'Muli', sans-serif;
   font-size: 12px;
   letter-spacing: 1px;
 }

 .hidden-bar .side-menu ul li ul a {
   background: transparent;
 }

 .hidden-bar .side-menu ul li ul li ul li a {
   background: transparent;
 }

 .hidden-bar .side-menu li.current>a {
   color: #fff;
 }

 .hidden-bar .side-menu ul li {
   position: relative;
   display: block;
 }

 .hidden-bar .side-menu ul li a {
   position: relative;
   background: transparent;
   color: #fff;
   display: block;
   font-size: 16px;
   font-family: 'Oswald', sans-serif;
   font-weight: 400;
   text-transform: uppercase;
   border-bottom: 1px solid #ffffff;
   padding: 15px 0px;
   transition: all 0.3s ease;
   -moz-transition: all 0.3s ease;
   -webkit-transition: all 0.3s ease;
   -ms-transition: all 0.3s ease;
   -o-transition: all 0.3s ease;
 }

 .hidden-bar .side-menu ul li a .btn.expander {
   background: none;
   color: #fff;
   padding: 4px 12px;
   font-size: 14px;
   border-radius: 0px;
   position: absolute;
   border: 1px solid #ffffff;
   top: 15px;
   right: 0px;
   outline: none;
 }

 .hidden-bar .side-menu ul li a .btn:focus {
   box-shadow: none;
 }

 .hidden-bar .navigation>li {
   display: block;
 }

 .hidden-bar .logo-box {
   position: relative;
   display: block;
   padding-bottom: 30px;
   border-bottom: 1px solid rgba(255, 255, 255, 0.20);
   margin-bottom: 60px;
 }

 .hidden-bar .social-links {
   position: relative;
   padding: 60px 0px;
 }

 .hidden-bar .social-links li {
   position: relative;
   display: inline-block;
   margin-right: 15px;
 }

 .hidden-bar .social-links li:last-child {
   margin-right: 0px;
 }

 .hidden-bar .social-links li a {
   position: relative;
   display: inline-block;
   font-size: 15px;
   line-height: 26px;
   color: #ffffff;
   font-family: 'Open Sans', sans-serif;
 }

 .hidden-bar .social-links li a:hover {
   color: #f18f20;
 }

 /** main-slider **/

 .main-slider {
   position: relative;
 }

 .main-slider h1 {
   position: relative;
   display: block;
   font-size: 72px;
   line-height: 92px;
   color: #ffffff;
   font-weight: 700;
   font-family: 'Oswald', sans-serif;
   margin-bottom: 0px;
   text-transform: uppercase;
   z-index: 2;
 }

 .main-slider h1 span {
   color: #f18f20;
 }

 .rotate-text {
   position: relative;
   display: block;
   font-size: 10px;
   line-height: 20px;
   font-family: 'Oswald', sans-serif;
   font-weight: 300;
   color: #222222;
   letter-spacing: 5px;
   transform: rotate(270deg);
   text-transform: uppercase;
 }

 .rotate-text:before {
   position: absolute;
   content: '';
   right: -80px;
   top: 10px;
   background: #222222;
   width: 60px;
   height: 1px;
 }

 .main-slider span.rotate-text {
   position: relative;
   display: block;
   font-size: 10px;
   line-height: 20px;
   font-family: 'Oswald', sans-serif;
   font-weight: 300;
   letter-spacing: 5px;
   transform: rotate(270deg);
   text-transform: uppercase;
   color: #b1b2b2;
 }

 .main-slider span.rotate-text:before {
   position: absolute;
   content: '';
   width: 60px;
   height: 1px;
   background: rgba(255, 255, 255, 0.50);
   right: 320px;
   top: 8px;
   transition: all 500ms ease;
   display: none;
 }

 .main-slider .title-text .text-1 {
   position: relative;
   display: block;
   font-size: 250px;
   line-height: 250px;
   font-family: 'Oswald', sans-serif;
   text-transform: uppercase;
   font-weight: 700;
   color: transparent;
   -webkit-text-stroke-width: 1px;
   -webkit-text-stroke-color: rgba(255, 255, 255, 0.20);
   transition: all 500ms ease;
 }

 .main-slider .title-text .text-2 {
   position: relative;
   display: block;
   font-size: 100px;
   line-height: 100px;
   font-family: 'Oswald', sans-serif;
   text-transform: uppercase;
   font-weight: 700;
   letter-spacing: 40px;
   color: transparent;
   -webkit-text-stroke-width: 1px;
   -webkit-text-stroke-color: rgba(255, 255, 255, 0.20);
   transition: all 500ms ease
 }

 .tp-bannertimer {
   display: none !important;
 }

 .tparrows.tp-leftarrow:before {
   content: '';
 }

 .nav-style-one .owl-nav .owl-prev span:before,
 .nav-style-one .owl-nav .owl-next span:before {
   content: '';
 }

 .tp-leftarrow.tparrows.metis,
 .nav-style-one .owl-nav .owl-prev {
   width: 60px;
   height: 50px;
   position: relative;
   display: inline-block;
   background: transparent;
   top: 0;
   left: 15px !important;
   cursor: pointer;
   transition: all 500ms ease;
 }

 .tp-leftarrow.tparrows.metis:hover,
 .nav-style-one .owl-nav .owl-prev:hover {
   left: 0px !important;
 }

 .tp-leftarrow.tparrows.metis:before,
 .nav-style-one .owl-nav .owl-prev:before {
   left: auto;
   content: '';
   position: absolute;
   top: 17px;
   left: 5px;
   width: 16px;
   height: 16px;
   border-bottom: 2px solid white;
   border-left: 2px solid white;
   -webkit-transform: rotate(45deg);
   -ms-transform: rotate(45deg);
   transform: rotate(45deg);
   -webkit-transition: .7s cubic-bezier(.2, .96, .34, 1);
   -o-transition: .7s cubic-bezier(.2, .96, .34, 1);
   transition: .7s cubic-bezier(.2, .96, .34, 1);
   right: 6px;
 }

 .nav-style-one .owl-nav .owl-prev:before {
   border-bottom: 2px solid #222;
   border-left: 2px solid #222;
 }

 .tp-leftarrow.tparrows.metis:hover:before,
 .nav-style-one .owl-nav .owl-prev:hover:before {
   border-color: #f18f20;
 }

 .tp-leftarrow.tparrows.metis:after,
 .nav-style-one .owl-nav .owl-prev:after {
   left: auto;
   right: 2px;
   -webkit-transform-origin: right;
   -ms-transform-origin: right;
   transform-origin: right;
 }

 .tp-leftarrow.tparrows.metis:after,
 .nav-style-one .owl-nav .owl-prev:after {
   content: '';
   position: absolute;
   width: 20px;
   height: 11px;
   top: 50%;
   left: 2px;
   -webkit-transform: translateY(-50%) scaleX(0);
   -ms-transform: translateY(-50%) scaleX(0);
   transform: translateY(-50%) scaleX(0);
   -webkit-transform-origin: left;
   -ms-transform-origin: left;
   transform-origin: left;
   width: 48px;
   height: 2px;
   background: #f18f20;
   -webkit-transition: .7s cubic-bezier(.2, .96, .34, 1);
   -o-transition: .7s cubic-bezier(.2, .96, .34, 1);
   transition: .7s cubic-bezier(.2, .96, .34, 1);
 }

 .tp-leftarrow.tparrows.metis:hover:after,
 .nav-style-one .owl-nav .owl-prev:hover:after {
   -webkit-transform: translateY(-50%) scaleX(1);
   -ms-transform: translateY(-50%) scaleX(1);
   transform: translateY(-50%) scaleX(1);
 }


 .tp-rightarrow.tparrows.metis,
 .nav-style-one .owl-nav .owl-next {
   width: 60px;
   height: 50px;
   position: relative;
   display: inline-block;
   background: transparent;
   top: 0;
   left: -15px !important;
   cursor: pointer;
   transition: all 500ms ease;
 }

 .tp-rightarrow.tparrows.metis:hover,
 .nav-style-one .owl-nav .owl-next:hover {
   left: 0px !important;
 }

 .tp-rightarrow.tparrows.metis:before,
 .nav-style-one .owl-nav .owl-next:before {
   left: auto;
   content: '';
   position: absolute;
   top: 17px;
   right: 5px;
   width: 16px;
   height: 16px;
   -webkit-transform: rotate(45deg);
   -ms-transform: rotate(45deg);
   transform: rotate(45deg);
   -webkit-transition: .7s cubic-bezier(.2, .96, .34, 1);
   -o-transition: .7s cubic-bezier(.2, .96, .34, 1);
   transition: .7s cubic-bezier(.2, .96, .34, 1);
   border-top: 2px solid white;
   border-right: 2px solid white;
 }

 .nav-style-one .owl-nav .owl-next:before {
   border-top: 2px solid #222;
   border-right: 2px solid #222;
 }

 .tp-rightarrow.tparrows.metis:hover:before,
 .nav-style-one .owl-nav .owl-next:hover:before {
   border-color: #f18f20;
 }

 .tp-rightarrow.tparrows.metis:after,
 .nav-style-one .owl-nav .owl-next:after {
   left: auto;
   right: 2px;
   -webkit-transform-origin: right;
   -ms-transform-origin: right;
   transform-origin: right;
 }

 .tp-rightarrow.tparrows.metis:after,
 .nav-style-one .owl-nav .owl-next:after {
   content: '';
   position: absolute;
   width: 20px;
   height: 11px;
   top: 50%;
   right: 2px;
   -webkit-transform: translateY(-50%) scaleX(0);
   -ms-transform: translateY(-50%) scaleX(0);
   transform: translateY(-50%) scaleX(0);
   -webkit-transform-origin: right;
   -ms-transform-origin: right;
   transform-origin: right;
   width: 48px;
   height: 2px;
   background: #f18f20;
   -webkit-transition: .7s cubic-bezier(.2, .96, .34, 1);
   -o-transition: .7s cubic-bezier(.2, .96, .34, 1);
   transition: .7s cubic-bezier(.2, .96, .34, 1);
 }

 .tp-rightarrow.tparrows.metis:hover:after,
 .nav-style-one .owl-nav .owl-next:hover:after {
   -webkit-transform: translateY(-50%) scaleX(1);
   -ms-transform: translateY(-50%) scaleX(1);
   transform: translateY(-50%) scaleX(1);
 }


 /** mouse-down-btn **/


 .mouse-btn-down {
   position: absolute;
   left: 50%;
   bottom: 60px;
   -webkit-transform: translateX(-50%);
   -ms-transform: translateX(-50%);
   transform: translateX(-50%);
   height: 15px;
   cursor: pointer;
 }

 .scroll-btn-flip-box {
   overflow: hidden;
   display: inline-block;
   -webkit-transition: 1s cubic-bezier(.86, 0, .07, 1);
   -o-transition: 1s cubic-bezier(.86, 0, .07, 1);
   transition: 1s cubic-bezier(.86, 0, .07, 1);
   -webkit-transform: translateY(-15px);
   -ms-transform: translateY(-15px);
   transform: translateY(-15px);
 }

 .scroll-btn-flip {
   position: relative;
   color: transparent;
   display: block;
   font-family: 'Oswald', sans-serif;
   font-size: 12px;
   line-height: 1;
   text-transform: uppercase;
   font-weight: 400;
   letter-spacing: 3px;
   margin-right: -3px;
 }

 .scroll-btn-flip:before,
 .scroll-btn-flip:after {
   color: white;
   content: attr(data-text);
   display: block;
   position: absolute;
   top: 50%;
   left: 0;
   width: 100%;
   -webkit-transition: .5s cubic-bezier(.86, 0, .07, 1);
   -o-transition: .5s cubic-bezier(.86, 0, .07, 1);
   transition: .5s cubic-bezier(.86, 0, .07, 1);
 }

 .scroll-btn-flip:before {
   -webkit-transform: translateY(-50%);
   -ms-transform: translateY(-50%);
   transform: translateY(-50%);
 }

 .scroll-btn-flip:after {
   -webkit-transform: translateY(-170%);
   -ms-transform: translateY(-170%);
   transform: translateY(-170%);
   color: #f18f20;
 }

 .mouse-btn-down:hover .scroll-btn-flip:before {
   -webkit-transform: translateY(52%);
   -ms-transform: translateY(52%);
   transform: translateY(52%);
 }

 .mouse-btn-down:hover .scroll-btn-flip:after {
   -webkit-transform: translateY(-50%);
   -ms-transform: translateY(-50%);
   transform: translateY(-50%);
 }

 .scroll-arrow-box {
   position: absolute;
   left: 50%;
   bottom: 0;
   width: 20px;
   height: 30px;
   -webkit-transform: translateX(-50%) translateY(30px);
   -ms-transform: translateX(-50%) translateY(30px);
   transform: translateX(-50%) translateY(30px);
   -webkit-transition: 1s cubic-bezier(.165, .84, .44, 1);
   -o-transition: 1s cubic-bezier(.165, .84, .44, 1);
   transition: 1s cubic-bezier(.165, .84, .44, 1);
 }

 .scroll-arrow {
   position: absolute;
   left: 0;
   top: 0;
   -webkit-transform: translateY(-15px);
   -ms-transform: translateY(-15px);
   transform: translateY(-15px);
   width: 100%;
   height: 100%;
   -webkit-transition: 1s cubic-bezier(.23, 1, .32, 1);
   -o-transition: 1s cubic-bezier(.23, 1, .32, 1);
   transition: 1s cubic-bezier(.23, 1, .32, 1);
 }

 .mouse-btn-down:hover .scroll-arrow {
   -webkit-transform: translateY(0);
   -ms-transform: translateY(0);
   transform: translateY(0);
 }

 .scroll-arrow:before {
   content: '';
   width: 14px;
   height: 14px;
   border-right: 2px solid white;
   border-bottom: 2px solid white;
   position: absolute;
   bottom: 2px;
   left: 2px;
   -webkit-transform: rotate(45deg);
   -ms-transform: rotate(45deg);
   transform: rotate(45deg);
   -webkit-transition: .6s cubic-bezier(.23, 1, .32, 1);
   -o-transition: .6s cubic-bezier(.23, 1, .32, 1);
   transition: .6s cubic-bezier(.23, 1, .32, 1);
 }

 .mouse-btn-down:hover .scroll-arrow:before {
   border-right: 2px solid #f18f20;
   border-bottom: 2px solid #f18f20;
 }

 .scroll-arrow:after {
   content: '';
   width: 2px;
   height: 100%;
   background: #f18f20;
   position: absolute;
   bottom: 2px;
   left: 9px;
   -webkit-transform: translateX(-50%) scaleY(0);
   -ms-transform: translateX(-50%) scaleY(0);
   transform: translateX(-50%) scaleY(0);
   -webkit-transform-origin: bottom;
   -ms-transform-origin: bottom;
   transform-origin: bottom;
   -webkit-transition: 1s cubic-bezier(.23, 1, .32, 1);
   -o-transition: 1s cubic-bezier(.23, 1, .32, 1);
   transition: 1s cubic-bezier(.23, 1, .32, 1);
 }

 .mouse-btn-down:hover .scroll-arrow:after {
   -webkit-transform: translateX(-50%) scaleY(1);
   -ms-transform: translateX(-50%) scaleY(1);
   transform: translateX(-50%) scaleY(1);
 }


 /** about-section **/

 .about-section {
   position: relative;
   display: block;
   padding: 100px 0px 120px 0px;
 }

 .count-text {
   position: relative;
   display: block;
   font-size: 60px;
   line-height: 70px;
   font-family: 'Oswald', sans-serif;
   font-weight: 700;
   color: rgba(255, 255, 255, 1);
   text-shadow: -1px -1px 0 #b5b5b5, 1px -1px 0 #b5b5b5, -1px 1px 0 #b5b5b5, 1px 1px 0 #b5b5b5;
 }

 .about-section .count-text {
   padding-bottom: 16px;
   margin-bottom: 28px;
 }

 .about-section .count-text:before {
   position: absolute;
   content: '';
   background: #f18f20;
   width: 80px;
   height: 3px;
   left: 0px;
   bottom: 0px;
 }

 .about-section .content-box .text {
   position: relative;
   display: block;
   font-size: 16px;
   line-height: 30px;
   color: #222222;
   font-weight: 400;
   margin-bottom: 27px;
 }

 .about-section .content-box a {
   position: relative;
   display: inline-block;
   font-size: 16px;
   font-family: 'Oswald', sans-serif;
   font-weight: 600;
   color: #222222;
   text-transform: uppercase;
 }

 .about-section .content-box a:before {
   position: absolute;
   content: '';
   background: #d7d7d7;
   width: 115px;
   height: 1px;
   top: 12px;
   right: -128px;
 }

 .about-section .content-box {
   position: relative;
   display: block;
   padding-top: 50px;
 }

 .about-section .content-box a:hover {
   color: #f18f20;
 }

 .about-section .image-box {
   position: relative;
   display: block;
   box-shadow: 0 0 30px rgba(34, 34, 34, 0.20);
   margin-top: 3px;
 }

 .about-section .image-box img {
   width: 100%;
 }


 /** service-section **/

 .service-section {
   position: relative;
 }

 .service-section .top-content {
   position: relative;
   display: block;
   padding: 113px 0px 194px 0px;
   background: #22297A;
 }

 .service-section .top-content:before {
   position: absolute;
   content: '';
   background: url(../images/background/service-bg.png);
   width: 100%;
   height: 36px;
   left: 0px;
   top: 0px;
   background-repeat: no-repeat;
   background-size: cover;
 }

 .service-section .inner-content {
   position: relative;
   margin-top: -194px;
   box-shadow: 0 0 14px rgba(34, 34, 34, 0.20);
   margin-bottom: 120px;
 }

 .service-section .title-box h1 {
   position: relative;
   display: block;
   color: #ffffff;
   font-size: 52px;
   line-height: 60px;
   font-weight: 700;
   margin-bottom: 33px;
   text-transform: uppercase;
 }

 .service-section .title-box h1 span {
   font-weight: 300;
 }

 .service-block-one {
   position: relative;
   display: block;
   max-height: 470px;
   border-radius: 20px;
 }

 .service-block-one .inner-box {
   position: relative;
   border-radius: 20px;
 }

 .service-block-one .inner-box .count-text {
   font-size: 48px;
   line-height: 60px;
   position: absolute;
   right: 16px;
   top: 9px;
   text-shadow: -1px -1px 0 #e0e0e0, 1px -1px 0 #e0e0e0, -1px 1px 0 #e0e0e0, 1px 1px 0 #e0e0e0;
 }

 .service-block-one .inner-box .caption-box {
   position: absolute;
   background: #ffffff;
   width: 100%;
   /*border-top-left-radius: 20px;
  border-top-right-radius: 20px;*/
   padding: 20px 30px 20px 70px;
   left: 0px;
   top: 0px;
   visibility: visible;
   opacity: 1;
   transition: all 500ms ease;
 }

 .service-block-one .inner-box:hover .caption-box {
   visibility: hidden;
   opacity: 0;
 }

 .service-section .owl-item:nth-child(odd) .caption-box {
   bottom: 0px;
   top: inherit;
 }

 .service-section .owl-item:nth-child(odd) .inner-box .image-box .icon-box {
   margin-left: -20px;
   margin-top: -65px;
 }

 .service-block-one .inner-box .caption-box h4 {
   position: relative;
   display: block;
   font-size: 20px;
   line-height: 30px;
   text-transform: uppercase;
   font-weight: 600;
   margin-bottom: 9px;
 }

 .service-block-one .inner-box .caption-box h4:before {
   position: absolute;
   content: '';
   background: #7d6740;
   width: 35px;
   height: 2px;
   left: -50px;
   top: 12px;
 }

 .service-block-one .inner-box .caption-box a {
   position: relative;
   display: inline-block;
   font-size: 14px;
   font-family: 'Oswald', sans-serif;
   color: #222;
   font-weight: 600;
   text-transform: uppercase;
   text-decoration: underline;
 }

 .service-block-one .inner-box .caption-box a:hover {
   color: #f18f20;
 }

 .service-block-one .image-box img {
   width: 100%;
   opacity: 0.2;
   max-height: 470px;
   border-radius: 10px;
 }

 .service-block-one .image-box {
   position: relative;
   display: block;
   overflow: hidden;
   background: #222222;
   border-radius: 10px;
 }

 .service-block-one .inner-box .icon-box {
   position: relative;
   display: block;
   font-size: 60px;
   line-height: 60px;
   color: #ffffff;
   transition: all 500ms ease;
   border-radius: 10px;
 }

 .service-block-one .inner-box .image-box .icon-box {
   position: absolute;
   left: 50%;
   top: 50%;
   margin-left: -20px;
   margin-top: 25px;
   visibility: visible;
   opacity: 1;

   z-index: 1;
 }

 .service-block-one .inner-box:hover .image-box .icon-box {
   visibility: hidden;
   opacity: 0;
 }

 .service-block-one .inner-box .overlay-box {
   position: absolute;
   left: 0px;
   top: 0px;
   width: 100%;
   height: 100%;
   line-height: 100%;
   display: block;
   align-items: center;
   justify-content: center;
   border-bottom-left-radius: 10px;
   border-bottom-right-radius: 10px;
   text-align: center;
   padding: 80px 15px 100px 15px;
   background-color: rgba(0, 70, 135, 0.7);
   -webkit-transform: scale(0);
   -moz-transform: scale(0);
   -ms-transform: scale(0);
   -o-transform: scale(0);
   transform: scale(0);
   transition: all 500ms ease;
 }

 .service-block-one .inner-box:hover .overlay-box {
   visibility: visible;
   opacity: 1;

   -webkit-transform: scale(1);
   -moz-transform: scale(1);
   -ms-transform: scale(1);
   -o-transform: scale(1);
   transform: scale(1);
 }

 .service-block-one .inner-box .overlay-box .icon-box {
   position: relative;
   display: block;
   margin-bottom: 22px;
   border-radius: 20px;
 }

 .service-block-one .inner-box .overlay-box h4 {
   position: relative;
   display: block;
   font-size: 20px;
   line-height: 30px;
   font-weight: 600;
   color: #ffffff;
   text-transform: uppercase;
   margin-bottom: 14px;
 }

 .service-block-one .inner-box .overlay-box h4 a {
   position: relative;
   display: inline-block;
   color: #ffffff;
 }

 .service-block-one .inner-box .overlay-box h4 a:hover {
   color: #f18f20;
 }

 .service-block-one .inner-box .overlay-box .text {
   position: relative;
   display: block;
   color: #ffffff;
   font-size: 16px;
   line-height: 26px;
 }

 .service-section .owl-dots {
   display: none;
 }

 .service-section .owl-nav {
   position: absolute;
   left: 50%;
   margin-left: -77px;
   bottom: -100px;
 }


 /** video-section **/

 .video-section {
   position: relative;
   display: block;
   /*padding: 100px 0px 60px 0px;*/
   padding: 0px 0px 60px 0px;
 }

 .video-section .video-gallery {
   position: relative;
   display: block;
   width: 100%;
   padding: 225px 0px 157px 0px;
   background-size: cover;
   background-repeat: no-repeat;
   background: rgba(34, 34, 34, 0.50);
 }

 .video-section .video-gallery:before {
   position: absolute;
   content: '';

   width: 100%;
   height: 100%;
   left: 0px;
   top: 0px;
 }

 .video-section .video-gallery a {
   position: relative;
   display: inline-block;
   width: 150px;
   height: 150px;
   line-height: 150px;
   text-align: center;
   border: 1px solid #ffffff;
   font-size: 24px;
   color: #ffffff;
 }

 .video-section .video-gallery a i {
   position: relative;
   display: inline-block;
   width: 149px;
   height: 149px;
   line-height: 149px;
   text-align: center;
   border: 1px solid #ffffff;
   border-radius: 50%;
 }

 .video-section .video-gallery .text {
   position: relative;
   background: #f18f20;
   padding: 19px 15px;
   text-align: center;
   max-width: 290px;
   width: 100%;
   margin: 0 auto;
   -webkit-transform: scale(0);
   -moz-transform: scale(0);
   -ms-transform: scale(0);
   -o-transform: scale(0);
   transform: scale(0);
   transition: all 500ms ease;
 }

 .video-section .video-gallery:hover .text {
   -webkit-transform: scale(1);
   -moz-transform: scale(1);
   -ms-transform: scale(1);
   -o-transform: scale(1);
   transform: scale(1);
 }

 .video-section .video-gallery .text h4 {
   position: relative;
   display: block;
   font-size: 20px;
   line-height: 30px;
   color: #ffffff;
   font-weight: 500;
   text-transform: uppercase;
 }


 /** work-section **/

 .work-section {
   position: relative;
   display: block;
   padding: 60px 0px 100px 0px;
 }

 .work-section:before {
   position: absolute;
   content: '';

   width: 364px;
   height: 478px;
   left: 45%;
   /*bottom: 15px;*/
   background-repeat: no-repeat;
 }

 .work-section .sec-title {
   position: relative;
   max-width: 570px;
   width: 100%;
   margin: 0 auto;
   padding-bottom: 44px;
 }

 .work-section .sec-title h1 {
   margin-bottom: 8px;
 }

 .work-tab .p-tab {
   position: absolute;
   left: 0px;
   top: 0px;
   width: 100%;
   height: auto;
   opacity: 0;
   visibility: hidden;
 }

 .work-tab .p-tab.active-tab {
   position: relative;
   visibility: visible;
   opacity: 1;
   z-index: 5;
 }

 .work-tab .p-tabs-content {
   position: relative;
   display: block;
 }

 .work-tab .p-tab.active-tab .single-item {
   -webkit-transform: scale(1);
   -ms-transform: scale(1);
   -o-transform: scale(1);
   -moz-transform: scale(1);
   transform: scale(1);
   -webkit-transition: all 700ms ease;
   -ms-transition: all 700ms ease;
   -o-transition: all 700ms ease;
   transition: all 700ms ease;
 }

 .work-tab .p-tab .single-item {
   position: relative;
   -webkit-transform: scale(0);
   -ms-transform: scale(0);
   -o-transform: scale(0);
   -moz-transform: scale(0);
   transform: scale(0);
 }

 .work-section .product-tab-btns {
   position: relative;
   display: block;
   border-bottom: 2px solid #e0e0e0;
   /* margin-bottom: 78px;*/
 }

 .work-section .product-tab-btns li {
   position: relative;
   display: inline-block;
   font-size: 18px;
   line-height: 28px;
   font-family: 'Oswald', sans-serif;
   font-weight: 300;
   color: #fff;
   cursor: pointer;
   padding-bottom: 11px;
   margin: 0px 65px;
   transition: all 500ms ease;
 }

 .work-section .product-tab-btns li.active-btn,
 .work-section .product-tab-btns li:hover {
   color: #22297A;
 }

 .work-section .product-tab-btns li:before {
   position: absolute;
   content: '';
   background: #222222;
   width: 0%;
   height: 2px;
   left: 0px;
   bottom: -2px;
   transition: all 500ms ease;
 }

 .work-section .product-tab-btns li.active-btn:before,
 .work-section .product-tab-btns li:hover:before {
   width: 100%;
 }

 .work-section .product-tab-btns li:after {
   position: absolute;
   content: '';
   background: #abcfc1;
   width: 29px;
   height: 1px;
   top: 18px;
   right: -79px;
 }

 .work-section .product-tab-btns li:last-child:after {
   display: none;
 }

 .work-section .p-tabs-content .single-item .tab-content .top-content {
   position: relative;
   display: block;
   max-width: 269px;
   width: 100%;
   border: 1px solid #e0e0e0;
   padding: 0px 8px;
   margin-bottom: 42px;
 }

 .work-section .p-tabs-content .single-item .tab-content .top-content .count-text {
   position: relative;
   display: inline-block;
   width: 122px;
   height: 122px;
   line-height: 122px;
   text-align: center;
   border: 1px solid #e0e0e0;
   border-radius: 50%;
   margin-right: 45px;
 }

 .work-section .p-tabs-content .single-item .tab-content .top-content .icon-box {
   position: relative;
   display: inline-block;
   font-size: 60px;
   color: #e0e0e0;
 }

 .work-section .p-tabs-content .single-item .tab-content .lower-content h2 {
   position: relative;
   display: block;
   font-size: 30px;
   line-height: 40px;
   font-weight: 700;
   color: #222222;
   margin-bottom: 20px;
   padding-bottom: 27px;
   border-bottom: 2px solid #f6f6f6;
 }

 .work-section .p-tabs-content .single-item .tab-content .lower-content h2 a {
   position: relative;
   display: inline-block;
   color: #222222;
 }

 .work-section .p-tabs-content .single-item .tab-content .lower-content h2 a:hover {
   color: #f18f20;
 }

 .work-section .p-tabs-content .single-item .tab-content {
   position: relative;
   display: block;
   /* max-width: 370px;*/
   width: 100%;
   margin-top: 39px;
 }

 .work-section .p-tabs-content .single-item .image-box {
   position: relative;
   display: block;
   float: left;
   background: #000;
 }

 .work-section .p-tabs-content .single-item .image-box img {
   width: 100%;
   opacity: 0.4;
 }

 .work-section .owl-nav {
   position: absolute;
   left: 0px;
   top: -42px;
 }

 .work-section .owl-dots {
   display: none;
 }

 .work-section .p-tabs-content .single-item:hover .line:before {
   width: 100%;
 }

 .work-section .p-tabs-content .single-item:hover .line:after {
   height: 100%;
 }


 /** project-section **/

 .project-section {
   position: relative;
   display: block;
   padding: 80px 0px 20px 0px;
 }

 .project-title {
   position: absolute;
   top: 0px;
   right: 0px;
   display: block;
   font-size: 80px;
   line-height: 120px;
   font-family: 'Oswald', sans-serif;
   text-transform: uppercase;
   font-weight: 700;
   color: rgba(255, 255, 255, 1);
   text-shadow: -1px -1px 0 #dfdfdc, 1px -1px 0 #dfdfdc, -1px 1px 0 #dfdfdc, 1px 1px 0 #dfdfdc;
   opacity: 0.2;
 }

 .project-section .owl-nav,
 .project-section .owl-dots {
   display: none;
 }

 .project-block-one {
   position: relative;
   display: block;
   overflow: hidden;
 }

 .project-block-one .inner-box .image-box {
   position: relative;
   display: block;
   background: #222222;
   overflow: hidden;
   transition: all 500ms ease;
 }

 .project-block-one .inner-box .image-box img {
   width: 100%;
   opacity: 1;
   transition: all 500ms ease;
 }

 .project-block-one:hover .image-box img {
   opacity: 0.2;
   transform: scale(1.05);
 }

 .project-block-one .inner-box .caption-box h4 {
   position: absolute;
   left: -82px;
   bottom: 85px;
   display: block;
   font-size: 20px;
   line-height: 30px;
   font-weight: 300;
   color: #ffffff;
   transform: rotate(270deg);
   transition: all 500ms ease;
 }

 .project-block-one:hover .caption-box h4 {
   left: -33px;
 }

 .project-block-one .inner-box .text {
   position: absolute;
   right: -60px;
   bottom: 25px;
   font-size: 14px;
   font-weight: 300;
   color: #ffffff;
   font-family: 'Oswald', sans-serif;
   transition: all 500ms ease;
 }

 .project-block-one:hover .text {
   right: 20px;
 }

 .project-block-one .inner-box .icon-box {
   position: absolute;
   top: -40px;
   right: 30px;
   font-size: 30px;
   line-height: 40px;
   font-weight: 400;
   color: #ffffff;
   transition: all 500ms ease;
 }

 .project-block-one .inner-box .icon-box a {
   color: #ffffff;
 }

 .project-block-one .inner-box .icon-box a:hover {
   color: #f18f20;
 }

 .project-block-one:hover .icon-box {
   top: 30px;
 }

 .project-section .load-btns {
   position: relative;
   display: block;
   margin-top: 43px;
 }

 .project-section .load-btns a {
   position: relative;
   display: inline-block;
   font-size: 18px;
   line-height: 28px;
   font-family: 'Oswald', sans-serif;
   font-weight: 600;
   color: #f18f20;
   letter-spacing: 1px;
   text-transform: uppercase;
   text-decoration: underline;
 }

 .project-section .load-btns a:hover {
   color: #222222;
 }


 /** testimonial-section **/

 .testimonial-section {
   position: relative;
   display: block;
   padding: 40px 0px 100px 0px;
 }

 .testimonial-section:before {
   position: absolute;
   content: '';
   background: url(../images/background/testimonial-pattern.png);
   width: 60%;
   height: 500px;
   left: 0px;
   top: 80px;
   background-repeat: no-repeat;
   background-size: cover;
 }

 .testimonial-section .owl-nav,
 .testimonial-section .owl-dots {
   display: none;
 }

 .testimonial-section .sec-title {
   position: relative;
   display: block;
   margin-bottom: 37px;
 }

 .testimonial-block-one .author {
   position: relative;
   display: block;
   padding: 14px 0px 14px 95px;
 }

 .testimonial-block-one .author .author-thumb {
   position: absolute;
   left: 0px;
   top: 0px;
   width: 70px;
   height: 70px;
   border-radius: 50%;
   overflow: hidden;
 }

 .testimonial-block-one .author .author-thumb img {
   width: 100%;
   border-radius: 50%;
 }

 .testimonial-block-one .text p {
   position: relative;
   display: block;
   margin-bottom: 23px;
 }

 .testimonial-block-one .author .author-info h5 {
   position: relative;
   display: block;
   font-size: 18px;
   line-height: 20px;
   color: #222222;
   font-weight: 500;
   margin-bottom: 3px;
 }

 .testimonial-block-one .author .author-info span {
   position: relative;
   display: block;
   font-size: 12px;
   line-height: 20px;
   font-family: 'Oswald', sans-serif;
   font-weight: 300;
   color: #222222;
 }

 /** fact-counter **/

 .fact-counter {
   position: relative;
   display: block;
   /*padding: 44px 0px 50px 0px;*/
 }

 .counter-block-one {
   position: relative;
   display: block;
 }

 .counter-block-one .count-outer span {
   position: relative;
   display: inline-block;
   font-size: 36px;
   line-height: 40px;
   font-family: 'Oswald', sans-serif;
   font-weight: 700;
   color: #222222;
   margin-bottom: 9px;
   text-shadow: none;
 }

 .counter-block-one .text h3 {
   position: relative;
   display: block;
   font-size: 22px;
   line-height: 30px;
   font-family: 'Oswald', sans-serif;
   color: #222222;
   font-weight: 300;
   text-transform: uppercase;
 }


 /** team-section **/

 .team-section {
   position: relative;
   display: block;
   padding: 126px 0px 62px 0px;
 }

 .team-section:before {
   position: absolute;
   content: '';
   background: url(../images/background/team-pattern.jpg);
   width: 45%;
   height: 570px;
   top: 70px;
   right: 0px;
   background-repeat: no-repeat;
   background-size: cover;
 }

 .team-section .owl-dots {
   display: none;
 }

 .team-section .owl-nav {
   position: absolute;
   right: 0px;
   top: -77px;
 }

 .team-section .sec-title {
   margin-bottom: 35px;
 }

 .team-section .sec-title h1 {
   margin-bottom: 4px;
 }

 .team-section .line-overlay .line:after,
 .team-section .line-overlay .line:before {
   background: #f18f20;
 }

 .team-block-one {
   position: relative;
   display: block;
 }

 .team-block-one .image-box {
   position: relative;
   display: block;
   background: #fff;
   padding: 9px;
   border: 1px solid #ececec;
   transition: all 500ms ease;
 }

 .team-block-one .image-box .image {
   position: relative;
   display: block;
   overflow: hidden;
   background: #000;
 }

 .team-block-one:hover .image-box {
   border: 1px solid #f18f20;
 }

 .team-block-one .image-box img {
   width: 100%;
   transition: all 300ms ease;
 }

 .team-block-one:hover .image-box img {
   transform: scale(1.03);
   opacity: 0.4;
 }

 .team-block-one .lower-content {
   position: relative;
   display: block;
   padding-top: 25px;
 }

 .team-block-one .lower-content h3 {
   position: relative;
   display: block;
   font-size: 24px;
   line-height: 30px;
   color: #222222;
   margin-bottom: 10px;
 }

 .team-block-one .lower-content h3 a {
   position: relative;
   display: inline-block;
   color: #222222;
 }

 .team-block-one .lower-content h3 a:hover {
   color: #f18f20;
 }

 .team-block-one .lower-content span {
   position: relative;
   display: block;
   font-size: 14px;
   line-height: 20px;
   text-transform: uppercase;
   color: #222222;
   font-weight: 600;
 }

 /** clients-section **/

 .clients-section {
   position: relative;
   display: block;
   padding: 0px;
 }

 .clients-section .clients-outer {
   position: relative;
   display: block;
   border: 1px solid #ddece6;
   padding: 45px 30px 44px 30px;
 }

 .clients-section .clients-outer {
   position: relative;
 }

 .clients-section .image-box {
   position: relative;
   display: block;
   text-align: center;
   margin-bottom: 0;
 }

 .clients-section .image-box img {
   display: block;
   max-width: 100%;
   width: auto;
   margin: 0 auto;
   opacity: 0.4;
   -webkit-transition: all 300ms ease;
   -moz-transition: all 300ms ease;
   -ms-transition: all 300ms ease;
   -o-transition: all 300ms ease;
   transition: all 300ms ease;
 }

 .clients-section .slide-item:hover .image-box img {
   opacity: 1;
 }

 .clients-section .owl-nav,
 .clients-section .owl-dots {
   display: none;
 }


 /** news-section **/

 .news-section {
   position: relative;
   display: block;
   padding: 92px 0px 142px 0px;
 }

 .news-section .sec-title {
   margin-bottom: 50px;
 }

 .news-block-one {
   position: relative;
   display: block;
   box-shadow: 0 5px 20px rgba(34, 34, 34, 0.10);
   transition: all 500ms ease;
 }

 .news-block-one .image-box {
   position: relative;
   overflow: hidden;
   display: block;
   background: #000;
   transition: all 500ms ease;
 }

 .news-block-one .image-box img {
   width: 100%;
   opacity: 1;
   transform: scale(1);
   transition: all 1500ms ease;
 }

 .news-block-one:hover .image-box img {
   opacity: 0.4;
   transform: scale(1.3);
 }

 .news-block-one .lower-content {
   position: relative;
   display: block;
   padding: 21px 15px 32px 30px;
 }

 .news-block-one .lower-content .post-info {
   position: relative;
   display: block;
   margin-bottom: 17px;
 }

 .news-block-one .lower-content .post-info li {
   position: relative;
   display: inline-block;
   font-size: 14px;
   font-family: 'Oswald', sans-serif;
   font-weight: 400;
   color: #a4b3c1;
   margin-right: 35px;
 }

 .news-block-one .lower-content .post-info li:last-child {
   margin-right: 0px;
 }

 .news-block-one .lower-content .post-info li i {
   margin-right: 10px;
 }

 .news-block-one .lower-content h4 {
   position: relative;
   display: block;
   font-size: 18px;
   line-height: 28px;
   color: #222222;
   font-weight: 600;
 }

 .news-block-one .lower-content h4 a {
   position: relative;
   display: inline-block;
   color: #222222;
 }

 .news-block-one .lower-content h4 a:hover {
   color: #f18f20;
 }


 /** main-footer **/

 .main-footer {
   position: relative;
   display: block;
   width: 100%;
   color: #c6c6c5;
   background-size: cover;
   background-repeat: no-repeat;
   background-position: center center;
   /* padding: 86px 0px 80px 0px;*/
 }

 .main-footer:before {
   position: absolute;
   content: '';
   background: rgba(0, 70, 135, 0.95);
   width: 100%;
   height: 100%;
   left: 0px;
   top: 0px;
 }

 .main-footer .logo-widget {
   position: relative;
   margin-top: 11px;
 }

 .main-footer .logo-widget .footer-logo {
   position: relative;
   margin-bottom: 24px;
 }

 .main-footer .logo-widget .text {
   position: relative;
   display: block;
   margin-bottom: 30px;
 }

 .main-footer .logo-widget .social-links li {
   position: relative;
   display: inline-block;
   margin-right: 12px;
 }

 .main-footer .logo-widget .social-links li:last-child {
   margin-right: 0px;
 }

 .main-footer .logo-widget .social-links li a {
   position: relative;
   display: inline-block;
   font-size: 14px;
   color: #004687;
   width: 45px;
   height: 45px;
   line-height: 45px;
   background: #ffffff;
   text-align: center;
   border-radius: 50%;
 }

 .main-footer .logo-widget .social-links li a:hover {
   background: #004687;
   color: #ffffff;
   transform: rotate(360deg);
   -moz-transform: rotate(360deg);
   -webkit-transform: rotate(360deg);
 }

 .main-footer .widget-title {
   position: relative;
   display: block;
   font-size: 20px;
   line-height: 30px;
   color: #ffffff;
   font-weight: 700;
   text-transform: uppercase;
   margin-bottom: 18px;
 }

 .main-footer .post-widget .post {
   position: relative;
   display: block;
   padding-bottom: 18px;
   border-bottom: 1px solid rgba(255, 255, 255, 0.1);
   margin-bottom: 20px;
 }

 .main-footer .post-widget .post a {
   position: relative;
   display: block;
   font-size: 14px;
   color: #c6c6c5;
 }

 .main-footer .post-widget .post a:hover {
   color: #f18f20;
 }

 .main-footer .gallery-widget .widget-content {
   position: relative;
   display: block;
   margin: 0px -3px 0px -4px;
 }

 .main-footer .gallery-widget .widget-content .list li {
   position: relative;
   float: left;
   width: 85px;
   height: 85px;
   overflow: hidden;
   background: #f18f20;
   margin: 0px 3px 7px 4px;
 }

 .main-footer .gallery-widget .widget-content .list li img {
   width: 100%;
   opacity: 1;
   transition: all 500ms ease;
 }

 .main-footer .gallery-widget .widget-content .list li:hover img {
   opacity: 0.2;
   transform: scale(1.05);
 }

 .main-footer .gallery-widget .widget-title {
   margin-bottom: 24px;
 }

 .main-footer .contact-widget .list li {
   position: relative;
   display: block;
   font-size: 14px;
   color: #c6c6c5;
   margin-bottom: 23px;
 }

 .main-footer .contact-widget .list li a {
   position: relative;
   display: inline-block;
   color: #c6c6c5;
 }

 .main-footer .contact-widget .list li a:hover {
   color: #f18f20;
 }

 .main-footer .contact-widget .list li:last-child {
   margin-bottom: 0px;
 }

 .main-footer .contact-widget .list li span {
   position: relative;
   display: block;
   color: #f18f20;
 }

 .main-footer .footer-bottom .copyright {
   position: relative;
   display: block;
 }

 .main-footer .footer-bottom .copyright a {
   position: relative;
   font-size: 14px;
   font-family: 'Open Sans', sans-serif;
   color: #f18f20;
 }

 .main-footer .footer-bottom .copyright a:hover {
   color: #ffffff;
 }

 .main-footer .widget-section {
   position: relative;
   display: block;
   /* padding-bottom: 20px;*/
 }


 /*** 

====================================================================
                        Home-Page-Two
====================================================================

***/

 /** slider-style-two **/



 .main-slider.style-two h1,
 .main-slider.style-three h1,
 .main-slider.style-four h1,
 .main-slider.style-five h1,
 .main-slider.style-six h1 {
   font-size: 120px;
   line-height: 130px;
   margin-bottom: 26px;
   letter-spacing: 20px;
 }

 .main-slider.style-two h2,
 .main-slider.style-three h2,
 .main-slider.style-four h2,
 .main-slider.style-five h2,
 .main-slider.style-six h2 {
   position: relative;
   display: block;
   font-size: 30px;
   line-height: 40px;
   color: #ffffff;
   font-weight: 700;
   text-transform: uppercase;
 }

 .main-slider.style-four h1,
 .main-slider.style-five h1,
 .main-slider.style-six h1 {
   font-size: 80px;
   text-transform: capitalize;
   letter-spacing: 0px;
 }

 .main-slider.style-three h1 {
   text-transform: uppercase;
 }

 .main-slider.style-two .mouse-btn-down {
   bottom: 120px;
 }

 .main-slider.style-six .mouse-btn-down {
   bottom: 120px;
 }


 /** about-style-two **/

 .about-style-two {
   position: relative;
   display: block;
   padding: 186px 0px 112px 0px;
 }

 .about-style-two:before {
   position: absolute;
   content: '';
   background: url(../images/background/about-pattern.png);
   width: 65%;
   height: 490px;
   right: 0px;
   top: 0px;
   background-size: cover;
   background-repeat: no-repeat;
 }

 .about-style-two .image-box {
   position: relative;
   display: block;
   padding: 0px 100px 0px 70px;
 }

 .about-style-two .image-box img {
   width: 100%;
 }

 .about-style-two .image-box .rotate-text {
   position: absolute;
   left: -200px;
   bottom: 230px;
   font-size: 36px;
   line-height: 40px;
   font-weight: 700;
   color: #f5f5f5;
   text-transform: uppercase;
   letter-spacing: 20px;
 }

 .about-style-two .image-box .rotate-text:before {
   background: #a7a7a7;
   top: 15px;
 }

 .about-style-two .image-box .image {
   position: relative;
   background: #000;
 }

 .about-style-two .image-box .image img {
   width: 100%;
   opacity: 0.2;
 }

 .about-style-two .image-box .image h2 {
   position: absolute;
   left: 45px;
   bottom: 50px;
   font-size: 36px;
   font-weight: 700;
   color: #ffffff;
   line-height: 46px;
 }

 .about-style-two .content-box {
   position: relative;
   display: block;
   padding-right: 206px;
   margin-top: 54px;
 }

 .about-style-two .content-box .top-title {
   position: relative;
   display: block;
   font-size: 12px;
   font-family: 'Oswald', sans-serif;
   font-weight: 700;
   line-height: 20px;
   color: #222222;
   text-transform: uppercase;
   margin-bottom: 5px;
 }

 .about-style-two .sec-title h1:before {
   bottom: 39px;
 }

 .about-style-two .content-box .text {
   position: relative;
   display: block;
   font-size: 16px;
   line-height: 30px;
   margin-bottom: 27px;
 }

 .about-style-two .content-box .sec-title {
   margin-bottom: 14px;
 }

 .about-style-two .content-box a {
   position: relative;
   display: inline-block;
   font-size: 16px;
   font-family: 'Oswald', sans-serif;
   font-weight: 600;
   color: #222222;
   text-transform: uppercase;
 }

 .about-style-two .content-box a:hover {
   color: #f18f20;
 }

 .about-style-two .content-box a:before {
   position: absolute;
   content: '';
   background: #d7d7d7;
   width: 115px;
   height: 1px;
   top: 12px;
   right: -128px;
 }


 /** service-style-two **/

 .service-style-two {
   position: relative;
   display: block;
   padding: 133px 0px 198px 0px;
 }

 .service-style-two .icon-layer {
   position: absolute;
   left: 0px;
   bottom: 0px;
   width: 325px;
   height: 380px;
   background: url(../images/icons/service-icon.png);
   background-repeat: no-repeat;
 }

 .service-style-two .inner-content {
   position: relative;
   display: block;
   padding-top: 100px;
 }

 .service-style-two .inner-content .sec-title {
   margin-bottom: 6px;
 }

 .service-style-two .inner-content .sec-title h1 {
   z-index: 1;
 }

 .service-style-two .inner-content .text {
   position: relative;
   display: block;
   margin-bottom: 34px;
 }

 .service-style-two .inner-content .link a {
   position: relative;
   display: inline-block;
   font-size: 16px;
   line-height: 26px;
   color: #222222;
   font-weight: 600;
   font-family: 'Oswald', sans-serif;
   border: 1px solid #dadada;
   text-transform: uppercase;
   text-align: center;
   padding: 11px 29px;
 }

 .service-style-two .inner-content .link a:hover {
   border: 1px solid #f18f20;
   background: #f18f20;
   color: #ffffff;
 }

 .service-style-two .carousel-content {
   position: relative;
   display: block;
   margin-right: -375px;
 }

 .service-style-two .service-block-one {
   box-shadow: 0 0 14px rgba(34, 34, 34, 0.20);
 }

 .service-style-two .service-block-one .image-box img {
   opacity: 1;
   transition: all 500ms ease;
 }

 .service-style-two .service-block-one:hover .image-box img {
   opacity: 0.2;
 }

 .service-style-two .owl-dots {
   display: none;
 }

 .service-style-two .owl-nav {
   position: absolute;
   left: 50%;
   bottom: -90px;
   margin-left: -70px;
 }


 /** work-style-two **/

 .work-style-two {
   position: relative;
   display: block;
   padding: 97px 0px 70px 0px;
 }

 .work-style-two .sec-title {
   position: relative;
   max-width: 680px;
   width: 100%;
   margin: 0 auto;
   padding-bottom: 52px;
 }

 .work-style-two .sec-title h1 {
   margin-bottom: 8px;
 }

 .work-block-one {
   position: relative;
   display: block;
   background: #ffffff;
   border: 1px solid #f7f7f7;
   padding: 30px 15px 46px 20px;
   margin-bottom: 30px;
   transition: all 500ms ease;
 }

 .work-block-one:hover {
   box-shadow: -15px 5px 30px rgba(229, 229, 229, 0.50);
   transform: translateY(-15px);
 }

 .work-block-one h4 {
   position: relative;
   display: block;
   font-size: 20px;
   line-height: 30px;
   color: #222222;
   font-weight: 600;
   text-transform: uppercase;
   margin-bottom: 25px;
   padding-left: 50px;
 }

 .work-block-one h4:before {
   position: absolute;
   content: '';
   background: #7d6740;
   height: 2px;
   width: 35px;
   top: 12px;
   left: 0px;
 }

 .work-block-one h4 a {
   position: relative;
   display: inline-block;
   color: #222222;
 }

 .work-block-one h4 a:hover {
   color: #f18f20;
 }

 .work-block-one .count-text {
   font-size: 48px;
   line-height: 60px;
   position: absolute;
   top: 8px;
   right: 30px;
   text-shadow: -1px -1px 0 #e0e0e0, 1px -1px 0 #e0e0e0, -1px 1px 0 #e0e0e0, 1px 1px 0 #e0e0e0;
 }

 .work-block-one .text {
   position: relative;
   display: block;
   margin-bottom: 39px;
 }

 .work-block-one .link a {
   position: relative;
   display: inline-block;
   font-size: 14px;
   font-family: 'Oswald', sans-serif;
   color: #222222;
   font-weight: 600;
   text-transform: uppercase;
 }

 .work-block-one .link a:hover {
   text-decoration: underline;
 }


 /** project-style-two **/

 .project-style-two {
   position: relative;
   display: block;
   padding: 93px 0px 0px 0px;
 }

 .project-style-two .sec-title {
   margin-bottom: 47px;
 }

 .project-style-two .sec-title h1 {
   z-index: 1;
 }

 .project-style-two .project-title {
   color: #f8f8f8;
   top: 60px;
 }

 .project-block-two {
   position: relative;
   display: block;
   background: #ffffff;
   box-shadow: 0 0 14px rgba(34, 34, 34, 0.10);
   margin-bottom: 60px;
   transition: all 500ms ease;
 }

 .project-block-two .image-box {
   position: relative;
   display: block;
   overflow: hidden;
   background: #000;
 }

 .project-block-two .image-box img {
   width: 100%;
   opacity: 1;
   transition: all 500ms ease;
 }

 .project-block-two:hover .image-box img {
   opacity: 0.7;
   transform: scale(1.05);
 }

 .project-block-two .content-box {
   position: relative;
   display: block;
   padding: 30px;
 }

 .project-block-two .content-box .top-content {
   position: relative;
   display: block;
   padding-bottom: 27px;
   margin-bottom: 20px;
   border-bottom: 2px solid #f6f6f6;
 }

 .project-block-two .content-box .icon-box {
   position: relative;
   display: block;
   font-size: 60px;
   line-height: 60px;
   color: #222222;
   margin-bottom: 36px;
 }

 .project-block-two .content-box .count-text {
   position: absolute;
   top: -40px;
   right: -40px;
 }

 .project-block-two .content-box h2 {
   position: relative;
   display: block;
   font-size: 30px;
   line-height: 40px;
   color: #222222;
   font-weight: 700;
 }

 .project-block-two .content-box h2 a {
   position: relative;
   display: inline-block;
   color: #222222;
 }

 .project-block-two .content-box h2 a:hover {
   color: #f18f20;
 }

 .project-block-two .content-box .text {
   position: relative;
   display: block;
   margin-bottom: 11px;
 }

 .project-block-two .content-box .link a {
   position: relative;
   display: inline-block;
   font-size: 14px;
   font-family: 'Oswald', sans-serif;
   font-weight: 600;
   color: #222222;
   text-transform: uppercase;
 }

 .project-block-two .content-box .link a:hover {
   text-decoration: underline;
 }

 .project-block-two .content-box .count-text {
   text-shadow: -1px -1px 0 #e0e0e0, 1px -1px 0 #e0e0e0, -1px 1px 0 #e0e0e0, 1px 1px 0 #e0e0e0;
 }

 .project-style-two .view-btn a {
   position: relative;
   display: inline-block;
   font-size: 14px;
   font-family: 'Oswald', sans-serif;
   font-weight: 700;
   color: #222222;
   text-transform: uppercase;
   text-decoration: underline;
 }

 .project-style-two .view-btn a:hover {
   color: #f18f20;
 }

 .news-style-two {
   padding: 60px 0px 70px 0px;
 }

 .clients-section.alternate-2 {
   padding: 50px 0px;
 }

 .testimonial-section.alternate-2 {
   padding-top: 107px;
 }

 .testimonial-section.alternate-2:before {
   top: 145px;
 }


 /** google-map-section **/

 .google-map-section {
   position: relative;
   width: 100%;
 }

 #contact-google-map {
   position: relative;
   display: block;
   width: 100%;
   height: 615px;
 }


 /*** 

====================================================================
                        Home-Page-Three
====================================================================

***/

 /** header-style-three **/

 .header-style-three {
   position: relative;
   display: block;
   width: 100%;
 }

 .header-style-three .header-upper {
   position: absolute;
   width: 100%;
   left: 0px;
   top: 90px;
 }

 .header-style-three .inner-container {
   position: relative;
   display: block;
   background: rgba(34, 34, 34, 0.70);
   padding: 0px 40px 0px 30px;
 }

 .header-style-three .inner-container .logo-box {
   position: relative;
   margin-top: 25px;
 }

 .service-style-three {
   padding: 120px 0px 100px 0px;
 }

 .service-style-three .inner-content {
   padding: 0px;
   box-shadow: 0 0 20px rgba(34, 34, 34, 0.10);
 }


 /** about-style-three **/

 .about-style-three {
   position: relative;
   display: block;
   padding: 80px 0px 110px 0px;
 }

 .about-style-three .top-content {
   position: relative;
   display: block;
   margin-bottom: 54px;
 }

 .about-style-three .top-content .text {
   position: relative;
   display: block;
   padding-top: 32px;
 }

 .about-style-three .lower-content .image-box img {
   width: 100%;
 }

 .about-style-three .lower-content .content-box {
   position: relative;
   display: block;
   margin-left: 100px;
   padding-top: 190px;
   margin-right: 30px;
 }

 .about-style-three .lower-content .content-box .text {
   position: relative;
   display: block;
   font-size: 18px;
   line-height: 28px;
   font-weight: 600;
   margin-bottom: 26px;
 }

 .about-style-three .lower-content .content-box .sign {
   position: relative;
   display: inline-block;
 }


 /** video-style-two **/

 .video-style-two {
   position: relative;
   display: block;
   width: 100%;
   background-size: cover;
   background-repeat: no-repeat;
   background-position: center center;
   padding: 159px 0px 164px 0px;
   background-attachment: fixed;
 }

 .video-style-two:before {
   position: absolute;
   content: '';
   background: rgba(34, 34, 34, 0.85);
   width: 100%;
   height: 100%;
   left: 0px;
   top: 0px;
 }

 .video-style-two .inner-content .top-text {
   position: relative;
   display: block;
   font-size: 14px;
   font-family: 'Oswald', sans-serif;
   font-weight: 300;
   color: #f18f20;
   text-transform: uppercase;
   margin-bottom: 17px;
 }

 .video-style-two .inner-content h1 {
   position: relative;
   display: block;
   font-size: 72px;
   line-height: 80px;
   font-weight: 700;
   color: #ffffff;
   margin-bottom: 43px;
 }

 .video-style-two .inner-content .video-link {
   position: relative;
   display: inline-block;
   font-size: 24px;
   color: #ffffff;
   width: 113px;
   height: 113px;
   line-height: 113px;
   text-align: center;
   border: 1px solid #ffffff;
   border-radius: 50%;
 }

 .video-style-two .inner-content .video-link:hover {
   background: #ffffff;
   color: #f18f20;
 }

 .parallax-scene {
   position: absolute;
   left: 0;
   top: 0;
   width: 100%;
   height: 100%;
 }

 .anim-icons {
   position: absolute;
   left: 0;
   top: 0;
   right: 0;
   height: 100%;
   width: 100%;
   max-width: 1920px;
   margin: 0 auto;
 }

 .anim-icons .icon {
   position: absolute;
 }

 .anim-icons .icon-1 {
   left: 150px !important;
   top: 200px !important;
   background: url(../images/icons/icon-1.png);
   width: 34px;
   height: 37px;
   background-repeat: no-repeat;
 }

 .anim-icons .icon-2 {
   left: 350px !important;
   top: 400px !important;
   background: url(../images/icons/icon-2.png);
   width: 36px;
   height: 36px;
   background-repeat: no-repeat;
 }

 .anim-icons .icon-3 {
   left: 50% !important;
   top: 100px !important;
   background: url(../images/icons/icon-3.png);
   width: 34px;
   height: 37px;
   background-repeat: no-repeat;
 }

 .anim-icons .icon-4 {
   left: 70% !important;
   top: 150px !important;
   background: url(../images/icons/icon-4.png);
   width: 36px;
   height: 27px;
   background-repeat: no-repeat;
 }

 .anim-icons .icon-5 {
   left: auto !important;
   top: 150px !important;
   right: 200px !important;
   background: url(../images/icons/icon-5.png);
   width: 26px;
   height: 37px;
   background-repeat: no-repeat;
 }

 .anim-icons .icon-6 {
   left: auto !important;
   top: 450px !important;
   right: 150px !important;
   background: url(../images/icons/icon-6.png);
   width: 31px;
   height: 37px;
   background-repeat: no-repeat;
 }

 .fact-counter.alternate-2 {
   padding: 118px 0px 50px 0px;
 }


 /** recent-project **/

 .recent-project {
   position: relative;
   display: block;
   padding: 66px 0px 60px 0px;
 }

 .recent-project .sec-title {
   margin-bottom: 30px;
 }

 .recent-project .project-block-one {
   margin-bottom: 30px;
 }

 .recent-project .load-more a {
   position: relative;
   display: inline-block;
   font-size: 18px;
   line-height: 28px;
   font-family: 'Oswald', sans-serif;
   font-weight: 500;
   color: #f18f20;
   text-transform: uppercase;
   letter-spacing: 1px;
   text-decoration: underline;
 }

 .recent-project .load-more {
   position: relative;
   display: block;
   padding-top: 13px;
 }

 .recent-project .load-more a:hover {
   color: #222222;
 }

 .recent-project .project-title {
   top: 50px;
   text-shadow: -1px -1px 0 #e7e7e5, 1px -1px 0 #e7e7e5, -1px 1px 0 #e7e7e5, 1px 1px 0 #e7e7e5;
 }


 /** client-style-two **/

 .client-style-two {
   position: relative;
   display: block;
   padding: 51px 0px 108px 0px;
 }

 .client-style-two .inner-content {
   position: relative;
   display: block;
   margin-left: 100px;
 }

 .client-style-two .inner-content .clients-logo li {
   position: relative;
   float: left;
   width: 33.333%;
   overflow: hidden;
   margin-bottom: 70px;
 }

 .client-style-two .inner-content .clients-logo li img {
   position: relative;
   opacity: 1;
   transition: all 500ms ease;
 }

 .client-style-two .inner-content .clients-logo li:hover img {
   opacity: 0.4;
   transform: scale(1.03);
 }

 .client-style-two .sec-title {
   position: relative;
   margin-top: 22px;
 }

 .client-style-two .sec-title h1 {
   line-height: 62px;
 }

 .client-style-two .sec-title h1:before {
   bottom: 62px;
 }

 .client-style-two .sec-title .top-title {
   margin-bottom: 8px;
 }


 /** call-to-action **/

 .call-to-action {
   position: relative;
   display: block;
   padding: 60px 0px 170px 0px;
 }

 .call-to-action .content-box {
   position: relative;
   display: block;
   padding-top: 78px;
 }

 .call-to-action .content-box h2 {
   position: relative;
   display: block;
   font-size: 30px;
   line-height: 40px;
   color: #222222;
   font-weight: 700;
   text-transform: uppercase;
   margin-bottom: 31px;
 }

 .call-to-action .content-box .text {
   position: relative;
   display: block;
   font-size: 18px;
   line-height: 28px;
   margin-bottom: 16px;
   font-weight: 600;
   color: #222222;
 }

 .call-to-action .inner-content {
   position: relative;
   display: block;
   margin-left: 70px;
 }

 .call-to-action .inner-content .appointment-form {
   position: absolute;
   left: 0px;
   top: 75px;
   display: block;
   max-width: 364px;
   width: 100%;
   background: #ffffff;
   padding: 45px 30px 39px 30px;
   box-shadow: 0 0px 20px rgba(34, 34, 34, 0.10);
   z-index: 1;
 }

 .call-to-action .inner-content .appointment-form .form-group {
   position: relative;
   display: block;
   margin-bottom: 19px;
 }

 .call-to-action .inner-content .appointment-form .form-group:last-child {
   margin-bottom: 0px;
 }

 .call-to-action .inner-content .appointment-form .form-group input[type='text'],
 .call-to-action .inner-content .appointment-form .form-group input[type='email'],
 .call-to-action .inner-content .appointment-form .form-group textarea {
   position: relative;
   display: block;
   width: 100%;
   height: 45px;
   border: 1px solid #e9e9e9;
   padding: 10px 20px;
   font-size: 12px;
   font-family: 'Oswald', sans-serif;
   color: #222;
   transition: all 500ms ease;
 }

 .call-to-action .inner-content .appointment-form .form-group textarea {
   height: 105px;
   resize: none;
 }

 .call-to-action .inner-content .appointment-form .form-group button {
   position: relative;
   display: inline-block;
   font-size: 14px;
   font-family: 'Oswald', sans-serif;
   font-weight: 600;
   color: #222222;
   background: transparent;
   text-transform: uppercase;
   text-decoration: underline;
   cursor: pointer;
   transition: all 500ms ease;
 }

 .call-to-action .inner-content .appointment-form .form-group button:hover {
   color: #f18f20;
 }

 .call-to-action .inner-content .appointment-form .form-group input:focus,
 .call-to-action .inner-content .appointment-form .form-group textarea:focus {
   border: 1px solid #f18f20;
 }

 .call-to-action .inner-content .appointment-form ::-webkit-input-placeholder {
   color: #a8b1b6;
 }

 .call-to-action .inner-content .appointment-form ::-moz-placeholder {
   color: #a8b1b6;
 }

 .call-to-action .inner-content .appointment-form :-ms-input-placeholder {
   color: #a8b1b6;
 }

 .call-to-action .inner-content .appointment-form :-moz-placeholder {
   color: #a8b1b6;
 }

 .call-to-action .inner-content .google-map-area {
   position: relative;
   display: block;
   margin-left: 130px;
 }

 .call-to-action .inner-content #contact-google-map {
   position: relative;
   width: 100%;
   height: 462px;
 }


 /*** 

====================================================================
                        Home-Page-Four
====================================================================

***/


 /** header-style-four **/

 .header-style-four {
   position: relative;
   display: block;
 }

 .header-style-four .header-upper {
   /*position: absolute;
   left: 0px;
   top: 32px;*/
   width: 100%;
 }

 .header-style-four .header-upper .inner-container {
   position: relative;
   display: block;
   padding: 0px 20px 0px 20px;
 }

 .header-style-four .header-upper .logo-box {
   position: relative;
   margin-top: 10px;
 }

 .header-style-four .search-box-area {
   left: 0px;
 }


 /** slider-style-three **/



 .main-slider.style-three h2 {
   position: relative;
   display: block;
   font-size: 30px;
   line-height: 40px;
   font-weight: 700;
   color: #ffffff;
   text-transform: uppercase;
 }

 .about-style-three.alternate-2 {
   padding: 112px 0px 0px 0px;
 }

 .about-style-three.alternate-2 .top-content {
   margin-bottom: 64px;
 }

 .team-section.alternate-2 {
   padding: 122px 0px 117px 0px;
 }

 .client-style-two.alternate-2 {
   padding: 96px 0px 47px 0px;
 }


 /** service-style-four **/


 .service-style-four {
   position: relative;
 }

 .service-block-two {
   position: relative;
   display: block;
   padding: 0px 0px 0px 70px;
   margin-bottom: 60px;
 }

 .service-block-two .icon-box {
   position: absolute;
   left: 0px;
   top: 0px;
   font-size: 45px;
   line-height: 45px;
   color: #222222;
   transition: all 500ms ease;
 }

 .service-block-two:hover .icon-box {
   color: #f18f20;
 }

 .service-block-two h5 {
   position: relative;
   display: block;
   font-size: 18px;
   line-height: 28px;
   color: #222222;
   font-weight: 400;
   margin-bottom: 20px;
 }

 .service-block-two h5 a {
   position: relative;
   display: inline-block;
   color: #222222;
 }

 .service-block-two h5 a:hover {
   color: #f18f20;
 }

 .service-block-two .text {
   position: relative;
   display: block;
 }


 /*** 

====================================================================
                        Home-Page-Five
====================================================================

***/

 .about-style-three.alternate-2 .service-block {
   position: relative;
   display: block;
   padding-top: 31px;
 }

 .about-style-three.alternate-2 .service-block-two .text {
   padding-top: 0px;
 }

 .project-style-two.black-bg {
   position: relative;
   display: block;
 }

 .project-style-two.black-bg:before {
   position: absolute;
   content: '';
   /* background: url(../images/background/project-bg.png); */
   width: 100%;
   height: 100%;
   left: 0px;
   top: 0px;
   background-size: cover;
   background-repeat: no-repeat;
 }

 .project-style-two.black-bg .sec-title h1 {
   color: #ffffff;
 }

 .project-style-two.black-bg .project-title {
   color: #111;
   text-shadow: -1px -1px 0 #535351, 1px -1px 0 #535351, -1px 1px 0 #535351, 1px 1px 0 #535351;
 }

 .pad-left-50 {
   padding-left: 50px !important;
 }

 .project-style-two.black-bg .view-btn a {
   color: #ffffff;
 }

 .project-style-two.black-bg .view-btn a:hover {
   color: #f18f20;
 }

 .clients-section.alternate-3 {
   padding: 60px 0px 120px 0px;
 }


 /*** 

====================================================================
                        Home-Page-Five
====================================================================

***/


 /** slider-style-five **/

 .main-slider.style-six:after {
   position: absolute;
   content: '';
   background: #ffffff;
   width: 100%;
   height: 150px;
   left: 0px;
   bottom: 0px;
   top: inherit;
   clip-path: polygon(0% 26%, 100% 100%, 100% 100%, 0% 100%, 0% 0%);
 }


 /** project-masonary **/

 .project-masonary {
   position: relative;
   display: block;
   padding: 135px 0px 0px 0px;
 }

 .project-masonary .lower-text {
   position: relative;
   top: -163px;
   left: 30px;
   width: 100%;
   z-index: 1;
 }

 .project-masonary .lower-text .text {
   position: relative;
   display: inline-block;
   font-size: 18px;
   font-family: 'Oswald', sans-serif;
   color: #7a7a7a;
   font-weight: 300;
   line-height: 28px;
   letter-spacing: 10px;
   text-transform: uppercase;
 }

 .project-masonary .lower-text .text:before {
   position: absolute;
   content: '';
   background: #b8b8b8;
   width: 60px;
   height: 1px;
   right: -70px;
   bottom: 9px;
 }

 .project-block-one .lower-content {
   position: relative;
   display: block;
   padding-top: 33px;
   max-width: 330px;
   width: 100%;
 }

 .project-block-one .lower-content h4 {
   position: relative;
   display: block;
   font-size: 20px;
   line-height: 30px;
   color: #222222;
   font-weight: 600;
   margin-bottom: 15px;
 }

 .project-block-one .lower-content h4 a {
   position: relative;
   display: inline-block;
   color: #222222;
 }

 .project-block-one .lower-content h4 a:hover {
   color: #f18f20;
 }

 .project-masonary .inner-column:last-child {
   padding-top: 170px;
 }

 .project-masonary .project-block-one {
   margin-bottom: 60px;
 }

 .client-style-two.alternate-3 {
   padding: 36px 0px 60px 0px;
 }

 /** pricing-section **/

 .pricing-section {
   position: relative;
   display: block;
 }

 .pricing-section .top-content {
   position: relative;
   width: 100%;
   background-size: cover;
   background-repeat: no-repeat;
   background-position: center center;
   padding: 80px 0px 200px 0px;
 }

 .pricing-section .top-content:before {
   position: absolute;
   content: '';
   background: rgba(34, 34, 34, 0.85);
   width: 100%;
   height: 100%;
   left: 0px;
   top: 0px;
 }

 .pricing-section .top-content:after {
   position: absolute;
   content: '';
   background: url(../images/background/service-bg.png);
   width: 100%;
   height: 36px;
   left: 0px;
   top: 0px;
   background-repeat: no-repeat;
   background-size: cover;
 }

 .pricing-section .top-content .title-box h1 {
   position: relative;
   display: block;
   font-size: 45px;
   line-height: 62px;
   font-weight: 700;
   color: #ffffff;
   margin-bottom: 26px;
   text-transform: uppercase;
 }

 .pricing-section .top-content .title-box h1 span {
   font-weight: 300;
 }

 .pricing-section .lower-content {
   display: block;
   background: #ffffff;
   padding-bottom: 75px;
 }

 .pricing-section .lower-content .inner-content {
   position: relative;
   display: block;
   margin-top: -166px;
 }

 .pricing-table {
   position: relative;
   display: block;
   background: #ffffff;
   border-top: 5px solid #c4c4c4;
   padding: 33px 30px 57px 38px;
   box-shadow: 0 0 15px rgba(34, 34, 34, 0.10);
   transition: all 500ms ease;
 }

 .pricing-table:hover {
   border-top: 5px solid #003087;
   transform: translateY(-20px);
 }

 .pricing-table .table-header h3 {
   position: relative;
   display: block;
   font-size: 24px;
   line-height: 30px;
   font-weight: 700;
   color: #222222;
   margin-bottom: 14px;
 }

 .pricing-table .table-header .price {
   position: relative;
   display: block;
   font-size: 16px;
   font-family: 'Oswald', sans-serif;
   font-weight: 700;
   color: #f18f20;
   margin-bottom: 25px;
 }

 .pricing-table .table-header .price span {
   font-size: 14px;
   font-weight: 600;
   color: #222222;
 }

 .pricing-table .table-content .list {
   position: relative;
   display: block;
   margin-bottom: 22px;
 }

 .pricing-table .table-content li {
   position: relative;
   display: block;
   font-size: 14px;
   color: #222222;
   margin-bottom: 14px;
   padding: 0px 0px 0px 28px;
 }

 .pricing-table .table-content li:last-child {
   margin-bottom: 0px;
 }

 .pricing-table .table-content li:before {
   position: absolute;
   content: "\f058";
   font-family: 'Font Awesome 5 Free';
   left: 0px;
   top: 0px;
   font-size: 14px;
   color: #003087;
 }

 .pricing-table .table-content li:nth-child(5),
 .pricing-table .table-content li:nth-child(5):before,
 .pricing-table .table-content li:last-child,
 .pricing-table .table-content li:last-child:before,
 .pricing-column:first-child .pricing-table .table-content li:nth-child(4),
 .pricing-column:first-child .pricing-table .table-content li:nth-child(4):before {
   /* color: #c4c4c4; */
 }

 .pricing-column:last-child .pricing-table .table-content li:nth-child(5),
 .pricing-column:last-child .pricing-table .table-content li:last-child {
   color: #222222;
 }

 .pricing-column:last-child .pricing-table .table-content li:nth-child(5):before,
 .pricing-column:last-child .pricing-table .table-content li:last-child:before {
   color: #f18f20;
 }

 .pricing-table .table-footer a {
   position: relative;
   display: inline-block;
   font-size: 14px;
   font-family: 'Oswald', sans-serif;
   font-weight: 700;
   color: #222222;
   text-transform: uppercase;
   text-decoration: underline;
 }

 .pricing-table .table-footer a:hover {
   color: #f18f20;
 }

 .pricing-table .best-value {
   position: absolute;
   top: 90px;
   right: -10px;
   font-size: 16px;
   line-height: 26px;
   font-family: 'Oswald', sans-serif;
   font-weight: 600;
   color: #222222;
   text-transform: uppercase;
   transform: rotate(270deg);
 }

 .pricing-table .best-value:before {
   position: absolute;
   content: '';
   background: #33659a;
   height: 1px;
   width: 35px;
   top: 11px;
   right: -50px;
 }

 .call-to-action.alternate-2 {
   padding-top: 33px;
 }


 /*** 

====================================================================
                        Service-Page
====================================================================

***/

 /** page-title **/

 .page-title {
   position: relative;
   width: 100%;
   padding: 100px;
   padding-bottom: 80px !important;
   background-size: cover;
   background-repeat: no-repeat;
   background-position: center center;
 }

 .page-title:before {
   position: absolute;
   content: '';
   background: rgba(31, 31, 31, 0.50);
   width: 100%;
   height: 100%;
   left: 0px;
   top: 0px;
 }

 .page-title .rotate-text {
   position: absolute;
   left: 0px;
   bottom: 190px;
   color: #cdcdce;
 }

 .page-title .rotate-text:before {
   background: #cdcdce;
 }

 .page-title .content-box h1 {
   position: relative;
   display: block;
   font-size: 40px;
   line-height: 70px;
   margin: 40px 0px;
   padding: 0px 15px;
   color: #ffffff;
   font-weight: 500;
   text-transform: uppercase;
   width: fit-content;
   background-color: #003087;
   border-radius: 8px;
 }

 .about-style-three.alternate-3 {
   padding: 117px 0px 52px 0px;
 }

 .about-style-three.alternate-3 .top-content {
   margin-bottom: 63px;
 }

 .work-section.alternate-2 {
   padding: 125px 0px 97px 0px;
 }

 .work-style-three {
   position: relative;
   display: block;
   padding: 116px 0px 90px 0px;
 }

 .work-style-three .top-content {
   position: relative;
   display: block;
   margin-bottom: 118px;
 }

 .work-style-three .top-content .text-column {
   padding-top: 32px;
 }

 .service-style-two.alternate-2 {
   padding: 120px 0px 70px 0px;
 }

 .service-style-two.alternate-2 .inner-content {
   padding: 0px;
   margin: 0px 15px;
 }

 .service-style-two.alternate-2 .service-block {
   padding: 0px 0px;
 }

 .pricing-section.alternate-2 .lower-content {
   padding-bottom: 130px;
 }

 .about-style-three.single-service-page {
   position: relative;
   padding: 116px 0px 0px 0px;
 }

 .about-style-three.single-service-page:before {
   position: absolute;
   content: '';
   background: url(../images/background/about-pattern.png);
   width: 65%;
   height: 490px;
   right: 0px;
   top: 0px;
   background-size: cover;
   background-repeat: no-repeat;
 }

 .about-style-three.single-service-page .top-content {
   margin-bottom: 0px;
 }

 .fact-counter.single-service-page {
   padding: 57px 0px 113px 0px;
 }

 .single-page-bg {
   position: relative;
   display: block;
   min-height: 400px;
   width: 100%;
   background-repeat: no-repeat;
   background-size: cover;
 }

 .client-style-two.single-service-page {
   padding: 5px 0px 66px 0px;
 }


 /*** 

====================================================================
                        Project-Page
====================================================================

***/

 .project-page {
   padding: 120px 0px 90px 0px;
 }

 .project-page .project-block-one {
   margin-bottom: 30px;
 }

 .project-page .project-block-one .lower-content {
   max-width: 100%;
   padding: 25px 15px 6px 30px;
 }

 .project-page .project-block-one .lower-content h4 {
   font-weight: 300;
   margin-bottom: 5px;
   letter-spacing: 2px;
 }

 .project-page .project-block-one .lower-content span {
   position: relative;
   display: block;
   font-size: 14px;
   font-family: 'Oswald', sans-serif;
   color: #222222;
   font-weight: 300;
   letter-spacing: 2px;
 }

 .project-page .filters {
   margin-bottom: 60px;
 }

 .project-page .filter-btns li {
   position: relative;
   display: inline-block;
   margin: 0px 17px;
   font-size: 14px;
   font-family: 'Oswald', sans-serif;
   font-weight: 400;
   color: #002222;
   text-transform: uppercase;
   cursor: pointer;
   padding-bottom: 8px;
   transition: all 500ms ease;
 }

 .project-page .filter-btns li:before {
   position: absolute;
   content: '';
   background: #002222;
   width: 0%;
   height: 2px;
   left: 0px;
   bottom: 0px;
   transition: all 500ms ease;
 }

 .project-page .filter-btns li.active:before,
 .project-page .filter-btns li:hover:before {
   width: 100%;
 }

 .project-page-03,
 .project-page-04,
 .project-page-05 {
   padding: 116px 0px 80px 0px;
 }

 .project-page-06 {
   padding: 116px 0px 60px 0px;
 }

 .project-page-07 {
   padding: 115px 0px;
 }

 .project-page-07 .top-content {
   position: relative;
   display: block;
   margin-bottom: 20px;
 }

 .project-page-07 .top-content .text-column {
   padding-top: 32px;
 }

 .project-page-07 .lower-content {
   position: relative;
   display: block;
   padding-top: 100px;
 }

 .project-page .project-title {
   top: 20px;
 }

 .project-page-07 .lower-content .load-btn a {
   position: relative;
   display: inline-block;
   font-size: 18px;
   line-height: 28px;
   font-family: 'Oswald', sans-serif;
   font-weight: 500;
   color: #222222;
   letter-spacing: 1px;
   text-transform: uppercase;
   text-decoration: underline;
 }

 .project-page-07 .lower-content .load-btn {
   position: relative;
   display: block;
   padding-top: 14px;
 }

 .project-page-07 .lower-content .load-btn a:hover {
   color: #f18f20;
 }

 .project-page-08 {
   padding-bottom: 75px;
 }

 .project-page-09 {
   padding: 115px 0px 77px 0px;
 }

 .project-section.project-page-09 .load-btns {
   margin-top: 13px;
 }

 .project-page-09 .top-content {
   position: relative;
   margin-bottom: 17px;
 }

 .project-page-09 .top-content .text-column {
   padding-top: 32px;
 }

 .project-page-09 .lower-content {
   position: relative;
   display: block;
   padding-top: 100px;
 }

 .project-page-10 .masonry-item.big-column {
   position: relative;
   width: 50%;
   float: left;
 }

 .project-page-10 .masonry-item.small-column {
   position: relative;
   width: 25%;
   float: left;
 }

 .project-page-10 .masonry-item {
   position: relative;
   display: block;
   padding: 0px 15px;
 }

 .project-page-10 .filters {
   text-align: right;
   padding-top: 30px;
   margin-bottom: 30px;
 }

 .project-page-10 .load-more a {
   position: relative;
   display: inline-block;
   font-size: 18px;
   font-family: 'Oswald', sans-serif;
   font-weight: 500;
   line-height: 28px;
   color: #f18f20;
   text-transform: uppercase;
   text-decoration: underline;
 }

 .project-page-10 .load-more {
   position: relative;
   display: block;
   padding-top: 13px;
 }

 .project-page-10 .load-more a:hover {
   color: #222222;
 }

 .project-page-10 {
   padding: 115px 0px 5px 0px;
 }

 .project-page-10 .project-title {
   top: 100px;
 }

 /** single-project **/

 .single-project {
   position: relative;
   display: block;
   padding: 120px 0px;
 }

 .single-project .inner-content .info-content {
   position: relative;
   display: block;
   padding: 56px 30px 59px 57px;
   background: #f3f3f3;
 }

 .single-project .inner-content .info-content li {
   position: relative;
   display: block;
   margin-bottom: 15px;
 }

 .single-project .inner-content .info-content li:last-child {
   margin-bottom: 0px;
 }

 .single-project .inner-content .info-content span {
   position: relative;
   display: inline-block;
   font-size: 18px;
   font-weight: 500;
   font-family: 'Oswald', sans-serif;
   color: #222222;
   width: 50%;
 }

 .single-project-1 .inner-content .top-content {
   position: relative;
   display: block;
   margin-bottom: 80px;
 }

 .single-project .inner-content .info-content li a {
   color: #222222;
 }

 .single-project .inner-content .info-content li a:hover {
   color: #f18f20;
 }

 .single-project .inner-content .content-box {
   position: relative;
   display: block;
   padding-top: 13px;
 }

 .single-project .inner-content .content-box h4 {
   position: relative;
   display: block;
   font-size: 20px;
   line-height: 30px;
   font-weight: 700;
   color: #222222;
   margin-bottom: 17px;
 }

 .single-project .inner-content .content-box .text p {
   position: relative;
   display: block;
 }

 .single-project .inner-content .content-box .text span {
   position: relative;
   font-size: 18px;
   font-weight: 700;
   color: #222222;
 }

 .single-project-2 .inner-content .project-block-one,
 .single-project-3 .inner-content .project-block-one {
   margin-bottom: 30px;
 }

 .single-project-2 .inner-content .top-content {
   position: relative;
   padding-bottom: 100px;
 }

 .single-project-3 .inner-content .info-content span {
   width: 30%;
 }

 .single-project-3 .inner-content .info-content {
   margin-bottom: 18px;
 }

 .single-project-3 {
   padding-bottom: 90px;
 }


 /*** 

====================================================================
                        About-Page
====================================================================

***/

 .about-section.about-page-1 {
   padding: 115px 0px 90px 0px;
 }

 .about-section.about-page-1 .top-content {
   margin-bottom: 70px;
 }

 .about-section.about-page-1 .count-text:before {
   display: none;
 }

 .about-page-bg {
   position: relative;
   display: block;
   width: 100%;
   min-height: 700px;
   background-size: cover;
   background-repeat: no-repeat;
   background-position: center center;
 }

 .testimonial-section.about-page-1 {
   padding: 115px 0px 120px 0px;
 }

 .testimonial-section.about-page-1:before {
   top: 160px;
 }

 .team-section.about-page-1 {
   padding: 103px 0px 116px 0px;
 }

 .about-style-two.about-page-2 {
   padding: 120px 0px 0px 0px;
 }

 .about-style-two.about-page-2 .image-box .image h2 {
   text-transform: uppercase;
 }

 .about-style-two.about-page-2 .content-box {
   padding-right: 0px;
 }

 .about-style-two.about-page-2 .content-box .text {
   position: relative;
   display: block;
   font-size: 16px;
   line-height: 30px;
   font-weight: 600;
   margin-bottom: 16px;
 }


 /*** 

====================================================================
                        Team-Page
====================================================================

***/


 .team-section.team-page {
   padding: 115px 0px 20px 0px;
 }

 .team-section.team-page:before {
   display: none;
 }

 .team-section.team-page .team-block-one {
   margin-bottom: 57px;
 }

 .progress-section {
   position: relative;
   display: block;
   padding: 105px 0px 113px 0px;
 }

 .progress-section .text-column .text {
   position: relative;
   display: block;
   padding-top: 14px;
 }

 .progress-section .text-column .text h2 {
   position: relative;
   display: block;
   font-size: 36px;
   line-height: 50px;
   font-weight: 500;
   color: #222222;
 }

 /** progress-box **/

 .single-progress-box {
   position: relative;
   margin-bottom: 25px;
 }

 .single-progress-box:last-child {
   margin-bottom: 0px;
 }

 .single-progress-box .progress {
   position: relative;
   background-color: #e7e7e7;
   height: 9px;
   border-radius: 10px;
   box-shadow: none;
   overflow: visible;
 }

 .single-progress-box .progress-bar {
   position: relative;
   background-color: #f18f20;
   box-shadow: none;
   height: 5px;
   border-radius: 5px;
   top: 2px;
   -webkit-transition: all 3s ease 0s;
   -moz-transition: all 3s ease 0s;
   -ms-transition: all 3s ease 0s;
   -o-transition: all 3s ease 0s;
   transition: all 3s ease 0s;
   width: 0;
 }

 .single-progress-box .progress-bar .value-holder {
   position: absolute;
   display: none;
   text-align: center;
   font-family: 'Open Sans', sans-serif;
   bottom: 7px;
   right: 0px;
   color: #222222;
   font-weight: 500;
   border-radius: 3px;
   font-size: 14px;
 }

 .single-progress-box .text {
   position: relative;
   display: block;
   font-family: 'Open Sans', sans-serif;
   font-size: 16px;
   font-weight: 600;
   color: #222222;
   margin-bottom: 11px;
 }

 /** single-team **/


 .about-style-two.single-team-page {
   padding: 120px 0px 50px 0px;
 }

 .about-style-two.single-team-page .image-box .image h2 {
   color: #fff;
   text-transform: uppercase;
 }

 .about-style-two.single-team-page .image-box {
   padding-left: 0px;
 }

 .about-style-two.single-team-page .content-box {
   padding-right: 0px;
   margin-top: 62px;
 }

 .about-style-two.single-team-page .content-box .text {
   position: relative;
   display: block;
   font-size: 16px;
   line-height: 30px;
   font-weight: 600;
   margin-bottom: 15px;
 }

 .about-style-two.single-team-page .content-box p {
   display: block;
   margin-bottom: 28px;
 }

 .about-style-two.single-team-page .content-box .info li {
   position: relative;
   display: block;
   color: #f18f20;
   font-weight: 700;
   margin-bottom: 6px;
 }

 .about-style-two.single-team-page .content-box .info li span {
   color: #222222;
   margin-right: 5px;
 }

 .about-style-two.single-team-page .content-box .info li:last-child {
   margin-bottom: 0px;
 }

 .about-style-two.single-team-page .content-box .info {
   position: relative;
   display: block;
   margin-bottom: 37px;
 }

 /** education-section **/

 .education-section {
   position: relative;
   display: block;
   padding: 60px 0px 90px 0px;
 }

 .education-section .sec-title {
   position: relative;
   display: block;
   max-width: 630px;
   width: 100%;
   padding-bottom: 131px;
 }

 .education-section .sec-title h1 {
   margin-bottom: 4px;
 }

 .education-section .inner-content {
   position: relative;
   display: block;
   padding: 0px 20px 0px 40px;
 }

 .education-section .inner-content:before {
   position: absolute;
   content: '';
   background: #dedede;
   width: 1px;
   height: 100%;
   top: -20px;
   left: 185px;
 }

 .education-section .inner-content:after {
   position: absolute;
   content: "\f113";
   font-family: 'Flaticon';
   font-size: 40px;
   color: #222222;
   font-weight: 600;
   left: 166px;
   top: -63px;
 }

 .education-section .inner-content .single-item {
   position: relative;
   display: block;
   margin-bottom: 97px;
 }

 .education-section .inner-content .single-item:last-child {
   margin-bottom: 0px;
 }

 .education-section .inner-content .single-item .date {
   position: absolute;
   left: 0px;
   top: 15px;
   font-size: 18px;
   font-family: 'Oswald', sans-serif;
   font-weight: 500;
   color: #222222;
 }

 .education-section .inner-content .single-item .content-box {
   position: relative;
   padding-left: 210px;
 }

 .education-section .inner-content .single-item .content-box:before {
   position: absolute;
   content: "\f112";
   font-family: 'Flaticon';
   font-size: 16px;
   color: #222222;
   border: 1px solid #dedede;
   background: #ffffff;
   width: 41px;
   height: 41px;
   line-height: 41px;
   text-align: center;
   border-radius: 50%;
   left: 125px;
   top: 7px;
 }

 .education-section .inner-content .single-item .content-box .text {
   position: relative;
   display: block;
   font-size: 18px;
   line-height: 28px;
   font-weight: 600;
   margin-bottom: 6px;
 }

 .education-section .inner-content .single-item .content-box span {
   position: relative;
   display: block;
   color: #f18f20;
   font-weight: 600;
   font-family: 'Open Sans', sans-serif;
 }

 .project-style-two.single-team-page .project-title {
   color: #ffffff;
 }


 /*** 

====================================================================
                        Faq-Page
====================================================================

***/

 .faq-section {
   position: relative;
   display: block;
 }

 .faq-section .title-box {
   position: relative;
   display: block;
   margin-bottom: 59px;
 }

 .faq-section .title-box .title h2 {
   position: relative;
   display: block;
   font-size: 52px;
   line-height: 80px;
   font-weight: 700;
   color: #222222;
   text-transform: uppercase;
 }

 .faq-section .title-box .title h2 span {
   font-weight: 300;
 }

 .faq-section .title-box .text {
   position: relative;
   display: block;
   padding-top: 11px;
 }

 .accordion-box {
   position: relative;
   margin-top: 5px;
 }

 .accordion-box .block {
   position: relative;
   margin-bottom: 10px;
   border: 1px solid #dedede;
 }

 .accordion-box .block:last-child {
   margin-bottom: 0px;
 }

 .accordion-box .block .acc-btn h3 {
   position: relative;
   display: block;
   font-size: 24px;
   font-weight: bold;
   color: #222222;
   cursor: pointer;
   border-bottom: 1px solid transparent;
   padding: 17px 30px 24px 40px;
   background: #ffffff;
   transition: all 500ms ease;
 }

 .accordion-box .block .acc-btn.active h3 {
   border-bottom: 1px solid #dedede;
   font-weight: bold;
   color: #004687;
   background-color: #f3f3f3;
 }

 .accordion-box .block .acc-content {
   position: relative;
   display: none;
 }

 .accordion-box .block .acc-content.current {
   display: block;
 }

 .accordion-box .block .content {
   position: relative;
   display: block;
   padding: 23px 50px 43px 40px;
 }

 .accordion-box .block .acc-content .content .text {
   position: relative;
   display: block;
   font-size: 16px;
   line-height: 26px;
   font-weight: 600;
   font-style: italic;
   margin-bottom: 23px;
 }

 /*** 

====================================================================
                        History-Page
====================================================================

***/

 .history-section {
   position: relative;
   display: block;
 }

 .history-section:before {
   position: absolute;
   content: '';
   background: url(../images/background/about-pattern.png);
   width: 65%;
   height: 490px;
   right: 0px;
   top: 0px;
   background-size: cover;
   background-repeat: no-repeat;
 }

 .single-history-box {
   position: relative;
   display: block;
   margin-bottom: 87px;
 }

 .single-history-box:last-child {
   margin-bottom: 0px;
 }

 .single-history-box .content-box {
   position: relative;
   display: block;
   margin-bottom: 96px;
 }

 .single-history-box .content-box .title h1 {
   position: relative;
   display: block;
   font-size: 52px;
   font-weight: 700;
   color: #222222;
   line-height: 80px;
   text-transform: uppercase;
 }

 .single-history-box .content-box .title h1 span {
   font-weight: 300;
 }

 .single-history-box .content-box .text {
   position: relative;
   display: block;
   padding-top: 11px;
 }

 .single-history-box .content-box .text p {
   position: relative;
   display: block;
   font-size: 14px;
 }

 .single-history-box .image-box {
   position: relative;
   display: block;
   overflow: hidden;
   background: #000;
 }

 .single-history-box .image-box img {
   width: 100%;
   transition: all 1500ms ease;
 }

 .single-history-box .image-box:hover img {
   transform: scale(1.3);
   opacity: 0.4;
 }


 /*** 

====================================================================
                        Cooming-Soon-Page
====================================================================

***/


 .coming-soon {
   position: fixed;
   left: 0px;
   top: 0px;
   height: 100%;
   width: 100%;
   display: block;
   background-repeat: no-repeat;
   background-position: center center;
   background-size: cover;
   padding: 220px 0px;
   overflow-y: auto;
   overflow-x: hidden;
 }

 .coming-soon:before {
   position: fixed;
   content: '';
   background: rgba(0, 0, 0, 0.80);
   width: 100%;
   height: 100%;
   left: 0px;
   top: 0px;
 }

 .coming-soon .inner-content .logo {
   position: relative;
   margin-bottom: 97px;
 }

 .coming-soon .inner-content .top-text {
   position: relative;
   display: block;
   font-size: 24px;
   line-height: 30px;
   color: #ffffff;
   margin-bottom: 18px;
 }

 .coming-soon .inner-content .title-text h1 {
   position: relative;
   display: block;
   font-size: 150px;
   line-height: 150px;
   font-weight: 700;
   color: #ffffff;
   text-transform: uppercase;
   margin-bottom: 26px;
 }

 .coming-soon .inner-content .text {
   position: relative;
   display: block;
   font-size: 24px;
   line-height: 30px;
   color: #ffffff;
   margin-bottom: 38px;
 }

 .coming-soon .inner-content .text a {
   color: #f18f20;
   font-style: italic;
 }

 .coming-soon .inner-content .text a:hover {
   color: #ffffff;
 }

 .coming-soon .timer {
   position: relative;
   display: inline-block;
 }

 .coming-soon .cs-countdown {
   position: relative;
   text-align: center;
 }

 .coming-soon .cs-countdown .count-col {
   position: relative;
   display: inline-block;
   text-align: center;
   margin: 0px 25px;
 }

 .coming-soon .cs-countdown .count-col span {
   position: relative;
   display: block;
   font-size: 48px;
   color: #ffffff;
   line-height: 60px;
   font-family: 'Oswald', sans-serif;
   font-weight: 300;
   text-align: center;
 }

 .coming-soon .cs-countdown .count-col h3 {
   position: absolute;
   left: 0;
   right: 0;
   top: 66px;
   margin: 0 auto;
   font-size: 24px;
   color: #ffffff;
   font-weight: 300;
   text-align: center;
 }


 /*** 

====================================================================
                        Error-Page
====================================================================

***/


 .error-section {
   position: relative;
   display: block;
   padding: 150px 0;
 }

 .error-section .content-box {
   position: relative;
   display: block;
   text-align: center;
 }

 .error-section .content-box h1 {
   position: relative;
   font-size: 70px;
   line-height: 70px;
   font-weight: 700;
   margin-bottom: 20px;
 }

 .error-section .content-box h2 {
   position: relative;
   font-weight: 700;
   text-transform: uppercase;
   margin-bottom: 15px;
 }

 .error-section .content-box p {
   position: relative;
   display: block;
   font-size: 14px;
   line-height: 27px;
   color: #141414;
   font-weight: 500;
   margin-bottom: 20px;
 }

 .error-section .content-box p a {
   color: #f18f20;
 }

 .error-section .content-box p a:hover {
   text-decoration: underline;
 }

 .error-section .content-box p strong {
   font-weight: 600;
   font-size: 19px;
 }

 .error-section input[type="email"] {
   width: 100%;
   height: 50px;
   background: #f2f2f2;
   border: 1px solid #f2f2f2;
   line-height: 50px;
   padding: 10px 50px 10px 20px;
   color: #222222;
   transition: all 500ms ease;
 }

 .error-section .form-group {
   position: relative;
   margin: 0px;
 }

 .error-section button {
   position: absolute;
   top: 12px;
   right: 20px;
   color: #222222;
   font-size: 18px;
   font-weight: 700;
   background: none;
   cursor: pointer;
   transition: all 500ms ease;
 }

 .error-section input:focus+button,
 .error-section button:hover {
   color: #f18f20;
 }

 .error-section input:focus {
   border: 1px solid #f18f20;
 }


 /*** 

====================================================================
                        Blog-Page
====================================================================

***/

 .news-section.blog-grid {
   padding: 120px 0px 90px 0px;
 }

 .news-section.blog-grid .news-block-one {
   margin-bottom: 30px;
 }

 .sidebar-page-container {
   position: relative;
   display: block;
   padding: 120px 0px 60px 0px;
 }

 .sidebar-page-container .news-block-one .lower-content h4 {
   margin-bottom: 16px;
 }

 .sidebar-page-container .news-block-one .lower-content p {
   position: relative;
   display: block;
   margin-bottom: 20px;
 }

 .sidebar-page-container .news-block-one .lower-content .link a {
   position: relative;
   display: inline-block;
   font-size: 14px;
   line-height: 24px;
   font-family: 'Oswald', sans-serif;
   font-weight: 600;
   color: #222222;
   text-transform: uppercase;
   text-decoration: underline;
 }

 .sidebar-page-container .news-block-one .lower-content .link a:hover {
   color: #f18f20;
 }

 .blog-classic-1 .news-block-one .lower-content {
   padding: 30px 30px 37px 30px;
 }

 .sidebar-page-container .news-block-one .lower-content .post-info {
   margin-bottom: 16px;
 }

 .sidebar-page-container .news-block-one {
   margin-bottom: 60px;
 }

 .sidebar-page-container.blog-classic-1 .news-block-one:hover {
   transform: translateY(-20px);
 }

 .sidebar-page-container .sidebar {
   position: relative;
   display: block;
 }

 .sidebar-page-container .sidebar .sidebar-widget {
   position: relative;
   display: block;
   margin-bottom: 50px;
   border: 1px solid #f7f7f7;
 }

 .sidebar-page-container .sidebar .sidebar-widget:last-child {
   margin-bottom: 0px;
 }

 .sidebar-page-container .sidebar .sidebar-search .widget-content {
   position: relative;
   display: block;
   padding: 10px;
 }

 .sidebar-page-container .sidebar .sidebar-search .widget-content .form-group {
   position: relative;
   margin: 0px;
 }

 .sidebar-page-container .sidebar .sidebar-search .widget-content .form-group input[type='search'] {
   position: relative;
   display: block;
   width: 100%;
   height: 40px;
   padding: 10px 50px 10px 20px;
   border: 1px solid #f7f7f7;
   background: #fbfbfb;
   font-size: 14px;
   font-family: 'Oswald', sans-serif;
   color: #222222;
   transition: all 500ms ease;
 }

 .sidebar-page-container .sidebar .sidebar-search .widget-content button {
   position: absolute;
   top: 8px;
   right: 20px;
   color: #222222;
   font-size: 15px;
   font-weight: 700;
   background: transparent;
   cursor: pointer;
   transition: all 500ms ease;
 }

 .sidebar-page-container .sidebar .sidebar-search .widget-content .form-group input:focus+button,
 .sidebar-page-container .sidebar .sidebar-search .widget-content button:hover {
   color: #f18f20;
 }

 .sidebar-page-container .sidebar .sidebar-search .widget-content .form-group input:focus {
   border: 1px solid #f18f20;
 }

 .sidebar-page-container .sidebar .sidebar-search ::-webkit-input-placeholder {
   color: #222222;
 }

 .sidebar-page-container .sidebar .sidebar-search ::-moz-placeholder {
   color: #222222;
 }

 .sidebar-page-container .sidebar .sidebar-search :-ms-input-placeholder {
   color: #222222;
 }

 .sidebar-page-container .sidebar .sidebar-search :-moz-placeholder {
   color: #222222;
 }

 .sidebar-page-container .sidebar .sidebar-title {
   position: relative;
   display: block;
   font-size: 24px;
   line-height: 30px;
   font-weight: 600;
   padding-left: 28px;
   margin-bottom: 9px;
 }

 .sidebar-page-container .sidebar .sidebar-title:before {
   position: absolute;
   content: '';
   background: url(../images/icons/sidebar-icon.png);
   width: 11px;
   height: 23px;
   left: 0px;
   top: 3px;
   background-repeat: no-repeat;
 }

 .sidebar-page-container .sidebar .sidebar-categories .list li {
   position: relative;
   display: block;
 }

 .sidebar-page-container .sidebar .sidebar-categories .list li a {
   position: relative;
   display: block;
   font-size: 22px;
   font-family: 'Oswald', sans-serif;
   color: #222222;
   padding: 20px 0px 20px 0px;
   border-bottom: 1px solid #e7e7e7;
 }

 .sidebar-page-container .sidebar .sidebar-categories .list li a:hover {
   color: #003087;
 }

 .sidebar-page-container .sidebar .sidebar-categories .list li.active a {
   color: #003087;
 }

 .sidebar-page-container .sidebar .sidebar-categories .list li span {
   float: right;
 }

 .sidebar-page-container .sidebar .sidebar-categories {
   position: relative;
   display: block;
   padding: 29px 30px 47px 30px;
 }

 .sidebar-page-container .sidebar .sidebar-post {
   position: relative;
   display: block;
   padding: 29px 15px 41px 25px;
 }

 .sidebar-page-container .sidebar .sidebar-post .post {
   position: relative;
   padding: 0px 0px 5px 140px;
   margin-bottom: 13px;
   min-height: 85px;
 }

 .sidebar-page-container .sidebar .sidebar-post .post:last-child {
   margin-bottom: 0px;
 }

 .sidebar-page-container .sidebar .sidebar-post .post .thumb {
   position: absolute;
   left: 0px;
   top: 7px;
   background: #f18f20;
   overflow: hidden;
   width: 120px;
   height: 80px;
 }

 .sidebar-page-container .sidebar .sidebar-post .post .thumb img {
   width: 100%;
   opacity: 1;
   transition: all 500ms ease;
 }

 .sidebar-page-container .sidebar .sidebar-post .post:hover .thumb img {
   opacity: 0.2;
 }

 .sidebar-page-container .sidebar .sidebar-post .post .date {
   position: relative;
   display: block;
   font-size: 12px;
   line-height: 26px;
   font-family: 'Oswald', sans-serif;
   color: #a4b3c1;
   font-weight: 400;
 }

 .sidebar-page-container .sidebar .sidebar-post .post h5 {
   position: relative;
   display: block;
   font-size: 18px;
   line-height: 28px;
   font-weight: 500;
 }

 .sidebar-page-container .sidebar .sidebar-post .post h5 a {
   position: relative;
   display: inline-block;
   color: #222222;
 }

 .sidebar-page-container .sidebar .sidebar-post .post h5 a:hover {
   color: #f18f20;
 }

 .sidebar-page-container .sidebar .sidebar-post .sidebar-title {
   margin-bottom: 18px;
 }

 .sidebar-page-container .sidebar .sidebar-links {
   position: relative;
   display: block;
   padding: 29px 15px 17px 25px;
 }

 .sidebar-page-container .sidebar .sidebar-links .social-links li {
   position: relative;
   display: inline-block;
   margin-right: 24px;
 }

 .sidebar-page-container .sidebar .sidebar-links .social-links li:last-child {
   margin-right: 0px;
 }

 .sidebar-page-container .sidebar .sidebar-links .social-links li a {
   position: relative;
   display: inline-block;
   font-size: 18px;
   color: #222222;
 }

 .sidebar-page-container .sidebar .sidebar-links .social-links li a:hover {
   color: #f18f20;
 }

 .sidebar-page-container .sidebar .sidebar-links .sidebar-title {
   margin-bottom: 13px;
 }

 .blog-classic-2 .news-block-one .lower-content {
   padding: 21px 30px 45px 30px;
 }

 /** blog-single **/

 .blog-single {
   position: relative;
 }

 .blog-single .content-style-one .news-block-one:hover .image-box img {
   opacity: 1;
 }

 .blog-single .news-block-one:hover {
   transform: translateY(0px);
 }

 .blog-single .content-style-one .news-block-one {
   box-shadow: none;
   margin-bottom: 0px;
 }

 .blog-single .content-style-one .news-block-one:hover img {
   transform: scale(1);
 }

 .blog-single .content-style-one .news-block-one .lower-content {
   padding: 21px 50px 28px 0px;
 }

 .blog-single .news-block-one .lower-content h4 {
   margin-bottom: 18px;
 }

 .blog-single .blog-single-content .inner-box blockquote {
   position: relative;
   display: block;
   padding: 2px 40px 14px 110px;
   margin: 0px;
   margin-left: 25px;
 }

 .blog-single .blog-single-content .inner-box blockquote:before {
   position: absolute;
   content: '';
   background: #a4b3c1;
   height: 100%;
   width: 1px;
   left: 73px;
   top: 0px;
 }

 .blog-single .blog-single-content .inner-box blockquote .icon-box {
   position: absolute;
   left: 0px;
   top: 7px;
   font-size: 45px;
   line-height: 50px;
   color: #a4b3c1;
 }

 .blog-single .blog-single-content .inner-box blockquote .text {
   position: relative;
   display: block;
   font-size: 14px;
   color: #222222;
   line-height: 24px;
 }

 .blog-single .blog-single-content .inner-box .content-style-one {
   position: relative;
   display: block;
   margin-bottom: 0px;
 }

 .blog-single .blog-single-content .inner-box .content-style-two .image-box {
   position: relative;
   display: block;
   margin-bottom: 29px;
 }

 .blog-single .blog-single-content .inner-box .content-style-two img {
   width: 100%;
 }

 .blog-single .blog-single-content .inner-box .content-style-two .text {
   position: relative;
   display: block;
   font-size: 18px;
   font-weight: 600;
   line-height: 28px;
   margin-bottom: 22px;
 }

 .blog-single .blog-single-content .inner-box .content-style-two p {
   position: relative;
   display: block;
   font-size: 14px;
   padding-right: 5px;
 }

 .blog-single .blog-single-content .inner-box .content-style-two {
   position: relative;
   display: block;
   margin-bottom: 57px;
 }

 .blog-single .blog-single-content .post-share-option {
   position: relative;
   display: block;
   border-top: 1px solid #eeeeee;
   border-bottom: 1px solid #eeeeee;
   padding: 30px 0px;
   margin-bottom: 54px;
 }

 .blog-single .blog-single-content .post-share-option .tags li {
   position: relative;
   display: inline-block;
   font-size: 13px;
   color: #a4b3c1;
   font-weight: 500;
   font-family: 'Oswald', sans-serif;
 }

 .blog-single .blog-single-content .post-share-option .tags li a {
   position: relative;
   display: inline-block;
   font-size: 13px;
   font-family: 'Open Sans', sans-serif;
   color: #222222;
   font-weight: 400;
 }

 .blog-single .blog-single-content .post-share-option .tags li a:hover {
   color: #f18f20;
 }

 .blog-single .blog-single-content .post-share-option .tags li i {
   margin-right: 5px;
 }

 .blog-single .blog-single-content .post-share-option .social-links li {
   position: relative;
   display: inline-block;
   background: #e6e7e9;
   width: 66px;
   height: 30px;
   line-height: 30px;
   border-radius: 30px;
   margin: 0px 5px;
   font-size: 13px;
   font-family: 'Open Sans', sans-serif;
   font-weight: 600;
   color: #555555;
 }

 .blog-single .blog-single-content .post-share-option .social-links li a {
   position: relative;
   display: inline-block;
   width: 30px;
   height: 30px;
   line-height: 30px;
   text-align: center;
   font-size: 14px;
   color: #ffffff;
   background: #e6e7e9;
   border-radius: 50%;
   margin-right: 7px;
   z-index: 1;
 }

 .blog-single .blog-single-content .post-share-option .social-links li:first-child a {
   background: #3b5998;
 }

 .blog-single .blog-single-content .post-share-option .social-links li:nth-child(2) a {
   background: #2ba9e1;
 }

 .blog-single .blog-single-content .post-share-option .social-links li:nth-child(3) a {
   background: #dd4b39;
 }

 .blog-single .blog-single-content .post-share-option .social-links li:nth-child(4) a {
   background: #cb2027;
 }

 .blog-single .blog-single-content .post-share-option .social-links li a:hover {
   background: #f18f20 !important;
 }

 .blog-single .blog-single-content .post-share-option .social-share .share a:hover {
   background: #f18f20;
 }

 .blog-single .blog-single-content .post-share-option .social-share .share a {
   position: relative;
   display: inline-block;
   width: 30px;
   height: 30px;
   line-height: 30px;
   text-align: center;
   background: #45a147;
   margin: 0px;
   font-size: 14px;
   color: #ffffff;
   border-radius: 50%;
   z-index: 1;
 }

 .blog-single .blog-single-content .post-share-option .social-links {
   position: absolute;
   right: 0%;
   top: 0px;
   width: 340px;
   opacity: 0;
   visibility: hidden;
   transition: all 500ms ease;
 }

 .blog-single .blog-single-content .post-share-option .social-share:hover .social-links {
   opacity: 1;
   right: 30%;
   visibility: visible;
   margin-left: 0px;
 }

 .blog-single .blog-single-content .post-share-option .social-share {
   position: relative;
   display: block;
 }

 .blog-single .blog-single-content .post-controls .inner {
   position: relative;
   display: block;
   margin-bottom: 83px;
 }

 .blog-single .blog-single-content .post-controls .inner .prev-post {
   position: absolute;
   left: 30px;
   top: -2px;
 }

 .blog-single .blog-single-content .post-controls .inner .next-post {
   position: absolute;
   top: -2px;
   right: 30px;
 }

 .blog-single .blog-single-content .post-controls .inner .prev-post a,
 .blog-single .blog-single-content .post-controls .inner .next-post a {
   position: relative;
   display: inline-block;
   font-size: 12px;
   font-family: 'Oswald', sans-serif;
   color: #a4b3c1;
   font-weight: 700;
   text-transform: uppercase;
   z-index: 1;
 }

 .blog-single .blog-single-content .post-controls .inner .prev-post a:hover,
 .blog-single .blog-single-content .post-controls .inner .next-post a:hover {
   color: #f18f20;
 }

 .blog-single .blog-single-content .post-controls .scroll-btn {
   position: relative;
   display: inline-block;
   font-size: 12px;
   font-family: 'Oswald', sans-serif;
   font-weight: 700;
   color: #222222;
   text-transform: uppercase;
   cursor: pointer;
   transition: all 500ms ease;
 }

 .blog-single .blog-single-content .post-controls .scroll-btn:hover {
   color: #f18f20;
 }

 .blog-single .blog-single-content .post-controls .scroll-btn i {
   position: relative;
   font-size: 14px;
   color: #f18f20;
   font-weight: 500;
   margin-left: 15px;
   line-height: 24px;
 }

 .blog-single .blog-single-content .group-title {
   position: relative;
   display: inline-block;
   font-size: 13px;
   font-family: 'Oswald', sans-serif;
   font-weight: 700;
   color: #ffffff;
   text-transform: uppercase;
   background: #222222;
   padding: 5px 20px 6px 20px;
   text-align: center;
   border-radius: 3px;
 }

 .blog-single .blog-single-content .group-title i {
   position: relative;
   margin-right: 17px;
 }

 .blog-single .blog-single-content .author-box .group-title {
   top: -17px;
 }

 .blog-single .blog-single-content .author-box {
   position: relative;
   display: block;
   background: #fbfbfb;
   padding: 0px 35px 37px 15px;
   margin-bottom: 50px;
 }

 .blog-single .blog-single-content .author-box .author-inner {
   position: relative;
   display: block;
   padding-top: 2px;
 }

 .blog-single .blog-single-content .author-box .author-inner .author-thumb {
   position: absolute;
   left: 20px;
   top: 5px;
   width: 113px;
   height: 113px;
   overflow: hidden;
   border-radius: 5px;
 }

 .blog-single .blog-single-content .author-box .author-inner .author-thumb img {
   width: 100%;
   border-radius: 5px;
 }

 .blog-single .blog-single-content .author-box .author-inner .author-content {
   padding-left: 165px;
 }

 .blog-single .blog-single-content .author-box .author-inner .author-content .info-box h6 {
   position: relative;
   float: left;
   font-size: 16px;
   font-family: 'Oswald', sans-serif;
   font-weight: 700;
   color: #222222;
   text-transform: uppercase;
 }

 .blog-single .blog-single-content .author-box .author-inner .author-content .info-box a {
   position: relative;
   float: right;
   font-size: 13px;
   font-family: 'Open Sans', sans-serif;
   font-weight: 600;
   color: #f18f20;
 }

 .blog-single .blog-single-content .author-box .author-inner .author-content .info-box a i {
   position: relative;
   color: #1de37e;
   margin-left: 15px;
 }

 .blog-single .blog-single-content .author-box .author-inner .author-content .info-box {
   position: relative;
   display: block;
   margin-bottom: 10px;
 }

 .blog-single .blog-single-content .author-box .author-inner .author-content .text {
   position: relative;
   display: block;
   font-size: 15px;
   color: #222222;
 }

 .blog-single .blog-single-content .related-post .group-title {
   margin-bottom: 40px;
 }

 .blog-single .blog-single-content .related-post .news-block-one {
   margin-bottom: 0px;
 }

 .blog-single .blog-single-content .related-post .news-block-one .lower-content {
   padding: 21px 25px 14px 30px;
 }

 .blog-single .blog-single-content .related-post {
   position: relative;
   display: block;
   margin-bottom: 50px;
 }

 .blog-single .blog-single-content .comments-form-area .group-title {
   margin-bottom: 30px;
 }

 .blog-single .blog-single-content .comments-form-area .form-group {
   position: relative;
   display: block;
   margin-bottom: 10px;
 }

 .blog-single .blog-single-content .comments-form-area .form-group i {
   position: absolute;
   top: 18px;
   right: 40px;
   font-size: 13px;
   color: #999999;
   z-index: 1;
   transition: all 500ms ease;
 }

 .blog-single .blog-single-content .comments-form-area .form-group input[type='text'],
 .blog-single .blog-single-content .comments-form-area .form-group input[type='email'],
 .blog-single .blog-single-content .comments-form-area .form-group textarea {
   position: relative;
   display: block;
   width: 100%;
   height: 50px;
   border-right: 3px;
   border: 1px solid #e9e9e9;
   padding: 10px 50px 10px 20px;
   font-size: 12px;
   font-family: 'Open Sans', sans-serif;
   color: #999999;
   transition: all 500ms ease;
 }

 .blog-single .blog-single-content .comments-form-area .form-group:nth-child(3) {
   max-width: 187px;
   width: 100%;
 }

 .blog-single .blog-single-content .comments-form-area .form-group:last-child {
   margin-bottom: 0px;
 }

 .blog-single .blog-single-content .comments-form-area .form-group textarea {
   height: 100px;
   resize: none;
   padding: 10px 20px;
 }

 .blog-single .blog-single-content .comments-form-area .form-group input:focus,
 .blog-single .blog-single-content .comments-form-area .form-group textarea:focus {
   border: 1px solid #f18f20;
 }

 .blog-single .blog-single-content .comments-form-area .comment-form {
   position: relative;
   display: block;
 }

 .blog-single .blog-single-content .comments-form-area .comment-form .message-btn {
   position: absolute;
   top: 0px;
   right: 0px;
 }

 .blog-single .blog-single-content .comments-form-area .comment-form .message-btn button {
   position: relative;
   display: inline-block;
   width: 50px;
   height: 50px;
   line-height: 50px;
   text-align: center;
   background: #222222;
   border-radius: 3px;
   font-size: 20px;
   color: #ffffff;
   cursor: pointer;
   transition: all 500ms ease;
 }

 .blog-single .blog-single-content .comments-form-area .comment-form .message-btn button:hover {
   background: #f18f20;
 }

 .blog-single .blog-single-content .comments-form-area ::-webkit-input-placeholder {
   color: #999999;
 }

 .blog-single .blog-single-content .comments-form-area ::-moz-placeholder {
   color: #999999;
 }

 .blog-single .blog-single-content .comments-form-area :-ms-input-placeholder {
   color: #999999;
 }

 .blog-single .blog-single-content .comments-form-area :-moz-placeholder {
   color: #999999;
 }

 .sidebar-page-container.blog-single {
   padding: 110px 0px;
 }


 /*** 

====================================================================
                        Contact-Page
====================================================================

***/


 .contact-info-section {
   position: relative;
   display: block;
   padding: 103px 0px 110px 0px;
 }

 .map-inner .google-map-area {
   position: relative;
   display: block;
 }

 .map-inner .google-map-area #contact-google-map {
   position: relative;
   width: 100%;
   height: 500px;
 }

 .contact-info-section .inner-box .title-box h2 {
   position: relative;
   display: block;
   font-size: 30px;
   line-height: 40px;
   font-weight: 700;
 }

 .contact-info-section .inner-box {
   position: relative;
   display: block;
   margin-bottom: 100px;
 }

 .contact-info-section .inner-box .info-box {
   position: relative;
   display: block;
   margin-top: 11px;
 }

 .contact-info-section .inner-box .info-box .single-info {
   position: relative;
   float: left;
   width: 33.333%;
 }

 .contact-info-section.style-two .info-box .single-info {
   position: relative;
   float: left;
   width: 50%;
 }

 .contact-info-section .info-box .single-info .icon-box {
   position: relative;
   display: block;
   font-size: 40px;
   color: #222222;
   margin-bottom: 25px;
   transition: all 500ms ease;
 }

 .contact-info-section .info-box .single-info:hover .icon-box {
   color: #f18f20;
 }

 .contact-info-section .info-box .single-info h3 {
   position: relative;
   display: block;
   font-size: 24px;
   line-height: 30px;
   font-weight: 500;
   margin-bottom: 13px;
 }

 .contact-info-section .info-box .single-info a {
   position: relative;
   font-family: 'Open Sans', sans-serif;
   color: #222222;
   margin-bottom: 0px;
   font-style: normal;
   transition: all 500ms ease;
 }

 .contact-info-section .info-box .single-info a:hover {
   color: #f18f20;
 }

 .contact-section {
   position: relative;
   display: block;
   padding: 100px 0px;
 }

 .contact-section .content-box {
   position: relative;
   display: block;
   margin-top: 13px;
 }

 .contact-section .content-box h2,
 .contact-info-section.style-two .content-box h2 {
   position: relative;
   display: block;
   font-size: 36px;
   line-height: 45px;
   font-weight: 700;
   margin-bottom: 18px;
 }

 .contact-section .content-box .text,
 .contact-info-section.style-two .content-box .text {
   position: relative;
   font-size: 18px;
   line-height: 28px;
   font-weight: 700;
 }

 .contact-info-section.style-two .content-box {
   position: relative;
   display: block;
   padding-top: 63px;
 }

 .contact-info-section.style-two .content-box .text {
   margin-bottom: 60px;
 }

 .contact-form-area .form-group {
   position: relative;
   display: block;
   margin-bottom: 15px;
 }

 .contact-form-area .form-group:last-child {
   margin-bottom: 0px;
 }

 .contact-form-area {
   position: relative;
   display: block;
   background: #ffffff;
   padding: 60px 40px 80px 40px;
   border: 1px solid #dfe4e8;
 }

 .contact-form-area .form-group input[type='text'],
 .contact-form-area .form-group input[type='email'],
 .contact-form-area .form-group textarea {
   position: relative;
   display: block;
   width: 100%;
   height: 50px;
   border: 1px solid #f1f1f1;
   background: #fcfcfc;
   font-size: 12px;
   font-family: 'Open Sans', sans-serif;
   color: #9a9a9a;
   padding: 10px 20px;
   transition: all 500ms ease;
 }

 .contact-form-area .form-group textarea {
   height: 120px;
   resize: none;
   margin-bottom: 12px;
 }

 .contact-form-area .form-group input:focus,
 .contact-form-area .form-group textarea:focus {
   border: 1px solid #f18f20;
 }

 .contact-form-area .form-group button {
   position: relative;
   display: inline-block;
   font-size: 14px;
   font-family: 'Open Sans', sans-serif;
   color: #ffffff;
   background: #f18f20;
   font-weight: 400;
   text-align: center;
   padding: 13px 35px;
   transition: all 500ms ease;
   cursor: pointer;
 }

 .contact-form-area .form-group button:hover {
   background: #222222;
 }

 .contact-info-section.style-two {
   padding: 110px 0px;
 }

 /** overlay-style **/

 .line-overlay {
   position: relative;
   display: block;
   overflow: hidden;
 }

 .line-overlay .line {
   position: absolute;
   top: 20px;
   left: 20px;
   z-index: 9;
   width: -webkit-calc(50% - 20px);
   width: -moz-calc(50% - 20px);
   width: calc(50% - 20px);
   height: -webkit-calc(50% - 20px);
   height: -moz-calc(50% - 20px);
   height: calc(50% - 20px);
   -webkit-transition: all .3s ease;
   -o-transition: all .3s ease;
   -moz-transition: all .3s ease;
   transition: all .3s ease;
 }

 .line-overlay .line:after,
 .line-overlay .line:before {
   content: '';
   background: #fff;
   display: block;
   -webkit-transition: all .5s ease;
   -o-transition: all .5s ease;
   -moz-transition: all .5s ease;
   transition: all .5s ease;
 }

 .line-overlay .line:before {
   height: 1px;
   width: 0;
 }

 .line-overlay .line:after {
   height: 0;
   width: 1px;
 }

 .line-overlay .line-bottom {
   top: auto;
   left: auto;
   bottom: 20px;
   right: 20px;
   -webkit-transform: rotate(180deg);
   -moz-transform: rotate(180deg);
   -ms-transform: rotate(180deg);
   -o-transform: rotate(180deg);
   transform: rotate(180deg);
 }

 .line-overlay:hover .line:before,
 .line-overlay .line.active:before {
   width: 100%;
 }

 .line-overlay:hover .line:after,
 .line-overlay .line.active:after {
   height: 100%;
 }




 :root {
   --ink: #0d1b2a;
   --teal: #0f6e56;
   --teal-light: #1D9E75;
   --gold: #BA7517;
   --gold-bg: #FAEEDA;
   --cream: #fdf8f0;
   --muted: #5a6a72;
   --line: #d8d0c4;
   --fac-ink: #0a1628;
   --fac-teal: #0f6e56;
   --fac-teal2: #1D9E75;
   --fac-amber: #BA7517;
   --fac-cream: #f7f5f0;
   --fac-muted: #6b7a8d;
   --fac-line: #e2ddd6;
 }

 .jc-wrap {
   background: var(--cream);
   overflow: hidden
 }

 .jc-hero {
   display: grid;
   grid-template-columns: 1fr 1fr;
   min-height: 520px;
 }

 .jc-left {
   background: #004687;
   padding: 52px 44px 52px 40px;
   display: flex;
   flex-direction: column;
   justify-content: center;
   position: relative;
   overflow: hidden;
 }

 .jc-left::before {
   content: '';
   position: absolute;
   top: -60px;
   right: -60px;
   width: 200px;
   height: 200px;
   border-radius: 50%;
   border: 40px solid rgba(255, 255, 255, 0.04);
 }

 .jc-left::after {
   content: '';
   position: absolute;
   bottom: -40px;
   left: -40px;
   width: 160px;
   height: 160px;
   border-radius: 50%;
   border: 30px solid rgba(255, 255, 255, 0.03);
 }

 .jc-eyebrow {
   font-size: 11px;
   letter-spacing: 3px;
   text-transform: uppercase;
   color: var(--teal-light);
   font-weight: 500;
   margin-bottom: 18px;
   display: flex;
   align-items: center;
   gap: 10px;
 }

 .jc-eyebrow::before {
   content: '';
   display: block;
   width: 28px;
   height: 1px;
   background: var(--teal-light)
 }

 .jc-h1 {
   font-size: 34px;
   font-weight: 700;
   color: #fff;
   line-height: 1.15;
   margin-bottom: 22px;
 }

 .jc-h1 em {
   font-style: italic;
   color: #9FE1CB
 }

 .jc-body {
   font-size: 13.5px;
   line-height: 1.8;
   color: rgba(255, 255, 255, 0.65);
   margin-bottom: 32px;
   font-weight: 300;
 }

 .jc-stats {
   display: flex;
   gap: 28px;
   padding-top: 24px;
   border-top: 1px solid rgba(255, 255, 255, 0.1);
 }

 .jc-stat-num {
   font-size: 28px;
   font-weight: 700;
   color: #fff;
   line-height: 1;
 }

 .jc-stat-label {
   font-size: 15px;
   color: #23ebf6;
   margin-top: 4px;
   letter-spacing: 0.5px
 }

 .jc-right {
   display: grid;
   grid-template-rows: 1fr 1fr;
 }

 .jc-img-top {
   background: #1D9E75;
   display: flex;
   align-items: center;
   justify-content: center;
   position: relative;
   overflow: hidden;
   min-height: 200px;
 }

 .jc-img-placeholder {
   width: 100%;
   height: 100%;
   background: linear-gradient(135deg, #0f6e56 0%, #1D9E75 50%, #5DCAA5 100%);
   display: flex;
   align-items: center;
   justify-content: center;
   flex-direction: column;
   gap: 8px;
 }

 .jc-img-placeholder i {
   font-size: 40px;
   color: rgba(255, 255, 255, 0.4)
 }

 .jc-img-placeholder span {
   font-size: 11px;
   color: rgba(255, 255, 255, 0.5);
   letter-spacing: 1px;
   text-transform: uppercase
 }

 .jc-img-bot {
   background: var(--gold-bg);
   display: flex;
   align-items: center;
   justify-content: center;
   position: relative;
   overflow: hidden;
   min-height: 200px;
 }

 .jc-img-bot-inner {
   width: 100%;
   height: 100%;
   background: linear-gradient(135deg, #FAEEDA 0%, #FAC775 100%);
   display: flex;
   align-items: center;
   justify-content: center;
   flex-direction: column;
   gap: 8px;
 }

 .jc-img-bot-inner i {
   font-size: 40px;
   color: rgba(186, 117, 23, 0.45)
 }

 .jc-img-bot-inner span {
   font-size: 11px;
   color: rgba(133, 79, 11, 0.6);
   letter-spacing: 1px;
   text-transform: uppercase
 }

 .jc-label-pill {
   position: absolute;
   bottom: 14px;
   left: 14px;
   background: rgba(0, 0, 0, 0.55);
   backdrop-filter: blur(6px);
   color: #fff;
   font-size: 11px;
   padding: 5px 12px;
   border-radius: 20px;
   letter-spacing: 0.5px;
 }

 .jc-cards {
   display: grid;
   grid-template-columns: 1fr 1fr;
   gap: 0;
   border-top: 1px solid var(--line);
 }

 .jc-card {
   padding: 36px 36px 32px;
   border-right: 1px solid var(--line);
   position: relative;
   overflow: hidden;
   transition: background 0.3s;
 }

 .jc-card:last-child {
   border-right: none
 }

 .jc-card:hover {
   background: rgba(15, 110, 86, 0.04)
 }

 .jc-card-icon {
   width: 44px;
   height: 44px;
   border-radius: 10px;
   display: flex;
   align-items: center;
   justify-content: center;
   margin-bottom: 16px;
   font-size: 20px;
   transition: transform 0.3s;
 }

 .jc-card:hover .jc-card-icon {
   transform: scale(1.08)
 }

 .icon-teal {
   background: #E1F5EE;
   color: #0f6e56
 }

 .icon-amber {
   background: #FAEEDA;
   color: #854F0B
 }

 .jc-card-tag {
   font-size: 10px;
   letter-spacing: 2px;
   text-transform: uppercase;
   color: var(--teal);
   font-weight: 500;
   margin-bottom: 8px;
 }

 .jc-card-title {
   font-size: 20px;
   font-weight: 700;
   color: var(--ink);
   margin-bottom: 10px;
   line-height: 1.2;
 }

 .jc-card-text {
   font-size: 12.5px;
   line-height: 1.75;
   color: var(--muted)
 }

 .jc-card-line {
   position: absolute;
   bottom: 0;
   left: 0;
   height: 2px;
   width: 0;
   background: var(--teal-light);
   transition: width 0.4s ease;
 }

 .jc-card:hover .jc-card-line {
   width: 100%
 }

 .jc-cta-row {
   padding: 28px 36px;
   display: flex;
   align-items: center;
   justify-content: space-between;
   border-top: 1px solid var(--line);
   background: #fff;
   flex-wrap: wrap;
   gap: 14px;
 }

 .jc-cta-text {
   font-size: 12px;
   color: var(--muted)
 }

 .jc-cta-text strong {
   color: var(--ink);
   font-weight: 500
 }

 .jc-btn {
   display: inline-flex;
   align-items: center;
   gap: 8px;
   background: var(--teal);
   color: #fff;
   font-size: 12.5px;
   font-weight: 500;
   padding: 10px 22px;
   border-radius: 6px;
   border: none;
   cursor: pointer;
   letter-spacing: 0.3px;
   text-decoration: none;
   transition: background 0.2s, transform 0.15s;
 }

 .jc-btn:hover {
   background: var(--teal-light);
   transform: translateY(-1px)
 }

 .jc-btn i {
   font-size: 14px;
   transition: transform 0.2s
 }

 .jc-btn:hover i {
   transform: translateX(3px)
 }

 .anim-fade {
   opacity: 0;
   transform: translateY(24px);
   transition: opacity 0.6s ease, transform 0.6s ease
 }

 .anim-fade.visible {
   opacity: 1;
   transform: none
 }

 .anim-left {
   opacity: 0;
   transform: translateX(-24px);
   transition: opacity 0.7s ease, transform 0.7s ease
 }

 .anim-left.visible {
   opacity: 1;
   transform: none
 }

 .anim-right {
   opacity: 0;
   transform: translateX(24px);
   transition: opacity 0.7s ease, transform 0.7s ease
 }

 .anim-right.visible {
   opacity: 1;
   transform: none
 }

 .delay1 {
   transition-delay: 0.1s
 }

 .delay2 {
   transition-delay: 0.2s
 }

 .delay3 {
   transition-delay: 0.32s
 }

 .delay4 {
   transition-delay: 0.44s
 }

 @media(max-width:540px) {
   .jc-hero {
     grid-template-columns: 1fr
   }

   .jc-right {
     grid-template-rows: 160px 140px
   }

   .jc-cards {
     grid-template-columns: 1fr
   }

   .jc-card {
     border-right: none;
     border-bottom: 1px solid var(--line)
   }
 }

 .counter {
   display: inline-block
 }





 .cvt-root {
   background: var(--color-background-tertiary);
   border-radius: 16px;
   overflow: hidden
 }

 .cvt-layout {
   display: grid;
   grid-template-columns: 350px 1fr;
   min-height: 400px
 }

 .cvt-sidebar {
   background: var(--color-background-primary);
   border-right: 0.5px solid var(--color-border-tertiary);
   padding: 20px 0;
   display: flex;
   flex-direction: column;
   gap: 6px
 }

 .cvt-sidebar-title {
   font-size: 10px;
   letter-spacing: 2px;
   text-transform: uppercase;
   color: var(--color-text-tertiary);
   padding: 0 20px 10px;
   font-weight: 500
 }

 .cvt-tab {
   display: flex;
   align-items: center;
   gap: 10px;
   padding: 11px 20px;
   cursor: pointer;
   border-left: 3px solid transparent;
   transition: all 0.2s;
   position: relative
 }

 .cvt-tab:hover {
   background: var(--color-background-secondary)
 }

 .cvt-tab.cvt-active {
   background: #EEF2FF;
   border-left-color: #4F46E5
 }

 .cvt-tab-icon {
   width: 32px;
   height: 32px;
   border-radius: 8px;
   display: flex;
   align-items: center;
   justify-content: center;
   font-size: 15px;
   flex-shrink: 0;
   transition: transform 0.2s
 }

 .cvt-tab:hover .cvt-tab-icon {
   transform: scale(1.08)
 }

 .cvt-tab-icon.ug {
   background: #EEF2FF;
   color: #4338CA
 }

 .cvt-tab-icon.pg {
   background: #FDF2F8;
   color: #9333EA
 }

 .cvt-tab-icon.btech {
   background: #FFF7ED;
   color: #EA580C
 }

 .cvt-tab-icon.phd {
   background: #ECFDF5;
   color: #059669
 }

 .cvt-tab.cvt-active .cvt-tab-icon.ug {
   background: #C7D2FE;
   color: #312E81
 }

 .cvt-tab-info {
   flex: 1;
   min-width: 0
 }

 .cvt-tab-name {
   font-size: 15px;
   font-weight: 600;
   color: var(--color-text-primary);
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis
 }

 .cvt-tab.cvt-active .cvt-tab-name {
   color: #312E81
 }

 .cvt-tab-count {
   font-size: 13px;
   color: var(--color-text-tertiary);
   margin-top: 1px
 }

 .cvt-badge {
   font-size: 15px;
   font-weight: 600;
   padding: 2px 7px;
   border-radius: 20px;
   letter-spacing: 0.3px
 }

 .cvt-badge.ug {
   background: #C7D2FE;
   color: #312E81
 }

 .cvt-badge.pg {
   background: #F3E8FF;
   color: #6B21A8
 }

 .cvt-badge.btech {
   background: #FFEDD5;
   color: #9A3412
 }

 .cvt-badge.phd {
   background: #D1FAE5;
   color: #065F46
 }

 .cvt-img-strip {
   height: 250px;
   border-radius: 10px;
   overflow: hidden;
   flex-shrink: 0;
   margin-top: auto
 }

 .cvt-img-strip-inner {
   width: 100%;
   height: 100%;
   display: flex;
   align-items: center;
   justify-content: center;
   background: #F1EFE8
 }

 .cvt-img-strip-inner i {
   font-size: 32px;
   color: #B4B2A9
 }

 .cvt-panel-wrap {
   overflow: hidden;
   display: flex;
   flex-direction: column
 }

 .cvt-panel {
   display: none;
   flex-direction: column;
   height: 100%
 }

 .cvt-panel.cvt-show {
   display: flex
 }

 .cvt-panel-header {
   padding: 20px 24px 16px;
   display: flex;
   align-items: center;
   justify-content: space-between;
   border-bottom: 0.5px solid var(--color-border-tertiary);
   background: var(--color-background-primary)
 }

 .cvt-panel-title {
   font-size: 18px;
   font-weight: 600;
   color: var(--color-text-primary)
 }

 .cvt-panel-sub {
   font-size: 12px;
   color: var(--color-text-secondary);
   margin-top: 2px
 }

 .cvt-search-bar {
   display: flex;
   align-items: center;
   gap: 8px;
   background: var(--color-background-secondary);
   border: 1px solid #8a8b8c;
   border-radius: 8px;
   padding: 6px 12px
 }

 .cvt-search-bar input {
   border: none;
   background: transparent;
   font-size: 12px;
   color: var(--color-text-primary);
   outline: none;
   width: 120px
 }

 .cvt-search-bar i {
   font-size: 14px;
   color: var(--color-text-tertiary)
 }

 .cvt-scroll-area {
   flex: 1;
   overflow-x: auto;
   overflow-y: hidden;
   padding: 20px 24px;
   /*scrollbar-width:thin;scrollbar-color:var(--color-border-secondary) transparent*/
 }

 .cvt-scroll-area::-webkit-scrollbar {
   height: 4px
 }

 .cvt-scroll-area::-webkit-scrollbar-track {
   background: transparent
 }

 .cvt-scroll-area::-webkit-scrollbar-thumb {
   background: var(--color-border-secondary);
   border-radius: 2px
 }

 .cvt-cards-row {
   display: flex;
   gap: 14px;
   /*width: max-content*/
 }

 .cvt-card {
   /*width: 350px;*/
   border-radius: 12px;
   overflow: hidden;
   border: 0.5px solid var(--color-border-tertiary);
   background: var(--color-background-primary);
   cursor: pointer;
   transition: transform 0.2s, border-color 0.2s;
   flex-shrink: 0
 }

 .cvt-card:hover {
   transform: translateY(-3px);
   border-color: var(--color-border-secondary)
 }

 .cvt-card-thumb {
   height: 180px;
   display: flex;
   align-items: center;
   justify-content: center;
   font-size: 28px;
   position: relative
 }

 .cvt-card-thumb-label {
   position: absolute;
   bottom: 8px;
   left: 8px;
   font-size: 11px;
   font-weight: 700;
   padding: 3px 8px;
   border-radius: 6px;
   letter-spacing: 0.5px
 }

 .cvt-card-body {
   padding: 10px 12px 12px
 }

 .cvt-card-name {
   font-size: 19px;
   font-weight: 600;
   color: #004687;
   margin-bottom: 3px;
   
 }

 .cvt-card-meta {
   font-size: 14px;
   color: #000
 }

 .cvt-card-tag {
   display: inline-block;
   font-size: 12px;
   padding: 2px 7px;
   border-radius: 20px;
   margin-top: 6px;
   font-weight: 500
 }

 .cvt-scroll-nav {
   display: flex;
   align-items: center;
   gap: 8px;
   padding: 0 24px 16px;
   justify-content: flex-end
 }

 .cvt-scroll-btn {
   width: 30px;
   height: 30px;
   border-radius: 50%;
   border: 0.5px solid var(--color-border-secondary);
   background: #004687;
   cursor: pointer;
   display: flex;
   align-items: center;
   justify-content: center;
   font-size: 14px;
   color: #fff;
   transition: background 0.15s, color 0.15s
 }

 .cvt-scroll-btn:hover {
   background: var(--color-background-secondary);
   border: 1px solid #004687;
   color: var(--color-text-primary)
 }

 .cvt-dots {
   display: flex;
   gap: 4px;
   align-items: center;
   flex: 1
 }

 .cvt-dot {
   width: 5px;
   height: 5px;
   border-radius: 50%;
   background: #000;
   transition: background 0.2s, width 0.2s;
   cursor: pointer
 }

 .cvt-dot.cvt-dot-active {
   background: #4F46E5;
   width: 14px;
   border-radius: 3px
 }

 @media(max-width:520px) {
   .cvt-layout {
     grid-template-columns: 1fr
   }

   .cvt-sidebar {
     flex-direction: row;
     overflow-x: auto;
     padding: 12px 16px;
     border-right: none;
     border-bottom: 0.5px solid var(--color-border-tertiary);
     gap: 8px
   }

   .cvt-sidebar-title {
     display: none
   }

   .cvt-tab {
     border-left: none;
     border-bottom: 3px solid transparent;
     padding: 8px 12px;
     flex-direction: column;
     gap: 4px;
     border-radius: 8px;
     text-align: center
   }

   .cvt-tab.cvt-active {
     border-bottom-color: #4F46E5;
     background: #EEF2FF
   }

   .cvt-tab-count,
   .cvt-badge {
     display: none
   }

   .cvt-img-strip {
     display: none
   }
 }



 .rls-wrap {
   padding: 8px 0
 }

 .rls-band {
   background: #004687;
   border-radius: 20px;
   padding: 30px 32px;
   display: flex;
   align-items: center;
   gap: 32px;
   overflow: hidden;
   min-height: 88px
 }

 .rls-label {
   flex-shrink: 0;
   min-width: 130px
 }

 .rls-label-count {
   font-size: 17px;
   font-weight: 700;
   color: #f5a623;
   line-height: 1.1
 }

 .rls-label-text {
   font-size: 13px;
   color: rgba(255, 255, 255, 0.75);
   margin-top: 2px;
   font-weight: 400;
   white-space: nowrap
 }

 .rls-divider {
   width: 1px;
   height: 44px;
   background: rgba(255, 255, 255, 0.12);
   flex-shrink: 0
 }

 .rls-track-outer {
   flex: 1;
   overflow: hidden;
   position: relative
 }

 .rls-track-outer::before,
 .rls-track-outer::after {
   content: '';
   position: absolute;
   top: 0;
   bottom: 0;
   width: 48px;
   z-index: 2
 }

 .rls-track-outer::before {
   left: 0;
   /*background:linear-gradient(to right,#0d1b4b,transparent)*/
 }

 .rls-track-outer::after {
   right: 0;
   /*background:linear-gradient(to left,#0d1b4b,transparent)*/
 }

 .rls-track {
   display: flex;
   align-items: center;
   gap: 16px;
   width: max-content;
   animation: rls-scroll 28s linear infinite
 }

 .rls-track:hover {
   animation-play-state: paused
 }

 @keyframes rls-scroll {
   0% {
     transform: translateX(0)
   }

   100% {
     transform: translateX(-50%)
   }
 }

 .rls-logo {
   background: #fff;
   border-radius: 10px;
   padding: 10px 20px;
   height: 52px;
   display: flex;
   align-items: center;
   justify-content: center;
   flex-shrink: 0;
   min-width: 120px;
   cursor: pointer;
   transition: transform 0.18s;
   border: 1.5px solid rgba(255, 255, 255, 0.08)
 }

 .rls-logo:hover {
   transform: scale(1.06)
 }

 .rls-logo span {
   font-size: 18px;
   font-weight: 700;
   white-space: nowrap;
   letter-spacing: -0.2px
 }

 .rls-logo img {
   max-height: 30px;
   max-width: 100px;
   object-fit: contain
 }

 .rls-logo-federal span {
   color: #003087
 }

 .rls-logo-foxconn span {
   color: #e31837
 }

 .rls-logo-accenture span {
   color: #a100ff
 }

 .rls-logo-accessh span {
   color: #e8231b
 }

 .rls-logo-ags span {
   color: #ff6a00
 }

 .rls-logo-tcs span {
   color: #0055a5
 }

 .rls-logo-wipro span {
   color: #341c61
 }

 .rls-logo-infosys span {
   color: #007cc3
 }

 .rls-logo-hcl span {
   color: #0076ce
 }

 .rls-logo-capgemini span {
   color: #0070ad
 }

 .rls-logo-ibm span {
   color: #1f70c1
 }

 .rls-logo-cognizant span {
   color: #1a3c6e
 }

 .rls-pause-btn {
   flex-shrink: 0;
   background: rgba(255, 255, 255, 0.1);
   border: 1px solid rgba(255, 255, 255, 0.15);
   border-radius: 50%;
   width: 32px;
   height: 32px;
   display: flex;
   align-items: center;
   justify-content: center;
   cursor: pointer;
   color: #fff;
   font-size: 13px;
   transition: background 0.15s;
   margin-left: 4px
 }

 .rls-pause-btn:hover {
   background: rgba(255, 255, 255, 0.2)
 }

 .rls-counter-row {
   display: flex;
   gap: 24px;
   padding: 16px 32px 4px;
   justify-content: center;
   flex-wrap: wrap
 }

 .rls-stat {
   text-align: center
 }

 .rls-stat-n {
   font-size: 20px;
   font-weight: 700;
   color: #0d1b4b
 }

 .rls-stat-l {
   font-size: 11px;
   color: var(--color-text-secondary);
   margin-top: 1px;
   letter-spacing: 0.3px;
   text-transform: uppercase
 }

 @media(max-width:480px) {
   .rls-band {
     padding: 0 16px;
     gap: 16px;
     min-height: 76px
   }

   .rls-label {
     min-width: 90px
   }

   .rls-label-count {
     font-size: 14px
   }

   .rls-label-text {
     font-size: 11px
   }

   .rls-logo {
     min-width: 90px;
     padding: 8px 14px;
     height: 44px
   }

   .rls-logo span {
     font-size: 11px
   }

   .rls-counter-row {
     gap: 16px;
     padding: 12px 16px 4px
   }
 }


 .fac-root {
   background: var(--fac-cream);
   overflow: hidden
 }

 .fac-header {
   display: grid;
   grid-template-columns: 1fr 1fr;
   gap: 32px;
   padding: 40px 40px 32px;
   align-items: start
 }

 .fac-eyebrow {
   font-size: 11px;
   letter-spacing: 3px;
   text-transform: uppercase;
   color: var(--fac-teal2);
   font-weight: 500;
   margin-bottom: 12px;
   display: flex;
   align-items: center;
   gap: 8px
 }

 .fac-eyebrow::before {
   content: '';
   display: block;
   width: 20px;
   height: 2px;
   background: var(--fac-teal2)
 }

 .fac-title {
   font-size: 32px;
   font-weight: 800;
   color: var(--fac-ink);
   line-height: 1.1
 }

 .fac-title span {
   color: var(--fac-teal)
 }

 .fac-right {
   display: flex;
   flex-direction: column;
   justify-content: space-between;
   gap: 16px
 }

 .fac-desc {
   font-size: 13px;
   line-height: 1.8;
   color: var(--fac-muted);
   font-weight: 300
 }

 .fac-nav-row {
   display: flex;
   align-items: center;
   gap: 10px
 }

 .fac-nav-btn {
   width: 36px;
   height: 36px;
   border-radius: 50%;
   border: 1.5px solid #15278b;
   background: transparent;
   cursor: pointer;
   display: flex;
   align-items: center;
   justify-content: center;
   font-size: 15px;
   color: var(--fac-ink);
   transition: all 0.18s
 }

 .fac-nav-btn:hover {
   background: #15278b;
   color: #fff;
   font-size: 15px;
   border-color: var(--fac-ink)
 }

 .fac-filter-row {
   display: flex;
   gap: 8px;
   flex-wrap: wrap
 }

 .fac-filter {
   font-size: 15px;
   padding: 5px 14px;
   border-radius: 20px;
   border: 1px solid #000;
   background: transparent;
   color: #000;
   cursor: pointer;
   font-weight: 500;
   transition: all 0.15s
 }

 .fac-filter:hover,
 .fac-filter.fac-active {
   background: #004687;
   color: #fff;
   border-color: var(--fac-ink)
 }

 .fac-carousel-wrap {
   overflow: hidden;
   padding: 0 40px 40px
 }

 .fac-carousel {
   display: flex;
   gap: 16px;
   transition: transform 0.45s cubic-bezier(.4, 0, .2, 1);
   will-change: transform
 }

 .fac-card {
   flex: 0 0 350px;
   border-radius: 16px;
   overflow: hidden;
   position: relative;
   cursor: pointer;
   border: 1px solid var(--fac-line)
 }

 .fac-card-bg {
   height: auto;
   display: flex;
   align-items: center;
   justify-content: center;
   position: relative;
   overflow: hidden;
   transition: transform 0.4s ease
 }

 .fac-card:hover .fac-card-bg {
   transform: scale(1.04)
 }

 .fac-card-icon-wrap {
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
   gap: 10px;
   height: 100%;
   width: 100%;
   position: relative;
   z-index: 1
 }

 .fac-card-icon-wrap i {
   font-size: 40px;
   opacity: 0.22
 }

 .fac-card-icon-wrap span {
   font-size: 12px;
   letter-spacing: 1.5px;
   text-transform: uppercase;
   opacity: 0.4;
   font-weight: 500
 }

 .fac-card-overlay {
   position: absolute;
   bottom: 0;
   left: 0;
   right: 0;
   background: #004687;
   padding: 16px;
   transform: translateY(calc(100% - 56px));
   transition: transform 0.35s cubic-bezier(.4, 0, .2, 1);
 }

 .fac-card:hover .fac-card-overlay {
   transform: translateY(0)
 }

 .fac-card-name {
   font-size: 14px;
   font-weight: 700;
   color: #fff;
   margin-bottom: 6px;
   display: flex;
   align-items: center;
   justify-content: space-between
 }

 .fac-card-name i {
   font-size: 14px;
   color: rgba(255, 255, 255, 0.5);
   transition: transform 0.2s, color 0.2s
 }

 .fac-card:hover .fac-card-name i {
   transform: translateX(4px);
   color: #fff
 }

 .fac-card-desc {
   font-size: 11px;
   color: rgba(255, 255, 255, 0.6);
   line-height: 1.6;
   font-weight: 300
 }

 .fac-card-tag {
   display: inline-block;
   font-size: 10px;
   padding: 3px 10px;
   border-radius: 20px;
   margin-top: 8px;
   font-weight: 500
 }

 .fac-card-num {
   position: absolute;
   top: 14px;
   left: 14px;
   z-index: 2;
   font-size: 11px;
   font-weight: 700;
   background: rgba(255, 255, 255, 0.9);
   color: var(--fac-ink);
   padding: 3px 8px;
   border-radius: 20px;
 }

 .fac-feature-strip {
   display: grid;
   grid-template-columns: repeat(4, 1fr);
   border-top: 1px solid var(--fac-line);
   margin: 0 40px;
   padding: 20px 0;
   gap: 0
 }

 .fac-feat {
   display: flex;
   align-items: center;
   gap: 10px;
   padding: 0 20px;
   border-right: 1px solid var(--fac-line)
 }

 .fac-feat:first-child {
   padding-left: 0
 }

 .fac-feat:last-child {
   border-right: none
 }

 .fac-feat-icon {
   width: 36px;
   height: 36px;
   border-radius: 8px;
   display: flex;
   align-items: center;
   justify-content: center;
   font-size: 17px;
   flex-shrink: 0
 }

 .fac-feat-label {
   font-size: 12px;
   font-weight: 500;
   color: var(--fac-ink)
 }

 .fac-feat-sub {
   font-size: 11px;
   color: var(--fac-muted);
   margin-top: 1px
 }

 .fac-progress-row {
   display: flex;
   align-items: center;
   gap: 12px;
   padding: 0 40px 32px
 }

 .fac-progress-dots {
   display: flex;
   gap: 5px
 }

 .fac-dot {
   width: 6px;
   height: 6px;
   border-radius: 3px;
   background: var(--fac-line);
   transition: width 0.3s, background 0.3s;
   cursor: pointer
 }

 .fac-dot.fac-dot-on {
   width: 20px;
   background: var(--fac-ink)
 }

 .fac-progress-text {
   font-size: 11px;
   color: var(--fac-muted);
   margin-left: 4px
 }

 @media(max-width:540px) {
   .fac-header {
     grid-template-columns: 1fr;
     padding: 24px 20px 20px
   }

   .fac-title {
     font-size: 24px
   }

   .fac-carousel-wrap {
     padding: 0 20px 28px
   }

   .fac-card {
     flex: 0 0 170px
   }

   .fac-card-bg {
     height: 220px
   }

   .fac-feature-strip {
     grid-template-columns: 1fr 1fr;
     margin: 0 20px
   }

   .fac-feat:nth-child(2) {
     border-right: none
   }

   .fac-feat:nth-child(3) {
     border-right: 1px solid var(--fac-line)
   }

   .fac-progress-row {
     padding: 0 20px 24px
   }
 }

 .top-bar {
   background: #f4f5f7;
   color: rgba(255, 255, 255, 0.8);
   border-bottom: 2px solid var(--gold) !important;
   font-size: 0.8rem;

   display: flex;
   justify-content: space-between;
 }

 .top-bar a {
   color: rgba(255, 255, 255, 0.8);
   text-decoration: none;
   margin-left: 20px;
   transition: color 0.3s;
 }

 .top-bar a:hover {
   color: #e94560;
 }

 .rightdeign {
   width: 400px;
   padding: 15px;
   height: 100%;
   background: linear-gradient(90deg, #037a9b, #82d8e2);
   clip-path: polygon(10% 0, 100% 0, 100% 100%, 0 100%);
   padding-left: 40px;
   padding-right: 25px;
 }



 .anno-header {
   color: #eee;
   margin: 10px 0px;
   font-size: 18px;
   border: 1px solid #fff;
   padding: 10px;
   border-left: 5px solid #2b176f;
   border-radius: 0px;
   width: 100%;
   background: #0d147b;
 }


 .anno {
   color: #111;
   border: 1px solid #2b176f;
   min-height: 200px;
   padding: 20px;
   border-radius: 0px;
   width: 100%;
   background: #d9ebf7;
   border-bottom-left-radius: 10px;
   border-bottom-right-radius: 10px;
 }


 @media only screen and (max-width: 500px) {


   .anno,
   .anno-header {
     width: 100% !important;
   }

 }


 /* VIDEO SECTION */
 .video-section {
   position: relative;
   width: 100%;
   height: 100vh;
   overflow: hidden;
 }

 .video-section video {
   width: 100%;
   height: 100%;
   object-fit: cover;
   display: block;
 }

 /* OVERLAY */
 .video-overlay {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   background: rgba(0, 0, 0, 0.45);

   display: flex;
   align-items: center;
   justify-content: center;
   text-align: center;
   padding: 20px;
 }

 .video-content {
   color: #fff;
   max-width: 700px;
 }

 .video-content h1 {
   font-size: 60px;
   margin-bottom: 20px;
   font-weight: 700;
 }

 .video-content p {
   font-size: 18px;
   line-height: 1.7;
   margin-bottom: 30px;
 }

 .video-btn {
   display: inline-block;
   padding: 14px 35px;
   background: #ff4b2b;
   color: #fff;
   text-decoration: none;
   border-radius: 50px;
   transition: 0.3s;
 }

 .video-btn:hover {
   background: #fff;
   color: #111;
 }

 /* RESPONSIVE */
 @media(max-width:768px) {

   .video-section {
     height: 75vh;
   }

   .video-content h1 {
     font-size: 36px;
   }

   .video-content p {
     font-size: 15px;
   }
 }

 @media(max-width:480px) {

   .video-section {
     height: 65vh;
   }

   .video-content h1 {
     font-size: 28px;
   }

   .video-content p {
     font-size: 14px;
   }

   .video-btn {
     padding: 12px 25px;
     font-size: 14px;
   }
 }

 @media only screen and (min-width: 250px) and (max-width: 1000px) {
   .top-bar {
     display: none;
   }
 }

 @media only screen and (min-width: 250px) and (max-width: 750px) {
   .jc-stat-num {
     font-size: 18px;
   }

   .jc-stat-label {
     font-size: 13px;
   }

   .jc-left {
     background: #004687;
     padding: 52px 20px 52px 20px;
   }

   .rls-band {
     display: list-item;
   }

   .rls-label {

     text-align: center;
     padding-top: 30px;

   }

   .rls-divider {
     background: none;
   }

   .rls-pause-btn {
     visibility: hidden;
   }

   .cvt-search-bar {
     display: none;
   }

   .fac-filter {
     font-size: 11px;
   }

   .video-section {
     height: 50vh;
   }

   .jc-cards {
     padding-top: 50px;
   }

   .jc-label-pill {
     z-index: 1;
   }

   .video-section .video-gallery {
     padding: 0px !important;
   }

   .size {
     font-size: 15px !important;
   }

 }


 /* course details */
 .course-details .course-list-element {
   list-style: none;
   padding: 0;
   margin: 0;
 }

 .course-details .course-list-element li {
   position: relative;
   padding-left: 32px;
   margin-bottom: 12px;
   line-height: 1.7;
 }

 .course-details .course-list-element li::before {
   content: "\f00c";
   font-family: "Font Awesome 5 Free";
   font-weight: 900;
   position: absolute;
   left: 0;
   top: 2px;
   color: #7cd4df;
   font-size: 16px;
 }

 .course-details .sec-title h1:before {
   content: none;
 }

 .course-details .sec-title .top-title {
   font-size: 16px;
   font-weight: 600;
   letter-spacing: 1px;
   line-height: 26px;
 }

 .course-details .about-style-three .top-content .text {
   padding-top: 0px;
 }

 .course-details .about-style-three.single-service-page {
   padding-block: 40px;
 }

 .course-details .pricing-table .table-content li {
   font-size: 15px;
 }

 .course-details .black-bg {
   background-color: #003087;
 }

 .course-details .pricing-section:nth-child(odd) .top-content:before {
   background: #003087;
 }

 .course-details .pricing-section:nth-child(odd) .pricing-table {
   background-color: rgb(226 249 255);
   border: 5px solid #ffffff;
 }

 .course-details .pricing-section:nth-child(odd) .pricing-table:hover {
   border: 5px solid #0A7F9F;
 }

 .course-details .pricing-section:nth-child(odd) .pricing-table .table-content li:before {
   color: #0A7F9F;
 }

 .course-details .pricing-section:nth-child(even) .top-content:before {
   background: #0A7F9F;
 }

 .course-details .pricing-section:nth-child(even) .pricing-table {
   background-color: rgb(242 246 255);
   border: 5px solid #ffffff;
 }

 .course-details .pricing-section:nth-child(even) .pricing-table:hover {
   border: 5px solid #003087;
 }

 .course-details .pricing-section:nth-child(even) .pricing-table .table-content li:before {
   color: #003087;
 }

 .course-details .project-block-two .content-box .top-content:before {
   background: none;
 }

 .course-details .project-block-two .content-box .top-content {
   padding-block: 20px;
 }


 .banner {
  position: relative;
  width: 100%;
  overflow: hidden;
}

.banner-track {
  display: flex;
  transition: transform 1s ease-in-out; /* slow smooth */
}

.banner-item {
  min-width: 100%;
}

.banner-item img {
  width: 100%;
  height: 550px;
  object-fit: cover;
}

/* Arrows */
.nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: rgba(0,0,0,0.4);
  color: white;
  border: none;
  padding: 12px 16px;
  cursor: pointer;
  font-size: 22px;
  border-radius: 5px;
}

.prev { left: 10px; }
.next { right: 10px; }

.nav:hover {
  background: rgba(0,0,0,0.7);
}

/* Responsive */
@media (max-width: 768px) {
  .banner-item img {
    height: 150px;
  }
  .headerlogos {
    height: 50px;
    padding-left: 10px;
  }
}



<!-----------Header ------------------->




/* ============ TOP INFO BAR ============ */
  .top-bar{
    position:relative;
    display:flex;
    align-items:stretch;
    background:#f4f5f7 !important;
    overflow:hidden;
    min-height:170px;
  }

  /* Logo panel - left navy shape */
  .logo-panel{
    position:relative;
    
    display:flex;
    align-items:center;
    justify-content:center;
    padding:00px 00px 00px 30px;
    clip-path: polygon(0 0, 82% 0, 100% 30%, 82% 100%, 0 100%);
    flex-shrink:0;
    
  }
  .logo-panel img{
    width:auto;
    height:160px;
    border-radius:50%;
    
    object-fit:contain;
    padding:4px;
  }

  /* Center text block */
  .title-block{
    flex:1;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
    
    padding-bottom: 0px !important;
    min-width:0;
  }
  .title-block h1{
    margin:0 0 10px;
    color:#12285c;
    font-size:clamp(20px, 3vw, 42px);
    letter-spacing:1px;
    font-weight:800;
    padding-top: 25px;
    white-space:nowrap;
  }
  .title-block p{
    margin:4px 0;
    color:#000;
    font-size:clamp(12px, 1.3vw, 18px);
  }
  .divider{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    margin-top:10px;
    width:80%;
    max-width:500px;
  }
  .divider .line{
    flex:1;
    height:2px;
    background:var(--gold);
  }
  .divider .diamond{
    width:14px;
    height:14px;
    background:var(--gold);
    transform:rotate(45deg);
  }

  /* Right contact panel */
  .contact-panel{
    position:relative;
    background:#12285c;
    display:flex;
    flex-direction:column;
    justify-content:center;
    gap:14px;
    padding:20px 40px 20px 70px;
    clip-path: polygon(15% 0, 100% 0, 100% 100%, 15% 100%, 0 50%);
    flex-shrink:0;
    border-top:4px solid var(--gold);
    
  }
  .contact-item{
    display:flex;
    align-items:center;
    gap:14px;
    white-space:nowrap;
  }
  .contact-icon{
    width:42px;
    height:42px;
    border-radius:50%;
    background:var(--gold);
    display:flex;
    align-items:center;
    justify-content:center;
    flex-shrink:0;
    font-size:18px;
  }
  .contact-icon.white{
    background:#fff;
    color:#12285c;
  }
  .contact-text .label{
    color:#fff;
    font-size:13px;
    display:block;
  }
  .contact-text .value{
    color:#f18f20;
    font-weight:700;
    font-size:16px;
    display:block;
  }
  .contact-divider{
    height:1px;
    background:rgba(255,255,255,0.25);
    margin:0 4px;
  }

  /* ============ STICKY NAV ============ */
  .nav-wrapper{
    position:sticky;
    top:0;
    z-index:1000;
    background:#fff;
    border-bottom:4px solid var(--gold);
    box-shadow:0 2px 8px rgba(0,0,0,0.08);
  }
  

  .nav-home{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    background:var(--gold);
    color:#12285c;
    font-weight:700;
    font-size:13px;
    padding:12px 26px;
    gap:4px;
    flex-shrink:0;
    position:relative;
    text-decoration:none;
  }
  .nav-home svg{width:20px;height:20px;}

  .nav-links{
    display:flex;
    align-items:center;
    flex:1;
  }
  .nav-links a{
    color:#12285c;
    text-decoration:none;
    font-weight:600;
    font-size:14px;
    letter-spacing:0.3px;
    padding:20px 18px;
    white-space:nowrap;
    transition:color 0.2s ease;
    flex-shrink:0;
  }
  .nav-links a:hover{
    color:#e0a300;
  }

  .nav-login{
    display:flex;
    align-items:center;
    gap:8px;
    background:#12285c;
    color:#fff;
    font-weight:700;
    font-size:14px;
    padding:0 26px;
    flex-shrink:0;
    text-decoration:none;
  }
  .nav-login svg{width:16px;height:16px;}

  /* ============ RESPONSIVE ============ */
  @media (max-width: 900px){
    .top-bar{
      flex-wrap:wrap;
      min-height:auto;
    }
    .logo-panel{
      clip-path:none;
      width:100%;
      justify-content:center;
      padding:20px;
      border-bottom:none;
    }
    .title-block{
      width:100%;
      order:2;
      padding:16px 16px 24px;
    }
    .title-block h1{
      white-space:normal;
    }
    .contact-panel{
      clip-path:none;
      width:100%;
      order:3;
      padding:20px;
      border-top:4px solid var(--gold);
      border-bottom:none;
      align-items:center;
    }
    nav{
      justify-content:flex-start;
    }
  }

  @media (max-width: 600px){
    .logo-panel img{width:80px;height:80px;}
    .nav-links a{
      padding:16px 12px;
      font-size:13px;
    }
    .nav-home{
      padding:10px 16px;
      font-size:12px;
    }
    .nav-login{
      padding:0 16px;
      font-size:13px;
    }
  }

 

  @media (min-width: 768px) and (max-width: 1920px) {
    .deskview {
      display: none;
    }
  }

  @media (min-width: 300px) and (max-width: 768px) {
    .mobileview {
      display: none;
    }

   
  }







  
.image-thumbnail-gallery {
    padding: 1rem;
    width: 100%;
    display: flex;
    flex-flow: column;
    gap: 1rem;
    position: relative;
}
.image-display {
    border-radius: var(--border-xl);
    overflow: hidden;
    min-height: 30vmin;
    /*aspect-ratio: 16 / 9;*/
    box-shadow: 0 0.375em 0.67em #0003, 0 0.5em 1.3em #0002;
}
.screen {
    block-size: 100%;
    display: flex;
    background-image: linear-gradient(12deg, #aaa, #eee);
    position: relative;
    user-select: none;
}
.screen img {
    object-fit: cover;
    object-position: center;
    width: 100%;
    height: 100%;
    animation: fade 200ms ease-out;
}
@keyframes fade {
    from { opacity: 0; }
    to { opacity: 1; }
}
.thumbnail-gallery {
    display: flex;
    gap: var(--gap);
    block-size: 100%;
}
.gallery__btn {
    flex: 1 0 max(2.75rem, 5.834%);
    background: #0000;
    border: 1px solid #0000;
    cursor: pointer;
    display: flex;
    align-items: center;
}
.arrow-icon {
    margin-inline: auto;
    outline: none;
    border: 0;
    scale: 1;
    display: inline grid;
    width: max(80%, 1.5rem);
    height: max(80%, 1.5rem);
    fill: var(--fill-primary);
}
.gallery__btn:hover .arrow-icon {
    fill: var(--fill-active);
}
.gallery__btn:disabled {
    opacity: 0.1;
    pointer-events: none;
}
.gallery__reel {
    user-select: none;
    flex-grow: 999;
    list-style: none;
    display: flex;
    gap: var(--gap);
    padding: 0.5rem;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
}
.gallery__reel::-webkit-scrollbar {
    display: none;
}
.gallery__item {
    cursor: pointer;
    border-radius: var(--border-m);
    overflow: hidden;
    scroll-snap-align: center;
    flex: 1 0 calc((100% / var(--items)) - 10px);
}
.active.gallery__item {
    outline: 0.125em solid var(--accent-color);
    outline-offset: -0.37em;
}
@media (max-width: 680px) {
    .image-thumbnail-gallery {
        width: 90vw;
    }
    .active.gallery__item {
        background-color: var(--fill-active);
        outline-offset: 3px;
    }
    .gallery__btn {
        flex-grow: 0;
    }
    .thumbnail-gallery {
        user-select: none;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .gallery__reel {
        max-width: fit-content;
        align-items: center;
        gap: 1em;
    }
    .gallery__item {
        flex: none;
        aspect-ratio: 1;
        block-size: 0.625rem;
        border-radius: 50%;
        background-color: var(--fill-primary);
    }
    .thumbnail {
        opacity: 0;
        display: none;
        aspect-ratio: 16 / 9;
        block-size: 8vw;
        position: absolute;
        border-radius: var(--border-s);
        overflow: hidden;
        z-index: 99;
        will-change: transform, opacity;
        transition: opacity 150ms ease-out;
        transform-origin: bottom;
        translate: -50%;
        bottom: 20%;
    }
    .gallery__item:not(.active):hover .thumbnail {
        opacity: 1;
        display: block;
        animation: show 250ms ease-out forwards;
        box-shadow: 0 0.375em 0.67em #0003, 0 0.5em 1.3em #0002;
    }
    @keyframes show {
        from {
            opacity: 0;
            transform: scale(0);
        }
        to {
            display: block;
            transform: scale(1);
            opacity: 1;
        }
    }
}




















<!--courses------->



.page{
    
    margin:0 auto;
    
  }
 
  


  /* ===== LEFT: content pane ===== */
  .content{
    padding:56px 52px 0 52px;
    position:relative;
    overflow:hidden;
    
  }
 
  .content h1{
    font-family:'Poppins', sans-serif;
    font-weight:800;
    font-size:clamp(28px, 3.4vw, 40px);
    margin:0 0 14px;
    letter-spacing:-0.01em;
    color:#142238;
  }
 
  .underline{
    display:flex;
    align-items:center;
    gap:6px;
    margin-bottom:26px;
  }
 
  .underline .bar{
    width:64px;
    height:4px;
    border-radius:4px;
    background:#0c3a7a;
  }
 
  .underline .dot{
    width:6px;
    height:6px;
    border-radius:50%;
    background:#0c3a7a;
  }
 
  .content p{
    font-size:15.5px;
    line-height:1.85;
    color:#000;
    
    margin:0 0 22px;
  }
 
  .skyline{
    position:absolute;
    left:0;
    right:0;
    bottom:0;
    height:280px;
    opacity:0.9;
    pointer-events:none;
  }
 
  /* fade panels in/out on switch */
  .panel{
    display:none;
    animation: fadeIn .28s ease;
  }
  .panel.is-active{
    display:block;
  }
  @keyframes fadeIn{
    from{ opacity:0; transform:translateY(6px); }
    to{ opacity:1; transform:translateY(0); }
  }
 
  /* ===== RIGHT: tab rail ===== */
  .tab-panel-wrap{
    position:relative;
    background: linear-gradient(180deg, #f7f9fc 0%, #eef1f7 100%);
    padding: 28px 26px 28px 34px;
  }
 
  .tab-panel-wrap::before{
    /* the navy spine that peeks out along the top + right edge */
    content:"";
    position:absolute;
    top:0; right:0; bottom:0; left:16px;
    background: #0c3a7a;
    border-radius: 26px 26px 0 0;
    z-index:0;
  }
 
  .tablist{
    list-style:none;
    margin:0;
    padding:0;
    position:relative;
    z-index:1;
    display:flex;
    flex-direction:column;
    gap:14px;
  }
 
  .tab{
    width:100%;
    appearance:none;
    border:none;
    cursor:pointer;
    background:#fff;
    border-radius: 14px;
    box-shadow: var(--card-shadow);
    padding:12px 18px;
    display:flex;
    align-items:center;
    gap:14px;
    text-align:left;
    font-family:'Inter', sans-serif;
    font-weight:500;
    font-size:15px;
    color:#142238;
    position:relative;
    transition: background .2s ease, color .2s ease, transform .18s ease, padding .2s ease;
  }
 
  .tab:hover{
    transform: translateX(-2px);
  }
 
  .tab:focus-visible{
    outline:2px solid #0c3a7a;
    outline-offset:2px;
  }
 
  .tab .chevron{
    width:14px;
    height:14px;
    flex-shrink:0;
    opacity:0;
    transform: translateX(-4px);
    transition: opacity .2s ease, transform .2s ease;
    color:#fff;
  }
 
  .icon-badge{
    width:38px;
    height:38px;
    border-radius:50%;
    background:#fff;
    box-shadow: 0 3px 8px rgba(20,34,56,0.12);
    display:flex;
    align-items:center;
    justify-content:center;
    flex-shrink:0;
  }
 
  .icon-badge svg{
    width:19px;
    height:19px;
    stroke:#0c3a7a;
    fill:none;
    stroke-width:1.8;
  }
 
  .tab-label{
    flex:1;
    min-width:0;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
 
  .divider{
    width:1px;
    height:22px;
    background:var(--line);
    flex-shrink:0;
  }
 
  .tab[aria-selected="true"]{
    background: #0c3a7a;
    color:#fff;
    padding-left:14px;
    box-shadow: 0 10px 24px rgba(10,47,99,0.35);
  }
 
  .tab[aria-selected="true"] .chevron{
    opacity:1;
    transform:translateX(0);
  }
 
  .tab[aria-selected="true"] .divider{
    background: rgba(255,255,255,0.35);
  }
 
  /* ===== Responsive ===== */
  @media (max-width: 860px){
    .layout{
      grid-template-columns: 1fr;
      border-radius:18px;
    }
    .content{
      padding:40px 28px 0;
      min-height:auto;
    }
    .skyline{ height:190px; }
    .tab-panel-wrap{
      padding:24px 18px 24px 24px;
    }
    .tab-panel-wrap::before{
      left:10px;
      border-radius:20px 20px 0 0;
    }
  }
 
  @media (max-width: 560px){
    .page{ padding:20px 12px; }
    .content{ padding:32px 20px 0; }
    .content p{ font-size:14.5px; }
    .tab{ padding:10px 14px; gap:12px; }
    .icon-badge{ width:34px; height:34px; }
    .icon-badge svg{ width:17px; height:17px; }
    .tab-label{ font-size:14px; }
    .divider{ display:none; }
  }
 
  @media (prefers-reduced-motion: reduce){
    .tab{ transition:none; }
    .panel{ animation:none; }
  }





  
  /* ===== Accordion ===== */
  .accordion{
    display:flex;
    flex-direction:column;
    gap:14px;
    background:#fff;
    border-radius:22px;
    padding:14px;
    box-shadow: 0 20px 60px rgba(20,34,56,0.08);
  }

  .acc-item{
    border-radius:14px;
    border:1px solid var(--line);
    overflow:hidden;
    background:#fff;
    transition: border-color .2s ease, box-shadow .2s ease;
  }

  .acc-item.open{
    border-color: transparent;
    box-shadow: 0 10px 26px rgba(10,47,99,0.12);
  }

  .acc-header{
    all:unset;
    box-sizing:border-box;
    width:100%;
    display:flex;
    align-items:center;
    gap:16px;
    padding:16px 18px;
    cursor:pointer;
    background:#fff;
    transition: background .2s ease;
  }

  .acc-item.open .acc-header{
    background: #0c3a7a;
    color:#fff;
  }

  /* Icon: same visual treatment for every item, only the glyph path changes */
  .acc-icon{
    width:42px;
    height:42px;
    border-radius:50%;
    flex-shrink:0;
    background: var(--panel-bg);
    display:flex;
    align-items:center;
    justify-content:center;
    box-shadow: 0 3px 8px rgba(20,34,56,0.10);
    transition: background .2s ease;
  }
  .acc-item.open .acc-icon{
    background:#fff;
  }
  .acc-icon svg{
    width:20px;
    height:20px;
    fill:none;
    stroke: #0c3a7a;
    stroke-width:1.8;
    stroke-linecap:round;
    stroke-linejoin:round;
  }

  .acc-title{
    flex:1;
    min-width:0;
    text-align:left;
    font-weight:600;
    font-size:15.5px;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }

  .acc-count{
    font-family:'Poppins', sans-serif;
    font-size:12px;
    font-weight:700;
    letter-spacing:0.5px;
    opacity:0.55;
    flex-shrink:0;
    margin-right:4px;
  }

  .acc-chevron{
    width:18px;
    height:18px;
    flex-shrink:0;
    transition: transform .25s ease;
  }
  .acc-chevron svg{
    width:100%;
    height:100%;
    stroke: #0c3a7a;
    stroke-width:2.2;
    fill:none;
    stroke-linecap:round;
    stroke-linejoin:round;
  }
  .acc-item.open .acc-chevron{
    transform: rotate(180deg);
  }
  .acc-item.open .acc-chevron svg{
    stroke:#fff;
  }

  .acc-panel{
    display:grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows .3s ease;
  }
  .acc-item.open .acc-panel{
    grid-template-rows: 1fr;
  }
  .acc-panel-inner{
    overflow:hidden;
  }
  .acc-body{
    padding: 20px 22px 24px 76px;
  }
  .acc-body p{
    font-size:14.5px;
    line-height:1.85;
    color:var(--body-text);
    margin:0 0 16px;
  }
  .acc-body p:last-child{
    margin-bottom:0;
  }

  .acc-header:focus-visible{
    outline: 2px solid #0c3a7a;
    outline-offset: -2px;
  }

  /* ===== Responsive ===== */
  @media (max-width: 640px){
    .page{ padding:40px 16px; }
    .accordion{ padding:10px; border-radius:18px; }
    .acc-header{ padding:13px 14px; gap:12px; }
    .acc-icon{ width:36px; height:36px; }
    .acc-icon svg{ width:17px; height:17px; }
    .acc-title{ font-size:14.5px; }
    .acc-count{ display:none; }
    .acc-body{ padding:16px 16px 20px 62px; }
    .acc-body p{ font-size:14px; }
  }

  @media (prefers-reduced-motion: reduce){
    .acc-panel, .acc-chevron, .acc-item, .acc-header, .acc-icon{ transition:none; }
  }


  /* ===== Table card shell ===== */
  .table-card{
    background:#fff;
    border-radius:18px;
    box-shadow:0 20px 60px rgba(20,34,56,0.08);
    overflow:hidden;
  }
 
  /* ===== Toolbar: search + count ===== */
  .table-toolbar{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:18px 20px;
    border-bottom:1px solid #e7eaf1;
    flex-wrap:wrap;
  }
  .table-toolbar input[type="search"]{
    flex:1;
    min-width:180px;
    max-width:280px;
    padding:9px 14px;
    border-radius:10px;
    border:1px solid #e7eaf1;
    font-family:inherit;
    font-size:13.5px;
    outline:none;
    transition:border-color .2s ease;
  }
  .table-toolbar input[type="search"]:focus{
    border-color:#0c3a7a;
  }
  .result-count{
    font-size:12.5px;
    color:var(--body-text);
    white-space:nowrap;
  }
 
  /* ===== Desktop table ===== */
  .table-scroll{
    overflow-x:auto;
  }
  table{
    width:100%;
    border-collapse:collapse;
    min-width:640px;
  }
  thead th{
    text-align:left;
    font-size:12px;
    text-transform:uppercase;
    letter-spacing:0.6px;
    font-weight:700;
    color:#fff;
    background:#0c3a7a;
    padding:14px 18px;
    white-space:nowrap;
    position:sticky;
    top:0;
    cursor:pointer;
    user-select:none;
  }
  thead th .sort-icon{
    display:inline-block;
    margin-left:6px;
    font-size:10px;
    opacity:0.6;
  }
  thead th:first-child{ border-top-left-radius:0; }
 
  tbody td{
    padding:14px 18px;
    font-size:14px;
    border-bottom:1px solid #e7eaf1;
    vertical-align:middle;
  }
  tbody tr:nth-child(even){ background:var(--stripe); }
  tbody tr:hover{ background:#eef3fb; }
  tbody tr:last-child td{ border-bottom:none; }
 
  .name-cell{
    display:flex;
    align-items:center;
    gap:12px;
  }
  .avatar{
    width:36px; height:36px;
    border-radius:50%;
    background:#0c3a7a;
    color:#fff;
    font-family:'Poppins', sans-serif;
    font-weight:700;
    font-size:13px;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-shrink:0;
  }
  .name-cell .meta{ min-width:0; }
  .name-cell .full-name{ font-weight:600; }
  .name-cell .role{ font-size:12px; color:var(--body-text); }
 
  .badge{
    display:inline-block;
    padding:4px 10px;
    border-radius:20px;
    font-size:11.5px;
    font-weight:600;
    background:#e6f4ea;
    color:#1e7a3c;
  }
  .badge.leave{
    background:#fdecea;
    color:#c0392b;
  }
 
  .row-empty{
    text-align:center;
    padding:40px 20px;
    color:#000;
    font-size:14px;
    display:none;
  }
  .row-empty.show{ display:block; }
 
  /* ===== Mobile: card-list transform ===== */
  @media (max-width: 700px){
    .table-scroll{ overflow-x:visible; }
    table, thead, tbody, th, td, tr{ display:block; }
    thead{
      position:absolute;
      top:-9999px;
      left:-9999px;
    }
    table{ min-width:0; }
 
    tbody tr{
      background:#fff;
      border-bottom:1px solid #e7eaf1;
      padding:16px 18px;
    }
    tbody tr:nth-child(even){ background:#fff; }
 
    tbody td{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:12px;
      padding:8px 0;
      border-bottom:none;
      font-size:13.5px;
    }
    tbody td::before{
      content: attr(data-label);
      font-weight:600;
      font-size:11.5px;
      text-transform:uppercase;
      letter-spacing:0.4px;
      color:#0c3a7a;
      flex-shrink:0;
    }
    tbody td.name-td::before{ display:none; }
    tbody td.name-td{
      padding-bottom:12px;
      border-bottom:1px solid #e7eaf1;
      margin-bottom:6px;
    }
    .name-cell{ width:100%; }
  }
 
  @media (max-width: 420px){
    .wrap{ padding:32px 12px; }
    .table-toolbar{ padding:14px 16px; }
    tbody tr{ padding:14px; }
  }




  
  /* ================= shared banner shell ================= */
  .banners{
    position:relative;
    display:flex;
    align-items:center;
    min-height:250px;
  }

  .banner-card{
    position:relative;
    flex:1;
    background:#fff;
    border-radius:22px;
    padding:38px 60px 42px;
    box-shadow: 0 22px 45px rgba(20,53,107,0.14);
    overflow:hidden;
    text-align:center;
  }

  .banner-card h2{
    font-weight:700;
    font-size:2.4rem;
    margin:0 0 14px;
  }

  .dividers{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:0;
    margin:0 auto 22px;
    width:min(420px, 70%);
    position:relative;
  }
  .dividers::before,
  .dividers::after{
    content:"";
    height:8px;
    width:8px;
    border-radius:50%;
    flex-shrink:0;
  }
  .dividers .lines{
    flex:1;
    height:2px;
    position:relative;
  }
  .dividers .arrow{
    position:absolute;
    left:50%;
    top:2px;
    transform:translateX(-50%);
    width:0; height:0;
    border-left:6px solid transparent;
    border-right:6px solid transparent;
  }

  .banner-card p{
    font-size:1.12rem;
    line-height:1.75;
    color:var(--text);
    max-width:640px;
    margin:0 auto;
  }

  /* folded ribbon behind card, peeking out on one side */
  .fold{
    position:absolute;
    top:8px;
    bottom:8px;
    width:170px;
    border-radius:22px;
    z-index:0;
  }

  .fold .shine{
    position:absolute;
    top:0; bottom:0;
    width:34px;
    background: rgba(255,255,255,0.55);
    filter: blur(1px);
  }

  /* icon medallion */
  .medallion{
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    width:190px;
    height:190px;
    z-index:2;
  }

  .ring-arc{
    position:absolute;
    inset:0;
    border-radius:50%;
  }

  .disc{
    position:absolute;
    top:14px; left:14px; right:14px; bottom:14px;
    border-radius:50%;
    background:#fff;
    box-shadow: 0 10px 24px rgba(20,53,107,0.18);
    display:flex;
    align-items:center;
    justify-content:center;
  }
  .disc::before{
    content:"";
    position:absolute;
    inset:14px;
    border-radius:50%;
    border:1.5px dashed #4f96e8;
  }
  .disc svg{
    width:60px;
    height:60px;
    position:relative;
    z-index:1;
  }

  .pin{
    position:absolute;
    width:16px; height:16px;
    border-radius:50%;
    background:#fff;
    border:4px solid #1f6fd6;
    top:50%;
    transform:translateY(-50%);
  }

  /* ================= VISION (icon left, fold right) ================= */
  .banners.vision{
    padding-left:150px;
  }
  .banners.vision .medallion{
    left:0;
  }
  .banners.vision .pin{ left:-8px; }
  .banners.vision .ring-arc{
    border: 5px solid #1f6fd6;
    border-right-color: transparent;
    border-bottom-color: transparent;
    transform: rotate(-40deg);
  }
  .banners.vision .disc svg{ stroke:#1f6fd6; }

  .banners.vision .fold{
    right:-40px;
    background: linear-gradient(135deg, #4f96e8, #1f6fd6);
    clip-path: polygon(30% 0, 100% 0, 70% 100%, 0% 100%);
  }
  .banners.vision .fold .shine{ right:36px; }
  .banners.vision .fold .shine.s2{ right:14px; background:rgba(255,255,255,0.35); width:18px; }

  .banners.vision h2{ color: #1f6fd6; }
  .dividers.vision-line .line{ background:#1f6fd6; }
  .dividers.vision-line::before,
  .dividers.vision-line::after{ background:#1f6fd6; }
  .dividers.vision-line .arrow{ border-top:8px solid #1f6fd6; }

  /* ================= MISSION (icon right, fold left) ================= */
  .banners.mission{
    padding-right:150px;
    justify-content:flex-end;
  }
  .banners.mission .medallion{
    right:0;
  }
  .banners.mission .pin{ right:-8px; }
  .banners.mission .ring-arc{
    border: 5px solid #14356b;
    border-left-color: transparent;
    border-top-color: transparent;
    transform: rotate(-40deg);
  }
  .banners.mission .disc svg{ stroke:#14356b; }

  .banners.mission .fold{
    left:-40px;
    background: linear-gradient(135deg, #14356b, #0d2750);
    clip-path: polygon(0 0, 70% 0, 100% 100%, 30% 100%);
  }
  .banners.mission .fold .shine{ left:36px; }
  .banners.mission .fold .shine.s2{ left:14px; background:rgba(255,255,255,0.28); width:18px; }

  .banners.mission h2{ color: #14356b; }
  .dividers.mission-line .line{ background:#14356b; }
  .dividers.mission-line::before,
  .dividers.mission-line::after{ background:#14356b; }
  .dividers.mission-line .arrow{ border-top:8px solid #14356b; }

  /* ================= Responsive ================= */
  @media (max-width: 860px){
    .page{ padding:56px 24px; gap:110px; }
    .banners{ min-height:0; }
    .banners.vision, .banners.mission{
      padding-left:0;
      padding-right:0;
      padding-top:70px;
      justify-content:center;
    }
    .banner-card{
      padding:34px 28px 34px;
      width:100%;
    }
    .medallion{
      top:-70px;
      transform:none;
      left:50% !important;
      right:auto !important;
      margin-left:-95px;
      width:170px;
      height:170px;
    }
    .banner.vision .pin, .banner.mission .pin{
      top:-8px;
      left:50%;
      right:auto;
      transform:translateX(-50%);
    }
    .fold{ display:none; }
    .banner-card h2{ font-size:2rem; }
    .banner-card p{ font-size:1rem; }
  }

  @media (max-width: 480px){
    .page{ padding:44px 16px; gap:90px; }
    .medallion{
      width:130px; height:130px;
      margin-left:-65px;
      top:-52px;
    }
    .disc svg{ width:46px; height:46px; }
    .banner-card{ padding:28px 18px 26px; border-radius:18px; }
    .banner.vision, .banner.mission{ padding-top:52px; }
    .banner-card h2{ font-size:1.6rem; }
    .banner-card p{ font-size:0.92rem; line-height:1.65; }
    .dividers{ width:85%; margin-bottom:16px; }
  }