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

body {
  line-height: 1.5; /*ASSIGNED INHERIT*/
  font-family: PoppinsRegular; /*ASSIGNED BASE FONT*/
  font-size: 16px; /*ASSIGNED BASE FONT SIZE*/    
}   

a {
  font-family: PoppinsBold;
}

.underline {
  text-decoration: underline;
}

/*DEV TOOLS*/

.test {
  background: #be4;
} 

.test-1 {
  background: #c33;
}                  

.test-2 {
  background: #faf;
}               

.test-3 {
  background: #dd4;
}

/*FONT-FACE ASSIGNMENTS*/

@font-face {
font-family: PoppinsBlack;
src:url('Poppins-Black.ttf');
}
@font-face {
font-family: PoppinsBold;
src:url('Poppins-Bold.ttf');
}
@font-face {
font-family: PoppinsItalic;
src:url('Poppins-Italic.ttf');
}
@font-face {
font-family: PoppinsLight;
src:url('Poppins-Light.ttf');
}
@font-face {
font-family: PoppinsRegular;
src:url('Poppins-Regular.ttf');
}
@font-face {
font-family: PoppinsThin;
src:url('Poppins-Thin.ttf');  
}


.font-thick {
  font-family: PoppinsBlack;
}
.font-bold {
  font-family: PoppinsBold;
}
.font-italic {
  font-family: PoppinsItalic;
}
.font-light {
  font-family: PoppinsLight;
}
.font-regular {
  font-family: PoppinsRegular;
}
.font-thin {
  font-family: PoppinsThin;
}

.font-large {

  font-size: 30px;
  
}

.font-medium {

  font-size: 20px;
  
}

.font-small {
  font-size: 12px;
}


        
/*---------DROP DOWN MENU FOR MOBILE jsfiddle.net/alsweeet/ycYg7/ --------- */

#dd ul {
    display: none;
    position: relative;
    top: -50px;
    padding: 50px 0 0 0;
    margin: 0;
}
#dd:hover {
    display: flex; 
}
#dd ul:hover {
    display: block; 
}
#dd li {
    list-style: none;
}
#dd li:hover { 
    cursor: pointer;
}
#mobile-menu-button {
    display: inline-block;
}
#dd {
    display: flex;
}
#dd:active ul {
    display: block;
} 
#dd:active ul:hover {
    display: block;
}
#dd:active {
    display: inline-block;
} 




/*----SITE-SPECIFIC---*/










.background-image-1 {
  background: url('background-image-1.jpg');
  background-size: cover; 
  background-position: center;

} 

.background-image-2 {
  background: url('background-image-2.jpg');
  background-size: cover; 
  background-position: center;

}

.background-image-3 {
  background: url('background-image-3.jpg');
  background-size: cover; 
  background-position: center;

}


.background-image-standard {
  background: url('standard.jpg');
  background-size: cover; 
  background-position: center;

}

.background-image-vehicle {
  background: url('vehicle.jpg');
  background-size: cover; 
  background-position: center;

}


.background-image-oneway {
  background: url('oneway.jpg');
  background-size: cover; 
  background-position: center;

}


.background-image-transparent {
  background: url('transparent.jpg');
  background-size: cover; 
  background-position: center;

}

.background-image-wall {
  background: url('wall.jpg');
  background-size: cover; 
  background-position: center;

}


.background-image-cling {
  background: url('cling.jpg');
  background-size: cover; 
  background-position: center;

}


.background-image-cards {
  background: url('thumbnail-cards-1.jpg');
  background-size: cover; 
  background-position: center;

}

.background-image-banners {
  background: url('thumb-banners.jpg');
  background-size: cover; 
  background-position: center;

}


.background-image-signs {
  background: url('thumb-signs.jpg');
  background-size: cover; 
  background-position: center;

}

.background-image-posters {
  background: url('thumb-posters.jpg');
  background-size: cover; 
  background-position: center;

}



.background-image-adhesive {
  background: url('thumb-adhesive-2.jpg');
  background-size: cover; 
  background-position: center;

}


.background-image-apparel {
  background: url('thumb-apparel.jpg');
  background-size: cover; 
  background-position: center;

}



.background-white-transparent-62 {
  background: rgba(250,250,250,0.62);
}

.background-white-transparent-80 {
  background: rgba(250,250,250,0.8);
}



 
.text-shadow-white  {
  text-shadow: 0px 0px 6px #fff;
}  

.box-shadow-gray  {
  box-shadow: -1px 1px 2px #737373;
}  





.border-black {
  border-style: solid;
  border-color: #000;
  border-width: 1px;
}

.border-white {
  border-style: solid;
  border-color: #fff;
  border-width: 1px;
}
.border-super-lite-gray {
  border-style: solid;
  border-color: #e8e8e8;
  border-width: 1px;
}
.border-gray {
  border-style: solid;
  border-color: #737373;
  border-width: 1px;
}

.border-lite-gray {
  border-style: solid;
  border-color: #d2d2d2;
  border-width: 1px;
}






/*-------------------------------UNIVERSAL CSS------------------*/

/*----------------COLORS---------------------*/


.background-black {
  background: #000;
}
.background-almost-black {
  background: #333;
}
.background-white {
  background: #fff;
}
.background-almost-white {
  background: #f9f9f9;    
}  
.background-teal  {
  background: #418ba8;
}
      
.background-super-lite-gray {
  background: #e8e8e8;
}

.background-gray {
  background: #737373;
}



.text-black {
  color: #000;
}
.text-almost-black {
  color: #333;
}
.text-white {
  color: #fff;
}
.text-almost-white {
  color: #f9f9f9;    
}  
.text-teal  {
  color: #418ba8;
}
      
.text-super-lite-gray {
  color: #e8e8e8;
}

      
.text-gray {
  color: #737373;
}




/*----------FLEXES---------*/


.flex-wrap   {
  flex-wrap: wrap;
}

.align-content-stretch  {
  align-content: stretch;
}

.align-content-center  {
  align-content: center;
}


.align-content-start {
  align-content: flex-start;
}

.align-content-end  {
  align-content: flex-end;
}

.align-content-around {
  align-content: space-around;
}

.align-content-between {
  align-content: space-between;
}









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

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

.flex-1 {
  flex: 1;
}

.flex-2 {
  flex: 2;
}

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

.justify-stretch {
  justify-content: stretch;
}
.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;
}

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

/*-----------BORDERS---------------*/


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


/*------------PADS & WIDTHS---------------*/



             

.pad-10 {
  padding: 10px;
}

.pad-15 {
  padding: 15px;
}

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

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

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

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


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



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


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




.wide, .width-100 {
  width: 100%;
}
.width-62 {
  width: 61.8%;
}
.width-38 {
  width: 38.2%;
}
.width-50 {
  width: 50%
}
.width-25 {
  width: 25%;
}
.width-20 {
  width: 20%;
}
.width-15 {
  width: 15%;
}
.width-12point5 {
  width: 12.5%;
}




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

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

.min-width-420 {
  min-width: 420px;  
}


.min-height-220 {
  min-height: 220px;
}





/*----------VIEWPORTS---------*/

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

.desktop-hidden {
  display: none;
}


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

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

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

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

.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-stretch {
  justify-content: stretch;
}
.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-gap-10 {
  gap: 10px;
}
.desktop-gap-25, .desktop-gap {
  gap: 25px;
}
.desktop-gap-50 {
  gap: 50px;
} 

/*-----------BORDERS---------------*/


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


/*------------PADS & WIDTHS---------------*/
             

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

.desktop-wide, .desktop-width-100 {
  width: 100%;
}
.desktop-width-62 {
  width: 62%;
}
.desktop-width-38 {
  width: 38%;
}
.desktop-width-50 {
  width: 50%
}
.desktop-width-25 {
  width: 25%;
}
.desktop-width-20 {
  width: 20%;
}

    

}



@media only screen and (max-width: 1133px) and (min-width: 769px) { 
  
.tablet-hidden {
  display: none;
}


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

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

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

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

.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-stretch {
  justify-content: stretch;
}
.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-gap-10 {
  gap: 10px;
}
.tablet-gap-25, .tablet-gap {
  gap: 25px;
}
.tablet-gap-50 {
  gap: 50px;
} 

/*-----------BORDERS---------------*/


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


/*------------PADS & WIDTHS---------------*/
             

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

.tablet-wide, .tablet-width-100 {
  width: 100%;
}
.tablet-width-62 {
  width: 62%;
}
.tablet-width-38 {
  width: 38%;
}
.tablet-width-50 {
  width: 50%
}
.tablet-width-25 {
  width: 25%;
}
.tablet-width-20 {
  width: 20%;
}


}


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

  
.mobile-hidden {
  display: none;    } 
                      

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

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

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

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

.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-stretch {
  justify-content: stretch;
}
.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-gap-10 {
  gap: 10px;
}
.mobile-gap-25, .mobile-gap {
  gap: 25px;
}
.mobile-gap-50 {
  gap: 50px;
} 

/*-----------BORDERS---------------*/


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


/*------------PADS & WIDTHS---------------*/
             

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

.mobile-wide, .mobile-width-100 {
  width: 100%;
}
.mobile-width-62 {
  width: 62%;
}
.mobile-width-38 {
  width: 38%;
}
.mobile-width-50 {
  width: 50%
}
.mobile-width-25 {
  width: 25%;
}
.mobile-width-20 {
  width: 20%;
}


    
}
