/*************** Global Styles ***************/

:root {
    --f7-col-bg-color: #F9F9F9;

    --f7-col-primary: #2962ff;
    --f7-col-secondary: #448aff;
    --f7-col-info: #82b1ff;
    --f7-col-light: #b0bec5;
    --f7-col-dark: #424242;
    --f7-col-success: #00c853;
    --f7-col-danger: #d50000;
    --f7-col-warning: #ef6c00;

    --f7-col-primary-border: #2962ff;
    --f7-col-secondary-border: #448aff;
    --f7-col-info-border: #82b1ff;
    --f7-col-light-border: #546e7a;
    --f7-col-dark-border: #424242;
    --f7-col-success-border: #00c853;
    --f7-col-danger-border: #d50000;
    --f7-col-warning-border: #ef6c00;

}

.fw-100,.btn-f100 { font-weight: 100 !important; }
.fw-200,.btn-f200 { font-weight: 200 !important; }
.fw-300,.btn-f300 { font-weight: 300 !important; }
.fw-400,.btn-f400 { font-weight: 400 !important; }
.fw-500,.btn-f500 { font-weight: 500 !important; }
.fw-600,.btn-f600 { font-weight: 600 !important; }
.fw-700,.btn-f700 { font-weight: 700 !important; }
.fw-800,.btn-f800 { font-weight: 800 !important; }
.fw-900,.btn-f900 { font-weight: 900 !important; }


.btn {
  display: inline-block;
  font-weight: 400;
  color: #212529;
  text-align: center;
  vertical-align: middle;
  cursor: pointer;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  background-color: transparent;
  border: 1px solid transparent;
  padding: 0.375rem 0.75rem;
  font-size: 1rem;
  line-height: 1.5;
  border-radius: 0.45rem;
  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.btn.disabled, .btn:disabled {
  opacity: 0.65;
}

.btn-lg, .btn-group-lg > .btn {
  padding: 0.5rem 1rem;
  font-size: 1.25rem;
  line-height: 1.6;
  border-radius: 0.55rem;
}

.btn-sm, .btn-group-sm > .btn {
  padding: 0.25rem 0.5rem;
  font-size: 0.875rem;
  line-height: 1.4;
  border-radius: 0.35rem;
}

.btn-xs, .btn-group-xs > .btn {
  padding: 0.125rem 0.25rem;
  font-size: 0.775rem;
  line-height: 1.2;
  border-radius: 0.2rem;
}

.btn-block {
  display: block;
  width: 100%;
}
.btn-block + .btn-block {
  margin-top: 0.5rem;
}


.btn-light {
  color: var(--f7-col-dark);
  background-color: var(--f7-col-light);
  border-color: var(--f7-col-light);
}
.btn-outline-light {
  color: var(--f7-col-dark);
  border-color: var(--f7-col-light-border);
}

.btn-outline-primary {
color: var(--f7-col-primary);
border-color: var(--f7-col-primary);
}
.btn-primary {
color: #fff;
background-color: var(--f7-col-primary);
border-color: var(--f7-col-primary-border);
}

.btn-outline-dark {
color: var(--f7-col-dark);
border-color: var(--f7-col-dark);
}
.btn-dark {
color: #fff;
background-color: var(--f7-col-dark);
border-color: var(--f7-col-dark-border);
}

.btn-outline-secondary {
color: var(--f7-col-secondary);
border-color: var(--f7-col-secondary);
}
.btn-secondary {
color: #fff;
background-color: var(--f7-col-secondary);
border-color: var(--f7-col-secondary-border);
}

.btn-outline-success {
color: var(--f7-col-success);
border-color: var(--f7-col-success);
}
.btn-success {
color: #fff;
background-color: var(--f7-col-success);
border-color: var(--f7-col-success-border);
}

.btn-outline-warning {
color: var(--f7-col-warning);
border-color: var(--f7-col-warning);
}
.btn-warning {
color: #fff;
background-color: var(--f7-col-warning);
border-color: var(--f7-col-warning-border);
}

.btn-outline-danger {
color: var(--f7-col-danger);
border-color: var(--f7-col-danger);
}
.btn-danger {
color: #fff;
background-color: var(--f7-col-danger);
border-color: var(--f7-col-danger-border);
}

.btn-outline-info {
color: var(--f7-col-info);
border-color: var(--f7-col-info);
}
.btn-info {
color: #fff;
background-color: var(--f7-col-info);
border-color: var(--f7-col-info-border);
}

.bg-light { background-color: var(--f7-col-light); }
.bg-dark { background-color: var(--f7-col-dark); }
.bg-primary { background-color: var(--f7-col-primary); }
.bg-info { background-color: var(--f7-col-info); }
.bg-secondary { background-color: var(--f7-col-secondary); }
.bg-success { background-color: var(--f7-col-success); }
.bg-warning { background-color: var(--f7-col-warning); }
.bg-danger { background-color: var(--f7-col-danger); }

.text-center{
text-alignment: right !important;
}