*{
margin: 0px;
padding: 0px;
}

:root {
--main-color: #231F20;
--second-color: #CF0016;
--light-text-color: #ffffff;
--plyr-color-main: #F41D31;
}

.back-dark{
background-color: var(--main-color);
color: var(--light-text-color);
}

.back-black{
background-color: #020202;
color: #ffffff;
}

@font-face {
font-family: "font-light";
src: url(/assets/fonts/FuturaPTLight.woff2);
}
@font-face {
font-family: "font-medium";
src: url(/assets/fonts/FuturaMedium.woff2);
}
@font-face {
font-family: "font-xtrabold";
src: url(/assets/fonts/FuturaPTCondExtraBoldOblique.woff2);
}

body{
font-family: "font-light";
}

p{
font-size: 20px;
line-height: 26px;
}

a, a:hover{
color: var(--second-color);
}

.text-grey{
color: #7e7e7e;
}

.txt-red{
color: var(--second-color);
}

.mr-10x{
margin-right: 10px;
}

.f-light{
font-family: "font-light"; 
}
.f-medium{
font-family: "font-medium";
}
.f-xtrabold{
font-family: "font-xtrabold";
}

.align-right{
text-align: right;
}

.xperience{
font-size: 7rem;
}

.f1-title{
font-size:3.5rem;
}

.f2-title{
font-size:3rem;
}

.f3-title{
font-size:2.5rem;   
}

.italic{
font-style: italic;
}

.uppercase{
text-transform: uppercase;
}

.relative{
position: relative;
}

.navbar{
height: 80px;
}



.nav-link{
text-transform: uppercase;
font-family: 'font-medium';
color: #000000!important;
}

.no-link{
text-decoration: none;
color: inherit;
}

.link{
cursor: pointer;
}
.alert{
margin-top: 1rem;
font-family: 'font-medium';
text-align: center;
}

.btn-navbar,.btn-navbar:hover {
background-color: var(--second-color);
color: #ffffff;
font-family: "font-medium";
text-transform: uppercase;
}

.section{
padding-top: 50px;
padding-bottom: 50px;
}

.invert{
filter: invert(1);
}
.error{
color: var(--second-color);
font-size: 15px;
text-align: right;
}

footer{
background-color: #191919;
color: #fafafa;
padding-top: 30px;
}

.footer-border-top{
width: 90%;
height: 2px;
background-color: #231F20;
margin: auto;
margin-top: 10px;
margin-bottom: 15px;
}

.badge-active{
background-color: green;
}
.badge-incomplete,.badge-incomplete_expired,.badge-canceled, .badge-unpaid, .badge-paused {
background-color: rgb(93, 93, 93);
}

.badge-past_due{
background-color: orange; 
}

.default-button,.default-button:hover{
background-color: #cf0117;
border-radius: 50px;
font-size: 1.5rem;
text-transform: uppercase;
padding: 10px 40px;
letter-spacing: 1px;
font-family: "font-xtrabold";
color: #ffffff; 
margin-top: 30px;
}
.fs1{        
font-size: 8vw;
}
.btn-danger{
background-color: var(--second-color);
}

.badge{
font-weight: 100!important;
}

.banner-header{
background-color: var(--second-color);
color: #ffffff;
text-align: center;
font-family: "font-medium";
padding: 10px;
font-size: 1.8rem;  
}

.min-100vh-center-min-footer{
min-height: calc(100vh - 285px);
display: flex;
align-items: center;
}

.list {
list-style: inherit;
color: #a6a6a6;
}
.list-item {
padding-left: 8px;
}

@media only screen and (max-width: 991px) {
.nav-link{
color: #fafafa!important;
}
.footer-logo{
width: 100%;
}
.f3-title{
font-size: 2rem;   
}
}

@media only screen and (max-width: 767px) {
footer div.col-sm-12{
margin-bottom:30px;
}
.account-card{
margin-bottom: 25px;
}
footer{
text-align: center;
}
.footer-logo{
width: 250px;
}

.membership-card{
margin-bottom: 20px;
}
}



@media only screen and (max-width: 600px) {
.navbar-brand img{
width: 150px;
}

.banner-header{
background-color: var(--second-color);
color: #ffffff;
text-align: center;
font-family: "font-medium";
padding: 10px;
font-size: 1rem;  
}

}

@media only screen and (max-width: 400px) {
p {
font-size: 17px;
line-height: 20px;
}

}