@import url("bootstrap.min.css");
@import url("font-awesome.min.css");
@import url("animate.css");
@import url("hover.css");
@import url("magnific-popup.css");
@import url("owl.carousel.css");
@import url("owl.transitions.css");
@import url("settings.css");
@import url("layers.css");
@import url("navigation.css");

@import url("https://fonts.googleapis.com/css2?family=Pacifico&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Saira+Extra+Condensed:wght@100;200;300;400;500;600;700;800;900&family=Saira:ital,wght@0,100..900;1,100..900&family=Sarpanch:wght@400;500;600;700;800;900&family=Seaweed+Script&family=Source+Code+Pro:ital,wght@0,200..900;1,200..900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Pacifico&family=Saira:ital,wght@0,100..900;1,100..900&family=Sarpanch:wght@400;500;600;700;800;900&family=Seaweed+Script&family=Source+Code+Pro:ital,wght@0,200..900;1,200..900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Exo+2:ital,wght@0,100..900;1,100..900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Exo+2:ital,wght@0,100..900;1,100..900&family=Manrope:wght@200..800&display=swap");

html {
  scroll-behavior: smooth;
}

body {
    font-family: "Sarpanch", sans-serif;
    font-size: 1em;
    line-height: 1.65;
    color: black;
    background-color: white;
    overflow-x: hidden;
}

::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-thumb {
    cursor: pointer;
    background: #c5a47e;
}

::selection {
    background-color: rgba(228, 185, 94, 1);
    color: #000000;
}

-webkit-::selection {
    background-color: #c5a47e;
    color: #fff;
}

::-moz-selection {
    background-color: #c5a47e;
    color: #fff;
}

/* 1.2 Typography */

a {
    text-decoration: none;
}

li {
    list-style-type: none;
}
h1,
.h1 {
    font-family: "Oswald", sans-serif;
    font-weight: 400;
    font-size: 8vmin;
    line-height: 1.2;
    color: rgba(64, 55, 55, 1);
}

h2,
.h2 {
    font-family: "Saira";
    font-size: 30px;
    font-weight: 500;
    line-height: 19.5px;
    letter-spacing: 3px;
    text-align: center;
    color: rgba(64, 55, 55, 1);
}

h3,
.h3 {
    font-family: "montserratsemibold";
    font-size: 1.875em;
    line-height: 1.1;
    font-weight: normal;
    color: rgba(64, 55, 55, 1);
}

h4,
.h4 {
    font-family: "montserratsemibold";
    font-size: 1.125em;
    line-height: 1.35;
    font-weight: normal;
    color: rgba(64, 55, 55, 1);
}

h1 a,
.h1 a,
h2 a,
.h2 a,
h3 a,
.h3 a,
h4 a,
.h4 a {
    color: inherit;
}

h1 a:hover,
.h1 a:hover,
h2 a:hover,
.h2 a:hover,
h3 a:hover,
.h3 a:hover,
h4 a:hover,
.h4 a:hover {
    text-decoration: none;
}

p {
    margin-bottom: 1.6em;
}

b,
strong {
    font-family: "Saira";
}

ul {
    list-style: none;
    padding-left: 0;
}

a {
    color: #c5a47e;
    -webkit-transition: color 0.3s ease-out;
    -o-transition: color 0.3s ease-out;
    transition: color 0.3s ease-out;
}

a:hover,
a:focus {
    color: #c5a47e;
    outline: none;
}

a:focus {
    text-decoration: none;
}

/* 1.3 Fields */

.form-control,
textarea.form-control {
    font-family: "Saira";
    font-size: 20px;
    font-weight: 400;

    font-size: 1em;
    height: 3.625em;
    border-radius: 0.75em;
    padding-left: 22px;
    border: none;
    color: #6d6363 !important;
    background-color: #f3f3f3;
    /* border: 1px solid #323232; */
    -webkit-box-shadow: none;
    box-shadow: none;
    -webkit-appearance: none;
    -webkit-transition: all 0.15s;
    -o-transition: all 0.15s;
    transition: all 0.15s;
}

textarea.form-control {
    height: 136px;
    padding-top: 1.1em;
    resize: none;
}

.cform-control {
    font-family: "Saira";
    font-size: 20px;
    font-weight: 400;
    font-size: 1em;
    height: 3.625em;
    padding-left: 22px;
    border-bottom: 1px solid #323232;
    color: #6d6363 !important;
    background-color: #f3f3f3;
    -webkit-box-shadow: none;
    box-shadow: none;
    -webkit-appearance: none;
    -webkit-transition: all 0.15s;
    -o-transition: all 0.15s;
    transition: all 0.15s;
}
.form-control:focus {
    border-color: #c5a47e;
    outline: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.form-control::-moz-placeholder {
    color: #fff;
    opacity: 1;
}

.form-control:-ms-input-placeholder {
    color: #fff;
}

.form-control::-webkit-input-placeholder {
    color: #fff;
}

.form-control.error {
    border-color: #c5a47e;
}

.form-group {
    margin-bottom: 10px;
}

.wobble-error {
    -webkit-animation: hvr-wobble-horizontal 1s ease-in-out 0s 1 normal;
    animation: hvr-wobble-horizontal 1s ease-in-out 0s 1 normal;
}

label.error {
    display: none !important;
}

/* 1.4 Buttons */

.btn {
    font-family: "Saira";
    position: relative;
    display: inline-block;
    border: 0.2em solid #c5a47e;
    border-radius: 30px;
    padding: 5px 12px;
    font-size: 0.875em;
    color: #453c3c;
    letter-spacing: 0.15em;
    text-transform: capitalize;
    text-decoration: none;
    background-color: #dbc470;
    border: 0;
    -webkit-transition: all 0.3s ease-out !important;
    transition: all 0.3s ease-out !important;
}

.btn:hover,
.btn:focus {
    color: #131313;
    background-color: #8d8d8d;
    -webkit-box-shadow: none;
    box-shadow: none;
    outline: none !important;
}

.btn .icon-next {
    position: relative;
    top: -0.1em;
    margin-left: 0.6em;
    vertical-align: middle;
}

.btn-gray {
    background-color: #323232;
    border-color: #323232;
}

.btn-gray:hover {
    background-color: #c5a47e;
}

.btn-shadow-1 {
    box-shadow: 0 15px 34px rgba(0, 0, 0, 0.18);
}

.btn-shadow-2 {
    box-shadow: 0 15px 34px rgba(0, 0, 0, 0.18);
}

/* 1.5 Icons */

.icon-next {
    display: inline-block;
    width: 0.94em;
    height: 0.75em;
    background: url(../img/img-icon/next.png) 0 0 no-repeat;
    background-size: 0.94em 0.75em;
}

/* 1.6 Loader */

.loader {
    position: fixed;
    overflow: hidden;
    z-index: 100;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: #272727;
    color: #fff;
    text-align: center;
}

.loader-brand {
    position: absolute;
    left: 0;
    width: 100%;
    top: 50%;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    -o-transform: translate(0, -50%);
    transform: translate(0, -50%);
}

.sk-folding-cube {
    margin: 20px auto;
    width: 40px;
    height: 40px;
    position: relative;
    -webkit-transform: rotateZ(45deg);
    transform: rotateZ(45deg);
}

.sk-folding-cube .sk-cube {
    float: left;
    width: 50%;
    height: 50%;
    position: relative;
    -webkit-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
}

.sk-folding-cube .sk-cube:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #e5cd75;
    -webkit-animation: sk-foldCubeAngle 2.4s infinite linear both;
    animation: sk-foldCubeAngle 2.4s infinite linear both;
    -webkit-transform-origin: 100% 100%;
    -ms-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
}

.sk-folding-cube .sk-cube2 {
    -webkit-transform: scale(1.1) rotateZ(90deg);
    transform: scale(1.1) rotateZ(90deg);
}

.sk-folding-cube .sk-cube3 {
    -webkit-transform: scale(1.1) rotateZ(180deg);
    transform: scale(1.1) rotateZ(180deg);
}

.sk-folding-cube .sk-cube4 {
    -webkit-transform: scale(1.1) rotateZ(270deg);
    transform: scale(1.1) rotateZ(270deg);
}

.sk-folding-cube .sk-cube2:before {
    -webkit-animation-delay: 0.3s;
    animation-delay: 0.3s;
}

.sk-folding-cube .sk-cube3:before {
    -webkit-animation-delay: 0.6s;
    animation-delay: 0.6s;
}

.sk-folding-cube .sk-cube4:before {
    -webkit-animation-delay: 0.9s;
    animation-delay: 0.9s;
}

@-webkit-keyframes sk-foldCubeAngle {
    0%,
    10% {
        -webkit-transform: perspective(140px) rotateX(-180deg);
        transform: perspective(140px) rotateX(-180deg);
        opacity: 0;
    }
    25%,
    75% {
        -webkit-transform: perspective(140px) rotateX(0deg);
        transform: perspective(140px) rotateX(0deg);
        opacity: 1;
    }
    90%,
    100% {
        -webkit-transform: perspective(140px) rotateY(180deg);
        transform: perspective(140px) rotateY(180deg);
        opacity: 0;
    }
}

@keyframes sk-foldCubeAngle {
    0%,
    10% {
        -webkit-transform: perspective(140px) rotateX(-180deg);
        transform: perspective(140px) rotateX(-180deg);
        opacity: 0;
    }
    25%,
    75% {
        -webkit-transform: perspective(140px) rotateX(0deg);
        transform: perspective(140px) rotateX(0deg);
        opacity: 1;
    }
    90%,
    100% {
        -webkit-transform: perspective(140px) rotateY(180deg);
        transform: perspective(140px) rotateY(180deg);
        opacity: 0;
    }
}

/* 1.7 Content styles */

.layout {
    position: relative;
    overflow: hidden;
}

.text-primary {
    /*color: #ccb358;*/
    color: rgba(232, 190, 99, 1);

}

.page-lines {
    position: absolute;
    z-index: -1;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

.page-lines .col-line {
    padding: 0;
}

.page-lines .line {
    position: absolute;
    left: 0;
    width: 1px;
    height: 50000px;
    background-color: #1f1d1c;
    opacity: 5%;
}

.page-lines .col-line:last-child .line:last-child {
    left: auto;
    right: 0;
}

.row-base {
    margin-top: -3em;
}

.col-base {
    margin-top: 3em;
}

.section {
    position: relative;
    padding-top: 4.1em;
}

.section-header {
    position: relative;
}

.section-title {
    text-align: center;
    margin: 0;
    /* margin-left: 0.32em; */
    text-transform: uppercase;
}

.fade-title-left {
    font-family: "Saira";
    font-size: 124px;
    font-weight: 700;
    line-height: 19.5px;
    letter-spacing: 1px;
    line-height: 1;
    color: rgba(31, 29, 28, 1);
    position: absolute;
    left: 85px;
    top: 0.03em;
    opacity: 0.03;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.fade-title-right {
    font-family: "Saira";
    font-size: 124px;
    font-weight: 700;
    line-height: 19.5px;
    letter-spacing: 1px;
    line-height: 1;
    color: rgba(31, 29, 28, 1);
    position: absolute;
    left: 45px;
    top: 0.03em;
    opacity: 0.03;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.fade-title-right {
    left: 100%;
}

.newcompany {
    font-family: "Saira";
    font-size: 70px;
    font-weight: 700;
    line-height: 19.5px;
    letter-spacing: 1px;
    line-height: 1;
    position: absolute;
    color: rgb(248 248 248);
    right: 0px;
    top: 60px;
}

.section-content {
    margin-top: 7.1em;
}
.firstrowclient {
    margin-top: 60px;
}
/*-------------------------------------------------------------------------------
  2. Header
-------------------------------------------------------------------------------*/

.header-inner .vertical-panel-content {
    bottom: auto;
    top: 12.2vmin;
}

/* 2.1 Brand */

/* .brand-panel {
    position: absolute;
    z-index: 4;
    left: 0;
    top: 0;
    width: 39.47vmin;
    height: 40.7vmin;
    padding: 4.8vmin 2em 4.8vmin;
    background: rgba(229, 205, 117, 1);
    text-align: center;
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
} */
.brand-panel {
    position: absolute;
    z-index: 4;
    left: 0;
    top: 0;
    width: 30.47vmin;
    height: 24.7vmin;
    padding: 16px 6px;
    background: rgb(219 177 85);
    /*background: rgba(229, 205, 117, 1);*/
/*background: linear-gradient(90deg, #BE9336 0%, #FED57B 54%, #C99D40 100%);*/
    text-align: center;
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

.brand-panel1 {
    position: absolute;
    z-index: 4;
    left: 0;
    top: 0;
    width: 30.47vmin;
    height: 24.7vmin;
    padding: 16px 6px;
    background: rgb(204 161 69);
    /*background: rgba(229, 205, 117, 1);*/
/*background: linear-gradient(90deg, #BE9336 0%, #FED57B 54%, #C99D40 100%);*/
    text-align: center;
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}
.brand {
    display: inline-block;
    font-family: "Saira";
    font-weight: 700;
    font-size: 4vmin;
    line-height: 1;
    color: #fff;
}

.brand:hover,
.brand:focus {
    color: #fff;
    text-decoration: none;
}

.brand-name {
    position: absolute;
    z-index: -1;
    bottom: -0.4em;
    right: -0.38em;
    font-family: "Saira";
    font-weight: 700;
    font-size: 8.75em;
    line-height: 1;
    opacity: 0.04;
    color: #fff;
}

.slide-number {
    font-family: "Oswald", sans-serif;
    margin-top: 8vmin;
}

.slide-number .current-number {
    font-size: 8vmin;
    letter-spacing: 0.1em;
    line-height: 1;
}

.slide-number sup {
    display: inline-block;
    position: relative;
    top: -3px;
    font-size: 2vmin;
    letter-spacing: 0.1em;
    color: #5e5e5e;
    vertical-align: top;
    margin-left: 0.46em;
}

.slide-number sup .delimiter {
    display: inline-block;
    margin-right: 0.4em;
}

.header-phone {
    font-family: "Oswald", sans-serif;
    font-weight: 300;
    font-size: 0.81em;
    letter-spacing: 0.32em;
    position: absolute;
    z-index: 3;
    color: #fff;
    left: 45vmin;
    top: 5.9vmin;
}

@media (max-width: 480px) {
    .header-phone {
        display: none;
    }
}

@media (min-width: 992px) and (max-width: 1200px) {
    .header-phone {
        display: none;
    }
}

/* 2.2 Vertical Panel */

.vertical-panel,
.vertical-panel-content {
    position: absolute;
    width: 19.735vmin;
    left: 0;
    bottom: 0;
    text-align: center;
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

.vertical-panel1,
.vertical-panel-content1 {
    position: absolute;
    width: 19.735vmin;
    left: 0;
    bottom: 0;
    text-align: center;
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

.vertical-panel1, .vertical-panel-content1{
    bottom: 31% !important;
}

.vertical-panel {
    z-index: 3;
    height: 100%;
   background: linear-gradient(180deg, #BE9336 0%, #FED57B 54%, #C99D40 100%);
    /*background: rgba(229, 205, 117, 1);*/
}

.vertical-panel1 {
    z-index: 3;
    height: 50%;
   background: linear-gradient(180deg, #BE9336 0%, #FED57B 54%, #C99D40 100%);
    /*background: rgba(229, 205, 117, 1);*/
}

.vertical-panel-content {
    z-index: 4;
}

.vertical-panel-content1 {
    z-index: 4;
}

.vertical-panel-info {
    margin-bottom: 3.5vmin;
}

.vertical-panel-info .line {
    height: 9vmin;
    width: 1px;
    /* margin: 15px auto 0; */
    margin: 2px auto 0;
    background-color: #646464;
}

.vertical-panel-title {
    display: none;
}

.social-list {
    margin-bottom: 3.5vmin;
}

.social-list li {
    margin-top: 3.8vmin;
}

.social-list i {
    font-size: 20px;
    color: rgba(35, 31, 32, 1);
}
.social-list .fa {
    font-size: 20px;
    color: rgba(35, 31, 32, 1);
}

.social-list .fa:hover {
    color: #000000;
    text-decoration: none;
}

/* 2.3 Navbar Desctop */

.nav > li > a {
    padding: 0;
}

.nav > li > a:hover,
.nav > li > a:focus {
    background-color: transparent;
}

.navbar-desctop {
    display: none;
    position: absolute;
    z-index: 2;
    top: 0;
    left: 0;
    width: 100%;
    padding: 2.9vmin 0 0;
}

.navbar-desctop .brand {
    display: none;
    position: relative;
    top: -0.22em;
    font-size: 1.6em;
}

.navbar-desctop-menu {
    float: right;
    font-family: "Saira";
    font-size: 13px;
    font-weight: 400;
    line-height: 19.5px;
    letter-spacing: 1px;

    margin-bottom: 0;
}

.navbar-desctop-menu li {
    position: relative;
    -webkit-perspective: 2000px;
    perspective: 2000px;
}

.navbar-desctop-menu li a {
    display: block;
    text-decoration: none;
    color: #fff;
}

.navbar-desctop-menu li a:hover,
.navbar-desctop-menu .active > a {
    color: rgba(232, 190, 99, 1);
}

.navbar-desctop-menu > li {
    float: left;
    margin-left: 4.1em;
}

.navbar-desctop-menu > li > a {
    color: #fff;
    background-color: transparent;
    margin-bottom: 1.5em;
}

.navbar-desctop-menu li ul {
    position: absolute;
    z-index: 10;
    left: 100%;
    top: 60%;
    visibility: hidden;
    min-width: 200px;
    opacity: 0;
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.1);
    background: rgba(50, 50, 50, 0.95);
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}

.navbar-desctop-menu > li > ul {
    left: -20px;
    margin-top: 0;
}

.navbar-desctop-menu li:hover > ul {
    top: 0;
    visibility: visible;
    opacity: 1;
}

.navbar-desctop-menu > li:hover > ul {
    top: 100%;
}

.navbar-desctop-menu li li {
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

.navbar-desctop-menu li li:last-child {
    border-bottom: 0;
}

.navbar-desctop-menu li li a {
    color: #fff;
    padding: 12px 20px 10px;
}

/* 2.4 Navbar Desctop Affix */

.navbar-desctop.affix {
    position: fixed;
    z-index: 5;
    top: 0;
    background-color: rgba(50, 50, 50, 0.95);
    padding: 1.3em 0 0;
    box-shadow: 0 0 35px rgba(0, 0, 0, 0.1);
}

.navbar-desctop.affix.affix-top {
    padding-top: 2.2em;
}

.navbar-desctop.affix .brand {
    display: inline-block;
}

.navbar-desctop.affix .navbar-desctop-menu li a {
    color: #fff;
}

.navbar-desctop.affix .navbar-desctop-menu li > a:hover,
.navbar-desctop.affix .navbar-desctop-menu .active > a {
    color: rgba(232, 190, 99, 1);
}

/* 2.5 Navbar Mobile */

.navbar-mobile {
    position: absolute;
    z-index: 2;
    left: 0;
    top: 0;
    width: 100%;
    padding: 6vmin 0;
}

.navbar-mobile .brand {
    display: none;
    margin-left: 15px;
    font-size: 1.6em;
}

.navbar-collapse {
    border: 0;
    background-color: rgba(50, 50, 50, 0.95);
    -webkit-box-shadow: none;
    box-shadow: none;
}

@media (max-height: 320px) {
    .navbar-collapse {
        max-height: 240px;
    }
}

.navbar-toggle {
    padding: 0;
    margin-top: 0;
    margin-bottom: 0;
    border-radius: 0;
    border: 0;
}

.navbar-toggle .icon-bar {
    background-color: #fff;
    height: 2px;
    width: 30px;
}

.navbar-toggle .icon-bar + .icon-bar {
    margin-top: 5px;
}

.navbar-toggle.collapsed .icon-bar {
    background-color: #fff;
}

.navbar-nav-mobile {
    font-family: "Oswald", sans-serif;
    font-weight: 300;
    font-size: 0.9em;
    letter-spacing: 0.32em;
    text-transform: uppercase;
    padding-top: 1.2em;
    margin-bottom: 0;
}

.navbar-nav-mobile li {
    position: relative;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.navbar-nav-mobile li a {
    display: block;
    padding: 1em 1em;
    color: #fff;
    text-decoration: none;
}
.dropdown-item {
    color: #000 !important;
    font-family: "Saira";
    font-size: 17px;
    font-weight: 500;
    line-height: 19.5px;
    letter-spacing: 1px;
}
.mobile_drop {
    /*background: #000;*/
    /*border-top: 1px solid rgba(255, 255, 255, 0.1);*/
    padding: 1em 1em;
}
.redrt {
    background: transparent;
    color: #ffff;
    font-size: 13px;
    padding: 0px;
    text-transform: uppercase;
}

.mobile_drop .btn:hover,
.mobile_drop .btn:focus {
    background: transparent;
    color: #ffff;
    font-size: 16px;
    padding: 0px;
}

.mobile_drop .dropdown-menu {
    width: 100%;
}

.navbar-nav-mobile > .current > a {
    color: #c5a47e;
}

.navbar-nav-mobile li a .fa-angle-down {
    position: relative;
    display: inline-block;
    vertical-align: middle;
}

.navbar-nav-mobile > .current > a .fa-angle-down {
    top: -0.2em;
    left: -0.3em;
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transform: rotate(180deg);
}

.navbar-nav-mobile > .active > a,
.navbar-nav-mobile > .active > a:hover {
    background-color: #c5a47e;
    color: #fff;
    -webkit-transition: none;
    -o-transition: none;
    transition: none;
}

.navbar-nav-mobile ul {
    display: none;
}

.navbar-nav-mobile li a:hover,
.navbar-nav-mobile li .active > a {
    color: #c5a47e;
}

/* 2.6 Navbar Mobile Affix */

.navbar-mobile.affix {
    position: fixed;
    z-index: 99999;
    background-color: rgba(50, 50, 50, 0.95);
    box-shadow: 0 0 35px rgba(0, 0, 0, 0.1);
    padding: 1.2em 0;
}

.navbar-mobile.affix .brand {
    display: inline-block;
}

.navbar-mobile.affix .navbar-toggle .icon-bar {
    background-color: #c5a47e;
}

.navbar-nav-mobile > .active > .mobile_drop {
    background-color: #c5a47e;
}
/*-------------------------------------------------------------------------------
  3. Main
-------------------------------------------------------------------------------*/

.main {
    position: relative;
    overflow: hidden;
    min-height: 420px;
}

/* 3.1 Slider */

.rev_slider {
    color: #fff;
    min-height: 420px;
}

.rev_slider .btn {
    -webkit-transition: background-color 0.3s ease-out !important;
    transition: background-color 0.3s ease-out !important;
}

.tp-caption {
    padding: 0 20px;
    text-align: right;
}

.arrow-left,
.arrow-right {
    position: absolute;
    z-index: 4;
    bottom: 4vh;
    cursor: pointer;
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

.arrow-left {
    right: 23vmin;
}

.arrow-right {
    right: 33vmin;
}

.arrow-left:after,
.arrow-right:before {
    content: "";
    display: inline-block;
    vertical-align: middle;
    font-family: "Saira";
    font-size: 17px;
    font-weight: 300;
    letter-spacing: 1px;
    text-align: center;
    background-color: transparent;
    line-height: 1;
    letter-spacing: 0.32em;
    text-transform: uppercase;
    color: #fff;
}

.arrow-left:after {
    content: "Prev";
}

.arrow-right:before {
    content: "Next";
    color: #c9b055;
}

.arrow-left:before,
.arrow-right:after {
    content: "";
    display: inline-block;
    vertical-align: middle;
    width: 1.3em;
    height: 1em;
    opacity: 0.25;
    -webkit-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
}

.arrow-left:hover:before,
.arrow-right:hover:after {
    opacity: 1;
}

.arrow-left:before {
    background: url(../img/prev.png) 0 0 no-repeat;
    background-size: 1.3em 1em;
    margin-right: 0.82em;
    font-size: 20px;
    opacity: 5;
}

.arrow-right:after {
    background: url(../img/next.png) 0 0 no-repeat;
    background-size: 1.3em 1em;
    margin-left: 0.72em;
    font-size: 20px;
    opacity: 5;
    transform: rotate(90deg);
}

.slide-subtitle {
    font-size: 18px;
    line-height: 1.7;
}

/* ------------------------------------------------------------------------------- */
/*  4. About
/* ------------------------------------------------------------------------------- */

.about .fade-title-left {
    top: 1em;
    left: 184px;
}

.col-about-title {
    /* margin-top: 0;
    margin-bottom: 1.1em; */
}

.abovertical-panel {
    z-index: 0;
    height: 100%;
    background: #edebeb;
}

.abovertical-panel {
    position: absolute;
    width: 86px;
    right: 0;
    top: 0;
    text-align: center;
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

.col-about-info p:last-child {
    margin-bottom: 0;
}

.col-about-img {
    position: relative;
}

.col-about-img img {
    display: block;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.2);
}
.abouttitle {
    font-family: "Saira";
    font-size: 32px;
    font-weight: 400;
    line-height: 38px;
    letter-spacing: 1px;
    text-align: left;
}
.aboutbg {
    background: rgba(228, 185, 94, 1);

    /*background: rgba(241, 227, 164, 1);*/
    padding: 33px 54px 50px 120px;
}

.about-flex {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.about-flex .div3 img {
    width: 78%;
}

.div1 {
    width: 40%;
}

.div2 {
    width: 20%;
}
.div3 {
    width: 36%;
}
.div3 img {
    width: 78%;
}
.div3 p {
    font-family: "Saira";
    font-size: 14px;
    font-weight: 400;
    letter-spacing: -0.01em;
    text-align: justify;
    width: 78%;
    padding: 10px;
}
.service-item h4:hover {
    color: #ccb358;
}
.active-btn1 {
    color: #ccb358;
}
.service-item h4 {
    cursor: pointer;
}
.col-aboutbg {
    background: rgba(241, 227, 164, 1);
}
.abouttitle2 {
    font-family: "Saira";
    font-size: 34px;
    font-weight: 600;
    letter-spacing: 1px;
    text-align: left;
}
.aboutpara {
    font-family: "Saira";
    font-size: 14px;
    font-weight: 400;
    line-height: 24px;
    letter-spacing: -0.01em;
    text-align: justify;
}
.newabout {
    font-family: "Saira";
    font-size: 46px;
    font-weight: 450;
    line-height: 19.5px;
    letter-spacing: 3px;
    text-align: center;
}
.newabout2 {
    font-family: "Saira";
    font-size: 46px;
    font-weight: 500;
    line-height: 19.5px;
    letter-spacing: 6px;
    text-align: center;
}
.spec1 {
    font-family: "Saira";
    font-size: 31px;
    font-weight: 400;
    line-height: 33px;
    letter-spacing: 1px;
    text-align: left;
    color: rgba(74, 71, 71, 1);
}
.spec2 {
    font-family: "Saira";
    font-size: 31px;
    font-weight: 600;
    line-height: 33px;
    letter-spacing: 1px;
    text-align: left;
    color: rgba(74, 71, 71, 1);
}

.page-lines1 {
    position: absolute;
    z-index: -1;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

.page-lines1 .col-line {
    padding: 0;
}

.page-lines1 .line1 {
    position: absolute;
    left: 0;
    width: 1px;
    height: 1400px;
    background-color: #1f1d1c;
    opacity: 5%;
}
.page-lines1 .line2 {
    position: absolute;
    left: 41%;
    width: 1px;
    height: 1400px;
    background-color: #1f1d1c;
    opacity: 5%;
}
.page-lines1 .line3 {
    position: absolute;
    right: 36%;
    width: 1px;
    height: 1400px;
    background-color: #1f1d1c;
    opacity: 5%;
}

.page-lines1 .line4 {
    position: absolute;
    right: 8%;
    width: 1px;
    height: 1400px;
    background-color: #1f1d1c;
    opacity: 5%;
}
/* ------------------------------------------------------------------------------- */
/*  5. Projects
/* ------------------------------------------------------------------------------- */

.project {
    padding: 0;
    overflow: hidden;
}

.project figure {
    position: relative;
}

.project figure img {
    display: block;
    width: 100%;
    -webkit-transition: all 8s linear;
    -o-transition: all 8s linear;
    transition: all 8s linear;
}

.project figure:after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: #111;
    opacity: 0.7;
    -webkit-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
}
.projectsec {
    /*background: #f1e3a4;*/
    background: rgba(255, 231, 179, 1);

    position: relative;
    padding-bottom: 30px;
}
.ourpro {
    /*background: #c8af53;*/
    background: rgba(228, 185, 94, 1);

}
.ourpro h3 {
    font-family: "Saira";
    font-size: 40px;
    padding: 15px 0px;
    font-weight: 500;
    margin-top: 30px;
    letter-spacing: 6px;
    text-align: center;
}
.prospanin {
    color: #ffffff;
}
.project.project-light figure:after {
    opacity: 0.4;
}
.overviewstart {
    padding-left: 100px;
}
.sideservice {
    font-family: "Saira";
    font-size: 124px;
    font-weight: 700;
    line-height: 19.5px;
    letter-spacing: 1px;
    text-align: center;
    top: 100px;
    color: #f8f8f8;
    position: absolute;
    right: 0px;
}
.project figcaption {
    position: absolute;
    z-index: 1;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    margin: 3.2em 3.6em;
}

.project-title {
    position: relative;
    top: 0;
    left: 0;
    margin: 0;
    font-family: "Saira";
    font-size: 0.99em;
    line-height: 1.45;
    font-weight: 500;
    letter-spacing: 0.07em;
    text-align: left;
    color: #fff;
    text-transform: capitalize;
    -webkit-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
}

.project-category {
    position: absolute;
    left: 0;
    bottom: 0;
    margin: 0 0 -0.8em;
    font-family: "Saira";
    font-weight: 400;
    font-size: 14px;
    color: #fff;
    letter-spacing: 1px;
    -webkit-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
    transform: rotate(-90deg);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    -webkit-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
}

.project-zoom {
    position: absolute;
    left: 63%;
    top: 50%;
    /* width: 9em;
  height: 9em; */
    width: 100px;
    height: 100px;
    margin: -4.5em;
    border-radius: 50%;
    background-color: rgba(199, 174, 82, 1);
    overflow: hidden;
    opacity: 0;
    -webkit-transform: scale(0.5);
    -ms-transform: scale(0.5);
    -o-transform: scale(0.5);
    transform: scale(0.5);
    -webkit-transition: all 0.7s;
    -o-transition: all 0.7s;
    transition: all 0.7s;
}

.project-zoom:after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 2.625em;
    height: 2.625em;
    background: url(../img/zoom_in.png) 0 0 no-repeat;
    background-size: cover;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.project figure:hover:after {
    opacity: 0;
}

.project figure:hover img {
    -webkit-transform: scale(1.4);
    transform: scale(1.4);
}

.project figure:hover .project-title {
    top: 30px;
    opacity: 0;
}

.project figure:hover .project-category {
    opacity: 0;
    letter-spacing: 2em;
}

.project figure:hover .project-zoom {
    opacity: 1;
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
}

/* 5.1 Project Carousel */

.owl-prev,
.owl-next {
    position: absolute;
    top: 50%;
    font-weight: 400;
    font-family: "Saira", sans-serif;
    font-size: 1em;
    letter-spacing: 0.32em;
    text-transform: uppercase;
    color: #fff;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
    opacity: 0.7;
}

.owl-prev:hover,
.owl-next:hover {
    opacity: 1;
}

.owl-prev {
    left: 0.8em;
    padding-left: 35px;
    /* background: url(../img/img-icon/prev.png) left 50% no-repeat; */
    background: url(../img/prev.png) left 50% no-repeat;

    background-size: 1.3em 1em;
}

.owl-next {
    left: auto;
    right: 0.8em;
    padding-right: 35px;
    background: url(../img/nextarrow.png) right 50% no-repeat;
    background-size: 1.3em 1em;
}

/* 5.2 Magnific popup */

.mfp-figure {
    box-shadow: none;
}

.mfp-iframe-scaler {
    overflow: visible;
}

.mfp-image-holder .mfp-close,
.mfp-iframe-holder .mfp-close {
    padding: 0;
    margin-top: -10px;
    font-family: inherit;
    font-size: 40px;
    font-weight: 300;
    line-height: 0;
}

img.mfp-img {
    min-height: 460px;
}

.mfp-title {
    padding-right: 40px;
    /* font-size: 1.2em; */
    font-size: 15px;
    line-height: 1.2;
    margin-top: 3px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    padding-bottom: 10px;
}

.mfp-counter {
    top: 5px;
}

.mfp-bg {
    background-color: #141414;
}

.mfp-arrow-left:before,
.mfp-arrow-left .mfp-b {
    display: none;
}

.mfp-arrow-right:before,
.mfp-arrow-right .mfp-b {
    display: none;
}

.mfp-wrap .mfp-content {
    -webkit-perspective: 1300px;
    perspective: 1300px;
}

.mfp-wrap .mfp-figure,
.mfp-wrap .mfp-iframe-scaler {
    opacity: 0;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -webkit-transform: scale(0) rotateY(60deg);
    -o-transform: scale(0) rotateY(60deg);
    transform: scale(0) rotateY(60deg);
}

.mfp-bg {
    opacity: 0;
    -webkit-transition: 0.5s;
    -o-transition: 0.5s;
    transition: 0.5s;
}

.mfp-wrap .mfp-figure,
.mfp-wrap .mfp-iframe-scaler {
    opacity: 0;
    -webkit-transition: 0.3s ease-in-out;
    -o-transition: 0.3s ease-in-out;
    transition: 0.3s ease-in-out;
    -webkit-transform: rotateY(-60deg);
    -ms-transform: rotateY(-60deg);
    -o-transform: rotateY(-60deg);
    transform: rotateY(-60deg);
}

.mfp-bg {
    opacity: 0;
    -webkit-transition: 0.5s;
    -o-transition: 0.5s;
    transition: 0.5s;
}

.mfp-wrap.mfp-ready .mfp-figure,
.mfp-wrap.mfp-ready .mfp-iframe-scaler {
    opacity: 1;
    -webkit-transform: rotateX(0);
    -ms-transform: rotateX(0);
    -o-transform: rotateX(0);
    transform: rotateX(0);
}

.mfp-ready.mfp-bg {
    opacity: 0.8;
}

.mfp-wrap.mfp-removing .mfp-figure,
.mfp-wrap.mfp-removing .mfp-iframe-scaler {
    opacity: 0;
    -webkit-transform: rotateX(-60deg);
    -ms-transform: rotateX(-60deg);
    -o-transform: rotateX(-60deg);
    transform: rotateX(-60deg);
}

.mfp-zoom-out-cur,
.mfp-zoom-out-cur .mfp-image-holder .mfp-close {
    cursor: url(../img/zoom-out.html), zoom-out;
}

.mfp-removing.mfp-bg {
    opacity: 0;
}

/* ------------------------------------------------------------------------------- */
/*  6. Services
/* ------------------------------------------------------------------------------- */

.row-services {
    margin-left: -4.1em;
    margin-right: -4.1em;
}

.col-service {
    padding: 0 4.1em;
}

.service-item h4 {
    font-family: "Saira";
    font-size: 20px;
    font-weight: 400;
    line-height: 33px;
    letter-spacing: 4px;
    text-align: left;
}
.service-item {
    margin-top: 23px;
}
.firstslider {
    margin-bottom: 20px;
}
/*
.serviceimg
{
    z-index: 8;
    position: absolute;
} */
/* ------------------------------------------------------------------------------- */
/*  7. Experience
/* ------------------------------------------------------------------------------- */

.experience {
    text-align: center;
}

.text-parallax {
    background: no-repeat 0 0;
    display: inline-block;
}

.text-parallax-content {
    font-family: "Oswald", sans-serif;
    font-weight: 700;
    font-size: 21.8em;
    line-height: 1;
    overflow: hidden;
    margin-bottom: 0;
    background: #272727;
    color: #fff;
    mix-blend-mode: darken;
    -ms-mix-blend-mode: darken;
}

.experience-info {
    position: relative;
    top: -0.75em;
    font-family: "Oswald", sans-serif;
    font-size: 1.5625em;
    line-height: 1.45;
    letter-spacing: 0.06em;
    display: inline-block;
    text-align: left;
    margin: 0 0 0 0.5em;
}

/* ------------------------------------------------------------------------------- */
/*  8. Clients
/* ------------------------------------------------------------------------------- */

.clients {
    text-align: center;
}

.clients-list {
    margin: 0px;
}

.clients-list .client {
    display: inline-block;
    /* vertical-align: middle; */
    /* padding: 3.8em 1.95em 0; */
    padding: 0px;
    margin: 0;
}

.clients-list .client a:hover img {
    opacity: 1;
}
.certificate1 {
    margin-top: 50px;
}
/* ------------------------------------------------------------------------------- */
/*  9. Objects
/* ------------------------------------------------------------------------------- */

.objects {
    position: relative;
}

.object-label {
    position: absolute;
    width: 1em;
    height: 1em;
    background-color: #e5bf93;
    box-shadow: 0 0 70px 8px rgba(197, 164, 126, 0.75);
    border-radius: 50%;
    cursor: pointer;
    -webkit-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
}

.object-label:hover {
    box-shadow: none;
}

.popover.top {
    margin-top: -20px;
}

.object-info {
    position: absolute;
    display: none;
    z-index: 1;
    left: 50%;
    bottom: 40px;
    width: 12.4em;
    margin-left: -6.2em;
    padding: 1.1em 1.3em 3em;
    border: 0;
    background-color: rgba(0, 0, 0, 0.3);
    border-radius: 4px;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.object-info.in {
    display: block;
}

.object-info:before {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -16px;
    width: 0;
    height: 0;
    border: 16px solid transparent;
    border-top: 14px solid rgba(0, 0, 0, 0.3);
}

.object-title {
    font-size: 1em;
    font-family: "montserratsemibold";
    font-weight: normal;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: #c5a47e;
    padding: 0 0 1em;
    border-bottom: 1px solid rgba(249, 249, 249, 0.2);
    margin: 0 0 0.5em;
}

.object-content {
    font-family: "montserratlight", sans-serif;
    font-size: 0.75em;
    line-height: 2.6;
    color: #fff;
    padding: 0;
}

.popover.top > .arrow {
    border-top-color: transparent;
}

.popover.top > .arrow:after {
    border-top-color: rgba(0, 0, 0, 0.6);
}

/* ------------------------------------------------------------------------------- */
/*  10. Contacts
/* ------------------------------------------------------------------------------- */

.contacts .fade-title-right {
    left: 90%;
}

.row-field {
    margin-left: -5px;
    margin-right: -5px;
}
.cnumber {
    font-family: "Saira";
    font-size: 20px;
    font-weight: 400;
    line-height: 18.5px;
    text-align: center;
    color: #1f1d1c;
}
.getin {
    font-family: "Saira";
    font-size: 23px;
    font-weight: 500;
    line-height: 36.2px;
    text-align: center;
    color: #897839;
}
.col-field {
    padding: 0 5px;
}
.placehole::placeholder {
    color: #6d6363;
}
.col-message {
    display: none;
    margin-top: 20px;
}

.col-address {
    font-size: 1.125em;
    line-height: 2.1;
    margin-top: 2em;
}

.form-submit {
    margin-top: 1.2em;
}

.success-message {
    display: none;
}

.error-message {
    display: none;
}

.success-message .fa {
    margin-right: 7px;
    font-size: 1.5em;
}
/*#contacts {*/
/*    margin-bottom: 60px;*/
/*}*/

textarea.form-control {
    border: 1px solid #f3f3f3;
}
.form-group {
    position: relative;
}
.just-validate-error-label {
    position: absolute;
    font-size: 12px;
}
.form-group {
    margin-bottom: 20px;
}

/*contact page*/
.cpage h4 {
    font-family: "Saira";
    font-size: 32px;
    font-weight: 700;
    letter-spacing: 5px;
    color: #000000;
    margin-left: 70px;
}

.bmessage h5 {
    font-family: "Saira";
    font-size: 23px;
    font-weight: 800;
    letter-spacing: 2px;
    text-align: left;
    color: #454545;
    margin-bottom: 0px;
}
.firstconside {
    border-right: 1px solid #565656;
}
.bmessage p {
    font-family: "Saira";
    font-size: 16.31px;
    font-weight: 400;
    line-height: 33.23px;
    letter-spacing: 2px;
    text-align: left;
    color: #484545;
}

.cformgroup {
    margin-bottom: 30px;
}
input:focus,
input.cformcontrol:focus,
textarea:focus {
    outline: none !important;
    outline-width: 0 !important;
}
.cformcontrol {
    font-family: "Saira";
    font-size: 16px;
    font-weight: 400;
    border: none;
    color: #484545;
    width: 100%;
    letter-spacing: 2px;
    border-bottom: 1px solid #000000;
    -webkit-box-shadow: none;
    box-shadow: none;
    -webkit-appearance: none;
    -webkit-transition: all 0.15s;
    -o-transition: all 0.15s;
    transition: all 0.15s;
}

.contactsub {
    font-family: "Saira";
    position: relative;
    display: inline-block;
    border: 0.2em solid #c5a47e;
    padding: 5px 12px;
    font-size: 0.875em;
    color: #453c3c;
    letter-spacing: 0.15em;
    text-transform: capitalize;
    text-decoration: none;
    background-color: rgba(217, 173, 81, 1);

    /*background-color: #dbc470;*/
    border: 0;
    -webkit-transition: all 0.3s ease-out !important;
    transition: all 0.3s ease-out !important;
}

.safediv h5 {
    font-family: "Saira";
    font-size: 23px;
    font-weight: 800;
    letter-spacing: 2.769399404525757px;
    color: #454545;
}

.safediv p {
    font-family: "Saira";
    font-size: 17px;
    font-weight: 400;
    letter-spacing: 1.5px;
    color: #484545;
    margin-bottom: 0px;
}

.ctel {
    background: rgba(217, 173, 81, 1);

    /*background-color: #dbc471;*/
    border-radius: 100%;
    transition: 1s all !important;
    width: 40px;
    margin-bottom: 30px;
    margin-top: 20px;
}
.ctel img {
    padding: 10px;
}
.cloc img {
    padding: 10px;
}
.cloc {
    /*background-color: #dbc471;*/
    background: rgba(217, 173, 81, 1);

    border-radius: 100%;
    transition: 1s all !important;
    width: 40px;
    margin-top: 20px;
    margin-bottom: 30px;
}
.cmobile {
    transition: 2s all;
    padding: 40px 130px 4px 40px;
}

.cmobile:hover {
    background: #fffbee;
}
.cloaction:hover {
    background: #fffbee;
}
.cloaction {
    transition: 2s all;
    padding: 40px 130px 4px 40px;
}
.contactsub {
    font-family: "Saira";
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 2.769399404525757px;
    text-align: left;
}
.contactdiv {
    margin-top: 60px;
    margin-bottom: 50px;
}
#cmap {
    margin-bottom: 60px;
}
.bmessage {
    padding: 0px 60px;
    margin-bottom: 100px;
}
.placee {
    padding: 0px;
}
/**/
/* ------------------------------------------------------------------------------- */
/*  12. Responsive styles
/* ------------------------------------------------------------------------------- */

/* 12.1 Min width 768px */

@media (min-width: 768px) {
    html {
        font-size: 85%;
    }

    /* Slider */

    .prosideinstatic::before
    /* About */

    .col-about-spec {
        padding: 0 4.4em;
    }

    /* Project Carousel */

    .owl-prev {
        left: 3.6em;
    }

    .owl-next {
        right: 3.6em;
    }
}

/* 12.2 Min width 992px */

@media (min-width: 992px) {
    html {
        font-size: 92%;
    }

    /* Content styles */

    .text-center-md {
        text-align: center;
    }

    .text-right-md {
        text-align: right;
    }

    .text-left-md {
        text-align: left;
    }

    /* Navbar Mobile */

    .navbar-mobile {
        position: absolute;
        left: -50000px;
        top: -50000px;
    }

    /* About */

    .col-about-img {
        padding-left: 0;
        left: -5px;
    }

    .col-about-img img {
        max-width: calc(100% + 5px);
    }

    /* Contacts */

    .row-field {
        margin-left: -15px;
    }
}

/* 12.3 Min width 1200px */

@media (min-width: 1200px) {
    html {
        font-size: 100%;
    }
}

/* 12.4 Max height 480px  */

@media (max-height: 480px) {
    /* Slider */

    .arrow-left {
        top: 43.5vmin;
        bottom: auto;
    }

    .arrow-right {
        left: 28vmin;
        right: auto;
        margin-left: 5em;
        top: 43.5vmin;
        bottom: auto;
    }
}

body {
    font-family: sans-serif;
}
.nav-logo {
    height: 74px;
    width: 117px;
    left: 100px;
}
.btn-login {
    font-weight: 700;
    font-size: 20px;
    line-height: 19px;
    color: #ffffff;
    background: #231f20;
}
.intro .btn-login {
    font-weight: 700;
    font-size: 13px;
    line-height: 19px;
    color: #000;
    border: 1px dashed #000;
    box-shadow: none;
}
.intro {
    background-color: #fff;
    box-shadow: 0 1px 10px rgba(0, 0, 0, 0.4);
}
.intro li a {
    color: #000 !important;
}
.login-nav {
    text-align: center;
    border: 1px dashed #ffffff;
    position: relative;
    padding: 5px !important;
    border-radius: 0 !important;
    font-size: 12px;
    font-weight: 700;
    font-family: "Saira";
}
.nav-logo img {
    width: 70%;
    height: auto;
}
nav li.dropdown:hover ul.dropdown-menu {
    display: block;
}

.navbar-expand-lg .navbar-nav .dropdown-menu {
    position: absolute;
    top: 48px;
    left: 20%;
    padding: 0px;
}

.dropdown-item.active {
    color: #fff !important;
    text-decoration: none;
    background-color: rgba(222, 189, 81, 1);
}
.dropdown-item:focus,
.dropdown-item:hover {
    background-color: rgba(222, 189, 81, 1);
    color: #fff;
}
.nav-logo {
    height: 74px;
    width: 117px;
    left: 100px;
}
.navbar-section {
    position: fixed;
    width: 100%;
    z-index: 500;

    background: transparent;
}
.mbllogo {
    display: none;
}
.navbar-section {
    position: fixed;
    width: 100%;
    z-index: 500;
    background: transparent;
}

.navbar-section.home {
    background: transparent;
}

li.nav-item.navbar-lists.active .nav-link {
    color: rgba(222, 189, 81, 1) !important;
}

li.nav-item.navbar-lists:hover .nav-link {
    color: rgba(222, 189, 81, 1) !important;
}
.nav-link {
    font-weight: 700;
    color: #fff !important;
}

.home-banners {
    height: 650px !important;
    position: relative;
    overflow: hidden;
    animation: zoom 25s ease-in-out infinite;
}
.home-banners.bg1 {
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.homebanbrand {
    position: absolute;
    z-index: -1;
    top: 2.59em;
    left: 0.62em;
    font-family: "Saira";
    font-weight: 700;
    font-size: 3.75em;
    line-height: 1;
    opacity: 5%;
    color: #ffffff;
}

/* --------------------footer------------------------------------- */

.section-footer {
    padding-top: 10px;
}
.footer-heading1 {
    line-height: 1.5;
    font-family: "Saira";
    color: rgba(31, 29, 28, 1);

    font-size: 17px;
    font-weight: 500;
}
.foottop {
    margin-top: 20px;
    margin-bottom: 20px;
    border: 0;
    border-top: 0.1px solid #1f1d1c;
    opacity: 10%;
}
.linktop {
    margin-top: 3%;
}
.footer-links {
    color: rgba(31, 29, 28, 1);
    font-family: "Saira";
    font-size: 15px;
    font-weight: 400;
    line-height: 23.61px;
}

.footer-link-lists {
    display: contents;
}
.dkpara {
    font-family: "Saira";
    font-size: 15px;
    font-weight: 400;
    line-height: 18.5px;
    text-align: center;
    width: 85%;
}
.footer-icon {
    margin-left: 30px;
}
.address {
    color: rgba(31, 29, 28, 1);
    font-family: "Saira";
    font-size: 15px;
    font-weight: 400;
    line-height: 23.5px;
    margin-bottom: 13px;
}

.footer-mail {
    color: rgba(31, 29, 28, 1);
    font-family: "Saira";
    font-size: 15px;
    font-weight: 400;
    line-height: 23.5px;
}

.footing-icons {
    padding-right: 8px;
}

.footer-number {
    color: rgba(31, 29, 28, 1);
    font-family: "Saira";
    font-size: 15px;
    font-weight: 400;
    line-height: 23.5px;
}
.bench {
    font-family: "Sarpanch";
    font-size: 37px;
    font-weight: 400;
    text-align: center;
    color: #1f1d1c;
    margin: 0px;
}
.cbtn {
    text-align: center;
    padding: 31px 0px 31px 0px;
}

.button-c {
    display: inline-block;
    padding: 10px 50px;
    background: rgba(35, 31, 32, 1);
    text-decoration: none;
    border: none;
    cursor: pointer;
    transition: background-color 0.3s;
    text-align: center;
    color: white;
    font-family: "Saira";
    font-size: 19px;
    font-weight: 500;
}
.button-c:hover {
    color: white;
}
.benchtop {
    padding-top: 3%;
}

.footer-copy a:hover {
    color: white;
}
.bottom-footer {
    padding-top: 70px;
}

.footer-copy {
    padding-bottom: 30px;
    color: rgba(31, 29, 28, 1);
    text-align: center;
    font-family: "Saira";
    font-size: 15px;
    font-weight: 400;
}

.footer-rights {
    color: rgba(31, 29, 28, 1);
    font-family: "Saira";
    font-size: 18px;
    font-weight: 500;
}

.footer-links,
.footer-mail,
.footer-number {
    transition: all 0.4s;
}
.footer-link-lists li {
    margin-bottom: 5px;
}

.footer-links:hover {
    margin-left: 7px;
    color: white;
}

.footer-mail:hover {
    margin-left: 5px;
    color: white;
}

.footer-number:hover {
    margin-left: 5px;
    color: white;
}
.bussiness-footer {
    /*background: rgba(219, 196, 112, 1);*/
    background: linear-gradient(90deg, #BE9336 0%, #FED57B 54%, #C99D40 100%);

}
.header-top .header-profile {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 2rem;
}
.header-top {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-end;
}
.phone a {
    font-family: "Saira";
    font-size: 16px;
    font-weight: 600;
    line-height: 25px;
    color: white;
    text-align: center;
}
.header-profile .emaill a {
    color: white;
}
.emaill {
    font-family: "Poppins";
    font-size: 16px;
    font-weight: 400;
    line-height: 25px;
    color: white;
    text-align: center;
}

.header-profile .phone a {
    color: #D8AD51;
}
.tophr {
    margin-top: -16px;
    margin-bottom: 20px;
}

/* counter */
.counter {
    position: relative;
}
.shade1 {
    position: absolute;
    left: 0;
    height: 100%;
    width: 316px;
    background: linear-gradient(
        90deg,
        rgba(212, 183, 105, 0.5) 0.26%,
        rgba(212, 183, 105, 0.5) 15.69%,
        rgba(0, 0, 0, 0) 48.54%
    );
}
.shade2 {
    position: absolute;
    right: 0;
    height: 100%;
    width: 316px;
    background: linear-gradient(
        275deg,
        rgba(212, 183, 105, 0.5) 0.26%,
        rgba(212, 183, 105, 0.5) 15.69%,
        rgba(0, 0, 0, 0) 48.54%
    );
}
.counthead {
    font-family: "Saira";
    font-size: 22.76px;
    font-weight: 400;
    line-height: 25px;
    letter-spacing: 4.551723957061768px;
    margin: 20px 0px 40px 0px;
    color: rgba(255, 255, 255, 1);
    text-align: center;
}
.experience-new {
    font-family: "Exo 2", sans-serif;
    font-size: 88.76px;
    font-weight: 800;
    line-height: 25px;
    letter-spacing: 4.551723957061768px;
    text-align: center;
    color: rgba(255, 255, 255, 1);
}
.counting {
    padding-top: 40px;
    padding-bottom: 60px;
}
.countimg {
    text-align: center;
}
/*  */
.shinetechimg {
    text-align: center;
    height: 300px;
}
.shinetechhead {
    color: #D8AD51;
    font-family: "Times New Roman";
    font-size: 25px;
    font-weight: 400;
    line-height: 33px;
    text-transform: uppercase;
    letter-spacing: 1px;
    text-align: center;
}
.shinetechpara {
    font-family: "Saira";
    font-size: 13px;
    font-weight: 400;
    line-height: 25px;
    letter-spacing: -0.01em;
    text-align: center;
}
.home-btn3 {
    animation: btn 2s ease-in-out infinite;
    position: relative;
    z-index: 1;
    padding: 8px 30px;
    color: rgba(53, 53, 53, 1);
    border-radius: 0px;
    font-family: "Saira";
    font-size: 15.62px;
    font-weight: 500;
    background: rgba(208, 182, 85, 1);
    text-transform: capitalize;
    line-height: 25.13px;
    letter-spacing: -0.01em;
}
.lookbtn {
    text-align: center;
}
.shinetechinner {
    margin: 80px 0px;
}

/* projetcsection */
.prosideinstatic img {
    width: 300px;
}
.prosideinstatic::before {
    content: "";
    position: absolute;
    top: 0;
    /* left: 94px; */
    width: 300px;
    height: 100%;
    background: linear-gradient(360deg, #ffffff 0%, rgba(255, 255, 255, 0) 50%);
    /*background: linear-gradient(*/
    /*    323deg,*/
    /*    #ffffff 0%,*/
    /*    rgba(255, 255, 255, 0) 100%*/
    /*);*/
}
.prosideinstatic {
    text-align: center;
}
.animated.slideInDown {
    animation: slideInDown 0.5s ease-in-out;
}

@keyframes slideInDown {
    from {
        transform: translateY(-100%);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}
.footer-icon a {
    color: rgba(35, 31, 32, 1);
    font-size: 25px;
    text-decoration: none;
}

.fa,
.fa-brands,
.fa-classic,
.fa-regular,
.fa-sharp-solid,
.fa-solid,
.fab,
.far,
.fas {
    line-height: 0px;
}

.social-icon1 {
    border-radius: 138px;
    text-align: center;
    width: 42px;
    height: 42px;
    display: inline-block;
    transition: transform 0.5s, background-color 0.5s, color 0.5s,
        border-color 0.5s;
}

.facebook:hover {
    transform: scale(1.2);
    border-radius: 100%;
    border-color: #3b5998;
    background-color: #3b5998;
    color: #ffffff;
}

.twitter:hover {
    transform: scale(1.2);
    border-radius: 100%;
     border-color: #E4405F; /* Instagram's brand color */
    background-color: #E4405F; /* Instagram's brand color */
    /*border-color: #55acee;*/
    /*background-color: #55acee;*/
    color: #ffffff;
}

.linkedin:hover {
    transform: scale(1.2);
    border-radius: 100%;
    background-color: #0976b4;
    color: #ffffff;
    border-color: #0976b4;
}

.pinterest:hover {
    transform: scale(1.2);
    border-radius: 100%;
    background-color: #cb2027;
    color: #ffffff;
    border-color: #cb2027;
}

/* Affix styles */
.navbar-desctop.affix {
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1030;
}

/* Other styles as needed */

/* .defaultimg::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(
        180deg,
        rgba(0, 0, 0, 0.8) 24.55%,
        rgba(0, 0, 0, 0) 100%
    );
} */

/* .tp-parallax-wrap{
    margin-top:-30px !important;
    line-height: 20px !important;
} */

.home-btn4 {
    animation: btn 2s ease-in-out infinite;
    position: relative;
    z-index: 1;
    color: rgba(53, 53, 53, 1);
    border-radius: 0px;
    font-family: "Saira";
    font-size: 14px;
    font-weight: 500;
    padding: 5px 10px;
    text-decoration: none !important;
    background: rgba(208, 182, 85, 1);
    text-transform: capitalize;
    line-height: 39.13px;
    letter-spacing: -0.01em;
}
.home-btn4:hover {
    background: #8d8d8d;
    color: rgba(53, 53, 53, 1);
}
.newbanhead {
    font-family: "Saira";
    font-weight: 700;
    line-height: 19.5px;
    letter-spacing: 6px;
    text-align: end !important;
    text-transform: none !important;
    white-space: nowrap !important;
    font-size: 28px !important;
    /* width: 80%; */
}

.vertri {
    /*background: #c8af53;*/
    background: rgba(228, 185, 94, 1);

    position: absolute;
    left: 0;
    top: 0px;
    bottom: 0;
    text-align: center;
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
    width: 57.55px;
    height: 126.55px;
}
.headingpo {
    position: relative;
    margin-bottom: 60px;
}
.sideprojects {
    font-family: "Saira";
    font-size: 65px;
    font-weight: 700;
    line-height: 19.5px;
    letter-spacing: 1px;
    text-align: center;
    top: 5.55em;
    color: #423935;
    opacity: 8%;
    position: absolute;
    right: -88px;
    transform: rotate(-90deg);
}
.prosidein {
    position: relative;
}

.prosidein img {
    width: 100%;
    height: 200px;
    display: block;
}

.prosidein::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(360deg, #ffffff 0%, rgba(255, 255, 255, 0) 50%);
    pointer-events: none;
}
.item {
    margin: 0px 20px;
}
.prosidepara p {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    text-align: center;
    color: #1a1a1a;
    font-family: "Saira";
    font-size: 17.55px;
    font-weight: 500;
    letter-spacing: 0.8240669965744019px;
    text-align: center;
    margin-bottom: 4px;
}
.projectsecound {
    margin-top: 30px;
}
.side1 {
    margin-top: 33px;
}
.secoundhalf {
    overflow: hidden;
}
.project-slider .slick-prev {
    display: none !important;
}
.project-slider .slick-next {
    display: none !important;
}
.projectsecound .slick-prev {
    display: none !important;
}
.projectsecound .slick-next {
    display: none !important;
}
.secoundrowclient .clients-list .client img {
    opacity: 5;
}
.firstrowclient .clients-list .client img {
    opacity: 5;
}
.stright {
    position: absolute;
    top: 45px;
}
.geeks {
    transition: 1s all !important;
    border-radius: 20px;
    /*transition: 0.5s all ease-in-out;*/
}

.geeks img {
    width: 100%;
    transition: 0.5s all ease-in-out;
    border-radius: 20px;
}

.geeks:hover {
    transform: scale(0.8);
    /*background: #f1e3a4;*/
    /*border-radius: 0%;*/
    box-shadow: rgba(0, 0, 0, 0.25) 0px 19px 54px,
        rgb(255 155 0 / 26%) 0px 14px 26px;
    border-radius: 20px;
}

.shinetech {
    position: relative;
}

.graph.line12.ani {
    animation: expandHeight1 30s infinite;
}
.graph.line13.ani {
    animation: expandHeight2 30s infinite;
}
.graph.line14.ani {
    animation: expandHeight3 30s infinite;
}
.graph.line15.ani {
    animation: expandHeight5 30s infinite;
}

.graph.line12 {
    border-left: 0.1px solid #1f1d1c;
    opacity: 0.1;
    height: 0%;
    top: 0;
    left: 9%;
}

.graph.line13 {
    border-left: 0.1px solid #1f1d1c;
    opacity: 0.1;
    height: 0%;
    top: 0;
    left: 43%;
}

.graph.line14 {
    border-left: 0.1px solid #1f1d1c;
    opacity: 0.1;
    height: 0%;
    top: 0;
    right: 44%;
}

.graph.line15 {
    border-left: 0.1px solid #1f1d1c;
    opacity: 0.1;
    height: 0%;
    top: 0;
    right: 9%;
}

.graph {
    position: absolute;
    z-index: 5;
}
@keyframes expandHeight {
    0% {
        height: 0%;
    }

    100% {
        height: 90%;
    }
}

@keyframes expandHeight1 {
    0% {
        height: 0%;
    }

    100% {
        height: 90%;
    }
}
@keyframes expandHeight2 {
    0% {
        height: 0%;
    }

    100% {
        height: 90%;
    }
}
@keyframes expandHeight3 {
    0% {
        height: 0%;
    }

    100% {
        height: 90%;
    }
}
@keyframes expandHeight5 {
    0% {
        height: 0%;
    }

    100% {
        height: 90%;
    }
}

.owl-carousel .owl-stage {
    direction: rtl;
}
.owl-carousel .owl-item {
    direction: ltr;
}
.img-fluid {
    max-width: 100%;
    height: auto;
}
.enquiryy {
    margin-left: 6rem !important;
}
.navbar-desctop-menu li .btn-login {
    transition: 1s all !important;
}
.navbar-desctop-menu li .btn-login:hover {
    background: #fff;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 10px 36px 0px,
        rgba(0, 0, 0, 0.06) 0px 0px 0px 1px;
    color: #000;
    border: 1px dashed black;
}

/* ------------------------------------------------------------------------------------ */
/* service page start*/
/* ------------------------------------------------------------------------------------ */

.text-container h4 {
    font-family: "Saira";
    color: #ffffff;
    font-size: 21px;
    line-height: 30px;
}

.home-showcase {
    padding: 0 var(--columnExt) 0;
    position: relative;
}

.home-showcase .home-showcaseSlider {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
}

.home-showcase .home-showcaseSlider .swiper-wrapper .swiper-slide {
    position: relative;
    height: 100vh;
    overflow: hidden;
}

.home-showcase
    .home-showcaseSlider
    .swiper-wrapper
    .swiper-slide
    .swiper-image {
    width: 100%;
    height: 100%;
    background-position: center !important;
    background-repeat: no-repeat !important;
    background-size: cover !important;
    display: flex;
    display: flex;
    align-items: flex-end;
}

.home-showcase
    .home-showcaseSlider
    .swiper-wrapper
    .swiper-slide
    .swiper-image
    .text-container {
    /* max-width: 100%; */
    margin: 5rem 0 0 0;
}

.home-showcase
    .home-showcaseSlider
    .swiper-wrapper
    .swiper-slide
    .swiper-image
    .text-container
    .bigTitle {
    transform: translate(-140%, 0);
    transition: transform 1.15s cubic-bezier(0.58, 0, 0.28, 0.99) 0.4s;
    color: #ffffff;

    margin: 0 0 2.5rem;
    text-shadow: #21212121 0px 0px 5px;
}

.home-showcase
    .home-showcaseSlider
    .swiper-wrapper
    .swiper-slide
    .swiper-image
    .text-container
    .container-arrow-button {
    transform: translate(-160%, 0);
    transition: transform 0.6s cubic-bezier(0.58, 0, 0.28, 0.99) 1s;
    width: fit-content;
}

.home-showcase
    .home-showcaseSlider
    .swiper-wrapper
    .swiper-slide
    .swiper-image
    .text-container
    .container-arrow-button
    .arrow-button {
    color: #ffffff;
}

.home-showcase
    .home-showcaseSlider
    .swiper-wrapper
    .swiper-slide
    .swiper-image
    .text-container
    .container-arrow-button
    svg
    path {
    fill: #f8f5f0;
}

.home-showcase
    .home-showcaseSlider
    .swiper-wrapper
    .swiper-slide
    .swiper-image
    .text-container
    .container-arrow-button
    svg
    circle {
    stroke: #f8f5f0;
}

.home-showcase
    .home-showcaseSlider
    .swiper-wrapper
    .swiper-slide
    .swiper-image
    .text-container
    .container-arrow-button:hover
    svg
    circle {
    stroke: #f8f5f0;
}

.home-showcase
    .home-showcaseSlider
    .swiper-wrapper
    .swiper-slide
    .swiper-image
    .filter {
    width: 100%;
    height: 100%;
    background-color: #f8f5f0;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    opacity: 0.5;
    transition: opacity 0.8s ease-in 0.5s;
}

.home-showcase
    .home-showcaseSlider
    .swiper-wrapper
    .swiper-slide-active
    .swiper-image
    .text-container
    .bigTitle,
.home-showcase
    .home-showcaseSlider
    .swiper-wrapper
    .swiper-slide-active
    .swiper-image
    .text-container
    .container-arrow-button {
    transform: translate(0, 0);
}

.home-showcase
    .home-showcaseSlider
    .swiper-wrapper
    .swiper-slide-active
    .swiper-image
    .filter {
    opacity: 0;
}

.home-showcase .home-showcaseSlider .swiper-pagination {
    position: relative;
    bottom: 0;
    left: 0;
    width: fit-content;
    padding: 3.5% 0;
}

.home-showcase .home-showcaseSlider .swiper-pagination-bullet {
    width: 4vw;
    border-radius: 50px;
    height: 2px;
    background-color: #8f9397;
    opacity: 1;
    transition: width 0.8s ease-in-out, 0.4s ease-in-out;
    margin: 0 4px !important;
}

.home-showcase .home-showcaseSlider .swiper-pagination-bullet-active {
    background-color: #f7970e;
    width: 8vw;
}

.home-showcase .home-showcaseSlider .showcaseSlider-nav {
    display: flex;
    flex-direction: row;
    padding: 0 0 7.5% 5%;
    padding-right: 0;
}

.home-showcase .home-showcaseSlider #macaron {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 1;
    margin: 5%;
    width: 30%;
}

.home-showcase .home-showcaseSlider #macaron #text-circle {
    animation: rotate-360 12s linear 0s infinite reverse forwards;
    transform-origin: center;
}

.home-showcase .scrollSliderButton {
    position: absolute;
    left: 50%;
    bottom: 0;
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: center;
    transform: translate(-50%, 0%);
    color: #fff !important;
    text-decoration: none;
    font-size: 3.5vw;
    height: 21vw;
    font-family: "CabinetGrotesk-light", sans-serif;
}

.home-showcase .scrollSliderButton .line {
    height: 15vw;
    width: 1px;
    background: #8c97d0;
    margin-top: 5px;
    animation: scroll-anim-mobile 1.6s cubic-bezier(0.62, 0.01, 0.71, 0.47) 0s
        infinite normal forwards;
}

.slider-img img {
    width: 100%;
}

.text-container h1 {
    margin: 3px;
}

.first1 {
    color: #ffffff;
    font-family: "Saira";
    font-size: 42px;
    line-height: 1;
    font-weight: 700;
    margin: 0;
    word-wrap: break-word;
    text-align: end;
}

.home-showcase
    .home-showcaseSlider
    .swiper-wrapper
    .swiper-slide
    .swiper-image {
    justify-content: end;
}

.home-showcase
    .home-showcaseSlider
    .swiper-wrapper
    .swiper-slide
    .swiper-image {
    padding: 20px 110px;
}

@keyframes slideIn {
    from {
        transform: translate(140%, 0);
    }

    to {
        transform: translate(0, 0);
    }
}

.newbig {
    animation: slideIn 0.5s cubic-bezier(0.58, 0, 0.28, 0.99) 0.1s forwards;
    color: #0062ff;
    margin: 0 0 2.5rem;
    text-shadow: #21212121 0px 0px 5px;
    opacity: 0;
    animation-delay: 0.1s;
}

.newbig.visible {
    opacity: 1;
}

.dropdown-container {
    display: block;
    margin-top: 30px;
}
.dropdown-btn {
    background: none;
    border: none;
}
.fa-chevron-up:before {
    font-size: 12px;
}
.dropdown-btn a {
    padding: 6px 8px 6px 16px;
    text-decoration: none;
    font-family: "Manrope";
    font-size: 22.61px;
    font-weight: 600;
    line-height: 30.88px;

    color: #818181;
    display: block;
    border: none;
    background: none;
    width: 100%;
    text-align: left;
    cursor: pointer;
    outline: none;
}
.overviewbtn {
    font-family: "Manrope";
    font-size: 16.61px;
    font-weight: 600;
    line-height: 30.88px;
    /* text-align: left; */
    color: #191d23;
    background: rgba(228, 185, 94, 1);
    border: navajowhite;
    padding: 7px 60px 7px 15px;
    margin-bottom: 30px;
    border-radius: 6px;
}
.linediv {
    display: flex;
}
.linediv ul a li {
    font-family: "Manrope";
    font-size: 16px;
    font-weight: 700;
    line-height: 1.5;
    margin-bottom: 25px;
    text-align: left;
    color: #191d23;
}
.vertical {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%; /* Adjust height as needed */
}
.home-showcase .home-showcaseSlider .swiper-wrapper .unlocking {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
}
.linee {
    border: none;
    border-left: 0.1px solid #00000059; /* Adjust thickness and color */
    height: 100%;
    opacity: 0.5;
}
.benchtop {
    /*background: #f9f5e7;*/
    background: linear-gradient(90deg, #BE9336 0%, #FED57B 54%, #C99D40 100%);

}
.servicehead h5 {
    font-family: "Saira";
    font-size: 32.12px;
    font-weight: 700;
    margin-bottom: 40px;
    line-height: 1;
    letter-spacing: 2px;
    text-align: left;
}
.servicehead p {
    font-family: "Saira";
    font-size: 14.35px;
    font-weight: 400;
    letter-spacing: 1.5px;
    text-align: left;
    color: #484545;
}
.helpsec {
    display: flex;
}
.servicesecound {
    background: #edebeb;
    padding: 30px 50px;
    margin-top: 40px;
}
.servicesecound p {
    font-family: "Saira";
    font-size: 16px;
    letter-spacing: 1px;
    font-weight: 400;
    margin-bottom: 10px;
    text-align: left;
    color: #484545;
}
.servicesecound h4 {
    font-family: "Saira";
    font-size: 30.81px;
    font-weight: 700;
    line-height: 45.47px;
    letter-spacing: 2.2182395458221436px;
    text-align: left;
}
.servicesecound ul {
    font-family: "Saira";
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 1px;
    line-height: 40px;
    text-align: left;
    color: #484545;
}
.servicesecound ul li {
    list-style: disc;
    margin-left: 20px;
}

.helpsec1 {
    width: 31%;
}
.helpsec2 {
    width: 69%;
}
.eqmail {
    /*padding: 15px;*/
    background-color: #D8AD51;
    border-radius: 100%;
    transition: 1s all !important;
    /*width: 50px;*/
    /*height: 50px;*/
}
.eqmail a,
.eqnum a {
    color: black;
}
.eqmail .fa-envelope {
    font-size: 25px;
    padding: 10px 10px;
    transition: 1s all !important;
}
.eqnum .fa-whatsapp {
    font-size: 25px;
    padding: 10px 11px;
    transition: 1s all !important;
}
.eqnum {
    /*padding: 15px;*/
    background-color: #D8AD51;
    border-radius: 100%;
    transition: 1s all !important;
    /*height: 50px;*/
    /*width: 50px;*/
}
.eqnum:hover {
    background-color: #25d366;
}
.eqmail:hover {
    background-color: #007bff;
}
.eqmail .fa-envelope:hover {
    color: white;
}
.eqnum .fa-whatsapp:hover {
    color: white;
}
.forenquiry {
    display: flex;
    justify-content: center;
    gap: 40px;
    margin: 50px 0px;
    align-items: baseline;
    width: 100%;
}
.forenquiry h3 {
    font-family: "Saira";
    font-size: 20px;
    font-weight: 400;
    line-height: 16px;
    text-align: center;
}
/* servics page end */

/* ----------------------------aiordy--------------------- */
.airody h1 {
    font-family: "Saira";
    font-size: 59px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 7px;
    text-align: center;
    color: #ffffff;
    position: absolute;
    top: 50%;
    left: 30%;
}
.airbody_section {
    background: url(/assets/img/airody.png);
    background-size: cover;
    height: 69.5vh;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    position: relative;
}

.airodyy {
    font-family: "Saira";
    font-size: 46px;
    font-weight: 500;
    line-height: 19.5px;
    letter-spacing: 6px;
    text-align: center;
    color: #403737;
    margin-bottom: 8%;
}
.airodyy1 {
    font-family: "Saira";
    font-size: 46px;
    font-weight: 500;
    line-height: 19.5px;
    letter-spacing: 6px;
    text-align: center;
    color: #dac472;
}

.ourprohead h4 {
    font-family: "Saira";
    font-size: 22px;
    font-weight: 400;
    padding: 10px 10px 10px 100px;
    letter-spacing: 1px;
    text-align: left;
}
.ourproheading {
    position: relative;
}

.ourprohead {
    background: #E4B95E;
    clip-path: polygon(0 0, 100% 0, 88% 100%, 0 100%, 0 100%);
    width: 40%;
    position: absolute;
    z-index: 9;
    top: -50px;
}
.flexdiv1 {
    display: flex;
}
.flex1 {
    width: 68%;
    background: #fffcf0;
    clip-path: polygon(0 0, 100% 0, 85% 100%, 0% 100%, 0 50%);
    height: 100%;
}

.flex2 {
    margin-top: 110px;
    position: absolute;
    right: 0;
}
.flex2 img {
    width: 506px;
}

.flex1 ul {
    padding: 33px 0px 65px 125px;
}
.flex1 ul li {
    list-style-type: disc;
    font-family: "Saira";
    font-size: 19px;
    font-weight: 400;
    line-height: 28px;
    text-align: left;
    color: #363636;
}

/*  */

.Trading1 {
    padding: 0px 0px;
}
.ourprohead1 h4 {
    font-family: "Saira";
    font-size: 22px;
    font-weight: 400;
    padding: 10px 10px 10px 100px;
    letter-spacing: 1px;
    text-align: left;
}
.ourproheading1 {
    position: relative;
}

.ourprohead1 {
    background: #dac472;
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%, 5% 100%);
    width: 40%;
    position: absolute;
    z-index: 9;
    right: 0;
    top: -50px;
}

.turndiv {
    display: flex;
    margin-top: 55px;
}
.turn1 {
    margin-right: -125px;
    padding: 0px;
}
.turn1 img {
    width: 100%;
    height: 100%;
}
.turn2 {
    /* width: 100%;
    height: 100%; */
    width: 80%;
    background: #fffcf0;
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%, 18% 100%);
}
.datas {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    margin: 50px 100px 0px 5px;
}

.datas p {
    display: flex;
    align-items: center;
    font-family: "Saira";
    font-size: 16px;
    font-weight: 400;
    line-height: 2px;
    color: #363636;
    position: relative;
}

.datas p::before {
    content: "";
    margin-right: 8px;
    background: black;
    position: absolute;
    width: 7px;
    height: 7px;
    margin-left: -15px;
    border-radius: 50%;
}

/*  */
.roomsec {
    margin: 30px 0px;
}
.ourprocontent p {
    font-family: "Saira";
    font-size: 19px;
    font-weight: 400;
    line-height: 32px;
    text-align: left;
    padding: 55px 100px 0px 100px;
}
.colddiv {
    display: flex;
}
.cold1 {
    width: 68%;
    background: #fffcf0;
    clip-path: polygon(0 0, 100% 0, 85% 100%, 0% 100%, 0 50%);
    height: 100%;
}

.cold2 {
    position: absolute;
    margin-top: 68px;
    right: 0;
}
.cold2 img {
    width: 506px;
}

.cold1 ul {
    padding: 0px 0px 7px 125px;
}
.cold1 ul li {
    list-style-type: disc;
    font-family: "Saira";
    font-size: 19px;
    font-weight: 400;
    line-height: 28px;
    text-align: left;
    color: #363636;
}

/* --------------Shine tech------------ */

.shinetech_section {
    background: url(/assets/img/shine.png);
    background-size: cover;
    /* height: 480px; */
    height: 69.5vh;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    position: relative;
}
.shinetechtop h1 {
    font-family: "Saira";
    font-size: 59px;
    font-weight: 700;
    line-height: 19.5px;
    letter-spacing: 7px;
    text-align: center;
    color: #ffffff;
    position: absolute;
    top: 50%;
    left: 30%;
}
.mechanical {
    text-align: center;
    margin-bottom: 80px;
}
.mechanical h1 {
    font-family: "Saira";
    font-size: 26px;
    font-weight: 500;
    line-height: 34.5px;
    letter-spacing: 6px;
    color: #403737;
        margin-top: 65px;
}
.mechanical p {
    font-family: "Saira";
    font-size: 17px;
    font-weight: 400;
    color: #363636;
    padding: 0px 18%;
}

/* servicestop */

.cordinbation1 {
    padding: 30px 65px 0px 47px;
}
.cordinbation1 h3 {
    font-family: "Saira";
    font-size: 19px;
    font-weight: 600;
    text-align: left;
    align-items: center;
    color: #363636;
    display: flex;
}
.cordinbation1 p {
    font-family: "Saira";
    font-size: 17px;
    font-weight: 400;
    text-align: left;
    color: #363636;
    margin-bottom: 0px;
    width: 75%;
    margin-left: 35px;
}
.services {
    display: flex;
}
.services1 {
    background: #fffcf0;
    clip-path: polygon(0 0, 89% 0, 56% 100%, 0% 100%, 0 100%);
    padding: 20px;
    width: 80%;
}
.tech11 {
    position: absolute;
    right: 0;
    width: 500px;
}
.tech12 {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 682px;
}

/* soultion */
.numercolor {
    font-family: "Saira";
    background: #E8BE63;
    padding: 5px;
    font-size: 17px;
    display: flex;
    height: 30px;
    width: 20px;
    margin-right: 10px;
}
.solutiondiv {
    display: flex;
}
.solutiosec {
    margin: 120px 0px 20px 0px;
    position: relative;
}
.solutionhead h4 {
    font-family: "Saira";
    font-size: 22px;
    font-weight: 400;
    padding: 10px 10px 10px 65px;
    letter-spacing: 1px;
    text-align: left;
}

.solutionhead {
    background: #E8BE63;
    clip-path: polygon(0 0, 100% 0, 88% 100%, 0 100%, 0 100%);
    width: 40%;
    position: absolute;
    z-index: 9;
    top: -50px;
}
.cordinbation h3 {
    font-family: "Saira";
    font-size: 19px;
    font-weight: 600;
    text-align: left;
    color: #363636;
    display: flex;
}

.cordinbation p {
    font-family: "Saira";
    font-size: 17px;
    font-weight: 400;
    text-align: left;
    color: #363636;
    margin-bottom: 0px;
    width: 65%;
    margin-left: 35px;
}
.solution1 {
    width: 72%;
    background: #fffcf0;
    clip-path: polygon(0 0, 100% 0, 84% 100%, 0% 100%, 0 100%);
}
.solution2 {
    right: 0;
    position: absolute;
    margin-top: 68px;
}
.solution2 img {
    width: 506px;
}
.cordinbation {
    padding: 30px 0px 20px 70px;
}

/* solars start */

.solarflexdiv1 {
    display: flex;
    margin-bottom: 60px;
}
.solarflex11 {
    width: 80%;
    background: #fffcf0;
    clip-path: polygon(0 0, 100% 0, 72% 100%, 0% 100%, 0 50%);
    height: 100%;
    padding: 30px 65px 0px 47px;
}
.solarser1 {
    width: 35%;
    position: absolute;
    right: 0;
}
.solarser2 {
    width: 35%;
    position: absolute;
    right: 0;
    bottom: 0;
}
.solarflex12 {
}
.solarser1 {
    width: 360px;
}
.solarser3 {
    width: 400px;
}
.solarser2 {
    width: 500px;
}
.solarpro h4 {
    padding: 10px 10px 10px 50px !important;
}
.solarflex11 h3 {
    font-family: "Saira";
    font-size: 19px;
    font-weight: 600;
    text-align: left;
    color: #363636;
    display: flex;
    align-items: center;
}

.solarflex11 h2 {
    font-family: "Saira";
    font-size: 23px;
    font-weight: 600;
    letter-spacing: 0.5px;
    text-align: left;
}

.solarflex11 p {
    list-style-type: disc;
    font-family: "Saira";
    font-size: 16px;
    margin-bottom: 0px;
    font-weight: 400;
    text-align: left;
    color: #363636;
}

.solarflex1 {
    width: 80%;
    background: #fffcf0;
    clip-path: polygon(0 0, 100% 0, 85% 100%, 0% 100%, 0 50%);
    height: 100%;
    padding: 0px 65px 0px 47px;
}

.solarflex2 {
    position: absolute;
    right: 0;
}
.solarflex1 h3 {
    font-family: "Saira";
    font-size: 19px;
    font-weight: 600;
    text-align: left;
    color: #363636;
    display: flex;
    align-items: center;
}

.solarflex1 h2 {
    font-family: "Saira";
    font-size: 23px;
    font-weight: 600;
    letter-spacing: 0.5px;
    text-align: left;
}

.solarflex1 p {
    list-style-type: disc;
    font-family: "Saira";
    font-size: 16px;
    margin-bottom: 0px;
    font-weight: 400;
    text-align: left;
    color: #363636;
}

/* solar end */

/* oilgas start */

.oilsolutiosec {
    margin: 120px 0px 20px 0px;
    position: relative;
}
.oilsolutionhead h4 {
    font-family: "Saira";
    font-size: 22px;
    font-weight: 400;
    padding: 10px 10px 10px 65px;
    letter-spacing: 1px;
    text-align: left;
}
.oilsolutiondiv {
    display: flex;
}
.oilsolutionhead {
    background: #E4B95E;
    clip-path: polygon(0 0, 100% 0, 88% 100%, 0 100%, 0 100%);
    width: 40%;

    position: absolute;
    z-index: 9;
    top: -50px;
}
.oilcordinbation h3 {
    font-family: "Saira";
    font-size: 19px;
    font-weight: 600;
    text-align: left;
    color: #363636;
    display: flex;
}

.oilcordinbation p {
    font-family: "Saira";
    font-size: 17px;
    font-weight: 400;
    text-align: left;
    color: #363636;
    margin-bottom: 20px;
    width: 65%;
}

.oilsolution1 {
    width: 75%;
    background: #fffcf0;
    height: 100%;
    clip-path: polygon(0 0, 100% 0, 81% 100%, 0% 100%, 0 100%);
}
.oilsolution2 {
    /* margin-left: -179px; */
    position: absolute;
    right: 0;
}
.oilsolution2 img {
    width: 480px;
}

.esd1 {
    width: 75%;
    background: #fffcf0;
    clip-path: polygon(0 0, 100% 0, 80% 100%, 0% 100%, 0 100%);
}
.esd2 {
    position: absolute;
    right: 0;
}
.esd2 img {
    width: 490px;
}
.hse1 .oilcordinbation p {
    margin-bottom: 0px;
}
.newregular {
    padding: 0px 0px 20px 70px !important;
}
.hse1 .oilcordinbation p {
    width: 75%;
}
.hse1 {
    width: 75%;
    background: #fffcf0;
    clip-path: polygon(0 0, 100% 0, 80% 100%, 0% 100%, 0 100%);
}
.hse2 {
    position: absolute;
    right: 0;
}
.hse2 img {
    width: 523px;
}
.regular h4 {
    font-family: "Saira";
    font-size: 22px;
    font-weight: 400;
    padding: 10px 10px 10px 65px;
    letter-spacing: 1px;
    text-align: left;
    background: #E4B95E;
    clip-path: polygon(0 0, 100% 0, 88% 100%, 0 100%, 0 100%);
    width: 40%;
    z-index: 9;
}

.oilcordinbation {
    padding: 30px 0px 20px 70px;
}

.oilcordinbation1 {
    padding: 30px 65px 0px 47px;
}
.oilcordinbation1 h3 {
    font-family: "Saira";
    font-size: 19px;
    font-weight: 600;
    text-align: left;
    align-items: center;
    color: #363636;
    display: flex;
}
.oilcordinbation1 p {
    font-family: "Saira";
    font-size: 17px;
    font-weight: 400;
    text-align: left;
    color: #363636;
    margin-bottom: 0px;
    width: 75%;
    margin-left: 35px;
}
.oilservices {
    display: flex;
}
.oilservices1 {
    flex: 1 1 100%;
    background: #fffcf0;
    clip-path: polygon(0 0, 88% 0, 68% 100%, 0% 100%, 0 100%);
    padding: 20px;
    margin-right: -430px;
}
.oilservices2 {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.oiltechimg1,
.oiltechimg2 {
    width: 100%;
    display: flex;
    justify-content: end;
}
.oiltech1 {
    width: 380px;
    margin-left: 205px;
}

.oiltech2 {
    width: 480px;
}
.oiltechimg2 {
    margin-top: 20px;
}

/* oillgas end */

/* otherservice */
.ourservediv {
    display: flex;
}
.oursherve2 {
    margin-left: -165px;
}
.oursherve1 {
    height: 533px;
    width: 100%;
    background: url(/assets/img/shserve1.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
}
.oursherve2 {
    height: 533px;
    width: 100%;
    background-repeat: no-repeat;
    background: url(/assets/img/shserve2.png);
}
.otherr {
    padding: 50px;
    font-family: "Saira";
    font-size: 46px;
    font-weight: 700;
    line-height: 19.5px;
    letter-spacing: 6px;
    text-align: center;
    color: #605c5c;
}
.oilgas {
    margin-top: 27%;
}
.oilgas h3 {
    font-family: "Saira";
    font-size: 46px;
    font-weight: 700;
    line-height: 0px;
    letter-spacing: 1px;
    text-align: center;
    color: #ffffff;
}
.solar {
    font-weight: 400 !important;
}
.blogcontent {
    padding: 0px 10px 0px 10px;
}
.everysecoundblog {
    transition: all 0.4s;
}
.blogcontent h3 {
    font-family: "Saira";
    font-size: 26px;
    font-weight: 700;
    line-height: 27px;
    letter-spacing: 2px;
    text-align: left;
    color: #2f2c2c;
    transition: all 1s !important;
}
.blogcontent p {
    font-family: "Saira";
    font-size: 15px;
    font-weight: 400;
    line-height: 25px;
    letter-spacing: 1px;
    text-align: left;
    color: #484545;
}
.dkkk {
    display: flex;
    justify-content: space-between;
}
.dkkk p {
    font-family: "Saira";
    font-size: 14px;
    font-weight: 300;
    /*padding-bottom: 20px;*/
    padding-bottom: 11px;
    letter-spacing: 2px;
    text-align: left;
    color: #71706c;
}
.blog-panel {
    z-index: 3;
    background: #f9f5e7;
}
.blogtop h1 {
    font-family: "Saira";
    font-size: 46px;
    font-weight: 700;
    line-height: 19.5px;
    letter-spacing: 7px;
    text-align: end;
    margin-top: 22%;
    color: #ffffff;
}
.blogtop h2 {
    font-family: "Saira";
    font-size: 46px;
    font-weight: 700;
    line-height: 19.5px;
    letter-spacing: 7px;
    text-align: end;
    margin-top: 22%;
    color: #ffffff;
}
.blog-panel {
    position: absolute;
    width: 19.735vmin;
    left: 0;
    top: 0;
    bottom: 0;
    text-align: center;
}
.blogcontent h3:hover {
    color: rgba(229, 205, 117, 1);
}
.bloghr {
    border-top: 1px solid #898989;
    margin: 0px 0px;
}
.blogline1 {
    border-right: 0.1px solid #1f1d1c4d;
    opacity: 0.1;
    height: 55%;
    top: 30%;
    left: 12%;
    position: absolute;
}
.blogline2 {
    border-right: 0.1px solid #1f1d1c4d;
    opacity: 0.1;
    height: 55%;
    top: 30%;
    right: 140px;
    position: absolute;
}
.newblogg {
    margin: 40px 100px;
    transition: all 1s !important;
    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
}
.newblogg:hover {
    background-color: #f9f5e7;
}

/* ---------------singleblog--------------------- */

.sblog_section {
    background: linear-gradient(
            89.8deg,
            rgba(0, 0, 0, 0.5) 20.17%,
            rgba(0, 0, 0, 0.292175) 68.94%,
            rgba(0, 0, 0, 0) 97.81%
        ),
        url(/assets/img/bban.png);
    /* background:url(/assets/img/blogban.png); */
    background-size: 100% 100%;
    height: 69vh;
    background-repeat: no-repeat;
}
.sdk {
    display: flex;
    justify-content: space-between;
}
.sblogcontent h3 {
    font-family: "Saira";
    font-size: 29px;
    font-weight: 700;
    line-height: 41px;
    letter-spacing: 2px;
    text-align: left;
    color: #2f2c2c;
}
.sinhr {
    margin: 0px;
    border-top: 1px solid #71706c;
}
.sdk p {
    font-family: "Saira";
    font-size: 19px;
    font-weight: 500;
    line-height: 24px;
    letter-spacing: 2px;
    text-align: left;
    color: #71706c;
}
.entery p {
    font-family: "Saira";
    font-size: 15px;
    font-weight: 400;
    text-align: justify;
    color: #484545;
}
.sblogsec {
    padding-bottom: 70px;
}
.recentdk h4 {
    font-family: "Saira";
    font-size: 20px;
    letter-spacing: 2px;
    color: #2f2c2c;
    font-weight: 700;
    margin-top: 60%;
}
.sblogcontent {
    margin: 50px;
}
.rblog h3 {
    font-family: "Saira";
    font-size: 19px;
    font-weight: 700;
    letter-spacing: 2px;
    text-align: left;
    text-decoration: none;
    transition: all 0.5s;
}
.rblog h3:hover {
    color: rgba(229, 205, 117, 1);
}
.rblog a {
    text-decoration: none;
}
.rblog img {
    width: 100%;
}
.areaimg {
    margin-bottom: 40px;
}
.contract p {
    font-size: 14px;
}

/* sliderimggg */

/* Common styles for both sliders */
.slides,
.slides-1 {
    padding: 0;
    width: 506px;
    height: 425px;
    display: block;
    margin: 0 auto;
    overflow: hidden;
    position: relative;
}

.slides-2 {
    padding: 0;
    width: 506px;
    height: 603px;
    display: block;
    margin: 0 auto;
    overflow: hidden;
    position: relative;
}

.slides *,
.slides-1 *,
.slides-2 *,
.comslides *,
.newcomslides * {
    user-select: none;
    -ms-user-select: none;
    -moz-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    -webkit-touch-callout: none;
}

.slides input,
.slides-1 input,
.slides-2 input {
    display: none;
}

.slide-container {
    display: block;
}
.slides-2 .slide-container .slide {
    top: 0;
    opacity: 0;
    width: 506px;
    height: 603px;
    display: block;
    position: absolute;
    transform: scale(0);
    transition: all 0.7s ease-in-out;
}

.slide {
    top: 0;
    opacity: 0;
    width: 506px;
    height: 425px;
    display: block;
    position: absolute;
    transform: scale(0);
    transition: all 0.7s ease-in-out;
}

.slide img {
    width: 100%;
    height: 100%;
}

.nav label {
    top: 0;
    width: 200px;
    height: 100%;
    display: none;
    position: absolute;
    opacity: 0;
    z-index: 9;
    cursor: pointer;
    transition: opacity 0.2s;
    color: #fff;
    font-size: 70pt;
    text-align: center;
    line-height: 380px;
    font-family: "Varela Round", sans-serif;
    background-color: rgba(255, 255, 255, 0.3);
    text-shadow: 0px 0px 15px #777777;
}

.slide:hover + .nav label {
    opacity: 0.5;
}

.nav label:hover {
    opacity: 1;
}

.nav .next {
    right: 0;
}

input:checked + .slide-container .slide {
    opacity: 1;
    transform: scale(1);
    transition: opacity 1s ease-in-out;
}

input:checked + .slide-container .nav label {
    display: block;
}

.nav-dots {
    width: 100%;
    bottom: 9px;
    height: 11px;
    display: block;
    position: absolute;
    text-align: center;
}

.nav-dots .nav-dot {
    top: -5px;
    width: 11px;
    height: 11px;
    margin: 0 4px;
    cursor: pointer;
    position: relative;
    border-radius: 100%;
    display: inline-block;
    background-color: transparent;
}

.nav-dots .nav-dot:hover,
input#img-1:checked ~ .nav-dots label#img-dot-1,
input#img-2:checked ~ .nav-dots label#img-dot-2,
input#img-3:checked ~ .nav-dots label#img-dot-3,
input#img-4:checked ~ .nav-dots label#img-dot-4,
input#img-5:checked ~ .nav-dots label#img-dot-5,
input#img-6:checked ~ .nav-dots label#img-dot-6 {
    background: transparent;
}

.nav-dots .nav-dot:hover,
input#img-11:checked ~ .nav-dots label#img-dot-11,
input#img-12:checked ~ .nav-dots label#img-dot-12,
input#img-13:checked ~ .nav-dots label#img-dot-13,
input#img-14:checked ~ .nav-dots label#img-dot-14,
input#img-15:checked ~ .nav-dots label#img-dot-15,
input#img-16:checked ~ .nav-dots label#img-dot-16 {
    background: transparent;
}

.nav-dots .nav-dot:hover,
input#img-111:checked ~ .nav-dots label#img-dot-111,
input#img-112:checked ~ .nav-dots label#img-dot-112,
input#img-113:checked ~ .nav-dots label#img-dot-113,
input#img-114:checked ~ .nav-dots label#img-dot-114,
input#img-115:checked ~ .nav-dots label#img-dot-115,
input#img-116:checked ~ .nav-dots label#img-dot-116 {
    background: rgba(0, 0, 0, 0.8);
}

/* Additional styles for transitions */
.slide.slices {
    opacity: 1;
    transform: none;
    position: absolute;
    background-size: 0 0;
}

.slices:after,
.slices:before,
.slices .slice,
.slices .slice:before,
.slices .slice:after {
    top: -100%;
    height: 100%;
    position: absolute;
    background-image: inherit;
    background-size: auto 100%;
    transition: top 0.7s;
    transform: translateZ(0);
}

.slices .slice,
.slices:before,
.slices:after {
    width: 12.5%;
}

.slices:after,
.slices:before,
.slices .slice:before,
.slices .slice:after {
    content: "";
    transition-property: transform, top;
}

.slices .slice:before,
.slices .slice:after {
    width: 100%;
    transform: translateY(100%);
}

.slices:before {
    left: 0;
}

.slices:after {
    right: 0;
    background-position-x: 100%;
    transition-delay: 700ms;
}

.slices .slice:before {
    left: -100%;
}

.slices .slice:after {
    left: 100%;
}

.slices .slice:nth-child(2):before {
    background-position-x: 57.1428571429%;
    transition-delay: 500ms, 400ms;
}

.slices .slice:nth-child(2) {
    left: 62.5%;
    background-position-x: 71.4285714286%;
    transition-delay: 500ms;
}

.slices .slice:nth-child(2):after {
    background-position-x: 85.7142857143%;
    transition-delay: 500ms, 600ms;
}

.slices .slice:nth-child(1):before {
    background-position-x: 14.2857142857%;
    transition-delay: 200ms, 100ms;
}

.slices .slice:nth-child(1) {
    left: 25%;
    background-position-x: 28.5714285714%;
    transition-delay: 200ms;
}

.slices .slice:nth-child(1):after {
    background-position-x: 42.8571428571%;
    transition-delay: 200ms, 300ms;
}

/* Active transition states */
input:checked + .slide-container .slide.slices {
    transition: all 0.7s ease-in-out;
}

input:checked + .slide-container .slide.slices .slice,
input:checked + .slide-container .slide.slices:after,
input:checked + .slide-container .slide.slices:before {
    top: 0%;
}

input:checked + .slide-container .slide.slices .slice:before,
input:checked + .slide-container .slide.slices .slice:after {
    top: 0%;
    transform: translateY(0);
}

.slide.slices.cascade {
    transform: scale(0);
}

input:checked + .slide-container .slide.slices.cascade {
    transform: none;
}

.slide.slices.underise {
    transform: scale(0);
}

.slices.underise:after,
.slices.underise:before,
.slices.underise .slice,
.slices.underise .slice:before,
.slices.underise .slice:after {
    top: 100%;
}

input:checked + .slide-container .slide.slices.underise {
    transform: none;
}

.slide.hslices {
    opacity: 1;
    z-index: -1;
    transform: none;
    position: absolute;
    background-size: 0 0;
}

.hslices:after,
.hslices:before,
.hslices .slice,
.hslices .slice:before,
.hslices .slice:after {
    left: 100%;
    width: 100%;
    position: absolute;
    background-image: inherit;
    background-size: 100% auto;
    transition: left 0.7s;
    transform: translateZ(0);
}

.hslices .slice,
.hslices:before,
.hslices:after {
    height: 20%;
}

.hslices:after,
.hslices:before,
.hslices .slice:before,
.hslices .slice:after {
    content: "";
    transition-property: transform, left;
}

.hslices .slice:before,
.hslices .slice:after {
    height: 100%;
    transform: translateX(100%);
}

.hslices:before {
    top: 0;
}

.hslices:after {
    bottom: 0;
    background-position-y: 100%;
    transition-delay: 400ms;
}

.hslices .slice:before {
    top: -100%;
}

.hslices .slice:after {
    top: 100%;
}

.hslices .slice:nth-child(1):before {
    background-position-y: 25%;
    transition-delay: 200ms, 100ms;
}

.hslices .slice:nth-child(1) {
    top: 40%;
    background-position-y: 50%;
    transition-delay: 200ms;
}

.hslices .slice:nth-child(1):after {
    background-position-y: 75%;
    transition-delay: 200ms, 300ms;
}

input:checked + .slide-container .slide.hslices {
    transition: all 0.7s ease-in-out;
}

input:checked + .slide-container .slide.hslices .slice,
input:checked + .slide-container .slide.hslices:after,
input:checked + .slide-container .slide.hslices:before {
    left: 0%;
}

input:checked + .slide-container .slide.hslices .slice:before,
input:checked + .slide-container .slide.hslices .slice:after {
    left: 0%;
    transform: translateX(0);
}

.slide.hslices.upfade {
    transform: scale(0);
}

input:checked + .slide-container .slide.hslices.upfade {
    transform: none;
}

/* Slide images for first ul */
.slides .slide img {
    width: 100%;
    height: 100%;
}

/* Slide images for second ul */
.slides-1 .slide img {
    width: 100%;
    height: 100%;
}

/* Slide images for second ul */
.slides-2 .slide img {
    width: 100%;
    height: 100%;
}
/* company2 page integrated  slider */
.comslides .slide img {
    width: 100%;
    height: 100%;
}
.comslides {
    padding: 0;
    width: 506px;
    height: 425px;
    display: block;
    margin: 0 auto;
    overflow: hidden;
    position: relative;
}
.comslides input {
    display: none;
}
.nav-dots .nav-dot:hover,
input#comimg-1:checked ~ .nav-dots label#comimg-dot-1,
input#comimg-2:checked ~ .nav-dots label#comimg-dot-2,
input#comimg-3:checked ~ .nav-dots label#comimg-dot-3,
input#comimg-4:checked ~ .nav-dots label#comimg-dot-4,
input#comimg-5:checked ~ .nav-dots label#comimg-dot-5,
input#comimg-6:checked ~ .nav-dots label#comimg-dot-6 {
    background: transparent;
}

/* elctromechincal slider */

.newcomslides .slide img {
    width: 100%;
    height: 100%;
}
.newcomslides {
    padding: 0;
    width: 506px;
    height: 425px;
    display: block;
    margin: 0 auto;
    overflow: hidden;
    position: relative;
}
.newcomslides input {
    display: none;
}
.nav-dots .nav-dot:hover,
input#newcomimg-1:checked ~ .nav-dots label#newcomimg-dot-1,
input#newcomimg-2:checked ~ .nav-dots label#newcomimg-dot-2,
input#newcomimg-3:checked ~ .nav-dots label#newcomimg-dot-3,
input#newcomimg-4:checked ~ .nav-dots label#newcomimg-dot-4,
input#newcomimg-5:checked ~ .nav-dots label#newcomimg-dot-5,
input#newcomimg-6:checked ~ .nav-dots label#newcomimg-dot-6 {
    background: transparent;
}

/* Media Queries for Responsive Design */
/* contact line */
.cgett {
    z-index: 5;
    position: relative;
}
.cline1,
.cline2,
.cline3,
.cline4 {
    position: absolute;
    width: 1px;
    height: 400px;
    background-color: #1f1d1c;
    opacity: 3%;
    top: 0;
}
.cline1 {
    left: 5%;
}
.cline2 {
    left: 43%;
}
.cline3 {
    right: 36%;
}
.cline4 {
    right: 14%;
}

.mobile_block {
    display: none;
}

.mobile_none1 {
    display: none;
}

/* wabco section */
.wabcotop h1 {
    font-family: "Saira";
    font-size: 39px;
    font-weight: 700;
    line-height: 19.5px;
    letter-spacing: 7px;
    text-align: center;
    color: #ffffff;
    position: absolute;
    top: 45%;
    left: 38%;
}
.newwebco {
    top: 55% !important;
    left: 30% !important;
}
.wabcohead h1 {
    font-family: "Saira";
    font-size: 33px;
    font-weight: 500;
    letter-spacing: 6px;
    text-align: center;
    color: #403737;
}

.wabcodiv {
    display: flex;
}
.wabco1 {
    background: #fffcf0;
    clip-path: polygon(0 0, 84% 0, 69% 100%, 0% 100%, 0 100%);
    padding: 50px 30px;
    width: 80%;
}
.web11 {
    position: absolute;
    right: 0;
    width: 500px;
}
.web12 {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 569px;
}

.wabcosec {
    margin: 80px 0px 20px 0px;
    position: relative;
}
.wabcoheadtop h1 {
    font-family: "Saira";
    font-size: 46px;
    font-weight: 500;
    letter-spacing: 6px;
    text-align: center;
    color: #403737;
}
.wabcohead h4 {
    font-family: "Saira";
    font-size: 30px;
    font-weight: 500;
    padding: 10px 10px 10px 65px;
    letter-spacing: 1px;
    text-align: left;
    color: #231f20;
}

.wabcohead {
    background: #E4B95E;
    clip-path: polygon(0 0, 100% 0, 88% 100%, 0 100%, 0 100%);
    width: 25%;
    position: absolute;
    z-index: 9;
    top: -50px;
}
.wabcopara p {
    font-family: "Saira";
    font-size: 17px;
    font-weight: 400;
    letter-spacing: 1px;
    text-align: left;
    color: #363636;
    margin-bottom: 10px;
    width: 65%;
    margin-left: 35px;
}
.visiondiv {
    display: flex;
}

.visionn1 {
    width: 72%;
    background: #fffcf0;
    clip-path: polygon(0 0, 94% 0, 81% 100%, 0% 100%, 0 100%);
}
.visionn2 {
    right: 0;
    position: absolute;
}
.visionn2 img {
    width: 506px;
}
.visionpara {
    padding: 66px 0px 20px 32px;
}
.visionpara p {
    font-family: "Saira";
    font-size: 17px;
    font-weight: 400;
    text-align: left;
    color: #363636;
    margin-bottom: 0px;
    width: 79%;
    margin-left: 35px;
}
.customspan {
    font-family: "Saira";
    font-size: 20px;
    font-weight: 700;
    line-height: 37px;
    text-align: left;
    color: #363636;
}
.valuepara {
    padding: 50px 0px 37px 70px;
}
.valuepara p {
    font-family: "Saira";
    font-size: 17px;
    font-weight: 400;
    width: 89%;
    margin-bottom: 0px;
    text-align: left;
}
.valuepara h5 {
    font-family: "Saira";
    width: 65%;
    font-size: 20px;
    font-weight: 600;
    line-height: 27px;
    text-align: left;
}
.valuesdiv {
    display: flex;
}
.values1 {
    width: 72%;
    background: #fffcf0;
    clip-path: polygon(0 0, 96% 0, 84% 100%, 0% 100%, 0 100%);
}
.values2 {
    right: 0;
    position: absolute;
}
.values2 img {
    width: 506px;
}
.reversepara p {
    font-family: "Saira";
    font-size: 18px;
    font-weight: 400;
    line-height: 28px;
    margin-bottom: 0px;
    text-align: left;
    color: #363636;
}

/* Wabco */
.wabco_section {
    background: url(/assets/img/wabcobann.png);
    background-size: cover;
    height: 69.5vh;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    position: relative;
}
.waterdiv {
    display: flex;
}
.water1 {
    /* clip-path: polygon(0 0, 85% 0, 65% 100%, 0% 100%, 0 100%);
    width: 85%; */
    background: #fffcf0;
    clip-path: polygon(0 0, 85% 0, 61% 100%, 0% 100%, 0 100%);
    padding: 50px 0px 37px 70px;
    width: 80%;
}
.waterdivv li {
    font-family: "Saira";
    font-size: 17px;
    list-style: disc;
    font-weight: 400;
    line-height: 30px;
    text-align: left;
}
.waterrow {
    padding: 35px 15px;
}
.tick {
    width: 30px;
    height: 30px;
}
/* Treatment Plants */
.tre11 {
    position: absolute;
    right: 0;
    width: 491px;
    /* width: 418px; */
}
.tre12 {
    position: absolute;
    top: 35%;
    right: 0;
    width: 579px;
    /* width: 500px; */
}
.tre13 {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 651px;
    /* width: 569px; */
}

.treatplant h4 {
    font-family: "Saira";
    font-size: 34px;
    font-weight: 600;
    padding: 10px 10px 10px 65px;
    letter-spacing: 1px;
    text-align: left;
    color: #231f20;
}

.treatplant {
    background: #E4B95E;
    clip-path: polygon(0 0, 99% 0, 95% 100%, 0 100%, 0 100%);
    width: 80%;
    position: absolute;
    z-index: 9;
    top: -50px;
}
.waterpara p {
    font-family: "Saira";
    font-size: 18px;
    font-weight: 400;
    text-align: left;
    color: #363636;
    width: 75%;
    margin-bottom: 10px;
}
.waterpara h5 {
    font-family: "Saira";
    font-size: 22px;
    font-weight: 600;
    line-height: 30px;
    text-align: left;
    color: #363636;
    width: 70%;
}
.waterdivv {
    padding-left: 20px;
}

/* wayter feature */
.filterhead h4 {
    font-family: "Saira";
    font-size: 30px;
    font-weight: 600;
    padding: 10px 10px 10px 65px;
    letter-spacing: 1px;
    text-align: left;
    color: #231f20;
}

.filterhead {
    background: #E4B95E;
    clip-path: polygon(0 0, 99% 0, 95% 100%, 0 100%, 0 100%);
    width: 65%;
    position: absolute;
    z-index: 9;
    top: -50px;
}
.filterdiv {
    display: flex;
}
.fil11 {
    position: absolute;
    right: 0;
    width: 552px;
}
.fil12 {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 660px;
}

.filter1 {
    background: #fffcf0;
    clip-path: polygon(0 0, 85% 0, 65% 100%, 0% 100%, 0 100%);
    padding: 50px 0px 37px 70px;
    width: 75%;
}
.filterpara h5 {
    font-family: "Saira";
    font-size: 22px;
    font-weight: 600;
    line-height: 25px;
    width: 70%;
    color: #363636;
}
.offer {
    font-size: 21px !important;
    font-weight: 400 !important;
    width: 75%;
    margin-bottom: 10px !important;
    line-height: 31px !important;
}
.filterpara p {
    font-family: "Saira";
    font-size: 20px;
    font-weight: 400;
    line-height: 34px;
    color: #363636;
    margin-bottom: 0px;
}

/* waste water */
.workhead {
    background: #E4B95E;
    clip-path: polygon(0 0, 99% 0, 95% 100%, 0 100%, 0 100%);
    width: 85%;
    position: absolute;
    z-index: 9;
    top: -50px;
}
.workhead h4 {
    font-family: "Saira";
    font-size: 30px;
    font-weight: 600;
    padding: 10px 10px 10px 65px;
    letter-spacing: 1px;
    text-align: left;
    color: #231f20;
}
.watertreat {
    margin: 70px 70px 30px 70px;
    padding-top: 55px;
}
.watertreat p {
    font-family: "Saira";
    font-size: 20px;
    font-weight: 400;
    line-height: 34px;
    text-align: left;
    width: 85%;
    color: #363636;
    margin-bottom: 12px;
}
.supply {
    display: flex;
    width: 35%;
}
.supply p {
    font-family: "Saira";
    font-size: 27px;
    font-weight: 400;
    line-height: 54px;
    text-align: left;
    color: #363636;
}

/* client page */
.client_section {
    /* background: url(/assets/img/clientban.png); */
    background: linear-gradient(
            89.8deg,
            rgba(0, 0, 0, 0.5) 20.17%,
            rgba(0, 0, 0, 0.292175) 68.94%,
            rgba(0, 0, 0, 0) 97.81%
        ),
        url(/assets/img/ccban.png);
    background-size: cover;
    height: 69.5vh;
    background-repeat: no-repeat;
    /* background-size: 100% 100%; */
    position: relative;
}
.clientsec h4 {
    font-family: "Saira";
    font-size: 35px;
    font-weight: 500;
    letter-spacing: 2px;
    text-align: center;
    color: #403737;
    margin-top: 50px;
}
.clienttop {
    margin-top: 18%;
}
.clienttop h1 {
    font-family: "Saira";
    font-size: 36.2px;
    font-weight: 700;
    line-height: 18px;
    letter-spacing: 1px;
    text-align: end;
    color: #ffffff;
}
.browback {
    background-image: url(/assets/img/brochure.png);
    height: 130px;
    padding-top: 25px;
    margin-bottom: 45px;
}

.brow {
    justify-content: center;
    display: flex;
}

.brow h3 {
    background: #231f20;
    font-family: "Sarpanch";
    font-size: 25px;
    font-weight: 400;
    border-radius: 50px;
    padding: 1px 66px;
    transition: 1s ease-in-out;
    color: #ffffff;
    display: inline-block;
    position: relative;
}

.brow h3:hover {
    background: #D8AD51;
    color:black;
    cursor: pointer;
    box-shadow: rgba(50, 50, 93, 0.25) 0px 50px 100px -20px,
        rgba(0, 0, 0, 0.3) 0px 30px 60px -30px;
}

.brow h3 img {
    transition: 0.3s transform;
        height: 50px;
    width: 50px;
}

.brow h3:hover img {
    transform: translateX(5px);
}

.clientsec p {
    font-family: "Saira";
    font-size: 21px;
    font-weight: 400;
    padding: 0px 138px;
    letter-spacing: -0.01em;
    text-align: center;
}

.whosays {
    margin-top: 35%;
}
.whosays h3 {
    font-family: "Saira";
    font-size: 45px;
    font-weight: 700;
    line-height: 35px;
    letter-spacing: 2px;
    text-align: left;
    color: #403737;
}
.whosays p {
    font-family: "Saira";
    font-size: 18px;
    font-weight: 400;
    letter-spacing: -0.01em;
    text-align: left;
    color: #363636;
    width: 80%;
    margin-top: 40px;
}
.name h3 {
    font-family: "Saira";
    font-size: 26px;
    font-weight: 600;
    color: #D8AD51;
        margin-bottom: 0px;
}
.name p {
    font-family: "Saira";
    font-size: 13px;
    font-weight: 400;
    line-height: 16px;
    width: 95%;
    color: #595757;
}
.namebor {
    border: 1px solid #D8AD51;
    border-left: 10px solid #D8AD51;
    background: white;
    box-shadow: 0px 4px 30.4px 0px #4444442b;
}
.centerwater {
    margin-top: 25px;
    margin-bottom: 25px;
}
.nameborlight {
    background: white;
    border: 1px solid #d9d9d9;
    border-left: 8px solid #d9d9d9;
    box-shadow: 0px 4px 30.4px 0px #4444442b;
}
.nameborlight .name h3 {
    color: #000000;
        margin-bottom: 15px;
    font-size: 18px;
}
.name {
    position: relative;
}
.name img {
    position: absolute;
    top: 0;
    right: 0;
}
.name h6 {
    font-family: "Saira";
    font-size: 15px;
    font-weight: 400;
    color: #535353;
      margin-top: 4px;
    margin-bottom: 17px;
}
.starr {
    margin-top: 15px;
    padding-bottom: 10px;
}
.starr img {
    margin-bottom: 10px;
    width: 20px;
    height: 20px;
}

.testisec {
    background: rgba(255, 231, 179, 1);
    clip-path: polygon(0 0, 100% 7%, 100% 100%, 0 93%);
    padding: 60px 0px;
    margin: 11% 0;
}
.testimonial {
    animation: slideUpDown 5s ease-in-out infinite;
    -webkit-animation: slideUpDown 5s ease-in-out infinite;
}

@keyframes slideUpDown {
    0% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
    40% {
        -webkit-transform: translate3d(0, 50%, 0);
        transform: translate3d(0, 10%, 0);
    }
    100% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

.backtop {
    width: 45px;
    position: fixed;
    bottom: 55px;
    right: 10px;
    background-color: white;
    z-index: 100;
    cursor: pointer;
    padding: 5px 5px;
    border-radius: 100%;
    box-shadow: 0 1px 5px rgb(0 0 0 / 22%);
}
.backtop img {
    width: 100%;
    cursor: pointer;
}
.clientlogo {
    text-align: center;
}
.clientlogo img {
    transition: all 0.5s ease-in;
    cursor: pointer;
}
.clientlogo img:hover {
    transform: translateY(-10px);
   border-radius: 40px;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 20px 25px -5px, rgba(0, 0, 0, 0.04) 0px 10px 10px -5px;
}
.worksec {
    margin-bottom: 120px;
    margin-top: 65px;
}
.combdisc li {
    list-style-type: disc;
}
.group {
    color: #1f1d1c !important;
    text-decoration: none !important;
    margin-left: 0px;
    font-family: "Saira";
    font-weight: 400;
    font-size: 15px;
}
.combdisc li {
    margin-bottom: 0px;
}
.combdisc li a {
    font-size: 13px;
    color: #1f1d1c;
}

/* button hoverr */
.home-btn3{
    border: none;
    transition: all 0.3s ease;
    overflow: hidden;
}
.home-btn3:after {
    position: absolute;
    content: " ";
    z-index: -1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #1fd1f9;
    background-image: linear-gradient(315deg, #f0da71 0%, #c2aa52 74%);
    transition: all 0.3s ease;
}
.home-btn3:hover {
    background: transparent;
    box-shadow: 4px 4px 6px 0 rgba(255, 255, 255, 0.5),
        -4px -4px 6px 0 rgba(116, 125, 136, 0.2),
        inset -4px -4px 6px 0 rgba(255, 255, 255, 0.5),
        inset 4px 4px 6px 0 rgba(116, 125, 136, 0.3);
}
.home-btn3:hover:after {
    -webkit-transform: scale(2) rotate(180deg);
    transform: scale(2) rotate(180deg);
    box-shadow: 4px 4px 6px 0 rgba(255, 255, 255, 0.5),
        -4px -4px 6px 0 rgba(116, 125, 136, 0.2),
        inset -4px -4px 6px 0 rgba(255, 255, 255, 0.5),
        inset 4px 4px 6px 0 rgba(116, 125, 136, 0.3);
}
/*  */
/*  */
.contactsub:hover {
	color: #000 !important;
	background-color: transparent;
}
.contactsub:hover:before {
	right: 0%;
	left: auto;
	width: 100%;
}
.contactsub:before {
	display: block;
	position: absolute;
	top: 0px;
	left: 0px;
	height: 100%;
	width: 0px;
	z-index: -1;
	content: '';
	color: #000 !important;
	background:#dbc470;
	transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1);
}
/*  */

.btn4::before{
    width: 100%;
    height: 0%;
    transform: translate(-50%,-50%) rotate(-45deg);
  }
  .btn4:hover::before{
    height: 380%;
  }

/*  */
.brow h3 {
    -webkit-transition: all 0.35s ease;
    -moz-transition: all 0.35s ease;
    -o-transition: all 0.35s ease;
    transition: all 0.35s ease;
  }
  .brow h3:hover {
    -webkit-animation: bounce 0.25s 2 linear alternate;
    -moz-animation: bounce 0.25s 2 linear alternate;
    -o-animation: bounce 0.25s 2 linear alternate;
    animation: bounce 0.25s 2 linear alternate;
  }

  @-webkit-keyframes bounce {
    0% {
      -webkit-transform: rotate(0deg);
    }
    50% {
      -webkit-transform: rotate(3deg);
    }
    100% {
      -webkit-transform: rotate(-3deg);
    }
  }
  @-moz-keyframes bounce {
    0% {
      -moz-transform: rotate(0deg);
    }
    50% {
      -moz-transform: rotate(3deg);
    }
    100% {
      -moz-transform: rotate(-3deg);
    }
  }
  @-o-keyframes bounce {
    0% {
      -o-transform: rotate(0deg);
    }
    50% {
      -o-transform: rotate(3deg);
    }
    100% {
      -o-transform: rotate(-3deg);
    }
  }
  @keyframes bounce {
    0% {
      transform: rotate(0deg);
    }
    50% {
      transform: rotate(3deg);
    }
    100% {
      transform: rotate(-3deg);
    }
  }