@import url('https://fonts.googleapis.com/css?family=Baloo+Thambi+2:400,700|Archivo:wght@300;700&family=Carter+One&family=Satisfy&family=Shadows+Into+Light&display=swap');
:root{
  --color-first: #181818;
  --color-second: #F3950D;
  --color-third: #333333;
  --color-blue: #25316D;
  --color-red: #D2001A;
  --color-green: #2B7A0B;
  --color-yellow: #FFC600;
  --color-white: #fff;
  --color-black: #333;
  --color-gray: #999;
  --color-light-gray: #EEE;
  --color-dark-gray: #7F8487;
}
[onclick],button{ cursor: pointer; }
h1,h2,h3,h4,h5,h6{ font-weight: normal; }
.color-first{ color: var(--color-first); }
.color-second{ color: var(--color-second); }
.color-green{ color: var(--color-green); }
.color-yellow{ color: var(--color-yellow); }
.color-red{ color: var(--color-red); }
.color-blue{ color: var(--color-blue); }
.color-gray{ color: var(--color-gray); }
.color-white{ color: var(--color-white); }
.color-light-gray{ color: var(--color-light-gray); }
.color-dark-gray{ color: var(--color-dark-gray); }
.bg-first{ background: var(--color-first); }
.bg-second{ background: var(--color-second); }
.bg-green{ background: var(--color-green); }
.bg-yellow{ background: var(--color-yellow); }
.bg-red{ background: var(--color-red); }
.bg-blue{ background: var(--color-blue); }
.bg-white{ background: var(--color-white); }
.bg-gray{ background: var(--color-gray); }
.bg-light-gray{ background: var(--color-light-gray); }
.bg-dark-gray{ background: var(--color-dark-gray); }
*{
  outline: none;
  font-family: 'Baloo Thambi 2', cursive;
  box-sizing: border-box;
  -webkit-tap-highlight-color: transparent;
}
body{ padding: 0px 0px; margin: 0px 0px; }
.pattern-background-secondary { background-color: #ffffff; background-image: url("./bg/pattern-randomized.svg"); background-attachment: fixed; background-size: 100% auto; }
.waiting_screen { width: 100%; height: 100%; position: fixed; z-index: 9999999; left: 0px; top: 0px; display: block; background: rgba(0, 0, 0, 0.2); display: none; }
.waiting_screen .waitbar { width: 100%; max-width: 150px; text-align: center; height: auto; display: block; padding: 20px 20px 10px; border-radius: 5px; background: rgba(0, 0, 0, 0.8); position: absolute; top: 45%; left: 50%; transform: translate(-45%, -50%); -webkit-transform: translate(-45%, -50%); -moz-transform: translate(-45%, -50%); }
.waiting_screen .waitbar p { color: #fff; margin: 10px 0px 0px 0px; }
#floatingBarsG { position: relative; width: 60px; height: 75px; margin: auto; }
.blockG { position: absolute; background-color: rgb(255, 255, 255); width: 10px; height: 23px; border-radius: 8px 8px 0 0; -o-border-radius: 8px 8px 0 0; -ms-border-radius: 8px 8px 0 0; -webkit-border-radius: 8px 8px 0 0; -moz-border-radius: 8px 8px 0 0; transform: scale(0.4); -o-transform: scale(0.4); -ms-transform: scale(0.4); -webkit-transform: scale(0.4); -moz-transform: scale(0.4); animation-name: fadeG; -o-animation-name: fadeG; -ms-animation-name: fadeG; -webkit-animation-name: fadeG; -moz-animation-name: fadeG; animation-duration: 1.2s; -o-animation-duration: 1.2s; -ms-animation-duration: 1.2s; -webkit-animation-duration: 1.2s; -moz-animation-duration: 1.2s; animation-iteration-count: infinite; -o-animation-iteration-count: infinite; -ms-animation-iteration-count: infinite; -webkit-animation-iteration-count: infinite; -moz-animation-iteration-count: infinite; animation-direction: normal; -o-animation-direction: normal; -ms-animation-direction: normal; -webkit-animation-direction: normal; -moz-animation-direction: normal; }
#rotateG_01 { left: 0; top: 27px; animation-delay: 0.45s; -o-animation-delay: 0.45s; -ms-animation-delay: 0.45s; -webkit-animation-delay: 0.45s; -moz-animation-delay: 0.45s; transform: rotate(-90deg); -o-transform: rotate(-90deg); -ms-transform: rotate(-90deg); -webkit-transform: rotate(-90deg); -moz-transform: rotate(-90deg); }
#rotateG_02 { left: 8px; top: 10px; animation-delay: 0.6s; -o-animation-delay: 0.6s; -ms-animation-delay: 0.6s; -webkit-animation-delay: 0.6s; -moz-animation-delay: 0.6s; transform: rotate(-45deg); -o-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); }
#rotateG_03 { left: 25px; top: 3px; animation-delay: 0.75s; -o-animation-delay: 0.75s; -ms-animation-delay: 0.75s; -webkit-animation-delay: 0.75s; -moz-animation-delay: 0.75s; transform: rotate(0deg); -o-transform: rotate(0deg); -ms-transform: rotate(0deg); -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); }
#rotateG_04 { right: 8px; top: 10px; animation-delay: 0.9s; -o-animation-delay: 0.9s; -ms-animation-delay: 0.9s; -webkit-animation-delay: 0.9s; -moz-animation-delay: 0.9s; transform: rotate(45deg); -o-transform: rotate(45deg); -ms-transform: rotate(45deg); -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); }
#rotateG_05 { right: 0; top: 27px; animation-delay: 1.05s; -o-animation-delay: 1.05s; -ms-animation-delay: 1.05s; -webkit-animation-delay: 1.05s; -moz-animation-delay: 1.05s; transform: rotate(90deg); -o-transform: rotate(90deg); -ms-transform: rotate(90deg); -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); }
#rotateG_06 { right: 8px; bottom: 7px; animation-delay: 1.2s; -o-animation-delay: 1.2s; -ms-animation-delay: 1.2s; -webkit-animation-delay: 1.2s; -moz-animation-delay: 1.2s; transform: rotate(135deg); -o-transform: rotate(135deg); -ms-transform: rotate(135deg); -webkit-transform: rotate(135deg); -moz-transform: rotate(135deg); }
#rotateG_07 { bottom: 0; left: 25px; animation-delay: 1.35s; -o-animation-delay: 1.35s; -ms-animation-delay: 1.35s; -webkit-animation-delay: 1.35s; -moz-animation-delay: 1.35s; transform: rotate(180deg); -o-transform: rotate(180deg); -ms-transform: rotate(180deg); -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); }
#rotateG_08 { left: 8px; bottom: 7px; animation-delay: 1.5s; -o-animation-delay: 1.5s; -ms-animation-delay: 1.5s; -webkit-animation-delay: 1.5s; -moz-animation-delay: 1.5s; transform: rotate(-135deg); -o-transform: rotate(-135deg); -ms-transform: rotate(-135deg); -webkit-transform: rotate(-135deg); -moz-transform: rotate(-135deg); }
@keyframes fadeG {
    0% { background-color: rgb(0, 0, 0); }
    100% { background-color: rgb(255, 255, 255); }
}
@-o-keyframes fadeG {
    0% { background-color: rgb(0, 0, 0); }
    100% { background-color: rgb(255, 255, 255); }
}
@-ms-keyframes fadeG {
    0% { background-color: rgb(0, 0, 0); }
    100% { background-color: rgb(255, 255, 255); }
}
@-webkit-keyframes fadeG {
    0% { background-color: rgb(0, 0, 0); }
    100% { background-color: rgb(255, 255, 255); }
}
@-moz-keyframes fadeG {
    0% { background-color: rgb(0, 0, 0); }
    100% { background-color: rgb(255, 255, 255); }
}
.alert_msg_block { width: 100%; height: 100%; display: block; background: rgba(0, 0, 0, 0.1); position: fixed; z-index: 9999; left: 0px; top: 0px; overflow: hidden; display: none; }
.alert_msg_block .alert_msg { width: 100%; max-width: 360px; display: block; padding: 10px 10px 15px; margin: 0px 0px; background: #fff; font-size: 12px; border-radius: 5px; font-family: 'Oxygen', sans-serif; box-shadow: 0px 0px 12px 1px rgba(0, 0, 0, 0.1); position: fixed; z-index: 1; top: 20%; left: 50%; transform: translate(-20%, -50%); -webkit-transform: translate(-40%, -50%); -moz-transform: translate(-40%, -50%); text-align: center; box-shadow: 0px 0px 20px 4px rgba(0, 0, 0, 0.2); }
.alert_msg_block .alert_msg p.h1 { position: relative; display: block; padding: 0px 10px; margin: 0px 0px; font-size: 24px; color: #354259; font-weight: 700; text-transform: capitalize; }
.alert_msg_block .alert_msg p.h2 { position: relative; display: block; padding: 0px 10px; margin: 4px 0px 0px; font-size: 20px; color: #354259; font-weight: 300; }
.alert_msg_block .alert_msg button { background: #f7f7f7; border: none; padding: 0px 0px; float: right; color: #354259; '
font-size: 25px !important; line-height: 25px !important; position: absolute; right: 10px; top: 5px; cursor: pointer; border-radius: 100em; padding: 6px 12px; outline: none !important; }
@media (max-width:768px) {
    .alert_msg_block .alert_msg { width: 90%; top: 20%; left: 50%; transform: translate(-50%, -20%); -webkit-transform: translate(-50%, -20%); -moz-transform: translate(-50%, -20%); }
}
.bg { width: 100%; height: auto; display: block; float: left; clear: both; }
.priceblock { padding: 15px 0px; height: auto; }
.priceblock .priceflex { background: #fff; border: 1px solid #ddd; border-radius: 20px; display: flex; flex-direction: column; align-content: center; justify-content: center; overflow: hidden; text-align: center; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; transition: all 0.3s ease-out; background: #25597d; background: linear-gradient(to top, #25597d, #709acb); background: -webkit-linear-gradient(to top, #25597d, #709acb); background: -moz-linear-gradient(to top, #25597d, #709acb); }
.priceblock .priceflex div p { margin: 0px 0px; padding: 0px 0px; }
.priceblock .priceflex div p.t1 { font-size: 1em; line-height: 1em; font-weight: 700; position: relative; display: inline-block; color: #fff; }
.priceblock .priceflex div p.t1.txt-lg { font-size: 2em; line-height: 2em; color: #25597d; color: #fff; }
.priceblock .priceflex div p.t1 small { font-size: 0.50em; font-weight: normal; position: absolute; right: 0px; transform: translate(110%, 6%); }
.priceblock .priceflex > div:nth-child(1) { flex: 4; padding: 30px 0px 20px; }
.priceblock .priceflex > div:nth-child(2) { flex: 1; }
.priceblock .priceflex div button { width: 100%; padding: 18px 10px; font-size: 2em; border-radius: 0px; background: -webkit-linear-gradient(to right, #ff0300 0%, #ff8f00 100%); background: -moz-linear-gradient(to right, #ff0300 0%, #ff8f00 100%); background: linear-gradient(to right, #ff0300 0%, #ff8f00 100%); color: #fff; font-weight: 700; }
.priceblock .priceflex:hover { box-shadow: 0px 0px 8px 3px rgba(0, 0, 0, 0.2); transform: scale(110%); -webkit-transition: all 0.3s ease-in; -moz-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; -ms-transition: all 0.3s ease-in; transition: all 0.3s ease-in; }
.alert-box { background: #EB1D36; padding: 5px 7px; color: #fff; }
.webmodal { position: fixed; background: rgba(0, 0, 0, 0.5); left: 0px; top: 0px; z-index: 999; width: 100%; height: 100vh; }
.webmodal .webdialog { position: absolute; background: #fff; left: 50%; top: 50%; z-index: 1; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); max-width: 400px; border-radius: 5px; }
@media(max-width:768px) {
    .webmodal { background: #fff; }
    .webmodal .webdialog { top: 0%; transform: translate(-50%, 0%); -webkit-transform: translate(-50%, 0%); -moz-transform: translate(-50%, 0%); }
}
.disp-block{ display: block; }
.text-xs{ font-size: 12px; line-height: 12px; }
.text-sm{ font-size: 14px; line-height: 12px; }
.text-st{ font-size: 16px; line-height: 16px; }
.text-md{ font-size: 18px; line-height: 18px; }
.text-lg{ font-size: 24px; line-height: 24px; }
.hide { display: none; }
.pt-50 { padding-top: 50px; }
.pb-50 { padding-bottom: 50px; }
.pt-5 { padding-top: 5px; }
.pt-10 { padding-top: 10px; }
.pt-20 { padding-top: 20px; }
.pb-5 { padding-bottom: 5px; }
.pb-10 { padding-bottom: 10px; }
.pb-20 { padding-bottom: 20px; }
.myform { padding: 10px 10px; }
.ht-full{ height: 100vh; }
.ht-min-full{ min-height: 100vh; }
.myform .form-h1 { font-size: 1.6em; line-height: 1.6em; margin: 0px; padding: 0px; }
.myform .form-area { padding: 7px 10px; }
.myform .form-area .form-elm { display: block; width: 100%; padding: 10px 10px; border-radius: 5px; }
.flexbox { display: flex; display: -webkit-flex; display: -moz-flex; width: 100%; flex-wrap: wrap; }
.flexbox.nowrpa { display: flex; display: -webkit-flex; display: -moz-flex; flex-wrap: nowrap; }
.flexbox.vc { align-items: center; }
.flexbox.trhead { background: #2EB18D; color: #fff; }
.flexbox.trhead-border { border-bottom: 1px solid #2EB18D; color: #2EB18D; }
.flexbox.tr { padding: 5px 5px; }
.flexbox > .flex-md-10 { width: 10%; }
.flexbox > .flex-md-15 { width: 15%; }
.flexbox > .flex-md-20 { width: 20%; }
.flexbox > .flex-md-25 { width: 25%; }
.flexbox > .flex-md-30 { width: 30%; }
.flexbox > .flex-md-33 { width: 33%; }
.flexbox > .flex-md-40 { width: 40%; }
.flexbox > .flex-md-50 { width: 50%; }
.flexbox > .flex-md-60 { width: 60%; }
.flexbox > .flex-md-70 { width: 70%; }
.flexbox > .flex-md-80 { width: 80%; }
.flexbox > .flex-md-90 { width: 90%; }
.flexbox > .flex-md-100 { width: 100%; }
@media(max-width:768px) {
.flexbox > .flex-xs-10 { width: 10%; }
.flexbox > .flex-xs-20 { width: 20%; }
.flexbox > .flex-xs-25 { width: 25%; }
.flexbox > .flex-xs-30 { width: 30%; }
.flexbox > .flex-xs-33 { width: 33%; }
.flexbox > .flex-xs-40 { width: 40%; }
.flexbox > .flex-xs-50 { width: 50%; }
.flexbox > .flex-xs-60 { width: 60%; }
.flexbox > .flex-xs-70 { width: 70%; }
.flexbox > .flex-xs-80 { width: 80%; }
.flexbox > .flex-xs-90 { width: 90%; }
.flexbox > .flex-xs-100 { width: 100%; }
}
.pad-lt-5{ padding-left: 5px; }
.text-nowrap{ white-space: nowrap; }
.text-center{ text-align: center; }
.text-left{ text-align: left; }
.text-right{ text-align: right; }
.line-through{ text-decoration: line-through; }
.wt-50{ width: 50%; }
.wt-100{ width: 100%; }
.wt-xs{ width: 50px; }
.logpage{ background: #FFF; align-items: center; justify-content: center; }
.logarea{ box-shadow: 0px 0px 20px 4px rgba(0,0,0,0.2); -webkit-box-shadow: 0px 0px 20px 4px rgba(0,0,0,0.2); -moz-box-shadow: 0px 0px 20px 4px rgba(0,0,0,0.2); border-radius: 20px; overflow: hidden; min-height: 500px; }
    .logarea .ltblock {
        background: url('./MainImageofCustomerLogin.jpg'), url('./MainImageofCustomerLogin.jpg') center center no-repeat;
        background-size: cover;
        background-blend-mode: hue;
    }
.mainlog{ border-radius: 10px; padding: 10px 10px; }
.mainlog .form-h1{ font-weight: bold; }
.mainlog span, .mainlog a{ font-size: 18px; line-height: 18px; }
.mainlog a{ color: var(--color-black); text-decoration: underline; color: var(--color-red); padding-bottom: 3px; }
.mainlog .form-elm{ border-radius: 0px; border: none; font-size: 16px; background: var(--color-light-gray); }
.mainlog button[type=submit]{ background: var(--color-red); color: var(--color-white); border: none; padding: 8px 20px; font-size: 16px; }
@media (max-width: 768px){ .mainlog button[type=submit]{ width: 100%; }
.logarea{ box-shadow: none; -webkit-box-shadow: none; -moz-box-shadow: none; border-radius: 0px; min-height: 100vh; align-content: flex-start; }
.logarea .ltblock{ height: 30vh; }
}
.bg-grad1{ background: rgb(194,16,16);
background: -moz-linear-gradient(0deg, rgba(194,16,16,1) 0%, rgba(37,49,109,1) 100%);
background: -webkit-linear-gradient(0deg, rgba(194,16,16,1) 0%, rgba(37,49,109,1) 100%);
background: linear-gradient(0deg, rgba(194,16,16,1) 0%, rgba(37,49,109,1) 100%);
filter: hue-rotate(321deg);
}
.bg-grad2{ background: rgb(194,16,16);
background: -moz-linear-gradient(90deg, rgba(194,16,16,1) 0%, rgba(37,49,109,1) 100%);
background: -webkit-linear-gradient(90deg, rgba(194,16,16,1) 0%, rgba(37,49,109,1) 100%);
background: linear-gradient(90deg, rgba(194,16,16,1) 0%, rgba(37,49,109,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#c21010",endColorstr="#25316d",GradientType=1); }
.color-grad1{ background: -moz-linear-gradient(90deg, rgba(194,16,16,1) 0%, rgba(37,49,109,1) 100%);
background: -webkit-linear-gradient(90deg, rgba(194,16,16,1) 0%, rgba(37,49,109,1) 100%);
background: linear-gradient(90deg, rgba(194,16,16,1) 0%, rgba(37,49,109,1) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent; }
.text-sm{ font-size: 13px !important; }
.profbg{ width: 100%; height: 100vh; display: block; background: url(../bg/pattern-randomized.svg) center center no-repeat; background-size: cover; position: relative; }
.profbg .profdp{ width: 100px; height: 100px; padding: 5px; border-radius: 100em; display: inline-block; }
.profbg .profdp img{ border-radius: 100%; position: relative; width: 100%; height: 100%; }
.profbg .mycard{ width: 100%; max-width: 392px; padding: 0px 0px; border-radius: 5%; overflow: hidden;
  background: url(./glare.png), url(./bg1-small.jpg);
  background-blend-mode: inherit;
  box-shadow: 0px 0px 10px 4px rgba(0,0,0,0.3), 0px -80px 80px 4px rgba(112,155,190,0.3) inset;
  -webkit-box-shadow: 0px 0px 10px 4px rgba(0,0,0,0.3), 0px -80px 80px 4px rgba(112,155,190,0.3) inset;
  -moz-box-shadow: 0px 0px 10px 4px rgba(0,0,0,0.3), 0px -80px 80px 4px rgba(112,155,190,0.3) inset;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%,-50%);
  transform: -webkit-translate(-50%,-50%);
  transform: -moz-translate(-50%,-50%);
  display: flex;
  display: -webkit-flex;
  display: -moz-flex;
}
.profbg .mycard .info{
  background: var(--color-white);
  border-radius: 20px 20px 0px 0px;
  padding: 15px 15px 5px;
  margin-top: 20px;
}
.profbg .mycard .info .bdr-btm{
  border-bottom: 1px solid #eee;
}
.profbg .mycard .info .btn-go{ display: block; background: var(--color-red); color: var(--color-white); text-decoration: none; padding: 9px 10px; border-radius: 5px; text-align: center; font-size: 18px; filter: hue-rotate(337deg); }
.flexblock{ display: flex; display: -webkit-flex; display: -moz-flex; flex-direction: column; }
@media (max-width: 768px){
.flexblock{ height: 100vh; }
}
.flexblock .flex1{ flex: 1; }
.flexblock .flex2{ flex: 3; }