@font-face {
    font-family: 'Book Antiqua';
    src: url('BookAntiqua.eot');
    src: url('../font/BookAntiqua.eot?#iefix') format('embedded-opentype'),
        url('../font/BookAntiqua.woff2') format('woff2'),
        url('../font/BookAntiqua.woff') format('woff'),
        url('../font/BookAntiqua.svg#BookAntiqua') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Book Antiqua';
    src: url('BookAntiqua-Bold.eot');
    src: url('../font/BookAntiqua-Bold.eot?#iefix') format('embedded-opentype'),
        url('../font/BookAntiqua-Bold.woff2') format('woff2'),
        url('../font/BookAntiqua-Bold.woff') format('woff'),
        url('../font/BookAntiqua-Bold.svg#BookAntiqua-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}
*{box-sizing:border-box;}
body{margin:0;padding:0;background-color:#000;height:100vh;font-family:'Open Sans',sans-serif;overflow: hidden;}
ul{margin:0;padding:0;}
a{text-decoration:none;}
.big-section{display:grid;grid-template-columns:100px 1fr;height:100%;}
.bg .logo-btn-sec{display:flex;justify-content:space-between;margin-top:30px;width:100%;}
.bg{border-radius:50px 0 50px 50px;display:flex;flex-wrap:wrap;width:100%;justify-content:space-between;height:calc(100% - 100px);background:url(../image/latest-bg.jpg) no-repeat top center/cover;}
.btn-group{margin-right:30px;}
.btn-group .global-btn {
    background: rgba(255,255,255,0.33);
    border-radius: 30px;
    margin: 25px 0 0;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    font-size: 28.11px;
    text-transform: uppercase;
    line-height: normal;
    height: 80px;
    width: auto;
    padding: 10px 30px;
    position: relative;
    background-clip: padding-box;
    transition: all 0.3s;
}
.btn-group .global-btn:hover{background:#fff;color:#000;}
.btn-group .global-btn:after{content:"";position:absolute;inset:0;border-radius:30px;padding:4px;background:linear-gradient(90deg,rgba(215,215,215,1) 0%,rgba(243,229,145) 100%);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;}
.bg .logo-btn-sec .logo{margin-left:-95px;}
.bg .logo-btn-sec .logo img{max-height:80px;}
.bg .logo-btn-sec .btn-group .global-btn:first-child{margin-top:0;}
.social-icon ul li a{color:#fff;text-transform:uppercase;font-size:24px;writing-mode:vertical-lr;transform:rotate(180deg);transition:all 0.2s;font-weight: 500;}
.social-icon ul li:hover a{font-weight:bold;border-color:#fff;text-decoration:underline;}
.social-icon ul{position:absolute;left:30px;top:50%;transform:translateY(-50%);}
.social-icon ul li{margin:90px 0;list-style: none;}
.title-wht-sec{display:flex;align-items:end;margin:120px 15px 40px 40px;width:100%;justify-content:space-between;position:relative;}
.title h1{color:#fff;text-transform:uppercase;font-size:75px;margin:0;font-weight:bold;border:2px solid #fff;padding:0 10px;width:fit-content;line-height: 1.2;}
.title h3{color:#fff;font-size:34.82px;font-weight:600;margin:5px 0 0;}
.wht-icon a{width:90px;height:90px;background:rgba(255,255,255,0.25);border-radius:50%;text-align:center;display:flex;justify-content:center;align-items:center;bottom:-75px;position:absolute;right:0;}
.wht-icon i{color:#fff;font-size:50px;}
.wht-icon:hover a{background-color: #fff;}
.wht-icon:hover i{color: #13b214;}
.modal.login-modal
{
	background: #1f1e1e;
    width: 100%;
    margin: auto;
    border-radius: 10px !important;
    max-width: 360px;
	padding: 0;
}
.modal.login-modal a.close-modal
{
	background: #fff;
    border-radius: 100px;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.modal.login-modal a.close-modal:after
{
	display: block;
    content: "\f00d";
    font-family: "Font Awesome 6 free";
    color: #000;
    text-indent: initial;
    font-size: 22px;
    position: absolute;
    font-weight: 800;
}
.modal.login-modal .modal-header
{
	font-family: 'Book Antiqua';
    padding: 15px;
    color: #fff;
    text-align: center;
    font-weight: 800;
    font-size: 24px;
    text-transform: uppercase;
    border-bottom: 1px solid rgb(255 255 255 / 20%);
}
.modal.login-modal .form-material
{
	padding:  30px;
}
.modal.login-modal label
{
	width:  100%;
	color:  #fff;
	margin: 0 0 4px 0;
	display: block;
}
.modal.login-modal .form-group
{
	margin: 0 0 20px 0;
}
.modal.login-modal .form-control
{
	width: 100%;
    min-height: 40px;
    padding: 10px;
    border: none;
    border-radius: 8px;
}
.modal.login-modal .show-notify
{
	text-align: center;
}
.modal.login-modal .show-notify a
{
	text-align: center;
	font-size: 16px;
	border-bottom: 1px solid #7cab09;
	color: #7cab09;
}
.modal.login-modal .form-group .global-btn{
	background: #fff;
    border-radius: 17px;
    margin: 25px 0 0;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #000;
    font-size: 19.11px;
    text-transform: uppercase;
    line-height: normal;
    height: 56px;
    width: auto;
    padding: 7px 25px;
    position: relative;
    background-clip: padding-box;
    transition: all 0.3s;
    margin: 30px auto 0 !important;
    cursor: pointer;
    border:  3px solid #fff;
}
.modal.login-modal .form-group .global-btn:hover{
	background: transparent;
	color:#fff;

}

.desktop-hide{display: none;}
   

/*****responsive-css******/
@media only screen and (max-width:1191px){
 	

}
@media only screen and (max-width:991px){
    .title-wht-sec{margin-top:0;}
    .title-wht-sec h3{font-size:24px;}

    .bg{height:100%;background:url(../image/latest-mobile-bg-4.jpg) no-repeat top right /cover;border-radius:30px 0 0 30px;
       /* margin-top:40px;width:calc(100% - 40px);*/background-position: -50px 0px;
background-size: calc(100% + 51px);}
    .bg .logo-btn-sec .logo{margin-left: -57px;}
    .title-wht-sec .title{top:-44%;position:relative;}
    .btn-group {
    z-index: 1;
    position: absolute;
    margin: 0 auto;
    bottom: 0;
    width: 100%;left: 0;
}
    .wht-icon{padding-top: 30px;}
   .wht-icon a {
    width: 60px;
    height: 60px;
    
    bottom: -20px;
    right: 20px;
}
    .wht-icon i{font-size:32px;}
    .social-icon ul li a{font-size:0;text-align:center;display:block;font-weight:500;position:relative;transform:inherit;}
    .social-icon ul li a:before{position:absolute;font-size:22px;color:#fff;font-family:"Font Awesome 6 Brands";}
    .social-icon ul li .twitter::before{content:"\f099";}
    .social-icon ul li .facebook::before{content:"\f39e";}
    .social-icon ul li .instagram::before{content:"\f16d";}
    .social-icon ul li{margin:140px 0;}
.big-section {
    grid-template-columns: 50px 1fr;
    padding-bottom: 50px;
}
    .social-icon ul{left:12px;}
.title-wht-sec{display:inline-block;margin:0 auto;text-align:center;}
.title-wht-sec h1{margin:0 auto;}
.btn-group .global-btn {
    width: 205px;
    margin: 25px 65px 0;
    background: rgba(61,70,72,0.65);
    text-align: center;
    font-size: 16px;
    height: 50px;
    border-radius: 15px;
}
.btn-group .global-btn::after {border-radius: 15px;}
.wht-icon{text-align:center;display:flex;justify-content:center;}
.desktop-hide{display:block;bottom: 40px;}
.mobile-hide{display:none;}
.title{width:100%;text-align:center;margin-top:50px;}
.title h1{text-align:center;display:block;margin:0 auto;font-size: 45px;}
.bg .logo-btn-sec{display:block;}
.title h3 {    font-size: 22px;}

}
@media only screen and (max-width:767px){
    .bg .logo-btn-sec .logo img {    max-height: 42px;}
    .bg .logo-btn-sec{margin-top: 20px;}
    .title{margin-top: 20px;}
    .wht-icon a{width: 46px;height: 46px;bottom: -26px; position: fixed;right: 17px;bottom: 27px;}
    .wht-icon a i{font-size: 24px;}
    .btn-group{bottom: 60px;width: auto;right: 0;}
    .btn-group .global-btn{margin-left: 80px;}
    .big-section{height: calc(100% - 50px);padding-bottom: 0;}
    .bg{padding: 0 10px;height: 100%;}
}
@media only screen and (max-width:640px){
   .title-wht-sec h1{font-size: 45px;}
   .title-wht-sec h3 {    font-size: 22px;}
  
    .bg .logo-btn-sec .btn-group .global-btn{height:60px;line-height:40px;display:block;padding: 10px 15px;}
    .global-btn{margin-top:20px;}
    .bg .logo-btn-sec .btn-group .global-btn:after{border-radius:20px;}



}

@media only screen and (max-width: 570px){
    .title h3 {       font-size: 22px;   }
    .title h1{font-size: 46px;}
}

@media only screen and (max-width: 530px){
    .title h1{font-size: 40px;}
    .title h3{font-size: 20px;}
}

@media only screen and (max-width: 490px){
    .title h1{font-size: 38px;}
    .title h3{font-size: 19px;}

}
@media only screen and (max-width: 475px){
    .title h1{font-size: 32px;}
    .title h3{font-size: 14px;}

}

@media only screen and (max-width: 410px){
   .title h3 {    font-size: 14px;}
	.title h1{font-size: 28px;}

}
@media only screen and (max-width: 370px){
   .title h3 {    font-size: 13px;}
    .title h1{font-size: 26px;}
    .btn-group{bottom: 50px;}
}