:root {
   --color-light-one: #ffffff;
   --color-light-two: #f5f5f5;
   --color-light-tre: #dddddd;
   --color-dark-one: #202020;
   --color-dark-two: #3f3f3f;
   --color-text-one: #333333;
   --color-text-two: #575757;
   --color-text-tre: #757575;
   --color-corp-one: #106fa8;
   --color-corp-two: #f7971f;
   --color-text-white: #ffffff;
   --color-info: #11cdef;
   --color-error: #f5365c;
   --color-success: #2dce89;
   --color-warning: #fb6340;
   --radius-one: 5px;
   --radius-two: 50%;
   font-size: 16px;
}

* {
   padding: 0;
   margin: 0;
   box-sizing: border-box;
   outline: none;
}

body {
   background-color: var(--color-light-one);
   color: var(--color-text-two);
   font-family: 'Roboto Condensed', sans-serif;
   line-height: 1.5;
}
textarea,
select,
input {
   padding: 0.4rem 0.8rem;
   border: solid 1px var(--color-light-tre);
   border-radius: var(--radius-one);
   background-color: var(--color-light-one);
   color: var(--color-text-one);
}
input[type='password']:focus,
input[type='email']:focus,
input[type='text']:focus {
   box-shadow: 0 0 5px #46c2ff30;
   border: solid 1px #95d6ff;
}
textarea {
   font-family: inherit;
   width: 100%;
}
button {
   border: none;
}
option {
   padding: 6px;
}
a {
   text-decoration: none;
}
li {
   list-style: none;
}
img {
   max-width: 100%;
   display: block;
}
main {
   min-height: 50vh;
}
.smll {
   font-size: 0.7rem;
}
.h1,
h1 {
   font-size: 2.3rem;
}
.h2,
h2 {
   font-size: 1.8rem;
}
.h3,
h3 {
   font-size: 1.28rem;
}
.h4,
h4 {
   font-size: 1.2rem;
}
.h5,
h5 {
   font-size: 0.875rem;
}
.h6,
h6 {
   font-size: 0.8125rem;
}

.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
h1,
h2,
h3,
h4,
h5,
h6 {
   margin-bottom: 0.4rem;
   font-weight: 300;
}
.load-ini {
   display: flex;
   align-items: center;
   justify-content: center;
   height: 10vh;
}
.conteiner {
   max-width: 1400px;
}
.row {
   display: flex;
   flex-wrap: wrap;
}
.col-1 {
   flex: 0 0 8.333333%;
   max-width: 8.333333%;
}
.col-2 {
   flex: 0 0 16.666667%;
   max-width: 16.666667%;
}
.col-3 {
   flex: 0 0 25%;
   max-width: 25%;
}
.col-4 {
   flex: 0 0 33.333333%;
   max-width: 33.333333%;
}
.col-5 {
   flex: 0 0 41.666667%;
   max-width: 41.666667%;
}
.col-6 {
   flex: 0 0 50%;
   max-width: 50%;
}

.col-7 {
   flex: 0 0 58.333333%;
   max-width: 58.333333%;
}

.col-8 {
   flex: 0 0 66.666667%;
   max-width: 66.666667%;
}

.col-9 {
   flex: 0 0 75%;
   max-width: 75%;
}

.col-10 {
   flex: 0 0 83.333333%;
   max-width: 83.333333%;
}

.col-11 {
   flex: 0 0 91.666667%;
   max-width: 91.666667%;
}

.col-12 {
   flex: 0 0 100%;
   max-width: 100%;
}
.flex-center-v,
.flex-center-h,
.flex-center-all,
.flex-c-all,
.flex-sb,
.flex-sa,
.flex {
   display: flex;
}
.flex-sa {
   justify-content: space-around;
}
.flex-sb {
   justify-content: space-between;
}
.flex-center-all,
.flex-center-h {
   justify-content: center;
}
.flex-center-v,
.flex-center-all {
   align-items: center;
}

.wrap,
.flex-wrap {
   flex-wrap: wrap;
}
.radio,
.checkbox {
   user-select: none;
}

[class*='btn-'],
.btn,
.switch {
   cursor: pointer;
}
.btn-warning,
.btn-prime,
.btn-second,
.btn-default,
.btn-info,
.btn-success,
.btn-error,
.btn {
   font-size: 0.8rem;
   padding: 0.62rem 1.25rem;
   border-radius: 0.25rem;
   display: inline-block;
   color: var(--color-light-one);
   background-color: var(--color-corp-one);
   user-select: none;
   box-shadow: 0 4px 6px rgba(50, 50, 93, 0.11), 0 1px 3px rgba(0, 0, 0, 0.08);
   transition-duration: 0.3s;
}
[class*='btn-'] i ~ span {
   margin-left: 0.25rem;
}
.btn:hover,
[class*='btn-']:hover {
   transform: translateY(-1px);
   box-shadow: 0 7px 14px rgba(50, 50, 93, 0.1), 0 3px 6px rgba(0, 0, 0, 0.08);
}
.btn-s {
   font-size: 0.75rem;
   padding: 0.25rem 0.5rem;
   border-radius: 0.25rem;
}
.btn-m {
   padding: 0.625rem 1.25rem;
   border-radius: 0.25rem;
}
.btn-l {
   font-size: 0.9rem;
   padding: 0.8rem 1.4rem;
   border-radius: 0.4rem;
}
.btn-prime {
   background-color: var(--color-corp-one);
}
.btn-second {
   background-color: var(--color-corp-two);
}
.btn-default {
   color: var(--color-text-tre);
   background-color: var(--color-light-two);
}
.btn-warning {
   background-color: var(--color-warning);
}
.btn-info {
   background-color: var(--color-info);
}
.btn-success {
   background-color: var(--color-success);
}
.btn-error {
   background-color: var(--color-error);
}
.mrg-a {
   display: block;
   margin: auto;
}
.switch {
   position: relative;
   display: inline-block !important;
   width: 52px;
   height: 1.5rem;
   font-size: 0.9rem;
   margin-left: 0.8rem;
   vertical-align: middle;
}
.switch input {
   display: none;
}
.data-switch {
   position: absolute;
   top: 0;
   right: 0;
   bottom: 0;
   left: 0;
   border: 1px solid var(--color-corp-one);
   background-color: var(--color-light-one);
   border-radius: 34px !important;
}

.switch input:checked + .data-switch::after {
   right: auto;
   left: 0;
   content: attr(data-on);
   margin-left: 0.3rem;
   color: var(--color-light-one);
}
.switch input:checked + .data-switch::before {
   transform: translateX(28px);
   background-color: var(--color-light-one);
}
.switch input:checked + .data-switch {
   border: solid 1px var(--color-corp-one);
   background-color: var(--color-corp-one);
}
.data-switch::before {
   bottom: 2px;
   left: 2px;
   width: 18px;
   height: 18px;
   border-radius: 50% !important;
   background-color: var(--color-corp-one);
   content: '';
}
.switch input:disabled + .data-switch {
   border: solid 1px var(--color-light-tre);
   color: var(--color-light-tre);
   cursor: default;
}

.switch input:disabled + .data-switch::before {
   background-color: var(--color-light-tre);
}
.switch input:checked:disabled + .data-switch {
   background-color: var(--color-light-tre);
}
.switch input:checked:disabled + .data-switch::after {
   color: var(--color-text-tre);
}
.switch input:disabled:checked + .data-switch::before {
   background-color: var(--color-light-one);
}
.data-switch::before,
.data-switch::after {
   position: absolute;
   transition-duration: 0.4s;
}
.data-switch::after {
   top: 1px;
   right: 0;
   display: block;
   overflow: hidden;
   min-width: 1.6rem;
   content: attr(data-off);
   color: var(--color-text-two);
}
.radio input,
.checkbox input {
   display: none;
}
.radio,
.checkbox {
   position: relative;
   font-size: 0.9rem;
}
.data-radio ~ *,
.data-checkbox ~ * {
   margin-left: 1.4rem;
   vertical-align: middle;
}
.data-radio,
.data-checkbox {
   position: absolute;
   left: 0;
   top: 0;
}

.data-radio::before,
.data-checkbox::before {
   width: 1rem;
   height: 1rem;
   position: absolute;
   display: block;
   content: '';
   border-radius: var(--radius-one);
   border: solid 1px var(--color-corp-one);
   background-color: #fff;
   transition-duration: 0.4s;
   line-height: 1.3;
   font-size: 0.7rem;
}

.radio input:checked ~ .data-radio::before,
.checkbox input:checked ~ .data-checkbox::before {
   background-color: var(--color-corp-one);
   font-family: 'laws';
   color: var(--color-light-one);
   top: 1px;
   font-size: 0.8rem;
}
.checkbox input:checked ~ .data-checkbox::before {
   content: '\e908';
}
.radio input:checked ~ .data-radio::before {
   content: '\e90a';
}

.data-radio::before {
   border-radius: 50%;
   text-align: center;
}
/*Scroll */
::-webkit-scrollbar {
   width: 8px;
   height: 8px;
}

::-webkit-scrollbar-thumb {
   background: var(--color-light-tre);
   border-radius: 5px;
}

::-webkit-scrollbar-thumb:active {
   background-color: #888888;
}

::-webkit-scrollbar-thumb:hover {
   background: var(--color-light-tre);
   box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.2);
}

::-webkit-scrollbar-track {
   background: var(--color-light-two);
   border-radius: 5px;
}

::-webkit-scrollbar-track:hover,
::-webkit-scrollbar-track:active {
   background: var(--color-light-one);
}
