@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');

body {

    font-family: 'Roboto', sans-serif !important;

    font-size: 16px;

    line-height: 24px;

    font-weight: 400;

    color: #212112;

    background-color: #fff;

    transition: all 200ms linear;

    width: 100%;

    min-width: 100%;

    max-width: 100%;

}

h2, .h2, p, span{

    font-family: 'Roboto', sans-serif !important;

}

.navbar-light .navbar-nav .nav-link {

    text-transform: uppercase;

    font-weight: 400;

}



::selection {

    color: #fff;

    background-color: #8167a9;

}



::-moz-selection {

    color: #fff;

    background-color: #8167a9;

}





/* #Navigation

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



.start-header {

    opacity: 1;

    transform: translateY(0);

    /* padding: 20px 0; */

    box-shadow: 0 10px 30px 0 rgba(138, 155, 165, 0.15);

    -webkit-transition: all 0.3s ease-out;

    transition: all 0.3s ease-out;

}



.start-header.scroll-on {

    box-shadow: 0 5px 10px 0 rgba(138, 155, 165, 0.15);

    /* padding: 10px 0; */

    -webkit-transition: all 0.3s ease-out;

    transition: all 0.3s ease-out;

}



.start-header.scroll-on .navbar-brand img {

    height: 55px;

    -webkit-transition: all 0.3s ease-out;

    transition: all 0.3s ease-out;

}



.navbar {

    padding: 0 !important;

}



.navigation-wrap {

    position: fixed;

    width: 100%;

    top: 0;

    left: 0;

    z-index: 1000;

    -webkit-transition: all 0.3s ease-out;

    transition: all 0.3s ease-out;

}



.navbar {

    padding: 0;

}



.navbar-brand img {

    height: 75px;

    width: auto;

    display: block;

    /* filter: brightness(10%); */

    -webkit-transition: all 0.3s ease-out;

    transition: all 0.3s ease-out;

}



.navbar-toggler {

    float: right;

    border: none;

    padding-right: 0;

}



.navbar-toggler:active,

.navbar-toggler:focus {

    outline: none;

}



.navbar-light .navbar-toggler-icon {

    width: 24px;

    height: 17px;

    background-image: none;

    position: relative;

    border-bottom: 1px solid #000;

    transition: all 300ms linear;

}



.navbar-light .navbar-toggler-icon:after,

.navbar-light .navbar-toggler-icon:before {

    width: 24px;

    position: absolute;

    height: 1px;

    background-color: #000;

    top: 0;

    left: 0;

    content: '';

    z-index: 2;

    transition: all 300ms linear;

}



.navbar-light .navbar-toggler-icon:after {

    top: 8px;

}



.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon:after {

    transform: rotate(45deg);

}



.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon:before {

    transform: translateY(8px) rotate(-45deg);

}



.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon {

    border-color: transparent;

}



.nav-link {

    color: #212121 !important;

    font-weight: 500;

    transition: all 200ms linear;

}



.nav-item:hover .nav-link {

    color: #8167a9 !important;

}



.nav-item.active .nav-link {

    color: #777 !important;

}



.nav-link {

    position: relative;

    padding: 5px 0 !important;

    display: inline-block;

}



.nav-item:after {

    position: absolute;

    bottom: -5px;

    left: 0;

    width: 100%;

    height: 2px;

    content: '';

    background-color: #8167a9;

    opacity: 0;

    transition: all 200ms linear;

}



.nav-item:hover:after {

    bottom: 0;

    opacity: 1;

}



.nav-item.active:hover:after {

    opacity: 0;

}



.nav-item {

    position: relative;

    transition: all 200ms linear;

}





/* #Primary style

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



.bg-light-zapster {

    background-color: #fbed1d!important;

    transition: all 200ms linear;

}



.section {

    position: relative;

    width: 100%;

    display: block;

}



.full-height {

    height: 100vh;

}



.over-hide {

    overflow: hidden;

}



.absolute-center {

    position: absolute;

    top: 50%;

    left: 0;

    width: 100%;

    margin-top: 40px;

    transform: translateY(-50%);

    z-index: 20;

}



h1 {

    font-size: 48px;

    line-height: 1.2;

    font-weight: 700;

    color: #212112;

    text-align: center;

}



p {

    /* text-align: center; */

    margin: 0;

    padding-top: 0;

    opacity: 1;

    transform: translate(0);

    transition: all 300ms linear;

    transition-delay: 1700ms;

    color: #000;

}



.nav-link img {

    margin-top: -4px;

}



body.hero-anime p {

    opacity: 0;

    transform: translateY(40px);

    transition-delay: 1700ms;

}



h1 span {

    display: inline-block;

    transition: all 300ms linear;

    opacity: 1;

    transform: translate(0);

}



body.hero-anime h1 span:nth-child(1) {

    opacity: 0;

    transform: translateY(-20px);

}



body.hero-anime h1 span:nth-child(2) {

    opacity: 0;

    transform: translateY(-30px);

}



body.hero-anime h1 span:nth-child(3) {

    opacity: 0;

    transform: translateY(-50px);

}



body.hero-anime h1 span:nth-child(4) {

    opacity: 0;

    transform: translateY(-10px);

}



body.hero-anime h1 span:nth-child(5) {

    opacity: 0;

    transform: translateY(-50px);

}



body.hero-anime h1 span:nth-child(6) {

    opacity: 0;

    transform: translateY(-20px);

}



body.hero-anime h1 span:nth-child(7) {

    opacity: 0;

    transform: translateY(-40px);

}



body.hero-anime h1 span:nth-child(8) {

    opacity: 0;

    transform: translateY(-10px);

}



body.hero-anime h1 span:nth-child(9) {

    opacity: 0;

    transform: translateY(-30px);

}



body.hero-anime h1 span:nth-child(10) {

    opacity: 0;

    transform: translateY(-20px);

}



h1 span:nth-child(1) {

    transition-delay: 1000ms;

}



h1 span:nth-child(2) {

    transition-delay: 700ms;

}



h1 span:nth-child(3) {

    transition-delay: 900ms;

}



h1 span:nth-child(4) {

    transition-delay: 800ms;

}



h1 span:nth-child(5) {

    transition-delay: 1000ms;

}



h1 span:nth-child(6) {

    transition-delay: 700ms;

}



h1 span:nth-child(7) {

    transition-delay: 900ms;

}



h1 span:nth-child(8) {

    transition-delay: 800ms;

}



h1 span:nth-child(9) {

    transition-delay: 600ms;

}



h1 span:nth-child(10) {

    transition-delay: 700ms;

}



body.hero-anime h1 span:nth-child(11) {

    opacity: 0;

    transform: translateY(30px);

}



body.hero-anime h1 span:nth-child(12) {

    opacity: 0;

    transform: translateY(50px);

}



body.hero-anime h1 span:nth-child(13) {

    opacity: 0;

    transform: translateY(20px);

}



body.hero-anime h1 span:nth-child(14) {

    opacity: 0;

    transform: translateY(30px);

}



body.hero-anime h1 span:nth-child(15) {

    opacity: 0;

    transform: translateY(50px);

}



h1 span:nth-child(11) {

    transition-delay: 1300ms;

}



h1 span:nth-child(12) {

    transition-delay: 1500ms;

}



h1 span:nth-child(13) {

    transition-delay: 1400ms;

}



h1 span:nth-child(14) {

    transition-delay: 1200ms;

}



h1 span:nth-child(15) {

    transition-delay: 1450ms;

}



.nav-item .dropdown-menu {

    transform: translate3d(0, 10px, 0);

    visibility: hidden;

    opacity: 0;

    max-height: 0;

    display: block;

    padding: 0;

    margin: 0;

    transition: all 200ms linear;

}



.nav-item.show .dropdown-menu {

    opacity: 1;

    visibility: visible;

    max-height: 999px;

    transform: translate3d(0, 0px, 0);

}



.dropdown-menu {

    padding: 10px!important;

    margin: 0;

    font-size: 13px;

    letter-spacing: 1px;

    color: #212121;

    background-color: #fcfaff;

    border: none;

    border-radius: 3px;

    box-shadow: 0 5px 10px 0 rgba(138, 155, 165, 0.15);

    transition: all 200ms linear;

}



.dropdown-toggle::after {

    display: none;

}



.dropdown-item {

    padding: 3px 15px;

    color: #212121;

    border-radius: 2px;

    transition: all 200ms linear;

}



.dropdown-item:hover,

.dropdown-item:focus {

    color: #fff;

    background-color: rgba(129, 103, 169, .6);

}



body.dark {

    color: #fff;

    background-color: #1f2029;

}



body.dark .navbar-brand img {

    filter: brightness(100%);

}



body.dark h1 {

    color: #fff;

}



body.dark h1 span {

    transition-delay: 0ms !important;

}



body.dark p {

    color: #fff;

    transition-delay: 0ms !important;

}



body.dark .bg-light {

    background-color: #14151a !important;

}



body.dark .start-header {

    box-shadow: 0 10px 30px 0 rgba(0, 0, 0, 0.15);

}



body.dark .start-header.scroll-on {

    box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.15);

}



body.dark .nav-link {

    color: #fff !important;

}



body.dark .nav-item.active .nav-link {

    color: #999 !important;

}



body.dark .dropdown-menu {

    color: #fff;

    background-color: #1f2029;

    box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.25);

}



body.dark .dropdown-item {

    color: #fff;

}



body.dark .navbar-light .navbar-toggler-icon {

    border-bottom: 1px solid #fff;

}



body.dark .navbar-light .navbar-toggler-icon:after,

body.dark .navbar-light .navbar-toggler-icon:before {

    background-color: #fff;

}



body.dark .navbar-toggler[aria-expanded="true"] .navbar-toggler-icon {

    border-color: transparent;

}





/* #Media

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



@media (min-width: 768px) {

    .gradient_bg {

        background: rgb(251, 237, 29);

        background: linear-gradient(90deg, rgba(251, 237, 29, 1) 0%, rgba(242, 181, 43, 1) 100%);

    }

    header {

        overflow: hidden;

    }

}



@media (max-width: 767px) {

    h1 {

        font-size: 38px;

    }

    .nav-item:after {

        display: none;

    }

    /* .nav-item::before {

        position: absolute;

        display: block;

        top: 23px;

        left: 0;

        width: 11px;

        height: 1px;

        content: "";

        border: none;

        background-color: #000;

        vertical-align: 0;

    } */

    li.nav-item.pl-4.pl-md-0.ml-0.ml-md-4 {

        border-top: 1px solid #00000017;

    }

    .dropdown-toggle::after {

        position: absolute;

        display: block;

        top: 10px;

        left: -23px;

        width: 1px;

        height: 11px;

        content: "";

        border: none;

        background-color: #000;

        vertical-align: 0;

        transition: all 200ms linear;

    }

    .dropdown-toggle[aria-expanded="true"]::after {

        transform: rotate(90deg);

        opacity: 0;

    }

    .dropdown-menu {

        padding: 0 !important;

        background-color: transparent;

        box-shadow: none;

        transition: all 200ms linear;

    }

    .dropdown-toggle[aria-expanded="true"]+.dropdown-menu {

        margin-top: 10px !important;

        margin-bottom: 20px !important;

    }

    body.dark .nav-item::before {

        background-color: #fff;

    }

    body.dark .dropdown-toggle::after {

        background-color: #fff;

    }

    body.dark .dropdown-menu {

        background-color: transparent;

        box-shadow: none;

    }

}





/* #Link to page

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



h2 {

    text-transform: uppercase;

}



.logo {

    position: absolute;

    bottom: 0px;

    /* right: 30px; */

    display: block;

    z-index: 100;

    transition: all 250ms linear;

    width: 100%;

    /* left: 30px; */

    text-align: center;

    background-color: #0000009e;

    text-transform: uppercase;

    font-size: 18px;

    height: 15vh;

    background: linear-gradient(0deg, rgb(0 0 0) 0%, rgb(0 0 0 / 0%) 100%);

}



.logo p {

    /* height: 26px; */

    /* width: 50%; */

    /* display: block; */

    display: inline-block;

    color: #fbed1d;

    /* filter: brightness(10%); */

    transition: all 250ms linear;

    text-align: center;

    margin: 0 auto;

    padding-bottom: 10px;

}



.output {

    text-align: center;

    color: white;

    font-size: 2rem;

    /* font-weight: bold; */

}



.output span,

.output p {

    /* float: left; */

}



.output span {

    /* width: 45%;

    text-align: right; */

    padding-top: 10px;

    font-weight: 700 !important;

}



h2 {

    font-size: 2rem;

    font-weight: 500 !important;

}



.output p {

    /* width: 55%;

    text-align: left; */

    font-weight: 500 !important;

}



h1 {

    font-size: 30px;

}



.top-nav a {

    font-size: 20px;

    font-weight: 900 !important;

}



header {

    position: relative;

    overflow: hidden;

    background: #000;

}



.footer {

    position: fixed;

    bottom: 0;

}



#services p {

    font-size: 20px;

}



#about p {

    text-align: justify;

    /* text-align: left !important; */

}



.form-group {

    margin-bottom: 0.5rem !important;

}





/* font-size: 20px; */



#services img {

    max-width: 35%;

}



.col-3.p-0.gray {

    height: 100vh;

}



.overlay {

    position: absolute;

    overflow: hidden;

    background: #00000066;

    height: 100vh;

    z-index: 9;

    width: 100%;

}





/* Cursor Styling */



.cursor::after {

    content: '';

    display: inline-block;

    margin-left: 3px;

    background-color: white;

    animation-name: blink;

    animation-duration: 0.5s;

    animation-iteration-count: infinite;

}



h1.cursor::after {

    height: 24px;

    width: 13px;

}



p.cursor::after {

    height: 13px;

    width: 6px;

}



@keyframes blink {

    0% {

        opacity: 1;

    }

    49% {

        opacity: 1;

    }

    50% {

        opacity: 0;

    }

    100% {

        opacity: 0;

    }

}



video {

    position: absolute;

    top: 50%;

    left: 50%;

    min-width: 100%;

    min-height: 100%;

    width: auto;

    height: auto;

    z-index: 0;

    -ms-transform: translateX(-50%) translateY(-50%);

    -moz-transform: translateX(-50%) translateY(-50%);

    -webkit-transform: translateX(-50%) translateY(-50%);

    transform: translateX(-50%) translateY(-50%);

    /* margin-top: -190px; */

}



header {

    position: relative;

    background-color: black;

    height: 100vh;

    min-height: 25rem;

    width: 100%;

    /* overflow: hidden; */

}



a:hover {

    color: #000 !important;

    text-decoration: none !important;

}



.gray {

    background-color: #3a394b;

}



.yellow {

    background-color: #fbed1d !important;

}



.black {

    background-color: #000 !important;

}



.footer i.fa {

    color: #fff;

    background-color: black;

    border-radius: 50%;

    color: #fff;

    background-color: black;

    border-radius: 50%;

    border: 2px solid white;

    padding: 10px;

}



.contact i.fa,

.contact span {

    color: #fff;

    width: 100%;

    /* max-width: 20px; */

    text-align: center;

}



.contact i.fa {

    font-size: 1.5rem;

}



.footer span {

    color: #fff;

    line-height: 40px;

}



.form-control {

    border-top: 0px !important;

    border-left: 0px !important;

    border-right: 0px !important;

    border-radius: 0px !important;

    /* border-bottom: 1px !important; */

    /* border-color: #cc ; */

}



.form-control:focus {

    color: #000;

    background-color: #fff;

    border-color: #000 !important;

    outline: 0;

    box-shadow: inherit !important;

}



.btnSubmit {

    color: #fff;

    padding: 5px 20px;

    outline: none;

    border: 0;

}





/* .block {

    height: 5em;

    line-height: 5em;

    width: 10em;

    background: #464646;

    color: #fdfdfd;

    text-align: center;

    margin: 1em auto;

    text-shadow: 0 0 1px #333;

} */



.animatable {

    /* initially hide animatable objects */

    visibility: hidden;

    /* initially pause animatable objects their animations */

    -webkit-animation-play-state: paused;

    -moz-animation-play-state: paused;

    -ms-animation-play-state: paused;

    -o-animation-play-state: paused;

    animation-play-state: paused;

}





/* show objects being animated */



.animated {

    visibility: visible;

    -webkit-animation-fill-mode: both;

    -moz-animation-fill-mode: both;

    -ms-animation-fill-mode: both;

    -o-animation-fill-mode: both;

    animation-fill-mode: both;

    -webkit-animation-duration: 1s;

    -moz-animation-duration: 1s;

    -ms-animation-duration: 1s;

    -o-animation-duration: 1s;

    animation-duration: 1s;

    -webkit-animation-play-state: running;

    -moz-animation-play-state: running;

    -ms-animation-play-state: running;

    -o-animation-play-state: running;

    animation-play-state: running;

}





/* CSS Animations (extracted from http://glifo.uiparade.com/) */



@-webkit-keyframes fadeInDown {

    0% {

        opacity: 0;

        -webkit-transform: translateY(-20px);

    }

    100% {

        opacity: 1;

        -webkit-transform: translateY(0);

    }

}



@-moz-keyframes fadeInDown {

    0% {

        opacity: 0;

        -moz-transform: translateY(-20px);

    }

    100% {

        opacity: 1;

        -moz-transform: translateY(0);

    }

}



@-o-keyframes fadeInDown {

    0% {

        opacity: 0;

        -o-transform: translateY(-20px);

    }

    100% {

        opacity: 1;

        -o-transform: translateY(0);

    }

}



@keyframes fadeInDown {

    0% {

        opacity: 0;

        transform: translateY(-20px);

    }

    100% {

        opacity: 1;

        transform: translateY(0);

    }

}



@-webkit-keyframes fadeIn {

    0% {

        opacity: 0;

    }

    20% {

        opacity: 0;

    }

    100% {

        opacity: 1;

    }

}



@-moz-keyframes fadeIn {

    0% {

        opacity: 0;

    }

    20% {

        opacity: 0;

    }

    100% {

        opacity: 1;

    }

}



@-o-keyframes fadeIn {

    0% {

        opacity: 0;

    }

    20% {

        opacity: 0;

    }

    100% {

        opacity: 1;

    }

}



@keyframes fadeIn {

    0% {

        opacity: 0;

    }

    60% {

        opacity: 0;

    }

    20% {

        opacity: 0;

    }

    100% {

        opacity: 1;

    }

}



@-webkit-keyframes bounceInLeft {

    0% {

        opacity: 0;

        -webkit-transform: translateX(-2000px);

    }

    60% {

        -webkit-transform: translateX(20px);

    }

    80% {

        -webkit-transform: translateX(-5px);

    }

    100% {

        opacity: 1;

        -webkit-transform: translateX(0);

    }

}



@-moz-keyframes bounceInLeft {

    0% {

        opacity: 0;

        -moz-transform: translateX(-2000px);

    }

    60% {

        -moz-transform: translateX(20px);

    }

    80% {

        -moz-transform: translateX(-5px);

    }

    100% {

        opacity: 1;

        -moz-transform: translateX(0);

    }

}



@-o-keyframes bounceInLeft {

    0% {

        opacity: 0;

        -o-transform: translateX(-2000px);

    }

    60% {

        opacity: 1;

        -o-transform: translateX(20px);

    }

    80% {

        -o-transform: translateX(-5px);

    }

    100% {

        opacity: 1;

        -o-transform: translateX(0);

    }

}



@keyframes bounceInLeft {

    0% {

        opacity: 0;

        transform: translateX(-2000px);

    }

    60% {

        transform: translateX(20px);

    }

    80% {

        transform: translateX(-5px);

    }

    100% {

        opacity: 1;

        transform: translateX(0);

    }

}



@-webkit-keyframes bounceInRight {

    0% {

        opacity: 0;

        -webkit-transform: translateX(2000px);

    }

    60% {

        -webkit-transform: translateX(-20px);

    }

    80% {

        -webkit-transform: translateX(5px);

    }

    100% {

        opacity: 1;

        -webkit-transform: translateX(0);

    }

}



@-moz-keyframes bounceInRight {

    0% {

        opacity: 0;

        -moz-transform: translateX(2000px);

    }

    60% {

        -moz-transform: translateX(-20px);

    }

    80% {

        -moz-transform: translateX(5px);

    }

    100% {

        opacity: 1;

        -moz-transform: translateX(0);

    }

}



@-o-keyframes bounceInRight {

    0% {

        opacity: 0;

        -o-transform: translateX(2000px);

    }

    60% {

        -o-transform: translateX(-20px);

    }

    80% {

        -o-transform: translateX(5px);

    }

    100% {

        opacity: 1;

        -o-transform: translateX(0);

    }

}



@keyframes bounceInRight {

    0% {

        opacity: 0;

        transform: translateX(2000px);

    }

    60% {

        transform: translateX(-20px);

    }

    80% {

        transform: translateX(5px);

    }

    100% {

        opacity: 1;

        transform: translateX(0);

    }

}



@-webkit-keyframes fadeInUp {

    0% {

        opacity: 0;

        -webkit-transform: translateY(20px);

    }

    100% {

        opacity: 1;

        -webkit-transform: translateY(0);

    }

}



@-moz-keyframes fadeInUp {

    0% {

        opacity: 0;

        -moz-transform: translateY(20px);

    }

    100% {

        opacity: 1;

        -moz-transform: translateY(0);

    }

}



@-o-keyframes fadeInUp {

    0% {

        opacity: 0;

        -o-transform: translateY(20px);

    }

    100% {

        opacity: 1;

        -o-transform: translateY(0);

    }

}



@keyframes fadeInUp {

    0% {

        opacity: 0;

        transform: translateY(20px);

    }

    100% {

        opacity: 1;

        transform: translateY(0);

    }

}



@-webkit-keyframes bounceIn {

    0% {

        opacity: 0;

        -webkit-transform: scale(.3);

    }

    50% {

        -webkit-transform: scale(1.05);

    }

    70% {

        -webkit-transform: scale(.9);

    }

    100% {

        opacity: 1;

        -webkit-transform: scale(1);

    }

}



@-moz-keyframes bounceIn {

    0% {

        opacity: 0;

        -moz-transform: scale(.3);

    }

    50% {

        -moz-transform: scale(1.05);

    }

    70% {

        -moz-transform: scale(.9);

    }

    100% {

        opacity: 1;

        -moz-transform: scale(1);

    }

}



@-o-keyframes bounceIn {

    0% {

        opacity: 0;

        -o-transform: scale(.3);

    }

    50% {

        -o-transform: scale(1.05);

    }

    70% {

        -o-transform: scale(.9);

    }

    100% {

        opacity: 1;

        -o-transform: scale(1);

    }

}



@keyframes bounceIn {

    0% {

        opacity: 0;

        transform: scale(.3);

    }

    50% {

        transform: scale(1.05);

    }

    70% {

        transform: scale(.9);

    }

    100% {

        opacity: 1;

        transform: scale(1);

    }

}



@-webkit-keyframes moveUp {

    0% {

        opacity: 1;

        -webkit-transform: translateY(40px);

    }

    100% {

        opacity: 1;

        -webkit-transform: translateY(0);

    }

}



@-moz-keyframes moveUp {

    0% {

        opacity: 1;

        -moz-transform: translateY(40px);

    }

    100% {

        opacity: 1;

        -moz-transform: translateY(0);

    }

}



@-o-keyframes moveUp {

    0% {

        opacity: 1;

        -o-transform: translateY(40px);

    }

    100% {

        opacity: 1;

        -o-transform: translateY(0);

    }

}



@keyframes moveUp {

    0% {

        opacity: 1;

        transform: translateY(40px);

    }

    100% {

        opacity: 1;

        transform: translateY(0);

    }

}



@-webkit-keyframes fadeBgColor {

    0% {

        background: none;

    }

    70% {

        background: none;

    }

    100% {

        background: #464646;

    }

}



@-o-keyframes fadeBgColor {

    0% {

        background: none;

    }

    70% {

        background: none;

    }

    100% {

        background: #464646;

    }

}



@keyframes fadeBgColor {

    0% {

        background: none;

    }

    70% {

        background: none;

    }

    100% {

        background: #464646;

    }

}



.animated.animationDelay {

    animation-delay: .4s;

    -webkit-animation-delay: .4s;

}



.animated.animationDelayMed {

    animation-delay: 1.2s;

    -webkit-animation-delay: 1.2s;

}



.animated.animationDelayLong {

    animation-delay: 1.6s;

    -webkit-animation-delay: 1.6s;

}



.animated.fadeBgColor {

    -webkit-animation-name: fadeBgColor;

    -moz-animation-name: fadeBgColor;

    -o-animation-name: fadeBgColor;

    animation-name: fadeBgColor;

}



.animated.bounceIn {

    -webkit-animation-name: bounceIn;

    -moz-animation-name: bounceIn;

    -o-animation-name: bounceIn;

    animation-name: bounceIn;

}



.animated.bounceInRight {

    -webkit-animation-name: bounceInRight;

    -moz-animation-name: bounceInRight;

    -o-animation-name: bounceInRight;

    animation-name: bounceInRight;

}



.animated.bounceInLeft {

    -webkit-animation-name: bounceInLeft;

    -moz-animation-name: bounceInLeft;

    -o-animation-name: bounceInLeft;

    animation-name: bounceInLeft;

}



.animated.fadeIn {

    -webkit-animation-name: fadeIn;

    -moz-animation-name: fadeIn;

    -o-animation-name: fadeIn;

    animation-name: fadeIn;

}



.animated.fadeInDown {

    -webkit-animation-name: fadeInDown;

    -moz-animation-name: fadeInDown;

    -o-animation-name: fadeInDown;

    animation-name: fadeInDown;

}



.animated.fadeInUp {

    -webkit-animation-name: fadeInUp;

    -moz-animation-name: fadeInUp;

    -o-animation-name: fadeInUp;

    animation-name: fadeInUp;

}



.animated.moveUp {

    -webkit-animation-name: moveUp;

    -moz-animation-name: moveUp;

    -o-animation-name: moveUp;

    animation-name: moveUp;

}



.navbar-light .navbar-nav .nav-link {

    -webkit-transition: all 0.3s ease-out;

    transition: all 0.3s ease-out;

    text-transform: uppercase;

    line-height: 35px;

}



.start-header.scroll-on .navbar-nav .nav-link {

    -webkit-transition: all 0.3s ease-out;

    transition: all 0.3s ease-out;

    line-height: inherit;

}



.navbar-light .navbar-toggler-icon {

    background-image: inherit !important;

}



.navbar-light .navbar-toggler {

    /* color: rgba(0,0,0,.5); */

    border-color: rgba(0, 0, 0, .0) !important;

}



.social img {

    max-width: 28px;

    margin-top: -7px;

}



.social a {

    /* float: left; */

    display: inline-block;

}



li.nav-item.pl-4.pl-md-0.ml-0.ml-md-4.social {

    margin-left: 6px !important;

}



.blink_me {

    animation: blinker 1s linear infinite;

}



@keyframes blinker {

    50% {

        opacity: 0;

    }

}



.waviy {

    position: relative;

}



.waviy span {

    position: relative;

    display: inline-block;

    /* font-size: 40px; 

    color: #fff;*/

    text-transform: uppercase;

    animation: flip 2s infinite;

    animation-delay: calc(.2s * var(--i))

}



@keyframes flip {

    0%,

    80% {

        transform: rotateY(360deg)

    }

}



div#carouselContent {

    left: 0;

    position: absolute;

    width: 100%;

    color: #fff;

}



div#carouselContent p {

    color: #fff;

}



.carousel-item.text-center.p-4 {

    /* margin-top: 227px; */

    z-index: 99;

}



.we-are {

    position: relative;

    /* top: 100px; */

    z-index: 999;

}



.we-are h2 {

    font-size: 4rem;

    margin: 0;

}



.carousel-inner .carousel-item .block {

    font-size: 6rem;

    color: #fff !important;

}



#about,

#services {

    overflow: hidden;

}





/* Media */





/* xs = Extra small <576px. Max container width None (auto)

sm = Small ≥576px. Max container width 540px.

md = Medium ≥768px. Max container width 720px.

lg = Large ≥992px. Max container width 960px.

xl = Extra large ≥1200px. Max container width 1140px. */



@media screen and (min-width: 540px) {}



@media (max-width: 540px) {}



@media (min-width: 540px) and (max-width: 720px) {}



@media (min-width: 720px) and (max-width: 960px) {}



@media (min-width: 960px) and (max-width: 1140px) {}



@media (min-width: 1140px) {}



@media (max-width: 767px) {

    .mobile {

        display: none;

    }

    .mobile_hide {

        display: none;

    }

    p {

        padding: 0 1rem;

    }

    .navbar-nav {

        padding: 0 3rem !important;

    }

    ul.navbar-nav.ml-auto.py-4.py-md-0.row {

        padding-top: 0 !important;

        padding-bottom: 0 !important;

        margin: 0 !important;

        text-align: center !important;

    }

    ul.navbar-nav.ml-auto.py-4.py-md-0 {

        padding-top: 0 !important;

        padding-bottom: 0 !important;

    }

    li.pl-5.pl-md-0.ml-0.ml-md-4.social {

        padding-left: 0.5rem !important;

        display: none;

    }

    .mobile_hide.mobile1 {

        display: block;

    }

    #about,

    #services, #contact {

        overflow: scroll !important;

    }

    video#web {

        display: none;

    }

    #services p {

        font-size: 14px !important;

    }

    #services img {

        max-width: 90% !important;

    }

    .h2, h2 {

        margin-top: 2rem !important;

    }

    .col-12.col-sm-12.col-md-6.col-lg-6.col-xl-6.pl-0 {

        padding-left: 15px !important;

    }

    .top-nav a {

        font-size: 24px !important;

    }

    .nav-link img {

        margin-top: -2px !important;

    }

}



@media (min-width: 767px) {

    video#mobile {

        display: none;

    }

    .web {

        display: none;

    }

    .bodyheight::-webkit-scrollbar {

        width: 1px;

      }

       

      .bodyheight::-webkit-scrollbar-track {

        box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);

      }

       

      .bodyheight::-webkit-scrollbar-thumb {

        background-color: #a9a9a99e;

        outline: 1px solid #70809087;

      }

}