/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : 19/11/2020, 07:55:27 PM
    Author     : felipe de jesus
*/

input[type="checkbox"] {
    margin: 4px 0 0;
    margin-top: 1px;
    line-height: normal;
    cursor: pointer;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
input[type="checkbox"]:focus {
    outline: thin dotted #333333;
    outline: 5px auto -webkit-focus-ring-color;
    outline-offset: -2px;
    -webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
    box-shadow: none !important;
}
.radio,.wsi-checkbox {
    margin-bottom: 3px;
    margin-top: 0;
    padding-left: 0;
}
.wsi-checkbox input[type=radio][disabled] + label:after {
    background-color: #eceff3;
}
.wsi-checkbox label {
    display: inline-block;
    cursor: pointer;
    position: relative;
    padding-left: 25px;
    margin-right: 15px;
    font-size: 13px;
    margin-bottom: 6px;
    color: #777a80;
    transition: border 0.2s linear 0s,color 0.2s linear 0s;
    margin-bottom: 10px;
    direction: ltr;
}
.wsi-checkbox label:before {
    content: "";
    display: inline-block;
    width: 20px;
    height: 20px;
    margin-right: 10px;
    position: absolute;
    left: 0px;
    top: 1.4px;
    background-color: #ffffff;
    border: 1px solid #c2c6cb;
    border-radius: 3px;
    transition: border 0.2s linear 0s,color 0.2s linear 0s;
}
.wsi-checkbox label::after {
    display: inline-block;
    width: 20px;
    height: 20px;
    position: absolute;
    left: 4.2px;
    top: 0px;
    font-size: 12px;
    transition: border 0.2s linear 0s,color 0.2s linear 0s;
}
.wsi-checkbox label:after {
    border-radius: 3px;
}
.wsi-checkbox input[type=checkbox] {
    display: none;
}
.wsi-checkbox.checkbox-circle label:after {
    border-radius: 99px;
}
.wsi-checkbox.checkbox-circle label:before {
    border-radius: 99px;
}
.wsi-checkbox input[type=checkbox]:checked + label {
    color: #4d5056;
}
.wsi-checkbox input[type=checkbox]:checked + label::after {
    font-family: 'FontAwesome','Font Awesome 5 Free';
    content: "\f00c";
    color: #0090d9;
}
.wsi-checkbox input[type=checkbox][disabled] + label {
    opacity: 0.65;
}
.wsi-checkbox input[type=checkbox][disabled] + label:before {
    background-color: #eceff3;
}
.wsi-checkbox.check-success input[type=checkbox]:checked + label:before {
    background-color: #0090d9;
    border: 1px solid #0090d9;
}
.wsi-checkbox.check-success input[type=checkbox]:checked + label::after {
    color: #ffffff;
}
.wsi-checkbox.check-primary input[type=checkbox]:checked + label:before {
    background-color: #0aa699;
    border: 1px solid #0aa699;
}
.wsi-checkbox.check-primary input[type=checkbox]:checked + label::after {
    color: #ffffff;
}
.wsi-checkbox.check-info input[type=checkbox]:checked + label:before {
    background-color: #1f3853;
    border: 1px solid #1f3853;
}
.wsi-checkbox.check-info input[type=checkbox]:checked + label::after {
    color: #ffffff;
}
.wsi-checkbox.check-warning input[type=checkbox]:checked + label:before {
    background-color: #fbb05e;
    border: 1px solid #fbb05e;
}
.wsi-checkbox.check-warning input[type=checkbox]:checked + label::after {
    color: #ffffff;
}
.wsi-checkbox.check-danger input[type=checkbox]:checked + label:before {
    background-color: #f35958;
    border: 1px solid #f35958;
}
.wsi-checkbox.check-danger input[type=checkbox]:checked + label::after {
    color: #ffffff;
}
.form-group{
    /* margin-bottom: 0px */
}
.radio label {
    display: inline-block;
    cursor: pointer;
    position: relative;
    padding-left: 25px;
    margin-right: 15px;
    font-size: 13px;
    margin-bottom: 6px;
    color: #777a80;
}
.radio label:before {
    content: "";
    display: inline-block;
    width: 20px;
    height: 20px;
    margin-right: 10px;
    position: absolute;
    left: 0;
    top: 0px;
    bottom: 2.5px;
    background-color: #ffffff;
    border: 1px solid #c2c6cb;
    border-radius: 99px;
}
.radio label:after {
    font-size: 13px;
    content: "";
    text-align: center;
    display: inline-block;
    width: 20px;
    height: 20px;
    position: absolute;
    -o-transform: scale(0);
    -ms-transform: scale(0);
    -moz-transform: scale(0);
    -webkit-transform: scale(0);
    transform: scale(0);
    border-radius: 99px;
    left: 0px;
    top: 0px;
    background-color: #6f7b8a;
    border: 1px solid #6f7b8a;
}
.radio input[type=radio] {
    display: none;
}
.radio input[type=radio][disabled] + label {
    opacity: 0.65;
}
.radio.radio-success label:after {
    background-color: #0090d9;
    border: 1px solid #0090d9;
}
.radio.radio-success input[type=radio]:checked + label:before {
    border: 1px solid #0090d9;
}
.radio.radio-primary label:after {
    background-color: #0aa699;
    border: 1px solid #0aa699;
}
.radio.radio-primary input[type=radio]:checked + label:before {
    border: 1px solid #0aa699;
}
.radio.radio-info label:after {
    background-color: #1f3853;
    border: 1px solid #1f3853;
}
.radio.radio-info label input[type=radio]:checked + :before {
    border: 1px solid #1f3853;
}
.radio.radio-warning label:after {
    background-color: #fbb05e;
    border: 1px solid #fbb05e;
}
.radio.radio-warning input[type=radio]:checked + label:before {
    border: 1px solid #fbb05e;
}
.radio.radio-danger label:after {
    background-color: #F35958;
    border: 1px solid #F35958;
}
.radio.radio-danger input[type=radio]:checked + label:before {
    border: 1px solid #F35958;
}
.radio input[type=radio]:checked + label {
    color: #4d5056;
}
.radio input[type=radio]:checked + label:after {
    -o-transform: scale(0.63);
    -ms-transform: scale(0.63);
    -moz-transform: scale(0.63);
    -webkit-transform: scale(0.63);
    transform: scale(0.63);
    line-height: 18px;
    -o-transition: -o-transform 0.1s 0s cubic-bezier(0.455, 0.03, 0.215, 1.33);
    -ms-transition: -ms-transform 0.1s 0s cubic-bezier(0.455, 0.03, 0.215, 1.33);
    -moz-transition: -moz-transform 0.1s 0s cubic-bezier(0.455, 0.03, 0.215, 1.33);
    -webkit-transition: -webkit-transform 0.1s 0s cubic-bezier(0.455, 0.03, 0.215, 1.33);
    -o-transition: transform 0.1s 0s cubic-bezier(0.455, 0.03, 0.215, 1.33);
    -ms-transition: transform 0.1s 0s cubic-bezier(0.455, 0.03, 0.215, 1.33);
    -moz-transition: transform 0.1s 0s cubic-bezier(0.455, 0.03, 0.215, 1.33);
    -webkit-transition: transform 0.1s 0s cubic-bezier(0.455, 0.03, 0.215, 1.33);
    transition: transform 0.1s 0s cubic-bezier(0.455, 0.03, 0.215, 1.33);
}
.radio input[type=radio]:checked + label:before {
    border: 1px solid #8e9095;
}


.wsi-radio label {
    display: inline-block;
    cursor: pointer;
    position: relative;
    padding-left: 25px;
    margin-right: 15px;
    font-size: 13px;
    margin-bottom: 6px;
    color: #777a80;
}
.wsi-radio label:before {
    content: "";
    display: inline-block;
    width: 20px;
    height: 20px;
    margin-right: 10px;
    position: absolute;
    left: 0;
    top: 0px;
    bottom: 2.5px;
    background-color: #ffffff;
    border: 1px solid #c2c6cb;
    border-radius: 99px;
}
.wsi-radio label:after {
    font-size: 13px;
    content: "";
    text-align: center;
    display: inline-block;
    width: 20px;
    height: 20px;
    position: absolute;
    -o-transform: scale(0);
    -ms-transform: scale(0);
    -moz-transform: scale(0);
    -webkit-transform: scale(0);
    transform: scale(0);
    border-radius: 99px;
    left: 0px;
    top: 0px;
    background-color: #6f7b8a;
    border: 1px solid #6f7b8a;
}
.wsi-radio input[type=radio] {
    display: none;
}
.wsi-radio input[type=radio][disabled] + label {
    opacity: 0.65;
}
.wsi-radio.wsi-radio-success label:after {
    background-color: #0090d9;
    border: 1px solid #0090d9;
}
.wsi-radio.wsi-radio-success input[type=radio]:checked + label:before {
    border: 1px solid #0090d9;
}
.wsi-radio.wsi-radio-primary label:after {
    background-color: #0aa699;
    border: 1px solid #0aa699;
}
.wsi-radio.wsi-radio-primary input[type=radio]:checked + label:before {
    border: 1px solid #0aa699;
}
.wsi-radio.wsi-radio-info label:after {
    background-color: #1f3853;
    border: 1px solid #1f3853;
}
.wsi-radio.rwsi-adio-info label input[type=radio]:checked + :before {
    border: 1px solid #1f3853;
}
.wsi-radio.wsi-radio-warning label:after {
    background-color: #fbb05e;
    border: 1px solid #fbb05e;
}
.wsi-radio.wsi-radio-warning input[type=radio]:checked + label:before {
    border: 1px solid #fbb05e;
}
.wsi-radio.wsi-radio-danger label:after {
    background-color: #F35958;
    border: 1px solid #F35958;
}
.wsi-radio.wsi-radio-danger input[type=radio]:checked + label:before {
    border: 1px solid #F35958;
}
.wsi-radio input[type=radio]:checked + label {
    color: #4d5056;
}
.wsi-radio input[type=radio]:checked + label:after {
    -o-transform: scale(0.63);
    -ms-transform: scale(0.63);
    -moz-transform: scale(0.63);
    -webkit-transform: scale(0.63);
    transform: scale(0.63);
    line-height: 18px;
    -o-transition: -o-transform 0.1s 0s cubic-bezier(0.455, 0.03, 0.215, 1.33);
    -ms-transition: -ms-transform 0.1s 0s cubic-bezier(0.455, 0.03, 0.215, 1.33);
    -moz-transition: -moz-transform 0.1s 0s cubic-bezier(0.455, 0.03, 0.215, 1.33);
    -webkit-transition: -webkit-transform 0.1s 0s cubic-bezier(0.455, 0.03, 0.215, 1.33);
    -o-transition: transform 0.1s 0s cubic-bezier(0.455, 0.03, 0.215, 1.33);
    -ms-transition: transform 0.1s 0s cubic-bezier(0.455, 0.03, 0.215, 1.33);
    -moz-transition: transform 0.1s 0s cubic-bezier(0.455, 0.03, 0.215, 1.33);
    -webkit-transition: transform 0.1s 0s cubic-bezier(0.455, 0.03, 0.215, 1.33);
    transition: transform 0.1s 0s cubic-bezier(0.455, 0.03, 0.215, 1.33);
}
.wsi-radio input[type=radio]:checked + label:before {
    border: 1px solid #8e9095;
}
.wsi-radio-inline{
    display: inline-block;
}
.hide{
    display: none!important;
}
.no-padding{
    padding: 0px!important;
}
.text-center{
    text-align: center!important;
}
.text-left{
    text-align: left!important;
}
.text-right{
    text-align: right!important;
}
.m-t-0{margin-top: 0px!important;}
.m-t-5{margin-top: 5px!important;}
.m-t-10{margin-top: 10px!important;}
.m-t-15{margin-top: 15px!important;}
.m-t-20{margin-top: 20px!important;}
.m-t-25{margin-top: 25px!important;}
.m-t-30{margin-top: 30px!important;}
.m-t-35{margin-top: 35px!important;}
.m-t-40{margin-top: 40px!important;}
.m-t-45{margin-top: 45px!important;}
.m-t-50{margin-top: 50px!important;}

.m-b-0{margin-bottom: 0px!important;}
.m-b-5{margin-bottom: 5px!important;}
.m-b-10{margin-bottom: 10px!important;}
.m-b-15{margin-bottom: 15px!important;}
.m-b-20{margin-bottom: 20px!important;}
.m-b-25{margin-bottom: 25px!important;}
.m-b-30{margin-bottom: 30px!important;}
.m-b-35{margin-bottom: 35px!important;}
.m-b-40{margin-bottom: 40px!important;}
.m-b-45{margin-bottom: 45px!important;}
.m-b-50{margin-bottom: 50px!important;}

.m-r-0{margin-right: 0px!important;}
.m-r-5{margin-right: 5px!important;}
.m-r-10{margin-right: 10px!important;}
.m-r-15{margin-right: 15px!important;}
.m-r-20{margin-right: 20px!important;}
.m-r-25{margin-right: 25px!important;}
.m-r-30{margin-right: 30px!important;}
.m-r-35{margin-right: 35px!important;}
.m-r-40{margin-right: 40px!important;}
.m-r-45{margin-right: 45px!important;}
.m-r-50{margin-right: 50px!important;}

.m-l-0{margin-left: 0px!important;}
.m-l-5{margin-left: 5px!important;}
.m-l-10{margin-left: 10px!important;}
.m-l-15{margin-left: 15px!important;}
.m-l-20{margin-left: 20px!important;}
.m-l-25{margin-left: 25px!important;}
.m-l-30{margin-left: 30px!important;}
.m-l-35{margin-left: 35px!important;}
.m-l-40{margin-left: 40px!important;}
.m-l-45{margin-left: 45px!important;}
.m-l-50{margin-left: 50px!important;}
.width100{
    width: 100%!important;
}
.modal-content{
    border-radius: 9px 9px 8px 8px;
}
.modal-body{
    background: white!important;
    border-radius: 0px 0px 8px 8px;
}
.modal-header .bootbox-close-button {
    opacity: inherit;
    margin-top: 0px;
    color: black!important;
    position: absolute;
    right: 15px;
}
.modal-header{
    padding-top: .7rem!important;
    padding-bottom: .8rem!important;
    border-bottom: 0px!Important;
}
.line-height{
    line-height: 1.4;
}
#wsSignature {
    border: 1px solid #6666;
    cursor: pointer;
    width: 100%;
    height: 300px;
}

/*Signature pad*/

#signature-pad .signature-pad--footer button{
    padding: 11px;
    font-size: 12px;
}

/* Toggle Switch */
/* <label class="wsi-switch m-t-10">
    <input type="checkbox">
    <div class="slider round"></div>
</label> */

.wsi-switch {
    position: relative;
    display: inline-block;
    width: 60px;
    height: 34px;
}
.wsi-switch.s50{
    width: 57px;
    height: 30px;
}
.wsi-switch.s25{
    width: 50px;
    height: 25px;
}
.wsi-switch input { 
    opacity: 0;
    width: 0;
    height: 0;
}

.wsi-switch .slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s;
}

.wsi-switch .slider:before {
    position: absolute;
    content: "";
    height: 26px;
    width: 26px;
    left: 4px;
    bottom: 4px;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
}
.wsi-switch.s50 .slider:before {
    height: 24px;
    width: 24px;
    left: 4px;
    bottom: 3px;
}
.wsi-switch.s25 .slider:before {
    height: 19px;
    width: 19px;
    left: 4px;
    bottom: 3px;
}
.wsi-switch input:checked + .slider {
  background-color: #2196F3;
}

.wsi-switch input:focus + .slider {
  box-shadow: 0 0 1px #2196F3;
}

.wsi-switch input:checked + .slider:before {
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(26px);
}

/* Rounded sliders */
.wsi-switch .slider.round {
  border-radius: 34px;
}

.wsi-switch .slider.round:before {
  border-radius: 50%;
}
/* buttons */
.wsi-btn {
    display: inline-block;
    padding: 9px 12px;
    padding-top: 7px;
    margin-bottom: 0;
    font-size: 14px;
    line-height: 20px;
    color: #5e5e5e;
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
    background-color: #d1dade;
    -webkit-border-radius: 3px!important;
    background-image: none !important;
    border: none;
    text-shadow: none;
    box-shadow: none;
    transition: all 0.12s linear 0s !important;
    font: 14px/20px "Helvetica Neue", Helvetica, Arial, sans-serif;
  }
.wsi-btn:focus {
    outline: none !important;
}
.wsi-btn .caret {
    margin-left: 3px;
}
.wsi-btn .caret.single {
    margin-left: 0px;
}
.wsi-btn:hover,
.wsi-btn:focus,
.wsi-btn:active,
.wsi-btn.active,
.wsi-btn.disabled,
.wsi-btn[disabled] {
    background-color: #b9c3c8;
}
.wsi-btn-primary {
    color: #ffffff;
    background-color: #0aa699;
}
.wsi-btn-primary:hover,
.wsi-btn-primary:focus,
.wsi-btn-primary:active,
.wsi-btn-primary.active,
.wsi-btn-primary.disabled,
.wsi-btn-primary[disabled],
.wsi-btn-primary.active.focus,
.wsi-btn-primary:active:focus,
.wsi-btn-primary:active:hover,
.open > .dropdown-toggle.wsi-btn-primary.focus,
.open > .dropdown-toggle.wsi-btn-primary:focus,
.open > .dropdown-toggle.wsi-btn-primary:hover {
    background-color: #099a8c;
}
.wsi-btn-success {
    color: #ffffff;
    background-color: #0090d9;
}
.wsi-btn-success:hover,
.wsi-btn-success:focus,
.wsi-btn-success:active,
.wsi-btn-success.active,
.wsi-btn-success.disabled,
.wsi-btn-success[disabled],
.wsi-btn-success.active.focus,
.wsi-btn-success:active:focus,
.wsi-btn-success:active:hover,
.open > .dropdown-toggle.wsi-btn-success.focus,
.open > .dropdown-toggle.wsi-btn-success:focus,
.open > .dropdown-toggle.wsi-btn-success:hover {
    background-color: #0082d4;
}
.wsi-btn-info {
    color: #ffffff;
    background-color: #1f3853;
}
.wsi-btn-info:hover,
.wsi-btn-info:focus,
.wsi-btn-info:active,
.wsi-btn-info.active,
.wsi-btn-info.disabled,
.wsi-btn-info[disabled],
.wsi-btn-info.active.focus,
.wsi-btn-info:active:focus,
.wsi-btn-info:active:hover,
.open > .dropdown-toggle.wsi-btn-info.focus,
.open > .dropdown-toggle.wsi-btn-info:focus,
.open > .dropdown-toggle.wsi-btn-info:hover {
    background-color: #1b3148;
}
.wsi-btn-warning {
    color: #ffffff;
    background-color: #fbb05e;
}
.wsi-btn-warning:hover,
.wsi-btn-warning:focus,
.wsi-btn-warning:active,
.wsi-btn-warning.active,
.wsi-btn-warning.disabled,
.wsi-btn-warning[disabled],
.wsi-btn-warning.active.focus,
.wsi-btn-warning:active:focus,
.wsi-btn-warning:active:hover,
.open > .dropdown-toggle.wsi-btn-warning.focus,
.open > .dropdown-toggle.wsi-btn-warning:focus,
.open > .dropdown-toggle.wsi-btn-warning:hover {
    background-color: #faa652;
}
.wsi-btn-danger {
    color: #ffffff;
    background-color: #f35958;
}
.wsi-btn-danger:hover,
.wsi-btn-danger:focus,
.wsi-btn-danger:active,
.wsi-btn-danger.active,
.wsi-btn-danger.disabled,
.wsi-btn-danger[disabled],
.wsi-btn-danger.active.focus,
.wsi-btn-danger:active:focus,
.wsi-btn-danger:active:hover,
.open > .dropdown-toggle.wsi-btn-danger.focus,
.open > .dropdown-toggle.wsi-btn-danger:focus,
.open > .dropdown-toggle.wsi-btn-danger:hover {
    background-color: #f14d4d;
}
.wsi-btn-danger-dark {
    color: #ffffff;
    background-color: #b94141;
}
.wsi-btn-danger-dark:hover,
.wsi-btn-danger-dark:focus,
.wsi-btn-danger-dark:active,
.wsi-btn-danger-dark.active,
.wsi-btn-danger-dark.disabled,
.wsi-btn-danger-dark[disabled] {
    background-color: #e94847;
    color: #ffffff;
}
.wsi-btn-dark {
    color: #ffffff;
    background-color: #1b1e24;
}
.wsi-btn-white {
    color: #5e5e5e;
    background-color: #ffffff;
    border: 1px solid #e5e9ec;
}
.wsi-btn-white:hover,
.wsi-btn-white:focus,
.wsi-btn-white:active,
.wsi-btn-white.active,
.wsi-btn-white.disabled,
.wsi-btn-white[disabled] {
    background-color: #fbfcfd;
    border: 1px solid #b4b9be;
}
.wsi-btn-link {
    color: #5e5e5e;
    background-color: transparent;
    border: none;
}
.wsi-btn-large {
    padding: 11px 19px;
    font-size: 16px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
}
.wsi-btn-link:hover,
.wsi-btn-link:focus,
.wsi-btn-link:active,
.wsi-btn-link.active,
.wsi-btn-link.disabled,
.wsi-btn-link[disabled] {
    background-color: transparent;
}
.wsi-btn-large [class^="icon-"],
.wsi-btn-large [class*=" icon-"] {
    margin-top: 4px;
}
.wsi-btn-small {
    padding: 3px 12px;
    font-size: 11.9px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}
.wsi-btn-small [class^="icon-"],
.wsi-btn-small [class*=" icon-"] {
    margin-top: 0;
}
.wsi-btn-mini [class^="icon-"],
.wsi-btn-mini [class*=" icon-"] {
    margin-top: -1px;
}
.wsi-btn-mini {
    padding: 2px 9px;
    font-size: 10.5px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}
.wsi-input-icon{
    position: relative
}
.wsi-input-icon i{
    position: absolute;
    top: 18px;
    right: 16px;
    color: #666!important;
    z-index: 9999;
}
.wsi-input-icon i.icon-left{
    position: absolute;
    top: 18px;
    right: 16px;
    color: #666!important;
    z-index: 99;
}
.wsi-input-icon i.icon-left{
    position: absolute;
    top: 18px;
    left: 16px;
    color: #666!important;
    z-index: 99;
}

/*Colores redes sociales*/
.ws-whatsapp-bg{
    background: #4DCC5B !important;
    border-color: #4DCC5B !important;
}
.ws-whatsapp-bg:hover{
    background: #43B550 !important;
    border-color: #43B550 !important;
    box-shadow: 0 0 0 2px #43B550 !important;
}
.ws-facebook-bg{
    background: #067AEB !important;
    border-color: #067AEB !important;
}
.ws-facebook-bg:hover{
    background: #0459AB !important;
    border-color: #0459AB !important;
    box-shadow: 0 0 0 2px #0459AB !important;
}
.ws-twitter-bg{
    background: #1D8DFF !important;
    border-color: #1D8DFF !important;
}
.ws-twitter-bg:hover{
    background: #35B9FF !important;
    border-color: #35B9FF !important;
    box-shadow: 0 0 0 2px #35B9FF !important;
}

.bds1-spinner-bubble {
    display: inline-block;
    font-size: 8px;
    margin: 30px auto;
    width: 1em;
    height: 1em;
    border-radius: 50%;
    position: relative;
    text-indent: -9999em;
    -webkit-animation: bubble-circle 1.3s infinite linear;
    animation: bubble-circle 1.3s infinite linear;
    -webkit-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
}

.bds1-spinner-bubble-primary {
    color: #663399;
}

.bds1-spinner-bubble-secondary {
    color: #52495a;
}

.bds1-spinner-bubble-success {
    color: #4CAF50;
}

.bds1-spinner-bubble-info {
    color: #263db5;
}

.bds1-spinner-bubble-warning {
    color: #FFC107;
}

.bds1-spinner-bubble-danger {
    color: #d22346;
}

.bds1-spinner-bubble-light {
    color: #bbb;
}

.bds1-spinner-bubble-dark {
    color: #47404f;
}

.bds1-spinner-bubble-gray-100 {
    color: #f8f9fa;
}

.bds1-spinner-bubble-gray-200 {
    color: #eee;
}

.bds1-spinner-bubble-gray-300 {
    color: #dee2e6;
}

.bds1-spinner-bubble-gray-400 {
    color: #ced4da;
}

@-webkit-keyframes bubble-circle {
    0%,
    100% {
        box-shadow: 0 -3em 0 0.2em, 2em -2em 0 0em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 0;
    }
    12.5% {
        box-shadow: 0 -3em 0 0, 2em -2em 0 0.2em, 3em 0 0 0, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 -1em;
    }
    25% {
        box-shadow: 0 -3em 0 -0.5em, 2em -2em 0 0, 3em 0 0 0.2em, 2em 2em 0 0, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 -1em;
    }
    37.5% {
        box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0em 0 0, 2em 2em 0 0.2em, 0 3em 0 0em, -2em 2em 0 -1em, -3em 0em 0 -1em, -2em -2em 0 -1em;
    }
    50% {
        box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 0em, 0 3em 0 0.2em, -2em 2em 0 0, -3em 0em 0 -1em, -2em -2em 0 -1em;
    }
    62.5% {
        box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 0, -2em 2em 0 0.2em, -3em 0 0 0, -2em -2em 0 -1em;
    }
    75% {
        box-shadow: 0em -3em 0 -1em, 2em -2em 0 -1em, 3em 0em 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0, -3em 0em 0 0.2em, -2em -2em 0 0;
    }
    87.5% {
        box-shadow: 0em -3em 0 0, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0, -3em 0em 0 0, -2em -2em 0 0.2em;
    }
}

@keyframes bubble-circle {
    0%,
    100% {
        box-shadow: 0 -3em 0 0.2em, 2em -2em 0 0em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 0;
    }
    12.5% {
        box-shadow: 0 -3em 0 0, 2em -2em 0 0.2em, 3em 0 0 0, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 -1em;
    }
    25% {
        box-shadow: 0 -3em 0 -0.5em, 2em -2em 0 0, 3em 0 0 0.2em, 2em 2em 0 0, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 -1em;
    }
    37.5% {
        box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0em 0 0, 2em 2em 0 0.2em, 0 3em 0 0em, -2em 2em 0 -1em, -3em 0em 0 -1em, -2em -2em 0 -1em;
    }
    50% {
        box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 0em, 0 3em 0 0.2em, -2em 2em 0 0, -3em 0em 0 -1em, -2em -2em 0 -1em;
    }
    62.5% {
        box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 0, -2em 2em 0 0.2em, -3em 0 0 0, -2em -2em 0 -1em;
    }
    75% {
        box-shadow: 0em -3em 0 -1em, 2em -2em 0 -1em, 3em 0em 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0, -3em 0em 0 0.2em, -2em -2em 0 0;
    }
    87.5% {
        box-shadow: 0em -3em 0 0, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0, -3em 0em 0 0, -2em -2em 0 0.2em;
    }
}

.bds1-loader-bubble,
.bds1-loader-bubble:before,
.bds1-loader-bubble:after {
    border-radius: 50%;
    width: 2em;
    height: 2em;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation: bubble-horz 1.8s infinite ease-in-out;
    animation: bubble-horz 1.8s infinite ease-in-out;
}

.bds1-loader-bubble {
    display: inline-block;
    font-size: 6px;
    margin: auto;
    position: relative;
    text-indent: -9999em;
    -webkit-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-animation-delay: -0.16s;
    animation-delay: -0.16s;
}

.bds1-loader-bubble-primary {
    color: #663399;
}

.bds1-loader-bubble-secondary {
    color: #52495a;
}

.bds1-loader-bubble-success {
    color: #4CAF50;
}

.bds1-loader-bubble-info {
    color: #263db5;
}

.bds1-loader-bubble-warning {
    color: #FFC107;
}

.bds1-loader-bubble-danger {
    color: #d22346;
}

.bds1-loader-bubble-light {
    color: #bbb;
}

.bds1-loader-bubble-dark {
    color: #47404f;
}

.bds1-loader-bubble-gray-100 {
    color: #f8f9fa;
}

.bds1-loader-bubble-gray-200 {
    color: #eee;
}

.bds1-loader-bubble-gray-300 {
    color: #dee2e6;
}

.bds1-loader-bubble-gray-400 {
    color: #ced4da;
}

.bds1-loader-bubble:before,
.bds1-loader-bubble:after {
    content: '';
    position: absolute;
    top: 0;
}

.bds1-loader-bubble:before {
    left: -3.5em;
    -webkit-animation-delay: -0.32s;
    animation-delay: -0.32s;
}

.bds1-loader-bubble:after {
    left: 3.5em;
}

@-webkit-keyframes bubble-horz {
    0%,
    80%,
    100% {
        box-shadow: 0 2.5em 0 -1.3em;
    }
    40% {
        box-shadow: 0 2.5em 0 0;
    }
}

@keyframes bubble-horz {
    0%,
    80%,
    100% {
        box-shadow: 0 2.5em 0 -1.3em;
    }
    40% {
        box-shadow: 0 2.5em 0 0;
    }
}