@font-face {
    font-family:"Lexia";
    src:url("/fonts/400_Lexia_Rg.woff") format("woff");
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family:"Inter Regular";
    src:url("/fonts/Inter-Regular.woff2") format("woff2");
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

body {
    background-color: white;
    height: 100%;
    font-family: 'Inter Regular', sans-serif;
    margin: 40px 0px;
}

.background {
    /*background-image: linear-gradient(#8881d057 0%, #5f5acd9c 100%), url(/img/default-background-image.jpg);*/
    background-color: #0e5c9b;
    background-size: cover
}

input {
    display: block;
}

label {
    margin-top: 15px;
    display: inline-block;
}

a { color: #D0006F; }

.container {
    width: 60%;
    border-radius: 30px;
    background-color: white;
    font-family: 'Inter Regular', sans-serif;
    box-shadow: 0px 0px 15px rgba(0,0,0,0.3);
}

header{
    font-family: 'Lexia';
    font-size: 28px;
    font-weight: 600;
    color: #232836;
    text-align: center;
}

#customButton {
  display: block;
  margin: auto;
}

input[type="text"],
input[type="email"],
input[type="password"],
select {
    height: 100%;
    width: 100%;
    font-size: 15px;
    font-weight: 400;
    border-radius: 6px;
}

input {
    outline: none;
    padding: 0 15px;
    border: 1px solid#CACACA;
}

.btn-primary, .btn-primary:hover, .btn-primary:active, .btn-primary:visited {
    background-color: #cd1a6f !important;
    border-color: #D0006F !important;
    border-radius: 0 !important;
}

.btn.btn-square {
    border-radius: 0 !important;
}

.required:after {
    content: "*";
    color: #cd1a6f;
}

.requiredbefore:before {
    content: "*";
    color: #cd1a6f;
}

.footer {
    /*background-color: #3c4242;*/
    color: #ffffff;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
}

.footerrelative {
    /*background-color: #3c4242;*/
    color: #ffffff;
    flex-shrink: 0;
    position: relative;
}


ul {
    margin: 0;
    list-style-type: square;
}

li {
    list-style-type: square;
}

.form-control {
    border-radius: 0px;
    padding-top: 10px;
    padding-bottom: 10px;
    height:auto;
}

input {
    display: block;
}

label {
    margin-top: 15px;
    display: inline-block;
}

input[type="date"] {
    border-radius: 0px;
    padding-top: 0px;
    padding-bottom: 5px;
}

input[type='checkbox'] {
    float: left;
    width: 20px;
}


input[type='checkbox'] + label {
    display: block;
}

a { color: #D0006F; }

.form-control:focus {
    border-color: #D0006F !important;
    box-shadow: inset 0 0px 0px #D0006F, 0 0 1px #D0006F;
}

.footercenter {
    display: flex;
    align-items:center;
}

#page-container {
    position: relative;
    min-height: 100vh;
}

#content-wrap {
    padding-bottom: 2.5rem;    /* Footer height */
}

.container-border{
    border: 1px solid #ccc;
}

.text-center {
  text-align: center;
}
.show-btn{
  position: absolute;
  top: 50%;
  left: 50%;
  user-select: none;
  transform: translate(-50%, -50%);
}
.show-btn.disabled{
  pointer-events: none;
}
.modal{
  position: absolute;
  left: 5%;
  bottom:10%;
  opacity: 0;
  bottom: -100%;
  width: 1000px;
  transition: bottom 0.4s, opacity 0.4s;
  box-shadow: 0px 0px 15px rgba(0,0,0,0.3);

}
.modal.show{
  top: auto;
  opacity: 1;
  height: fit-content;
}
.modal .top-content{
  background: linear-gradient(to right, #8F335C, #3C3F52);;
  width: 100%;
  padding: 0 0 15px 0;
  height:70px;
}
.top-content .left-text{
  text-align: center;
  padding: 20px 15px;
  font-size: 18px;
  color: #f2f2f2;
  font-weight: 500;
  user-select: none;
}
.top-content .close-icon{
  position: absolute;
  top: 10px;
  right: 20px;
  font-size: 23px;
  color: #ffffff;
  cursor: pointer;
}
.close-icon:hover{
  color: white;
}
.top-content .fa-camera-retro{
  font-size: 80px;
  color: #f2f2f2;
}
.modal .bottom-content{
  background: white;
  width: 100%;
  padding: 15px 20px;

}
.bottom-content .text{
  font-size: 28px;
  font-weight: 600;
  color: #34495e;

}
.bottom-content p{
  font-size: 18px;
  line-height: 27px;
  color: grey;
  max-height: calc(90vh - 200px);
  overflow-y: auto;

}
.bottom-content .popup-close{
  padding: 15px 0;
}
.show-btn button,
.popup-close button{
  padding: 9px 13px;
  background: #27ae60;
  border: none;
  outline: none;
  font-size: 18px;
  text-transform: uppercase;
  border-radius: 3px;
  color: #f2f2f2;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.2s;
}
.show-btn button{
  padding: 12px 15px;
}
.show-btn button:hover,
.popup-close button:hover{
  background: #26a65b;
}