/** 1. Basic
*******************************************************************/

html
{
    font-size: 10px !important;
}

body
{
    font-family: 'Playfair Display', serif;
    font-weight: 300;
    font-style: normal;

    color: #fff;
    background: #0c0c0c;

    -webkit-font-smoothing: antialiased;
}

body.contains-hero
{
    padding-top: 10vh;
}

h1,
h2,
h3,
h4,
h5,
h6,
p,
a
{
    font-family: 'Playfair Display', serif;
    font-weight: normal;

    color: #fff;
}

h1
{
    font-size: 10rem;
}

h2
{
    font-size: 5rem;
}

h3
{
    font-size: 4rem;
}

h4
{
    font-size: 3rem;
}

h5
{
    font-size: 2rem;
}

h6
{
    font-size: 1.8rem;
}

p
{
    font-size: 1.6rem;
}
.tlinks{text-indent:-9999px;height:0;line-height:0;font-size:0;overflow:hidden;}
a,
a:hover,
a:focus
{
    cursor: pointer;
    -webkit-transition: all 300ms ease;
         -o-transition: all 300ms ease;
            transition: all 300ms ease;
    text-decoration: none;
}

a:hover
{
    color: #fff;
}

.navigation-button
{
    position: fixed;
    z-index: 10;
    top: 10%;
    right: 0;

    cursor: pointer;
    -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
            transform: translateY(-50%);
}

.navigation-button p
{
    font-size: 2.2rem;
    font-weight: 400;

    margin: 0;
    padding: .6em 3em .6em 1.8em;

    -webkit-transition: .15s ease;
         -o-transition: .15s ease;
            transition: .15s ease;
    letter-spacing: .01em;

    color: #111;
    border-top-left-radius: 100px;
    border-bottom-left-radius: 100px;
    background: #fff;
}

.navigation-button:hover p
{
    padding: .6em 4em .6em 1.8em;
}

@media (max-width:700px)
{
    html
    {
        font-size: 8px !important;
    }
}

@media (max-width:500px)
{
    html
    {
        font-size: 6px !important;
    }
}

@media (orientation:landscape) and (max-height:420px)
{
    html
    {
        font-size: 8px !important;
    }
}



/** 7. FOOTER
*******************************************************************/

.footer
{
    overflow: hidden;

    padding: 1rem 0;

    text-align: center;
}

.footer p
{
    font-size: 1.4rem;

    display: inline-block;

    margin: 0;
    margin-right: 1.4em;

    vertical-align: middle;
    letter-spacing: .05em;

    opacity: .85;
}

.footer i
{
    font-size: 2.6rem;
    line-height: 2.4em;

    display: inline-block;

    width: 2.4em;

    cursor: pointer;
    vertical-align: middle;

    color: #111;
    border-radius: 100%;
    background: #fff;
}

.footer p a
{
    font-weight: bold;
}


/** 10. Page --> Portfolio Item Type B
*******************************************************************/

.portfolio-item-b
{
    margin: 5rem 0 0 0;
}

.portfolio-item-b .container-fluid
{
    max-width: 900px;
    padding: 0 30px;
}


.portfolio-item-b img
{
    margin-bottom: 1rem;

    border: 5px solid #fff;
}

.portfolio-item-b img:last-child
{
    margin-bottom: 0;
}