body{font-family: 'Open Sans', sans-serif!important;
}
/*welcome page css*/


.welcome{
    background-image: url(../images/landing-bg.jpg);
    position: relative;
    width: 100%;
    height: 100vh;
    background-size: 100% 100%;
    background-repeat: no-repeat;
 }

.alllinks{
    position: absolute;
    bottom: 15%;
    left: 12%;
    width: 39%;
}
.welcome-img{width: 85%;}
.welcome-text{
    position: absolute;
    top: 24%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
}
.calender{
    position: absolute;
    width: 15%;
    bottom: 27%;
    left: 24%;
}

.addeventatc {
    font-size: 11px!important;
    padding: 7px 9px 7px 35px!important;
    position: absolute!important;
    left: 23.7%!important;
    top: 75%!important;
    width: 11.5%;
    height: 4.4%;
    border-radius: 50px!important;
    background: transparent!important;
    /* font-weight: bold!important; */
}
.btn-download{background: #b82127;
    color: #fff;
    padding: 5px 20px;
    font-size: 16px;
    border-radius: 3px;
    text-align: center;
}
.btn-download:hover, .btn-download:focus{color: #fff;}
.welcome-btn{
    position: absolute;
    top: 50%;
    left: 79%;
    transform: translate(-50%, -50%);
    text-align: center;
    font-size: 16px;
    width: 40%;
}

   .err_msg{ display: none; }

/*.btn-login{background: #fff;
    color: #120086;
    padding: 6px 20px;
    border-radius: 50px;
    font-family: 'Quicksand', sans-serif;
    }*/
.btn-login img{width: 260px;}  
.btn-unable{
    position: absolute;
    top: 56.5%;
    left: 86%;
    transform: translate(-50%, -50%);
    width: 6%;
    height: 3%;}  
.btn-submit{
    background: transparent;
    border:none;
/*    padding: 2px 10px;
    border: none;
    color: #222;
    font-weight: bold;
    font-size: 11px;
    border-radius: 3px;
    float: right;*/
}
.btn-submit:focus{border:none; outline:none;}

.btn-submit img{width: 50%;}
/*.register-img img{width: 140px!important;}*/

.lobby-gif{ position: absolute;
    top: 19.6%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 41%;}

.ring-container{
    position: absolute;
    top: -14%;
    left: 31%;
    transform: translate(-50%, -50%);
    text-align: center;
}
.ring-main{
    top: 40%!important;
    left: 40%!important;

}
.circle{
    width: 15px;
    height: 15px;
    background-color: #244789;
    border-radius: 50%;
    position: absolute;
    top: 20px;
    left: 20px;
}

.ringring{
    border: 3px solid #244789;
    -webkit-border-radius: 30px;
    height: 25px;
    width: 25px;
    position: absolute;
    left: 15px;
    top: 15px;
    -webkit-animation: pulsate 1s ease-out;
    -webkit-animation-iteration-count: infinite; 
    opacity: 0.0
}
@-webkit-keyframes pulsate {
    0% {-webkit-transform: scale(0.1, 0.1); opacity: 0.0;}
    50% {opacity: 1.0;}
    100% {-webkit-transform: scale(1.2, 1.2); opacity: 0.0;}
}

.countdown-1 {
  display: flex;
  padding: 20px;
  justify-content: center;
  align-content: center;
  align-items: center;
}

.countdown-1 .days,
.countdown-1 .minutes,
.countdown-1 .hours,
.countdown-1 .seconds {
  width: 80px;
}

.countdown-1 .amount,
.countdown-1 .label {
  display: block;
  font-size: 12px;
  text-align: center;
}

.countdown-1 .amount {
  font-size: 24px;
}

/**
 * Concept 2
 */
.countdown-2 {
  display: flex;
  background: #fff;
  padding: 20px;
  justify-content: center;
  align-content: center;
  align-items: center;
  font-family: "Courier New", mono;
}

.countdown-2 .label {
  display: none;
}

.countdown-2 .amount {
  font-size: 24px;
}

.countdown-2 .hours .amount::before,
.countdown-2 .minutes .amount::before,
.countdown-2 .seconds .amount::before {
  content: ":"
}

/**
 * Concept 3
 */
.countdown-3 {
  --colour-days: calc(var(--countdown-percent-days) * 255);
  --colour-hours: calc(var(--countdown-percent-hours) * 255);
  --colour-minutes: calc(var(--countdown-percent-minutes) * 255);
  --colour-seconds: calc(var(--countdown-percent-seconds) * 255);
  --colour: calc(var(--countdown-percent) * 255);
  --length: calc(var(--countdown-percent) * 100%);
  display: flex;
/*   background: #fff; */
  padding: 0;
  justify-content: center;
  align-content: center;
  align-items: center;
  /*position: relative;*/
  position: absolute;
  top: 55%;
  left: 74%;
  transform: translate(-50%,-50%);
  overflow: hidden;
  font-family: "Brandon Grotesque", Arial;
}

.countdown-3 .days,
.countdown-3 .hours,
.countdown-3 .minutes,
.countdown-3 .seconds {
  margin: 6px;
}

.countdown-3 .amount {
  display: inline-flex;
  justify-content: center;
  align-content: center;
  align-items: center;
  position: relative;
  /* width: 64px; */
  height: 52px;
  font-size: 50px;
  /*font-family: Belwe, "Times New Roman";*/
  font-family: 'Oswald', sans-serif;
  line-height: 0.8em;
}

.countdown-3 .amount::after {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  /*top: 50%;*/
  width: 100%;
  /*margin-top: -1px;
  border-top: solid 1px rgba(200, 200, 200, 0.5);
  border-bottom: solid 1px rgba(0, 0, 0, 0.3);*/
  z-index: 1;
}

.countdown-3 .digit,
.countdown-3 .digit[data-countdown-next-digit]::after {
  display: flex;
  justify-content: center;
  align-content: center;
  align-items: center;
  position: relative;
  width: 50px;
  height: 70px;
  margin: 1px;
  /*background: #051C2C;*/
  background: #31518f;
  border-radius: 2px;
  color: #eee;
  text-align: center;
  overflow: hidden;
}

.countdown-3 .digit[data-countdown-next-digit]::after {
  display: none;
  content: attr(data-countdown-next-digit);
  position: absolute;
  left: 0;
  top: 0;
/*
  animation-name: ticker-digit;
  animation-delay: 0;
  */
}

.countdown-3 .label {
  display: block;
  padding-top: 2px;
  font-size: 14px;
  color: #000;
  text-align: center;
  text-transform: uppercase;
  font-family: 'Jost', sans-serif;
  font-size: 14px;
  margin-bottom: 15px;
}


.brand{font-size: 12px;
    position: fixed;
    bottom: 1%;
    right: 2%;
    color: #fff;
    margin: 0;
    /* font-weight: 900; */
    padding: 2px 10px;
    background: #000;
    border-radius: 20px;}
.brand a {
    width: 42px;
    display: inline-block;
}
.btn-click{
    border-radius: 2px solid #000;
    color: #1b83c5;
    border: 1px solid #1b83c5;
    padding: 8px 15px;
    border-radius: 10px;font-family: 'Quicksand', sans-serif;

}
.btn-login:hover{text-decoration: none;}
.btn-click:hover{text-decoration: none; background:#1b83c5; transition: .3s; color: #fff;}


/*login page css*/

.login-banner{
    background-image: url(../images/login-bg.jpg);
    position: relative;
    width: 100%;
    height: 100vh;
    background-size: 100% 100%;
    background-repeat: no-repeat;
 }
 .regis-banner
 {
    background-image: url(../images/register-bg.jpg);
    position: relative;
    width: 100%;
    height: 100vh;
    background-size: 100% 100%;
    background-repeat: no-repeat;
     
 }

.form-banner {
    background-image: url(../images/Login-Box.png);
    background-size: 100% 100%;
    position: absolute;
    top: 50%;
    left: 76%;
    width: 38%;
    transform: translate(-50%, -50%);
    background-repeat: no-repeat;
    /* background: #5738d4; */
    color: #fff;
    border-radius: 8px;
    padding: 5px;
}
/*.form-banner form{border-radius: 8px;
    border: 1px solid #fff;
    padding: 5px;
    font-size: 12px;
}*/
/*.submit button{background: #234789;
   color:#fff; font-weight: normal;
   font-size: 16px; padding: 5px 20px;
   position: relative; top: 0; border-radius: 3px;opacity: 1;}*/

#feedback table tr td{border-top: 1px solid #337ab7; line-height: 26px; }
#feedback table tr td input::placeholder{color: #777;}

.border-b {
    border: 0;
    height: 1px;
    border-bottom:1px solid #333!important;
    font-weight: bold;
    /*background-image: linear-gradient(to right, rgba(0, 0, 0, 0), #fff, rgba(0, 0, 0, 0));*/
}
hr{margin-top: 0px; margin-bottom: 8px;}

.register{position: absolute;
    top: 50%!important;
    left: 80%!important;
    width: 34%;
    transform: translate(-50%, -50%);}

.form-content{position: absolute;
    top: 73%;
    left: 73%;
    transform: translate(-50%, -50%);
}

.check-input{left: 0%; position: absolute;
    top: 97%;
    transform: translate(-50%, -50%);}

.form-h4{color: #fff;font-size: 15px; text-align: center;}
/*.form-content form{padding: 10px;}*/
.form-content table tr td{ color:#000;font-size: 12px;padding:0px 6px 0px 6px;width: 50%;}
.login-form table tr td{ color:#000;font-size: 9px;padding:0px 0px 0px 6px;}    
.otp{text-align: right; float: right;}

.form-content table tr td:nth-child(3){width: 16%;}
/*.login-form{    position: absolute;
        right: 20px;
    top: 28%;
    width: 52%;
}*/


form input::placeholder{ padding: 5px 0px; font-size: 11px; }
.login-form input::placeholder{padding: 5px 0px; font-size: 14px; color: #333; font-weight: 500;}

.form-control{
    height: 36px;
    margin-bottom: 3px;
    padding: 2px 4px;
    color: #000;
    font-weight: 400;
    border: none;
    border-bottom: 1px solid #333;
    font-size: 15px; 
    border-radius: 0px;
    background: transparent;
    box-shadow:none;
}

.sign-up{color: #b82127; font-size: 15px; font-weight: bold;margin-bottom: 20px;margin-right: 6px;}
.sign-up:hover{color:#b82127;}
.login-title{font-size: 16px; color: #333; font-weight: bold;margin-bottom: 20px;margin-left: 6px;}
.login-title2{float: right; color: #000;font-weight: 600;font-size: 15px;}
.login-form tr td input:focus{outline: none;box-shadow: none;}

.login-form table{margin-top: 25px;}
.form-control2{
    height: 39px;
    margin-bottom: 3px;
    padding: 2px 4px;
    color: #111;
    border: none;
    font-size: 16px;
    font-weight: 400;
    background: transparent;
    border-bottom: 1px solid #333;
    border-radius: 0px;
    width: 100%;
    font-family: 'Jost', sans-serif;
}
.register table tr td input::placeholder{font-size: 15px;color:#555; font-weight: 400;}
.register table tr td input:focus{outline: none;}

.login-table{margin-top: 40px;}
.btn-default{
    background: #398bf7;
    color: #000;
    border: 1px solid #398bf7;
    box-shadow: 1px 3px 3px #6819e7;
    padding: 0px 5px;
    font-weight: bold;
    font-size: 12px;
}
.btn-feedback{width: 160px;}
.btn-agenda{width: 157px;margin-top: -3px;}

 /*lobby page css*/
.lobby-banner{
    background-image: url(../images/lobby-bg.jpg);
    position: relative;
    width: 100%;
    height: 100vh;
    background-size: 100% 100%;/*
    background-repeat: no-repeat;*/
 }
.btn-auditorium{     position: absolute;
    top: 51%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 23%;
    height: 24%;
    cursor: pointer;
}
.btn-agenda{   
    position: absolute;
    top: 64%;
    left: 23%;
    transform: translate(-50%, -50%);
    width: 12%;
    height: 25%;
    cursor: pointer;
}
.btn-episodes{    position: absolute;
    top: 71%;
    left: 79.7%;
    transform: translate(-50%, -50%);
    width: 12%;
    height: 38%;
    cursor: pointer;}


#video, #enter_to_audi{display: none;}
video{width: 100%;}
.noscroll{overflow: hidden;}
#lobby_v { background: rgba(0,0,0,0.8);margin: 0;}

/*#success{position: fixed;
    top: 0;
    left: 0;
    z-index: 1;
    background: green;
    width: 100%;
    color: #fff;
    padding: 12px;
    font-size: 16px;
    transition: .6s;
    margin:0px;
    display: none;
}*/

.customAlert {
    display: none;
    position: fixed;
    /* transform: translate(-50%, -50%); */
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    /* box-shadow: 0px -1px 20px rgba(0,0,0,.5); */
    padding: 5% 17%;
    background: rgba(0,0,0,0.9);
}
.confirmButton {position: absolute;
    background: #fff;
    border: 1px solid #fff;
    color: #000;
    border-radius: 50%;
    font-weight: bold;
    padding: 0px 7px;
    font-size: 16px;
    cursor: pointer;
    top: 7%;
    right: 15.4%;
}


  @media all and (max-width: 1300px){
    .message{
      font-size: 14px !important;
    }
   }
  
  .message{
    padding: 5px;
    color: white;
    font-size: 14px;
    line-height: 20px;
    text-align: justify;
  }
    
    
.rab{
  width: 200px;
  height: 30px;
  outline: 0;
  border: 0;
  color: white;
  background: darken(#04B486, 5%);
}

.confirmButton:hover{text-decoration: none;}


@keyframes fadeOut{
    from{
    opacity: 1;
  } 
  to{
    opacity: 0;
  }
}
    
@keyframes fadeIn{
    from{
    opacity: 0;
  } 
  to{
    opacity: 1;
  }
}


/*.modal-body{    height: 530px;
    overflow-y: scroll;}*/

/* Scrollbar Styling */
::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}
 
::-webkit-scrollbar-track {
    background-color: #ebebeb;
    -webkit-border-radius: 10px;
    border-radius: 10px;
}

::-webkit-scrollbar-thumb {
    -webkit-border-radius: 10px;
    border-radius: 10px;
    background: #244788; 
}

.carousel-caption {
    position: static!important;
    right: 15%;
    left: 15%;
    z-index: 10;
    color: #fff;
    text-align: center;
    text-shadow: 0 1px 2px rgba(0,0,0,.6);
    padding-top: 0px!important;
    padding-bottom: 0px!important;}

.home_icon-white{
    width: 3%;
    height: 5%;
    background: url(../images/home-icon-blue.png) no-repeat;
    background-size: 100% 100%;
    position: fixed;
    right: 5%;
    top: 5%;
    display: block;
    z-index: 1;}



/*audi1 page css*/ 
.audi-banner1{
    background-image: url(../images/audi-bg.jpg);
    position: relative;
    width: 100%;
    height: 100vh;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    background-position: center center;
 }
.audi-top-screen1 {
    width: 50%;
    position: absolute;
    top: 45%;
    left: 48.5%;
    transform: translate(-50%, -50%);
}
.btn-lobby{    position: absolute;
    top: 94%;
    left: 50%;
    transform: translate(-50%,-50%);}

.home{position: absolute;
    top: 4%;
    left: 10%;
    transform: translate(-50%, -50%);
    width: 50px;
    height: 40px;
    cursor: pointer;
}
button.close {
    background: #fff;
    border-radius: 50%;
    padding: 1px 5px;
    padding: 1px 6px;
    font-size: 23px;
    opacity: 1;
    z-index: 1;
    border:1px solid #000;
}
.close {
    position: absolute;
    float: right;
    right: -20px;
    top: -20px;
}

.close2{ background: #fff;
    position: relative;
    margin-top: -20px;
    border: 1px solid #000;
    opacity: 1;
    border-radius: 50%;
    padding: 0px 5px;
    margin-top: -20px;}

.iframe_v{width: 100%; height: 980px;}

/*.home-icon a{
    position: absolute;
    width: 36px; top: 4%; left: 10%; transform: translate(-50%, -50%); 
  }*/

.blinking {
  -webkit-animation: 1s blink ease infinite;
  -moz-animation: 1s blink ease infinite;
  -ms-animation: 1s blink ease infinite;
  -o-animation: 1s blink ease infinite;
  animation: 1s blink ease infinite;
  
}

@keyframes "blink" {
  from, to {
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  from, to {
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
}

@-webkit-keyframes "blink" {
  from, to {
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
}

@-ms-keyframes "blink" {
  from, to {
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
}

@-o-keyframes "blink" {
  from, to {
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
}










@media(max-width: 991px){
 
.login-title, .sign-up{font-size: 12px;}
.login-title2{font-size: 12px;}

.btn-submit img {
    width: 35%;
}
.ringring {
    width: 20px;
    height: 20px;
}
.circle {
    width: 10px;
    height: 10px;
}
.ring-main{top: 35%!important; left:37%!important;}
.ring-container{top: 5%;
    left: 19%;}

.modal-dialog{margin: 30px auto;}

.countdown-3 .label{font-size: 8px; margin-bottom: 2px;}
.countdown-3 .amount{font-size: 16px;}
.countdown-3 .digit,
.countdown-3 .digit[data-countdown-next-digit]::after {
  width: 20px;
  height: 40px;
}
.btn-audi1{left: 34%;}
.btn-audi1 img {width: 28%; }
.login-form table tr td{font-size: 9px;}
.welcome-text{top: 20%;}
/*.welcome-btn{font-size: 12px; top:35%;}*/
.btn-login{padding: 5px 12px;font-size: 9px;}
.btn-click{padding: 6px 10px;}
/*.form-content form{width: 50%;}*/
.form-banner{left: 80%; width: 38%;}
.form-h4{font-size: 10px;margin:3px;}
hr{margin-bottom: 3px;}
.form-control {
    height: 19px;
    margin-bottom: 2px;
    width: 100%;
    padding: 2px;
    font-size: 12px;
    border-radius: 1px;
}
.login-form table {
    margin-top: 30px;
}
.login-table{margin-top: 10px;}

.form-control2{height: 19px;font-size: 10px;}

.register{width: 40%;top: 50%!important;left: 79%!important;}
.register table tr td input::placeholder{font-size: 9px;}
/*.register-img img{width: 62px!important;}*/
.err_msg{font-size: 5px;}
.login-form{left: 0%;}
.btn-submit{font-size: 7px;padding: 1px 10px;}

.login-form table tr td input::placeholder{font-size: 9px;}
.form-content table tr td{font-size: 7px; padding: 0px 1}
.btn-feedback{width: 70px;}
.btn-agenda{width: 92px;}

.form-content form{padding: 0px;}
.form-content form table tr td { padding:0px;text-align: right; }
.btn-blue{font-size: 10px;
       padding: 7px 15px;
       margin: 0px;
       cursor: pointer;
   }
.btn-login img { width: 140px; } 
.btn-unable{font-size: 9px;}   
.btn-lobby{top: 95%;}
.check-input{top: 106%;}

.customAlert{padding: 9% 17%;}
.confirmButton{top: 10%;
    right: 13.4%;}

/*.audi-top-screen1{ top: 48%;
    width: 207px;
    height: 136px;
    margin-left: 4px;
}*/

.lobby-top-screen{top: 45%;}
/*.audi-top-screen1 {
    width: 29%;
    position: absolute;
    top: 41%;
}*/

#agenda .modal-dialog{margin:30px auto!important; width: 70%!important;}
#speaker .modal-dialog{margin:30px auto!important; width: 70%!important;}
#episode .modal-dialog{margin:30px auto!important; width: 70%!important;}
#feedback .modal-dialog{margin:30px auto!important; width: 70%!important;}

}
.clicktoenter a{
    position: absolute;
    width: 24%;
    height: 24%;
    top: 39%;
    left: 38%;
   
}
.agenda_speaker a{
    position: absolute;
    width: 12%;
    height: 37%;
    top: 52%;
    left: 15%;
    
}




@media(min-width: 320px) and (max-width: 900px) {
    /*.audi-top-screen1 { height:33%; }*/
    .btn-audi { top: 8%; right: 0%; font-size: 11px; padding: 5px 20px; }
    /*.modal-body{height: 300px;}*/
    .modal-dialog{margin:0 auto;}
/*.iframe_v{width: 50%; height: 100px;}*/

.alllinks{
    bottom: 2%;
}
}





@media (min-width:0px) and (max-width:900px) and (orientation: portrait) {
.rotate-device{    position: absolute;
    left: 0;
    top: 0;
    width: 103%;
    height: 100%;
    text-align: center;
    background: #fff;
    display: block;
    z-index: 5;
    transform: scale(1,1);}
.rotate-device:before{    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    position: absolute;
    content: "";
    background: url('../images/Rotate.png'   ) center center no-repeat;
    background-size: 70%;}


}


   .bg-img {
  /* The image used */
   background-image: url(../images/Login-page.jpg) no-repeat;

/* Center and scale the image nicely */
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
}