/*theme styles and transitions are present here*/

:root
    {
    --page-header: #fed349;
    --page-header-text: white;
    --content: #f9f9f9;
    --content-head-text: #3b3b3b;
    --content-text: #363636;
    --highlight: #ff3737;
    --btn: rgba(0,0,0,0);
    --btn-border: #fed349;
    --btn-alt-border: #ffffff;
    --btn-hover: #fed349;
    --btn-alt-hover: #ffffff;
    --btn-text: #666666;
    --page-footer: #333333;
    --page-footer-text: #000000;
    --nav-item-active: #ff3737ff;
    --nav-item-active-text: #ff3737ff;
    --nav-item-text: black;
    --nav-item-active-bg: #ecececff;
    --nav-icon-bg: white;
    --body-font-size: 13px;
    }

/* default settings */
input[type="text"], input[type="password"]{margin-top: 5px; margin-bottom: 5px; min-height: 50px; padding: 10px;}
input[type="text"]:focus, input[type="password"]:focus{border: 1px solid rgb(0, 149, 255); box-shadow: none; outline: none;}
fieldset{padding-top: 20px; padding-bottom: 20px; border: 1px solid rgb(0, 149, 255);}
input[type="submit"]{cursor:pointer; border: none; margin-top: 5px; min-height: 40px; padding: 10px; background-color: #333333; color: white;}
input[type="submit"]:hover{box-shadow: 0px 0px 3px grey; background-color: #505050; color: white;}

::-moz-selection {color: red;background: yellow;} /* Code for Firefox */
::selection {color: red;background: yellow;}
/* default settings end */

.page-header{background-color: var(--page-header); color: var(--page-header-text); line-height: 100%;}
.content{background-color: var(--content); color: var(--content-text); box-shadow: 0px 0px 2px grey;}
.content-head{color: var(--content-head-text);}
.footer{background-color: var(--page-footer); color: var(--page-footer-text);}
.display-block{display: block;}
.display-in-block{display: inline-block;}
.body-font-size{font-size: var(--body-font-size);}
.link-underline-blue{color: blue; text-decoration: underline;}

html{box-sizing:border-box}*,*:before,*:after{box-sizing:inherit}
html{-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%;scroll-behavior: smooth;}

a{text-decoration: none; color:inherit;}
div{position: relative; margin-top: 0px; margin-bottom:0px;}
body{margin:0px; font-size: 8px;}
html{overflow-x: hidden;}
input[type="text"],input[type="password"],input[type="number"]{padding-left: 7px; padding-right: 7px; min-height: 30px; border: 0px; box-shadow: 0px 0px 2px black inset;}
input[type="text"]:disabled,input[type="password"]:disabled,input[type="number"]:disabled{padding-left: 7px; padding-right: 7px; min-height: 30px; border: none; box-shadow: none;}
p{margin-top: 8px; margin-bottom: 8px; padding-top: 8px; padding-bottom: 8px;}
ul{list-style-type: none;}
th,td{padding-left: 5px; padding-right: 5px; padding-top: 10px; padding-bottom: 10px; border-bottom: 1px solid #bebebe;
      text-align: left;}
th{white-space: nowrap;}
th.col-wrap{white-space: normal;}

.pointer{cursor: auto;}
.pointer:hover{cursor: pointer;}

.text-center{text-align: center;}
.text-left{text-align: left;}
.text-right{text-align: right;}
.text-justify{text-align: justify;}

.float-left{float: left;}
.float-right{float: right;}

.container:after,.container:before{content:"";display:table;clear:both}
.button{background-color: #5A4156; padding-top: 12px; padding-bottom: 12px;
        padding-left: 20px; padding-right: 20px; border: none;  cursor: pointer; color: #ffffff; margin-top: 8px; margin-bottom: 8px;}
.button:hover{box-shadow: 0px 0px 5px black;}
.button:disabled{box-shadow: 0px 0px 5px black; padding-top: 12px; padding-bottom: 12px;
                 padding-left: 20px; padding-right: 20px; cursor:not-allowed; color: #a0a0a0;}

.button-block{background-color: #CD9300; display: block; padding: 5px;}
.button-block:hover{box-shadow: 0px 0px 3px black; display: block; padding: 5px;}


.spin{animation:spin 2s infinite linear}@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(359deg)}}

.responsive{overflow-x: scroll;}
.nav-container{position: absolute; left:0; top:0; min-height: 100vh; min-width:100%; padding-left: 5px; padding-top: 30px; box-shadow: 0px 0px 3px grey; font-size: 11px; text-transform: uppercase;}
.nav-icon{position:absolute; left: 0; z-index:0; padding: 15%; background-color: var(--nav-icon-bg); box-shadow: 0px 0px 2px var(--nav-item-active); border-radius: 0% 10% 10% 0%;}

.nav-item-active{margin-top: 4px; border-left: solid 5px var(--nav-item-active); background-color: var(--nav-item-active-bg); color: var(--nav-item-active-text)}
.nav-item-regular{padding-left: 5px; border-left: solid 0px var(--nav-item-active); margin-top: 4px; color: var(--nav-item-text); transition: color 0.2s, border 0.2s;}
.nav-item-regular:hover{margin-top: 4px; border-left: solid 5px var(--nav-item-active); background-color: var(--nav-item-active-bg); color: var(--nav-item-active-text); transition: color 0.2s, border 0.2s;}

/*regular transition*/
.col-width{transition: 0.2s width, 0.2s min-width;}
/*Javascript transitions - JSA*/

.jst-left{animation: move-rtl 0.5s;}
.jst-right{animation: move-ltr 0.5s;}

@keyframes move-rtl {from {left: 100%;} to {left: 0%;}}
@keyframes move-ltr {from {left: -100%} to {left: 0%;}}

/*-------------------custom----------------*/
.welcome-div{padding: 0px; height: 30vh;}
.welcome-div-right{justify-content: center;}

/*RWD - No griding*/
/*-------extra small screen-------*/
@media screen and (max-width:450px)
    {
    .page-header{font-size: 25px;}
    .page-caption{font-size: 16px;}
    .logo-size{height: 75px;}
    .body-font-size{font-size: 12px;}
    .nav-cont-closed{position: absolute; opacity: 0.5; transition: left 0.5s, opacity 0.5s; z-index: 10;}
    .nav-cont-open{position: absolute; transition: left 0.5s, opacity 0.5s; z-index: 10;}
    .head-bg-vector{height: 50%;}
    .nav-icon-size{height: 30px; width:100%;}
    .nav-icon{padding: 8px; border-radius: 0% 5% 5% 0%;}
    .nav-container{padding-left: 0;}
    h1{font-size:20px;}h2{font-size:16px;}h3{font-size:14px;}h4{font-size:12px}h5{font-size:11px;}h6{font-size:10px;}

    /*--------Custom-----------*/
    .welcome-div{padding: 0px; height: 30vh;}
    .welcome-div-left{justify-content: center;}
    .welcome-div-right{justify-content: center; text-align: center;}
    }
/*---- small screen----*/
@media screen and (min-width:450px) and (max-width:749px)
    {
    .page-header{font-size: 28px;}
    .page-caption{font-size: 16px;}
    .logo-size{height: 75px;}
    .body-font-size{font-size: 12px;}
    .nav-cont-closed{position: absolute; opacity: 0.5; transition: left 0.5s, opacity 0.5s; z-index: 10;}
    .nav-cont-open{position: absolute; transition: left 0.5s, opacity 0.5s; z-index: 10;}
    .head-bg-vector{height: 50%;}
    .nav-icon-size{height: 30px; width: 100%;}
    .nav-icon{padding: 8px; border-radius: 0% 5% 5% 0%;}
    .nav-container{padding-left: 0;}
    h1{font-size:20px;}h2{font-size:16px;}h3{font-size:14px;}h4{font-size:12px}h5{font-size:11px;}h6{font-size:10px;}

    /*--------Custom-----------*/
    .welcome-div{padding: 0px; height: 40vh;}
    .welcome-div-right{justify-content: center;}
    }

/*---- medium screen----*/
@media screen and (min-width:750px) and (max-width:1175px)
    {
    .page-header{font-size: 32px;}
    .page-caption{font-size: 18px;}
    .logo-size{height: 85px;}
    .head-bg-vector{height: 75%;}
    .nav-icon-size{height: 30px;}

    /*--------Custom-----------*/
    .welcome-div{padding: 0px; height: 15vh;}
    .welcome-div-right{justify-content: center;}
    }

/*---- large screen----*/
@media screen and (min-width:1176px) and (max-width: 1439px)
    {
    .page-header{font-size: 32px;}
    .page-caption{font-size: 18px;}
    .logo-size{height: 85px;}
    .head-bg-vector{height: 100%;}
    .nav-icon-size{height: 30px;}
    .footer{margin-top: 8px;}

    /*--------Custom-----------*/
    .right-pane{padding-left:8px;}
    }

/*----extra large screen----*/
@media screen and (min-width:1440px)
    {
    .page-header{font-size: 32px;}
    .page-caption{font-size: 18px;}
    .logo-size{height: 90px;}
    .head-bg-vector{height: 100%;}
    .nav-icon-size{height: 30px;}
    .footer{margin-top: 8px;}

    /*--------Custom-----------*/
    .right-pane{padding-left:8px;}
    }

/*Fonts classes*/
.font-amaranth-bold{font-family: "amaranth_bold", Helvetica, sans-serif;}
.font-amaranth-bolditalic{font-family: "amaranth_bold_italic", Helvetica, sans-serif;}
.font-amaranth-italic{font-family: "amaranth_italic", Helvetica, sans-serif;}
.font-amaranth-regular{font-family: "amaranth_regular", Helvetica, sans-serif;}
.font-cone-regular{font-family: "croissant_one", Helvetica, sans-serif;}
.font-esans-bold{font-family: "expletus_sans_bold", Helvetica, sans-serif;}
.font-esans-bolditalic{font-family: "expletus_sans_bold_italic", Helvetica, sans-serif;}
.font-esans-italic{font-family: "expletus_sans_italic", Helvetica, sans-serif;}
.font-esans-medium{font-family: "expletus_sans_medium", Helvetica, sans-serif;}
.font-esans-mediumitalic{font-family: "expletus_sans_medium_italic", Helvetica, sans-serif;}
.font-esans-regular{font-family: "expletus_sans_regular", Helvetica, sans-serif;}
.font-esans-semibold{font-family: "expletus_sans_semi_bold", Helvetica, sans-serif;}
.font-esans-semibolditalic{font-family: "expletus_sans_semi_bold_italic", Helvetica, sans-serif;}
.font-fone-regular{font-family: "fugaz_one", Helvetica, sans-serif;}
.font-mone-regular{font-family: "merienda_one", Helvetica, sans-serif;}
.font-voltaire-regular{font-family: "voltaire_regular", Helvetica, sans-serif;}
.font-dida-regular{font-family: "didactgothic_regular", Helvetica, sans-serif;}
.font-now-black{font-family: "now_black", Helvetica, sans-serif;}
.font-now-bold{font-family: "now_bold", Helvetica, sans-serif;}
.font-now-light{font-family: "now_light", Helvetica, sans-serif;}
.font-now-medium{font-family: "now_medium", Helvetica, sans-serif;}
.font-now-regular{font-family: "now_regular", Helvetica, sans-serif;}
.font-now-thin{font-family: "now_thin", Helvetica, sans-serif;}
.font-proz-bold{font-family: "prozalibre_bold", Helvetica, sans-serif;}
.font-proz-bolditalic{font-family: "prozalibre_bolditalic", Helvetica, sans-serif;}
.font-proz-extrabold{font-family: "prozalibre_extrabold", Helvetica, sans-serif;}
.font-proz-extrabolditalic{font-family: "prozalibre_extrabolditalic", Helvetica, sans-serif;}
.font-proz-italic{font-family: "prozalibre_italic", Helvetica, sans-serif;}
.font-proz-light{font-family: "prozalibre_light", Helvetica, sans-serif;}
.font-proz-lightitalic{font-family: "prozalibre_lightitalic", Helvetica, sans-serif;}
.font-proz-medium{font-family: "prozalibre_medium", Helvetica, sans-serif;}
.font-proz-mediumitalic{font-family: "prozalibre_mediumitalic", Helvetica, sans-serif;}
.font-proz-regular{font-family: "prozalibre_regular", Helvetica, sans-serif;}
.font-proz-semibold{font-family: "prozalibre_semibold", Helvetica, sans-serif;}
.font-proz-semibolditalic{font-family: "prozalibre_semibolditalic", Helvetica, sans-serif;}
.font-railway{font-family: "railway", Helvetica, sans-serif;}
.font-railway-semibold{font-family: "railway_semibold", Helvetica, sans-serif;}
.font-railway-alternate{font-family: "railway_alternate", Helvetica, sans-serif;}
.font-titillium-black{font-family: "titillium_black", Helvetica, sans-serif;}
.font-titillium-bold{font-family: "titillium_bold", Helvetica, sans-serif;}
.font-titillium-bolditalic{font-family: "titillium_bolditalic", Helvetica, sans-serif;}
.font-titillium-boldupright{font-family: "titillium_boldupright", Helvetica, sans-serif;}
.font-titillium-light{font-family: "titillium_light", Helvetica, sans-serif;}
.font-titillium-lightitalic{font-family: "titillium_lightitalic", Helvetica, sans-serif;}
.font-titillium-lightupright{font-family: "titillium_lightupright", Helvetica, sans-serif;}
.font-titillium-regular{font-family: "titillium_regular", Helvetica, sans-serif;}
.font-titillium-regularitalic{font-family: "titillium_regularitalic", Helvetica, sans-serif;}
.font-titillium-regularupright{font-family: "titillium_regularupright", Helvetica, sans-serif;}
.font-titillium-semibold{font-family: "titillium_semibold", Helvetica, sans-serif;}
.font-titillium-semibolditalic{font-family: "titillium_semibolditalic", Helvetica, sans-serif;}
.font-titillium-semiboldupright{font-family: "titillium_semiboldupright", Helvetica, sans-serif;}
.font-titillium-thin{font-family: "titillium_thin", Helvetica, sans-serif;}
.font-titillium-thinitalic{font-family: "titillium_thinitalic", Helvetica, sans-serif;}
.font-titillium-thinupright{font-family: "titillium_thinupright", Helvetica, sans-serif;}
.font-cd{font-family: "caviar_dreams", Helvetica, sans-serif;}
.font-cd-bold{font-family: "caviar_dreams_bold", Helvetica, sans-serif;}
.font-cd-bolditalic{font-family: "caviar_dreams_bolditalic", Helvetica, sans-serif;}
.font-cd-italic{font-family: "caviar_dreams_italic", Helvetica, sans-serif;}
.font-od-jagannatha{font-family: "od_jagannatha", Helvetica, sans-serif;}
.font-od-ananta{font-family: "od_ananta", Helvetica, sans-serif;}
.font-impact{font-family: "impact", Helvetica, sans-serif;}
.font-urw-glb{font-family: "urw_gothic_l_book", Helvetica, sans-serif;}