img{
  width:100%;
}
body{font-family: 'Open Sans', sans-serif!important;
}
/*welcome page css*/
.lobby-footer {
  display: flex;
  width: 40%;
  position: fixed;
  left: 30%;
  bottom: 2%;
  flex-wrap: wrap;
  justify-content: space-between;
}

.lobby-footer a {
  width: 30%;
}
.audi-footer {
  display: flex;
  width: 40%;
  position: fixed;
  left: 30%;
  bottom: 2%;
  flex-wrap: wrap;
  justify-content: space-between;
}
.audi-footer a {
  width: 30%;
}

.login-banner abbr {
  color: #000;
}


.medgenome-banner{
  background-image: url(../images/Resource-Center.jpg);
  position: absolute;
  width: 100%;
  height: 100vh;
  background-size: 100% 100%;
  background-repeat: no-repeat;
}

.speaker-banner{
  background-image: url(../images/Speaker-Slide.jpg);
  position: absolute;
  width: 100%;
  height: 100vh;
  background-size: cover; 
  background-repeat: no-repeat;
}
.medgenome-footer {
  display: flex;
  width: 35%;
  position: fixed;
  left: 45%;
  bottom: 2%;
  flex-wrap: wrap;
  justify-content: space-between;
}

.medgenome-footer a {
  width: 25%;
}


.back-icon {
  position: absolute;
  width: 3%;
  top: 3%;
  left: 2%;
}
.welcome{
  background-image: url(../images/landing-bg.jpg);
  position: absolute;
  width: 100%;
  height: 100vh;
  background-size: 100% 100%;
  background-repeat: no-repeat;
}
.welcome-img{width: 85%;}
.welcome-text{
  position: absolute;
  top: 24%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
}
.aaa
{
  margin-left: 159px;
  font-size: 14px;
}
.welcome-btn{
 position: absolute;
 top: 53%;
 left: 30%;
 transform: translate(-50%, -50%);
 text-align: center;
 font-size: 16px;
 width: 37%;
 font-family: 'Jost', sans-serif;
}
.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: 113%;}  
.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: 60%;}
/*.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: 83%;
left: 34%;
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: 42px;
/*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: #007bff;
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;
font-weight:600;
}


.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-page.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;
   
}


 .user_card {
    height: 400px;
    width: 350px;
    margin-top: auto;
    margin-bottom: auto;
    background: #f39c12;
    position: relative;
    display: flex;
    justify-content: center;
    flex-direction: column;
    padding: 10px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    -webkit-box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    -moz-box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    border-radius: 5px;

  }
  .brand_logo_container {
    position: absolute;
    height: 170px;
    width: 170px;
    top: -75px;
    border-radius: 50%;
    background: #60a3bc;
    padding: 10px;
    text-align: center;
  }
  .brand_logo {
    height: 150px;
    width: 150px;
    border-radius: 50%;
    border: 2px solid white;
  }
  .form_container {
    margin-top: 100px;
  }
  .login_btn {
    width: 100%;
    background: #d5332a !important;
    color: white !important;
  }
  .login_btn:focus {
    box-shadow: none !important;
    outline: 0px !important;
  }
  .login_container {
    padding: 0 2rem;
  }
  .input-group-text {
    background: #fff !important;
               color: #212529 !important;
  border: 1 !important;
  border-radius: 0.25rem 0 0 0.25rem !important;
  }
  .input_user,
  .input_pass:focus {
    box-shadow: none !important;
    outline: 0px !important;
  }
  .custom-checkbox .custom-control-input:checked~.custom-control-label::before {
    background-color: #c0392b !important;
  }


.form-banner {
 background-size: 100% 100%;
 position: absolute;
 top: 46%;
 right: -1%;
 width: 28%;
 transform: translate(-50%, -50%);
 background-repeat: no-repeat;
 /* color: #fff; */
 border-radius: 8px;
}
/*.form-banner form{border-radius: 8px;
  border: 1px solid #fff;
  padding: 5px;
  font-size: 12px;
}*/

.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%);
}
.heading{
  color:#000;
  font-weight: 700;
}
.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: 12px;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: 30px;
  margin-bottom: 15px;
  padding: 2px 15px;
  color: #000;
  font-weight: 400;
  border: none;
  border: 1px solid #e9ecef;
  font-size: 15px; 
  /*border-radius: 0px;*/
  /*background: #dddddd;*/
  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: 50px;}
.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: fixed;*/
  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: 71%;
  left: 20.7%;
  transform: translate(-50%, -50%);
  width: 12%;
  height: 38%;
  cursor: pointer;
}
.btn-episodes{    

position: absolute;
  top: 51%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 102%;
  height: 111%;
  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%;
}
.question{
      position: absolute;
  bottom: 2%;
  left: 41%;
  width: 20%;
}

@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);
  background-color: #000;
  height: 100vh;
  position: relative;
  width: 100%;
  /* height: 100vh; */
  background-size: 100% 100%;
  background-repeat: no-repeat;
  background-position: center center;
}
.audi-top-screen1 {
 position: absolute;
 top: 50%;
 left: 50%;
 transform: translate(-50%, -50%);
 width: 73%;
 /* height: 100%; */
 overflow: auto;
}
.btn-lobby{    position: absolute;
  top: 94%;
  left: 50%;
  transform: translate(-50%,-50%);}
  

.home{position: absolute;
  top: 42%;
  left: 49%;
  transform: translate(-50%, -50%);
  width: 76px;
  height: 57px;
  cursor: pointer;
}
button.close {
  background: #fff;
  border-radius: 50%;
  padding: 1px 5px;
  font-size: 18px;
  opacity: 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;
}
}
.lobby-top-screen
{ top: 2%;
  width: 30%;
  position: absolute;
  left: 35%;
}

@media(max-width: 991px){
.login-banner {
  min-height: 300px;
   /*background-image: url(../images/Mobile-Version.jpg);*/
}

.aaa
{
  margin-left: 159px;
  font-size: 14px;
}

.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: 65%!important; left:35%!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-h4{font-size: 10px;margin:3px;}
hr{margin-bottom: 3px;}
.form-control {
  height: 30px;
  margin-bottom: 11px;
  width: 100%;
  padding: 5px;
  font-size: 12px;
  border-radius: 1px;
}
.countdown-3{
  top:87%;
}
.form-banner 
{
position: absolute;
  top: 54%;
  left: 78%;
  width: 38%;
  transform: translate(-50%, -50%);
}
.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: 113%; } 
.btn-unable{font-size: 9px;}   
.btn-lobby{top: 95%;}
.check-input{top: 106%;}

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



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

#agenda .modal-dialog{margin:60px auto; width: 90%;}

}






@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;}*/
}





@media (min-width: 0px) and (max-width: 900px) and (orientation: portrait) {
.rotate-device{   
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 110%;
  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%;}
  
  
   .login-banner
  {
  background-image: url(../images/Mobile-Version.jpeg);
  position: relative;
  width: 100%;
  height: 100vh;
  background-size: 100% 100%;
  background-repeat: no-repeat;
 }

  .input-group {
    margin-bottom: .5rem !important;
  }

 .login_btn {
    width: 100%;
    background: #d5332a !important;
    color: white !important;
    padding: -0;
}
 
.form-banner1 
{
  position: absolute;
  top: 63%;
  left: 53%;
  width: 62%;
  transform: translate(-50%, -50%);
  }
}



 
 .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;
}