/* RESET */
body,html
{
    margin:0px;
    padding:0px;
    font-family: sans-serif;
    overflow: hidden auto;
}
/*LOGO*/
.logo
{
    width: 100vw;
    display:flex;
    justify-content:center;
    align-items: center;
    z-index:5000;
    background-color:#FAF9F8;
}
.fixed-float-top
{
    position:fixed;
    top:0px;
}
.logo img
{
    width:90%;
    min-width:768px;
    max-width:1120px;
}
.tablet.logo img {width:25%;min-width:140px;}

/* REUSABLE UTILITIES */

section 
{
    width:100%;
    min-height:100vh;
    flex-direction: column !important;
}
.container
{
    max-width:1300px;
}
.border-bottom-gold::after
{
    content:"";
    margin-left:20%;
    width:80%;
    border-bottom:4px solid #D3AA75;
}
.divider
{
    display:block;
    width:100%;
    max-width:600px;
    min-height: 4px;
    margin:0 auto;
    background-color:#D3AA75;
}
.svg-divider
{
    display:block;
    margin:0 auto;
    width:50%;
}
.svg-divider#after-photo-album
{
    width:30%;
}
.svg-divider#after-sales
{
    width:60px;
}
.svg-divider#after-exports
{
    width:20%;
}
/*
.svg-divider#next-section
{
    width: 50px;
    position: absolute;
    right: 30px;
    top: 37vh;
}*/
.svg-divider#next-section,.svg-divider#previous-section 
{
    width: 30px;
    position: fixed;
    right: 30px;
    top: 15vh;
    z-index: 5050;
    cursor: pointer;
}
.svg-divider#previous-section 
{
    transform:rotateZ(180deg);
    top:unset;
    bottom:15vh;
}
.svg-divider svg
{
    width:100%;
    margin:0 auto;
}
.hidden
{
    display:none;
}
.text-left
{
    text-align: left;
}
.text-right
{
    text-align: right;
}
.beige
{
    background-color: #F9F8F7;
}
.beige-dark
{
    background-color: #F2EEE9;
}
.light-blue-em
{
    color:#35A8E0;
    font-weight:bold;
}
svg g#Buttons circle
{
    cursor: pointer;
    transition: all 0.2s;
}
#history3 svg g#Labels text
{
    cursor: pointer;
}
#history-3 svg circle.active
{
    fill:#2f3c90 !important;
}

body::-webkit-scrollbar {
    width: 6px;
}

body::-webkit-scrollbar-track {
    box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
}

body::-webkit-scrollbar-thumb {
    background-color: #2f3c90;
    outline: 1px solid #2f3c90;
}
html {
    scrollbar-color: #2f3c90 #CCC; /* thumb and track color */
    scrollbar-width: thin;
}
#to_top
{
    justify-content: center;
    position: relative;
    top:-150px;
}

#to_top svg,#next-section svg
{width:50px;cursor: pointer;transition: all 0.2s;}

img.connection
{
    width:100px !important;
}

.clipped-vertical
{
    clip-path: polygon(0 100%, 100% 100%, 100% 100%, 0 100%);
    transition: clip-path 0.9s;
    transition-delay: 0.3s;
}
.clipped-horizontal
{
    clip-path: polygon(0 0, 0 0, 0 100%, 0 100%);
    transition: clip-path 0.9s;
    transition-delay: 0.3s;
}
.unclipped
{
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
}
#social-responsibility-fan
{
    clip-path: circle(100px at 50% 50%);
    transition:clip-path 0.5s;
    transition-delay: 0.5s;
}
#social-responsibility-fan.unclipped-circular
{
    clip-path: circle(350px at 50% 50%);
}
/* Media Queries */
@media screen and (max-width:768px)
{
    .desktop
    {
        display:none;
    }
    .tablet
    {
        display: flex;
    }

    .fullwidth-mobile
    {
        width:100% !important;
    }
}
.fullwidth-desktop
{
    width:100% !important;
}
@media screen and (min-width:768px)
{
    .desktop
    {
        display:flex;
    }
    .tablet
    {
        display: none;
    }
    .fullwidth-desktop
    {
        width:100% !important;
    }
    .midappear 
    {
        display:none;
    }
}
@media screen and (max-width:1120px)
{
    .midappear
    {
        display:flex;
    }
    .midsappear
    {
        display:none;
    }
}
/* SVG Logo Animation */
.cls-let {
    fill: #2f3c90;
}

.cls-img {
    isolation: isolate;
}

.cls-numbers {
    fill: none;
    stroke: #303030;
    stroke-miterlimit: 10;
    stroke-width: 6px;
}
.cls-numbers
{
    stroke-dasharray: 1500;
    stroke-dashoffset: 1650;
}
#CenterCircle
{
    position:relative;
    z-index:1500;
}