@import 'Sporting-Grotesque-master/webfonts/font.css';

@font-face {
    font-family: 'Minipax-Regular';
    src:    url('Minipax-master/fonts/webfonts/Minipax-Regular.eot'),
    url('Minipax-master/fonts/webfonts/Minipax-Regular.woff') format('woff'),
    url('Minipax-master/fonts/webfonts/Minipax-Regular.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}

body {
    background: #e4e3a6;
}

.animation_left {
    padding-top: 6rem;
    max-width: none;
    width: 200px;
    position: relative;
    right: 100px;
}

img.background-bottle {
    position: absolute;
    z-index: -1;
    mix-blend-mode: luminosity;
    opacity: 0.5;
}

.bottle-big {
    width: 25%;
    min-width: 15rem;
}

.bottle-small {
    width: 15%;
    min-width: 10rem;
}

.bottle-2 {
    right: 35%;
    transform: rotate(20deg);
}

.bottle-3 {
    right: 20%;
    transform: rotate(85deg);
}

.bottle-4 {
    transform: rotate(90deg);
}

.bottle-5 {
    right: 20%;
    transform: rotate(20deg);
}

.bottle-6 {
    left: 20%;
    transform: rotate(0deg);
}

.bottle-7 {
    left: 40%;
    transform: rotate(-20deg);
}

.bottle-8 {
    right: 10%;
    transform: rotate(-20deg);
}

img.bottle-9 {
    right: 40%;
    opacity: 1;
}

a {
    color: black;
    text-decoration: underline;
}

a:hover {
    color: #555;
}

h1, h2, h3{
    font-family: "Sporting Grotesque_Regular", serif;

    text-justify: inter-character;
    text-align: justify;
    -moz-text-align-last: justify; /* For Firefox prior 58.0 */
    text-align-last: justify;
}

h1 {
    padding-top: 3rem;
    font-size: 3rem;
    line-height: 1;
    background-image: url("../assets/botttlesmall_trasp.gif");
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    mix-blend-mode: luminosity;
}

h1 .line {
    display: flex;
    justify-content: space-between;
}

h2 {
    font-size: 2rem;
    padding-top: 3rem;
    margin-top: 1rem;
    border-top: 2px black solid;
    text-justify: inter-word;
}

h2.center {
    text-align: center;
    -moz-text-align-last: center;
    text-align-last: center;
}

h3 {
    -moz-text-align-last: justify;
    text-align-last: justify;
    text-justify: inter-word;
    font-size: 1.5rem;
}

p, tbody {
    font-family: "Minipax-Regular", serif;
    text-align: justify;
    text-justify: inter-word;
    font-size: 1.3rem;
}

.content-wrap {
    max-width: 1440px;
    margin: auto;
}

.cell.main {
    border-right: 2px black solid;
    border-left: 2px black solid;
    padding: 0 2rem;
}

ul#nav {
    position: fixed;
    font-family: "Sporting Grotesque_Regular", serif;
    text-transform: uppercase;
    list-style: none;
    margin-top: 4rem;
}

ul#nav a {
    color: black;
    text-decoration: none;
}

.big-screen {
    display: none;
}

.section-title, .section-title:hover {
    position: relative;
    font-family: "Sporting Grotesque_Regular", serif;
    text-transform: uppercase;
    color: black;
    cursor: default;
    left: -13rem;
    top: 3rem;
    padding-top: 2rem;
    width: 200px;
}

tbody, tbody tr, tbody tr:nth-child(2n) {
    background-color: transparent;
}

footer {
    margin-top: 20rem;
}

@media print, screen and (max-width: 600px) {
    h1 {
        font-size: 2rem;
        padding-top: 2rem;
    }
    h3{
        font-size: 1.25rem;
    }
    h2{
        font-size: 1.5rem;
    }

    p, a, td {
        font-size: 0.9rem;
    }
    .cell.main {
        padding: 0 2rem;
    }
}

@media print, screen and (min-width: 900px) {
    h1 {
        font-size: 6rem;
        padding-top: 6rem;
    }
}

@media print, screen and (min-width: 1200px) {
    h1 {
        font-size: 8rem;
    }

    h2 {
        font-size: 4.7rem;
    }

    h3 {
        font-size: 2rem;
    }

    p {

    }
}

 @media print, screen and (min-width: 1500px) {
    .small-screen {
        display: none;
    }
    .big-screen {
        display: inherit;
    }
}