/*UNIVERSAL CSS*/        

* {
  margin: 0;
  padding: 0;
  text-decoration: none;
}

body  {
  width: 100%;
  font-family: Poppins;  
  font-size: 16px;  
} 



/*SITE-SPECIFIC CSS*/


.background-ommp {
  background: url('ommp.jpg');
  background-size: cover;  
}

.background-dispensary  {
  background: url('dispensary.jpg');
    background-size: cover;  
}

.mobile-250-high  {
  height: 250px;
}

/*-----SMALL MOBILE MENU CSS------*/

.mobile-menu-wrap {
background: url('testbox-a.png');
background-position: contain;
background-repeat: no-repeat;
}
.mobile-menu-container:hover  {
width: 100%;
display: flex;
flex-direction: column;
align-items: flex-end;
background-color: #fff;
background-position: contain;
background-image: url('testbox-b.png');
background-repeat: no-repeat;
}
.mobile-menu p:hover {
cursor: pointer;
}
.mobile-menu ul  {
display: none;
position: relative;
}
.mobile-menu:active ul, .mobile-menu:hover ul {
display: block 
} 
.mobile-menu:hover {
}
.mobile-menu ul li {
list-style: none;
text-align: center;  
}
.mobile-menu ul li p:hover {
color: #f9f9f9;
background-color: #444;  
}
.button-small {
font-family: poppinsBold;
padding: 2px 6px;
border-style: solid;
border-color: #d7d7d7;  
border-width: 2px;
border-radius: 4px;
}



.test {
  background-color: #cc1;
}

.test-2 {
  background-color: #c1b;
}

.test-3 {
  background-color: #158dc9;
}


.background-image {    
background: url('background-1.jpg');
background-repeat: no-repeat;
background-size: cover;
}      

.background-pattern {      
background: url('background-pattern1.jpg');
background-repeat: repeat;  
}



/*SITE-SPECIFIC FONT TIFFS & STYLE ASSIGNMENTS*/

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

}
@font-face  {
  font-family: PoppinsMedium;
  src:url('Poppins-Medium.ttf');    
}
@font-face  {
  font-family: PoppinsBold;
  src:url('Poppins-Bold.ttf');    
}
@font-face  {
  font-family: PoppinsBlack;
  src:url('Poppins-Black.ttf');    
}
@font-face  {    
  font-family: PoppinsThin;
  src:url('Poppins-Thin.ttf');
}

.font-regular {
  font-family: Poppins;
}
.font-medium {
  font-family: PoppinsMedium;
}  
.font-bold {
  font-family: PoppinsBold;  
}    
.font-thick {
  font-family: PoppinsBlack;  
}    
.font-thin {
  font-family: PoppinsThin;
}


.font-huge  {
  font-size: 48px;
}


/*TEXT DECORATIONS, A HREF, & FORMATTING*/      


a, a:active, a:visited  {
  text-decoration: none;
  color: inherit;
}

a:hover, a:hover p  {  
color: #fff; 
background: #000;  
}    


.underline, .underline a {
  text-decoration: underline;
}  
          
.overflow-hidden  {
  overflow: hidden;
}    

.line-height-1  {
  line-height: 1;
}

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

.list-style-none  {
  list-style: none;
}



/*TEXT & BACKGROUND COLORS*/


.text-black {
  color: #000;
}
.text-almost-black {
  color: #262626;
}
.text-white {
  color: #fff;
}
.text-almost-white {
  color: #f9f9f9;
} 
.text-gray {
  color: #7d7d7d;
}
.text-dark-gray {
  color: #444;
}  
.text-lite-gray {
  color: #d7d7d7;
}  
.text-super-lite-gray {
  background: #f0f0f0;
}  
.text-gray-blue {
  color: #5f638f;
} 
.text-blue {
  color: #103d92;
}   
.text-dark-blue {
  color: #1a1c88;
}       
.text-lite-blue {
  color: #0186AD;
} 
.text-purple  {
  color: #663399;
}       
.text-dark-purple  {
  color: #45228a;
} 
.text-darker-purple {
  color:  #45228a;
} 
.text-cherry-purple {
  color: #990066;
}  
.text-red {
  color: #cc0000;
}  
.text-cherry-red {
  color: #990000;
}
.text-hot-pink  {
  color: #FF0099;
}    
.text-light-pink  {
  color: #FF66CC;
}
.text-super-light-pink  {
  color: #ffddf4;
}
.text-green {
  color: #41cf41;
}
.text-lite-green {
  color: #a0ff11;
}
.text-dark-green {
  color: #FFF703;
}


.background-black {
  background: #000;
}
.background-almost-black {
  background: #262626;
}
.background-white {
  background: #fff;
}
.background-almost-white {
  background: #f9f9f9;
} 
.background-gray {
  background: #7d7d7d;
}
.background-dark-gray {
  background: #444;
} 

.background-lite-gray {
  background: #cec8c8;
}   
.background-super-lite-gray {
  background: #f0f0f0;
}  
.background-gray-blue {
  background: #5f638f;
} 
.background-blue {
  background: #103d92;
}   
.background-dark-blue {
  background: #1a1c88;
}       
.background-lite-blue {
  background: #0186AD;
} 
.background-teal {
  background: #3aafa9;
} 

.background-teal-green {
  background: #2b7a78;
}
.background-purple  {
  background: #663399;
}       
.background-dark-purple  {
  background: #45228a;
} 
.background-darker-purple {
  background:  #45228a;
} 
.background-cherry-purple {
  background: #990066;
}  
.background-red {
  background: #cc0000;
}  
.background-cherry-red {
  background: #990000;
}
.background-hot-pink  {
  background: #FF0099;
}    
.background-light-pink  {
  background: #FF66CC;
}
.background-super-light-pink  {
  background: #ffddf4;
}
.background-green {
  background: #41cf41;
}
.background-lite-green {
  background: #a0ff11;
}
.background-dark-green {
  background: #FFF703;
}


/*BORDER COLORS & STYLES*/


.border-black {
  border-style: solid;
  border-color: #000;
}
.border-almost-black {
  border-style: solid;
  border-color: #262626;
}
.border-white {
  border-style: solid;
  border-color: #fff;
}
.border-almost-white {
  border-style: solid;
  border-color: #f9f9f9;
} 
.border-gray {
  border-style: solid;
  border-color: #7d7d7d;
}
.border-dark-gray {
  border-style: solid;
  border-color: #444;
}  
.border-lite-gray {
  border-style: solid;
  border-color: #cec8c8;
}  
.border-super-lite-gray {
  border-style: solid;
  border-color: #f0f0f0;
} 
.border-gray-blue {
  border-style: solid;
  border-color: #5f638f;
} 
.border-blue {
  border-style: solid;
  border-color: #103d92;
}   
.border-dark-blue {
  border-style: solid;
  border-color: #1a1c88;
}       
.border-lite-blue {
  border-style: solid;
  border-color: #0186AD;
} 
.border-purple  {
  border-style: solid;
  border-color: #663399;
}       
.border-dark-purple  {
  border-style: solid;
  border-color: #45228a;
} 
.border-darker-purple {
  border-style: solid;
  border-color:  #45228a;
} 
.border-cherry-purple {
  border-style: solid;
  border-color: #990066;
}  
.border-red {
  border-style: solid;
  border-color: #cc0000;
}  
.border-cherry-red {
  border-style: solid;
  border-color: #990000;
}
.border-hot-pink  {
  border-style: solid;
  border-color: #FF0099;
}    
.border-light-pink  {
  border-style: solid;
  border-color: #FF66CC;
}
.border-super-light-pink  {
  border-style: solid;
  border-color: #ffddf4;
}
.border-green {
  border-style: solid;
  border-color: #41cf41;
}
.border-lite-green {
  border-style: solid;
  border-color: #a0ff11;
}
.border-dark-green {
  border-style: solid;
  border-color: #FFF703;
}



/*EVERTHING ABOVE THIS LINE DOES NOT NEED TO GO INTO VIEWPORT CHANGES---------------------------------------------*/



/*TEXT & H1 SIZES*/

p {font-size: 16px;}

h1  {
  font-size: 36px;
}
h2  {
  font-size: 32px;
}
h3  {
  font-size: 28px;
}
h4  {
  font-size: 24px;
}
h5  {
  font-size: 20px;
}


.border-1px  {
  border-width: 1px;
}  
.border-2px  {
  border-width: 2px;
}    
.border-3px  {
  border-width: 3px;
}        
.border-4px  {
  border-width: 4px;
}                
.border-5px  {
  border-width: 5px;
}  

.border-radius-5  {
  border-radius: 5px;
}
.border-radius-10  {
  border-radius: 10px;
}
.border-radius-25  {
  border-radius: 25px;
}


.border-none  {  
  border-style: none;                
}

.border-radius-none {
  border-radius: 0;
}



/* SHADOWS & LINES */

.text-shadow-white  {
  text-shadow: 0px 0px 5px #fff;
}
.text-shadow-almost-white  {
  text-shadow: 0px 0px 5px #f9f9f9;
}
.text-shadow-black  {
  text-shadow: 0px 0px 5px #000;
}
.text-shadow-almost-black  {
  text-shadow: 0px 0px 5px #292929;
}   
 
.box-shadow-white  {
  box-shadow: 0px 0px 5px #fff;
}
.box-shadow-almost-white  {
  box-shadow: 0px 0px 5px #f9f9f9;
}
.box-shadow-black  {
  box-shadow: 0px 0px 5px #000;
}
.box-shadow-almost-black  {
  box-shadow: 0px 0px 5px #292929;
}


.line-black {
  width: 100%;
  height: 2px;
  background: #000;
}
.line-almost-black {
  width: 100%;
  height: 2px;
  background: #262626;
}
.line-white {
  width: 100%;
  height: 2px;
  background: #fff;
}
.line-almost-white {
  width: 100%;
  height: 2px;
  background: #f9f9f9;
}      



/*POSITIONS, Z-INDEXES & ROTATE*/


.fixed  {
  position: fixed;
}    

.bottom {
  position: fixed;
  bottom: 0;
}
  
.absolute {
  position: absolute;
}

.z-index-1  {
  z-index: 1;
}
.z-index-2  {
  z-index: 2;
}
.z-index-3  {
  z-index: 3;
}

.rotate-1-right {
  rotate: 1deg;
}
.rotate-2-right {
  rotate: 2deg;
}

.rotate-1-left {
  rotate: -1deg;
}
.rotate-2-left {
  rotate: -2deg;
}



/*WIDTHS*/

.width-100 {
width: 100%;
} 
.width-75 {
width: 75%;
} 
.width-62 {
width: 62%;
}  
.width-50 {
width: 50%;
}  
.width-38 {
width: 38%;
} 
.width-33 {
width: 33%;
}   
.width-25 {
width: 25%;
}
.width-20 {
width: 25%;
}

.max-width-100 {
max-width: 100%;
} 
.max-width-75 {
max-width: 75%;
}  
.max-width-62 {
max-width: 62%;
}  
.max-width-50 {
max-width: 50%;
}  
.max-width-38 {  
max-width: 38%;
} 
.max-width-33 {
max-width: 33%;
}   
.max-width-25 {
max-width: 25%;
}
.max-width-20 {
max-width: 20%;
}


/*NOTE: REMOVED -PX AS MAXES OVER 100 AREN'T %; USE SPECIFIC CSS FOR PX UNDER 101px*/

.max-width-380 {
  max-width: 380px;
}      
.max-width-620  {
  max-width: 620px;
}  
.max-width-1134 {
  max-width: 1134px;
}  
.max-width-1400 {
  max-width: 1400px;
}



/*FLEXBOX STUFF, ROWS & COLUMNS & GAPS & FLEXES*/


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


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


.flex-1  {
  flex: 1;
}
.flex-2  {
  flex: 2;
}
.flex-3  {
  flex: 3;
}  


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

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



/*PADS & MARGINS*/

.pad, .pad-25 {
  padding: 25px;
}
.pad-left {
  padding-left: 25px;
}
.pad-top {
  padding-top: 25px;
}
.pad-right {
  padding-right: 25px;
}                    
.pad-bottom {
  padding-bottom: 25px;
}
.pad-vertical {
  padding-top: 25px;
  padding-bottom: 25px;
}
.pad-horizontal {
  padding-left: 25px;
  padding-right: 25px;
}



.pad-5 {
  padding: 5px;
}
.pad-left-5 {
  padding-left: 5px;
}
.pad-top-5 {
  padding-top: 5px;
}
.pad-right-5 {
  padding-right: 5px;
}                    
.pad-bottom-5 {
  padding-bottom: 5px;
}
.pad-vertical-5 {
  padding-top: 5px;
  padding-bottom: 5px;
}
.pad-horizontal-5 {
  padding-left: 5px;
  padding-right: 5px;
}

.pad-10 {
  padding: 10px;
}
.pad-left-10 {
  padding-left: 10px;
}
.pad-top-10 {
  padding-top: 10px;
}
.pad-right-10 {
  padding-right: 10px;
}                    
.pad-bottom-10 {
  padding-bottom: 10px;
}
.pad-vertical-10 {
  padding-top: 10px;
  padding-bottom: 10px;
}
.pad-horizontal-10 {
  padding-left: 10px;
  padding-right: 10px;
}
  
 

.margin-auto  {
  margin: 0 auto;
}

     

.margin, margin-25 {
  margin: 25px;
}
.margin-left {
  margin-left: 25px;
}
.margin-top {
  margin-top: 25px;
}
.margin-right {
  margin-right: 25px;
}                    
.margin-bottom {
  margin-bottom: 25px;
}
.margin-vertical {
  margin-top: 25px;
  margin-bottom: 25px;
}
.margin-horizontal {
  margin-left: 25px;
  margin-right; 25px;
}








/*DESKTOP ONLY SCREEN*/


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

.desktop-hidden {
  display: none;
}




/*TEXT & H1 SIZES*/

p {font-size: 16px;}

h1  {
  font-size: 36px;
}
h2  {
  font-size: 32px;
}
h3  {
  font-size: 28px;
}
h4  {
  font-size: 24px;
}
h5  {
  font-size: 20px;
}


.desktop-border-1px  {
  border-width: 1px;
}  
.desktop-border-2px  {
  border-width: 2px;
}    
.desktop-border-3px  {
  border-width: 3px;
}        
.desktop-border-4px  {
  border-width: 4px;
}                
.desktop-border-5px  {
  border-width: 5px;
}  

.desktop-border-radius-5  {
  border-radius: 5px;
}
.desktop-border-radius-10  {
  border-radius: 10px;
}
.desktop-border-radius-25  {
  border-radius: 25px;
}


.desktop-border-none  {  
  border-style: none;                
}

.desktop-border-radius-none {
  border-radius: 0;
}



/* SHADOWS & LINES */

.desktop-text-shadow-white  {
  text-shadow: 0px 0px 5px #fff;
}
.desktop-text-shadow-almost-white  {
  text-shadow: 0px 0px 5px #f9f9f9;
}
.desktop-text-shadow-black  {
  text-shadow: 0px 0px 5px #000;
}
.desktop-text-shadow-almost-black  {
  text-shadow: 0px 0px 5px #292929;
}   
 
.desktop-box-shadow-white  {
  box-shadow: 0px 0px 5px #fff;
}
.desktop-box-shadow-almost-white  {
  box-shadow: 0px 0px 5px #f9f9f9;
}
.desktop-box-shadow-black  {
  box-shadow: 0px 0px 5px #000;
}
.desktop-box-shadow-almost-black  {
  box-shadow: 0px 0px 5px #292929;
}


.desktop-line-black {
  width: 100%;
  height: 2px;
  background: #000;
}
.desktop-line-almost-black {
  width: 100%;
  height: 2px;
  background: #262626;
}
.desktop-line-white {
  width: 100%;
  height: 2px;
  background: #fff;
}
.desktop-line-almost-white {
  width: 100%;
  height: 2px;
  background: #f9f9f9;
}      



/*POSITIONS, Z-INDEXES & ROTATE*/


.desktop-fixed  {
  position: fixed;
}      
.desktop-absolute {
  position: absolute;
}

.desktop-z-index-1  {
  z-index: 1;
}
.desktop-z-index-2  {
  z-index: 2;
}
.desktop-z-index-3  {
  z-index: 3;
}

.desktop-rotate-1-right {
  rotate: 1deg;
}
.desktop-rotate-2-right {
  rotate: 2deg;
}

.desktop-rotate-1-left {
  rotate: -1deg;
}
.desktop-rotate-2-left {
  rotate: -2deg;
}



/*WIDTHS*/

.desktop-width-100 {
width: 100%;
} 
.desktop-width-75 {
width: 75%;
} 
.desktop-width-62 {
width: 62%;
}  
.desktop-width-50 {
width: 50%;
}  
.desktop-width-38 {
width: 38%;
} 
.desktop-width-33 {
width: 33%;
}   
.desktop-width-25 {
width: 25%;
}
.desktop-width-20 {
width: 25%;
}

.desktop-max-width-100 {
max-width: 100%;
} 
.desktop-max-width-75 {
max-width: 75%;
}  
.desktop-max-width-62 {
max-width: 62%;
}  
.desktop-max-width-50 {
max-width: 50%;
}  
.desktop-max-width-38 {  
max-width: 38%;
} 
.desktop-max-width-33 {
max-width: 33%;
}   
.desktop-max-width-25 {
max-width: 25%;
}
.desktop-max-width-20 {
max-width: 20%;
}


/*NOTE: REMOVED -PX AS MAXES OVER 100 AREN'T %; USE SPECIFIC CSS FOR PX UNDER 101px*/

.desktop-max-width-380 {
  max-width: 380px;
}      
.desktop-max-width-620  {
  max-width: 620px;
}  
.desktop-max-width-1134 {
  max-width: 1134px;
}  
.desktop-max-width-1400 {
  max-width: 1400px;
}



/*FLEXBOX STUFF, ROWS & COLUMNS & GAPS & FLEXES*/


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


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


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


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

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



/*PADS & MARGINS*/

.desktop-pad, .desktop-pad-25 {
  padding: 25px;
}
.desktop-pad-left {
  padding-left: 25px;
}
.desktop-pad-top {
  padding-top: 25px;
}
.desktop-pad-right {
  padding-right: 25px;
}                    
.desktop-pad-bottom {
  padding-bottom: 25px;
}
.desktop-pad-vertical {
  padding-top: 25px;
  padding-bottom: 25px;
}
.desktop-pad-horizontal {
  padding-left: 25px;
  padding-right: 25px;
}



.desktop-pad-5 {
  padding: 5px;
}
.desktop-pad-left-5 {
  padding-left: 5px;
}
.desktop-pad-top-5 {
  padding-top: 5px;
}
.desktop-pad-right-5 {
  padding-right: 5px;
}                    
.desktop-pad-bottom-5 {
  padding-bottom: 5px;
}
.desktop-pad-vertical-5 {
  padding-top: 5px;
  padding-bottom: 5px;
}
.desktop-pad-horizontal-5 {
  padding-left: 5px;
  padding-right: 5px;
}

.desktop-pad-10 {
  padding: 10px;
}
.desktop-pad-left-10 {
  padding-left: 10px;
}
.desktop-pad-top-10 {
  padding-top: 10px;
}
.desktop-pad-right-10 {
  padding-right: 10px;
}                    
.desktop-pad-bottom-10 {
  padding-bottom: 10px;
}
.desktop-pad-vertical-10 {
  padding-top: 10px;
  padding-bottom: 10px;
}
.desktop-pad-horizontal-10 {
  padding-left: 10px;
  padding-right: 10px;
}
  
 

.desktop-margin-auto  {
  margin: 0 auto;
}

     

.desktop-margin, margin-25 {
  margin: 25px;
}
.desktop-margin-left {
  margin-left: 25px;
}
.desktop-margin-top {
  margin-top: 25px;
}
.desktop-margin-right {
  margin-right: 25px;
}                    
.desktop-margin-bottom {
  margin-bottom: 25px;
}
.desktop-margin-vertical {
  margin-top: 25px;
  margin-bottom: 25px;
}
.desktop-margin-horizontal {
  margin-left: 25px;
  margin-right; 25px;
}


 
 }


/*TABLET ONLY SCREEN*/
@media only screen and (min-width: 769px) and (max-width: 1133px) {  


.tablet-hidden {
  display: none;
}





/*TEXT & H1 SIZES*/

p {font-size: 16px;}

h1  {
  font-size: 36px;
}
h2  {
  font-size: 32px;
}
h3  {
  font-size: 28px;
}
h4  {
  font-size: 24px;
}
h5  {
  font-size: 20px;
}


.tablet-border-1px  {
  border-width: 1px;
}  
.tablet-border-2px  {
  border-width: 2px;
}    
.tablet-border-3px  {
  border-width: 3px;
}        
.tablet-border-4px  {
  border-width: 4px;
}                
.tablet-border-5px  {
  border-width: 5px;
}  

.tablet-border-radius-5  {
  border-radius: 5px;
}
.tablet-border-radius-10  {
  border-radius: 10px;
}
.tablet-border-radius-25  {
  border-radius: 25px;
}


.tablet-border-none  {  
  border-style: none;                
}

.tablet-border-radius-none {
  border-radius: 0;
}



/* SHADOWS & LINES */

.tablet-text-shadow-white  {
  text-shadow: 0px 0px 5px #fff;
}
.tablet-text-shadow-almost-white  {
  text-shadow: 0px 0px 5px #f9f9f9;
}
.tablet-text-shadow-black  {
  text-shadow: 0px 0px 5px #000;
}
.tablet-text-shadow-almost-black  {
  text-shadow: 0px 0px 5px #292929;
}   
 
.tablet-box-shadow-white  {
  box-shadow: 0px 0px 5px #fff;
}
.tablet-box-shadow-almost-white  {
  box-shadow: 0px 0px 5px #f9f9f9;
}
.tablet-box-shadow-black  {
  box-shadow: 0px 0px 5px #000;
}
.tablet-box-shadow-almost-black  {
  box-shadow: 0px 0px 5px #292929;
}


.tablet-line-black {
  width: 100%;
  height: 2px;
  background: #000;
}
.tablet-line-almost-black {
  width: 100%;
  height: 2px;
  background: #262626;
}
.tablet-line-white {
  width: 100%;
  height: 2px;
  background: #fff;
}
.tablet-line-almost-white {
  width: 100%;
  height: 2px;
  background: #f9f9f9;
}      



/*POSITIONS, Z-INDEXES & ROTATE*/


.tablet-fixed  {
  position: fixed;
}      
.tablet-absolute {
  position: absolute;
}

.tablet-z-index-1  {
  z-index: 1;
}
.tablet-z-index-2  {
  z-index: 2;
}
.tablet-z-index-3  {
  z-index: 3;
}

.tablet-rotate-1-right {
  rotate: 1deg;
}
.tablet-rotate-2-right {
  rotate: 2deg;
}

.tablet-rotate-1-left {
  rotate: -1deg;
}
.tablet-rotate-2-left {
  rotate: -2deg;
}



/*WIDTHS*/

.tablet-width-100 {
width: 100%;
} 
.tablet-width-75 {
width: 75%;
} 
.tablet-width-62 {
width: 62%;
}  
.tablet-width-50 {
width: 50%;
}  
.tablet-width-38 {
width: 38%;
} 
.tablet-width-33 {
width: 33%;
}   
.tablet-width-25 {
width: 25%;
}
.tablet-width-20 {
width: 25%;
}

.tablet-max-width-100 {
max-width: 100%;
} 
.tablet-max-width-75 {
max-width: 75%;
}  
.tablet-max-width-62 {
max-width: 62%;
}  
.tablet-max-width-50 {
max-width: 50%;
}  
.tablet-max-width-38 {  
max-width: 38%;
} 
.tablet-max-width-33 {
max-width: 33%;
}   
.tablet-max-width-25 {
max-width: 25%;
}
.tablet-max-width-20 {
max-width: 20%;
}


/*NOTE: REMOVED -PX AS MAXES OVER 100 AREN'T %; USE SPECIFIC CSS FOR PX UNDER 101px*/

.tablet-max-width-380 {
  max-width: 380px;
}      
.tablet-max-width-620  {
  max-width: 620px;
}  
.tablet-max-width-1134 {
  max-width: 1134px;
}  
.tablet-max-width-1400 {
  max-width: 1400px;
}



/*FLEXBOX STUFF, ROWS & COLUMNS & GAPS & FLEXES*/


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


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


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


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

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



/*PADS & MARGINS*/

.tablet-pad, .tablet-pad-25 {
  padding: 25px;
}
.tablet-pad-left {
  padding-left: 25px;
}
.tablet-pad-top {
  padding-top: 25px;
}
.tablet-pad-right {
  padding-right: 25px;
}                    
.tablet-pad-bottom {
  padding-bottom: 25px;
}
.tablet-pad-vertical {
  padding-top: 25px;
  padding-bottom: 25px;
}
.tablet-pad-horizontal {
  padding-left: 25px;
  padding-right: 25px;
}



.tablet-pad-5 {
  padding: 5px;
}
.tablet-pad-left-5 {
  padding-left: 5px;
}
.tablet-pad-top-5 {
  padding-top: 5px;
}
.tablet-pad-right-5 {
  padding-right: 5px;
}                    
.tablet-pad-bottom-5 {
  padding-bottom: 5px;
}
.tablet-pad-vertical-5 {
  padding-top: 5px;
  padding-bottom: 5px;
}
.tablet-pad-horizontal-5 {
  padding-left: 5px;
  padding-right: 5px;
}

.tablet-pad-10 {
  padding: 10px;
}
.tablet-pad-left-10 {
  padding-left: 10px;
}
.tablet-pad-top-10 {
  padding-top: 10px;
}
.tablet-pad-right-10 {
  padding-right: 10px;
}                    
.tablet-pad-bottom-10 {
  padding-bottom: 10px;
}
.tablet-pad-vertical-10 {
  padding-top: 10px;
  padding-bottom: 10px;
}
.tablet-pad-horizontal-10 {
  padding-left: 10px;
  padding-right: 10px;
}
  
 

.tablet-margin-auto  {
  margin: 0 auto;
}

     

.tablet-margin, margin-25 {
  margin: 25px;
}
.tablet-margin-left {
  margin-left: 25px;
}
.tablet-margin-top {
  margin-top: 25px;
}
.tablet-margin-right {
  margin-right: 25px;
}                    
.tablet-margin-bottom {
  margin-bottom: 25px;
}
.tablet-margin-vertical {
  margin-top: 25px;
  margin-bottom: 25px;
}
.tablet-margin-horizontal {
  margin-left: 25px;
  margin-right; 25px;
}



  
}


/*MOBILE ONLY SCREEN */

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

.mobile-hidden {
  display: none;
}




/*TEXT & H1 SIZES*/

p {font-size: 16px;}

h1  {
  font-size: 36px;
}
h2  {
  font-size: 32px;
}
h3  {
  font-size: 28px;
}
h4  {
  font-size: 24px;
}
h5  {
  font-size: 20px;
}


.mobile-border-1px  {
  border-width: 1px;
}  
.mobile-border-2px  {
  border-width: 2px;
}    
.mobile-border-3px  {
  border-width: 3px;
}        
.mobile-border-4px  {
  border-width: 4px;
}                
.mobile-border-5px  {
  border-width: 5px;
}  

.mobile-border-radius-5  {
  border-radius: 5px;
}
.mobile-border-radius-10  {
  border-radius: 10px;
}
.mobile-border-radius-25  {
  border-radius: 25px;
}


.mobile-border-none  {  
  border-style: none;                
}

.mobile-border-radius-none {
  border-radius: 0;
}



/* SHADOWS & LINES */

.mobile-text-shadow-white  {
  text-shadow: 0px 0px 5px #fff;
}
.mobile-text-shadow-almost-white  {
  text-shadow: 0px 0px 5px #f9f9f9;
}
.mobile-text-shadow-black  {
  text-shadow: 0px 0px 5px #000;
}
.mobile-text-shadow-almost-black  {
  text-shadow: 0px 0px 5px #292929;
}   
 
.mobile-box-shadow-white  {
  box-shadow: 0px 0px 5px #fff;
}
.mobile-box-shadow-almost-white  {
  box-shadow: 0px 0px 5px #f9f9f9;
}
.mobile-box-shadow-black  {
  box-shadow: 0px 0px 5px #000;
}
.mobile-box-shadow-almost-black  {
  box-shadow: 0px 0px 5px #292929;
}


.mobile-line-black {
  width: 100%;
  height: 2px;
  background: #000;
}
.mobile-line-almost-black {
  width: 100%;
  height: 2px;
  background: #262626;
}
.mobile-line-white {
  width: 100%;
  height: 2px;
  background: #fff;
}
.mobile-line-almost-white {
  width: 100%;
  height: 2px;
  background: #f9f9f9;
}      



/*POSITIONS, Z-INDEXES & ROTATE*/


.mobile-fixed  {
  position: fixed;
}      
.mobile-absolute {
  position: absolute;
}

.mobile-z-index-1  {
  z-index: 1;
}
.mobile-z-index-2  {
  z-index: 2;
}
.mobile-z-index-3  {
  z-index: 3;
}

.mobile-rotate-1-right {
  rotate: 1deg;
}
.mobile-rotate-2-right {
  rotate: 2deg;
}

.mobile-rotate-1-left {
  rotate: -1deg;
}
.mobile-rotate-2-left {
  rotate: -2deg;
}



/*WIDTHS*/

.mobile-width-100 {
width: 100%;
} 
.mobile-width-75 {
width: 75%;
} 
.mobile-width-62 {
width: 62%;
}  
.mobile-width-50 {
width: 50%;
}  
.mobile-width-38 {
width: 38%;
} 
.mobile-width-33 {
width: 33%;
}   
.mobile-width-25 {
width: 25%;
}
.mobile-width-20 {
width: 25%;
}

.mobile-max-width-100 {
max-width: 100%;
} 
.mobile-max-width-75 {
max-width: 75%;
}  
.mobile-max-width-62 {
max-width: 62%;
}  
.mobile-max-width-50 {
max-width: 50%;
}  
.mobile-max-width-38 {  
max-width: 38%;
} 
.mobile-max-width-33 {
max-width: 33%;
}   
.mobile-max-width-25 {
max-width: 25%;
}
.mobile-max-width-20 {
max-width: 20%;
}


/*NOTE: REMOVED -PX AS MAXES OVER 100 AREN'T %; USE SPECIFIC CSS FOR PX UNDER 101px*/

.mobile-max-width-380 {
  max-width: 380px;
}      
.mobile-max-width-620  {
  max-width: 620px;
}  
.mobile-max-width-1134 {
  max-width: 1134px;
}  
.mobile-max-width-1400 {
  max-width: 1400px;
}



/*FLEXBOX STUFF, ROWS & COLUMNS & GAPS & FLEXES*/


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


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


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


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

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



/*PADS & MARGINS*/

.mobile-pad, .mobile-pad-25 {
  padding: 25px;
}
.mobile-pad-left {
  padding-left: 25px;
}
.mobile-pad-top {
  padding-top: 25px;
}
.mobile-pad-right {
  padding-right: 25px;
}                    
.mobile-pad-bottom {
  padding-bottom: 25px;
}
.mobile-pad-vertical {
  padding-top: 25px;
  padding-bottom: 25px;
}
.mobile-pad-horizontal {
  padding-left: 25px;
  padding-right: 25px;
}



.mobile-pad-5 {
  padding: 5px;
}
.mobile-pad-left-5 {
  padding-left: 5px;
}
.mobile-pad-top-5 {
  padding-top: 5px;
}
.mobile-pad-right-5 {
  padding-right: 5px;
}                    
.mobile-pad-bottom-5 {
  padding-bottom: 5px;
}
.mobile-pad-vertical-5 {
  padding-top: 5px;
  padding-bottom: 5px;
}
.mobile-pad-horizontal-5 {
  padding-left: 5px;
  padding-right: 5px;
}

.mobile-pad-10 {
  padding: 10px;
}
.mobile-pad-left-10 {
  padding-left: 10px;
}
.mobile-pad-top-10 {
  padding-top: 10px;
}
.mobile-pad-right-10 {
  padding-right: 10px;
}                    
.mobile-pad-bottom-10 {
  padding-bottom: 10px;
}
.mobile-pad-vertical-10 {
  padding-top: 10px;
  padding-bottom: 10px;
}
.mobile-pad-horizontal-10 {
  padding-left: 10px;
  padding-right: 10px;
}
  
 

.mobile-margin-auto  {
  margin: 0 auto;
}

     

.mobile-margin, margin-25 {
  margin: 25px;
}
.mobile-margin-left {
  margin-left: 25px;
}
.mobile-margin-top {
  margin-top: 25px;
}
.mobile-margin-right {
  margin-right: 25px;
}                    
.mobile-margin-bottom {
  margin-bottom: 25px;
}
.mobile-margin-vertical {
  margin-top: 25px;
  margin-bottom: 25px;
}
.mobile-margin-horizontal {
  margin-left: 25px;
  margin-right; 25px;
}




  
}
