@import url("https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700");

body{
  font-family: 'Open Sans', sans-serif;
  color: #717271;
  background-color: #EEEDEE;
}
.dart-header{
  background-color: #717271;
}
.text{
  color: #717271 !important;
}
.red{
  color: #EF3340;
}
.black{
  color: #000;
}
.white{
  color: #ffffff;
  font-size:21px;
}
@media screen and (min-width: 578px) {
  .white {
    font-size: 32px;
  }
}
input {
  color: #C83A44 !important;
  border: 0 !important;
  border-bottom: 1px solid
  #717271 !important;
  background-color: rgba(0, 0, 0, 0) !important;
  border-radius: 0 !important;
  padding-left: 0 !important;
  box-shadow: 0 0 0 0 !important;
}

label.cameraButton {
  display: inline-block;
  margin: 1em 0;
}

/* Look like a clicked/depressed button */
label.cameraButton:active {
  border-color: #CCC #EEE #EEE #CCC;
}

/* This is the part that actually hides the 'Choose file' text box for camera inputs */
label.cameraButton input[accept*="camera"] {
  display: none;
}

.btn-primary, .btn-primary:hover, .btn-primary:active, .btn-primary:visited {
  color: #fff;
  background-color: #EF3340 !important;
  border-color: #EF3340 !important;
}

.btn-ok{
  background-color: #22bf7e !important;
  border-color: #22bf7e !important;
}

.btn-ok:hover{
  background-color: #22bf7e !important;
  border-color: #22bf7e !important;
}

.btn-white, .btn-white:hover, .btn-white:active, .btn-white:visited {
  color: #000;
  background-color: #FFF !important;
  border-color: #000 !important;
}

#sig-canvas {
  border: 2px dotted #CCCCCC;
  border-radius: 15px;
  cursor: crosshair;
}

a{
  color: #717271 !important;
}

.custom-control-input:checked~.custom-control-label::before {
  color: #fff;
  background-color: #EF3340 !important;
  border-color: #EF3340 !important;
}

.custom-control-input~.custom-control-label::before {
  border-radius: 20px;
}

.swal-content__input{
  border-radius: 5px; !important
}

/*PDF MODAL*/
.close{
  position: absolute;
  right: 5%;
}

.modal-dialog{
  max-width: none !important;
  width: 80%;
  height: 90%;
  margin-left: 10% !important;
}

.modal-content{
  height: 100%;
}

.modal-body{
  width:100%;
  height: 50% !important;
}

.modal-body>*, .iframe-container > iframe{
  width: 100%;
  height: 100%;
}