@keyframes titleFade{
    0%{
        opacity:0;
        top:30px
    }
    to{
        opacity:1;
        top:0
    }
}
@keyframes spanFade{
    0%{
        opacity:0;
        top:60px
    }
    to{
        opacity:1;
        top:0
    }
}
@keyframes fadeRight{
    0%{
        opacity:0;
        right:-60px
    }
    to{
        opacity:1;
        right:0
    }
}
@keyframes fadeLeft{
    0%{
        opacity:0;
        left:-60px
    }
    to{
        opacity:1;
        left:0
    }
}
@keyframes beforeTri{
    0%{
        width:100%
    }
    to{
        width:0
    }
}
@keyframes arrowBtn{
    0%{
        bottom:0
    }
    50%{
        bottom:-3px
    }
    to{
        bottom:3px
    }
}
@keyframes finger{
    0%{
        left:0
    }
    50%{
        left:-3px
    }
    to{
        left:3px
    }
}
@keyframes arrowBtnLeft{
    0%{
        left:0
    }
    50%{
        left:-3px
    }
    to{
        left:3px
    }
}
@keyframes dna{
    0%,to{
        top:0
    }
    50%{
        top:-3px
    }
	
/*------------General---fe6e48----------*/
}
.bodyHide,body{
    -webkit-transition:left .7s;
    -moz-transition:left .7s;
    -o-transition:left .7s;
    transition:left .7s
}
body{
    background-color:#fe6e48;
    display:none;
    overflow:hidden;
    left:0
}
.bodyHide{
    left:100%!important
}
h1,h2,h3,h4{
    font-weight:400
}
ul{
    padding-left:0
}
li{
    list-style:none
}
a{
    color:inherit
}
a:focus,a:hover{
    color:inherit;
    text-decoration:none
}
button{
    border:0;
    background-color:transparent
}
.pageInternal,section#loadingPage .logo img{
    position:relative
}
.titleH1{
    text-transform:uppercase;
    font-family:'Kabrio-ExtraBold';
    font-size:106px;
    font-size:6.6525rem;
    line-height:65px;
    letter-spacing:-5px;
    margin:0;
    -webkit-transform:translate3d(0,80px,0);
    -moz-transform:translate3d(0,80px,0);
    -o-transform:translate3d(0,80px,0);
    -ms-transform:translate3d(0,80px,0);
    transform:translate3d(0,80px,0);
    opacity:0
}
.animeTitle,.animeTitle span,.titleH1,.titleH1 span{
    -webkit-transition:all .7s;
    -moz-transition:all .7s;
    -o-transition:all .7s;
    transition:all .7s
}
.titleH1 span{
    display:block;
    text-shadow:3px -5px 15px rgba(0,0,0,.2);
    position:relative;
    -webkit-transform:translate3d(0,120px,0);
    -moz-transform:translate3d(0,120px,0);
    -o-transform:translate3d(0,120px,0);
    -ms-transform:translate3d(0,120px,0);
    transform:translate3d(0,120px,0);
    opacity:0
}
.animeTitle,.animeTitle span{
    -webkit-transform:translate3d(0,0,0);
    -moz-transform:translate3d(0,0,0);
    -o-transform:translate3d(0,0,0);
    -ms-transform:translate3d(0,0,0);
    transform:translate3d(0,0,0);
    opacity:1
	
/*----------------Social Media Bar------------------*/	
}
.socialMedia{
    display:inline-block;
    bottom:50px;
    position:absolute;
    color:#fff;
    padding-left:54px;
    z-index:9
}
.socialMedia ul{
    display:flex;
    flex-direction:column;
    align-items:center;
    margin-bottom:0
}
.socialMedia ul li{
    opacity:.6;
    -webkit-transition:opacity .3s;
    -moz-transition:opacity .3s;
    -o-transition:opacity .3s;
    transition:opacity .3s;
    font-size:20px;
    font-size:1.25rem;
    margin-bottom:8px
}
.socialMedia ul li:first-child{
    -webkit-transform:rotate(-90deg);
    -moz-transform:rotate(-90deg);
    -o-transform:rotate(-90deg);
    -ms-transform:rotate(-90deg);
    transform:rotate(-90deg);
    font-size:11px;
    font-size:.6875rem;
    font-family:'Kabrio-Bold';
    margin-bottom:28px;
    text-transform:uppercase;
    letter-spacing:1px;
    position:relative;
    left:2px
}
.socialMedia ul li:first-child:hover{
    opacity:.6
}
.socialMedia ul li:hover{
    opacity:1;
    -webkit-transition:opacity .3s;
    -moz-transition:opacity .3s;
    -o-transition:opacity .3s;
    transition:opacity .3s
}
.socialMedia ul li i{
    font-size:24px;
    font-size:1.5rem
}
.socialMedia ul .line{
    height:49px;
    width:2px;
    background-color:#fff;
    margin:14px 0
}
.socialMedia ul .line:hover{
    opacity:.6
}
@media (max-width:1600px){
    .socialMedia{
        padding:0 15px;
        bottom:25px
    }
    .titleH1{
        font-size:68px;
        font-size:4.25rem;
        line-height:50px
    }
}
@media (max-width:1199px){
    .socialMedia{
        padding:0
    }
    .titleH1{
        font-size:44px;
        font-size:2.75rem;
        line-height:30px
    }
}
@media (max-width:991px){
    body.bodyTablet{
        overflow-y:auto
    }
    /*.socialMedia{
        display:none
    }*/
}
@media (max-width:767px){
    body.bodyMobile{
        overflow-y:auto
    }
	.socialMedia{
        display:none
    }
	.socialMedia{
    padding-left:0px
	}
    .titleH1{
        font-size:32px;
        font-size:2.0rem;
        line-height:24px
	}
    .titleH1,.titleH1 span{
        -webkit-transform:translate3d(0,0,0);
        -moz-transform:translate3d(0,0,0);
        -o-transform:translate3d(0,0,0);
        -ms-transform:translate3d(0,0,0);
        transform:translate3d(0,0,0);
        opacity:1
    }
/*------------------Header-----------------------*/
}
header#header{
    position:absolute;
    width:100%;
    padding:69px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    z-index:99
}
header#header .iconMenu{
    position:relative;
    animation-duration:.2s;
    animation-delay:3.5s;
    animation-timing-function:ease-out;
    animation-fill-mode:both
}
header#header .iconMenu{
    background-image:url(../images/menuMain.png);
    height:43px;
    width:43px;
    background-position:center;
    background-repeat:no-repeat;
    cursor:pointer;
    background-size:contain;
    -webkit-transition:all .5s;
    -moz-transition:all .5s;
    -o-transition:all .5s;
    transition:all .5s;
    right:-210px;
    animation-name:fadeRight
}
header#header .iconMenu:hover{
    -webkit-transform:rotate(360deg);
    -moz-transform:rotate(360deg);
    -o-transform:rotate(360deg);
    -ms-transform:rotate(360deg);
    transform:rotate(360deg);
    background-image:url(../images/WSLmenu.png)
}
header#header .logoMenu{
    animation-name:fadeLeft;
    left:-210px
}
header#header nav#menu{
    position:fixed;
    height:100%;
    width:100%;
    left:0;
    top:0;
    text-align:center;
    display:none;
    z-index:99999
}
header#header nav#menu ul{
    height:100%;
    display:flex;
    flex-direction:column;
    justify-content:center
}
header#header nav#menu .nav-link{
    font-size:108px;
    font-size:6.75rem;
    font-weight:800;
    font-style:normal;
    color:#fff;
    text-transform:uppercase;
    font-family:'Kabrio-ExtraBold';
    padding:0;
    line-height:117px;
    letter-spacing:-7px
}
/*-Hide Nav Links based on display size-*/
header#header nav#menu .display{
	display:none
}
header#header nav#menu .nav-link:before,header#header nav#menu .nav-link:hover:before{
    -webkit-transition:width .5s;
    -moz-transition:width .5s;
    -o-transition:width .5s;
    transition:width .5s
}
header#header nav#menu .nav-link:before{
    content:'';
    height:10px;
    display:inline-block;
    width:0
}
header#header nav#menu .nav-link:hover:before{
    width:68px
}
header#header nav#menu .active:before{
    width:68px
}
header#header nav#menu .btnMenu{
    position:absolute;
    top:80px;
    right:70px;
    cursor:pointer
}
header#header nav#menu .btnMenu svg{
    height:43px;
    width:43px
}
header#header #menu.about,header#header #menu.privacy,header#header #menu.media,header#header #menu.client,header#header #menu.contact,header#header #menu.home,header#header #menu.team,header#header #menu.work,header#header .iconMenu:hover{
    -webkit-transition:all .5s;
    -moz-transition:all .5s;
    -o-transition:all .5s;
    transition:all .5s
}
header#header #menu.home{
    background-color:#f3715a
}
header#header #menu.home .active,header#header #menu.home .nav-link:hover{
    color:#0476c4
}
header#header #menu.home .active:before,header#header #menu.home .nav-link:hover:before{
    background:#0476c4
}
header#header #menu.about{
    background-color:#2885c3
}
header#header #menu.about .active,header#header #menu.about .nav-link:hover{
    color:#7fddd7
}
header#header #menu.about .active:before,header#header #menu.about .nav-link:hover:before{
    background:#7fddd7
}
header#header #menu.team{
    background-color:#00a79d
}
header#header #menu.team .active,header#header #menu.team .nav-link:hover{
    color:#012692
}
header#header #menu.team .active:before,header#header #menu.team .nav-link:hover:before{
    background:#012692
}
header#header #menu.work{
    background-color:#21409a
}
header#header #menu.work .active,header#header #menu.work .nav-link:hover{
    color:#f59883
}
header#header #menu.work .active:before,header#header #menu.work .nav-link:hover:before{
    background:#f59883
}
header#header #menu.client{
    background-color:#78b6e4
}
header#header #menu.client .active,header#header #menu.client .nav-link:hover{
    color:#f3715a
}
header#header #menu.client .active:before,header#header #menu.client .nav-link:hover:before{
    background:#f3715a
}
header#header #menu.privacy{
    background-color:#8387a0
}
header#header #menu.privacy .active,header#header #menu.privacy .nav-link:hover{
    color:#f3715a
}
header#header #menu.privacy .active:before,header#header #menu.privacy .nav-link:hover:before{
    background:#f3715a
}
header#header #menu.media{
    background-color:#f6b525;
}
header#header #menu.media .active,header#header #menu.media .nav-link:hover{
    color:#f3715a
}
header#header #menu.media .active:before,header#header #menu.media .nav-link:hover:before{
    background:#f3715a
}
header#header #menu.contact{
    background-color:#21409a
}
header#header #menu.contact .active,header#header #menu.contact .nav-link:hover,section#contact .contentContact h1{
    color:#f65317
}
header#header #menu.contact .active:before,header#header #menu.contact .nav-link:hover:before{
    background:#f5846c
}
@media (max-width:2560px) and (min-width:1681px){
    header#header .iconMenu{
    height:86px;
    width:86px
    }	
}
@media (max-width:1600px){
    header#header{
        padding:25px
    }
    header#header nav#menu .nav-link{
        font-size:80px;
        font-size:5rem;
        line-height:90px
    }
    header#header nav#menu .btnMenu{
        top:35px;
        right:25px
    }
}
@media (max-width:1024px){
	
    header#header nav#menu{
    position:fixed;
    height:100%;
    width:100%;
    left:0;
    top:0;
    text-align:center;
    display:none;
    z-index:99999
	}
    header#header nav#menu .nav-link{
    font-size:60px;
    font-size:3.75rem;
    line-height:72px;
    letter-spacing:-2px
	}
}
@media (max-width:1023px){
    header#header{
        padding:10px 20px
    }
	header#header nav#menu{
    position:fixed;
	height:100%;
    max-width:50%;
    left:0;
    top:-25%;
    text-align:center;
    display:none;
    z-index:99999
	}
    header#header .iconMenu{
        background-image:url(../images/menuMobile.png);
        height:18px;
        width:25px;
        animation-name:none;
        right:0
    }
    header#header .iconMenu:hover{
        -webkit-transform:rotate(0);
        -moz-transform:rotate(0);
        -o-transform:rotate(0);
        -ms-transform:rotate(0);
        transform:rotate(0);
        background-image:url(../images/menuMobile.png)
    }
    header#header .logoMenu{
        max-width:300px;
        animation-name:none;
        left:0
    }
    header#header nav#menu .nav-link{
        font-size:32px;
        font-size:2rem;
        line-height:48px;
        letter-spacing:-2px
    }
    header#header nav#menu .nav-link:before{
        height:3px;
        width:0
    }
    header#header nav#menu .active:before,header#header nav#menu .nav-link:hover:before{
        width:21px
    }
    header#header nav#menu .btnMenu{
        top:45px;
        right:20px
    }
    header#header nav#menu .btnMenu img{
        max-width:55%
    }
}
@media only screen and (max-height:600px) and (max-width:1024px){
	header#header nav#menu{
    position:fixed;
	height:100%;
    max-width:1024px;
    left:0;
    top:-25%;
    text-align:center;
    display:none;
    z-index:99999
	}
}
@media (max-width:767px){
    header#header{
    padding:10px 20px
    }
	header#header nav#menu{
    position:fixed;
	height:100%;
    max-width:767px;
    left:0;
    top:0;
    text-align:center;
    display:none;
    z-index:99999
	}
}
@media (max-width:414px){
    header#header .iconMenu{
        background-image:url(../images/menuMobile.png);
        height:18px;
        width:25px;
        animation-name:none;
        right:0
    }
	header#header nav#menu{
    position:fixed;
    height:100%;
    max-width:414px;
    left:0px;
    top:0px;
    text-align:center;
    display:none;
    z-index:99999
	}
    header#header .iconMenu:hover{
        -webkit-transform:rotate(0);
        -moz-transform:rotate(0);
        -o-transform:rotate(0);
        -ms-transform:rotate(0);
        transform:rotate(0);
        background-image:url(../images/menuMobile.png)
    }
    header#header .logoMenu{
        max-width:200px;
        animation-name:none;
        left:0
    }
    header#header nav#menu .nav-link{
        font-size:32px;
        font-size:2rem;
        line-height:48px;
        letter-spacing:-2px
    }
	header#header nav#menu .display{
	display:inline
	}
    header#header nav#menu .nav-link:before{
        height:3px;
        width:0
    }
    header#header nav#menu .active:before,header#header nav#menu .nav-link:hover:before{
        width:21px
    }
    header#header nav#menu .btnMenu{
        top:45px;
        right:20px
    }
    header#header nav#menu .btnMenu img{
        max-width:55%
    }
/*-------------------------Footer--------------------------*/	
}
footer#footer{
    right:0;
    margin-bottom:0;
    bottom:0;
    padding:0 70px;
    color:#fff;
    z-index:8
}
footer#footer .footer-right{
    font-size:14px;
    font-size:0.85rem;
    font-family:'Convergence',sans-serif
}
footer#footer .footer-right ul{
    display:flex;
    width:100%;
    justify-content:flex-end
}
footer#footer .footer-right ul li{
    margin-left:37px
}
@media (max-width:1600px){
    footer#footer{
    padding:0 25px;
    margin-bottom:0
	}
}
@media (max-width:991px){
    footer#footer{
    padding:0 25px;
    margin-bottom:0
    }
    footer#footer .footer-right{
    font-size:12px;
    font-size:0.75rem;
    font-family:'Convergence',sans-serif
	}
}
@media only screen and (max-device-height: 600px) and (max-device-height: 767px) and (orientation: landscape){
	footer#footer{
        display:none
	}
}
@media (max-width:767px){
    footer#footer{
        display:none
    }

/*--------------Logo Reveal---------------------*/
}
section#loadingPage{
    height:100vh;
    overflow:hidden
}
.loadingPageShow,section#loadingPage{
    -webkit-transition:left .5s;
    -moz-transition:left .5s;
    -o-transition:left .5s;
    transition:left .5s
}
section#loadingPage{
    position:absolute;
    width:100%;
    top:0;
    background:#f48669;
    z-index:99999;
    display:none;
    left:0
}
section#loadingPage .contentLoading{
    display:flex;
    align-items:center;
    height:100vh;
    width:100%
}
section#loadingPage .logo{
    position:relative;
    z-index:3;
    top:50px
}
section#loadingPage .tri-left,section#loadingPage .tri-right{
    width:50%;
    position:relative
}
footer#footer,section#loadingPage .tri-left div,section#loadingPage .tri-right div{
    position:absolute
}
section#loadingPage .tri-left .tri1,section#loadingPage .tri-left .tri2,section#loadingPage .tri-right .tri1,section#loadingPage .tri-right .tri2{
    opacity:.5
}
section#loadingPage .tri-left .tri1:before,section#loadingPage .tri-left .tri2:before,section#loadingPage .tri-right .tri1:before,section#loadingPage .tri-right .tri2:before{
    content:'';
    height:90px;
    width:100%;
    top:0;
    right:0;
    background:#f48669;
    position:absolute;
    z-index:2;
    animation-name:beforeTri;
    animation-duration:2s;
    -webkit-animation-fill-mode:forwards;
    animation-fill-mode:forwards
}
section#loadingPage .tri-left .tri1:before,section#loadingPage .tri-right .tri1:before{
    animation-delay:.5s
}
section#loadingPage .tri-left .tri2:before,section#loadingPage .tri-right .tri2:before{
    animation-delay:.1s
}
section#loadingPage .tri-left{
    right:-30px
}
section#loadingPage .tri-left>div,section#loadingPage .tri-right>div{
    right:0
}
section#loadingPage .tri-right{
    left:-30px;
    -webkit-transform:scaleX(-1);
    transform:scaleX(-1)
}
.loadingPageShow{
    left:100%!important
}
@media (max-width:1024px){
	section#loadingPage .contentLoading{
    align-items:centre;
	margin-top:-7%
	}
}
@media (max-width:797px){
    section#loadingPage img{
        max-width:100%
    }
    section#loadingPage .tri-left{
        display:none;
		right:0;
        flex:2
    }
    section#loadingPage .tri-left div,section#loadingPage .tri-right div{
        right:-3.6%
    }
    section#loadingPage .tri-right{
        display:none;
		left:0;
        flex:2
    }
    section#loadingPage .logo{
        top:15px;
        flex:1
    }
}