



@font-face {
    font-family: 'proxima_novaregular';
    src: url('../webfonts/proximanova-regular-webfont.woff2') format('woff2'),
         url('../webfonts/proximanova-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'proxima_novasemibold';
    src: url('../webfonts/proxima_nova_semibold-webfont.woff2') format('woff2'),
         url('../webfonts/proxima_nova_semibold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'proxima_novabold';
    src: url('../webfonts/proxima_nova_bold-webfont.woff2') format('woff2'),
         url('../webfonts/proxima_nova_bold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

.barlow-font {
    font-family: "Barlow Condensed", sans-serif;    
    font-style: normal;
}
.barlow-regular{
    font-weight: 400;
}
.barlow-medium{
    font-weight: 500;
}

a, 
button {
  transition: all .3s ease;
}

html {
    scroll-behavior: smooth;
  }
  *{outline: none !important;}
body{
    color: #282828;
    font-size: 16px;
    background: #fff;
    font-family: 'proxima_novaregular';
}

 img{
    max-width: 100%;
    height: auto;
}


.borderRadius-5{
    border-radius: 5px;
}

.ms-10{
    margin-left: 10px;
}
.mb-10{
    margin-bottom: 10px !important;
}

a{
    text-decoration: none;
}

ul,li{
    list-style: none;
    padding: 0;
    margin: 0;
}
.h-52{
    height: 52px !important;
}


/* Login screen */

:root {
    --brand-color: #039;
    --brandSecondary-color: #e1b93d;
  }

.logoWrap{
   justify-content: end;
   /* position: absolute;
   z-index: 10;
   top:-250px;
   right: -60px; */
 
   padding-bottom:80px;
  
   margin-top: -80px;
   

}  

.logoWraps{
  justify-content: center !important;
      padding-bottom: 40px !important;
}


.logo img{
    width: 115px;
    height: 102px;
}

.logos img{
  width: auto !important;
  height: auto !important;
}
.logoName{
     font-size: 40px;
     line-height: normal;
     font-family: 'proxima_novabold';
     padding-left: 15px;
     max-width: 340px;
}


.loginWrapper{
    background: url(../img/bg-loop.svg) no-repeat;
    background-position: right 80px center;
}

.brandBg{
    /* background-color: var(--brand-color); */
    height:100vh;
    width: 55%;
    display: block;
    position: fixed;       
    overflow: hidden;
    /* clip-path: polygon(0 0, 100% 0, 80% 100%, 0% 100%);       */
}


.brandBg_newtheme{
  background-image: url('../img/login-bg.png')  !important;
    background-size: cover;
}
/* .brandBg:after{
    content: "";
    position: absolute;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;
    background: url('../img/formBg.svg') no-repeat right bottom;
    background-size: cover;
} */

  .mainContWrapper{
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 100vh;
  }


  .max-w-1627px{
    max-width: 1627px;
  }


.swiper {
    width: 100%;
    height: 100%;
  }

  .mySwiper{
    position: relative;
    padding-bottom: 40px; /* space for bullets */
  }

  .swiper-pagination {
    position: absolute;
    bottom: 10px; /* adjust as needed */
    left: 0;
    width: 100%;
    text-align: center;
  }

 .mySwiper  .swiper-slide {
    text-align: center;
    font-size: 18px;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .mySwiper .swiper-slide img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius:20px;
    border:6px solid #fff;
  }

  .mySwiper .swiper-pagination-bullet{
    width:25px;
    height:10px; 
    background: #fff;
    border-radius:10px;
    opacity: 1;
    transform:inherit;
  }
  .mySwiper .swiper-pagination-bullet-active{
    background-color:var(--brandSecondary-color);

  }

  .sliderTxt{
     font-size: 36px;
     color: #fff;
     font-family: 'proxima_novabold';
     position: absolute;
     max-width: 90%;
     bottom: 30px;
     line-height: normal;
  }

  .leftWrap{
     width: 645px;
  }

  .rightWrap{

    max-width: 600px;
    width: 100%;
    position: relative;
    z-index: 10;
  }
  .formWrap{
    border-radius: 10px;
    border: 1px solid #D9D9D9;
    background: #FFF;
    position: relative;
    padding: 40px 50px 50px;
  }
  .formWrap::before{
     content:'';
     width: 100%;
     height: 20px;
     border-radius:10px 10px 0 0;
     position: absolute;
     top:-7px;
     left: 0;
     background-color: var(--brandSecondary-color);
     z-index: -1;
  }

  .formHeading{
    font-family: 'proxima_novabold';
    font-size: 36px;
    line-height: normal;
    padding-bottom:15px;
    color: var(--brand-color);
  }

  .forgotTxt a{
    color: var(--brand-color);
    text-decoration: underline;
  }

  .formFieldSec{
    margin-bottom:16px;
  }
  .formFieldSec label{
    margin-bottom:8px;
  }

  .formFieldSec input{
    height: 52px;
    border-radius: 6px;
    border: 1px solid #D9D9D9;
  }

 input:focus{
    box-shadow: none !important;
  }

  .formFieldSec input:focus{
    border: 1px solid #D9D9D9;
  }

  .formFieldBox{
     position: relative;
  }
  .fieldIconRight{
    position: absolute;
    right: 15px;
    top:50%;
    transform: translateY(-50%);
  }

  .formBtn{
    width: 100%;
    height: 52px;
    background-color: var(--brand-color);
    color: #fff;
    font-size: 20px;
    font-family: 'proxima_novasemibold';
    border-radius:6px;
    border: 0;
    margin-top: 20px;
  }
  .formBtn:hover{
    background-color: var(--brandSecondary-color);
  }

  .poweredBy{
    padding-top: 10px;
  }
  .poweredBy .color1{
    color: #6F3562;
    font-family: 'proxima_novabold';
  }
  .poweredBy .color2{
    color: #E1B93D;
    font-family: 'proxima_novabold';
  }

  
.top--1 {
  top: -1px;
}
.link-default {
  color: #282828 !important;
}
a.link-default:hover {
  color: #282828 !important;
}
.link-warn-1{color: var(--brandSecondary-color);}
.link-warn-1:hover{color: var( --brand-color);}


  @media(min-width:1500px) {
    .loginWrapper .container{
        max-width:1600px;
    }
    /* .loginWrapper .max-w-1627px{
        max-width:1685px;
    } */
}

@media (min-width: 1200px) and (max-width: 1399.98px) {
    .leftWrap {
        width: 50%;
    }
    .rightWrap {
        width: 45%;
    }

}

@media(max-width:1600px) {
    .logoWrap{
        margin-right:30px;
        margin-top: -50px;
        padding-bottom: 50px;
    }
    
}

@media(max-width:1399px) {
  .logoWrap{
    margin-right: 0;
    margin-left: 45px;
  }

   .leftWrap{
        width: 473px;
  }
  .rightWrap{
    max-width: 473px;
  }

 
}

@media(max-width:1199px) {
  .logoWrap{ margin-left: 0;}
    .leftWrap{
        display: none;
    }

    .rightWrap{
        margin: 0 auto;
    }
    .logoWrap{
        position: static;
        justify-content: center;
        padding-bottom: 35px;
        flex-direction: column;
    }
    .logo{
        width: 130px;
        min-width:inherit;
        height: 130px;
    }
    .logo img{
        width: 90px;
        height: 80px;
    }
    .logoName{
        font-size: 30px;
        max-width:255px; color: #fff; padding-top: 10px;
    }
    .formHeading {
        font-size: 28px;
    }
    .brandBg {
	background-color: var(--brand-color);
	height: 100vh;
	width: 100%;
	display: block;
	position: fixed;
	overflow: hidden;
	clip-path: polygon(0 0, 100% 0, 0% 100%, 0% 100%);

}
.mainContWrapper{ align-items: start;padding: 0 10px;}
.logoWrap{ margin-top:35px;}

.logos{
  width: 170px !important;
  height: 160px !important;
  background: #fff;
    border-radius: 50%;
}

.logo{ 
    width: 170px;
    min-width:170px;
    height: 170px;
    background: #fff;
    border-radius: 50%;
}
}

@media(max-width:767px) {
    .loginWrapper{
        background: transparent;
    }

    .logo {
        width: 100px;
        height: 100px;
    }
    .logo img {
        width: 70px;
        height: 62px;
    }
    .logoName {
        font-size: 22px;
        max-width:190px;
    }
    .formHeading {
        font-size: 22px;
    }
    .formWrap{
        padding:25px 30px 30px;
    }
.mainContWrapper{ align-items: start;padding: 0 10px;}
.logoWrap{ margin-top: 25px;}
}

@media(max-width:767px) {
    .formWrap {
        padding:20px 25px 25px;
    }
    .formHeading{
        padding-bottom: 8px;
    }
}