*,
*::before,
*::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

body {
  margin: 0;
  font-family: Verdana, sans-serif !important;
}

input[type=checkbox] {
    transform: scale(1.5);
}

/* Remove the navbar's default margin-bottom and rounded borders */
.navbar {
  margin-bottom: 0;
  border-radius: 0;
  position:fixed !important;
  top:0px !important;
  left:0px !important;
  z-index:1000 !important;
  width: 100% !important;

}

.navbar-inverse {
  background-color: #2e3092 !important;
  /* border-color: #2e3092 !important; */
  color: #fff !important;
  text-transform: uppercase;
}

.navbar-nav > li > a {
  color: #ffffff !important;
}

/* .navbar-nav > li {
  border-right: 1px solid #ffffff !important;
} */

.navbar-nav > li > a:hover {
  background-color: #b4872b !important;
  color: #000000 !important;
}

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

.active-menu {
  background:#00ACEF;
}

/* Add a gray background color and some padding to the footer */
.footer {
  position: fixed;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 32px;
  padding-top: 0.3em;
  background: #2e3092;
  color: #fff;
  text-align: center;
}

.footer-icon, .footer-text {
  margin-left: 1.5%;
}

.footer-icon img {
  width:24px;
  height:24px;
  border-radius:50%;
  border:1px solid #ffffff;
}

/* The alert message box */
.alert {
    padding: 4px;
    color: #fff;
    background-color: #5cb85c;
    border-color: #4cae4c;
    text-align:center;
    margin-bottom:1%;
    margin-right:auto;
    margin-left:auto;
}

.alertwarning {
    padding: 4px;
    background-color: #f44336; /* Red */
    color: #FFFFFF;
    text-align:center;
    margin-bottom:1%;
    width:100%;
    text-align: center;
}

.main-page-box {
  background: #00ACEF;
  /* margin-left: 10px;
  margin-right: 10px; */
  box-sizing: border-box;
  /* width: 98.7%; */
  /* padding-top: 16px;
  padding-bottom: 16px;
  padding-left: 16px;
  padding-right: 32px; */
}

.main-page-box-signin {
    margin-top: 1.5%;
    margin-right: 0.5%;
    padding-left: 2%;
    padding-right: 2%;
}

.main-page-box-signin-up {
    /* margin-top: 2.5%; */
    margin-right: 0.5%;
    padding-left: 2%;
    padding-right: 2%;
}

.width-form {
  display: table-cell;
  width: 500px !important;
}

.main-page-box-signup {
    margin-top: 8%;
}

.main-page-box-page {
    margin-top: 7.2vw;
    padding: 16px;
}

.main-page-box-page-inner {
  background: #ffffff;
  padding: 16px;
  margin-bottom: 2.4%;
  /*margin-top: 2.8%;*/
  /* margin-top: 1.5%; */
}

.main-page-box-page-inner-signin {
  /* padding: 16px; */
  margin-bottom: 2.4%;
}

.body-box {
  background: #00ACEF;
  /* padding: 16px; */
}

.img-fluid {
  width: 24.5vh;
  max-width: 24.5vh !important;
}

.img-fluid-2 {
  width: 29.2vh;
  max-width: 29.2vh !important;
}

.year-text {
overflow: hidden;
text-align: center;
/*font-size:1em;*/
font-weight:bold;
color:#000000;
margin-top:2%;
}

.year-text:before,
.year-text:after {
background-color: #000000;
content: "";
display: inline-block;
height: 1px;
position: relative;
vertical-align: middle;
width: 13%;
}

.hr-text {
  margin-left: 1%;
  margin-right: 1%;
}

.input-container {
  display: flex;
  width: 100%;
  margin-bottom: 15px;
}

form .form-control {
  border: 1px solid #CCD6E6;
  color: #3F587E;
}

.rounded-0 {
  border-radius: 0 !important;
}

.form-control {
  display: block;
  width: 100%;
  padding: 0.75rem 1rem;
  height: 42px;
  font-size: 1.6rem;
  line-height: 1.25;
  color: #4E5154;
  background-color: #FFFFFF;
  background-image: none;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  border: 1px solid #BABFC7;
  border-radius: 0.25rem;
  -webkit-transition: border-color ease-in-out 0.15s, -webkit-box-shadow ease-in-out 0.15s;
  transition: border-color ease-in-out 0.15s, -webkit-box-shadow ease-in-out 0.15s;
  -o-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  -moz-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s, -webkit-box-shadow ease-in-out 0.15s;
}

.icon {
  padding: 10px;
  background: #eee;
  color: #000000;
  min-width: 50px;
  text-align: center;
}

.icon-2 {
  padding-top: 10px;
  padding-left: 10px;
  background: #2e3092;
  color: #ffffff;
  min-width: 50px;
  width:250px;
  text-align: left;
}

.float-left {
  float:left !important;
}

.float-right {
  float:right !important;
}

.white-div {
  /*margin-top:2%;*/
  /*margin-left:1%;*/
  /*height:auto !important;*/
  /*padding-top:24px;*/
  /*padding-bottom:20px;*/
  /*padding-right:24px;*/
  /*background:#ffffff;*/
}

.white-div-signup {
    /*margin-top:4% !important;*/
  /*margin-left:1%;*/
  /*height:auto !important;*/
  /*padding-top:16px;*/
  /*padding-bottom:20px;*/
  /*padding-right:16px;*/
  /*background:#ffffff;*/
}

.mt-2 {
  margin-top: 2%;
}

.mt-4 {
  margin-top: 4%;
}

.mt-6 {
  margin-top: 6%;
}

.mt-1 {
  margin-top: 1%;
}

.mb-2 {
  margin-bottom: 2%;
}

.ml-2 {
  margin-left: 2% !important;
}

.quadrat {
  /* width: 50px;
  height: 50px; */
  font-weight: bold;
  color: #000000;
  -webkit-animation: NAME-YOUR-ANIMATION 1s infinite;  /* Safari 4+ */
  -moz-animation: NAME-YOUR-ANIMATION 1s infinite;  /* Fx 5+ */
  -o-animation: NAME-YOUR-ANIMATION 1s infinite;  /* Opera 12+ */
  animation: NAME-YOUR-ANIMATION 1s infinite;  /* IE 10+, Fx 29+ */
}

@-webkit-keyframes NAME-YOUR-ANIMATION {
  0%, 49% {
    background-color: rgb(255,255,255);
    border: 3px solid #FFA500;
  }
  50%, 100% {
    background-color: #FFD700;
    border: 3px solid rgb(117, 209, 63);
  }
}

.form-header {
  text-align:left;
  text-align:left;
  background: #2e3092 !important;
  border: 2px solid #2e3092 !important;
  /* padding: 6px; */
  color: #ffffff;
  vertical-align: middle;
  margin-top: 0px;
  /* margin-bottom: 20px; */
  width: 100%;
  text-transform: uppercase;
  box-sizing: border-box;
  font-size: 16px;
  padding: 0 15px;
  height: 34px;
  line-height: 32px;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.35);
  overflow: visible;
  text-decoration: none !important;
  font-weight: bold;
}

.form-box {
  border:1px solid #ffffff;
  /* padding-top: 15px; */
  padding-bottom: 15px;
  background: #ffffff;
  border-radius: 4px;
}

.form-2 {
  padding: 15px;
}

.form-box-signin {
  /* height: 54vh; */
  border:1px solid #00ACEF;
  /* padding-top: 15px; */
  padding-left: 0px;
  padding-right: 0px;
  padding-bottom: 15px;
  background: #00ACEF;
  border-radius: 4px;
}

.form-box-signup {
  border:1px solid #00ACEF;
  background: #00ACEF;
  padding-left: 0px;
  padding-right: 0px;
  /* height: 61.5vh; */
}

.btn-element {
  text-align: center;
  border-width: 1px;
  border-style: solid;
  text-decoration: none !important;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.35);
  padding: 0 6px;
  height: 34px;
  color: #ffffff;
  letter-spacing:0.1em;
  line-height: 32px;
  box-sizing: border-box;
  /* font-size: 1vw; */
  /* white-space: nowrap;
  display: inline-block; */
  text-transform: uppercase;
  border-radius: 4px !important;
}

.submit-button {
  background-color: #2e3092;
  border-color: #2e3092;
  background-image: -moz-linear-gradient(top, #2e3092 0%, #0B1091 100%);
  animation: glowing 1500ms infinite;
}

.link-button {
  background-color: #b4872b;
  border-color: #b4872b;
  color:#000000;
}

.modal-xl {
  width: 90% !important;
}

/* The Modal (background) */
.modal-custom {
display: none; /* Hidden by default */
position: fixed; /* Stay in place */
z-index: 999999; /* Sit on top */
left: 0;
top: 0;
width: 100%; /* Full width */
height: 100%; /* Full height */
overflow: auto; /* Enable scroll if needed */
background-color: rgb(0,0,0); /* Fallback color */
background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content/Box */
.modal-contentcertTERMS {
background-color: #fefefe;
position: absolute;
top: 50%;
left: 50%;
margin-right: -50%;
transform: translate(-50%, -50%);
padding: 20px;
border: 1px solid #888;
width: 60%; /* Could be more or less, depending on screen size */
height:70vh;
overflow-y:scroll;
}

/* The Close Button */
.closemodal {
color: #2e3092;
font-size: 36px;
font-weight: bold;
position: absolute;
margin-top: -6%;
margin-left: 92%;
}

.closemodal:hover,
.closemodal:focus {
color: black;
text-decoration: none;
cursor: pointer;
}


/*.modal-contentcourse {*/
/*  background-color: #fefefe;*/
/*  margin-top: 8%;*/
/*  margin-left: 20%;*/
/*  padding: 20px;*/
/*  border: 1px solid #888;*/
/*  width: 60%;*/
/*  height: 70vh;*/
/*  overflow-y: scroll;*/
/*}*/

/* Modal Content/Box */
.modal-contentcourse2018 {
background-color: #fefefe;
position: absolute;
top: 50%;
left: 50%;
margin-right: -50%;
transform: translate(-50%, -50%);
padding: 20px;
border: 1px solid #888;
width: 60%; /* Could be more or less, depending on screen size */
height: 70vh;
  overflow-y: scroll;
}
/* The Close Button */
.closecourse2018 {
color: #b4872b;
float: right;
font-size: 32px;
font-weight: bold;
margin-right: 2%;
margin-top: -6%;
}
.closecourse2018:hover,
.closecourse2018:focus {
color: black;
text-decoration: none;
cursor: pointer;
}

/* Style the tab */
.tab {
  overflow: hidden;
  border: 1px solid #2e3092;
  background-color: #b4872b;
}

/* Style the buttons inside the tab */
.tab a {
  background-color: inherit;
  float: left;
  border-right: 1px solid #2e3092;
  outline: none;
  cursor: pointer;
  padding: 10px 10px;
  transition: 0.3s;
  font-size: 14px;
  color: #ffffff;
}

/* Change background color of buttons on hover */
.tab a:hover {
  background-color: #00ACEF;
}

/* Create an active/current tablink class */
.tab a.active {
  background-color: #ffffff;
  color: #2e3092;
  border-top: 2px solid #2e3092;
}

/* Style the tab content */
.tabcontent {
  display: none;
  padding: 6px 12px;
  border: 1px solid #b4872b;
  border-top: none;
}

.justifyText {
    text-align: justify !important;
}


.tab-hr {
  overflow: hidden;
  border: 1px solid #b4872b;
  background-color: #b4872b;
}

/* Style the buttons inside the tab */
.tab-hr a {
  background-color: inherit;
  float: left;
  border-right: 1px solid #FFFFFF;
  outline: none;
  cursor: pointer;
  padding: 10px 10px;
  transition: 0.3s;
  font-size: 14px;
  color: #000000 !important;
}

/* Change background color of buttons on hover */
.tab-hr a:hover {
  background-color: #2e3092;
  color: #ffffff !important;
}

/* Create an active/current tablink class */
.tab-hr a.active {
  background-color: #ffffff;
  color: #2e3092 !important;
  border-top: 1px solid #b4872b;
}


/* Style the tab */
.tab-sub {
  overflow: hidden;
  border: 1px solid #00ACEF;
  background-color: #00ACEF;
}

/* Style the buttons inside the tab */
.tab-sub a {
  background-color: inherit;
  float: left;
  border-right: 1px solid #FFFFFF;
  outline: none;
  cursor: pointer;
  padding: 10px 10px;
  transition: 0.3s;
  font-size: 14px;
  color: #ffffff !important;
}

/* Change background color of buttons on hover */
.tab-sub a:hover {
  background-color: #2e3092;
}

/* Create an active/current tablink class */
.tab-sub a.active-sub {
  background-color: #ffffff;
  color: #2e3092 !important;
  border-top: 1px solid #00ACEF;
}

.tab-sub a.active-subv {
  background-color: #ffffff;
  color: #2e3092 !important;
  border-top: 1px solid #b4872b;
}

/* Style the tab content */
.tabcontent-sub {
  text-align: justify !important;
  display: none;
  border: 1px solid #00ACEF;
  padding: 6px 12px;
  -webkit-animation: fadeEffect 1s;
  animation: fadeEffect 1s;
}

table.imagetable {
 /* font-family: verdana,arial,sans-serif; */
 font-size:14px;
 color:#333333;
 border-width: 1px;
 border-color: #999999;
 border-collapse: collapse;
 width:100%;
 margin-top: 1%;
}
table.imagetable th {
 background:#222222;
 border-width: 1px;
 padding: 8px;
 border-style: solid;
 border-color: #999999;
 text-align:left;
 color:#ffffff;
}
table.imagetable td {
 background:#fff;
 border-width: 1px;
 padding: 8px;
 border-style: solid;
 border-color: #999999;
}

.tab_content {
  display: none;
  padding: 6px 12px;
  /* border: 1px solid #ccc; */
    border-top-color: rgb(204, 204, 204);
    border-top-style: solid;
    border-top-width: 1px;
  border-top: none;
}


.ajax-loader {
visibility: hidden;
background-color: rgba(255,255,255,0.7);
position: absolute;
z-index:99999999 !important;
top:20%;
left:46%;
border-radius:50%;
}

.ajax-loader img {
position: relative;
width: 100px;
height: 100px;
}

.ajax-loaderCertification {
visibility: hidden;
background-color: rgba(255,255,255,0.7);
position: absolute;
z-index:99999999 !important;
top:20%;
left:46%;
border-radius:50%;
}

.ajax-loaderCertification img {
position: relative;
width: 100px;
height: 100px;
}

/* Style the navigation menu */
.mytopnav {
 overflow: hidden;
 background-color: #2e3092;
 position: relative;
 text-align:center;
}

/* Hide the links inside the navigation menu (except for logo/home) */
.mytopnav #myLinks {
 display: none;
}

/* Style navigation menu links */
.mytopnav a {
 color: white;
 padding: 14px 16px;
 text-decoration: none;
 font-size: 17px;
 display: block;
}

/* Style the hamburger menu */
.mytopnav a.icon {
 background: black;
 display: block;
 position: absolute;
 right: 0;
 top: 0;
}

/* Add a grey background color on mouse-over */
.mytopnav a:hover {
 background-color: #ddd;
 color: #000000;
}

.mobile-dropdowns {
  background-color: #00A5A8 !important;border-bottom:1px solid #fff;
}

.showOnMobile {
  display: none;
}

.btncpdc {
  margin-left: -10% !important;
}

#addRow, #removeRow {
  width:100% !important;
}

.submit-div {
  width:4%;
  margin-left:1%;
}

.paymentOrg {

}

.paymentM {
  margin-left: 1%;
  margin-bottom: 1% !important;
}

@media only screen and (max-width: 768px) {
  .showOnMobile {
    display: block;
  }
}

.mobile-dropdowns-box {
  background:#b4872b !important;
}

.mobile-dropdowns-title {
  width: 90% !important;
}

.pageHeader {
  display: none;
}

.checkbx {
  margin-left:2%;
}

.btnblock {
  color:#ffffff;
  text-align:left;
  background: #2e3092 !important;
  border: 2px solid #2e3092 !important;
  height:40px;
  text-transform: uppercase;
}

.btnblock:hover {
  color:#ffffff;
}

.enroll_amount {
  background: #ffffff;
  padding-left: 4px;
  padding-right: 4px;
  color:#2e3092;float:right;
}

.orange_border {
  border:2px solid #b4872b;
  border-radius: 4px;
}

.white-color {
  text-align: center !important;
  color: #ffffff;
}

.printcalendarbutton {
  float: right;background: #2e3092;color:#ffffff;margin-left:0.5%;padding: 1rem 1rem;
}

.printinvoicebutton {
  margin-left:0.5%;float:right;color:#ffffff;background:#2e3092;margin-top:1%;padding: 1rem 1rem;
}

.printcalendarbutton:hover {
  background: #b4872b;
  color:#000000;
}

.printinvoicebutton:hover {
  background: #b4872b;
  color:#000000;
}

@media screen and (max-width: 600px) {
    .main-page-box {
  margin-top: 38% !important;
}

    .mobile100width {
        width:100% !important;
    }

    .bartitle {
        white-space: normal;
        height:auto;
    }

    .white-div-mobile {
        margin-top:12%;
    }

    .form-header {
        font-size:4vw;
    }

    .or-text {
        display:none;
    }

    #formDiv {
        height:auto !important;
    }

  .enroll_amount {
    margin-top: 6%;
    width:100%;
  display: flex;
  justify-content: center;
  }

  .paydialog {
    display:block;
  }

  .checkbx {
    margin-left:5% !important;
  }

  .paydialog {
    margin-left:4%;
  }

  .submit-div {
    width:4%;
    margin-left:4%;
  }

  .btncpdc {
    margin-left: 0% !important;
  }

  .main-page-box-signin {
      margin-top: -10%;
  }

  .pageHeader {
    display: block;
  }

  .mt-56 {
    margin-top:56% !important;
  }

  .pesaicon {
      margin-top:-2% !important;
  }

  .printcalendarbutton {
    /*width:48%;*/
    width:100%;
    display: table;
    margin-top:3.4% !important;
    /*margin: 0 auto;*/
  }

  .printinvoicebutton {
    width:45%;
    display: table;
    margin: 0 auto;
    float: left !important;
  }

  .width-hundred-mobile {
    width: 100% !important;
  }

  table.imagetable {
        display: block;
        overflow-x: auto;
        white-space: nowrap;
  }

  .img-cover-mobile {
    width:98% !important;
    margin:1%;
  }

  .img-cover-box {
    padding-left: 8px;
    padding-right: 8px;
  }

  .hideOnMobile {
    display: none !important;
  }

  .marginBottomForm {
    margin-bottom: 12% !important;
  }

  .marginTop {
    margin-top: 2.6% !important;
  }

  .marginBottom {
    margin-top: 12.6% !important;
  }

  .modal-contentcertTERMS, .modal-contentcourse2018 {
    width: 90% !important;
  }

  .closemodal, .closecourse2018 {
  margin-top: -16%;
  margin-left: 82%;
  }

  .nav > li {
    border-bottom: 1px solid #ffffff;
  }

  .main-page-box-page {
      margin-top: 13%;
  }

  .tabsForMobile {
    display: block !important;
  }
  .tabsForDesktop {
    display: none !important;
  }
}