@import url('https://fonts.googleapis.com/css?family=Muli:700&display=swap');

@font-face {
    font-family: "Muli-Regular";
    src: url("../fonts/muli/Muli-Regular.ttf");
}

@font-face {
    font-family: "Muli-SemiBold";
    src: url("../fonts/muli/Muli-SemiBold.ttf");
}

* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

body {
    font-family: "Muli-Regular";
    font-size: 14px;
    margin: 0;
    color: #999;
    background: url('../img/bg.png') no-repeat;
    background-size: cover;
    --color: #20b6c5;
}

    body:before {
        background: #665fee;
        background: -moz-linear-gradient(45deg,#665fee 0%,#27c2de 100%);
        background: -webkit-linear-gradient(45deg,#665fee 0%,#27c2de 100%);
        background: -o-linear-gradient(45deg,#665fee 0%,#27c2de 100%);
        background: linear-gradient(45deg,#665fee 0%,#27c2de 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#665fee',endColorstr='#27c2de',GradientType=1 );
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        opacity: 0.4;
    }

.rimjhim {
    color: #015696;
    filter: drop-shadow(1px 1px 0px #015696);
}

.travels {
    color: #11b3e8;
    filter: drop-shadow(1px 1px 0px #11b3e8);
}

input, textarea, select, a.bTn {
    font-family: "Muli-Regular";
}

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

img {
    max-width: 100%;
}

ul {
    padding-left: 0;
    margin-bottom: 0;
}

a {
    text-decoration: none;
}

:focus {
    outline: none;
}

.wrapper {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
}

.inner {
    position: relative;
    width: 100%;
}

.girlimg {
    position: absolute;
    bottom: -12px;
    left: -191px;
    z-index: 99;
}

.flower {
    position: absolute;
    bottom: 0;
    right: -129px;
}

div.frm {
    width: 100%;
    position: relative;
    z-index: 9;
    padding: 40px 40px 40px;
    background: #fff;
    -webkit-box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.6);
    -moz-box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.6);
    box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.6);
    overflow: hidden;
}

/*div.frm > .form-holder:nth-child(1) {
        -webkit-animation-delay: 300ms;
        animation-delay: 300ms;
    }

    div.frm > .form-holder:nth-child(2) {
        -webkit-animation-delay: 400ms;
        animation-delay: 400ms;
    }

    div.frm > .form-holder:nth-child(3) {
        -webkit-animation-delay: 500ms;
        animation-delay: 500ms;
    }

    div.frm > .form-holder:nth-child(4) {
        -webkit-animation-delay: 600ms;
        animation-delay: 600ms;
    }*/

h3 {
    font-size: 30px;
    font-family: "Muli-SemiBold";
    color: #333;
    letter-spacing: 3px;
    text-align: center;
    margin-bottom: 33px;
}

.form-holder {
    position: relative;
    margin-bottom: 32px;
    /*-webkit-animation-name: fadeInUp;
    animation-name: fadeInUp;
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;*/
}

    .form-holder span {
        position: absolute;
        left: 0;
        top: 50%;
        transform: translateY(-50%);
        font-size: 15px;
        color: #333;
    }

        .form-holder span.lnr-lock {
            left: 2px;
        }

.form-control {
    border: none;
    border-bottom: 1px solid #e6e6e6;
    display: block;
    width: 100%;
    height: 38px;
    background: none;
    padding: 3px 42px 0px;
    color: #666;
    font-family: "Muli-SemiBold";
    font-size: 16px;
    box-shadow: none !important;
    outline: none !important;
    border-radius: 0px;
    letter-spacing: 2px;
}

    .form-control::-webkit-input-placeholder {
        font-size: 14px;
        font-family: "Muli-Regular";
        color: #999;
        transform: translateY(1px);
    }

    .form-control::-moz-placeholder {
        font-size: 14px;
        font-family: "Muli-Regular";
        color: #999;
        transform: translateY(1px);
    }

    .form-control:-ms-input-placeholder {
        font-size: 14px;
        font-family: "Muli-Regular";
        color: #999;
        transform: translateY(1px);
    }

    .form-control:-moz-placeholder {
        font-size: 14px;
        font-family: "Muli-Regular";
        color: #999;
        transform: translateY(1px);
    }

    .form-control:focus {
        border-bottom: 1px solid var(--color);
    }

a.bTn {
    border: none;
    width: 100%;
    margin-top: 30px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 15px 0px;
    background: #11b3e8;
    color: #fff;
    text-transform: uppercase;
    font-family: "Muli-SemiBold";
    font-size: 15px;
    letter-spacing: 2px;
    transition: all 0.5s;
    position: relative;
    overflow: hidden;
    text-decoration: none !important;
}

    a.bTn:hover {
        -webkit-transform: translateY(-3px);
        -ms-transform: translateY(-3px);
        transform: translateY(-3px);
        -webkit-box-shadow: 0 6px 20px rgba(0, 0, 0, 0.57);
        box-shadow: 0 6px 20px rgba(0, 0, 0, 0.57);
    }

    a.bTn span {
        position: relative;
        z-index: 2;
    }

    a.bTn:before, a.bTn:after {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 1;
        background-color: rgba(52, 152, 253, 0.25);
        -webkit-transition: all 0.3s;
        -moz-transition: all 0.3s;
        -o-transition: all 0.3s;
        transition: all 0.3s;
        -webkit-transform: translate(-100%, 0);
        transform: translate(-100%, 0);
        -webkit-transition-timing-function: cubic-bezier(0.75, 0, 0.125, 1);
        transition-timing-function: cubic-bezier(0.75, 0, 0.125, 1);
    }

    a.bTn:after {
        -webkit-transition-delay: 0.2s;
        transition-delay: 0.2s;
    }

    a.bTn:hover:before, a.bTn:hover:after {
        -webkit-transform: translate(0, 0);
        transform: translate(0, 0);
    }

@media (min-width: 1200px) {
    .container, .container-lg, .container-md, .container-sm, .container-xl {
        max-width: 1250px;
    }
}

@media (max-width: 991px) {
    .inner {
        width: 400px;
        left: 4%;
    }
}

@media (max-width: 767px) {
    .inner {
        width: 100%;
        left: 0;
    }

    .girlimg, .flower {
        display: none;
    }

    div.frm {
        padding: 35px;
        box-shadow: none;
        -webkit-box-shadow: none;
        -moz-box-shadow: none;
        -ms-box-shadow: none;
        -o-box-shadow: none;
    }

    .wrapper {
        background: none;
    }
}

/*######################################## Services Slider ########################################*/

.ServiceSlider {
    position: relative;
    display: grid;
    width: 100%;
    grid-template-rows: auto;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    grid-gap: 0 40px;
}

    .ServiceSlider .box {
        position: relative;
        background: #174e69d1 /*#060c21*/;
        padding: 50px 0px;
        display: flex;
        justify-content: center;
        align-items: center;
        margin: 8px;
        /*-webkit-animation-duration: 1s;
        animation-duration: 1s;
        -webkit-animation-fill-mode: both;
        animation-fill-mode: both;*/
    }

        .ServiceSlider .box:before {
            content: '';
            position: absolute;
            top: -2px;
            bottom: -2px;
            left: -2px;
            right: -2px;
            background: #fff;
            z-index: -1;
            transform: skew(2deg, 2deg);
        }

    .ServiceSlider .owl-stage .owl-item:nth-child(2n+1) .box:before {
        background: linear-gradient(315deg, #ff0057, #e64a19);
    }

    .ServiceSlider .owl-stage .owl-item:nth-child(2n+2) .box:before {
        background: linear-gradient(315deg, #89ff07, #00bcd4);
    }

    .ServiceSlider .owl-stage .owl-item:nth-child(5n+3) .box:before {
        background: linear-gradient(315deg, #e91e63, #5d02ff);
    }

    .ServiceSlider .owl-stage .owl-item {
        margin-right: 9px !important;
    }

/*.ServiceSlider .owl-stage .owl-item:nth-child(2n+4) .box:before {
        background: linear-gradient(315deg, #ff0000, #ffc107);
    }*/

.box .content {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
}

    .box .content img {
        position: absolute;
        top: 15px;
        right: 8px;
        margin: 0px;
        padding: 0px;
        display: initial !important;
        width: 100px !important;
        opacity: 0.4;
        transition: 600ms;
    }

.box:hover .content img {
    top: -10px;
}

.box .content h3 {
    margin: -20px 0px 26px;
    display: block;
    width: 100%;
    font-weight: 500;
    color: #fff;
    text-align: left;
    font-size: 22px;
    padding: 0px 15px;
    letter-spacing: 1px;
}

.box .content span {
    position: relative;
    margin: 0px;
    padding: 0px;
    font-weight: 500;
    color: #fff;
    font-size: 46px;
    transition: 0.5s;
    transform: translateY(-20px) translateX(-100%);
    opacity: 0;
    visibility: hidden;
}

.hdnBtn {
    position: absolute;
    visibility: hidden;
}

.frgetPass {
    color: #969696;
    font-size: 11px;
    position: absolute;
    bottom: -16px;
    right: 0px;
    cursor: pointer;
    text-transform: capitalize;
    border-bottom: 1px dashed #fff;
    line-height: 1;
    transition: 0s;
}

    .frgetPass:active, .frgetPass:hover {
        color: #969696;
        border-bottom: 1px dashed #696969;
        text-decoration: none
    }

/*########## Placeholder CSS ##########*/

::-webkit-input-placeholder { /* Edge */
    text-transform: none !important;
    letter-spacing: normal !important;
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
    text-transform: none !important;
    letter-spacing: normal !important;
}

::placeholder {
    text-transform: capitalize !important;
    letter-spacing: 1px !important;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    -webkit-box-shadow: 0 0 0 20px white inset !important;
    transition: none;
}

.captchaInpt {
    text-transform: uppercase;
    letter-spacing: 10px !important;
}

.refreshCaptcha {
    position: absolute;
    right: 15px;
    top: 15px;
    outline: none;
    filter: grayscale(1);
}

.mainBgBody .form-control {
    border-radius: 4px;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    padding: 0px 10px;
    height: 38px;
    border: 1px solid #ccc;
}

.logo {
    width: 200px;
    margin: 0px auto 20px;
    display: block;
}

.frmContent {
    text-align: center;
    font-size: 16px;
    padding: 0px 10px 20px;
    -webkit-animation-delay: 500ms;
    animation-delay: 500ms;
}

    .frmContent a {
        color: var(--color);
        text-decoration: inherit;
        display: block;
        -webkit-animation-delay: 1.5s;
        animation-delay: 1.5s;
    }

.svg-wrapper {
    position: relative;
    margin: 20px auto 0px;
    width: 520px;
    text-align: center;
    cursor: pointer;
    -webkit-animation-delay: 500ms;
    animation-delay: 500ms;
}

.shape {
    stroke-dasharray: 0 580;
    stroke-dashoffset: 1000;
    stroke-width: 4px;
    stroke: var(--color);
    border-bottom: 5px solid #000;
    transition: stroke-width 2.7s, stroke-dashoffset 2.7s, stroke-dasharray 1.3s;
    transition-delay: 0s;
    fill: transparent;
}

.text {
    font-size: 26px;
    letter-spacing: 8px;
    color: var(--color);
    top: -52px;
    position: relative;
    font-variant: small-caps;
    font-family: "Muli-SemiBold";
    font-weight: 600;
    filter: drop-shadow(0px 0px 1px #CCC);
}

#msgdis {
    color: red;
    font-size: 12px;
    transform: translate(0px, -10px);
    display: block;
}

.form-holder .invldCapt {
    color: red;
    font-size: 12px;
    position: absolute;
    top: 0px;
    transform: translate(0%, -18px);
    left: initial;
}

.shape-border {
    stroke-width: 4px;
    stroke-dashoffset: 0px;
    stroke-dasharray: 520 140;
}
/*.box:hover .content span {
    transform: translateY(20px) translateX(-120%);
    opacity: 1;
    visibility: visible;
}*/
/*# sourceMappingURL=style.css.map */