@import url("//hello.myfonts.net/count/330f83");

@font-face {
    font-family: 'lindymidalia-icon';
    src: url('/fonts/lindymidalia-regular-webfont.eot');
    src: url('/fonts/lindymidalia-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('/fonts/lindymidalia-regular-webfont.woff2') format('woff2'),
         url('/fonts/lindymidalia-regular-webfont.woff') format('woff'),
         url('/fonts/lindymidalia-regular-webfont.ttf') format('truetype'),
         url('/fonts/lindymidalia-regular-webfont.svg#lindymidalia_iconregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {font-family: 'BrandonGrotesqueWeb'; font-weight: 700; src: url('/fonts/330F83_0_0.eot');src: url('/fonts/330F83_0_0.eot?#iefix') format('embedded-opentype'),url('/fonts/330F83_0_0.woff2') format('woff2'),url('/fonts/330F83_0_0.woff') format('woff'),url('/fonts/330F83_0_0.ttf') format('truetype');}
@font-face {font-family: 'BrandonGrotesqueWeb'; font-weight: 500; src: url('/fonts/330F83_1_0.eot');src: url('/fonts/330F83_1_0.eot?#iefix') format('embedded-opentype'),url('/fonts/330F83_1_0.woff2') format('woff2'),url('/fonts/330F83_1_0.woff') format('woff'),url('/fonts/330F83_1_0.ttf') format('truetype');}
@font-face {font-family: 'BrandonGrotesqueWeb'; font-weight: 600; src: url('/fonts/330F83_2_0.eot');src: url('/fonts/330F83_2_0.eot?#iefix') format('embedded-opentype'),url('/fonts/330F83_2_0.woff2') format('woff2'),url('/fonts/330F83_2_0.woff') format('woff'),url('/fonts/330F83_2_0.ttf') format('truetype');}

@-moz-keyframes reveal-article
{
    from { -moz-opacity: 0.0 }
    to { -moz-opacity: 1.0 }
}

@-webkit-keyframes reveal-article
{
    from { -webkit-opacity: 0.0 }
    to { -webkit-opacity: 1.0 }
}

@keyframes reveal-article
{
    from { opacity: 0.0 }
    to { opacity: 1.0 }
}

html,
body,
body > main,
body > main > section,
body > main > section > .container
{
    height: 100%;
}

body
{
    font-size: 16px;
    font-family: BrandonGrotesqueWeb, sans-serif;
    font-weight: normal;
    line-height: 1.1875;
    text-rendering: optimizelegibility;
    -webkit-font-smoothing: antialiased;
    overflow-x: hidden;
    overflow-y: auto;
    background-color: #f7f7f7;
    background-image: url(/img/common/background.jpg);
    background-attachment: fixed;
    background-position: center center;
    color: #333;
}

body > main > section > .container
{
    position: relative;
}

::-webkit-scrollbar {
    width: 12px;
}

/* Track */
::-webkit-scrollbar-track {
    -webkit-border-radius: 0;
    border-radius: 0;
}

/* Handle */
::-webkit-scrollbar-thumb {
    -webkit-border-radius: 0;
    border-radius: 0;
    background: rgba(48,48,48,0.8); 
}
::-webkit-scrollbar-thumb:window-inactive {
    background: rgba(48,48,48,0.4); 
}

a 
{
    color: inherit;
}

a:hover,
a:focus 
{
    color: black;
}

h1, .h1
{
    font-size: 1.5625em;
    font-weight: 400;
    text-align: center;
}

h2, .h2
{
    font-size: 1.15em;
    font-weight: 700;
    margin-top: 2.5em;
    margin-bottom: 0.75em;
}

h1:first-child, .h1:first-child,
h2:first-child, .h2:first-child,
h3:first-child, .h3:first-child
{
    margin-top: 0;
}

header
{
    text-transform: uppercase;
    font-size: 0.875em;
    font-weight: 600;
}

main > section
{
    -webkit-animation: reveal-article 0.5s linear 0s both;
    animation: reveal-article 0.5s linear 0s both;
    position: relative;
}

section article > header h1
{
    margin: 0;
}

section article section
{
    padding-top: 4.25em;
    padding-bottom: 4.25em;
}

footer p:last-of-type
{
    margin-bottom: 0;
}

.fullscreen
{
    background-color: #aaa;
    width: 100%;
    height: 100%;
}

.slideshow
{
    position: relative;
}

.slideshow > figure
{
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center center;
}

.thumbnails article figure
{
    height: 0;
    padding-top: 100%;
    position: relative;
    background-size: cover;
    background-position: center center;
    margin: 15px 0;
}

.thumbnails article figure > a
{
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    display: block;
    background-color: rgba(160, 160, 160, 0.8);
    overflow: hidden;
    text-align: center;
    -webkit-opacity: 0;
    -moz-opacity: 0;
    opacity: 0;
    -webkit-transition: -webkit-opacity 0.5s ease-in-out;
    -moz-transition: -moz-opacity 0.5s ease-in-out;
    transition: opacity 0.5s ease-in-out;
    text-decoration: none;
    color: #fff;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}

.thumbnails article figure > a:hover,
.thumbnails article figure > a:focus
{
    -webkit-opacity: 1;
    -moz-opacity: 1;
    opacity: 1;
}

.thumbnails article figure > a > h2
{
    position: absolute;
    left: 0;
    top: 50%;
    width: 100%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    padding: 15px;
}

.enlargement
{
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    margin: 120px 60px;
    z-index: 0;
    background-size: contain;
    background-position: center center;
    background-repeat: no-repeat;
}

.abstract,
.detail
{
    line-height: 1.4;
}

.abstract h2
{
    margin-top: 0.75em;
}

.list-nav-prev,
.list-nav-next
{
    position: absolute;
    left: 0;
    right: auto;
    top: 0;
    width: 60px;
    height: 100%;
    cursor: pointer;
    text-align: center;
}

.list-nav-next
{
    left: auto;
    right: 0;
}

.list-nav-prev::after,
.list-nav-next::after
{
    content: 'P';
    display: block;
    vertical-align: middle;
    font-family: 'lindymidalia-icon', sans-serif;
    font-size: 3em;
    font-weight: normal;
    font-style: normal;
    text-transform: none;
    position: absolute;
    left: 0;
    top: 50%;
    width: 100%;
    margin-top: -0.75em;
}

.list-nav-next::after
{
    content: 'N';
}

.navbar-secondary 
{
    border: 0 none;
    border-bottom: 1px solid #ccc;
    border-radius: 0;
    background-color: transparent;
}

.icon:after
{
    display: inline-block;
    vertical-align: middle;
    font-family: 'lindymidalia-icon', sans-serif;
    font-size: 3em;
    font-weight: normal;
    font-style: normal;
    text-transform: none;
}

.icon-prev:after { content: 'P' }
.icon-next:after { content: 'N' }
.icon-up:after { content: 'U' }
.icon-down:after { content: 'D' }
.icon-twitter:after { content: 'T' }
.icon-facebook:after { content: 'F' }
.icon-linkedin:after { content: 'L' }
.icon-instagram:after { content: 'I' }

.icon span 
{
    display: none;
}

.nav > li > a
{
    padding: 5px 10px;
}

.navbar-social > li > a
{
    padding: 5px 3px;
}

.navbar-default .navbar-nav > li > a 
{
    -webkit-transition: color 0.3s ease-in-out, background-color 0.3s ease-in-out;
    transition: color 0.3s ease-in-out, background-color 0.3s ease-in-out;
}

.navbar-default .navbar-nav > .active > a, 
.navbar-default .navbar-nav > .active > a:focus,
.navbar-default .navbar-nav > .active > a:hover 
{
    color: #000;
    background-color: transparent
}

.navbar-default .navbar-header
{
    float: none;
    text-align: center;
}

.navbar-default .navbar-brand
{
    color: black;
    font-size: 2.42857143em;
    line-height: 1;
    font-weight: 400;
    float: none;
    margin-bottom: 0.5em;
    display: block;
    -webkit-transition: color 0.3s ease-in-out, background-color 0.3s ease-in-out;
    transition: color 0.3s ease-in-out, background-color 0.3s ease-in-out;
    height: auto;
}

@media (max-width: 767px)
{
    body > header
    {
        position: fixed;
        left: 0;
        top: 0;
        width: 100%;
        z-index: 9988;
    }

    main > section
    {
        margin-top: 64px;
    }

    .container > header,
    .container > footer
    {
        padding: 1em 0;
    }

    main > section.slideshow
    {
        margin-top: 0;
    }

    .enlargement
    {
        position: relative;
        margin: 0;
        padding-top: 100%;
    }

    .navbar-toggle
    {
        position: absolute;
        float: none;
        right: 15px;
        top: 15px;
        margin: 0;
        border: 0 none;
    }

    .navbar-default
    {
        margin-bottom: 0;
    }

    .navbar-default .navbar-brand
    {
        margin-bottom: 0;
    }

    .col-xs-6:nth-child(2n+1) 
    {
        clear: both;
    }
}

@media (min-width: 768px)
{
    body
    {
        padding-left: 200px;
        padding-right: 0;
        font-size: 14px;
    }

    body.middle,
    body.right
    {
        padding-left: 0;
    }

    body.right
    {
        padding-right: 200px;
    }

    body > .container > .inner
    {
        padding-top: 1px;
        padding-bottom: 1px;
    }

    body > header
    {
        position: fixed;
        left: 0;
        top: 0;
        width: 200px;
        height: 100%;
        background-color: #f7f7f7;
        background-image: url(/img/common/background.jpg);
        background-attachment: fixed;
        background-position: center center;
        z-index: 9999;
        -webkit-transition: left 0.5s ease-in-out, margin 0.5s ease-in-out;
        transition: left 0.5s ease-in-out, margin 0.5s ease-in-out;
        -webkit-transition-timing-function: cubic-bezier(0.165, 0.840, 0.440, 1.000); 
           -moz-transition-timing-function: cubic-bezier(0.165, 0.840, 0.440, 1.000); 
             -o-transition-timing-function: cubic-bezier(0.165, 0.840, 0.440, 1.000); 
                transition-timing-function: cubic-bezier(0.165, 0.840, 0.440, 1.000); /* easeOutQuart */
        -webkit-transform: translateZ(0);
        -moz-transform: translateZ(0);
        -ms-transform: translateZ(0);
        -o-transform: translateZ(0);
        transform: translateZ(0);
    }

    body > header::after
    {
        content: ' ';
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        background-color: rgba(0, 0, 0, 0.05);
    }

    body > header > .navbar-default
    {
        position: absolute;
        left: 0;
        top: 50%;
        width: 100%;
        background-color: transparent;
        border: 0 none;
        border-radius: 0;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        z-index: 1;
    }

    body.middle > header
    {
        left: 50%;
        margin-left: -100px;
    }

    body.right > header
    {
        left: 100%;
        margin-left: -200px;
    }

    .container
    {
        width: 100%;
        max-width: 568px;
    }

    .container > header,
    .container > footer
    {
        padding: 3.75em 0;
    }

    .pin-top
    {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
    }

    .pin-middle
    {
        position: absolute;
        left: 0;
        top: 50%;
        width: 100%;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
    }

    .pin-bottom
    {
        position: absolute;
        left: 0;
        bottom: 0;
        width: 100%;
    }

    .row-x-wide
    {
        margin-left: -30px;
        margin-right: -30px;
    }

    .row-x-wide > .col-xs-1, .row-x-wide > .col-sm-1, .row-x-wide > .col-md-1, .row-x-wide > .col-lg-1, .row-x-wide > .col-xs-2, .row-x-wide > .col-sm-2,
    .row-x-wide > .col-md-2, .row-x-wide > .col-lg-2, .row-x-wide > .col-xs-3, .row-x-wide > .col-sm-3, .row-x-wide > .col-md-3, .row-x-wide > .col-lg-3, .row-x-wide > .col-xs-4,
    .row-x-wide > .col-sm-4, .row-x-wide > .col-md-4, .row-x-wide > .col-lg-4, .row-x-wide > .col-xs-5, .row-x-wide > .col-sm-5, .row-x-wide > .col-md-5, .row-x-wide > .col-lg-5,
    .row-x-wide > .col-xs-6, .row-x-wide > .col-sm-6, .row-x-wide > .col-md-6, .row-x-wide > .col-lg-6, .row-x-wide > .col-xs-7, .row-x-wide > .col-sm-7, .row-x-wide > .col-md-7,
    .row-x-wide > .col-lg-7, .row-x-wide > .col-xs-8, .row-x-wide > .col-sm-8, .row-x-wide > .col-md-8, .row-x-wide > .col-lg-8, .row-x-wide > .col-xs-9, .row-x-wide > .col-sm-9,
    .row-x-wide > .col-md-9, .row-x-wide > .col-lg-9, .row-x-wide > .col-xs-10, .row-x-wide > .col-sm-10, .row-x-wide > .col-md-10, .row-x-wide > .col-lg-10,
    .row-x-wide > .col-xs-11, .row-x-wide > .col-sm-11, .row-x-wide > .col-md-11, .row-x-wide > .col-lg-11, .row-x-wide > .col-xs-12, .row-x-wide > .col-sm-12,
    .row-x-wide > .col-md-12, .row-x-wide > .col-lg-12
    {
        padding-left: 30px;
        padding-right: 30px;
    }

    .navbar-default .navbar-nav
    {
        float: none;
        text-align: center;
    }

    .navbar-default .navbar-nav > li,
    .navbar-social > li
    {
        float: none;
        display: inline-block;
    }

    .navbar-social 
    {
        text-align: center;
        position: absolute;
        left: 0;
        bottom: 3.75em;
        width: 100%;
        z-index: 2;
    }
}

@media (min-width: 768px) and (max-width: 991px)
{
    .navbar-default .navbar-nav > li
    {
        display: block;
    }
}

@media (min-width: 992px)
{
    body
    {
        padding-left: 300px;
        padding-right: 0;
        font-size: 15px;
    }

    body.right
    {
        padding-right: 300px;
    }

    body > header
    {
        width: 300px;
    }

    body.middle > header
    {
        margin-left: -150px;
    }

    body.right > header
    {
        margin-left: -300px;
    }

    .container
    {
        max-width: 696px;
    }

    .row-x-wide
    {
        margin-left: -45px;
        margin-right: -45px;
    }

    .row-x-wide > .col-xs-1, .row-x-wide > .col-sm-1, .row-x-wide > .col-md-1, .row-x-wide > .col-lg-1, .row-x-wide > .col-xs-2, .row-x-wide > .col-sm-2,
    .row-x-wide > .col-md-2, .row-x-wide > .col-lg-2, .row-x-wide > .col-xs-3, .row-x-wide > .col-sm-3, .row-x-wide > .col-md-3, .row-x-wide > .col-lg-3, .row-x-wide > .col-xs-4,
    .row-x-wide > .col-sm-4, .row-x-wide > .col-md-4, .row-x-wide > .col-lg-4, .row-x-wide > .col-xs-5, .row-x-wide > .col-sm-5, .row-x-wide > .col-md-5, .row-x-wide > .col-lg-5,
    .row-x-wide > .col-xs-6, .row-x-wide > .col-sm-6, .row-x-wide > .col-md-6, .row-x-wide > .col-lg-6, .row-x-wide > .col-xs-7, .row-x-wide > .col-sm-7, .row-x-wide > .col-md-7,
    .row-x-wide > .col-lg-7, .row-x-wide > .col-xs-8, .row-x-wide > .col-sm-8, .row-x-wide > .col-md-8, .row-x-wide > .col-lg-8, .row-x-wide > .col-xs-9, .row-x-wide > .col-sm-9,
    .row-x-wide > .col-md-9, .row-x-wide > .col-lg-9, .row-x-wide > .col-xs-10, .row-x-wide > .col-sm-10, .row-x-wide > .col-md-10, .row-x-wide > .col-lg-10,
    .row-x-wide > .col-xs-11, .row-x-wide > .col-sm-11, .row-x-wide > .col-md-11, .row-x-wide > .col-lg-11, .row-x-wide > .col-xs-12, .row-x-wide > .col-sm-12,
    .row-x-wide > .col-md-12, .row-x-wide > .col-lg-12
    {
        padding-left: 45px;
        padding-right: 45px;
    }
}

@media (min-width: 992px) and (max-width: 1199px)
{
}

@media (min-width: 1200px)
{
    body
    {
        padding-left: 400px;
        padding-right: 0;
        font-size: 16px;
    }

    body.right
    {
        padding-right: 400px;
    }

    body > header
    {
        width: 400px;
    }

    body.middle > header
    {
        margin-left: -200px;
    }

    body.right > header
    {
        margin-left: -400px;
    }

    .container
    {
        max-width: 800px;
    }

    .row-x-wide
    {
        margin-left: -60px;
        margin-right: -60px;
    }

    .row-x-wide > .col-xs-1, .row-x-wide > .col-sm-1, .row-x-wide > .col-md-1, .row-x-wide > .col-lg-1, .row-x-wide > .col-xs-2, .row-x-wide > .col-sm-2,
    .row-x-wide > .col-md-2, .row-x-wide > .col-lg-2, .row-x-wide > .col-xs-3, .row-x-wide > .col-sm-3, .row-x-wide > .col-md-3, .row-x-wide > .col-lg-3, .row-x-wide > .col-xs-4,
    .row-x-wide > .col-sm-4, .row-x-wide > .col-md-4, .row-x-wide > .col-lg-4, .row-x-wide > .col-xs-5, .row-x-wide > .col-sm-5, .row-x-wide > .col-md-5, .row-x-wide > .col-lg-5,
    .row-x-wide > .col-xs-6, .row-x-wide > .col-sm-6, .row-x-wide > .col-md-6, .row-x-wide > .col-lg-6, .row-x-wide > .col-xs-7, .row-x-wide > .col-sm-7, .row-x-wide > .col-md-7,
    .row-x-wide > .col-lg-7, .row-x-wide > .col-xs-8, .row-x-wide > .col-sm-8, .row-x-wide > .col-md-8, .row-x-wide > .col-lg-8, .row-x-wide > .col-xs-9, .row-x-wide > .col-sm-9,
    .row-x-wide > .col-md-9, .row-x-wide > .col-lg-9, .row-x-wide > .col-xs-10, .row-x-wide > .col-sm-10, .row-x-wide > .col-md-10, .row-x-wide > .col-lg-10,
    .row-x-wide > .col-xs-11, .row-x-wide > .col-sm-11, .row-x-wide > .col-md-11, .row-x-wide > .col-lg-11, .row-x-wide > .col-xs-12, .row-x-wide > .col-sm-12,
    .row-x-wide > .col-md-12, .row-x-wide > .col-lg-12
    {
        padding-left: 60px;
        padding-right: 60px;
    }
}
