/*==========BODY==========*/
body {
  background-color: #e7fce6;
}
.full-height {
  /*whole height of the browser window*/
  height: 100%;
}
.hideme {
  display: none;
}
.showme {
  display: block;
}
/*==========HEADER==========*/
header {
  background-color: #ffffff;
  min-height: 100px;
  color: #26ef30;
}
.alert-success {
  margin-top: 30px;
  margin-bottom: 50px;
}

#logo {
  box-sizing: border-box;
  float: left;
  margin-top: 20px;
  border: solid black 2px;
}
#logindiv {
  border: solid black 2px;
  float: right;
  margin-top: 15px;
  margin-right: 0px;
  text-align: center;
}
.heightmin {
  padding-top: 100px;
  padding-bottom: 600px;
}

.radiodiv {
  margin-top: 15px;
  margin-bottom: 15px;
  font-size: 0.85em;
  padding-left: 10px;
}

.btn {
  margin-top: 2px;
}
.nav-item {
  font-weight: bold;
  font-size: 0.95em;
}
.nav-item a:hover {
  font-weight: bold;
  border-bottom: dotted 3px #ff9900;
}
/*==========CSS FOR SPECIAL EVENT==========*/
#specialbtn {
  background-color: #ffffff;
  border: none;
  color: #999999;
  padding: 10px 10px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 18px;
  font-weight: bold;
  margin: 4px 2px;
  cursor: pointer;
  border-radius: 12px;
}
.xmasbtn {
  color: #999999;
  background-color: #ffffff;
  border-color: #ffffff;
  font-weight: bold;
}

/*-- Modal --*/

.tbl {
  width: 100%;
}
.tbl th {
  width: 50%;
  text-align: right;
}
.tbl td {
  width: 50%;
  text-align: left;
}
.modal-body {
  color: #800000;
  background: #ffffff;
}
.modal-header {
  /*background: #bfbfbf;*/
  background: #ffffff;
}
.modal-title {
  color: #ff0066;
  font-size: 1.35em;
  font-weight: bold;
}
.modal-footer {
  color: #000000;
  /*background: #ebebe0;*/
  background: #ffffff;
}
/*==========CSS FOR MAIN WEBSITE STARTS==========*/

#newmsg {
  color: #ff9900;
  text-align: center;
  font-weight: bold;
  font-size: 13px;
}

#calfrm {
  width: 100%;
  text-align: center;
}

#calfrm input {
  width: 90%;
  height: 25px;
  margin-bottom: 8px;
  margin-left: 5%;
  margin-right: 5%;
  border-radius: 8px;
  border: 1px solid #ff9900;
  text-align: center;
}
#calfrm p {
  width: 100%;
  text-align: center;
  padding: 0;
  margin: 0;
}
#calfrm button {
  /*Availability: https://www.w3schools.com/css/css3_buttons.asp*/
  background-color: #999966;
  border: none;
  color: #ffffff;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 0.95em;
  font-weight: bolder;
  cursor: pointer;
  border-radius: 8px;
  padding: 8px 0px;
  margin-left: 5%;
  margin-right: 5%;
  margin-bottom: 8px;
  width: 90%;
}

#iconcal {
  text-align: center;
  box-sizing: border-box;
}
#iconcal i {
  font-size: 5em;
  color: #999966;
}
#caltbl {
  margin-top: 20px;
  width: 100%;
}
#caltbl th {
  color: #ff9900;
  font-size: 1em;
  width: 50%;
  text-align: right;
  font-weight: bold;
}
#caltbl td {
  font-size: 0.85em;
  width: 50%;
  text-align: left;
  font-weight: bold;
}
#error {
  color: #ff9900;
}

#cvtagain {
  color: #999966;
  text-decoration: none;
  font-size: 1.5em;
  font-weight: bold;
}
#banner {
  margin: 10px;
  text-align: center;
  font-size: 2.5rem;
  font-weight: bold;
}

#txtHint {
  font-size: 1em;
  color: #ff9900;
  font-weight: bold;
  padding-bottom: 15px;
}

.rbox {
  text-align: center;
  height: 100px;
}
.rbox p {
  font-size: 0.7em;
}
.rbox i {
  font-size: 3em;
}

.ibox {
  text-align: center;
}
.ibox p {
  font-size: 0.95em;
}
.ibox i {
  font-size: 5em;
  width: 100%;
}
.contno {
  text-align: center;
}

.contno i {
  font-size: 3em;
  color: #999966;
  margin: 0;
  padding: 0;
  width: 100%;
}
.contno p {
  margin: 0;
  font-size: 1rem;
  text-align: center;
  color: #155724;
}
.paymt {
  width: 100%;
}
.paymt i {
  font-size: 2.7em;
  width: 60px;
}

#whatsapp {
  font-size: 4em;
  color: #28a745;
  width: 100%;
}
.tel {
  margin-top: 30px;
  margin-bottom: 20px;
}
#Regbutton {
  background-color: #ff9900;
  border: none;
  color: white;
  padding: 15px 40px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 20px;
  margin: 16px 2px;
  cursor: pointer;
  border-radius: 12px;
}
.alert-success {
  color: #155724;
  background-color: #d4edda;
  border-color: #c3e6cb;
  text-align: center;
}

.btn-cal {
  color: #fff;
  background-color: #999966;
  border-color: #999966;
  width: 100%;
}
.tail-select {
  width: 100%;
}

.tail-select .select-label {
  border-color: #ff6600;
}
.mobile-btn {
  border: none;
  padding: 15px 40px;
  margin: 16px 2px;
  border-radius: 12px;
  font-size: 20px;
  cursor: pointer;
  width: 100%;
}

.rate-btn {
  background-color: #007bff;
  border: none;
  color: white;
  padding: 15px 40px;
  margin-top: 5px;
  margin-bottom: 5px;
  border-radius: 12px;
  font-size: 16px;
  cursor: pointer;
  width: 100%;
}

.subscribe-btn {
  background-color: #999966;
  border: none;
  color: white;
  padding: 15px 40px;
  margin-top: 5px;
  margin-bottom: 5px;
  border-radius: 12px;
  font-size: 16px;
  cursor: pointer;
  width: 100%;
}
.subscribe-note {
  color: #999999;
  text-align: left;
  font-size: 1.1em;
}
.getstarted {
  /*Availability:https://www.w3schools.com/css/css3_buttons.asp*/
  background-color: #999966;
  border: none;
  color: white;
  padding: 15px 80px;
  font-size: 16px;
  margin: 20px 0px;
  border-radius: 12px;
  cursor: pointer;
}
.textani {
  box-sizing: border-box;
  text-align: center;
  color: #999999;
}
.textani p {
  font-size: 1.5em;
}
.changethewordstext {
  font-size: 2em;
}
.lowerlinks {
  /*Bootstrap bottom. Remove #bottom once site is fully bootstrap*/
  overflow: hidden;
  background-color: #053628;
  color: #ffffff;
  padding-top: 20px;
  padding-bottom: 50px;
}
.lowerlinks ul {
  text-align: left;
  padding: 10px;
  list-style-type: none;
  box-sizing: border-box;
}
.lowerlinks ul li {
  line-height: 2;
}
.lowerlinks ul li a {
  text-decoration: none;
  color: #ffffff;
  font-size: 0.85rem;
}

.lowerlinks ul li a i {
  padding-right: 10px;
  padding-left: 0;
  padding-top: 0;
  padding-bottom: 0;
  margin-left: 0;
  font-size: 1em;
  width: 0;
  text-align: center;
  text-decoration: none;
}
.lowerlinks ul li h3 {
  font-size: 1rem;
}
.midwords {
  text-align: center;
}
.midwords p {
  margin-top: 10px;
  color: #999999;
  font-size: 1.2em;
  width: 80%;
  margin: auto;
}

/*Styles phone all numbers on the website*/
a[href^="tel"] {
  color: #155724;
  text-decoration: none;
  font-weight: bold;
}

.write {
  color: #6d7177;
  text-align: justify;
  background-color: #ffffff;
  padding: 25px;
}

/*==========CSS FOR MAIN WEBSITE ENDS==========*/

/*==========11 VERTICAL TAB==========*/
/* Style the tab
AVAILABILITY: https://www.w3schools.com/howto/tryit.asp?filename=tryhow_js_vertical_tabs
 */
div.tab {
  float: left;
  box-sizing: border-box;
  background-color: #bef7bb;
  width: 100%;
  min-height: 600px;
}
div.tab i {
  font-size: 2em;
  color: #ff9900;
}
/* Style the buttons inside the tab */
div.tab button {
  display: block;
  background-color: inherit;
  padding: 0;

  width: 100%;
  border: none;
  outline: none;
  text-align: center;
  cursor: pointer;
  transition: 0.3s;

  height: 200px;
}

/* Change background color of buttons on hover */
div.tab button:hover {
  background-color: #999966;
}

/* Create an active/current "tab button" class */
div.tab button.active {
  background-color: #ace59e;
}

/* Style the tab content */
.tabcontent {
  background-color: #ffffff;
  color: #999999;
  box-sizing: border-box;
  min-height: 600px;
  text-align: justify;
}
.tabcontent h3 {
  font-size: 1.65em;
  font-weight: bold;
}
.tabcontent p {
  font-size: 1.2em;
  font-weight: bold;
}
.tch {
  margin-top: 100px;
  width: 100%;
}

.removelrp {
  padding-left: 0px;
  padding-right: 0px;
}
.tab {
  padding: 5px;
}

/*==========SOCIAL MEDIA==========*/
.socialmedia {
  text-align: center;
  margin-left: 40%;
  margin-right: 40%;
  /*background-color: #bef7bb;*/
}
.fa {
  padding: 10px;
  font-size: 1rem;
  /*width: 30px;*/
  text-align: center;
  text-decoration: none;
  margin: 5px 2px;
}

.fa:hover {
  opacity: 0.7;
}

.fa-facebook {
  background: #3b5998;
  color: white;
}

.fa-twitter {
  background: #55acee;
  color: white;
}

.fa-google {
  background: #dd4b39;
  color: white;
}

.fa-skype {
  background: #00aff0;
  color: white;
}
.fa-whatsapp {
  color: #28a745;
}
.fa-tumblr-square {
  background: #ffffff;
  color: #222;
}
.smlWhatapp {
  color: #ffffff;
  background-color: #28a745;
}

/*==========PAGES==========*/
.lout {
  height: 300px;
  text-align: center;
  padding: 100px 40px;
}
.lout p {
  font-size: 1.65em;
  margin-bottom: 0;
}
html,
body {
  height: 100%;
}
.main {
  height: 100%;
}
.minh {
  min-height: 1000px;
  margin-bottom: 100px;
}

.floatleft {
  float: left;
}
.floatright {
  float: right;
}
.loginlable {
  color: #ff9900;
}
.fileupload {
  padding-bottom: 5px;
}
.custom-file-label {
  color: #ff9900;
  border: 1px solid #ff9900;
}

.custom-file-label::after {
  background-color: #ff9900;
  color: #ffffff;
}

.input-group-text {
  border: 1px solid #ff9900;
  margin-left: 2px;
  background-color: #ff9900;
  color: #ffffff;
}
.frmtopmargin {
  margin-top: 30px;
}
.abtus {
  padding: 20px 50px;
  margin-top: 0px;
  margin-bottom: 0px;
  background-color: #d4edda;
  color: #6d7177;
  text-align: justify;
}

/*==========TABLE==========*/
.table {
  table-layout: fixed;
}

/*==========DRAWER MENU==========*/
.mainmenu {
  margin: 10px 0px;
  font-size: 0.65em;
  font-weight: bold;
}
.mbnav {
  padding-top: 10px;
  background-color: #ffffff;
  height: 70px;
}
/* The side navigation menu */
.sidenav {
  height: 100%; /* 100% Full-height */
  width: 0; /* 0 width - change this with JavaScript */
  position: fixed; /*  Stay in place */
  z-index: 1; /* Stay on top */
  top: 0; /* Stay at the top */
  left: 0;
  background-color: #ff9900; /* Black*/
  overflow-x: hidden; /* Disable horizontal scroll */
  padding-top: 30px; /* Place content 60px from the top */
  transition: 0.5s; /* 0.5 second transition effect to slide in the sidenav */
}

/* The navigation menu links */
.sidenav a {
  padding: 8px 8px 8px 32px;
  text-decoration: none;
  font-size: 1em;
  color: #ffffff;
  display: block;
  transition: 0.3s;
}

/* When you mouse over the navigation links, change their color */
.sidenav a:hover {
  color: #000000;
}

.close {
  float: right;
  line-height: 1.5;
  font-size: 36px;
  color: #ff9900;
  opacity: 1;
}

/* Position and style the close button (top right corner) */
.sidenav .closebtn {
  position: absolute;
  top: 0;
  right: 25px;
  font-size: 36px;
  margin-left: 50px;
  color: #ffffff;
}
.sidebar-header {
  margin-top: 50px;
  padding: 15px 30px;
  color: #ffffff;
  background-color: #ff8400;
}
.sidebar-header h3 {
  font-size: 1.6em;
  font-weight: bold;
}

.modal-open .modal {
  background-color: #ffffff;
}
.logomodal {
  text-align: center;
  margin-top: 20px;
  margin-bottom: 20px;
}

.launch-tandc {
  color: green;
  text-decoration: none;
  background-color: transparent;
}
.launch-tandc:hover {
  color: #ff6600;
}

/*==========Body Spinner==========*/
.center-parent {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}
.center-container {
  width: 60px;
  height: 60px;
  font-size: 20px;
  color: #ff6600;
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: -30px;
  margin-right: 0;
  margin-bottom: 0;
  margin-left: -30px;
  z-index: -1;
}
.spinnerbg {
  background-color: #e7fce6;
  /*opacity: 0.5;*/
}

div.tab {
  float: none;
  box-sizing: border-box;
  background-color: #bef7bb;
  width: 100%;
  min-height: 600px;
}
.tabcontent {
  background-color: #ffffff;
  color: #999999;

  padding: 5px 40px;
  box-sizing: border-box;
  width: 100%;
  border-left: none;
  min-height: 600px;
  text-align: justify;
}

/*==========FOOTER==========*/
footer {
  background-color: #0b0b0c;
  color: #ffffff;
  text-align: center;
  padding: 10px;
}
footer p {
  font-size: 10px;
}

/*==========CUSTOM CSS FOR BOOTSTRAP 4==========*/

.tnnum {
  color: #ff9900;
  font-size: 1.5em;
  font-weight: bold;
  margin-top: 10px;
  margin-bottom: 10px;
}
.subinfo {
  margin: 15px 20%;
}
.dropdown-item {
  font-size: 0.95em;
  background-color: #999966;
  margin-bottom: 5px;
  color: #ffffff;
}
.dropdown-item:hover {
  background-color: #28a745;
  color: #ffffff;
}

.centerme {
  text-align: center;
  color: #155724;
  font-weight: bold;
}
.aligncenter {
  text-align: center;
}

.card {
  background-color: #e7fce6;
}

.card-body {
  margin-top: 15px;
  margin-bottom: 15px;
  background-color: #ffffff;
}

.card h3 {
  font-size: 1.45em;
  font-weight: bold;
}
.card th {
  text-align: right;
}

.card-header {
  background: #e6ffe6;
  margin-top: 30px;
}
.card2 {
  background: #053628;
  color: #ffffff;
  padding-bottom: 30px;
}

.bankacheader {
  margin-top: 0px;
  background: #e6ffe6;
  font-size: 0.95em;
  font-weight: bold;
}
.bankacheader p {
  margin-bottom: 0px;
  font-size: 1.2em;
  background: #bef7bb;
  padding: 15px 10px 5px 10px;
}

table {
  margin-top: 10px;
  margin-bottom: 10px;
}
table th {
  font-size: 0.85em;
}
table td {
  font-size: 0.85em;
}
.tfrdetails {
  margin-bottom: 20px;
}
.viewac {
  padding-top: 0px;
  background: #ffffff;
}
.alignleft th {
  font-size: 0.75em;
  text-align: left;
}
.appicons {
  color: #ff9900;
  text-align: center;
  margin: 40px 20px;
}
.oragecolor {
  color: #ff9900;
  font-size: 1em;
  font-weight: bold;
}
.orangelabel {
  color: #ff9900;
  font-weight: bold;
}
legend {
  color: #ff9900;
  font-weight: bold;
}
.btn-warning {
  background: #ff9900;
  color: #ffffff;
}
.taken {
  color: #dc3545;
  margin-left: 2%;
  font-size: 0.85em;
}
.frmdiv {
  color: #28a745;
  text-align: right;
  padding: 20px 5px;
}
.frmdiv a {
  color: #28a745;
}
.login-reg {
  display: none;
}
.mobileLogin {
  display: none;
}

.loggedin {
  text-align: center;
  color: #28a745;
  padding-top: 15px;
  padding-bottom: 15px;
  font-size: 1.2rem;
}
.pageLable {
  color: #ff9900;
  font-weight: bold;
  font-size: 1.5rem;
}

/* =========================
     TARGETS DESKTOP ONLY
   ========================= 
*/
@media only screen and (min-width: 992px) {
  .login-reg {
    /*Displays this class on desktops only */
    display: block;
  }
  .mobileLogin {
    /*Hides this class on desktops only*/
    display: none;
  }
}

/* =========================
    TARGETS TABLETS & MOBILE PHONES ONLY
   ========================= 
*/
@media only screen and (max-width: 991px) {
  .login-reg {
    /*Hides this class on mobile phones & tablets only */
    display: none;
  }
  .mobileLogin {
    /*Displays this class on mobile phones & tablets only */
    display: block;
  }
}