@import url('https://fonts.googleapis.com/css?family=Montserrat:100,200,300,400,500,600,700,800,900');
@import url('https://fonts.googleapis.com/css?family=Bitter:400,400i,700');
* {
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

p {
    line-height: 2;
    font-weight: 300;
}

/* Header Style */

header {
    height: 12vh !important;
}
.caption p{
    display: none;
}

.nav li:nth-child(4) a::after {
    content: '';
    position: absolute;
    width: 0;
    height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-bottom: 9px solid #fff;
    bottom: -34px;
    left: 0;
    right: 0;
    margin: auto;
}
.header_olay,.caption{
    display: none;
}
/* Showcase Style */
.showcase_div{
    width: 100%;
    height: 87vh;
}
.flx_class{
    display: flex;
}
.header_div{
   background: url(../images/show-case.jpg);
    background-size: cover !important;
    background-position: center !important;
}
.headings span {
    font-weight: 600;
    color: #2abb9d;   
}
.headings {
    text-transform: uppercase;
    width: 90%;
    margin: auto;
    font-weight: 700;
    font-size: 2.5em;
    color: #fff;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-align: center;
    padding-top: 23%;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-shadow: 1px 1px 5px #404040;
}
.showcase{
    width: 33.33%;
    text-align: center;
    position: relative;
    height: 43.5vh;
    transition: all 2s ease-in-out;
}
.sec_one{
    background: url(../images/showcaseblr-01.jpg);
    background-size: cover;
    background-position: center;
}
.sec_two{
    background: url(../images/showcaseblr-02.jpg);
    background-size: cover;
    background-position: center;
}
.sec_three{
    background: url(../images/showcaseblr-03.jpg);
    background-size: cover;
    background-position: center;
}
.sec_four{
    background: url(../images/showcaseblr-04.jpg);
    background-size: cover;
    background-position: center;
}
.sec_five{
    background: url(../images/showcaseblr-05.jpg);
    background-size: cover;
    background-position: center;
}
.inner_one{
    background: url(../images/showcase-01.jpg);
    background-size: cover;
    background-position: center;
    transition: all .2s ease-in-out;
}
.inner_two{
    background: url(../images/showcase-02.jpg);
    background-size: cover;
    background-position: center;
    transition: all .2s ease-in-out;
}
.inner_three{
    background: url(../images/showcase-03.jpg);
    background-size: cover;
    background-position: center;
    transition: all .2s ease-in-out;
}
.inner_four{
    background: url(../images/showcase-04.jpg);
    background-size: cover;
    background-position: center;
    transition: all .2s ease-in-out;
}
.inner_five{
    background: url(../images/showcase-05.jpg);
    background-size: cover;
    background-position: center;
    transition: all .2s ease-in-out;
}
.inner_sec{
    color: #fff;
    height: 100%;
    z-index: 999999;
}
.displ_head {
    width: max-content;
    width: -moz-fit-content;
    font-size: 1.5em;
    padding-top: 28%;
    position: relative;
    text-transform: uppercase;
    margin: auto;
    font-weight: bolder;
}
.displ_head::before {
    content: '';
    position: absolute;
    width: 82px;
    height: 1px;
    top: 72%;
    left: 0;
    background-color: #fff;
    z-index: 9;
    display: block;
}
.displ_head::after{
    content: '';
    position: absolute;
    width: 82px;
    height: 1px;
    bottom: 0;
    right: 0;
    z-index: 9;
    background-color: #fff;
}
.know_lnk{
    color: #fff !important;
    display: none;
}
.know_lnk::before,.know_lnk::after{
    background-color: #fff !important;
}
.sec_one:hover .inner_sec,.sec_two:hover .inner_sec,.sec_three:hover .inner_sec,.sec_four:hover .inner_sec,.sec_five:hover .inner_sec{
    width: 80%;
    height: 80%;
    border: 5px solid rgba(255,255,255,.5);
    margin: auto;
    margin-top: 7%;
}
.sec_one:hover .know_lnk,.sec_two:hover .know_lnk,.sec_three:hover .know_lnk,.sec_four:hover .know_lnk,.sec_five:hover .know_lnk{
    display: inline;
}
.sec_one:hover .displ_head::before,.sec_one:hover .displ_head::after,
.sec_two:hover .displ_head::before,.sec_two:hover .displ_head::after,
.sec_three:hover .displ_head::before,.sec_three:hover .displ_head::after,
.sec_four:hover .displ_head::before,.sec_four:hover .displ_head::after,
.sec_five:hover .displ_head::before,.sec_five:hover .displ_head::after{
    display: none;
}
/* Popup Style */
.popup{
   width: 100%;
   height: 100%;
   left: 0;
   right: 0;
   top: 0;
   bottom: 0;
   z-index: 999999;
   position: fixed;
   background-color: rgba(0,0,0,.9);
   overflow-y: scroll;
   display: none;
   -webkit-animation-duration: .25s;
    animation-duration: .25s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-name: fadeIn;
    animation-name: fadeIn;
}
@-webkit-keyframes fadeIn {
   0% {transform: scale(0,0);}
   100% {transform: scale(100%,100%);}
}

@keyframes fadeIn {
    0% {transform: scale(0,0);}
   100% {transform: scale(100%,100%);}
}
.popup_inner{
   width: 80%;
   margin: 0 auto;
   padding: 100px 0 100px 0;
}
.popup_sec {
    width: 40% !important;
    padding: 20px !important;
    background: #fff;
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#144d7e', endColorstr='#34ac9b',GradientType=1 );
    padding-bottom: 60px;
    position: absolute;
    top: 50px;
    left: 0;
    z-index: 9999;
    padding: 50px 0;
    border-radius: 5px;
    right: 0;
    margin: auto;
}
.pop-cls{
    position: absolute;
    right: 3%;
    top: 4%;
    color: #218dc7 !important;
    font-size: 25px;
    cursor: pointer;
}
.popup_sec h1 {
    text-align: center;
    font-size: 25px;
    color: #218dc7 !important;
    margin-bottom: 40px;
    text-transform: uppercase;
    font-weight: 700;
}
.subs_form {
    text-decoration: none;
    color: #fff;
    text-align: center;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
.subs_form div{
    width: 100%;
    display: flex;
    justify-content: space-between;
}
.subs_form div input{
    width: 47%;
}
.left_frm,.right_frm{
    width: 48%;
}
.right_frm div,.left_frm div{
    display: flex;
    justify-content: space-between;
}
.place_div select,.place_div input{
    width: 47% !important;
}
.cp_div input{
    width: 46% !important;
}
.subs_form input {
    display: block;
    width: 99%;
    margin-bottom: 30px;
    height: 30px;
    padding-left: 1%;
    background-color: transparent;
    border: 1px solid #218dc7;
    color: #000;
}
.subs_form select{
    display: block;
    width: 48%;
    margin-bottom: 30px;
    height: 34px;
    border: none;
    border: 1px solid #fff;
    outline: none;
    background-color: transparent;
    -webkit-appearance: none;
    border-radius: 0;
    position: relative;
    background: url(../images/caret-down.png);
    background-repeat: no-repeat;
    background-position: right 5px center;
    background-size: 10px;
    padding-left: 1%;
    color: #000;
}
.subs_form textarea{
    display: block;
    width: 100%;
    height: 30px !important;
    border: none;
    outline: none;
    border: 1px solid #218dc7;
    height: 100px !important;
    background-color: transparent;
    padding-left: 1%;
    color: #000;
    margin-bottom: 30px;
}
.subs_form button {
    margin: auto;
    display: block;
    width: 20%;
    color: #fff;
    border: none;
    padding: 10px 0;
    font-size: 15px;
    text-transform: uppercase;
    cursor: pointer;
    float: right;
    background-color: #2abb9d;
    border: 1px solid #2abb9d;
}
button:before, button:after {
    border-color: #2abb9d !important;
}
button:hover:before, button:hover:after {
    border-color: #00bb9f !important;;
}
.subs_form button:hover{
    border: none;
    background-color: #00BB9F;
    color: #fff;
    border: 1px solid #00BB9F;
}
.note{
    color: #fff;
    margin-left: 10%;
    width: 60%;
    margin-top: 20px;
}
::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: #bdbdbd;
}
::-moz-placeholder { /* Firefox 19+ */
  color: #bdbdbd;
}
:-ms-input-placeholder { /* IE 10+ */
  color: #bdbdbd;
}
:-moz-placeholder { /* Firefox 18- */
  color: #bdbdbd;
}
/* Media Query */
@media only screen and (max-width:1024px){
    .header_div h1{
        font-size: 2em;
    }
    .displ_head::before{
        top: 62%;
    }
}
@media only screen and (max-width:768px){
    .flx_class {
        display: block;
    }
    .header_div{
        width: 100%;
        padding: 50px 0;
    }
    .flx_class:nth-child(1) .showcase {
        width: 100%;
    }
    .showcase{
        width: 100%;
    }
    .displ_head{
        padding-top: 15%;
    }
    .displ_head::before{
        top: 69%;
    }
    .popup_sec{
        width: 70% !important;
        padding: 10% 3% !important;
    }
}
@media only screen and (max-width: 483px){
    .displ_head {
        padding-top: 27%;
    }
    .header_div h1 {
        font-size: 1.5em;
        margin-top: 0;
    }
    .showcase_div{
        margin-top: -8px;
    }
    .subs_form div{
        display: block;
    }
    .subs_form div input{
        width: 100%;
    }
    .subs_form button{
        width: 40%;
    }
    .popup_sec{
        width: 90% !important;
    }
}







