@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');
.loader {
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.99);
    position: fixed;
    overflow: auto;
    top: 0;
    left: 0;
    z-index: 999;
    display: block;
}
@keyframes ldio-v6g4je6oqv {
  0% {
    top: 70.5px;
    left: 70.5px;
    width: 0;
    height: 0;
    opacity: 1;
  }
  100% {
    top: 17.25px;
    left: 17.25px;
    width: 106.5px;
    height: 106.5px;
    opacity: 0;
  }
}

.ldio-v6g4je6oqv div {
  position: absolute;
  border-width: 4.5px;
  border-style: solid;
  opacity: 1;
  border-radius: 50%;
  animation: ldio-v6g4je6oqv 1s cubic-bezier(0,0.2,0.8,1) infinite;
}

.ldio-v6g4je6oqv div:nth-child(1) {
  border-color: #1870b8
}

.ldio-v6g4je6oqv div:nth-child(2) {
  border-color: #ea272b;
  animation-delay: -0.5s;
}

.loadingio-spinner-ripple-rf50obiksdm {
  width: 150px;
  height: 150px;
  display: inline-block;
  overflow: hidden;
  background: none;
  position:absolute;
  top:50%; left:50%; z-index:99; position:fixed; transform: translate(-50%, -50%);
}
.ldio-v6g4je6oqv {
  width: 100%;
  height: 100%;
  position: relative;
  transform: translateZ(0) scale(1);
  backface-visibility: hidden;
  transform-origin: 0 0; /* see note above */
}
.ldio-v6g4je6oqv div { box-sizing: content-box; }





html{height:100%; width:100%; -webkit-appearance: none;   -moz-appearance:none;   appearance:none;  scroll-behavior: smooth;}
body{margin:0; padding:0; height:100%; width:100%; background-color:#fff;  font-family: "Roboto", serif; font-optical-sizing: auto; font-weight: 900; font-style: normal; font-variation-settings:"wdth" 900; overflow-x:hidden;}
a, a:hover, input, .template img{text-decoration:none;  -webkit-transition: all .3s ease-in-out; -moz-transition: all .3s ease-in-out; -ms-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out;}
h1, h2{margin:0; padding:0; line-height:normal; font-weight:normal; }





.common_btn {
    font-size:25px;
	font-weight:900;
	line-height:60px;
    border: #e12e2c 0px solid;
    color: #fff;
    background: rgb(183,31,35);
background: linear-gradient(45deg, rgba(183,31,35,1) 0%, rgba(241,74,81,1) 100%);
   display:inline-block; cursor:pointer; border-radius:35px; padding:0 20px;
   box-shadow: rgba(0, 0, 0, 0.16) 0px 10px 36px 0px, rgba(0, 0, 0, 0.06) 0px 0px 0px 1px;
}
.common_btn:hover {
	color: #fff;
	background: linear-gradient(45deg, rgba(241,74,81,1) 0%, rgba(183,31,35,1) 100%);
}

.skip{line-height:40px; border-radius:5px; padding:0 20px; font-weight:500; position:absolute; right:25px; bottom:25px;}

.logoutbtn{display:block; width:40px; height:40px; position:absolute; left:70px; top:20px; padding:0; line-height:40px; text-align:center; font-size:20px;}
.listbtn{display:block; width:40px; height:40px; position:absolute; left:20px; top:20px; padding:0; line-height:40px; text-align:center; font-size:20px;}
.container{max-width:1366px; width:100%; min-height:100%;  position:relative; margin:0 auto; background-color:#ffffff; padding:0;}
.logo{position:absolute; top:53px; right:45px; max-width:258px; width:10%;}


.loginbox{position:absolute; width:770px; top:50%; left:50%; transform:translate(-50%,-50%);}
.loginbox label{text-align:right; display:block; font-size:30px; line-height:60px; margin:0;}
label.error{color:#F00; font-size:14px; font-weight:500; line-height:20px; width:100%; text-align:left; margin-top:10px;}
input.error{border:1px solid #F00 !important;}

.textbox{
    color: #221e1f;
    border: #cfcfcf 1px solid;
    background-color: #fff;
    padding:0 20px;
	font-size:30px; font-weight:900; line-height:60px; height:60px; border-radius:0px; width:100%; text-transform:uppercase;}
.textbox::placeholder{color: #e12e2c;}
input::focus{ outline:none !important; box-shadow:none !important; border:none !important}

.playbt{width:31%; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);}
.clicktext{width:100%; position:absolute; top:77%; left:0%; }

.videodiv{display:none; width:100%; height:100%; position:absolute; top:0; left:0; background-color:#fff; }
video{width:100%; height:100%;  background-color: #fff !important;}

#doctorform{display:none; width:100%; position:absolute; top:0; left:0; background-color:#fff; }
.bg{width:100%; }
.picinput{    width: 29.8%;

    position: absolute;
    top: 32%;
    left: 64.5%;
}

#avatar{width:100%; height:auto; border-radius:0%; border:0px solid #18a8ac}
.greytextbox{color:#221e1f; background-color:#e6e7e9; border:none; border-radius:0!important; font-size:25px; font-weight:700; line-height:60px; height:60px; height:5%;}
#docName{position:absolute; top:72%; left:20.2%; width:41%; }
#stateName{position: absolute;
    top: 79%;
    left: 23%;
    width: 38.2%;}
.tnc{position:absolute; top: 86%;
    left: 6.8%;
    width: 2%;
    height: 2.8%; background-color:#FFF; border:2px solid #221e1f }

/* Hide the browser's default checkbox */
.tnc input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* Create a custom checkbox */
.checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background-color: #fff;
}

/* On mouse-over, add a grey background color */
.tnc:hover input ~ .checkmark {
  background-color: #fff;
}

/* When the checkbox is checked, add a blue background */
.tnc input:checked ~ .checkmark {
  background-color: #fff;
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the checkmark when checked */
.tnc input:checked ~ .checkmark:after {
  display: block;
}

/* Style the checkmark/indicator */
.tnc .checkmark:after {
  left: 5px;
    top: 1px;
    width: 10px;
    height: 16px;
  border: solid #221e1f;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

#docName,#stateName::focus{border:none; outline:none;}

#profile_pic{width: 14%;
    height: 3%;
    position: absolute;
    top: 88%;
    left: 65%;
    opacity: 0;
    background-color: rgba(0, 0, 0, 0.5);}
.mybutton{width: 10%;
    height: 3%;
    position: absolute;
    top: 88%;
    left: 84%;
    opacity:0;
    background-color: rgba(0, 0, 0, 0.5);}

.label.slim .fa{color:#faa634; font-size:80px; margin-bottom:10px}
.label.slim u{display:block; margin-top:10px;}
.registersection .reg_btn_part{margin-top:10px; position:relative;}
.label.slim{color:#faa634;}
.imageEdit{background:rgba(0,0,0,.90); display:none; position: fixed; width:100%; height:100%; top: 0; left: 0; z-index: 9; transition:none !important;}
.imageEdit2{background:rgba(0,0,0,.90); display:none; position: fixed; width:100%; height:100%; top: 0; left: 0; z-index: 9; transition:none !important;}
.imageEdit_dy{background:rgba(0,0,0,.90); display:none; position: fixed; width:100%; height:100%; top: 0; left: 0; z-index: 9; transition:none !important;}
.imageEdit_common{background:rgba(0,0,0,.90); display:none; position: fixed; width:100%; height:100%; top: 0; left: 0; z-index: 9; transition:none !important;}
.imageEditDiv{top:50%; left:50%; position:relative; transform: translate(-50%, -50%); max-width:90%; max-height:60%; min-width:90%; min-height:60%;}
.cropper-canvas{-webkit-filter: blur(3px);  filter: blur(3px);}
.cropper-point{background-color:#faa634}
.slim-editor-utils-group p{margin:10px 0; padding:0;}
.slim-editor-utils-group{text-align:center;}
.slim-editor-utils-group .common_btn{padding:0; margin:0 5px; height:40px; width:40px; display:inline-block; border-radius:10px; line-height:40px;}
.label.slim{margin:0;}
.chzn-container .chzn-results .active-result{font-size:18px; line-height:30px;}




.outputDiv{position:relative; padding:0;}
.downloadDiv{position:fixed; margin-top:10px; left:0; top:0; width:100%; z-index:1;}
.downloadbutton{animation: blink 1s infinite;  border:none; float:right; margin-right:10px; text-align:center; width:auto; padding:5px 10px; font-size:22px; line-height:30px; border-radius:5px;}
.downloadbutton:hover{color:#fff !important;}
.homebutton{float:right; margin-right:10px; text-align:center; width:auto; padding:5px 10px; font-size:22px; line-height:30px; border-radius:5px;}
.homebutton:hover{color:#cdff00 !important; background-color:#faa634;}

.previewpic{width: 19.5%; height:auto; position:absolute; top: 53.2%;
    right:42.4%;
    border:4px solid #221e1f;}


.poster-previewtxt{position: absolute;
    position: absolute;
    padding: 0;
    display: inline-block;
    font-size:3em; font-weight:900; width:50.7%;
    padding: 0;
    margin: 0;
    text-transform:uppercase;
    color: #221e1f;
    top: 40.6%;
    left:5.1%;
    line-height: 1em;}


@-webkit-keyframes blink {
  0%, 49% {
    background-color:#332a86; color:#fff;
  }
  50%, 100% {
    background-color:#faa634; color:#cdff00;
  }
}


.outputDiv1{max-width:1366px; position:relative; padding:0;}
.outputDiv1 .previewpic{width:20%; height:auto; top:62.75%; left:39.9%; vertical-align:top;}
#poster{width:100%;}
.previewtxt1, .previewtxt2, .previewtxt3, .previewtxt4{position:absolute; text-align:center; font-family: 'mercury_text_g1semibold'; color:#fff; font-size:20px; line-height:22px; overflow:hidden;}
.previewtxt1 div, .previewtxt2 div, .previewtxt3 div, .previewtxt4 div{width:100%;}
.outputDiv1 .previewtxt{font-family: 'mercury_text_g1semibold'; color:#002f6b; top:75.5%; left:50%; transform:translate(-50%,0); background-color:transparent; padding:0; font-size:20px; max-width:240px; overflow:hidden;}
.previewtxt1{width:21%; height:12.0%; top:46.6%; left:50%; transform:translate(-50%,0);}

.listgap{height:20vh;}
.list{overflow-x:hidden; overflow-y:auto; height:75vh;}
.listtable td{font-weight:400; vertical-align:top; padding:10px; font-size:1.1em; line-height:1.1em;}
.listtable td .common_btn{padding:0 10px; font-size:14px; font-weight:500; height:30px;  display:inline-block; border-radius:10px; line-height:30px;}


.orientation-gif {
    display: none;
    position: fixed;
    top: 0px;
    left: 0%;
    z-index: 10;
	width: 100%; 
    height: 100%; 
    background-color: #c4c4c4;
}

.orientation-gif img{width: 15%; max-width:100px;
position:absolute; top:50%; left:50%;
transform:translate(-50%,-50%);
}