:root {

  --primary: #73869F;
  --primary-two: #73869F;

  --secondary: #9C9C9C;
  --secondary-two: #9C9C9C;

  --light: #EAF3FF;
  --light-two: #EAF3FF;

  --dark: #2A2A2A;
  --dark-two: #2A2A2A;

  --warning: #EEEEEE;
  --warning-two: #EEEEEE;

  --danger: #a32100;
  --danger-two: #8d1c00;
  
  --success: #0f9f05;
  --success-two: #0d8704;

  --black: #000000;
  --black-two: #040404;

  --white: #FFFFFF;
  --white-two: #fbfbfb;

}

/* Color Primary */
.text-primary {
    color: var(--primary) !important;
}
.bg-primary {
    background-color: var(--primary) !important;
}
.border-primary {
    border-color: var(--primary) !important;
}


/* Color Secondary */
.text-secondary {
    color: var(--secondary) !important;
}
.bg-secondary {
    background-color: var(--secondary) !important;
}
.border-secondary {
    border-color: var(--secondary) !important;
}


/* Color Light */
.text-light {
    color: var(--light) !important;
}
.bg-light {
    background-color: var(--light) !important;
}
.border-light {
    border-color: var(--light) !important;
}


/* Color Dark */
.text-dark {
    color: var(--dark) !important;
}
.bg-dark {
    background-color: var(--dark) !important;
}
.border-dark {
    border-color: var(--dark) !important;
}


/* Color Warning */
.text-warning {
    color: var(--warning) !important;
}
.bg-warning {
    background-color: var(--warning) !important;
}
.border-warning {
    border-color: var(--warning) !important;
}

/* Color Danger */
.text-danger {
    color: var(--danger) !important;
}
.bg-danger {
    background-color: var(--danger) !important;
}
.border-danger {
    border-color: var(--danger) !important;
}

/* Color Success */
.text-success {
    color: var(--success) !important;
}
.bg-success {
    background-color: var(--success) !important;
}
.border-success {
    border-color: var(--success) !important;
}


/* Color Black */
.text-black {
    color: var(--black) !important;
}
.bg-black {
    background-color: var(--black) !important;
}
.border-black {
    border-color: var(--black) !important;
}


/* Color White */
.text-white {
    color: var(--white) !important;
}
.bg-white {
    background-color: var(--white) !important;
}
.border-white {
    border-color: var(--white) !important;
}


/****BOTONES*******/

.btn{
    border-radius: 50rem;
    padding: 1rem 1.4rem;
}

/* BTN PRIMARY*/
.btn-primary {
    color: var(--white);
    border: var(--white) 1px solid;
    background-color: var(--primary);
    transition: 0.3s all ease-out;
}
.btn-primary:hover {
    color: var(--primary-two);
    border: var(--primary-two) 1px solid;
    background-color: var(--white);
    transition: 0.3s all ease-out;
}
/* BTN SECONDARY*/
.btn-secondary {
    color: var(--white);
    border: var(--secondary) 1px solid;
    background-color: var(--secondary);
    transition: 0.3s all ease-out;
}
.btn-secondary:hover {
    color: var(--secondary);
    border: var(--secondary) 1px solid;
    background-color: var(--white);
    transition: 0.3s all ease-out;
}
.btn-check:checked+.btn-secondary, .btn-secondary.active, .btn-secondary.show, .btn-secondary:first-child:active, :not(.btn-check)+.btn-secondary:active {
    color: var(--secondary);
    border: var(--secondary) 1px solid;
    background-color: #ffffff66;
    transition: 0.3s all ease-out;
}
/* BTN BLACK*/
.btn-black {
    color: var(--white)!important;
    border: var(--white) 1px solid!important;
    background-color: var(--black)!important;
    transition: 0.3s all ease-out;
}
.btn-black:hover {
    color: var(--black)!important;
    border: var(--black) 1px solid!important;
    background-color: var(--white)!important;
    transition: 0.3s all ease-out;
}
.btn-check:checked+.btn-secondary, .btn-secondary.active, .btn-secondary.show, .btn-secondary:first-child:active, :not(.btn-check)+.btn-secondary:active {
    color: var(--black)!important;
    border: var(--black) 1px solid!important;
    background-color: #ffffff87;
    transition: 0.3s all ease-out;
}
/* BTN BLACK LIGHT  */
.btn-black-light {
    color: var(--black);
    border: var(--black) 1px solid;
    background-color: var(--light);
    transition: 0.3s all ease-out;
}
.btn-black-light:hover {
    color: var(--light);
    border: var(--black) 1px solid;
    background-color: var(--black);
    transition: 0.3s all ease-out;
}
/* BTN OUTLINE PRIMARY*/
.btn-outline {
    color: var(--white);
    border: var(--secondary) 1px solid;
    background-color: transparent;
    transition: 0.3s all ease-out;
}
.btn-outline:hover {
    color: var(--white);
    border: var(--secondary) 1px solid;
    background-color: #c197615e;
    transition: 0.3s all ease-out;
}

.btn-check:checked+.btn-outline, .btn-outline.active, .btn-outline.show, .btn-outline:first-child:active, :not(.btn-check)+.btn-outline:active {
    color: var(--white);
    border: var(--secondary) 1px solid;
    background-color: #c197615e;
    transition: 0.3s all ease-out;
}
