@charset "utf-8";
/* CSS Document */
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100;500;700;900&display=swap');
/*global classes*/
* {
    margin: 0;
    padding: 0;
}

@import url('https://fonts.googleapis.com/css2?family=Raleway:wght@100;500;700&display=swap');

body {
    background-color: #fff;
    width: 100%;
    margin: 0;
    padding: 0;
    font-family: 'Railway', sans-serif;
    font-size: 16px;
}

a {
    text-decoration: none !important;
    transition: 0.5s all;
}

    a:hover {
        cursor: pointer;
    }

i {
    margin-right: 6px;
}

div:after {
    content: "";
    display: block;
    clear: both;
}

ul, li {
    list-style: none;
}

.float-r {
    float: right;
}

.text_left {
    text-align: left;
}

label {
    display: inline-block;
    margin-bottom: .5rem;
}
/*custom css*/

.wrapper {
    width: 100%;
    margin: 0;
    padding: 0;
    min-height: 100vh;
}
/*preheader css*/
.preheader {
       padding: 2px 0;
    background-color: #006fff;
    width: 100%;
    position: fixed;
    top: 0;
    z-index: 999;
    height: 35px;
    line-height: 30px;
}

    .preheader a {
        color: #fff;
        padding: 0px 8px;
        margin: 2px 0 0px;
        font-weight: 500;
        display: inline-block; line-height: 30px;
    }

#kioskslideInner {
    display: inline-block;
}

.preheader i {
    color: #fff;line-height: 30px;
}

.preheader .btn:hover {
    color: #0CF;
}

.container-fluid {
    width: 90% !important;
    margin: 0 auto;
}
/*Header css*/
.header {
    width: 100%;
    padding: 8px 0;
    background-color: #b9d8ff;
    text-align: center;
    margin-top: 25px;
    transition: height 1.5s ease-in;
}

    .header.fixed {
        width: 100%;
        position: fixed;
        top:11px !important;
        z-index: 999;
        background: rgba(255, 255, 255, 0.9);
        box-shadow: 0 0 10px #ccc;
        -webkit-backdrop-filter: blur(5px);
        backdrop-filter: blur(5px);
        background-color: rgba(255, 255, 255, 0.5);
        transition: height 1.5s ease-in;
    }

    .header .srvc_logo {
        float: left;
    }
/*.srvc_logo img {
	max-width: 290px;
}*/
/*nav css*/

.srvc_logo img {
    padding-top: 8px;
}


.navbar {
    width: 100%;
    margin: 0;
    padding: 0;
}

.topnav {
    width: 100%;
    margin: 18px 0;
}

.menu {
    min-width: 387px;
}

.topnav a {
    float: left;
    display: block;
    color: #000;
    text-align: center;
    padding: 6px 0 6px 25px;
    text-decoration: none;
    font-size: 20px;
    font-family: 'roboto', sans-serif;
}

    .topnav a:hover {
        color: #006fff;
    }

    .topnav a.active {
        color: #006fff;
    }

.topnav .icon {
    display: none;
}

/* When the screen is less than 600 pixels wide, hide all links, except for the first one ("Home"). Show the link that contains should open and close the topnav (.icon) */
@media screen and (max-width: 768px) {
    .topnav a:not(:first-child) {
        display: none;
    }

    .topnav a.icon {
        float: right;
        display: block;
    }

    .menu {
        min-width: 100%;
        background-color: #d8e7fb;
    }

    .navbar_custom {
        background-color: #d8e7fb;
    }

    .topnav {
        top: 0;
        left: 0 !important;
    }

        .topnav a {
            padding: 6px 15px;
            transition: 1s all;
        }

            .topnav a:hover {
                padding-left: 10px;
                transition: 1s all;
            }
}

/* The "responsive" class is added to the topnav with JavaScript when the user clicks on the icon. This class makes the topnav look good on small screens (display the links vertically instead of horizontally) */
@media screen and (max-width: 768px) {
    .topnav.responsive {
        position: relative;
    }

        .topnav.responsive a.icon {
            position: absolute;
            right: 0;
            top: -67px;
            border: none;
        }

        .topnav.responsive a {
            float: none;
            display: block;
            text-align: left;
            border-bottom: solid 1px #c8daf1;
            font-size: 16px;
        }
}
/*Section Intro css*/

#intro {
    width: 100%;
    background: linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(185,216,255,1) 100%);
}

.circle {
    position: absolute;
    left: 0;
}

.intro_text {
    width: 100%;
    padding-top: 60px;
    font-family: 'Roboto', sans-serif;
    position: relative;
}

    .intro_text h1, h6 {
        font-family: 'Roboto', sans-serif;
    }

.intro_btn {
    padding: 6px 15px;
    background: linear-gradient(45deg, rgba(255,19,113,1) 0%, rgba(255,102,0,1) 100%);
    border-radius: 20px;
    color: #fff;
    border: 0;
}

    .intro_btn:hover {
        transform: translateY(-3px);
        transition: 0.5s;
    }

.srvc_btn {
    padding: 6px 15px;
    background: linear-gradient(45deg, rgba(5,170,63,1) 0%, rgba(255,231,0,1) 100%);
    border-radius: 20px;
    color: #fff;
    border: 0;
    margin: 0 0 0 10px;
}

    .srvc_btn:hover {
        transform: translateY(-3px);
        transition: 0.5s;
    }

.intro_text p {
    font-family: 'Railway', sans-serif;
    margin-bottom: 30px;
}

.top_info {
    padding-top: 24px;
}

    .top_info img {
        max-width: 100%;
    }
/*Section Heading css*/



.section_heading p {
    color: #09958e;
    margin: 0 !important;
}

.section_heading h3 {
    margin: 0;
}

.section_heading i {
    margin: 0 6px;
    color: #007bd9;
}
/*Section Services css*/

#service {
    margin: 60px 0;
    width: 100%;
}

.service_box {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 8px;
    margin-top: 40px;
}

    .service_box p {
        color: #fff;
        font-size: 18px;
        font-weight: normal;
        margin: 0 0 24px 0;
    }

.date_area {
    padding: 4px;
    background-color: #d5263b;
    color: #fff;
    margin: 0 0 24px 0;
}

.date_area_bg1 {
    background-color: #d5263b;
}

.date_area_bg2 {
    background-color: #07439d;
}

.date_area_bg3 {
    background-color: #dd6d0a;
}

.start_date {
    width: 50%;
    float: left;
}

.br {
    border-right: 1px solid #fff;
}

.servc_bg {
    padding: 10px 20px;
}

.servc_bg1, .servc_bg2, .servc_bg3 {
    transition: 0.5s;
}

    .servc_bg1:hover {
        transform: translateY(-15px);
    }

    .servc_bg2:hover {
        transform: translateY(-15px);
    }

    .servc_bg3:hover {
        transform: translateY(-15px);
    }

.servc_bg1 {
    background: linear-gradient(0deg, rgba(213,46,64,1) 0%, rgba(255,69,97,1) 100%);
}

.servc_bg2 {
    background: linear-gradient(0deg, rgba(14,28,63,1) 0%, rgba(0,108,255,1) 100%);
}

.servc_bg3 {
    background: linear-gradient(0deg, rgba(224,132,0,1) 0%, rgba(255,204,0,1) 100%);
}

.servc_bg img {
    margin: 24px 0;
}

.go_button {
    border-radius: 20px;
    background-color: #68e13b;
    color: #000;
    border: none;
    padding: 4px 20px;
    font-weight: 600;
    margin: 0 0 24px;
}

    .go_button:hover {
        background-color: #00CC33;
        transition: 0.5s;
        transform: translateY(-5px);
    }
/*About us css*/
.aboutus {
    margin: 60px 0;
}

    .aboutus img {
        max-width: 100%;
    }

    .aboutus p {
        line-height: 30px;
        margin-top: 30px;
    }
/*contactus Section CSS*/

#contactus {
    margin: 40px 0;
}

.contact_detail {
    margin: 80px 0px 50px;
}

.contact_box {
    background: linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(230,230,230,1) 100%);
    box-shadow: 0 10px 10px #ccc;
    padding: 14px;
    border-radius: 20px;
    height: 130px;
}

    .contact_box:hover {
        transform: translateY(-5px);
        transition: 0.5s ease-in;
    }

    .contact_box p {
        font-size: 14px;
    }

    .contact_box img {
        margin-bottom: 10px;
    }

.icn_bg {
    width: 80px;
    height: 80px;
    background: linear-gradient(45deg, rgba(255,19,113,1) 0%, rgba(255,102,0,1) 100%);
    border-radius: 100px;
    margin: -60px auto 9px;
    padding: 10px;
    border: 5px solid #CCCCCC;
}
/*Footer Section CSS*/
.footer {
    padding: 6px;
    background-color: #006fff;
    text-align: center;
    color: #fff;
    font-size: 12px;
}

    .footer img {
        vertical-align: middle;
    }
/*Scroll top CSS*/
#scroll-top {
    position: absolute;
    right: 20px;
    bottom: 100px;
    z-index: 999 !important;
}

    #scroll-top img {
        outline: none;
        cursor: pointer;
        position: fixed;
        right: 30px;
        bottom: 30px;
    }

@media screen and (min-width:320px) and (max-width:768px) {
    .top_info {
        display: none;
    }

    .intro_text {
        padding-top: 60px;
    }

    .service_box {
        grid-template-columns: repeat(1, 1fr);
    }

    .aboutus img {
        display: none;
    }

    #aboutus {
        margin: 40px 0;
    }

    #service {
        margin: 40px 0;
    }

    .contact_info img {
        display: none;
    }

    .contact_detail {
        margin-top: 20px;
    }

    .contact_box {
        margin-top: 50px;
    }

    .section_heading {
        text-align: center;
    }

    .srvc_logo {
        margin-bottom: 10px;
    }

    .topnav {
        margin: 0;
        position: absolute;
    }

        .topnav a.icon {
            display: block;
            position: absolute;
            right: 0;
            top: -67px;
        }
    /*.srvc_logo img {
	max-width: 260px;
}*/
    .navbar_custom {
        position: absolute;
        right: 0;
        top: 100px;
        width: 100%;
        z-index: 9;
    }

    .header {
        position: relative;
        background-color: transparent !important;
    }

    .topnav a.active {
        display: none;
    }

    .menu {
        background: linear-gradient(45deg, rgba(255,255,255,1) 0%, rgb(234 234 234) 100%);
    }

    .cover_panel {
        display: none;
    }

    .login_content {
        float: none !important;
        width: 100% !important;
    }

    .login_bg {
        width: 100% !important;
    }
}

@media screen and (min-width:768px) and (max-width:999px) {
    .contact_box {
        height: 150px;
    }
}

.animatable {
    /* initially hide animatable objects */
    visibility: hidden;
    /* initially pause animatable objects their animations */
    -webkit-animation-play-state: paused;
    -moz-animation-play-state: paused;
    -ms-animation-play-state: paused;
    -o-animation-play-state: paused;
    animation-play-state: paused;
}
/* show objects being animated */


/*animation css*/

.animated {
    animation-duration: 1s;
    animation-fill-mode: both;
}

    .animated.infinite {
        animation-iteration-count: infinite;
    }

    .animated.hinge {
        animation-duration: 2s;
    }

    .animated.flipOutX, .animated.flipOutY, .animated.bounceIn, .animated.bounceOut {
        animation-duration: .75s;
    }

@keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

.fadeIn {
    animation-name: fadeIn;
}

@keyframes fadeInDown {
    from {
        opacity: 0;
        transform: translate3d(0, -100%, 0);
    }

    to {
        opacity: 1;
        transform: none;
    }
}

.fadeInDown {
    animation-name: fadeInDown;
}

@keyframes fadeInLeft {
    from {
        opacity: 0;
        transform: translate3d(-100%, 0, 0);
    }

    to {
        opacity: 1;
        transform: none;
    }
}

.fadeInLeft {
    animation-name: fadeInLeft;
}

@keyframes fadeInLeftBig {
    from {
        opacity: 0;
        transform: translate3d(-2000px, 0, 0);
    }

    to {
        opacity: 1;
        transform: none;
    }
}

.fadeInLeftBig {
    animation-name: fadeInLeftBig;
}
/*animation css end*/
.modal-dialog {
    max-width: 768px;
    margin: 1.75rem auto;
}
/*login page css*************************************************************************************************************/

#login {
    background-color: #fff;
    min-height: 100vh;
    margin-top: 10px;
}

.login_bg {
    width: 80%;
    margin: 60px auto;
    border-radius: 10px;
    padding: 1rem 2.5rem;
    background: rgb(255,255,255);
    box-shadow: 0px 16px 39px #e4e4e4;
    position: relative;
    min-height: 462px;
}

.cover_panel {
    width: 48%;
    background: linear-gradient(45deg, rgb(106 190 249) 0%, rgb(76 64 173) 100%);
    height: 462px;
    position: absolute;
    left: 0;
    top: 0;
    color: #fff;
}

    .cover_panel img {
        margin: 80px 0 0;
    }

    .cover_panel p {
        margin: 0;
    }

.login_content {
    float: right;
    width: 46%;
}

.login_heading {
    font-size: 25px;
    font-weight: 600;
    margin-bottom: 2px;
}

.form-group {
    margin-bottom: .8rem;
}

.login_btn {
    padding: 10px 15px;
    background: linear-gradient( 45deg, rgba(255,19,113,1) 0%, rgba(255,102,0,1) 100%);
    border-radius: 20px;
    color: #fff;
    border: 0;
    width: 100%;
    margin-bottom: .8rem;
}

    .login_btn:hover {
        transform: translateY(-4px);
        transition: 0.5s all;
    }

.captcha_outer {
    height: auto;
    background-color: #fff;
    border-radius: 5px;
    border: 1px solid #ced4da;
}
/*form css*************************************************************************************************************/

.page-heading {
    background-color: #e3efff;
    padding: 7px 0;
    margin-bottom: 20px;
    margin-top: 0px;
}

    .page-heading h5 {
        margin: 0;
    }

.table th {
    color: #000;
    line-height: 1.4;
    text-transform: uppercase;
    background-color: #f5f5f5;
    font-weight: 500;
    padding: 10px !important;
    border-left: 1px solid #f5f5f5 !important;
    border-top: 1px solid #f5f5f5 !important;
    border-right: 1px solid #f5f5f5 !important;
    border-bottom: 1px solid #e4e2e2 !important;
}

.table td select {
    padding: 10px;
    display: block;
    width: 100%;
    font-size: 14px;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: .25rem;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

.table4 td {
    width: 25%;
}


@media only screen and (max-width: 444px) {
    .table td input[type="text"], .table td textarea, .table td select {
        min-width: 90px;
    }
}


/*20.07.2021*/
#DivLoginDtls {
    display: inline-block;
}

.Captcha {
    width: 100% !important;
}

.main_captch {
    width: 100% !important;
}
/* Server */
#DivServer {
    position: fixed;
    right: 5px;
    bottom: 0;
    background-color: #f7df6c;
    font-weight: 700;
    color: #333;
    font-weight: 100;
    padding: 5px 20px;
    z-index: 999 !important;
    border-radius: 7px 7px 0 0;
}

#radio input[type="radio"] {
    margin: 0 4px;
}

    #radio input[type="radio"]:last-child {
        margin: 0 4px 0 0;
    }

.float-left {
    float: left;
}





/* Table form Page */
.table {
    width: 100%;
    border-collapse: collapse;
}

    .table th {
        color: #000;
        background-color: #bad7fd !important;
        font-weight: 600;
        font-size: 16px !important;
        border-left: 1px solid #bad7fd !important;
        border-top: 1px solid #bad7fd !important;
        border-right: 1px solid #bad7fd !important;
        border-bottom: 1px solid #bad7fd !important;
    }

    .table th strong {
      
        font-weight: 600;
        font-size: 16px !important;
       
    }
    .table td {
        border: 1px solid #ddd;
        padding: 5px;
        font-size: 14px;
        vertical-align: middle !important;
    }

        .table td input[type="text"], .table td select {
            display: block;
            width: 100%;
            padding: 0.19rem .75rem !important;
            font-size: 1rem;
            font-weight: 400;
            line-height: 1.5;
            color: #212529;
            background-color: #fff;
            background-clip: padding-box;
            border: 1px solid #ced4da;
            -webkit-appearance: none;
            -moz-appearance: none;
            appearance: none;
            border-radius: .25rem;
            transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
        }

.width2 td {
    width: 50%;
}

.width4 td {
    width: 25%;
}

.width5 td {
    width: 20%;
}

.width_2 {
    width: 4% !important;
}

.width_24 {
    width: 24%;
}

.width6 td {
    width: 16.6%;
}

.table td input[type="radio"] {
    margin: 0 5px;
    vertical-align: middle;
}

.input-group > :not(:first-child):not(.dropdown-menu):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(.invalid-feedback) {
    margin-left: 5px !important;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

select.form-control {
    appearance: auto !important;
}

input.form-control, select.form-select {
    padding: 0.19rem .75rem !important;
}

.form-group input {
    padding: 8px 10px !important;
    margin: 6px 0;
}

.table td textarea {
    width: 100%;
    height: 32px;
    padding: 0.19rem .75rem !important;
    border: 1px solid #ced4da;
    border-radius: .25rem;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

    .form-control:focus, .table td textarea:focus, .form-select:focus {
        color: #212529;
        background-color: #fff;
        border-color: #86b7fe;
        outline: 0;
        box-shadow: 0 0 0 .15rem rgba(13,110,253,.25) !important;
    }

.table tr:nth-child(2n) {
    background-color: #fafcff;
}

.cardtable {
    padding: 1rem;
    border: 0 !important;
    box-shadow: 0 0.46875rem 2.1875rem rgba(4, 9, 20, 0.03), 0 0.9375rem 1.40625rem rgba(4, 9, 20, 0.03), 0 0.25rem 0.53125rem rgba(4, 9, 20, 0.05), 0 0.125rem 0.1875rem rgba(4, 9, 20, 0.03);
    border-width: 0;
    transition: all .2s;
    margin-bottom: 10px !important;
}
/*@media screen and (max-width: 999px) and (min-width: 320px)
{
    .table td
    {
        width: 100%;
        display: block;
        margin-top: -1px;
        border-spacing: 20px;
    }
    .table tr td:nth-child(1)
    {
        background-color:#dfedff;
        border:1px solid #dfedff;
    }
.table tr td:nth-child(3)
    {
        background-color:#dfedff;
        border:1px solid #dfedff;
    }
.table > thead {
    vertical-align: bottom;
    margin: 0 0 10px;
    display: inherit;
    width: 100%;
}
    .table tr:nth-child(2n) {
    background-color: #fff;
}
}*/


/**/
.iconKIOSK {
    margin-bottom: 10px;
}

    .iconKIOSK i {
        font-size: 3rem;
    }

.kioskCol {
    background-color: #fafafa;
    padding: 1rem;
    text-align: center;
}

    .kioskCol span {
        display: block;
    }

.bg-purple {
    color: #8950fc !important;
}

.bg-yelow {
    color: #FFA800;
}

.bg-red {
    color: #F64E60;
}

.bg-green {
    color: #1BC5BD;
}

.card-title {
    font-size: 1rem;
}

.table.tableborder0 td {
    border: 0 !important;
}

@media screen and (max-width: 999px) and (min-width: 320px) {

    .tablekiosk tr td:nth-child(1), .tablekiosk tr td:nth-child(3) {
        background-color: transparent !important;
        border: 0 !important;
    }
}


.tble_wcolor th {
    background-color: #fff !important;
    color: #000 !important;
}

.radio_table td {
    border: none !important;
}

.form_head {
    font-size: 20px;
    text-align: center;
    line-height: 30px;
}


@media only screen and (min-width: 768px) and (max-width: 1146px) {
    .cover_panel {
        height: 520px;
    }
}

@media only screen and (min-width: 320px) and (max-width: 500px) {
    .srvc_logo img {
        max-width: 100%;
    }

    .captcha_mob {
        display: contents;
    }
}

.right_textform {
    font-size: 12px;
    color: red;
}

.form_lefthead {
    padding: 5px;
    font-size: 14px;
}

.inner_header {
    background-color: #fff !important;
    height: 100px;
    /*background-image: url('../image/black-twill.png');*/
}


.border_grdient {
    height: 5px;
    background: #0575E6; /* fallback for old browsers */
    background: -webkit-linear-gradient(to left, #508fe0, #0575E6); /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to left, #508fe0, #0575E6); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}

.btn_prcoceed {
    margin: 5px 0;
}

.prnt_btnform {
    margin-bottom: 5px;
}

.text_right {
    text-align: right !important;
}

.left_logoform {
    padding-bottom: 12px;
}

.prnt_frm {
    -webkit-print-color-adjust: exact !important;
    color-adjust: exact !important;
}

/*.logoImage {
    display:none;
}*/
.form_head h4 {

}
.logoImage img {
    vertical-align:top;
}
.float-left {
    float:left;
}
.float-right {
    float:right;
}
 .logoImage {
                       height:auto;
                       width:100%;
                         padding:10px;
                         display:none ;
                     }


 #divMsg table {
     background-color:#fff;
     height:157px !important;
     border-radius:10px;
     margin-top:0 !important;
 }
  #divMsg table td {
     padding:20px;
 }
  #btnOK {
      
    width: 70px;
    border: 0;
    padding: 4px;
    background-color: #006fff;
    color: #fff;
    border-radius: 4px;

  }
   #btnOK:hover {
    
    background-color: #0b59bd;
    

  }

   .navbar_custom {
       display:none;
   }
   .logoutBox .logoutIcon {
    height: 100px;
    width: 100px;
    margin: 0 auto;
    
}
   .logoutBox  {
       box-shadow:0 0 !important;
       padding-top:100px;
   }

.notetext {
    display:table-column;
}