body {
    padding: 0;
    margin: 0;
    color: #666;
    font-size: 14px;
    letter-spacing: 0.8px;
    font-family: 'Sailec';
    scroll-behavior: smooth;
    overflow-x: hidden;
}

.d-none {
    display: none !important;
}

.tens {
    display: none;
}

.ht-blog-thumbnail img {
    transition: all 1s ease-in-out 0s;
    -moz-transition: all 1s ease-in-out 0s;
    -webkit-transition: all 1s ease-in-out 0s;
    -o-transition: all 1s ease-in-out 0s;
    width: 100%;
}

.ht-blog-thumbnail:hover img {
    transform: scale(1.2) rotateZ(-5deg);
    -moz-transform: scale(1.2) rotateZ(-5deg);
    -webkit-transform: scale(1.2) rotateZ(-5deg);
    -o-transform: scale(1.2) rotateZ(-5deg);
}

.ht-blog-thumbnail {
    padding: 80px 0px;
}

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

a,
a:hover,
a:focus,
input,
button,
textarea {
    outline: none;
    text-decoration: none !important;
    color: #373737;
    /* text-decoration: underline !important; */
    /* font-size: 14px; */
    /* font-weight: 400; */
}

.logo img {
    width: 136px;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    padding: 0;
    margin: 0;
}

.footer ul.footer-lnks li a {
    font-size: 14px;
    font-weight: 500;
    color: #000;
    padding: 10px 0;
    display: block;
    transition: 0.6s;
}

.footer ul.footer-lnks li a:hover {
    color: #FFCC29
}

h1 {
    color: #222222;
    /* font-size: 100px; */
    font-weight: 700;
    /* line-height: 130px;*/
    letter-spacing: 0.8px;
    /*text-transform: capitalize;*/
    font-family: 'Sailec';
}

h2 {
    color: #222222;
    /* font-size: 35px;

    font-weight: 700; */
    /*line-height: 45px;*/
    /*letter-spacing: 2px;*/
    /*text-transform: capitalize;*/
    font-family: 'Sailec';
}

h3 {
    color: #222222;
    /* font-size: 18px;

    font-weight: 600; */
    line-height: 32px;
    /* text-transform: capitalize; */
    font-family: 'Sailec';
}

h4 {
    color: #222222;
    /* font-size: 15px;

    font-weight: 600; */
    line-height: 30px;
    /* text-transform: capitalize; */
    font-family: 'Sailec';
}

h5 {
    color: #333;
    /* font-size: 15px;

    font-weight: 500; */
    line-height: 30px;
    /* text-transform: capitalize; */
    font-family: 'Sailec';
}

h6 {
    color: #333;
    /* font-size: 15px;

    font-weight: 500; */
    /* line-height: 30px; */
    /* text-transform: capitalize; */
    font-family: 'Sailec';
}

p {
    margin: 0;
    padding: 0;
    color: #666;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.4;
    /*letter-spacing: 0.2px;*/
    font-family: 'Sailec';
}

.img-responsive {
    display: inline-block;
}

.full-width {
    width: 100% !important;
}

::selection {
    color: #FFCC29;
}


/*Sailec fonts*/

@font-face {
    font-family: 'Sailec';
    src: url('../fonts/Sailec-LightItalic.woff2') format('woff2'), url('../fonts/Sailec-LightItalic.woff') format('woff');
    font-weight: 300;
    font-style: italic;
}

@font-face {
    font-family: 'Sailec';
    src: url('../fonts/Sailec-Thin.woff2') format('woff2'), url('../fonts/Sailec-Thin.woff') format('woff');
    font-weight: 100;
    font-style: normal;
}

@font-face {
    font-family: 'Sailec';
    src: url('../fonts/Sailec-Light.woff2') format('woff2'), url('../fonts/Sailec-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'Sailec';
    src: url('../fonts/Sailec.woff2') format('woff2'), url('../fonts/Sailec.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Sailec';
    src: url('../fonts/Sailec-BoldItalic.woff2') format('woff2'), url('../fonts/Sailec-BoldItalic.woff') format('woff');
    font-weight: bold;
    font-style: italic;
}

@font-face {
    font-family: 'Sailec';
    src: url('../fonts/Sailec-ThinItalic.woff2') format('woff2'), url('../fonts/Sailec-ThinItalic.woff') format('woff');
    font-weight: 100;
    font-style: italic;
}

@font-face {
    font-family: 'Sailec';
    src: url('../fonts/Sailec-Medium.woff2') format('woff2'), url('../fonts/Sailec-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'Sailec Hairline';
    src: url('../fonts/SailecHairline-Italic.woff2') format('woff2'), url('../fonts/SailecHairline-Italic.woff') format('woff');
    font-weight: normal;
    font-style: italic;
}

@font-face {
    font-family: 'Sailec';
    src: url('../fonts/Sailec-BlackItalic.woff2') format('woff2'), url('../fonts/Sailec-BlackItalic.woff') format('woff');
    font-weight: 900;
    font-style: italic;
}

@font-face {
    font-family: 'Sailec Regular';
    src: url('../fonts/Sailec-Italic.woff2') format('woff2'), url('../fonts/Sailec-Italic.woff') format('woff');
    font-weight: normal;
    font-style: italic;
}

@font-face {
    font-family: 'Sailec';
    src: url('../fonts/Sailec-MediumItalic.woff2') format('woff2'), url('../fonts/Sailec-MediumItalic.woff') format('woff');
    font-weight: 500;
    font-style: italic;
}

@font-face {
    font-family: 'Sailec Hairline';
    src: url('../fonts/SailecHairline.woff2') format('woff2'), url('../fonts/SailecHairline.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Sailec';
    src: url('../fonts/Sailec-Black.woff2') format('woff2'), url('../fonts/Sailec-Black.woff') format('woff');
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: 'Sailec';
    src: url('../fonts/Sailec-Bold.woff2') format('woff2'), url('../fonts/Sailec-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
}


/*--------------------------------------------------------------------

                        Spacing css

--------------------------------------------------------------------*/

.pt-10 {
    padding-top: 10px;
}

.pt-15 {
    padding-top: 15px;
}

.pt-20 {
    padding-top: 20px;
}

.pt-25 {
    padding-top: 25px;
}

.pt-30 {
    padding-top: 30px;
}

.pt-35 {
    padding-top: 35px;
}

.pt-40 {
    padding-top: 40px;
}

.pt-45 {
    padding-top: 45px;
}

.pt-50 {
    padding-top: 50px;
}

.pt-55 {
    padding-top: 55px;
}

.pt-60 {
    padding-top: 60px;
}

.pt-65 {
    padding-top: 65px;
}

.pt-70 {
    padding-top: 70px;
}

.pt-75 {
    padding-top: 75px;
}

.pt-80 {
    padding-top: 80px;
}

.pt-85 {
    padding-top: 85px;
}

.pt-90 {
    padding-top: 90px;
}

.pt-95 {
    padding-top: 95px;
}

.pt-100 {
    padding-top: 100px;
}

.pb-10 {
    padding-bottom: 10px;
}

.pb-15 {
    padding-bottom: 15px;
}

.pb-20 {
    padding-bottom: 20px;
}

.pb-25 {
    padding-bottom: 25px;
}

.pb-30 {
    padding-bottom: 30px;
}

.pb-35 {
    padding-bottom: 35px;
}

.pb-40 {
    padding-bottom: 40px;
}

.pb-45 {
    padding-bottom: 45px;
}

.pb-50 {
    padding-bottom: 50px;
}

.pb-55 {
    padding-bottom: 55px;
}

.pb-60 {
    padding-bottom: 60px;
}

.pb-65 {
    padding-bottom: 65px;
}

.pb-70 {
    padding-bottom: 70px;
}

.pb-75 {
    padding-bottom: 785px;
}

.pb-80 {
    padding-bottom: 80px;
}

.pb-85 {
    padding-bottom: 85px;
}

.pb-90 {
    padding-bottom: 90px;
}

.pb-95 {
    padding-bottom: 95px;
}

.pb-100 {
    padding-bottom: 100px;
}

.mt-10 {
    margin-top: 10px;
}

.mt-15 {
    margin-top: 15px;
}

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

.mt-25 {
    margin-top: 25px;
}

.mt-30 {
    margin-top: 30px;
}

.mt-35 {
    margin-top: 35px;
}

.mt-40 {
    margin-top: 40px;
}

.mt-45 {
    margin-top: 45px;
}

.mt-50 {
    margin-top: 50px;
}

.mt-55 {
    margin-top: 55px;
}

.mt-60 {
    margin-top: 60px;
}

.mt-65 {
    margin-top: 65px;
}

.mt-70 {
    margin-top: 70px;
}

.mt-75 {
    margin-top: 75px;
}

.mt-80 {
    margin-top: 80px;
}

.mt-85 {
    margin-top: 85px;
}

.mt-90 {
    margin-top: 90px;
}

.mt-95 {
    margin-top: 95px;
}

.mt-100 {
    margin-top: 100px;
}

.mb-10 {
    margin-bottom: 10px;
}

.mb-15 {
    margin-bottom: 15px;
}

.mb-20 {
    margin-bottom: 20px;
}

.mb-25 {
    margin-bottom: 25px;
}

.mb-30 {
    margin-bottom: 30px;
}

.mb-35 {
    margin-bottom: 35px;
}

.mb-40 {
    margin-bottom: 40px;
}

.mb-45 {
    margin-bottom: 45px;
}

.mb-50 {
    margin-bottom: 50px;
}

.mb-55 {
    margin-bottom: 55px;
}

.mb-60 {
    margin-bottom: 60px;
}

.mb-65 {
    margin-bottom: 65px;
}

.mb-70 {
    margin-bottom: 70px;
}

.mb-75 {
    margin-bottom: 75px;
}

.mb-80 {
    margin-bottom: 80px;
}

.mb-85 {
    margin-bottom: 85px;
}

.mb-90 {
    margin-bottom: 90px;
}

.mb-95 {
    margin-bottom: 95px;
}

.mb-100 {
    margin-bottom: 100px;
}

.p-t-90 {
    padding-top: 90px
}

.p-t-140 {
    padding-top: 140px
}

.p-t-141 {
    padding-top: 141px
}

.p-t-142 {
    padding-top: 142px
}

.p-t-143 {
    padding-top: 143px
}

.p-t-144 {
    padding-top: 144px
}

.p-t-145 {
    padding-top: 145px
}

.p-t-146 {
    padding-top: 146px
}

.p-t-147 {
    padding-top: 147px
}

.p-t-148 {
    padding-top: 148px
}

.p-t-149 {
    padding-top: 149px
}

.p-t-150 {
    padding-top: 150px
}

.p-t-180 {
    padding-top: 180px !important;
}


/*--------------------------------------------------------------------

                        background colors

--------------------------------------------------------------------*/

.bg-1 {
    background-color: #FFCC29;
    padding: 15px 0;
}

.bg-2 {
    background-color: #FFCC29;
}

.bg-3 {
    background-color: #fff;
    /*background: url(../images/bg-6.jpg) no-repeat center top;*/
    height: 82vh;
}

.bg-4 {
    background-size: cover;
    background-attachment: fixed;
    background: url(assets/images/bg-8.jpg) no-repeat center top;
}


/*--------------------------------------------------------------------

                        Page Loader

--------------------------------------------------------------------*/

#loader-wrapper {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 9600;
}

.loaded #loader-wrapper {
    visibility: hidden;
    -webkit-transform: translateY(-100%);
    -ms-transform: translateY(-100%);
    transform: translateY(-100%);
    -webkit-transition: all 0.3s 1s ease-out;
    transition: all 0.3s 1s ease-out;
}

#loader {
    display: block;
    position: relative;
    left: 50%;
    top: 50%;
    width: 150px;
    height: 150px;
    margin: -75px 0 0 -75px;
    border-radius: 50%;
    border: 3px solid transparent;
    border-top-color: #3498db;
    -webkit-animation: spin 2s linear infinite;
    animation: spin 2s linear infinite;
    z-index: 1001;
}

.loaded #loader {
    opacity: 0;
    -webkit-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}

#loader:before {
    content: "";
    position: absolute;
    top: 5px;
    left: 5px;
    right: 5px;
    bottom: 5px;
    border-radius: 50%;
    border: 3px solid transparent;
    border-top-color: #e74c3c;
    -webkit-animation: spin 3s linear infinite;
    animation: spin 3s linear infinite;
}

#loader:after {
    content: "";
    position: absolute;
    top: 15px;
    left: 15px;
    right: 15px;
    bottom: 15px;
    border-radius: 50%;
    border: 3px solid transparent;
    border-top-color: #f9c922;
    -webkit-animation: spin 1.5s linear infinite;
    animation: spin 1.5s linear infinite;
}

.loaded #loader-wrapper .loader-section.section-left {
    -webkit-transform: translateX(-100%);
    -ms-transform: translateX(-100%);
    transform: translateX(-100%);
    -webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
    transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
}

.loaded #loader-wrapper .loader-section.section-right {
    -webkit-transform: translateX(100%);
    -ms-transform: translateX(100%);
    transform: translateX(100%);
    -webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
    transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
}

#loader-wrapper .loader-section.section-left {
    left: 0;
}

#loader-wrapper .loader-section.section-right {
    right: 0;
}

#loader-wrapper .loader-section {
    position: fixed;
    top: 0;
    width: 51%;
    height: 100%;
    background: #FFCC29;
    z-index: 1000;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
}

@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
        /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: rotate(0deg);
        /* IE 9 */
        transform: rotate(0deg);
        /* Firefox 16+, IE 10+, Opera */
    }
    100% {
        -webkit-transform: rotate(360deg);
        /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: rotate(360deg);
        /* IE 9 */
        transform: rotate(360deg);
        /* Firefox 16+, IE 10+, Opera */
    }
}

@keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
        /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: rotate(0deg);
        /* IE 9 */
        transform: rotate(0deg);
        /* Firefox 16+, IE 10+, Opera */
    }
    100% {
        -webkit-transform: rotate(360deg);
        /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: rotate(360deg);
        /* IE 9 */
        transform: rotate(360deg);
        /* Firefox 16+, IE 10+, Opera */
    }
}


/*--------------------------------------------------------------------

                        Dot

--------------------------------------------------------------------*/

.loader {
    position: absolute;
    margin-left: -120px;
    display: inline-grid;
}

.loader:nth-child(1) {
    left: 10%;
}

.loader:nth-child(2) {
    left: 10.50%;
}

.loader:nth-child(3) {
    left: 11%;
}

.loader:nth-child(4) {
    left: 11.50%;
}

.loader:nth-child(5) {
    left: 12%;
}

.loader:nth-child(6) {
    left: 12.50%;
}

@-webkit-keyframes blink {
    50% {
        color: #dae8e1;
    }
}

@keyframes blink {
    50% {
        color: #dae8e1;
    }
}

.loader__dot {
    -webkit-animation: 1s blink infinite;
    color: #FFCC29;
    animation: 1s blink infinite
}

.loader__dot:nth-child(2) {
    -webkit-animation-delay: 250ms;
    animation-delay: 250ms
}

.loader__dot:nth-child(3) {
    -webkit-animation-delay: 500ms;
    animation-delay: 500ms
}


/*--------------------------------------------------------------------

                        Chat Box

--------------------------------------------------------------------*/

.wrapper {
    bottom: 1em;
    display: flex;
    flex-direction: column;
    position: absolute;
    right: 1em;
}

.btn {
    all: unset;
    cursor: pointer;
}

.btn--chat {
    align-self: flex-end;
    background: #FFCC29 !important;
    border-radius: 10px !important;
    padding: 0 !important;
    /*box-shadow: 3px 3px 1px rgba(0, 0, 0, 0.15);*/
    color: #fff !important;
    display: block;
    border: none !important;
    font-size: 18px !important;
    margin-top: 0;
    bottom: 0;
    z-index: 2;
    text-align: center;
    transition: .6s;
    height: 3em;
    box-shadow: none !important;
    width: 3em;
    outline: none !important;
    position: fixed;
    right: 5%;
}

.btn--chat:hover {
    background: #222222 !important;
    border: none !important;
}

.btn--chat.show {
    visibility: visible;
    cursor: pointer;
    opacity: 1.0;
    bottom: 80px !important;
}


/*.wrapper .btn--chat .btn.focus, .btn:focus, .btn:hover{ background: #222222 !important; }*/

.chatbox {
    bottom: 1em !important;
    right: 9em !important;
    width: 300px !important;
    height: 300px !important;
    border: 1px solid #222222;
    background-color: #222222 !important;
    border-radius: 0.5em;
    opacity: 0;
    order: -1;
    transition: all 300ms ease;
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    -webkit-transform: scale(0);
    transform: scale(0);
    visibility: hidden;
}

.chatbox__input {
    border-radius: 0.5em;
    border: 0;
    margin: 10px 10px;
    color: #555;
    width: 93%;
    font-size: 16px;
    padding: 15px;
    position: relative;
    resize: none;
}

.chatbox__input:required {
    box-shadow: none;
}

.chatbox__submit {
    background: transparent;
    border: 0;
    bottom: 0;
    padding: 0.5em !important;
    cursor: pointer;
    color: #3e54a4;
    font-size: 16px;
    position: absolute;
    left: 0.5em;
}

.chatbox--is-visible {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
    visibility: visible;
}


/*--------------------------------------------------------------------

                        blank

--------------------------------------------------------------------*/

.blank {
    padding: 500px 0;
}


/*--------------------------------------------------------------------

                        Header

--------------------------------------------------------------------*/

header {
    /*transition: all 500ms cubic-bezier(0.55, 0, 0.1, 1);*/
    margin-bottom: 20px;
    margin-top: 20px;
    position: absolute;
    left: 0;
    right: 0;
    z-index: 999999999;
    -ms-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -webkit-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}

header .main-header {}

header .main-header .container {
    background: #fff;
    padding: 15px;
}

header .topbar {
    position: relative;
}

header .topbar .btn {
    padding: 5px 10px;
    color: #fff;
    border: solid 1px;
    border-color: #fff;
    font-weight: 300;
    font-size: 13px !important;
}

header .topbar .btn:hover {
    background: #fff;
    color: #222222;
}

header .topbar .container {
    background-color: #FFCC29;
    padding: 15px;
}

header .topbar p {
    color: #fff;
    display: inline-flex;
}

header .topbar p a {
    padding: 0 20px;
    color: #fff;
}

header .topbar p a:after {
    content: '';
    position: absolute;
    background-color: #fff;
    height: 25px;
    width: 1px;
    top: -3px;
    margin-left: 21px;
}

header .topbar p a:last-child:after {
    display: none;
}

.navbar-default {
    border: 0px;
    margin: 0;
    background-color: transparent;
}

.navbar-header {
    width: 100%;
}

.navbar-brand {
    padding: 0;
    height: 34px;
    font-size: 14px;
    line-height: 34px;
    text-transform: uppercase;
}

.navbar-brand strong {
    font-weight: 500;
    color: #FFCC29;
}

.navbar-brand>img {
    display: block;
    margin: 0 auto;
    float: left;
    transition: all 500ms cubic-bezier(0.55, 0, 0.1, 1);
}

.navbar-right {
    width: 100%;
    background: #fff;
    margin-right: 0px;
    padding: 0;
}

.navbar-nav {
    float: none;
    margin: 0;
}

.navbar-default .navbar-nav>li {
    /*display: inline-block;

  text-align: center;

  float: none;*/
}

.navbar-default .navbar-nav>li>a {
    color: #111111;
    font-size: 14px;
    padding: 15px 43px;
}

.navbar-default .navbar-nav>li>a.search {
    padding: 15px 0;
    text-align: right;
}

.navbar-default .dropdownhover-left {
    left: -245.5px !important;
}

.navbar-default .form-group label {
    font-size: 14px;
    font-weight: 300;
    text-transform: uppercase;
    color: #fff;
}

.navbar-default .navbar-nav>li>a:after {
    content: "";
    position: absolute;
    height: 2px;
    width: 50px;
    top: 50%;
    left: 50%;
    background-color: #FFCC29;
    transform: translateX(-50%) rotate(-55deg) scaleX(0);
    transition: transform .8s cubic-bezier(.23, 1, .32, 1);
    z-index: 1;
}

.navbar-default .navbar-nav>li:hover a:after {
    transform: translateX(-50%) rotate(-55deg) scaleX(1);
}

.navbar-default .navbar-nav>li.active a:after {
    transform: translateX(-50%) rotate(-55deg) scaleX(1);
}

.navbar-default .navbar-nav>.active>a,
.navbar-default .navbar-nav>.active>a:focus,
.navbar-default .navbar-nav>.active>a:hover {
    background: transparent;
}

.navbar-default .navbar-nav>li>a:hover {
    color: #FFCC29;
}

.navbar-default .social {
    float: right;
    margin-top: 8px;
}

.navbar-default .social>li {
    display: inline-block;
    text-align: center;
    float: none;
    padding-left: 25px;
}

.navbar-default .social>li a {
    color: #fff;
}

.navbar-toggle {
    float: right;
    margin: 0;
    transition: all 500ms cubic-bezier(0.55, 0, 0.1, 1);
    border: none;
    border-radius: 0;
    background-color: #222222;
}

.navbar-default .navbar-toggle:focus,
.navbar-default .navbar-toggle:hover {
    background-color: #FFCC29!important;
}

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

.navbar-default .navbar-nav>.open>a,
.navbar-default .navbar-nav>.open>a:focus,
.navbar-default .navbar-nav>.open>a:hover {
    background: transparent;
    color: #FFCC29;
}

.dropdown-menu {
    top: 4.61em;
    width: 20em;
    padding: 10px;
    border-color: #222222;
    background-color: #222222;
}

.dropdown-menu>li>a {
    transition: .6s;
    line-height: 30px;
    border-bottom: solid 1px #111111;
    color: #fff;
    font-size: 13px;
}

.dropdown-menu>li>a:hover {
    background-color: transparent;
    color: #FFCC29;
}

.dropdown-menu>li>a span.fa {
    position: relative;
    transition: .6s;
    left: -15px;
}

.dropdown-menu>li>a:hover span.fa {
    left: -10px;
    color: #FFCC29;
}

.navbar-right .dropdown-menu {
    left: 0;
}

.navbar-nav>li>.dropdown-menu li {
    position: relative;
}

header.sticky {
    position: fixed;
    width: 100%;
    top: 0;
    margin: 0;
    background: #fff;
    -webkit-box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.22);
    -moz-box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.22);
    box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.22);
}

header.sticky .topbar {
    width: 100%;
    background-color: #FFCC29;
    display: none;
}

header.sticky .main-header {
    width: 100%;
    background-color: #fff;
}


/*header.sticky .navbar-header {

  width: 20%;

  margin-bottom: 0px;

  float: left;

}*/

header.sticky .navbar-brand {
    margin: 0;
    padding: 0;
}


/*header.sticky .navbar-brand img {

  padding-top: 11px;

  width: 130px;

  margin-right: 5px;

}*/

header.sticky .navbar-right {
    background: none;
}


/*header.sticky .navbar-nav {

  float: left;

}*/

header.sticky .social {
    display: none;
}

header.sticky .navbar-toggle {
    float: right;
    margin-top: 0;
}

header.sticky .animated {
    visibility: visible !important;
    -moz-animation: reveal-header 0.5s ease;
    -webkit-animation: reveal-header 0.5s ease;
    -ms-animation: reveal-header 0.5s ease;
    animation: reveal-header 0.5s ease;
}


/*--------------------------------------------------------------------

                        Banner Slider

--------------------------------------------------------------------*/

.slider-banner {
    position: relative;
}

.slider-banner .banner-text {
    /* width: 100%;height: 100%; */
    position: absolute;
    top: 30%;
    z-index: 15;
}

.slider-banner:after {
    content: '';
    position: absolute;
    background: url(../images/img-1.png) no-repeat center top;
    width: 61px;
    left: 0;
    margin: 0 auto;
    right: 0;
    height: 182px;
    z-index: 928;
    bottom: -1px;
}

.banner-text h1 {
    color: #fff;
    font-size: 46px;
    line-height: 65px;
    font-weight: 800;
    text-transform: uppercase;
}

.banner-text h1 span {
    color: #FFCC29;
}

.banner-text h1 strong {
    font-size: 30px;
    line-height: 50px;
    text-transform: capitalize;
}

.banner-text p {
    color: #fff;
    font-weight: 300;
    line-height: 28px;
    font-size: 16px;
}

.demo_img {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
    z-index: 15;
    /*-webkit-box-shadow: 0px 13px 74px -37px rgba(0, 0, 0, 0.75);

    -moz-box-shadow: 0px 13px 74px -37px rgba(0, 0, 0, 0.75);

    box-shadow: 0px 13px 74px -37px rgba(0, 0, 0, 0.75);*/
}

.demo_img img {
    width: 100%;
}


/* 

.demo_img:before {

    position: absolute;

    content: "";

    top: 520px;

    left: 0;

    height: 100%;

    width: 100%;

    border-left: 0px solid transparent;

    border-top: 455px solid transparent;

    border-right: 370px solid rgb(255, 204, 41);

    transition: .3s ease-in-out;

    transform: translateY(100%);

        z-index: 2;

}

.demo_img:hover:before {

    transform: translateY(0)

}

.demo_img:after {

    position: absolute;

    content: "";

    left: 0;

    border: 0px solid transparent;

    border-bottom: 250px solid transparent;

    border-left: 300px solid rgb(255, 204, 41);

    transition: .3s ease-in-out;

    transform: translateY(-100%);

    z-index: 2;

}



.demo_img:hover:after {

    transform: translateY(0)

} */

.main_div {
    position: relative;
    -moz-animation: bodyslideout .3s forwards;
    -o-animation: bodyslideout .3s forwards;
    -webkit-animation: bodyslideout .3s forwards;
    animation: bodyslideout .3s forwards;
    background-color: #fff;
    width: 100%;
}

.site-banner {
    background-color: rgba(25, 28, 28, 0.63);
    display: block;
    height: 100vh;
    max-width: 100%;
    overflow: hidden;
    position: relative;
    width: 100vw;
    z-index: 2;
}

.banner-txt {
    display: block;
    height: 100%;
    position: absolute;
    width: 100%;
    z-index: 999;
    padding-top: 300px;
}

.main_div .overlay {
    background-color: #1d1d29;
    height: 100vh;
    opacity: 0.8;
    position: absolute;
    width: 100%;
    z-index: 9;
}

.site-banner video {
    height: auto;
    left: 50%;
    margin: auto;
    opacity: 1;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    visibility: visible;
    width: 100%;
    z-index: -1;
}

.banner-txt .intro {
    font-size: 3.2rem;
    line-height: 9.375rem;
    font-weight: 200;
    color: #fff;
    text-align: center;
}

.banner-txt .services-txt {
    text-align: center;
    color: #fff;
    text-transform: uppercase;
    font-weight: 200;
}


/*--------------------------------------------------------------------

                        All Button

--------------------------------------------------------------------*/

.btn {
    background: transparent;
    border-color: #FFCC29;
    border: solid 2px;
    font-size: 18px !important;
    font-weight: 500;
    border-radius: 4px;
    color: #FFCC29;
    transition: .6s;
    padding: 15px 30px;
}

.btn:hover {
    background-color: transparent;
    border-color: #FFCC29;
}

.btn-danger.focus,
.btn-danger:focus {
    background: transparent;
}

.btn-danger.active,
.btn-danger:active {
    background: transparent;
}


/* Bounce To Top */

.hvr-bounce-to-top {
    display: inline-block;
    vertical-align: middle;
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    box-shadow: 0 0 1px rgba(0, 0, 0, 0);
    position: relative;
    -webkit-transition-property: color;
    transition-property: color;
    -webkit-transition-duration: 0.9s;
    transition-duration: 0.9s;
}

.hvr-bounce-to-top:before {
    content: "";
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #FFCC29;
    border-color: #FFCC29;
    -webkit-transform: scaleY(0);
    transform: scaleY(0);
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.9s;
    transition-duration: 0.9s;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
}

.hvr-bounce-to-top:hover,
.hvr-bounce-to-top:focus,
.hvr-bounce-to-top:active {
    color: white;
}

.hvr-bounce-to-top:hover:before,
.hvr-bounce-to-top:focus:before,
.hvr-bounce-to-top:active:before {
    -webkit-transform: scaleY(1);
    transform: scaleY(1);
    -webkit-transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);
    transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);
}


/* Shutter In Horizontal */

.hvr-shutter-in-horizontal {
    /*display: block;*/
    vertical-align: middle;
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    /*box-shadow: 0 0 1px rgba(0, 0, 0, 0);*/
    position: relative;
    background: #FFCC29;
    -webkit-transition-property: color;
    transition-property: color;
    -webkit-transition-duration: 0.6s;
    transition-duration: 0.6s;
}

.hvr-shutter-in-horizontal:before {
    content: "";
    position: absolute;
    z-index: -1;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: #212121;
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
    -webkit-transform-origin: 50%;
    transform-origin: 50%;
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.6s;
    transition-duration: 0.6s;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
}

.hvr-shutter-in-horizontal:hover,
.hvr-shutter-in-horizontal:focus,
.hvr-shutter-in-horizontal:active {
    color: white;
}

.hvr-shutter-in-horizontal:hover:before,
.hvr-shutter-in-horizontal:focus:before,
.hvr-shutter-in-horizontal:active:before {
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
}


/*--------------------------------------------------------------------

                        Main Heading

--------------------------------------------------------------------*/

.main-head {
    position: relative;
}

.main-head h2 {
    color: #373435;
    position: relative;
    font-weight: 900;
}

.main-head h3 {
    font-size: 20px;
}

.main-head h2 span {
    color: #FFCC29;
    text-transform: uppercase;
    font-size: 14px;
}


/*--------------------------------------------------------------------

                        our-services

--------------------------------------------------------------------*/

.our-services {
    background-color: #fff;
    padding: 100px 0;
}

.our-services p {
    color: #3c3c3c;
    font-size: 18px;
    font-weight: 400;
}

.our-services .main-head h6 {
    color: #373435;
    position: relative;
    font-size: 73px;
    font-weight: 900;
}

.our-services .main-head h6 span {
    color: #FFCC29;
    text-transform: uppercase;
    font-size: 14px;
}

.our-services .bs-example {
    position: relative;
}

.our-services .bs-example .card h6 {
    font-size: 30px;
    transition: .6s;
    font-weight: 900;
    cursor: pointer;
    padding-left: 15px;
    color: #373435;
}

.our-services .bs-example .card h6:hover {
    color: #FFCC29;
}

.our-services .bs-example .card h6 img {
    width: 60px;
}

.our-services .bs-example .card-body {
    border-radius: 4px;
    background-color: #FFCC29;
    padding: 30px 15px;
}

.our-services .bs-example .card-body p {
    color: #fff;
    font-weight: 400;
    font-size: 14px;
}

.our-services .bs-example .card-body a {
    color: #fff;
}


/*--------------------------------------------------------------------

                        What We Do

--------------------------------------------------------------------*/

.what-we-do {
    /*background-image: url(../images/dots.gif), url(../images/dots.gif); background-repeat: no-repeat, no-repeat; background-position: left top, right bottom;*/
    width: 100%;
    background-color: #212121;
    padding: 100px 0;
    position: relative;
}


/* .what-we-do .main-head h2{color: #dae8e1;} */

.what-we-do .main-head h6 {
    color: #dae8e1;
    position: relative;
    font-size: 73px;
    font-weight: 900;
}

.what-we-do .main-head h6 span {
    color: #FFCC29;
    text-transform: uppercase;
    font-size: 14px;
}

.what-we-do .main-head p {
    color: #dae8e1;
}

.what-we-do .box-we {
    padding: 20px 10px;
    transition: .6s;
}

.what-we-do .box-we h6 {
    color: #FFCC29;
    font-size: 64px;
    font-weight: 700;
}

.what-we-do .box-we:hover h6 {
    color: #fff;
}

.what-we-do .box-we p {
    color: #fff;
    font-weight: 300;
}

.what-we-do .box-we p strong {
    display: block;
}


/*--------------------------------------------------------------------

                        Best Work

--------------------------------------------------------------------*/

.best-work {
    background-color: #fff;
    padding: 100px 0;
    position: relative;
}

.best-work .main-head h6 {
    color: #373435;
    position: relative;
    font-size: 73px;
    font-weight: 900;
}

.best-work .main-head h6 span {
    color: #FFCC29;
    text-transform: uppercase;
    font-size: 14px;
}

.project-block-one {
    position: relative;
}

.project-block-one .inner-box {
    position: relative;
    margin-bottom: 30px;
}

.project-block-one .inner-box .image {
    position: relative;
    overflow: hidden;
}

.project-block-one .inner-box .image:hover img {
    -webkit-transform: scale(1.5);
    transform: scale(1.5);
}

.project-block-one .inner-box .image img {
    position: relative;
    width: 100%;
    display: block;
    -webkit-transition: all 0.7s ease-out 0s;
    transition: all 0.7s ease-out 0s;
}

.project-block-one .inner-box .caption {
    position: absolute;
    left: 20px;
    top: 20px;
    bottom: 20px;
    right: 20px;
    padding: 20px 0px;
    background: rgba(0, 0, 0, 0.0);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    text-align: center;
    -webkit-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
}

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

.project-block-one .icon-box {
    color: #fff;
    font-size: 55px;
    margin-bottom: 30px;
}

.project-block-one h4 {
    font-size: 60px;
    font-weight: 600;
    color: #fff;
    text-align: left;
}

.project-block-one h4 span {
    font-size: 14px;
    margin-bottom: 20px;
    display: inline-block;
    font-weight: 300;
}

.project-block-one h4 .btn {
    border: none;
    padding: 10px 15px;
    font-size: 14px!important;
    font-weight: 400;
    margin-top: 17px;
    display: block;
}

.project-block-one h4 a {
    color: #fff;
}

.project-block-one .inner-box .overlay-box {
    position: absolute;
    content: '';
    left: 20px;
    top: 20px;
    right: 20px;
    bottom: 20px;
    display: block;
    opacity: 0;
    -webkit-transform: perspective(400px) rotateX(-90deg);
    -ms-transform: perspective(400px) rotateX(-90deg);
    transform: perspective(800px) rotateX(-90deg);
    -webkit-transform-origin: left;
    -ms-transform-origin: left;
    transform-origin: left;
    -webkit-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
    background-color: rgba(255, 204, 41, 0.8);
}

.project-block-one .inner-box:hover .overlay-box {
    opacity: 1;
    -webkit-transform: perspective(800px) rotateX(0deg);
    -ms-transform: perspective(800px) rotateX(0deg);
    transform: perspective(800px) rotateX(0deg);
}

.project-block-one .inner-box .overlay-box .overlay-inner {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 70%;
    display: table;
    padding: 15px 20px;
    vertical-align: bottom;
}

.project-block-one .inner-box .overlay-box .overlay-inner .content {
    position: relative;
    display: table-cell;
    vertical-align: bottom;
}

.project-block-one .inner-box .overlay-box h2 {
    position: relative;
    color: #ffffff;
    font-size: 18px;
    font-weight: 600;
    text-align: center;
    margin-bottom: 18px;
}

.project-block-one .inner-box .overlay-box h2 a {
    position: relative;
    color: #ffffff;
    transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
}

.project-block-one .inner-box .overlay-box h2 a:hover {
    color: #17b6e6;
}

.project-block-one .inner-box .overlay-box .text {
    position: relative;
    color: #ffffff;
    font-size: 16px;
    line-height: 1.9em;
    margin-bottom: 20px;
}

.project-block-one .inner-box .overlay-box .read-more {
    position: relative;
    background: #fff;
    color: #222;
    font-weight: 600;
    padding: 11px 18px;
    letter-spacing: 1px;
    font-size: 13px;
    text-transform: uppercase;
    transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    font-family: 'Montserrat', sans-serif;
}

.project-block-one .inner-box .overlay-box .read-more:hover {
    color: #da1926;
}


/*--------------------------------------------------------------------

                        Plan

--------------------------------------------------------------------*/

.plan {
    background-color: #efefef;
    padding: 100px 0;
    position: relative;
}

.plan ul li {
    background: url(../images/img-4.jpg) no-repeat left center;
}

.plan ul li a {
    transition: .6s;
    padding-left: 30px;
    position: relative;
    left: 0;
    color: #373435;
    font-weight: bold;
    line-height: 30px;
    font-size: 16px;
}

.plan ul li a:hover {
    color: #FFCC29;
    left: 15px;
}

.plan .main-head h6 {
    color: #373435;
    position: relative;
    font-size: 73px;
    font-weight: 900;
}

.plan .main-head h6 span {
    color: #FFCC29;
    text-transform: uppercase;
    font-size: 14px;
}

.plan .main-head h6 span.mini {
    right: 98px;
    position: absolute;
    bottom: -40px;
    color: #FFCC29;
    text-transform: uppercase;
    font-size: 14px;
}


/*--------------------------------------------------------------------

                        waiting

--------------------------------------------------------------------*/

.waiting {
    background-color: #efefef;
    padding: 100px 0;
    background: url(../images/bg-1.jpg) no-repeat center top;
    position: relative;
    background-attachment: fixed;
    background-size: cover;
}

.waiting .main-head h6 {
    font-size: 35px;
    color: #fff;
    font-weight: bold;
    position: relative;
}

.waiting .main-head p {
    font-weight: 400;
    font-size: 18px;
    color: #fff;
}

.waiting h5 {
    color: #fff;
    font-size: 44px;
    font-weight: 500;
    margin-bottom: 10px;
}

.waiting i {
    display: block;
}

.waiting p {
    color: #fff;
    font-size: 14px;
    font-weight: bold;
}


/*--------------------------------------------------------------------

                        Testimonials

--------------------------------------------------------------------*/

.testimonials {
    background-color: #fff;
    padding: 100px 0;
    position: relative;
}

.testimonials .main-head h6 {
    font-size: 28px;
    font-weight: 700;
    color: #FFCC29;
}

.testimonials .carousel-info img {
    border: 1px solid #f5f5f5;
    border-radius: 150px !important;
    height: 75px;
    padding: 0px;
    width: 75px;
    transition: .6s;
    border: solid 4px;
    border-color: transparent;
}

.testimonials blockquote {
    border: none;
    transition: .6s;
}

.testimonials blockquote p {
    font-size: 30px;
    position: relative;
    font-weight: bold;
    color: #373435;
}


/*.testimonials blockquote p:before{

  color: #373435;

  content: "\201C";

  font-size: 52px;

  position: absolute;

  top: -12px;

  left: 5%;

}

.testimonials blockquote p:after{

  color: #373435;

  content: "\201C";

  font-size: 52px;

  position: absolute;

  bottom: -32px;

  right: 10%;

}*/

.testimonials .carousel-info {
    overflow: hidden;
    margin-top: 30px;
}

.testimonials .carousel-info img {
    margin-right: 15px;
}

.testimonials .carousel-info span {
    display: block;
}

.testimonials span.testimonials-name {
    color: #373435;
    font-size: 13px;
    font-weight: 500;
    margin: 23px 0 7px;
    transition: .6s;
}

.testimonials span.testimonials-name:hover {
    color: #FFCC29;
}

.testimonials span.testimonials-post {
    color: #656565;
    font-size: 14px;
}

.testimonials blockquote:hover span.testimonials-name {
    color: #FFCC29;
}

.testimonials blockquote:hover img {
    border-color: #FFCC29;
}

.testimonials .carousel-indicators {
    bottom: 0;
}

.carousel-indicators .active {
    width: 30px;
    background-color: #FFCC29;
    height: 4px;
}

.carousel-indicators li {
    height: 4px;
    background-color: #d2d2d2;
    width: 30px;
}


/*--------------------------------------------------------------------

                        advertisement

--------------------------------------------------------------------*/

.advertisement {
    background: url(../images/bg-2.jpg) no-repeat center top;
    padding: 100px 0;
    background-size: cover;
    background-attachment: fixed;
    position: relative;
}

.advertisement h6 {
    color: #fff;
    font-size: 60px;
    line-height: normal;
}

.advertisement h6 span {
    font-size: 18px;
    font-weight: 400;
}

.advertisement h6 strong {
    color: #FFCC29;
}


/*--------------------------------------------------------------------

                        brand

--------------------------------------------------------------------*/

.brand {
    background-color: #fff;
    padding: 50px 0;
    position: relative;
}

.brand p {
    font-size: 14px;
    color: #000;
    font-weight: bold;
    text-transform: uppercase;
}

.brand .brand-flex {
    display: inline-flex;
    padding: 0 20px;
    margin: 20px 0;
}

.brand .brand-flex img.grayscale {
    /* filter: gray; */
    /* IE6-9 */
    /* -webkit-filter: grayscale(100%); */
    position: relative;
    bottom: 0;
    /* Chrome 19+ & Safari 6+ */
    -webkit-transition: all .6s ease;
    /* Fade to color for Chrome and Safari */
    -webkit-backface-visibility: hidden;
}

.brand .brand-flex img.grayscale:hover {
    filter: none;
    bottom: 5px;
    /* -webkit-filter: grayscale(0%); */
}


/*--------------------------------------------------------------------

                        contact

--------------------------------------------------------------------*/

.contact {
    background: #FFCC29 url(../images/bg-3.jpg) no-repeat center top;
    padding: 80px 0;
    position: relative;
}

.contact .main-head h6 {
    color: #fff;
    font-size: 65px;
    font-weight: 700;
}

.contact .main-head p {
    color: #fff;
    font-weight: 400;
    font-size: 20px;
}

.contact .form-inline {
    display: flex;
}

.contact .form-inline .form-group {
    width: 50%;
    margin-right: 10px;
}

.contact .form-inline .form-group:last-child {
    margin-right: 0;
}

.contact .form-inline .form-group .form-control {
    width: 100%;
}

.contact .form-group .form-control {
    background: transparent;
    position: relative;
    font-size: 16px;
    color: #fff;
    border: none;
    border-radius: 0;
    border-bottom: solid 1px #fff;
    box-shadow: none;
    outline: none;
    padding: 20px 15px;
}

.contact ::-webkit-input-placeholder {
    /* Edge */
    color: #fff;
}

.contact .form-group .form-control:focus {
    position: relative;
    background-color: #fff;
    color: #393939;
    border-radius: 5px;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-transition: color 1000ms;
    transition: color 1000ms;
}

.contact .form-group .form-control:before {
    -webkit-transform: scaleY(0);
    transform: scaleY(0);
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition: 300ms ease-out;
    transition: 300ms ease-out;
}

.contact .form-group textarea.form-control {
    padding: 10px;
}

.contact .form-group textarea {
    resize: vertical;
}

.contact form .btn {
    background-color: #373435;
    transition: all .6s;
    color: #fff;
    border: none;
    margin-top: 15px;
    margin-bottom: 30px;
    padding: 10px 20px;
}

.contact form .btn:hover {
    background-color: transparent;
    color: #fff;
}


/*--------------------------------------------------------------------

                        footer

--------------------------------------------------------------------*/

.footer {
    background-color: #fff;
    padding: 50px 0 0;
}

.footer h6 {
    font-weight: bold;
    font-size: 18px;
    margin-bottom: 20px;
    color: #373435;
}

.footer p {
    font-weight: 500;
    line-height: 30px;
    font-size: 14px;
    color: #373435;
}

.footer p a {
    color: #454545;
    transition: .6s;
    font-weight: 500;
}

.footer p a:hover {
    color: #FFCC29;
}

.coppyright {
    border-top: solid 1px #cbcbcb;
    padding: 30px 0;
}

.follow-me {
    z-index: 9;
    margin-right: 0;
    position: relative;
    display: inline-flex;
}

.follow-me h4 {
    font-weight: bold;
    color: #454545;
    font-size: 13px;
    margin-right: 48px;
    position: relative;
    left: 0;
}

.follow-me h4:after {
    content: '';
    right: -40px;
    top: 14px;
    position: absolute;
    background-color: #454545;
    height: 2px;
    width: 30px;
}

.follow-me a span {
    color: #454545;
    height: 32px;
    width: 32px;
    font-size: 16px;
    transition: .6s;
    line-height: 32px;
    text-align: center;
    -webkit-border-radius: 50%;
    border-radius: 50%;
}

.follow-me a:hover span {
    color: #fff;
    background: #FFCC29;
}

.overlay {
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    position: absolute;
    background: rgba(0, 0, 0, 0.6);
}


/*--------------------------------------------------------------------

                        Go To Top Button

--------------------------------------------------------------------*/

.scroll-top-wrapper {
    position: fixed;
    opacity: 0;
    visibility: hidden;
    overflow: hidden;
    text-align: center;
    z-index: 99999999;
    background-color: #222222;
    color: #eeeeee;
    width: 38px;
    height: 38px;
    line-height: 38px;
    right: 30px;
    bottom: -40px;
    border-top-left-radius: 50px;
    border-top-right-radius: 50px;
    border-bottom-right-radius: 50px;
    border-bottom-left-radius: 50px;
    -webkit-transition: all 0.9s ease-in-out;
    -moz-transition: all 0.9s ease-in-out;
    -ms-transition: all 0.9s ease-in-out;
    -o-transition: all 0.9s ease-in-out;
    transition: all 0.9s ease-in-out;
}

.scroll-top-wrapper:hover {
    background-color: #FFCC29;
}

.scroll-top-wrapper.show {
    visibility: visible;
    cursor: pointer;
    opacity: 1.0;
    bottom: 40px !important;
}

.scroll-top-wrapper i.fa {
    line-height: inherit;
    font-size: 20px;
}

.page {
    position: relative;
    background: url(../images/bg-5.jpg) no-repeat center top;
}

.page header {
    margin: 0;
}

.page .topbar {
    background-color: #FFCC29;
}

.page .main-header {
    background-color: #fff;
}


/*--------------------------------------------------------------------

                        about page

--------------------------------------------------------------------*/

.about-page {
    padding: 100px 0 80px 0;
}

.about-page .main-head h1 {
    font-size: 40px;
}

.about-page .main-head h2 {
    font-size: 22px;
    font-weight: 600;
}

.about-page .main-head h3 {
    font-size: 18px;
    line-height: 40px !important;
}

.about-page .main-head p a {
    color: #373435;
    font-weight: bold;
}

.about-page .main-head h2 strong.text-dander {
    font-weight: bolder !important;
    color: #FFCC29;
}

.about-page .main-head h2 span {
    font-weight: 400;
}

.about-page .main-head ul li strong {
    color: #373435;
    margin-right: 15px;
    font-weight: 900;
}

.about-page .main-head ul li strong:before {
    position: absolute;
    content: '|';
    left: 20px;
}


/*



body {

  display: flex;

  align-items: center;

  justify-content: center;

  height: 100vh;

  background: #111;

}*/

.image {
    --width: 100%;
    --height: 100%;
    position: relative;
    width: var(--width);
    height: var(--height);
    overflow: hidden;
}

.image__img {
    position: absolute;
    height: 100%;
    background: url(../images/bg-6.jpg);
    background-size: var(--width) var(--height);
}

.image__img:first-child {
    left: 0;
    width: 100%;
    background-position: center left;
}

.image__img:last-child {
    right: 0;
    background: rgba(0, 0, 0, 0.7);
    width: calc(100% - var(--x, 50%));
    background-position: center right;
    /*-webkit-filter: grayscale(100%);

          filter: grayscale(100%);*/
    box-shadow: inset 2px 0 0 #FFCC29, -2px 0 0 #FFCC29;
}


/*--------------------------------------------------------------------

                        about-detail page

--------------------------------------------------------------------*/

.about-detail h6 {
    color: #373435;
    font-size: 30px;
    position: relative;
    transition: .6s;
    font-weight: 900;
}

.about-detail h6:hover {
    color: #FFCC29;
}

.about-detail h6:hover:after {
    width: 15%;
}

.about-detail h6:after {
    content: '';
    position: absolute;
    height: 2px;
    transition: .6s;
    background-color: #FFCC29;
    width: 10%;
    bottom: 0;
    margin-left: 20px;
}

.about-detail p {
    color: #373435;
    font-size: 18px;
    line-height: 30px;
    font-weight: 400;
}

.abouthelp {
    padding: 100px 0;
    background-color: #fff;
}

.abouthelp .main-head h6 {
    font-size: 70px;
    color: #373435;
    position: relative;
    font-weight: 900;
}

.next {
    background: #FFCC29 url(../images/bg-3.jpg) no-repeat center top;
    padding: 100px 0;
    position: relative;
}

.next .main-head h6 {
    color: #ffff;
    position: relative;
    font-size: 73px;
    font-weight: 900;
}

.next .main-head p {
    color: #fff;
    font-weight: bold;
    font-size: 22px;
}

.next .btn {
    border-color: #fff;
    color: #fff;
    font-weight: 400;
}


/*--------------------------------------------------------------------

                        OUR Work page

--------------------------------------------------------------------*/

.our-work {
    padding: 150px 0 196px;
    background-color: #fff;
}

.project-row {
    position: relative;
}

.project-row .table-box {
    margin: auto;
    position: relative;
    width: 60%;
    display: table-cell;
    vertical-align: middle;
    height: 35vw;
    padding-left: 30%;
}

.project-row .table-box h2 {
    font-weight: bold;
    font-size: 60px;
    color: #373435;
}

.project-row .table-box h2 span {
    color: #373435;
    font-size: 14px;
    font-weight: 400;
}

.project-row .table-box .btn {
    border: none;
    background-color: transparent;
    color: #373435;
    font-weight: bold;
    font-size: 14px !important;
}

.project-row .table-box .btn:hover {
    color: #FFCC29;
}

.project-row .row:nth-child(2) :after {
    background: url(../images/img-3.jpg) no-repeat center top;
}

.project-row .btn {
    border: none;
    color: #000;
    text-decoration: underline !important;
}

.hover-scale-item {
    position: relative;
}

.item-media {
    overflow: hidden;
}

.item-media::after {
    content: '';
    width: 130px;
    position: absolute;
    background: url(../images/img-2.jpg) no-repeat center top;
    height: 2px;
    left: -60px;
    bottom: 0;
    top: 50%;
}


/* .hover-scale-item .item-media:nth-child(1).item-media::after{ background: none;} */


/* .hover-scale-item .item-media:nth-child(2):after{  background: url(../images/img-2.jpg) no-repeat center top;}
.hover-scale-item .item-media:nth-child(3):after{  background: url(../images/img-3.jpg) no-repeat center top;} */

.item-media img {
    -webkit-transition: all 0.7s ease-out 0s;
    transition: all 0.7s ease-out 0s;
}

.hover-scale-item:hover .media-links:before {
    opacity: 0;
}

.item-media:hover img {
    -webkit-transform: scale(1.5);
    transform: scale(1.5);
}


/*--------------------------------------------------------------------

                        contact-us page

--------------------------------------------------------------------*/

.contact {
    padding: 100px 0 100px;
    background-color: #fff;
}

.image-contact {
    --width: 100%;
    --height: 100%;
    position: relative;
    width: var(--width);
    height: var(--height);
    overflow: hidden;
}

.image__img-contact {
    position: absolute;
    height: 100%;
    background: url(../images/bg-7.jpg);
    background-size: var(--width) var(--height);
}

.image__img-contact:first-child {
    left: 0;
    width: 100%;
    background-position: center left;
}

.image__img-contact:last-child {
    right: 0;
    background: rgba(0, 0, 0, 0.7);
    width: calc(100% - var(--x, 50%));
    background-position: center right;
    /*-webkit-filter: grayscale(100%);

          filter: grayscale(100%);*/
    box-shadow: inset 2px 0 0 #FFCC29, -2px 0 0 #FFCC29;
}

.contact-form {
    position: relative;
}

.contact-form .main-head h2 {
    font-size: 60px;
}

.contact-form .contact {
    padding: 50px 0 50px;
    background: #fff;
}

.contact-form .contact .form-group .form-control {
    border-color: #7c7c7c;
    color: #7c7c7c;
}

.contact-form ::-webkit-input-placeholder {
    /* Edge */
    color: #7c7c7c;
}

.contact-form .contact form .btn {
    background-color: transparent;
    border: 2px solid #FFCC29;
    color: #222222;
}

.contact-form .contact-head .main-head h2 {
    font-size: 22px;
    color: #373435;
}

.contact-form .contact-head .main-head p {
    color: #373435;
    font-size: 14px;
    font-weight: 300;
}


/*--------------------------------------------------------------------

                        services page

--------------------------------------------------------------------*/

.services-wrap {
    position: relative;
    padding-bottom: 150px;
}

.services-wrap .main-head h2 {
    font-size: 40px;
}

.services-wrap .col-md-6 {
    padding: 0;
}

.services-wrap .services-box {
    transition: .6s;
    position: relative;
    background: #f6f6f6;
    padding: 30px 30px 50px 30px;
    border-radius: 5px;
    -webkit-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.26);
    -moz-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.26);
    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.26);
}

.services-wrap .services-box img {
    max-height: 67px;
}

.services-wrap .services-box:hover {
    background: #FFCC29;
}

.services-wrap .services-box h2 {
    text-align: left;
    color: #373435;
    font-weight: bold;
    font-size: 30px;
}

.services-wrap .services-box h3 {
    text-align: left;
    color: #373435;
    font-weight: bold;
    font-size: 30px;
}

.services-wrap .services-box p {
    color: #373435;
    line-height: 30px;
    font-size: 18px;
    font-weight: 400;
}

.services-wrap .services-box .btn {
    border: none;
    color: #FFCC29;
    padding: 5px 15px;
    font-weight: 400 !important;
    font-size: 14px !important;
}

.services-wrap .services-box:hover h2 {
    color: #fff;
}

.services-wrap .services-box:hover h3 {
    color: #fff;
}

.services-wrap .services-box:hover p {
    color: #fff;
}

.services-wrap .services-box:hover .btn {
    color: #fff;
}

.services-wrap .imgg-9-1 {
    opacity: 0;
    position: absolute;
    left: 30px;
}

.services-wrap .services-box:hover .imgg-9-1 {
    opacity: 1
}

.services-wrap .services-box:hover .imgg-9-0 {
    opacity: 0
}


/*--------------------------------------------------------------------

                        detail-page

--------------------------------------------------------------------*/

.detail-page {
    position: relative;
    padding: 150px 0;
}

.detail-page .container {
    display: table;
}

.p-01 {
    background: url(../images/banner-01.jpg) no-repeat center top;
}

.p-02 {
    background: url(../images/banner-02.jpg) no-repeat center top;
}

.p-03 {
    background: url(../images/banner-03.jpg) no-repeat center top;
}

.p-04 {
    background: url(../images/banner-04.jpg) no-repeat center top;
}

.p-05 {
    background: url(../images/banner-05.jpg) no-repeat center top;
}

.p-06 {
    background: url(../images/banner-06.jpg) no-repeat center top;
}

.two h2 {
    color: #fff !important;
}

.two h2 span:before {
    background: #fff !important;
}

.two .btn {
    color: #fff !important;
}


/* ===================*/

.line-trought {
    text-decoration: underline !important;
}


/* =============== */

.anchersize14 {
    font-weight: 500;
    font-size: 14px;
    color: #373435;
    position: relative;
}

.anchersize16 {
    font-weight: 500;
    font-size: 16px;
    color: #373435;
    position: relative;
}

.anchersize18 {
    font-weight: 500;
    font-size: 18px;
    color: #373435;
    position: relative;
}

.anchersize20 {
    font-weight: 500;
    font-size: 20px;
    color: #373435;
    position: relative;
}

.anchersize22 {
    font-weight: 500;
    font-size: 22px;
    color: #373435;
    position: relative;
}

.anchersize26 {
    font-weight: 500;
    font-size: 26px;
    color: #373435;
    position: relative;
}

.anchersize28 {
    font-weight: 500;
    font-size: 28px;
    color: #373435;
    position: relative;
}

.detail-page h2 {
    color: #373435;
    font-weight: 900;
    font-size: 70px;
}

.detail-page h2 span {
    font-weight: 500;
    position: relative;
    padding-left: 60px;
    font-size: 16px;
}

.detail-page h2 span:before {
    content: '';
    background: #373435;
    top: 0;
    color: #373435;
    position: absolute;
    width: 17%;
    height: 2px;
    top: 8px;
    left: 0;
}

.detail-page .btn {
    padding: 5px 15px;
    border: none;
    font-size: 14px !important;
    font-weight: 400!important;
    color: #373435;
}

.content-detail {
    position: relative;
}

.content-detail p {
    font-weight: 500;
    font-size: 26px;
    color: #373435;
    position: relative;
}

.content-detail .link h3 {
    color: #FFCC29;
    font-size: 15px;
    font-weight: bold;
}

.content-detail .link li a {
    line-height: 30px;
    transition: 0.6s;
    display: block;
    position: relative;
    padding: 10px 35px;
    color: #373435;
    font-size: 16px;
}

.content-detail .link li a:hover {
    color: #FFCC29;
}

.content-detail .link li a:before {
    position: absolute;
    content: '';
    top: 24px;
    left: -10px;
    height: 2px;
    width: 9%;
    background: #373435;
}

.projects-slide h2 {
    color: #373435;
    font-weight: 900;
    font-size: 70px;
}

.projects-slide h2 span {
    font-weight: 500;
    position: relative;
    padding-left: 28px;
    font-size: 16px;
}

.projects-slide h2 span:before {
    content: '';
    background: #373435;
    top: 0;
    color: #373435;
    position: absolute;
    width: 17%;
    height: 2px;
    top: 8px;
    left: 0;
}

.portfolio-row {
    background: #e2e4e8;
}

.portfolio {
    display: -ms-flexbox;
    /* IE10 */
    display: flex;
    -ms-flex-wrap: wrap;
    /* IE10 */
    flex-wrap: wrap;
}

.portfolio span {
    -ms-flex: 25%;
    /* IE10 */
    flex: 25%;
    max-width: 50%;
    padding: 0 30px;
}

.portfolio span img {
    margin-top: 8px;
    vertical-align: middle;
    width: 100%;
    /*-webkit-box-shadow: 0px 0px 18px 0px rgba(0,0,0,0.16);

-moz-box-shadow: 0px 0px 18px 0px rgba(0,0,0,0.16);

box-shadow: 0px 0px 18px 0px rgba(0,0,0,0.16);*/
}

.w-25 {
    max-width: 25% !important;
}

.container-fluid {
    padding: 0;
}

.myCarousell {
    position: relative;
}

.myCarousell .full-width {
    width: 100% !important;
    display: block;
}

.myCarousell .slick-dots {
    display: none !important;
}

.myCarousell .last-child {
    padding-right: 30px;
}

.myCarousell .slick-next {
    width: 74px;
    height: 40px;
    display: block;
    background: #373435;
    color: #fff;
    bottom: -85px;
    left: 94px;
    transition: .6s;
}

.myCarousell .slick-next:hover {
    background: #FFCC29;
}

.myCarousell .slick-prev:hover {
    background: #FFCC29;
}

.myCarousell .slick-prev {
    width: 74px;
    transition: .6s;
    height: 40px;
    display: block;
    background: #373435;
    color: #fff;
    bottom: -85px;
    left: 0;
}

.myCarousell .slick-prev:before {
    color: #fff;
    content: '←';
    font-size: 24px;
}

.myCarousell .slick-next:before {
    color: #fff;
    content: '→';
    font-size: 24px;
}

.slick-prev,
.slick-next {
    margin-left: 2%;
}

.related {
    position: relative;
}

.related .main-head h2 {
    font-size: 70px;
}

.related h3 {
    font-size: 22px;
    font-weight: 800;
    text-transform: uppercase;
}

.appwrapper1 {
    margin: 0 auto;
    width: 240px;
    padding-top: 17px;
    padding-bottom: 57px;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    background: url("../images/iphonebig.png") no-repeat;
}

.appwrapper {
    width: 204px;
    height: 442px;
    margin: 0 auto;
    overflow: hidden;
    border-radius: 15px 15px 15px 15px;
}

.appwrapperinner {
    position: relative;
    height: 100%;
    width: 100%;
    overflow: hidden;
}

.appwrapperinner img {
    position: absolute;
    width: 100%;
}


/*--------------------------------------------------------------------

                        image-effect

--------------------------------------------------------------------*/

.single-blog-post .img-box {
    position: relative;
}

.single-blog-post .img-box .overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    /*width: 36.65em;*/
    background: rgba(255, 185, 1, 0.75);
    transform: scale(0);
    transition: all .5s ease;
}

.single-blog-post:hover .img-box .overlay {
    transform: scale(1);
}

.single-blog-post .img-box .overlay .box {
    display: table;
    width: 100%;
    height: 100%;
}

.single-blog-post .img-box .overlay .box .content {
    display: table-cell;
    vertical-align: middle;
}

.single-blog-post .img-box .overlay .box .content ul {
    text-align: center;
    margin: 0;
    padding: 0;
}

.single-blog-post .img-box .overlay .box .content ul li {
    display: inline-block;
    list-style: none;
}

.single-blog-post .img-box .overlay .box .content ul li a {
    display: inline-block;
    width: 40px;
    height: 40px;
    margin-right: 8px;
    background: #fff;
    color: #f14b05;
    border: 1px solid #fff;
    line-height: 38px;
    font-size: 18px;
    border-radius: 50%;
    transition: all .3s ease;
}

.single-blog-post .img-box .overlay .box .content ul li a:hover {
    background: #222222;
    border-color: #fff;
    color: #fff;
}

.ebayiconsbox {
    font-size: 15px;
    color: #232323;
    text-align: center;
    font-family: 'Raleway-Medium';
}

.packages .main-head h2 {
    font-size: 50px;
}

.basicpkg {
    border: solid 1px #0d0d0d;
}

.advancepkg {
    border: solid 1px #FFCC29;
}

.advancepkg .pkgheading {
    background-color: #FFCC29;
}

.pkgheading {
    text-align: center;
    font-size: 32px;
    font-weight: bold;
    color: #fff;
    background-color: #000;
    padding: 17px 0 16px 0;
    line-height: normal;
    text-transform: uppercase;
    position: relative;
}

.whatinclude {
    font-size: 18px;
    color: #0d0d0d;
    font-weight: 500;
    padding: 20px 0 10px 25px;
}

.pkglist {
    margin: 0;
    padding: 0;
    list-style: none;
}

.pkglist li {
    font-size: 15px;
    color: #0d0d0d;
    line-height: 20px;
    padding: 12px 0 12px 25px;
    display: inline-block;
    width: 100%;
}

.pkglist li:nth-child(odd) {
    background: #f6f6f6;
}

.pkglist li span {
    margin-right: 15px;
    font-size: 16px;
    color: #FFCC29;
    transition: 0.5s all ease;
}

.pkglist li:hover span {
    transform: rotate(360deg);
}

.ththmenu {
    display: none;
    background-color: #fff;
    padding: 10px;
    border-radius: 8px;
}

ul.ththmenu li a {
    color: #373435;
    display: block;
    transition: .6s;
    position: relative;
    padding: 8px;
    border-bottom: solid 1px #373435;
}

ul.ththmenu li a:hover {
    color: #FFCC29;
}

.toggle-span {
    position: absolute;
    right: 0;
    top: 0;
    width: 35px;
    height: 30px;
    line-height: 33px;
    display: block;
    text-align: center;
    padding-left: 0px;
    border-left: 1px rgb(58, 57, 57) solid;
}

.toggle-span a.toggmnu {
    color: #fff;
}

.toggle-span em.toggmnu {
    color: #fff;
    cursor: pointer;
}

.page-loaded .loading {
    height: 0
}

.page-loaded .loading:after,
.page-loaded .loading:before {
    opacity: 0
}

.page-loaded .loading span {
    opacity: 0;
    visibility: hidden;
    -webkit-animation: none;
    animation: none
}

.leaving .loading {
    height: 100%!important
}

.loading {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 999999999999;
    background-color: #FFCC29;
    letter-spacing: 1px;
    -webkit-transition: height 1.5s cubic-bezier(.645, .045, .355, 1);
    transition: height 1.5s cubic-bezier(.645, .045, .355, 1)
}

.loading img,
.loading span {
    position: absolute;
    display: block
}

.loading.loading--hide {
    height: 0
}

.loading.loading--hide img {
    height: 0;
    -webkit-transform: translateY(-100%);
    transform: translateY(-100%)
}

.loading span {
    padding: 0 20px;
    top: calc(50% + 60px);
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    color: #fff;
    -webkit-animation: blinker 1s linear infinite;
    animation: blinker 1s linear infinite;
    -webkit-transition: all .3s ease;
    transition: all .3s ease
}

.loading img {
    width: 100%;
    height: 100%;
    top: calc(100% - 5px);
    left: 0;
    -webkit-transition: height .3s ease;
    transition: height .3s ease
}

.main-head p img {
    max-width: 100% !important;
    height: auto !important;
}

.ppgbanner img {
    max-width: 100% !important;
    height: auto !important;
}


/*--------------------------------------------------------------------
                        What We Do-two
--------------------------------------------------------------------*/

.what-we-do-two {
    /*background-image: url(../images/dots.gif), url(../images/dots.gif); background-repeat: no-repeat, no-repeat; background-position: left top, right bottom;*/
    width: 100%;
    background-color: #fff;
    padding: 80px 0 0;
    position: relative;
}

.what-we-do-two .main-head h1 {
    color: #373435;
    position: relative;
    font-size: 32px;
    margin-bottom: 20px;
    font-weight: 900;
    line-height: 1.1;
}

.what-we-do-two .main-head p {
    color: #141717;
}

.what-we-do-two .box-we {
    padding: 20px 0px;
    transition: .6s;
}

.what-we-do-two .box-we h1 {
    color: #141717;
    font-size: 64px;
}

.what-we-do-two .box-we p {
    color: #141717;
    font-weight: 400;
    margin-bottom: 10px;
}

.what-we-do-two .box-we h2 {
    font-size: 22px;
    line-height: 30px;
    margin-bottom: 20px;
    font-weight: 800;
}


/*--------------------------------------------------------------------
                        dots
--------------------------------------------------------------------*/

#contact::before {
    background-image: url(../images/dots-3.png);
    content: '';
    position: absolute;
    width: 150px;
    height: 280px;
    top: 50px;
    left: 180px;
    -webkit-animation: up-down 3s infinite;
    -moz-animation: up-down 3s infinite;
    -o-animation: up-down 3s infinite;
    animation: up-down 3s infinite;
}

#contact::after {
    background-image: url(../images/dots-3.png);
    content: '';
    position: absolute;
    width: 150px;
    height: 280px;
    bottom: 50px;
    right: 180px;
    -webkit-animation: up-down 3s infinite;
    -moz-animation: up-down 3s infinite;
    -o-animation: up-down 3s infinite;
    animation: up-down 3s infinite;
}

.advertisement::before {
    background-image: url(../images/dots-3.png);
    content: '';
    position: absolute;
    width: 150px;
    height: 280px;
    top: 50px;
    left: 180px;
    -webkit-animation: up-down 3s infinite;
    -moz-animation: up-down 3s infinite;
    -o-animation: up-down 3s infinite;
    animation: up-down 3s infinite;
}

.advertisement::after {
    background-image: url(../images/dots-3.png);
    content: '';
    position: absolute;
    width: 150px;
    height: 280px;
    bottom: 50px;
    right: 180px;
    -webkit-animation: up-down 3s infinite;
    -moz-animation: up-down 3s infinite;
    -o-animation: up-down 3s infinite;
    animation: up-down 3s infinite;
}

.waiting::before {
    background-image: url(../images/dots-3.png);
    content: '';
    position: absolute;
    width: 150px;
    height: 280px;
    top: 50px;
    left: 180px;
    -webkit-animation: up-down 3s infinite;
    -moz-animation: up-down 3s infinite;
    -o-animation: up-down 3s infinite;
    animation: up-down 3s infinite;
}

.waiting::after {
    background-image: url(../images/dots-3.png);
    content: '';
    position: absolute;
    width: 150px;
    height: 280px;
    bottom: 50px;
    right: 180px;
    -webkit-animation: up-down 3s infinite;
    -moz-animation: up-down 3s infinite;
    -o-animation: up-down 3s infinite;
    animation: up-down 3s infinite;
}

.best-work::before {
    background-image: url(../images/dots-2.png);
    content: '';
    position: absolute;
    width: 150px;
    height: 280px;
    top: 50px;
    left: 180px;
    -webkit-animation: up-down 3s infinite;
    -moz-animation: up-down 3s infinite;
    -o-animation: up-down 3s infinite;
    animation: up-down 3s infinite;
}

.best-work::after {
    background-image: url(../images/dots-2.png);
    content: '';
    position: absolute;
    width: 150px;
    height: 280px;
    bottom: 50px;
    right: 180px;
    -webkit-animation: up-down 3s infinite;
    -moz-animation: up-down 3s infinite;
    -o-animation: up-down 3s infinite;
    animation: up-down 3s infinite;
}

.what-we-do::before {
    position: absolute;
    content: '';
    width: 150px;
    height: 280px;
    background-image: url(../images/dots.png);
    background-repeat: repeat;
    top: 50px;
    left: 180px;
    z-index: 1;
    opacity: .3;
    -webkit-animation: up-down 3s infinite;
    -moz-animation: up-down 3s infinite;
    -o-animation: up-down 3s infinite;
    animation: up-down 3s infinite;
}

.what-we-do::after {
    position: absolute;
    content: '';
    width: 150px;
    height: 280px;
    background-image: url(../images/dots.png);
    background-repeat: repeat;
    bottom: 50px;
    right: 180px;
    z-index: 1;
    opacity: .3;
    -webkit-animation: up-down 3s infinite;
    -moz-animation: up-down 3s infinite;
    -o-animation: up-down 3s infinite;
    animation: up-down 3s infinite;
}

@keyframes up-down {
    0% {
        -webkit-transform: translateY(-20px);
        -moz-transform: translateY(-20px);
        -ms-transform: translateY(-20px);
        -o-transform: translateY(-20px);
        transform: translateY(-20px)
    }
    50% {
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        -o-transform: translateY(0);
        transform: translateY(0)
    }
    100% {
        -webkit-transform: translateY(-20px);
        -moz-transform: translateY(-20px);
        -ms-transform: translateY(-20px);
        -o-transform: translateY(-20px);
        transform: translateY(-20px)
    }
}

@-webkit-keyframes up-down {
    0% {
        -webkit-transform: translateY(-20px);
        -moz-transform: translateY(-20px);
        -ms-transform: translateY(-20px);
        -o-transform: translateY(-20px);
        transform: translateY(-20px)
    }
    50% {
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        -o-transform: translateY(0);
        transform: translateY(0)
    }
    100% {
        -webkit-transform: translateY(-20px);
        -moz-transform: translateY(-20px);
        -ms-transform: translateY(-20px);
        -o-transform: translateY(-20px);
        transform: translateY(-20px)
    }
}

@-o-keyframes up-down {
    0% {
        -webkit-transform: translateY(-20px);
        -moz-transform: translateY(-20px);
        -ms-transform: translateY(-20px);
        -o-transform: translateY(-20px);
        transform: translateY(-20px)
    }
    50% {
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        -o-transform: translateY(0);
        transform: translateY(0)
    }
    100% {
        -webkit-transform: translateY(-20px);
        -moz-transform: translateY(-20px);
        -ms-transform: translateY(-20px);
        -o-transform: translateY(-20px);
        transform: translateY(-20px)
    }
}

@-moz-keyframes up-down {
    0% {
        -webkit-transform: translateY(-20px);
        -moz-transform: translateY(-20px);
        -ms-transform: translateY(-20px);
        -o-transform: translateY(-20px);
        transform: translateY(-20px)
    }
    50% {
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        -o-transform: translateY(0);
        transform: translateY(0)
    }
    100% {
        -webkit-transform: translateY(-20px);
        -moz-transform: translateY(-20px);
        -ms-transform: translateY(-20px);
        -o-transform: translateY(-20px);
        transform: translateY(-20px)
    }
}

@-ms-keyframes up-down {
    0% {
        -webkit-transform: translateY(-20px);
        -moz-transform: translateY(-20px);
        -ms-transform: translateY(-20px);
        -o-transform: translateY(-20px);
        transform: translateY(-20px)
    }
    50% {
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        -o-transform: translateY(0);
        transform: translateY(0)
    }
    100% {
        -webkit-transform: translateY(-20px);
        -moz-transform: translateY(-20px);
        -ms-transform: translateY(-20px);
        -o-transform: translateY(-20px);
        transform: translateY(-20px)
    }
}

.spacetop {
    margin-top: 8%;
}

.spacetop .main-head h1 {
    font-size: 22px;
    font-weight: bold;
}

.spacetop .main-head h2 {
    font-size: 18px;
    font-weight: bold;
}


/*--------------------------------------------------------------------
                         owl carousel button
--------------------------------------------------------------------*/

.owl-nav {
    display: none;
}

.owl-dots {
    margin-top: 30px;
}

.owl-carousel .owl-nav button.owl-next,
.owl-carousel .owl-nav button.owl-prev,
.owl-carousel button.owl-dot {
    width: 16px;
    height: 16px;
    border: solid 2px #373435 !important;
    border-radius: 50px;
    background: #fff !important;
    margin-right: 10px;
    outline: none;
}

.owl-carousel button.owl-dot.active {
    border: solid 2px #f26034 !important;
    background: #f26034 !important;
}

.owl-carousel {
    text-align: center;
}

.owl-item {
    margin: 0;
}

.owl-carousel .owl-item img {
    width: auto !important;
}