/*Rest style*/
* { margin: 0; padding: 0; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; list-style: none; }
* { -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
html, body.em, .em span, .em applet, .em object, .em iframe, .em h1, .em h2, .em h3, .em h4, .em h5, .em h6, .em p, .em blockquote, .em pre, .em a, .em abbr, .em acronym, .em address, .em big, .em cite, .em code, .em del, .em dfn, .em em, .em font, .em img, .em ins, .em kbd, .em q, .em s, .em samp, .em small, .em strike, .em strong, .em sub, .em sup, .em tt, .em var, .em dl, .em dt, .em dd, .em ol, .em ul, .em li, .em fieldset, .em form, .em label, .em legend, .em table, .em caption, .em tbody, .em tfoot, .em thead, .em tr, .em th, .em td, .em select, .em input, .em option { margin: 0; padding: 0; border: 0; outline: 0; }
html { -webkit-text-size-adjust: none; }
.em nav ul, .em nav ol { list-style: none; list-style-image: none; }
.em button, .em input, .em select, .em textarea { font-size: 100%; margin: 0; vertical-align: baseline; box-shadow: none !important; }
.em input[type="button"], .em input[type="submit"] { -webkit-appearance: none !important; }
.em :focus { outline: 0; }
.em ol, .em ul { list-style: none; }
.em a { text-decoration: none; }
.em img { border: 0 none; max-width: 100%; vertical-align: top; }
.em a { outline: none; cursor: pointer; }
.em a:hover { text-decoration: none; }
.em a:focus { text-decoration: none !important; outline: none !important; }
.em .clear { clear: both; }
.em .preloader { display: none; }


/* Table of Content
 ==================================================
 #Page Structure
 #Home Page Style */


/* #Page Structure
================================================== */
body.em { margin: 0; padding: 0; font-size: 16px; color: #060202; font-family: 'FS Jack', sans-serif;}
.em .wrapper { width: 100%; opacity: 1;transition: all ease-in-out 0.5s; -webkit-transition: all ease-in-out 0.5s; -moz-transition: all ease-in-out 0.5s;	}
.em .main { max-width: 1170px; margin: 0 auto; }
.em a{transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; -o-transition: 0.5s;}
.em h1{ color:#263e82; font-size:36px; font-weight:600; padding-bottom:20px;}
.em .common-btn{ display: inline-block; }

/* Home Page Style
 ==================================================

/***** midd container styles goes here *****/
.midd-container{
    width: 100%;
    height: 100vh;
    height: calc(var(--vh, 1vh) * 100);
    position: relative;
    text-align: center;
    z-index: 1;
    overflow: hidden;
}
.midd-container::after{
    background: linear-gradient(72.31deg, rgba(255, 11, 100, 0.75) 30.48%, rgba(1, 0, 68, 0.81) 86.83%);
    opacity: 0.88;
    transform: matrix(-1, 0, 0, 1, 0, 0);
    position: absolute;
    content: '';
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
}
.midd-container .banner__background-video {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    -o-object-fit: cover;
    object-fit: cover;
    max-width: 100%;
}
.mid-box{
    display: inline-block;
    max-width: 600px;
    width: 100%;
    text-align: center;
    margin: 0 auto;
    z-index: 1;
    
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    transform: translateY(-50%);

}
.mid-box p{
    font-style: normal;
    font-weight: 400;
    font-size: 26px;
    line-height: 31px;
    text-align: center;
    text-transform: uppercase;
    color: #FFFFFF;
    padding-bottom: 15px;
}
.mid-box .logo{
    width: 100%;
    max-width: 531px;
}
.skew{
    -ms-transform: skewX(-20deg); /* IE 9 */
    -webkit-transform: skewX(-20deg); /* Safari */
    transform: skewX(-20deg);
    border: 1.5px solid #fff;
    display: inline-block;
    width: 275px;
    transition: all ease-in-out 0.5s; -webkit-transition: all ease-in-out 0.5s; -moz-transition: all ease-in-out 0.5s;
}
.skew a.skewinner {
    -ms-transform: skewX(20deg); /* IE 9 */
    -webkit-transform: skewX(20deg); /* Safari */
    transform: skewX(20deg);
    display: flex;
    padding: 20px;
    font-weight: 400;
    font-size: 16px;
    line-height: 19px;
    text-align: center;
    transition: all ease-in-out 0.5s; -webkit-transition: all ease-in-out 0.5s; -moz-transition: all ease-in-out 0.5s;
    color: #FFFFFF;
    vertical-align: middle;
    align-items: center;
    text-align: center;
    justify-content: center;
}
.skew:hover {
    background-color:rgba(1, 0, 68, 0.4) ;
    
}
/* .skew a.skewinner:hover{
    background-color:#010044 ;
    
} */
.inner-box{
    position: absolute;
    bottom: 20px;
    margin: 0 auto;
    width: 90%;
    left: 0;
    right: 0;
    z-index: 1;
}
.socials{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    
    width: 80px;
    right: 0;
    z-index: 1;
}
.socials ul{
    display: flex;
    
    flex-direction: column;
}
.socials ul li{
    margin-bottom: 20px;
    display: inline-block;
    text-align: right;
}
.socials ul li:last-child{
    margin-bottom: 0px;
}
.socials ul li a{
    display: inline-block;
    padding: 17px 19px 19px 35px;
    background-image: url('../images/arrows.png');
    background-size: cover;
    background-repeat: no-repeat;
    font-size: 0;
    line-height: 0;
}
.socials ul li a img{
    width: 100%;
    max-width: 16px;
}
.socials ul li a:hover{
    background-image: url('../images/arrows-hv.png');
}
/*****footer styles goes here *****/
