* {
    margin: 0;
    padding: 0;
    text-decoration: none;
}
body {
    font-size: 16px;
    line-height: 1.5;
    font-family: Poppins;
}




a, a:active, a:visited {
    text-decoration: none;
    color: inherit;
}
.underline, .underline a {
    text-decoration: underline;
}
.line-1 {
  line-height: 1;
}


.test {
  background: #aba;
}


@font-face  {
font-family: Poppins;
src:url('Poppins-Regular.ttf');    
}      
.text-regular {
  font-family: Poppins;
}

@font-face  {
font-family: PoppinsBold;
src:url('Poppins-Bold.ttf');    
}
.text-bold {
  font-family: Poppins-Bold;
}

@font-face  {
font-family: PoppinsBlack;
src:url('Poppins-Black.ttf');    
}
.text-thick {
  font-family: Poppins-Black;
}

@font-face  {  
font-family: PoppinsThin;
src:url('Poppins-Thin.ttf');  
}
.text-thin {
  font-family: Poppins-Thin;
}



.text-black {
  color: #000;
}

.text-almost-black  {
  color: #444;
}

.text-almost-white  {
  color: #f8f8f8;
}

.text-white {
  color: #fff;
}




.background-black {
  background: #000;
}

.background-almost-black  {
  background: #444;
}

.background-almost-white  {
  background: #f8f8f8;
}

.background-white {
  background: #fff;
}



/*EVERYTHING ABOVE THIS IS UNIVERSAL*/

                      
.height-100  {
  min-height: 100vw;
}


.width-100  {
  width: 100%;
}


.width-50  {
  width: 50%;
}

.max-width-600  {
  max-width: 600px;
}

.max-width-1000 {
  max-width: 1000px;
}



.column {
  display: flex;
  flex-direction: column;
}    
.column-reverse {
  display: flex;
  flex-direction: column;
}

.row {
  display: flex;
  flex-direction: row;
}        
.row-reverse {
  display: flex;
  flex-direction: row;
}            

.align-stretch  {
  align-items: stretch;
}
.align-center {
  align-items: center;
}
.align-start  {
  align-items: flex-start;
}
.align-end  {
  align-items: flex-end;
}                                

.justify-center {
  justify-content: center;
}
.justify-start  {
  justify-content: flex-start;
}
.justify-end  {
  justify-content: flex-end;
}
.justify-around {
  justify-content: space-around;
}
.justify-between  {
  justify-content: space-between;
}

.flex-1 {
  flex: 1;
}

.flex-2 {
  flex: 2;
}




.gap-50 {
  gap: 50px;
}
.gap, .gap-25 {
  gap: 25px;
}
.gap-10 {
  gap: 10px;
}
.gap-5 {
  gap: 5px;
}





.pad-50 {
  padding: 50px;
}
.pad, .pad-25 {
  padding: 25px;
}
.pad-10 {
  padding: 10px;
}
.pad-5 {
  padding: 5px;
}






.pad-top-50 {
  padding-top: 50px;
}
.pad-top, .pad-top-25 {
  padding-top: 25px;
}
.pad-top-10 {
  padding-top: 10px;
}
.pad-top-5 {
  padding-top: 5px;
}    

.pad-bottom-50 {
  padding-bottom: 50px;
}
.pad-bottom, .pad-bottom-25 {
  padding-bottom: 25px;
}
.pad-bottom-10 {
  padding-bottom: 10px;
}
.pad-bottom-5 {
  padding-bottom: 5px;
}

.pad-left-50 {
  padding-left: 50px;
}
.pad-left, .pad-left-25 {
  padding-left: 25px;
}
.pad-left-10 {
  padding-left: 10px;
}
.pad-left-5 {
  padding-left: 5px;
}      

.pad-right-50 {
  padding-right: 50px;
}
.pad-right, .pad-right-25 {
  padding-right: 25px;
}
.pad-right-10 {
  padding-right: 10px;
}
.pad-right-5 {
  padding-right: 5px;
}


.pad-vertical-50 {
  padding-right: 50px; 
  padding-left: 50px;
}
.pad-vertical, .pad-vertical-25 {
  padding-right: 25px;
  padding-left: 25px;  
}
.pad-vertical-10 {
  padding-right: 10px;
  padding-left: 10px;
}
.pad-vertical-5 {
  padding-right: 5px;  
  padding-left: 5px;
}


.pad-horizontal-50 {
  padding-top: 50px; 
  padding-bottom: 50px;
}
.pad-horizontal, .pad-horizontal-25 {
  padding-top: 25px;
  padding-bottom: 25px;  
}
.pad-horizontal-10 {
  padding-top: 10px;
  padding-bottom: 10px;
}
.pad-horizontal-5 {
  padding-top: 5px;  
  padding-bottom: 5px;
}


/*TO ADD:

Positions
Z Index etc


*/



@media only screen and (min-width: 1134px) {

.desktop-hidden {
  display: none;
}      

.desktop-height-100  {
  min-height: 100vw;
}


.desktop-width-100  {
  width: 100%;
}




.desktop-column {
  display: flex;
  flex-direction: column;
}    
.desktop-column-reverse {
  display: flex;
  flex-direction: column;
}

.desktop-row {
  display: flex;
  flex-direction: row;
}        
.desktop-row-reverse {
  display: flex;
  flex-direction: row;
}            

.desktop-align-stretch  {
  align-items: stretch;
}
.desktop-align-center {
  align-items: center;
}
.desktop-align-start  {
  align-items: flex-start;
}
.desktop-align-end  {
  align-items: flex-end;
}                                

.desktop-justify-center {
  justify-content: center;
}
.desktop-justify-start  {
  justify-content: flex-start;
}
.desktop-justify-end  {
  justify-content: flex-end;
}
.desktop-justify-around {
  justify-content: space-around;
}
.desktop-justify-between  {
  justify-content: space-between;
}

.desktop-flex-1 {
  flex: 1;
}

.desktop-flex-2 {
  flex: 2;
}




.desktop-gap-50 {
  gap: 50px;
}
.desktop-gap, .desktop-gap-25 {
  gap: 25px;
}
.desktop-gap-10 {
  gap: 10px;
}
.desktop-gap-5 {
  gap: 5px;
}





.desktop-pad-50 {
  padding: 50px;
}
.desktop-pad, .desktop-pad-25 {
  padding: 25px;
}
.desktop-pad-10 {
  padding: 10px;
}
.desktop-pad-5 {
  padding: 5px;
}






.desktop-pad-top-50 {
  padding-top: 50px;
}
.desktop-pad-top, .desktop-pad-top-25 {
  padding-top: 25px;
}
.desktop-pad-top-10 {
  padding-top: 10px;
}
.desktop-pad-top-5 {
  padding-top: 5px;
}    

.desktop-pad-bottom-50 {
  padding-bottom: 50px;
}
.desktop-pad-bottom, .desktop-pad-bottom-25 {
  padding-bottom: 25px;
}
.desktop-pad-bottom-10 {
  padding-bottom: 10px;
}
.desktop-pad-bottom-5 {
  padding-bottom: 5px;
}

.desktop-pad-left-50 {
  padding-left: 50px;
}
.desktop-pad-left, .desktop-pad-left-25 {
  padding-left: 25px;
}
.desktop-pad-left-10 {
  padding-left: 10px;
}
.desktop-pad-left-5 {
  padding-left: 5px;
}      

.desktop-pad-right-50 {
  padding-right: 50px;
}
.desktop-pad-right, .desktop-pad-right-25 {
  padding-right: 25px;
}
.desktop-pad-right-10 {
  padding-right: 10px;
}
.desktop-pad-right-5 {
  padding-right: 5px;
}


.desktop-pad-vertical-50 {
  padding-right: 50px; 
  padding-left: 50px;
}
.desktop-pad-vertical, .desktop-pad-vertical-25 {
  padding-right: 25px;
  padding-left: 25px;  
}
.desktop-pad-vertical-10 {
  padding-right: 10px;
  padding-left: 10px;
}
.desktop-pad-vertical-5 {
  padding-right: 5px;  
  padding-left: 5px;
}


.desktop-pad-horizontal-50 {
  padding-top: 50px; 
  padding-bottom: 50px;
}
.desktop-pad-horizontal, .desktop-pad-horizontal-25 {
  padding-top: 25px;
  padding-bottom: 25px;  
}
.desktop-pad-horizontal-10 {
  padding-top: 10px;
  padding-bottom: 10px;
}
.desktop-pad-horizontal-5 {
  padding-top: 5px;  
  padding-bottom: 5px;
}

}
@media only screen and (min-width: 769px) and (max-width: 1134px) {

.tablet-hidden {
  display: none;
}    

.tablet-height-100  {
  min-height: 100vw;
}


.tablet-width-100  {
  width: 100%;
}




.tablet-column {
  display: flex;
  flex-direction: column;
}    
.tablet-column-reverse {
  display: flex;
  flex-direction: column;
}

.tablet-row {
  display: flex;
  flex-direction: row;
}        
.tablet-row-reverse {
  display: flex;
  flex-direction: row;
}            

.tablet-align-stretch  {
  align-items: stretch;
}
.tablet-align-center {
  align-items: center;
}
.tablet-align-start  {
  align-items: flex-start;
}
.tablet-align-end  {
  align-items: flex-end;
}                                

.tablet-justify-center {
  justify-content: center;
}
.tablet-justify-start  {
  justify-content: flex-start;
}
.tablet-justify-end  {
  justify-content: flex-end;
}
.tablet-justify-around {
  justify-content: space-around;
}
.tablet-justify-between  {
  justify-content: space-between;
}

.tablet-flex-1 {
  flex: 1;
}

.tablet-flex-2 {
  flex: 2;
}




.tablet-gap-50 {
  gap: 50px;
}
.tablet-gap, .tablet-gap-25 {
  gap: 25px;
}
.tablet-gap-10 {
  gap: 10px;
}
.tablet-gap-5 {
  gap: 5px;
}





.tablet-pad-50 {
  padding: 50px;
}
.tablet-pad, .tablet-pad-25 {
  padding: 25px;
}
.tablet-pad-10 {
  padding: 10px;
}
.tablet-pad-5 {
  padding: 5px;
}






.tablet-pad-top-50 {
  padding-top: 50px;
}
.tablet-pad-top, .tablet-pad-top-25 {
  padding-top: 25px;
}
.tablet-pad-top-10 {
  padding-top: 10px;
}
.tablet-pad-top-5 {
  padding-top: 5px;
}    

.tablet-pad-bottom-50 {
  padding-bottom: 50px;
}
.tablet-pad-bottom, .tablet-pad-bottom-25 {
  padding-bottom: 25px;
}
.tablet-pad-bottom-10 {
  padding-bottom: 10px;
}
.tablet-pad-bottom-5 {
  padding-bottom: 5px;
}

.tablet-pad-left-50 {
  padding-left: 50px;
}
.tablet-pad-left, .tablet-pad-left-25 {
  padding-left: 25px;
}
.tablet-pad-left-10 {
  padding-left: 10px;
}
.tablet-pad-left-5 {
  padding-left: 5px;
}      

.tablet-pad-right-50 {
  padding-right: 50px;
}
.tablet-pad-right, .tablet-pad-right-25 {
  padding-right: 25px;
}
.tablet-pad-right-10 {
  padding-right: 10px;
}
.tablet-pad-right-5 {
  padding-right: 5px;
}


.tablet-pad-vertical-50 {
  padding-right: 50px; 
  padding-left: 50px;
}
.tablet-pad-vertical, .tablet-pad-vertical-25 {
  padding-right: 25px;
  padding-left: 25px;  
}
.tablet-pad-vertical-10 {
  padding-right: 10px;
  padding-left: 10px;
}
.tablet-pad-vertical-5 {
  padding-right: 5px;  
  padding-left: 5px;
}


.tablet-pad-horizontal-50 {
  padding-top: 50px; 
  padding-bottom: 50px;
}
.tablet-pad-horizontal, .tablet-pad-horizontal-25 {
  padding-top: 25px;
  padding-bottom: 25px;  
}
.tablet-pad-horizontal-10 {
  padding-top: 10px;
  padding-bottom: 10px;
}
.tablet-pad-horizontal-5 {
  padding-top: 5px;  
  padding-bottom: 5px;
}  

}

@media only screen and (min-width: 150px) and (max-width: 768px) {

.mobile-hidden {
  display: none;
} 

.mobile-height-100  {
  min-height: 100vw;
}


.mobile-width-100  {
  width: 100%;
}




.mobile-column {
  display: flex;
  flex-direction: column;
}    
.mobile-column-reverse {
  display: flex;
  flex-direction: column;
}

.mobile-row {
  display: flex;
  flex-direction: row;
}        
.mobile-row-reverse {
  display: flex;
  flex-direction: row;
}            

.mobile-align-stretch  {
  align-items: stretch;
}
.mobile-align-center {
  align-items: center;
}
.mobile-align-start  {
  align-items: flex-start;
}
.mobile-align-end  {
  align-items: flex-end;
}                                

.mobile-justify-center {
  justify-content: center;
}
.mobile-justify-start  {
  justify-content: flex-start;
}
.mobile-justify-end  {
  justify-content: flex-end;
}
.mobile-justify-around {
  justify-content: space-around;
}
.mobile-justify-between  {
  justify-content: space-between;
}

.mobile-flex-1 {
  flex: 1;
}

.mobile-flex-2 {
  flex: 2;
}




.mobile-gap-50 {
  gap: 50px;
}
.mobile-gap, .mobile-gap-25 {
  gap: 25px;
}
.mobile-gap-10 {
  gap: 10px;
}
.mobile-gap-5 {
  gap: 5px;
}





.mobile-pad-50 {
  padding: 50px;
}
.mobile-pad, .mobile-pad-25 {
  padding: 25px;
}
.mobile-pad-10 {
  padding: 10px;
}
.mobile-pad-5 {
  padding: 5px;
}






.mobile-pad-top-50 {
  padding-top: 50px;
}
.mobile-pad-top, .mobile-pad-top-25 {
  padding-top: 25px;
}
.mobile-pad-top-10 {
  padding-top: 10px;
}
.mobile-pad-top-5 {
  padding-top: 5px;
}    

.mobile-pad-bottom-50 {
  padding-bottom: 50px;
}
.mobile-pad-bottom, .mobile-pad-bottom-25 {
  padding-bottom: 25px;
}
.mobile-pad-bottom-10 {
  padding-bottom: 10px;
}
.mobile-pad-bottom-5 {
  padding-bottom: 5px;
}

.mobile-pad-left-50 {
  padding-left: 50px;
}
.mobile-pad-left, .mobile-pad-left-25 {
  padding-left: 25px;
}
.mobile-pad-left-10 {
  padding-left: 10px;
}
.mobile-pad-left-5 {
  padding-left: 5px;
}      

.mobile-pad-right-50 {
  padding-right: 50px;
}
.mobile-pad-right, .mobile-pad-right-25 {
  padding-right: 25px;
}
.mobile-pad-right-10 {
  padding-right: 10px;
}
.mobile-pad-right-5 {
  padding-right: 5px;
}


.mobile-pad-vertical-50 {
  padding-right: 50px; 
  padding-left: 50px;
}
.mobile-pad-vertical, .mobile-pad-vertical-25 {
  padding-right: 25px;
  padding-left: 25px;  
}
.mobile-pad-vertical-10 {
  padding-right: 10px;
  padding-left: 10px;
}
.mobile-pad-vertical-5 {
  padding-right: 5px;  
  padding-left: 5px;
}


.mobile-pad-horizontal-50 {
  padding-top: 50px; 
  padding-bottom: 50px;
}
.mobile-pad-horizontal, .mobile-pad-horizontal-25 {
  padding-top: 25px;
  padding-bottom: 25px;  
}
.mobile-pad-horizontal-10 {
  padding-top: 10px;
  padding-bottom: 10px;
}
.mobile-pad-horizontal-5 {
  padding-top: 5px;  
  padding-bottom: 5px;
}    

}