@font-face {
    font-family:"Louis Vuitton Web";
    font-weight:700;
    font-style:normal;
    src:url("../fonts/LouisVuitton-Bold.woff2") format("woff2"),
    url("../fonts/LouisVuitton-Bold.woff") format("woff")
}

@font-face {
    font-family:"Louis Vuitton Cyrillic";
    font-weight:600;
    font-style:normal;
    src:url("//tp-ppi.louisvuitton.com/fonts/assets/f5df66df-3a90-42cf-8f7f-8a1cdd3563a2.woff2") format("woff2"),
    url("//tp-ppi.louisvuitton.com/fonts/assets/18b36fa6-06d7-40cf-befc-6ffaeb67a3b6.woff") format("woff")
}

@font-face {
    font-family:"Johnnie Walker Sans Book";
    src:url(../fonts/JohnnieWalkerSansWeb-Book.eot?#iefix);
    src:url(../fonts/JohnnieWalkerSansWeb-Book.eot?#iefix) format("eot"),
    url(../fonts/JohnnieWalkerSansWeb-Book.woff2) format("woff2"),
    url(../fonts/JohnnieWalkerSansWeb-Book.woff) format("woff"),
    url(../fonts/JohnnieWalkerSansWeb-Book.ttf) format("truetype"),
    url(../fonts/JohnnieWalkerSansWeb-Book.svg#d1246e5a-1d35-4bc9-b785-d05e0408a757) format("svg")
}
@font-face {
    font-family:"Johnnie Walker Sans Book Bold";
    src:url(../fonts/johnnie-walker-sans/JohnnieWalkerSansWeb-Bold.eot?#iefix);
    src:url(../fonts/johnnie-walker-sans/JohnnieWalkerSansWeb-Bold.eot?#iefix) format("eot"),
    url(../fonts/johnnie-walker-sans/JohnnieWalkerSansWeb-Bold.woff2) format("woff2"),
    url(../fonts/johnnie-walker-sans/JohnnieWalkerSansWeb-Bold.woff) format("woff"),
    url(../fonts/johnnie-walker-sans/JohnnieWalkerSansWeb-Bold.ttf) format("truetype"),
    url(../fonts/johnnie-walker-sans/JohnnieWalkerSansWeb-Bold.svg#d1246e5a-1d35-4bc9-b785-d05e0408a757) format("svg")
}

body, html {
    margin: 0;
}

body {
    background-color: #f4f3f4;
}

.slug img {
    object-fit: cover; /* Do not scale the image */
    object-position: center; /* Center the image within the element */
    height: 100%;
    width: 100%;
}

section {
    box-sizing: border-box;
    display: block;
}

.square {
    position: relative;
    display: inline-block;
    background-color: white;
    box-sizing: border-box;
    overflow: hidden;
    text-align: center;
    width: 100%;
}

.narrower-margins {
    padding: 20px;
    box-sizing: border-box;
}

.margins {
    padding: 7%;
    box-sizing: border-box;
}

.overlay {
    position: absolute;
    top:0;
    left:0;
    right: 0;
    bottom: 0;
}

.square::before {
    content: '';
    display: block;
    padding-top: 100%;
}


.header {
    width: 100%;
}

ul {
    padding: 0;
}

nav li {
    list-style: none;
}

a {
    text-decoration: none;
}

.title {
    display: block;
    width: 100%;
    text-align: center;
    color: black;
    font-size: 18px;
    font-weight: bold;
}

[data-current] {
    font-weight: bold;
}


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

@media only screen and (min-width: 760px) {
    .header {
        position: fixed;
        left: 0;
        top: 26px;
        max-width: 260px;
        min-height: 90vh;
        border-right: solid 1px black;
    }

    section {
        margin-left: 260px;
    }

}

@media only screen and (min-width: 1000px) {
    .text {
        width: 40%;
        float: left;
        text-align: center;
    }

    .square {
        width: 60%;
    }
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 100dpi) {

}