/* general styling */
:root {
  --smaller: 0.75;
}

.container5 {
    font-size: 0;  /* Hack for inline and inline-block extra markup generated spaces */
    display: block;
    overflow: auto;
    font-family: 'Trebuchet MS', 'Lucida Grande', Verdana, Arial, Sans-Serif;
    color: #333;
    transform: skew(-2deg, -2deg);
    display: table-cell;
    font-weight: normal;
}

.li2 {
  display: inline-block;
  list-style-type: none;
  padding: 0.4em;
 /* text-transform: uppercase; */
}

.span2 {
    /* display: inline-block; */
    vertical-align: bottom;
    position: relative;
    font-family: 'Open Sans', cursive;
    /* font-weight: 700; */
    /* font-size: 50px; */
    line-height: 70px;
    text-align: center;
    color: white;
    border-radius: 10px;
    /* margin: 20px 10px 50px 0; */
    padding: 0 10px;
    background: linear-gradient(orange, #000);
    overflow: hidden;
}

 /* Extra small devices (phones, 600px and down) */
@media all and (max-width: 600px) {
  .li2 {
    font-size: calc(.85rem * var(--smaller));
    padding: 0.4em;
  }
  
  .span2 {
    font-size: calc(2rem * var(--smaller));
  }
}

/* Small devices (portrait tablets and large phones, 600px and up) */
@media all and (min-width: 600px) {
  .li2 {
    font-size: calc(1rem * var(--smaller));
    padding: 0.4em;
  }
  
  .span2 {
    font-size: calc(2rem * var(--smaller));
  }
}

/* Medium devices (landscape tablets, 768px and up) */
@media all and (min-width: 768px) {
  .li2 {
    font-size: calc(1.3rem * var(--smaller));
    padding: 0.4em;
  }
  
  .span2 {
    font-size: calc(2.5rem * var(--smaller));
  }
}

/* Large devices (laptops/desktops, 992px and up) */
@media all and (min-width: 992px) {
  .li2 {
    font-size: calc(1.5rem * var(--smaller));
    padding: 0.4em;
  }
  
  .span2 {
    font-size: calc(3rem * var(--smaller));
  }
}

/* Extra large devices (large laptops and desktops, 1200px and up) */
@media all and (min-width: 1200px) {
  .li2 {
    font-size: calc(2rem * var(--smaller));
    padding: 0.4em;
  }
  
  .span2 {
    font-size: calc(3rem * var(--smaller));
  }
} 