/* **** MAGNIFIC POPUP **** */
.mpopup{
  width: 100%;
  max-width: 600px;
  background-color: #ffffff;
  padding: 20px;
  margin: auto;
  position: relative;
  border:6px solid rgba(0,0,0,0.5);
}

.mpopup.with_header{
  padding-top: 60px;
  position: relative;
}

.mpopup.with_header .popup_header{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  padding: 15px 20px;
  margin: 0;
  background-color: #68ab1a;
  color: #fff;
}

.mpopup.with_header .popup_header .fa{
  margin-right: 10px;
}

.mpopup.with_header .mfp-close{
  background-color: #ffffff;
  color:#333;
  width: 25px;
  line-height: 25px;
  height: 25px;
  font-weight: bolder;
  border-radius: 50%;
  top:11px;
  right: 20px;
  opacity: 0.8;
  font-style: 22px;
}

.mpopup.with_header .mfp-close:hover{
  opacity: 1;
}


.field{
  margin-bottom: 8px;
}

.pointer{
  cursor: pointer;
}

.tokenize_select, .TokensContainer{
  height: 68px;
  width: 100%;
}

div.Tokenize ul.TokensContainer{
  height: 68px;
}

.inline_block{
  display: inline-block !important;
}

.display_table{
  display: table;
  width: 100%;
}

.display_table_cell{
  display: table-cell;
  vertical-align: top;
}


.label_file_hidden+input[type='file'],
.label_file_hidden input[type='file'] {
    width: 0.1px;
    height: 0.1px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    z-index: -1;
}



.font10{ font-size: 10px; }
.font12{ font-size: 12px; }
.font14{ font-size: 14px; }
.font16{ font-size: 16px; }
.font18{ font-size: 18px; }
.font20{ font-size: 20px; }
.font22{ font-size: 22px; }
.font24{ font-size: 24px; }
.font26{ font-size: 26px; }
.font28{ font-size: 28px; }
.font32{ font-size: 32px; }
.font36{ font-size: 36px; }
.font40{ font-size: 40px; }
.font44{ font-size: 44px; }
.font50{ font-size: 50px; }
.font70{ font-size: 70px; }


.font_bold, .text_bold{
  font-weight: bolder;
}

.text_right{
  text-align: right;
}




/* css switches */

/* switch checkboxes */

.switch {
  position: relative;
  display: inline-block;
  vertical-align: top;
  width: 56px;
  height: 20px;
  padding: 3px;
  background-color: white;
  border-radius: 18px;
  box-shadow: inset 0 -1px #ffffff, inset 0 1px 1px rgba(0, 0, 0, 0.05);
  cursor: pointer;
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
}
.switch-input {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
}
.switch-label {
  position: relative;
  display: block;
  height: inherit;
  font-size: 10px;
  text-transform: uppercase;
  background: #f9f9f9;
  border-radius: inherit;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.12), inset 0 0 2px rgba(0, 0, 0, 0.15);
  -webkit-transition: 0.15s ease-out;
  -moz-transition: 0.15s ease-out;
  -o-transition: 0.15s ease-out;
  transition: 0.15s ease-out;
  -webkit-transition-property: opacity background;
  -moz-transition-property: opacity background;
  -o-transition-property: opacity background;
  transition-property: opacity background;
}
.switch-label:before,
.switch-label:after {
  position: absolute;
  top: 50%;
  margin-top: -0.5em;
  line-height: 1;
  -webkit-transition: inherit;
  -moz-transition: inherit;
  -o-transition: inherit;
  transition: inherit;
}
.switch-label:before {
  content: attr(data-off);
  right: 11px;
  color: #aaa;
  text-shadow: 0 1px rgba(255, 255, 255, 0.5);
}
.switch-label:after {
  content: attr(data-on);
  left: 11px;
  color: white;
  text-shadow: 0 1px rgba(0, 0, 0, 0.2);
  opacity: 0;
}
.switch-input:checked ~ .switch-label {
  background: #c7cbd5;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15), inset 0 0 3px rgba(0, 0, 0, 0.2);
}
.switch-input:checked ~ .switch-label:before {
  opacity: 0;
}
.switch-input:checked ~ .switch-label:after {
  opacity: 1;
}
.switch-handle {
  position: absolute;
  top: 4px;
  left: 4px;
  width: 18px;
  height: 18px;
  background: white;
  border-radius: 10px;
  box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.2);
  background-image: -webkit-linear-gradient(top, #ffffff 40%, #f0f0f0);
  background-image: -moz-linear-gradient(top, #ffffff 40%, #f0f0f0);
  background-image: -o-linear-gradient(top, #ffffff 40%, #f0f0f0);
  background-image: linear-gradient(to bottom, #ffffff 40%, #f0f0f0);
  -webkit-transition: left 0.15s ease-out;
  -moz-transition: left 0.15s ease-out;
  -o-transition: left 0.15s ease-out;
  transition: left 0.15s ease-out;
}
.switch-handle:before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -6px 0 0 -6px;
  width: 12px;
  height: 12px;
  background: #f9f9f9;
  border-radius: 6px;
  box-shadow: inset 0 1px rgba(0, 0, 0, 0.02);
  background-image: -webkit-linear-gradient(top, #eeeeee, #ffffff);
  background-image: -moz-linear-gradient(top, #eeeeee, #ffffff);
  background-image: -o-linear-gradient(top, #eeeeee, #ffffff);
  background-image: linear-gradient(to bottom, #eeeeee, #ffffff);
}
.switch-input:checked ~ .switch-handle {
  left: 40px;
  box-shadow: -1px 1px 5px rgba(0, 0, 0, 0.2);
}
.switch-primary > .switch-input:checked ~ .switch-label {
  background: #36a9e1;
}
.switch-success > .switch-input:checked ~ .switch-label {
  background: #78cd51;
}
.switch-warning > .switch-input:checked ~ .switch-label {
  background: #fabb3d;
}
.switch-important > .switch-input:checked ~ .switch-label {
  background: #ff5454;
}
.switch-info > .switch-input:checked ~ .switch-label {
  background: #67c2ef;
}
.switch-danger > .switch-input:checked ~ .switch-label {
  background: #d9534f;
}


.radio_select{
  margin-right: 10px;
  vertical-align: middle;
}

table.table th{
  background-color: #7BC02B;
  color:#ffffff;
}
table th{
  text-align: center;
}




.content_wrapper{
  position: relative;
}
.content_wrapper.loading:before{
  content: " ";
  display: inline-block;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  border:2px solid #fff;
  border-top:2px solid #00a65a;
  background-color: rgba(255,255,255,0.6);
  position:absolute;
  top: 36%;
  left: calc(50% - 60px);
  z-index: 1;
  font-size: 18px;
  padding: 4px 8px;
  box-shadow: 0 0 10px rgba(0,0,0,0.5);
  animation-name: loading_rotation;
    animation-duration: 1.2s;
    animation-iteration-count: infinite;
    animation-timing-function: ease;
}
.content_wrapper.loading:after{
  content: " ";
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-color: rgba(255,255,255,0.6);
  animation-name: loadingFade;
    animation-duration: 2s;
}

@keyframes loadingFade {
    from {opacity: 0}
    to {opacity: 1;}
}

@-webkit-keyframes loading_rotation{from{-webkit-transform:rotate(0deg)}to{-webkit-transform:rotate(359deg)}}@-moz-keyframes loading_rotation{from{-moz-transform:rotate(0deg)}to{-moz-transform:rotate(359deg)}}@-o-keyframes loading_rotation{from{-o-transform:rotate(0deg)}to{-o-transform:rotate(359deg)}}@keyframes loading_rotation{from{transform:rotate(0deg)}to{transform:rotate(359deg)}}











/* checkboxes y radio por default */

input[type="checkbox"],
input[type="radio"] {
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
  padding: 0;
}

.radio input[type="radio"],
.radio-inline input[type="radio"],
.checkbox input[type="radio"],
.checkbox-inline input[type="radio"],
.radio input[type="checkbox"],
.radio-inline input[type="checkbox"],
.checkbox input[type="checkbox"],
.checkbox-inline input[type="checkbox"] {
  margin-left: -25px;
}
input[type="radio"],
.radio input[type="radio"],
.radio-inline input[type="radio"] {
  position: relative;
  margin-top: 6px;
  margin-right: 4px;
  vertical-align: top;
  border: none;
  background-color: transparent;
  -webkit-appearance: none;
  appearance: none;
  cursor: pointer;
}
input[type="radio"]:focus,
.radio input[type="radio"]:focus,
.radio-inline input[type="radio"]:focus {
  outline: none;
}
input[type="radio"]:before,
.radio input[type="radio"]:before,
.radio-inline input[type="radio"]:before,
input[type="radio"]:after,
.radio input[type="radio"]:after,
.radio-inline input[type="radio"]:after {
  content: "";
  display: block;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  -webkit-transition: 240ms;
  -o-transition: 240ms;
  transition: 240ms;
}
input[type="radio"]:before,
.radio input[type="radio"]:before,
.radio-inline input[type="radio"]:before {
  position: absolute;
  left: 0;
  top: -3px;
  background-color: #7bc02b;
  -webkit-transform: scale(0);
  -ms-transform: scale(0);
  -o-transform: scale(0);
  transform: scale(0);
}
input[type="radio"]:after,
.radio input[type="radio"]:after,
.radio-inline input[type="radio"]:after {
  position: relative;
  top: -3px;
  border: 2px solid #666666;
}
input[type="radio"]:checked:before,
.radio input[type="radio"]:checked:before,
.radio-inline input[type="radio"]:checked:before {
  -webkit-transform: scale(0.5);
  -ms-transform: scale(0.5);
  -o-transform: scale(0.5);
  transform: scale(0.5);
}
input[type="radio"]:disabled:checked:before,
.radio input[type="radio"]:disabled:checked:before,
.radio-inline input[type="radio"]:disabled:checked:before {
  background-color: #bbbbbb;
}
input[type="radio"]:checked:after,
.radio input[type="radio"]:checked:after,
.radio-inline input[type="radio"]:checked:after {
  border-color: #7bc02b;
}
input[type="radio"]:disabled:after,
.radio input[type="radio"]:disabled:after,
.radio-inline input[type="radio"]:disabled:after,
input[type="radio"]:disabled:checked:after,
.radio input[type="radio"]:disabled:checked:after,
.radio-inline input[type="radio"]:disabled:checked:after {
  border-color: #bbbbbb;
}
input[type="checkbox"]:not(.switch-input),
.checkbox input[type="checkbox"]:not(.switch-input),
.checkbox-inline input[type="checkbox"]:not(.switch-input) {
  position: relative;
  border: none;
  margin-bottom: -4px;
  -webkit-appearance: none;
  appearance: none;
  cursor: pointer;
}
input[type="checkbox"]:not(.switch-input):focus,
.checkbox input[type="checkbox"]:not(.switch-input):focus,
.checkbox-inline input[type="checkbox"]:not(.switch-input):focus {
  outline: none;
}
input[type="checkbox"]:not(.switch-input):focus:after,
.checkbox input[type="checkbox"]:not(.switch-input):focus:after,
.checkbox-inline input[type="checkbox"]:not(.switch-input):focus:after {
  border-color: #7bc02b;
}
input[type="checkbox"]:not(.switch-input):after,
.checkbox input[type="checkbox"]:not(.switch-input):after,
.checkbox-inline input[type="checkbox"]:not(.switch-input):after {
  content: "";
  display: block;
  width: 18px;
  height: 18px;
  margin-top: -2px;
  margin-right: 5px;
  border: 2px solid #666666;
  border-radius: 2px;
  -webkit-transition: 240ms;
  -o-transition: 240ms;
  transition: 240ms;
}
input[type="checkbox"]:not(.switch-input):checked:before,
.checkbox input[type="checkbox"]:not(.switch-input):checked:before,
.checkbox-inline input[type="checkbox"]:not(.switch-input):checked:before {
  content: "";
  position: absolute;
  top: 0;
  left: 6px;
  display: table;
  width: 6px;
  height: 12px;
  border: 2px solid #fff;
  border-top-width: 0;
  border-left-width: 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
}
input[type="checkbox"]:not(.switch-input):checked:after,
.checkbox input[type="checkbox"]:not(.switch-input):checked:after,
.checkbox-inline input[type="checkbox"]:not(.switch-input):checked:after {
  background-color: #7bc02b;
  border-color: #7bc02b;
}
input[type="checkbox"]:not(.switch-input):disabled:after,
.checkbox input[type="checkbox"]:not(.switch-input):disabled:after,
.checkbox-inline input[type="checkbox"]:not(.switch-input):disabled:after {
  border-color: #bbbbbb;
}
input[type="checkbox"]:not(.switch-input):disabled:checked:after,
.checkbox input[type="checkbox"]:not(.switch-input):disabled:checked:after,
.checkbox-inline input[type="checkbox"]:not(.switch-input):disabled:checked:after {
  background-color: #bbbbbb;
  border-color: transparent;
}





/* ------- custom button colors --------- */

.btn-navy {
  color: #fff;
  background-color: #001f3f;
  border-color: #02305f;
}
.btn-navy:hover,
.btn-navy:active,
.btn-navy.hover {
  color: #fff;
  background-color: #02305f;
}
.btn-navy.focus, .btn-navy:focus {
    color: #fff;
    background-color: #06203c;
    border-color: #02305f;
}

.btn-olive {
  color: #fff;
  background-color: #3d9970;
  border-color: #287b56;
}
.btn-olive:hover,
.btn-olive:active,
.btn-olive.hover {
  color: #fff;
  background-color: #37805f;
}
.btn-olive.focus, .btn-olive:focus {
    color: #fff;
    background-color: #37805f;
    border-color: #37805f;
}


.btn-purple {
  color: #fff;
  background-color: #605ca8;
  border-color: #413e77;
}
.btn-purple:hover,
.btn-purple:active,
.btn-purple.hover {
  color: #fff;
  background-color: #4e4b8c;
}
.btn-purple.focus, .btn-purple:focus {
    color: #fff;
    background-color: #4e4b8c;
    border-color: #4e4b8c;
}


.btn-maroon {
  color: #fff;
  background-color: #d81b60;
  border-color: #a2184b;
}
.btn-maroon:hover,
.btn-maroon:active,
.btn-maroon.hover {
  color: #fff;
  background-color: #b31c53;
}
.btn-maroon.focus, .btn-maroon:focus {
    color: #fff;
    background-color: #b31c53;
    border-color: #b31c53;
}

.btn-dark {
  color: #fff;
  background-color: #4c4c4c;
  border-color: #151515;
}
.btn-dark:hover,
.btn-dark:active,
.btn-dark.hover {
  color: #fff;
  background-color: #3e3e3e;
}
.btn-dark.focus, .btn-dark:focus {
    color: #fff;
    background-color: #3e3e3e;
    border-color: #151515;
}


.btn-gray {
  color: #383838;
  background-color: #e8e8e8;
  border-color: #b9b9b9;
}
.btn-gray:hover,
.btn-gray:active,
.btn-gray.hover {
  color: #383838;
  background-color: #cecece;
}
.btn-gray.focus, .btn-gray:focus {
    color: #383838;
    background-color: #dedede;
    border-color: #b9b9b9;
}



.btn-blue {
  color: #fff;
  background-color: #3450e6;
  border-color: #0a219e;
}
.btn-blue:hover,
.btn-blue:active,
.btn-blue.hover {
  color: #fff;
  background-color: #263fc1;
}
.btn-blue.focus, .btn-blue:focus {
    color: #fff;
    background-color: #263fc1;
    border-color: #0a219e;
}



.btn-brown {
  color: #fff;
  background-color: #ab5617;
  border-color: #92470f;
}
.btn-brown:hover,
.btn-brown:active,
.btn-brown.hover {
  color: #fff;
  background-color: #92470f;
}
.btn-brown.focus, .btn-brown:focus {
    color: #fff;
    background-color: #92470f;
    border-color: #92470f;
}


.mright5{
  margin-right: 5px !important;
}
.mright10{
  margin-right: 10px !important;
}
.mleft5{
  margin-right: 5px !important;
}
.mleft10{
  margin-right: 10px !important;
}
.mtop5{
  margin-top: 5px;
}
.mtop10{
  margin-top: 10px;
}
.mtop15{
  margin-top: 15px;
}
.mtop20{
  margin-top: 20px;
}
