.landingScreen {
position: fixed;
opacity: 1;
z-index: 13;
width: 100%;
height: 100%;
background-color: #000;
left: 0px;
top: 0px;
right: 0;
bottom: 0;
text-align: center;
}
.loaded .landingScreen {
animation: hidescreen 0.6s forwards linear;
animation-delay: 2s;
}
@keyframes hidescreen {
0% {
opacity: 1
}
100% {
opacity: 0;
}
}
.landlogoHolder {
width: 50%;
height: 75%;
position: relative;
display: inline-block;
top: 15vh;
margin: 0 auto;
transform-origin: center;
-ms-transform: rotateY(0deg) translateX(0px);
-webkit-transform: rotateY(0deg) translateX(0px);
-moz-transform: rotateY(0deg) translateX(0px);
-o-transform: rotateY(0deg) translateX(0px);
transform: rotateY(0deg) translateX(0px);
-webkit-backface-visibility: visible;
backface-visibility: visible;
-webkit-transition: all .6s linear;
-moz-transition:    all .6s linear;
-o-transition:      all .6s linear;
transition:         all .6s linear;
}
.landlogoHolder svg {
width: 100%;
height: 100%;
max-width: 440px;
max-height: 700px;
display: block;
margin: 0 auto;
}
.strips {
width: 105%;
height: 100%;
position: absolute;
}
.landlogoHolder span {
height: 6%;
width: 100%;
display: block;
background-color: #000;
-webkit-transition: height 1s cubic-bezier(.4, 0, .2, 1);
-moz-transition: height 1s cubic-bezier(.4, 0, .2, 1);
-o-transition: height 1s cubic-bezier(.4, 0, .2, 1);
transition: height 1s cubic-bezier(.4, 0, .2, 1);
transition-delay: 0.5s;
backface-visibility: visible;
}
.loaded .landlogoHolder span {
height: 0;
}
.loaded .landlogoHolder {
padding: 0px; transition-delay: 1.5s;
top: 40px;
height: 45px;
width: 30px;
-ms-transform: rotateY(180deg) translateX(35px);
-webkit-transform: rotateY(180deg) translateX(35px);
-moz-transform: rotateY(180deg) translateX(35px);
-o-transform: rotateY(180deg) translateX(35px);
transform: rotateY(180deg) translateX(35px);
}
@keyframes logoset {
0% {
top: 12%; width: 50%;
height: 75%; -ms-transform: rotateY(0deg) translateX(0px);
-webkit-transform: rotateY(0deg) translateX(0px);
-moz-transform: rotateY(0deg) translateX(0px);
-o-transform: rotateY(0deg) translateX(0px);
transform: rotateY(0deg) translateX(0px);
margin: 0 auto;
}
100% {
top: 40px;
height: 45px;
width: 30px;
opacity: 0.4;
margin: 0 auto 0 calc(50% - 52px) translateX(35px);
-ms-transform: rotateY(180deg) translateX(35px);
-webkit-transform: rotateY(180deg) translateX(35px);
-moz-transform: rotateY(180deg) translateX(35px);
-o-transform: rotateY(180deg) translateX(35px);
transform: rotateY(180deg) translateX(35px);
}
} .disablescroll {
position: absolute;
z-index: 3;
width: 100%;
height: 100%;
left: 0px;
top: 0px;
background: url(//socratesint.com/wp-content/themes/socrates-custom/images/dragger-curser-touch.svg);
background-repeat: no-repeat;
background-size: 175px 105px;
background-position: center;
}
.animateMeslider .disablescroll {
display: none;
}
#cursor.null{display: none}
#cursor {
position: fixed;
z-index: 9999999999;
left: 0;
top: 0;
pointer-events: none;
cursor: none;
will-change: transform; }
@media (hover: hover) and (pointer: fine) {
.cursor__circle {
width: 100%;
height: 100%;
font-size: 16px;
line-height: 18px;
margin-top: -50%;
margin-left: -50%;
border-radius: 50%; transition: opacity 0.3s cubic-bezier(0.25, 1, 0.5, 1),
background-color 0.3s cubic-bezier(0.25, 1, 0.5, 1),
border-color 0.3s cubic-bezier(0.25, 1, 0.5, 1),
width 0.3s cubic-bezier(0.25, 1, 0.5, 1),
height 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
#cursor::before
{content: '';
transition: transform 0.3s cubic-bezier(0.25, 1, 0.5, 1);
width: 60px; height: 60px; border-radius: 100%;display: block;background-color: #e6007e;position: absolute;left: -50%;top: -50%; transform: translate(-50%, -50%) scale(0.3);} #cursor.linkhover::before
{
transform: translate(-50%, -50%) scale(1); background-color: #e6007e; border: 0px solid #fff; opacity: 0.5;
}
#cursor.teamsliderarrow .cursor__circle
{
background-color: #000;}
#cursor.teamsliderarrow
{
mix-blend-mode:  normal;
}
#cursor.teamsliderarrow::before
{content: ''; border-radius: 0;
width: 175px; height: 105px; display: block; background: url(//socratesint.com/wp-content/themes/socrates-custom/images/dragger-curser-new.svg); background-repeat: no-repeat;
background-size: contain;position: absolute;left: -50%;top: -50%; transform: translate(-50%, -50%);}
#cursor.teamsliderarrow.plusarrow .cursor__circle
{background-color: transparent}
#cursor.teamsliderarrow.plusarrow
{ }
#cursor.teamsliderarrow.plusarrow::before
{width: 60px; height: 60px;border-radius: 100%;display: block; background: none;background-color: #e6007e; border: 0px solid #fff;  opacity: 0.5;}
}
header {
position: fixed;
z-index: 10;
left: 0px;
top: 0px;
width: 100%;
padding: 30px 50px;
opacity: 0;
}
.loaded header {
animation: showheader 0.6s forwards linear;
animation-delay: 2.5s;
}
.loaded.setcookee header {
transition: none;
animation: none;
opacity: 1;
}
@keyframes showheader {
0% {
opacity: 0
}
100% {
opacity: 1;
}
}
header .logo { right: 0px;
width: 210px;
position: relative;
display: inline-block;
margin: 0 auto;
z-index: 3;
top: 0;
-webkit-transition: top .5s cubic-bezier(.16, .84, .44, 1);
-moz-transition: top .5s cubic-bezier(.16, .84, .44, 1);
-o-transition: top .5s cubic-bezier(.16, .84, .44, 1);
transition: top .5s cubic-bezier(.16, .84, .44, 1);
transition-timing-function: cubic-bezier(0.16, 0.84, 0.44, 1);
}
header .logo img{
width: 100%;
}
.setcookee header .logo{right: 0px;}
header.shrink .logo {
top: -100px;
}
body.menuOpen header.shrink .logo {
top: 0px;
}
body:not(.menuOpen) header.shrink
{
padding-top: 0px;
padding-bottom: 0px;
height: 0px;
} #burgurMenu {
position: absolute;
z-index: 3;
cursor: pointer;
left: 40px;
top: 27px;
width: 50px;
height: 50px;
overflow: hidden;
justify-content: center;
}
.menuLabel {
font-size: 16px;
line-height: 20px;
text-transform: uppercase;
font-family: 'avenirbook';
transform: translateX(-60px);
position: absolute;
-webkit-transition: all .3s cubic-bezier(.16, .84, .44, 1);
-moz-transition: all .3s cubic-bezier(.16, .84, .44, 1);
-o-transition: all .3s cubic-bezier(.16, .84, .44, 1);
transition: all .3s cubic-bezier(.16, .84, .44, 1);
transition-timing-function: cubic-bezier(0.16, 0.84, 0.44, 1);
}
.menuLabel::before {
content: 'Menu';
}
#burgurMenu.active .menuLabel::before {
content: 'Close';
}
.menuIcon {
width: 35px;
height: 20px;
transform: translateX(0px);
align-items: flex-start;
-webkit-transition: all .3s cubic-bezier(.16, .84, .44, 1);
-moz-transition: all .3s cubic-bezier(.16, .84, .44, 1);
-o-transition: all .3s cubic-bezier(.16, .84, .44, 1);
transition: all .3s cubic-bezier(.16, .84, .44, 1);
transition-timing-function: cubic-bezier(0.16, 0.84, 0.44, 1);
}
.menuIcon span {
width: 100%;
height: 2px;
background-color: #fff
}
.menuIcon::before, .menuIcon::after {
content: '';
display: block;
width: 100%;
height: 2px;
background-color: #fff
}
.no-touch #burgurMenu:hover .menuLabel {
transform: translateX(0px);
}
.no-touch #burgurMenu:hover .menuIcon {
transform: translateX(60px);
}
#burgurMenu.active .menuIcon::before, #burgurMenu.active .menuIcon::after {
opacity: 0;
}
.instaIcon {
width: 80px;
right: 50px;
top: 35px;
position: absolute;
z-index: 3;
}
.mainMenu {
position: fixed;
visibility: hidden;
top: 50%;
padding: 0px;
list-style: none;
margin: 0px auto 0 auto;
-webkit-transform: translate(0%, -50%);
transform: translate(0%, -50%);
width: 100%;
text-align: center;
justify-content: space-around;
}
.menu-main-menu-container {
list-style: none;
position: fixed;
z-index: 1;
width: 100%;
left: 0;
top: 0;
height: 100%;
padding: 100px 0px;
background-color: #000;
visibility: hidden;
opacity: 0;
-webkit-transition: all .3s cubic-bezier(.16, .84, .44, 1);
-moz-transition: all .3s cubic-bezier(.16, .84, .44, 1);
-o-transition: all .3s cubic-bezier(.16, .84, .44, 1);
transition: all .3s cubic-bezier(.16, .84, .44, 1);
transition-timing-function: cubic-bezier(0.16, 0.84, 0.44, 1);
}
body.menuOpen .menu-main-menu-container {
visibility: visible;
opacity: 1;
}
body.menuOpen .mainMenu {
visibility: visible;
}
ul.mainMenu li {
position: relative;
display: block;
width: 100%;
text-align: center;
padding: 0px;
margin: 10px 0px;
}
ul.mainMenu li a {
font-size: 8.5vh;
line-height: 8vh;
font-family: 'didotregular';
text-transform: uppercase;
text-decoration: none !important;
white-space: nowrap;
width: 100%;
transition: none;
}
.loaded ul.mainMenu li a span { color: #575757;
padding: 0px 10px;
-webkit-transition: opacity .4s cubic-bezier(.16, .84, .44, 1), transform .4s cubic-bezier(.16, .84, .44, 1);
-moz-transition: opacity .4s cubic-bezier(.16, .84, .44, 1), transform .4s cubic-bezier(.16, .84, .44, 1);
-o-transition: opacity .4s cubic-bezier(.16, .84, .44, 1), transform .4s cubic-bezier(.16, .84, .44, 1);
transition: opacity .4s cubic-bezier(.16, .84, .44, 1), transform .4s cubic-bezier(.16, .84, .44, 1);
transition-timing-function: cubic-bezier(0.16, 0.84, 0.44, 1);
position: relative;
transform: translateX(50vw);
z-index: 0;
transition-delay: 0.1s;
}
ul.mainMenu li a .leftmask {
content: '';
width: 50vw;
position: absolute;
height: 100%;
background-color: #000;
z-index: 1;
-webkit-transition: width 1s cubic-bezier(.16, .84, .44, 1);
-moz-transition: width 1s cubic-bezier(.16, .84, .44, 1);
-o-transition: width 1s cubic-bezier(.16, .84, .44, 1);
transition: width 1s cubic-bezier(.16, .84, .44, 1); }
ul.mainMenu li a .rightmask {
content: '';
width: 50vw;
position: absolute;
height: 100%;
background-color: #000;
z-index: 1;
-webkit-transition: width 0.6s cubic-bezier(.16, .84, .44, 1);
-moz-transition: width 0.6s cubic-bezier(.16, .84, .44, 1);
-o-transition: width 0.6s cubic-bezier(.16, .84, .44, 1);
transition: width 0.6s cubic-bezier(.16, .84, .44, 1);
animation: changecolor 0.1s forwards linear;
animation-delay: 0.2s;
}
.no-touch ul.mainMenu li a:hover .leftmask, .no-touch ul.mainMenu li a:hover .rightmask {
width: 0; }
@keyframes maskwidth {
0% {
width: 50vw;
}
100% {
width: 0;
}
}
.no-touch ul.mainMenu li a:hover {
justify-content: center;
}
.no-touch ul.mainMenu li a:hover span {
transform: translateX(0vw);
opacity: 1;
}
ul.mainMenu li a span:nth-child(2) {
color: #575757;
opacity: 1;
z-index: 3;
}
.no-touch ul.mainMenu li a:hover span:nth-child(2) {
margin-left: 0px !important;
z-index: 0;
}
.no-touch ul.mainMenu li a:hover span:nth-child(5) { animation: changecolor 0.1s forwards linear;
animation-delay: 0.2s;
}
@keyframes changecolor {
0% {
color: #575757;
z-index: 0;
}
100% {
color: #fff;
z-index: 2;
}
}
.no-touch ul.mainMenu li a:hover {
font-family: 'didotitalic';
}
ul.mainMenu li.current_page_item a span:nth-child(2){color: #fff}
ul.mainMenu li.current_page_item:hover a span:nth-child(2){color: #575757} .menu-main-menu-container::after {
content: '';
display: block;
position: absolute;
bottom: 10px;
left: 50%;
margin-left: -28px;
width: 45px;
height: 60px;
margin: 0 auto;
background: url(//socratesint.com/wp-content/themes/socrates-custom/images/logo-white-icon.svg);
background-repeat: no-repeat;
background-position: center;
background-size: contain;
} .jarallax {
position: fixed;
top: 0px;
left: 0px;
width: 100%;
z-index: 0;
height: 100vh;
background: transparent;
}
.jarallax .imgloader {
display: none;
}
.HeroBanner {
width: 100%;
height: 100vh;
min-height: 450px;
position: relative;
opacity: 0;
background-color: #000;
transition: opacity 1s cubic-bezier(.16,.84,.44,1);
-webkit-transition: opacity 1s cubic-bezier(.16,.84,.44,1);
-moz-transition: opacity 1s cubic-bezier(.16,.84,.44,1);
-o-transition: opacity 1s cubic-bezier(.16,.84,.44,1);
}
.loaded .HeroBanner
{opacity: 1;}
.HeroBanner iframe, .home .HeroBanner img, .single .HeroBanner img {
width: 100vw;
height: 56.25vw; min-height: 130vh;
min-width: 250vh;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
.home .HeroBanner .jarallax img {
object-position: 50% 50% !important;
}
.HeroBanner .heroText{
z-index: 1;
width: 100%;
}
.single .HeroBanner::before {
content: '';
display: block;
position: absolute;
z-index: 1;
background-color: rgba(0, 0, 0, 0.5);
width: 100%;
height: 100%;
top: 0;
left: 0;
}
.jarallax::before {
content: '';
display: block;
position: absolute;
z-index: 1;
background-color: rgba(0, 0, 0, 0.3);
width: 100%;
height: 100%;
top: 0;
left: 0;
}
.jarallax img{
object-position: 50% 0% !important;
}
.nextScroll {
position: absolute;
z-index: 5;
bottom: -30px;
margin-left: -45px;
left: 50%;
transform: rotate(90deg) translateX(-50%);
font-size: 14px;
line-height: 17px;
letter-spacing: 0.8px;
text-transform: uppercase;
font-family: 'avenirbook';
color: #fff;
overflow: hidden;
padding-right: 40px;
padding-bottom: 5px;
border-bottom: 1px solid #fff;
cursor: pointer;
}
.nextScroll::before {
content: 'scroll';
display: block;
position: absolute;
right: 100px;
-webkit-transition: all .3s cubic-bezier(.16, .84, .44, 1);
-moz-transition: all .3s cubic-bezier(.16, .84, .44, 1);
-o-transition: all .3s cubic-bezier(.16, .84, .44, 1);
transition: all .3s cubic-bezier(.16, .84, .44, 1);
transition-timing-function: cubic-bezier(0.16, 0.84, 0.44, 1);
}
.nextScroll span {
position: relative;
display: inline-block;
transform: translateX(0%);
-webkit-transition: all .3s cubic-bezier(.16, .84, .44, 1);
-moz-transition: all .3s cubic-bezier(.16, .84, .44, 1);
-o-transition: all .3s cubic-bezier(.16, .84, .44, 1);
transition: all .3s cubic-bezier(.16, .84, .44, 1);
transition-timing-function: cubic-bezier(0.16, 0.84, 0.44, 1);
}
.no-touch .nextScroll:hover span {
transform: translateX(100px);
}
.no-touch .nextScroll:hover::before {
right: 40px;
}
.heroText {
position: absolute;
left: 0px;
top: 0px;
width: 100%;
height: 100%;
overflow: hidden;
}
.heroText h1 {
width: 42.70vw;
margin: 0px auto;
}
.heroText h1 span {
display: block;
width: 100%;
}
.heroText span:nth-child(1) {
transform: translateX(-150%);
font-size: 11.77vw ;
line-height: 10.26vw ;
letter-spacing: -0.58vw ;
}
.heroText span:nth-child(2) {
transform: translateX(150%);
font-size: 18.69vw ;
line-height: 16.35vw ;
letter-spacing: -0.93vw ;
margin-top: -1.5vw;
text-align: right;
font-family: 'didotitalic';
}
.heroText span:nth-child(1), .heroText span:nth-child(2) {
-webkit-transition: transform 1s cubic-bezier(.16, .84, .44, 1);
-moz-transition: transform 1s cubic-bezier(.16, .84, .44, 1);
-o-transition: transform 1s cubic-bezier(.16, .84, .44, 1);
transition: transform 1s cubic-bezier(.16, .84, .44, 1);
transition-timing-function: cubic-bezier(0.16, 0.84, 0.44, 1);
}
.loaded .HeroBanner.animateMe .heroText span:nth-child(1), .loaded .HeroBanner.animateMe .heroText span:nth-child(2) {
transform: translateX(0px);
}
.page-template-template-our-works-php .heroText
{
background-color: rgba(0, 0, 0, 0.4);
}
.HeroBanner .paraText{
max-width: 1120px;
margin: 0 auto;
}
.single .HeroBanner .paraText
{
margin:-5vw auto 0 auto
}
.heroText h2
{margin: 0 auto;max-width: 1120px;100%; text-align: center;}
.heroText h4
{ font-size: 20px;
line-height: 27px;
letter-spacing: 0px;
text-transform: none;
font-family: 'avenirblack';
margin: 0 auto 40px auto; width: 60%; text-align: center;
} .pageIntro {
background-color: var(--light_gray);
min-height: 100vh;
padding: 14vw 50px;
}
.pageIntro>div { width: 63%;
margin: 0 auto;
color: #000;
}
.paraText {
text-align: center;
font-family: 'didotregular';
}
.paraText p:last-of-type{
padding: 0px;
}
.paraText, .JobList .jobRole, .ESGWrapper h2, .TextOnBG .textBlock h2, .heroText h2, .teamInfo h2,
.WorkBlock.quote .overlay>div h2{
font-size: 2.70vw ;
line-height: 3.125VW ;
}
section h4 {
color: #fff;
font-size: 20px;
line-height: 28px;
letter-spacing: 2px;
text-align: center;
font-weight: normal;
text-transform: uppercase; font-family: 'avenirbook';
margin-bottom: 60px;
}
section h4 b {
font-family: 'avenirblack';
} .whatWeDo { min-height: 100vh;
padding: 8vw 0px;
overflow: hidden;
}
.marquee {
overflow: hidden;
-webkit-transform-origin: top left;
-ms-transform-origin: top left;
transform-origin: top left;
display: block; width: 100vw;
max-width: 100%;
overflow-x: hidden; margin-bottom: 5vw;
position: relative;
} .whatWeDo h2 {
overflow: hidden;
text-transform: uppercase;
display: inline-block;
white-space: nowrap;
margin-bottom: 0px;
font-size: 7.86vw ;
line-height: 6.87vw ;
letter-spacing: -7.55px;
}
.whatWeDo h2 span {
display: inline-block; color: #fff;
}
.whatWeDo h2 span:nth-child(odd) {
color: #000;
}
.whatWeDo>div.centerBlock { width: 65%;
padding: 0px 50px;
margin: 0 auto;
}
.whatWeDo>div.centerBlock ul {
width: 100%;
list-style: none;
column-count: 2;
column-gap: 20px;
margin: 0;
padding: 0;
}
.whatWeDo>div.centerBlock ul li {
padding: 25px 0px 10px 0px;
border-bottom: 1px solid #fff;
font-size: 30px;
line-height: 36px;
font-family: 'avenirlight';
} .ourTeam {
min-height: 100vh;
padding: 13vw 0px 8vw 0px;
}
.ourTeam::before {
content: '';
display: block;
position: absolute;
top: 0px;
left: 0px;
width: 100%;
height: 23.8vw; background-color: var(--light_gray);
}
.ourTeam{
background-color: var(--dark_gray);
}
.ourTeam>div.centerBlock {
width: 76%; margin: 0 auto;
position: relative;
}
.ourTeam .teamOverlayInfo {
position: relative;
z-index: 1;
align-items: flex-end;
width: 100%;
height: 100%;
padding-left: 50px;
padding-top: 60px;
padding-right: 50px;
left: 0px;
margin-top: -50%;
}
.teamOverlayInfo h2>span:nth-child(2)
{
margin-top: -1%;
}
.teamOverlayInfo h2, .fullSlideOverlayText h2 {
width: 100%;
margin-bottom: 0px;
}
.teamOverlayInfo h2>span:nth-child(1), .fullSlideOverlayText h2>span:nth-child(1) {
text-align: left; font-size: 11.51vw;
line-height: 10.05vw;
letter-spacing: -0.57vw;
color: #000;
}
.teamOverlayInfo h2>span:nth-child(2), .fullSlideOverlayText h2>span:nth-child(2) {
text-align: center; font-size: 18.22vw;
line-height: 15vw;
letter-spacing: -0.88vw;
color: #fff;
font-family: 'didotitalic';
padding-left: 5.5%;
}
.teamOverlayInfo h2>span, .OurWork h2>span {
overflow: hidden;
display: block;
width: 100%;
} .teamOverlayInfo h2, .OurWork h2
.teamOverlayInfo h2>span, .OurWork h2>span  {
-webkit-transform: translateY(110%);
transform: translateY(110%);
overflow: hidden;
display: block;
padding-top: 0%;
opacity: 0;
transition: opacity 1s ease .2s,transform 1s ease .2s;
-webkit-transition: opacity 1s ease .2s,transform 1s ease .2s;
-moz-transition: opacity 1s ease .2s,transform 1s ease .2s;
-o-transition: opacity 1s ease .2s,transform 1s ease .2s;
} .teamOverlayInfo h2.animateMe, .OurWork h2
.teamOverlayInfo h2.animateMe>span, .OurWork h2.animateMe>span {
opacity: 1;
-webkit-transform: translateY(0%);
-ms-transform: translateY(0%);
transform: translateY(0%);
}
.teamOverlayInfo .slideBottomText {
width: 25%;
margin-top: 2%;
}
.teamOverlayInfo .slideBottomText p:last-of-type
{
padding: 0px;
}
.teamOverlayInfo .slideBottomText .plusicon
{
margin-top: 30px;
}
.slidersWrapper {
width: 100%;
}
.slidersWrapper .col { padding: 0px 4.5%;
position: relative;
}
.slidersWrapper .col:nth-child(1), .slidersWrapper .col:nth-child(3) {
width: 27%;
}
.slidersWrapper .col:nth-child(2) {
width: 46%;
}
.slidersWrapper .col:nth-child(1) {
justify-content: flex-end;
}
.slidersWrapper .col:nth-child(3) {
justify-content: space-between;
}
.sliderHolder {
position: relative;
overflow: hidden;
width: 100%;
background-color: var(--light_gray);
padding-top: 132%;
display: block;
}
.sliderHolder .SlideShow {
position: absolute;
width: 100%;
height: 100%;
top: 0px; left: 0px;
}
.sliderHolder .slick-list
{
height: 100%;
overflow: visible;
}
.SlideShow .slick-slide {
position: relative; width: 100%;
padding-top: 133%;
display: block;
}
.SlideShow .slick-slide>div {
position: absolute;
width: 101%;
height: 101%;
top: -0.5%;
left:  -0.5%;
}
.SlideShow .slick-slide>div .slideblock
{
height: 100%
}
.middleslideshow .slick-arrow{
opacity: 0;
} .ourClients {
background-color: #000;
padding: 8vw 0px;
min-height: 100vh;
}
.ourClients>div.centerBlock { padding: 0px 50px;
width: 65%;
margin: 0 auto;
}
.ourClients .paraText { width: 90%;
margin: 0 auto;
}
.clientLogoSlider {
margin: 5vw auto 0px auto;
width: 100%;
padding-bottom: 80px; overflow: hidden;
}
.clientLogoSlider .slick-track {
align-items: stretch !important;
}
.clientLogoSlider .slick-track .slick-slide>div {
height: 100%
}
.clientLogoSlider.noslider .slick-list
{display: flex;justify-content: center;}
.clientLogoSlider.noslider
{
display: flex;
justify-content: center;
flex-flow: row wrap;
align-items: center;
}
.clientLogoSlider.noslider .logoSlide{width: 25%; display: flex; align-items: center; justify-content: center;}
.page-template-template-home-php .clientLogoSlider .slick-track .slick-slide>div {
height: 50%
}
.logoSlide {
height: 100%;
position: relative;
padding: 20px 15%;
display: flex !important;
}
.logoSlide img { max-width: 220px;
max-height: 80px;
object-fit: contain;
width: 100%;
height: auto;
margin: 0 auto;
position: relative;
z-index: 1;
}
.clientLogoSlider.noslider .logoSlide img
{
width: auto;
height: 100%;
} .OurWork {
min-height: 100vh;
background-color: var(--light_gray);
}
.FullWidthSlider {
width: 100%;
height: 100vh;
overflow: hidden;
}
.FullWidthSlider::before {
content: '';
display: block;
position: absolute;
left: 0px;
top: 0px;
width: 100%;
height: 100%;
z-index: 1;
background-color: rgba(0, 0, 0, 0.4);
}
.FullWidthSlider {
position: absolute !important;
left: 0px;
top: 0px;
width: 100%;
height: 100%;
z-index: 1;
}
.FullWidthSlider.slick-slider .slick-track,
.FullWidthSlider.slick-slider .slick-list,
.FullWidthSlider.slick-slider .slick-list .slick-slide,
.FullWidthSlider.slick-slider .slick-list .slick-slide > div,
.FullWidthSlider.slick-slider .slick-list .slick-slide > div .imgSlide
{
height:  100%;
}
.fullSlideOverlayText { position: relative;
z-index: 2;
min-height: 100vh;
}
.fullSlideOverlayText>div { width: 71%; padding: 5vw 50px;
margin: 0 auto;
}
.fullSlideOverlayText h2 {
margin-bottom: 10vw;
}
.fullSlideOverlayText h2 span:nth-child(2) {
margin-top: -8%;
z-index: -1;
position: relative;
}
.fullSlideOverlayText .paraText
{
max-width: 1160px;
margin: 0 auto;
}
.fullSlideOverlayText .plusicon {
margin: 30px auto 0 calc(50% - 30px);
}
.touch .fullSlideOverlayText .plusicon {
margin: 30px auto 0 auto;
} .home .alm-btn-wrap {
display: none !important;
}
.ourJournals {
padding: 10vw 0px 5vw 0px;
min-height: 100vh;
position: relative;
background-color: #000;
}
.ourJournals::after {
content: '';
display: block;
position: absolute;
bottom: 0px;
left: 0px;
width: 100%;
z-index: 0;
height: 45vh;
max-height: 400px;
min-height: 250px;
background-color: var(--medium_gray);
}
.ourJournals>div.centerBlock { width: 86%;
padding: 0px 20px;
margin: 0 auto;
position: relative;
z-index: 1;
}
.ourJournals .CardListing::before { display: none; margin: 0 auto;
position: absolute;
z-index: 2;
left: 0px;
top: 50%;
transform: translateY(-50%);
font-family: 'didotregular';
color: #000;
text-transform: uppercase; font-size: 18.22vw;
line-height: 15.93vw;
letter-spacing: -0.88vw;
opacity: 1;
transition: opacity 1s ease .2s;
-webkit-transition: opacity 1s ease .2s;
-moz-transition: opacity 1s ease .2s;
-o-transition: opacity 1s ease .2s;
}
.ourJournals .CardListing:hover::before
{
visibility: hidden;
opacity: 0;
}
.journalsWrapper h1 {
text-transform: uppercase;
font-size: 18vw;
line-height: 16vw;
letter-spacing: -0.88vw; }
body:not(.home) .CardListing .alm-layouts
{margin-top: -5vw;}
.CardListing {
width: 100%;
overflow: hidden;
margin: 0 auto;
}
.CardListing .cardBlock, .grid-item {
padding: 0px;
position: relative !important;
left: auto !important;
top: auto !important;
display: inline;
float: left;
width: 20%;  }
.CardListing .cardBlock>div
{
background-image: url(//socratesint.com/wp-content/themes/socrates-custom/images/ajax-loader.svg);
background-position: center center;
background-repeat: no-repeat;
background-size: 35px;
background-color: var(--medium_gray);
}
.CardListing .cardBlock>div .imageHolder,
.CardListing .cardBlock>div .overlay
{
opacity: 0;
transition: opacity .8s ease .1s;
-webkit-transition: opacity .8s ease .1s;
-moz-transition: opacity .8s ease .1s;
-o-transition: opacity .8s ease .1s;
}
.CardListing .cardBlock>div.animateMe .imageHolder,
.CardListing .cardBlock>div.animateMe .overlay
{
opacity: 1;
} .alm-listing:after {
content: '';
display: block;
clear: both;
}
.alm-layouts .alm-listing {
margin: 0;
padding: 0;
font-size: 0px;
min-height: 50vh;
display: block;
height: auto !important;
width: 100% !important;
display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr;
grid-gap: 20px;
grid-auto-flow: dense;
counter-reset: items;
}
.alm-reveal.alm-filters:after {
display: none !important;}
.CardListing .alm-masonry {
width: calc(100% + 20px);
margin: 0 auto 0 -10px;
}
.alm-listing .alm-reveal {
width: auto !important;
display: contents !important;
}
.CardListing .cardBlock.large { grid-row: span 2;
grid-column: span 2;
width: 100%;
}
.CardListing .cardBlock.medium { grid-row: span 1;
grid-column: span 2;
width: 100%;
}
.CardListing .cardBlock.small { grid-row: span 1;
grid-column: span 1;
width: 100%;
}
.home .CardListing .cardBlock img {
filter: grayscale(1);
}
.CardListing .cardBlock>div {
position: relative;
background-color: var(--medium_gray);
width: 100%;
overflow: hidden;
}
.CardListing .cardBlock.large>div {
padding-top: 114%;
}
.CardListing .cardBlock.medium>div {
padding-top: calc(57% - 10px);
}
.CardListing .cardBlock.small>div {
padding-top: 114%;
}
.cardBlock .overlay {
padding: 30px;
position: absolute;
width: 100%;
height: 100%;
z-index: 1;
display: block;
bottom: 0%;
left: 0px;
}
.cardBlock .overlay::after
{
content: '';
display:block;
position: absolute;
bottom: -100%;
background-color: var(--dark_gray);
width: 100%;
height: 100%;
opacity: 0;
left: 0px;
z-index: 0;
-webkit-transition: all .3s cubic-bezier(.16, .84, .44, 1);
-moz-transition: all .3s cubic-bezier(.16, .84, .44, 1);
-o-transition: all .3s cubic-bezier(.16, .84, .44, 1);
transition: all .3s cubic-bezier(.16, .84, .44, 1);
transition-timing-function: cubic-bezier(0.16, 0.84, 0.44, 1);
}
.no-touch .cardBlock:hover .overlay::after, .cardBlock.noimg .overlay::after,
.touch .cardBlock.on .overlay::after {
bottom: 0px;
opacity: 1;
}
.cardBlock.small.noimg .overlay > div, .cardBlock.medium.noimg .overlay > div
{
justify-content: flex-start;
}
.cardTop {
margin-bottom: 20px;
border-bottom: 1px solid #fff;
width: 100%;
font-size: 12px;
letter-spacing: 1.2px;
line-height: 16px;
text-transform: uppercase;
padding-bottom: 5px;
font-family: 'avenirbook';
}
.cardBlock .overlay>div {
overflow: hidden;
align-items: flex-start;
width: 100%;
height: 100%;
position: relative;
z-index: 1;
}
.cardBlock .overlay>div .cardInfo>div {
font-size: 20px;
line-height: 25px;
height: 100%;
overflow: hidden;
}
.cardBlock.large .overlay>div .cardInfo{
max-width: 400px;
}
.cardBlock .overlay>div .cardInfo>div p:last-of-type
{padding: 0px;}
.cardBlock.medium>div .overlay>div .cardInfo {
display: flex;
}
.cardBlock > div .overlay > div .cardInfo
{
transform: translateY(100%);
-webkit-transition: all .5s cubic-bezier(.16, .84, .44, 1);
-moz-transition: all .5s cubic-bezier(.16, .84, .44, 1);
-o-transition: all .5s cubic-bezier(.16, .84, .44, 1);
transition: all .5s cubic-bezier(.16, .84, .44, 1);
transition-timing-function: cubic-bezier(0.16, 0.84, 0.44, 1);
}
.touch .cardBlock .mobArrow
{
display: block;
position: absolute;
top: -35px;
width: 30px;
height: 30px;
padding: 7px;
border-radius: 100%;
background-color: rgba(0, 0, 0, 0.5);
left: 0px;
transform: rotate(0deg);
transition: transform 0.4s ease;
}
.mobArrow img{
margin: 0 auto;
height: 20px;
width: auto;
}
.touch .cardBlock.on .mobArrow
{
transform: rotate(180deg);
top: -5px;
}
.no-touch .mobArrow, .cardBlock.noimg .mobArrow
{
display: none;
}
.cardBlock > div .overlay > div .cardInfo h2
{
margin-bottom: 10px;
line-height: 1;
margin-top: 10px;
}
.cardBlock.on .overlay > div
{
justify-content: flex-start;
}
.cardBlock.on .overlay > div .cardInfo
{padding-top: 30px;}
.cardBlock.medium > div .overlay > div .cardInfo h2{
padding-right: 20px;
}
.no-touch .cardBlock:hover > div .overlay > div .cardInfo, .cardBlock.noimg .overlay > div .cardInfo,
.touch .cardBlock.on > div .overlay > div .cardInfo
{
transform: translateY(0%);
}
.cardBlock.medium>div .overlay>div .cardInfo>div { max-width: 430px;
}
.plusicon.morenews {
margin: 50px auto 20px auto;
width: 150px;
}
.plusicon.morenews>div {
overflow: hidden;
width: 100px;
justify-content: flex-end;
position: relative;
height: 35px;
opacity: 1;
margin-left: 10px;
}
.plusicon.morenews span:nth-child(1) {
transform: translateX(0px);
}
.plusicon.morenews span:nth-child(2) {
transform: translateX(-100px);
-webkit-transition: all .3s cubic-bezier(.16, .84, .44, 1);
-moz-transition: all .3s cubic-bezier(.16, .84, .44, 1);
-o-transition: all .3s cubic-bezier(.16, .84, .44, 1);
transition: all .3s cubic-bezier(.16, .84, .44, 1);
transition-timing-function: cubic-bezier(0.16, 0.84, 0.44, 1);
}
.no-touch .plusicon.morenews:hover span:nth-child(1) {
transform: translateX(100px);
}
.no-touch .plusicon.morenews:hover span:nth-child(2) {
transform: translateX(0px);
}
.no-touch .plusicon.morenews:hover img {
transform: translateX(0px);
}
.plusicon.morenews .imgloader {
display: none
}
.postNotfound {
margin-top: 5vw;
}
.page-template-template-journal-list-php .CardListing {
width: 100%;
position: relative;
}
.page-template-template-journal-list-php .HeroBanner {
position: absolute;
top: 0px;
}
.journalsWrapper {
padding: 260px 50px 120px 50px;
margin: 0 auto;
position: relative;
z-index: 2;
overflow: hidden;
}
.archieveFilter, .journalsWrapper .CardListing { width: 87%;
margin: 0 auto;
z-index: 1;
}
.alm-filters-container .alm-filter.archiveYearInput {
display: none !important;
}
.archieveFilter {
border-bottom: 1px solid #fff;
}
.archieveFilter h6 {
margin: 0px;
font-size: 12px;
line-height: 26px;
letter-spacing: 1.2px;
font-family: 'avenirblack';
text-transform: uppercase;
}
.archieveFilter .years, .alm-filters-container .alm-filter ul
{
width: 90%;
display: block;
white-space: nowrap;
text-align: right;
overflow: auto;
}
.archieveFilter .years
{width: 100%;}
.archieveFilter .years
{display: flex;
flex-direction: row-reverse; justify-content: flex-start;}
.archieveFilter .years label {
padding: 5px 10px;
border: 1px solid transparent;
border-bottom: 0px;
display: inline-block;
cursor: pointer;
margin: 0px 0 0px 20px;
}
.archieveFilter .years label:first-child
{
margin-right: 0px;
}
.archieveFilter .years label.current {
border: 1px solid #fff;
border-bottom: 0px;
pointer-events: none
}
.archieveFilter .years label input {
visibility: hidden;
display: none;
}
.alm-filter--inner::before {
content: 'Tags';
display: inline-block;
font-size: 12px;
line-height: 26px;
letter-spacing: 1.2px;
font-family: 'avenirblack';
text-transform: uppercase;
margin-top: 5px;
} .alm-filters-container .alm-filter li{display: inline-block !important;}
.alm-filters-container .alm-filter li div.alm-filter--link::after,
.alm-filters-container .alm-filter li div.alm-filter--link::before,
.alm-filters-edit {
display: none !important
}
.alm-filters-container .alm-filter--inner {
padding: 0px !important
}
.alm-filters-container {
margin-top: 10px !important;
border-bottom: 1px solid #fff !important;
z-index: 2;
}
.alm-filters-container .alm-filter li div.alm-filter--link {
padding: 10px 10px !important;
color: #fff !important;
text-transform: uppercase;
border: 1px solid transparent;
font-size: 12px !important;
line-height: 16px !important;
letter-spacing: 1.2px !important;
border-bottom: 0px;
}
.alm-filters-container .alm-filter li div.alm-filter--link.active, .no-touch .alm-filters-container .alm-filter li div.alm-filter--link:hover {
font-family: 'avenirblack';
}
.postNotfound {
text-align: center;
padding: 30px;
display: flex;
align-items: center;
justify-content: center;
grid-row: span 4;
grid-column: span 4;
width: 100%;
}
.alm-btn-wrap {
text-align: center;
width: 160px;
margin: 35px auto 30px auto;
display: flex;
align-items: center;
position: relative;
overflow: hidden;
cursor: pointer;
}
.alm-load-more-btn {
width: 160px;
height: 35px;
font-size: 0px;
line-height: 0px;
padding: 0px;
display: flex;
align-items: center;
justify-content: flex-end;
background: transparent;
font-family: 'avenirbook';
text-transform: uppercase;
}
.alm-btn-wrap .alm-load-more-btn.loading {
font-size: 16px;
line-height: 20px;
}
.alm-btn-wrap button.alm-load-more-btn::after, .alm-btn-wrap button.alm-load-more-btn::before {
content: 'More News';
display: inline-block;
text-transform: uppercase;
width: 110px;
font-size: 16px;
line-height: 20px;
padding: 0px;
background: transparent;
font-family: 'avenirbook';
position: absolute;
left: 170px;
-webkit-transition: all .3s cubic-bezier(.16, .84, .44, 1);
-moz-transition: all .3s cubic-bezier(.16, .84, .44, 1);
-o-transition: all .3s cubic-bezier(.16, .84, .44, 1);
transition: all .3s cubic-bezier(.16, .84, .44, 1);
transition-timing-function: cubic-bezier(0.16, 0.84, 0.44, 1);
}
.page-template-template-our-work-php .alm-btn-wrap button.alm-load-more-btn::after,
.page-template-template-our-work-php .alm-btn-wrap button.alm-load-more-btn::before {
content: 'More Work';
}
.alm-btn-wrap button.alm-load-more-btn::before {
left: 50px;
}
.alm-btn-wrap::after {
content: ' ';
display: inline-block;
width: 37px;
height: 37px;
background: url(//socratesint.com/wp-content/themes/socrates-custom/images/plus-icon.svg);
background-position: center;
background-size: 35px;
background-repeat: no-repeat;
background-color: #000;
position: absolute;
left: 0px;
z-index: 0;
}
.no-touch .alm-btn-wrap:hover button.alm-load-more-btn::before {
left: -120px;
}
.no-touch .alm-btn-wrap:hover button.alm-load-more-btn::after {
left: 50px;
}
.alm-btn-wrap .alm-load-more-btn.loading::after, .alm-btn-wrap .alm-load-more-btn.loading::before,
.alm-btn-wrap .alm-load-more-btn.loading>::after {
display: none;
}
.alm-load-more-btn.done {
display: none
}
.page-template-template-journal-list-php .footerlogo,
.page-template-template-careers-php .footerlogo,
.page-template-template-our-team-php .footerlogo {
display: none;
}
.journalsWrapper::after {
content: '';
display: block;
position: absolute;
z-index: 0;
width: 100%;
height: 100%;
top: 120vh;
left: 0px;
background-color: #000;
}
.TextOnBG {
color: #fff;
position: relative;
text-align: center;
min-height: 65vh; }
.TextOnBG .imageHolder {
z-index: -1;
}
.TextOnBG .centerBlock {
padding: 8vw 50px 2vw 50px;
width: 66%;
margin: 0 auto;
z-index: 1;
}
.TextOnBG::before {
content: ' ';
display: block;
position: absolute;
top: -50px;
left: 50%;
transform: translateX(-50%);
width: 75px;
height: 100px;
z-index: 3;
background: url(//socratesint.com/wp-content/themes/socrates-custom/images/logo-white-icon.svg);
background-repeat: no-repeat;
background-size: cover;
}
.TextOnBG .arrowicon {
margin: 60px auto 30px auto;
display: flex;
justify-content: center;
}
.touch .TextOnBG .arrowicon
{
justify-content: flex-start;
}
.touch .TextOnBG .arrowicon span{
transform: translateX(0%);
text-align: right;
}
.touch .TextOnBG .arrowicon img{
transform: translateX(0%);
} .page-template-template-careers-php .pageIntro {
background-color: var(--dark_gray);
padding: 8vw 50px 10vw 50px
}
.page-template-template-careers-php .pageIntro>div {
color: #fff;
width: 75%;
}
.page-template-template-careers-php .pageIntro .paraText
{width: 83%;  margin: 0 auto;
}
.page-template-template-careers-php .pageIntro .paraText p{
font-size: 20px;
line-height: 26px;
font-family: 'avenirlight';}
.page-template-template-careers-php .pageIntro .paraText h3
{
font-size: 2.70vw ;
line-height: 3.125VW ;
margin-bottom: 20px;
}
.JobList {
max-width: 1360px;
margin: 8vw auto 0 auto;
border-top: 1px solid #fff;
}
.JobList .jobRow {
padding: 30px 0px;
border-bottom: 1px solid #fff;
align-items: center;
}
.JobList .jobRole {
width: 50%;
font-family: 'didotitalic';
padding-right: 30px
}
.JobList .jobRoleInfo {
width: 50%;
padding-right: 20px;
position: relative;
}
.JobList .jobRoleInfo p:last-of-type {
padding: 0px;
}
.jobRow .iconMove {
width: 80px;
overflow: hidden;
display: flex;
align-items: center;
justify-content: flex-end;
position: relative;
}
.touch .jobRow .iconMove {
width: 100px;
} .page-template-default footer .footerlogo img, .error404 footer .footerlogo img {
filter: invert(1);
}
.PageContent {
padding: 220px 0px 4vw 0px;
}
.PageContent .topText {  width: 77%;
padding: 0px 50px 0px 50px;
margin: 0 auto 0px auto;
}
.PageContent .topText>div {
width: 100%; margin-bottom: 30px;
}
.PageContent hr{
max-width: 72%;margin: 0 auto 30px auto;
}
.PageContent .topText > div .entry
{ margin: 0 auto;}
.entry a{
word-wrap: break-word;
}
.PageContent .topText h1 {
font-size: 30px;
line-height: 37px;
letter-spacing: -0.75px;
font-family: 'avenirblack';
}
.PageContent .col_1_1 { width: 77%;
padding: 0px 35px 0px 35px;
margin: 0 auto;
}
.PageContent .col_1_1 .col {
padding: 15px;
width: 50%;
}
.PageContent .col_1_1 .col h6 {
font-size: 20px;
line-height: 28px;
letter-spacing: -0.5px;
font-family: 'avenirblack';
} .HeroquoteBanner {
background-color: var(--light_gray);
z-index: 1
}
.HeroquoteBanner::before {
content: '';
display: block;
position: absolute;
z-index: 0;
background-color: var(--medium_gray);
width: 100%;
height: 100vh;
top: 0px;
left: 0px;
}
.HeroquoteBanner .quoteText {
z-index: 2;
position: relative;
margin: 0 auto;
width: 61%; min-height: 100vh;
text-align: center;
padding: 150px 50px 100px 50px;
}
.HeroquoteBanner .quoteText  blockquote {
margin: 0;
padding: 0px;
position: relative;
font-size: 4.68vw;
line-height: 4.94vw; font-family: 'didotregular';
}
.HeroquoteBanner .imagePlace {
position: relative;
z-index: 1;
margin: -47vh auto 0 auto;
max-width: 1360px;
padding-top: 43%
}
.HeroquoteBanner .imagePlace::before {
content: '';
display: block;
position: absolute;
z-index: 1;
background-color: rgba(0, 0, 0, 0.3);
width: 100%;
height: 100%;
top: 0;
left: 0;
}
.ESGWrapper {
z-index: 1;
}
.ESGWrapper>div>div {
max-width: 1100px;
width: 100%;
margin: 0 auto;
padding: 30px 50px;
display: flex;
}
.ESGWrapper>div>div>div {
max-width: 300px;
width: 100%;
position: relative;
}
.ESGWrapper .row2>div {
justify-content: flex-end;
}
.ESGWrapper .row1 {
background-color: var(--dark_gray);
position: relative;
}
.ESGWrapper .row2 {
background-color: var(--medium_gray);
position: relative;
z-index: 2;
}
.ESGWrapper .row3 {
background-color: var(--light_gray);
position: relative;
z-index: 3;
}
.ESGWrapper div>div>div .capLetter { font-size: 23.43vw;
line-height: 15.10vw;
letter-spacing: -1.17vw;
font-family: 'didotregular';
color: #000;
z-index: 1;
display: block;
position: absolute;
right: -25%;
bottom: -30px;
padding-top: 30%;
overflow: hidden;
}
.ESGWrapper div>div>div .capLetter span{
margin-bottom: -100%;
display: block;
opacity: 0;
transition: all .8s ease-out;
-webkit-transition: all .8s ease-out;
-moz-transition: all .8s ease-out;
-o-transition: all .8s ease-out;
}
.ESGWrapper div>div>div.animateMe .capLetter span{
margin-bottom: -10%;
opacity: 1;
}
.ESGWrapper div.row1>div>div.animateMe .capLetter span {
margin-bottom: -5%;
}
.ESGWrapper div>div>div * {
position: relative;
z-index: 2;
opacity: 0;
transform: translateY(20px);
transition: all .8s ease .2s;
-webkit-transition: all .8s ease .2s;
-moz-transition: all .8s ease .2s;
-o-transition: all .8s ease .2s; }
.ESGWrapper div>div>div.animateMe *
{
opacity: 1;
transform: translateY(0px);
}
.ESGWrapper div>div>div p:last-of-type {
padding: 0px;
}
.ESGWrapper .row2>div>div .capLetter {
left: -40%;
right: auto;
}
.ESGWrapper h2 {
font-family: 'didotitalic';
margin-bottom: 10px
}
.page-template-template-responsibility-php .TextOnBG {
min-height: 100vh;
}
.page-template-template-responsibility-php .TextOnBG::before {
top: auto;
bottom: -140px;
width: 200px;
height: 270px;
z-index: 1;
}
.page-template-template-responsibility-php .TextOnBG .textBlock { width: 67%;
margin: 0 auto;
padding: 50px 50px 8vw 50px;
}
.TextOnBG .textBlock h2 { width: 90%;
margin: 0 auto 50px auto;
}
.TextOnBG .textBlock .paraText {
font-size: 30px;
line-height: 34px;
font-family: 'avenirlight';
}
.TextOnBG .textBlock .paraText p {
padding-bottom: 25px;
}
.TextOnBG .textBlock .paraText p:last-of-type {
padding-bottom: 0px;
}
.TextOnBG + .titleTextSlider .topRowText {
padding: 15vw 0px 9vw 0px;
}
.topRowText {
background-color: var(--medium_gray);
padding: 9vw 0px 9vw 0px;
}
.topRowText>div {
max-width: 1160px;
width: 100%;
padding: 0px 50px;
margin: 0 auto;
}
.blockSlider {
max-width: 1680px;
width: 100%;
padding: 0px 50px;
margin: -70px auto 0 auto;
}
.editionSlider {
max-width: 1680px;
width: 100%;
padding: 0px 50px 50px 50px;
margin: 0px auto 0 auto;
}
.blockSlider>div.sliderBlock {
width: 33.33%;
}
.editionSlider>div.sliderBlock {
width: 50%;
}
.blockSlider {
padding-bottom: 50px;
margin-bottom: 8vw;
}
.titleTextSlider+.titleTextSlider .blockSlider {
margin-bottom: 0px;
}
.blockSlider .sliderBlock, .editionSlider .sliderBlock {
padding: 7px;
}
.blockSlider .sliderBlock>div, .editionSlider .sliderBlock>div{
position: relative;
overflow: hidden;
}
.blockSlider .sliderBlock>div>div.imageBlock{
position: relative;
padding-top: 70%;
}
.editionSlider .sliderBlock>div>div.imageBlock{
position: relative;
padding-top: 56%;
}
.no-touch .mobinfo
{display: none
}
.touch .mobinfo
{
position: absolute;
left: 0px;
z-index: 3;
top: 0px;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.4);
color: #fff;
font-size: 16px;
line-height: 22px;
text-transform:uppercase;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
}
.mobinfo span
{
display: flex;
align-items: center;
justify-content: center;
}
.mobinfo span .imgloader
{
display: none;
}
.mobinfo span img{margin-left: 5px;}
.blockSlider .sliderBlock .sliderInfo, .editionSlider .sliderBlock .sliderInfo {
background-color: #000;
padding: 50px 70px;
position: absolute;
z-index: 1;
width: 100%;
height: 100%;
bottom: -100%;
-webkit-transition: bottom .6s cubic-bezier(.16, .84, .44, 1);
-moz-transition: bottom .6s cubic-bezier(.16, .84, .44, 1);
-o-transition: bottom .6s cubic-bezier(.16, .84, .44, 1);
transition: bottom .6s cubic-bezier(.16, .84, .44, 1);
transition-timing-function: cubic-bezier(0.16, 0.84, 0.44, 1);
}
.blockSlider .sliderBlock .sliderInfo > div, .editionSlider .sliderBlock .sliderInfo > div{
height: 100%;
}
.no-touch .blockSlider .sliderBlock:hover .sliderInfo, .no-touch .editionSlider .sliderBlock:hover .sliderInfo,
.touch .blockSlider .sliderBlock.on .sliderInfo, .touch .editionSlider .sliderBlock.on .sliderInfo {
bottom: 0px;
}
.touch .blockSlider .sliderBlock.on .mobinfo,
.touch .editionSlider .sliderBlock.on .mobinfo {
opacity: 0;
visibility: hidden;
}
.removeMobinfo
{
display: none;
}
.touch .removeMobinfo
{
display: inline-block;
position: absolute;
left: 20px;
bottom: 20px;
font-size: 14px;
line-height: 16px;
text-transform: uppercase;
font-family: 'avenirblack';
}
.sliderInfo .cardInfo>div {
display: flex;
flex-direction: column;
align-items: flex-end;
}
.sliderInfo .cardInfo>div p{
width: 100%;
display: block;
}
.textLink .imgloader {
display: none;
}
.sliderInfo .cardInfo .iconMove {
width: 110px;
position: absolute;
bottom: 20px;
}
.blockSlider .sliderBlock .sliderInfo .textLink,
.editionSlider .sliderBlock .sliderInfo .textLink
{
position: absolute;
bottom: 20px;
}
.touch .sliderInfo .cardInfo .iconMove {
width: 170px;
}
.touch .iconMove:hover img, .touch .iconMove img {
transform: translateX(0%);
}
.touch .iconMove:hover span, .touch .iconMove span {
transform: translateX(-50px);
}
.page-template-template-responsibility .ourClients {
background-color: transparent
}
.page-template-template-responsibility footer {
background-color: #000;
} .MapWrapper {
width: 100%;
min-height: 62vh;
overflow: hidden;
background-color: var(--medium_gray);
position: relative;
}
.MapWrapper iframe
{
width: 100%;
height: 110%;
position: absolute;
top: 0px;
left: 0px;
}
.page-template-template-contact-php .footerlogo {
display: none
}
.page-template-template-contact-php .marquee h2 {
font-size: 6.25VW ;
line-height: 6.87vw ;
letter-spacing: -0.32vw ;
margin: 0px;
}
.page-template-template-contact-php .marquee {
margin: -3% auto 0 auto;
}
.page-template-template-contact-php .marquee h2 span
{ }
.page-template-template-contact-php .marquee h2 span:nth-child(odd) {
color: var(--dark_gray);
} .page-template-template-our-work-php .pageIntro
{background-color: #000; color: #fff; min-height: auto;}
.page-template-template-our-work-php .pageIntro>div{color: #fff}
.page-template-template-our-works-php #page-wrap
{
overflow: hidden;
}
.WorkListing
{width: 86%;   margin: 0 auto;}
.WorkListing .alm-layouts .alm-listing
{
padding: 0px;
margin: 0 auto;
display: grid;
grid-template-columns: 1fr 1fr;
grid-gap: 20px;
grid-auto-flow: dense;
counter-reset: items;
}
.WorkListing .WorkBlock
{
z-index: 1;
}
.iconMove .imgloader
{
display: none !important;
}
.WorkListing .WorkBlock
{
background-image: url(//socratesint.com/wp-content/themes/socrates-custom/images/ajax-loader.svg);
background-position: center center;
background-repeat: no-repeat;
background-size: 35px;
background-color: var(--medium_gray);
}
.WorkListing .WorkBlock.quote {
grid-row: span 1;
grid-column: span 2;
width: calc(114% + 38px);
margin-left: calc(-7% - 19px);
margin-top: -8vw;
position: relative;
z-index: -1;
}
.WorkListing .WorkBlock.quote + .WorkBlock.largeLandscape,
.WorkListing .WorkBlock.quote + .WorkBlock.mediumPortrait,
.WorkListing .WorkBlock.quote + .WorkBlock.smallLandscape,
.WorkListing .WorkBlock.quote + .WorkBlock.smallLandscape + .WorkBlock.smallLandscape,
.WorkListing .WorkBlock.quote + .WorkBlock.mediumPortrait + .WorkBlock.smallLandscape,
.WorkListing .WorkBlock.quote + .WorkBlock.smallLandscape + .WorkBlock.mediumPortrait
{
margin-top: -8vw;
}
.WorkListing .WorkBlock.largeLandscape { grid-row: span 1;
grid-column: span 2;
width: 100%;
}
.WorkListing .WorkBlock.mediumPortrait { grid-row: span 2;
grid-column: span 1;
width: 100%;
}
.WorkListing .WorkBlock.smallLandscape { grid-row: span 1;
grid-column: span 1;
width: 100%;
}
.WorkListing .WorkBlock>div {
position: relative;
background-color: var(--light_gray);
width: 100%;
overflow: hidden;
}
.WorkListing .WorkBlock>div > a{
display: block;
position: absolute;
left: 0px;
top:0px;
width: 100%;
height: 100%;
}
.WorkListing .WorkBlock.quote>div > a
{position: relative;} .WorkListing .WorkBlock.largeLandscape>div {
padding-top: 56%;
}
.WorkListing .WorkBlock.mediumPortrait>div {
padding-top: 114%;
}
.WorkListing .WorkBlock.smallLandscape>div {
padding-top: calc(57% - 10px);
}
.WorkBlock .imageHolder .workHoverImg
{
position: absolute;
z-index: 2;
top: 0px;
left: 0px;
visibility: hidden;
opacity: 0;
-webkit-transition: all .5s ease-in-out;
transition: all .5s ease-in-out;
-o-transition: all .5s ease-in-out;
transition: all .5s ease-in-out;
transition: all .5s ease-in-out; }
.WorkBlock:hover .imageHolder .workHoverImg{
opacity: 1;
visibility: visible;
} .WorkBlock:hover .imageHolder .workdefaultImg{
animation: blureEffect 0.6s forwards ease-out;
opacity: 0;
}
.projectSlider.ratioSlider .WorkBlock:hover .imageHolder img.workdefaultImg.lazyloaded,
.projectSlider.equalSlider .WorkBlock:hover .imageHolder img.workdefaultImg.lazyloaded{
animation: blureEffect 0.1s forwards ease-out;
opacity: 0;
}
.WorkBlock .overlay {
padding: 30px;
position: absolute;
width: 100%;
height: 100%;
z-index: 2;
display: block;
bottom: 0%;
left: 0px;
background-color: rgba(0, 0, 0, 0.3);
}
.WorkBlock.quote .overlay{
padding: 50px;
position: relative;
}
.ratingWrap
{width: 100%;
position: absolute;
top:0px;
right: 0px;
z-index: 2;
justify-content: flex-end;}
.ratingWrap span{
width: 41px;
height: 53px;
margin: 0px 4px;
display: inline-block;
background: url(//socratesint.com/wp-content/themes/socrates-custom/images/star.svg);
background-repeat: no-repeat;
background-size: contain;
background-position: center;
}
.workNameType { width: 100%;
font-size: 12px;
letter-spacing: 1.2px;
line-height: 16px;
text-transform: uppercase;
padding-bottom: 5px;
font-family: 'avenirbook';
align-items: center;
}
.workNameType b{
font-size: 20px;
line-height: 26px;
letter-spacing: 0px;
padding-bottom: 5px;
text-transform: none
}
.workNameType > div{
border-top: 1px solid #fff;
padding-top: 10px;
width: 100%;
text-align: right;
}
.WorkBlock .overlay>div {
overflow: hidden;
display: flex;
flex-direction: column;
align-items: flex-start;
justify-content: flex-end;
width: 100%;
height: 100%;
position: relative;
z-index: 1;
}
.WorkBlock.quote .overlay>div
{
align-items: center;
justify-content: center;
min-height: 50vw;
}
.WorkBlock.quote .overlay>div h2
{
width: calc(100% - 140px);
max-width: 1040px;
margin: 0 auto;
text-align: center;
}
.WorkBlock .overlay > div .workInfo > .iconMove {
max-width: 130px;
width: 100%;
margin-left: 0px;
overflow: hidden;
position: relative;
}
.touch .WorkBlock .overlay>div .workInfo > .iconMove {
max-width: 170px;
}
.touch .iconMove span, .touch .WorkBlock:hover .iconMove span {
transform: translateX(-50px);
}
.touch .iconMove.instaIcon span{
transform: translateX(-100px);
}
.touch .WorkBlock:hover .iconMove img,
.touch .iconMove img {
transform: translateX(0%);
}
.WorkBlock >div .overlay>div .workInfo {
display: flex;
align-items: flex-end;
justify-content: space-between;
width: 100%;
}
.WorkBlock >div .overlay>div .workInfo h2
{ margin: 0;
padding: 0;
font-size: 32px;
line-height: 38px;
font-family: 'avenirbook';
width: calc(100% - 140px);
max-width: 525px;
}
.WorkBlock.mediumPortrait >div .overlay>div .workInfo h2
{
max-width: 400px;
}
.WorkBlock.largeLandscape  >div .overlay>div .workInfo h2
{
max-width: 790px;
}
.WorkBlock.smallLandscape>div .overlay>div .workInfo>div {
padding-left: 20px;
}
.no-touch .WorkBlock:hover .iconMove span {
transform: translateX(0px);
}
.no-touch .WorkBlock:hover .iconMove img {
transform: translateX(100%);
} .imageGridWrapper { width: 90%;
padding: 0px 42px 0px 42px;
margin: -8vw auto 0 auto;
position: relative;
z-index: 1;
}
.imageGridWrapper .imageHolder img, .cardBlock .imageHolder img{
-webkit-transform: scale(1.1);
-ms-transform: scale(1.1);
transform: scale(1.1);
opacity: 0;
-webkit-transition: all 1s ease-in-out;
transition: all 1s ease-in-out;
-o-transition: all 1s ease-in-out;
transition: all 1s ease-in-out;
transition: all 1s ease-in-out, -webkit-transform 1s ease-in-out;
}
.WorkBlock .imageHolder img.workdefaultImg{
-webkit-transform: scale(1.1);
-ms-transform: scale(1.1);
transform: scale(1.1);
opacity: 0;
-webkit-transition: all 1s ease-in-out;
transition: all 1s ease-in-out;
-o-transition: all 1s ease-in-out;
transition: all 1s ease-in-out;
transition: all 1s ease-in-out, -webkit-transform 1s ease-in-out;
}
.imageGridWrapper .animateMe .imageHolder img, .cardBlock .animateMe .imageHolder img,
.WorkBlock .animateMe .imageHolder img.workdefaultImg{
opacity: 1;
-webkit-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
}
.WorkBlock .animateMe .imageHolder img.workdefaultImg,
.cardBlock .animateMe .imageHolder img
{
opacity: 1;
}
.imageGridWrapper > div:last-child:not(.textQuoteRow )
{
padding-bottom: 8vw;
}
.Landscape_image
{padding: 7px;}
.Landscape_image > div
{
position: relative;
padding-top: 56%;overflow: hidden;
}
.Landscape_video
{padding: 7px;}
.Landscape_video > div
{
position: relative;
padding-top: 56%;overflow: hidden;
}
.Landscape_video > div img{
width: 100%;
height: 100%;
object-fit: cover;
position: absolute;
left: 0;
top: 0;
z-index: 0;
}
.Landscape_video > div iframe {
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
z-index: 1;
}
.Three_images_1M_2S
{
width: 100%;
}
.Three_images_1M_2S > div{
padding: 7px;
}
.Three_images_1M_2S > div.M1{
width: 50%;  position: relative;
}
.Three_images_1M_2S > div.S1, .Three_images_1M_2S > div.S2{
width: 25%;  position: relative;
}
.Three_images_1M_2S > div.M1 > div{
position: relative; padding-top: 56%; overflow: hidden;
}
.Three_images_1M_2S > div.S1 > div, .Three_images_1M_2S > div.S2 > div{
position: relative; padding-top: calc(112% + 8px); overflow: hidden;
}
.imageTextRow
{width: 100%;}
.imageTextRow .imageBlock, .imageTextRow .textBlock
{
padding: 7px;
position: relative;
width: 50%;
} .imageTextRow .textBlock p:last-of-type,
.Three_images_2S_M_text .textBlock  p:last-of-type{
padding: 0px;
}
.imageTextRow .textBlock > div, .Three_images_2S_M_text .textBlock > div{
padding: 15% 20%;
position: relative;
width: 100%;
}
.imageTextRow .textBlock > div .capLetter,
.Three_images_2S_M_text .textBlock > div .capLetter
{
font-size: 18.22vw;
line-height: 14vw;
letter-spacing: -0.88vw;
color: var(--dark_gray);
display: inline;
font-family: 'didotregular';
position: absolute;
z-index: -1;
top: -7%;
left: 7%;
} .letterStrings p:first-of-type::first-letter
{
font-size: 0px;
}
.letterStrings.secondSpace p:first-of-type::first-letter
{margin-left: -5px;}
.imageTextRow .imageBlock > div{
position: relative; padding-top: 115%; overflow: hidden;
}
.textQuoteRow
{padding: 8vw 50px; width: 100%;}
.textQuoteRow > div{ width: 65%; margin: 0 auto; text-align: center;}
.Two_images_L{
width: 100%;
}
.Two_images_L > div{
padding: 7px;
width: 50%;
}
.Two_images_L > div > div{
position: relative; padding-top: 115%; overflow: hidden;
}
.Three_images_1L_2M > div{
position: relative;
padding: 7px;
}
.Three_images_1L_2M > div > div{
position: relative;
overflow: hidden;
}
.Three_images_1L_2M > div
{
width: 50%;
padding: 7px;
}
.Three_images_1L_2M .rightCol > div
{
width: 100%;
}
.Three_images_1L_2M .rightCol
{padding: 0px;}
.Three_images_1L_2M .rightCol > div{
padding: 7px;
}
.Three_images_1L_2M .leftCol > div
{
padding-top: 116%;
position: relative;
overflow: hidden;
}
.Three_images_1L_2M .rightCol > div > div
{
padding-top: calc(58% - 7px);
overflow: hidden;
position: relative;
}
.Four_images_L_M_2S .leftCol, .Three_images_2S_M_text .textBlock
{padding: 7px;
width: 50%;}
.Four_images_L_M_2S .leftCol > div
{  padding-top: 116%;
position: relative;
overflow: hidden;}
.Four_images_L_M_2S .rightCol, .Three_images_2S_M_text .leftCol
{width: 50%;}
.Four_images_L_M_2S .rightCol > div, .Three_images_2S_M_text .leftCol > div
{
padding: 7px;
width: 100%;
}
.Four_images_L_M_2S .rightCol div.M1 > div, .Three_images_2S_M_text .leftCol > div.M1 > div{
padding-top: calc(58% - 7px);
position: relative;
overflow: hidden;
}
.Four_images_L_M_2S .rightCol div.S1, .Four_images_L_M_2S .rightCol div.S2,
.Three_images_2S_M_text .leftCol > div.S1, .Three_images_2S_M_text .leftCol > div.S2
{width: 50%;}
.Four_images_L_M_2S .rightCol div.S1 > div, .Four_images_L_M_2S .rightCol div.S2 > div,
.Three_images_2S_M_text .leftCol > div.S1 > div, .Three_images_2S_M_text .leftCol > div.S2 > div{
padding-top: calc(118% - 7px);
position: relative;
overflow: hidden;
}
.otherProjects
{
padding: 8vw 0px 0px 0px;
background-color: var(--dark_gray);
}
.otherProjects h4
{
margin-bottom: 8vw;
}
.otherProjects .centerBlock
{width: calc(90% - 50px); margin: 0 auto; position: relative; z-index: 1;}
.otherProjects::after
{
content: '';
display: block;
position: absolute;
z-index: 0;
background-color: #000;
bottom: 0px;
left: 0px;
width: 100%;
height:11vw;
}
.projectSlider > .WorkBlock{width: 50%;}
.projectSlider .WorkBlock{
padding: 7px;
position: relative;
}
.projectSlider .WorkBlock>div {
position: relative;
background-color: var(--light_gray);
width: 100%;
overflow: hidden;
padding-top: 56%;
}
.projectSlider
{
padding-bottom: 70px;
margin-bottom: 50px;
}
.projectSlider.equalSlider .WorkBlock .imageHolder img{
object-fit: contain;
}
.projectSlider.ratioSlider .WorkBlock .imageHolder
{ height: 100%;}
.projectSlider.ratioSlider .WorkBlock .imageHolder img{
transform: scale(1); }
.projectSlider.ratioSlider .WorkBlock .imageHolder img.workdefaultImg.lazyloaded,
.projectSlider.equalSlider .WorkBlock .imageHolder img.workdefaultImg.lazyloaded
{
opacity: 1;
}
.projectSlider.ratioSlider .WorkBlock.large
{
width: calc(690px + 15px) !important;
}
.projectSlider.ratioSlider .WorkBlock.medium{
width: calc(400px + 15px) !important;
}
.projectSlider.ratioSlider .WorkBlock.small{
width: calc(690px + 15px) !important;
}
.projectSlider.ratioSlider .WorkBlock.large > div
{
padding-top: 66.2%;
}
.projectSlider.ratioSlider .WorkBlock.medium > div{
padding-top: 114%;
}
.projectSlider.ratioSlider .WorkBlock.small > div{
padding-top: 66.2%;
}
.projectSlider.ratioSlider .WorkBlock>div {
height: 100%;
}
.projectSlider.ratioSlider .WorkBlock >div .overlay>div .workInfo {
display: flex;
align-items: center;
justify-content: flex-end;
flex-flow: row wrap;
}
.projectSlider.ratioSlider .WorkBlock >div .overlay>div .workInfo h2
{
max-width: 100%;
width: 100%;
}
@media screen and (min-width: 0px) and (max-width: 1023px) { .projectSlider.ratioSlider .WorkBlock.large
{
width: calc(70vw + 15px) !important;
}
.projectSlider.ratioSlider .WorkBlock.medium{
width: calc(35vw + 15px) !important;
}
.projectSlider.ratioSlider .WorkBlock.small{
width: calc(70vw + 15px) !important;
}
.projectSlider.ratioSlider .WorkBlock.large > div
{
padding-top: 57.2%;
}
.projectSlider.ratioSlider .WorkBlock.medium > div{
padding-top: 114%;
}
.projectSlider.ratioSlider .WorkBlock.small > div{
padding-top: 57.2%;
}
}
@media screen and (min-width: 0px) and (max-width: 767px) {
.projectSlider.ratioSlider .WorkBlock >div .overlay>div .workInfo h2
{
font-size: 20px;
line-height: 23px;
}
.projectSlider.ratioSlider .WorkBlock >div .workNameType {
padding-bottom: 5px;
}
.projectSlider.ratioSlider .WorkBlock.large
{
width: calc(90vw + 15px) !important;
}
.projectSlider.ratioSlider .WorkBlock.medium{
width: calc(45vw + 15px) !important;
}
.projectSlider.ratioSlider .WorkBlock.small{
width: calc(90vw + 15px) !important;
}
.projectSlider.ratioSlider .WorkBlock.large > div
{
padding-top: 57.2%;
}
.projectSlider.ratioSlider .WorkBlock.medium > div{
padding-top: 114%;
}
.projectSlider.ratioSlider .WorkBlock.small > div{
padding-top: 57.2%;
}
}
@media screen and (min-width: 0px) and (max-width: 550px) {
.projectSlider.ratioSlider .WorkBlock.large
{
width: calc(90vw + 15px) !important;
}
.projectSlider.ratioSlider .WorkBlock.medium{
width: calc(60vw + 15px) !important;
}
.projectSlider.ratioSlider .WorkBlock.small{
width: calc(90vw + 15px) !important;
}
.projectSlider.ratioSlider .WorkBlock.large > div
{
padding-top: 76.2%;
}
.projectSlider.ratioSlider .WorkBlock.medium > div{
padding-top: 114%;
}
.projectSlider.ratioSlider .WorkBlock.small > div{
padding-top: 76.2%;
}
}
.BackBtn
{
position: fixed !important;
left: 120px;
top: 33px;
z-index: 12;
font-size: 0;
width: 120px !important;
height: 40px;
opacity: 0;
}
.loaded .BackBtn {
animation: showheader 0.6s forwards linear;
animation-delay: 1s;
}
.menuOpen .BackBtn
{
display: none;
}
.BackBtn img{
width: 45px !important;
height: 30px !important;
} .TeamsliderWrappper
{
background-color: var(--dark_gray);
min-height: 100vh;
padding: 8vw 0;
}
.TeamsliderWrappper h4{
padding: 0px 50px;
}
.teamOverlayInfo h2
{
overflow: visible;
}
.TeamsliderWrappper .teamOverlayInfo
{
position: absolute; max-width: 80vw;
display: flex;
align-items: center;
width: 75vw;
height: 100%;
z-index: 5;
top: 45%;
left:45vw;
transform: translate(-35vw , -50%);
}
.TeamsliderWrappper .teamOverlayInfo h2>span:nth-child(2)
{
padding-left: 30%;
width: 100%;
}
.TeamsliderWrappper .teamOverlayInfo h2>span {
overflow: hidden;
display: inline-block;
text-align: left !important;
}
.fixedCursor
{
width: 175px; height: 105px; display: block; background: url(//socratesint.com/wp-content/themes/socrates-custom/images/dragger-curser-new.svg); background-repeat: no-repeat;
background-size: contain;position: absolute;left: 50%;top: 45%; transform: translate(-50%, -50%); z-index: 7;
opacity: 1;
visibility: visible;
-webkit-transition: all .5s ease-in-out;
transition: all .5s ease-in-out;
-o-transition: all .5s ease-in-out;
transition: all .5s ease-in-out;
transition: all .5s ease-in-out;
}
.TeamsliderWrappper:hover .fixedCursor{
opacity: 0;
visibility: hidden;
}
.swiper {
margin-top: 5vw;
width: 100%;
height: 97vh;
min-height: 865px;  }
.swiper-wrapper
{
display: grid !important; grid-gap: 15px;
grid-auto-flow: column;
counter-reset: items;
}
.swiper-slide{ width: 100% !important;
padding: 0px;
position: relative; -webkit-backface-visibility: hidden;
-webkit-transform: translate3d(0, 0, 0) !important;
cursor: none;
grid-row: span 2;
grid-column: span 1;
}
.swiper-slide.bigSize{ width: 100% !important;
height: 100% !important;
grid-row: span 4;
grid-column: span 3;
width: 100%;
}
.bigSize .teamBlock .teamInfo > div
{
z-index: 1;
position: relative;
}
.swiper-slide.bigSize .teamInfo::after
{
content: '';
display: block;
position: absolute;z-index: 0;
width: 100%;
height: 100%;
left: 0px;
top: 0px;
background: rgb(255,255,255);
background: linear-gradient(207deg, rgba(255,255,255,0) 45%, rgba(0,0,0,1) 100%);
}
.swiper-slide.mediumSize{ width: 100% !important; grid-row: span 2;
grid-column: span 2; }
.teamBlock{
position: absolute;
width: 100%;
height: 100%;
top: 0px;
left: 0px;
cursor: pointer;
}
.teamBlock .imageHolder
{
overflow: hidden;
background-color: #4d4d4d;
}
.teamBlock img{ }
.swiper-slide.bigSize img{
object-position: center right;
}
.teamBlock img, .jarallax img
{
opacity: 0;
-webkit-transition: opacity .5s ease-in-out;
transition: opacity .5s ease-in-out;
-o-transition: opacity .5s ease-in-out;
transition: opacity .5s ease-in-out;
transition: opacity .5s ease-in-out;
}
.teamBlock img.lazyloaded, .jarallax img.lazyloaded
{
opacity: 1;
}
.teamBlock .imageHolder .hoverTeamImg
{
position: absolute;
z-index: 2;
top: 0px;
left: 0px; opacity: 0;
transition: 0.3s all ease-out
}
.teamBlock:hover .imageHolder .hoverTeamImg{ animation: apearEffect 0.3s forwards ease-in;
} .teamBlock:hover .imageHolder .teamImg{
animation: blureEffect 0.3s forwards ease-in;
}
@keyframes apearEffect {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
@keyframes blureEffect {
0% {
filter: blur(0);
}
50%{
filter: blur(1px);
}
100% {
filter: blur(0);
}
}
.teamBlock.onlyInfo
{
pointer-events: none;
}
.teamBlock .plusicon
{width: 50px;
position: absolute;
display: flex;
right: 15px;
bottom: 15px;
z-index: 4;}
.teamBlock .plusicon span
{
text-align: right;
}
.teamBlock .plusicon svg, .teamBlock.on .plusicon svg
{transform: translateX(10px);}
.teamBlock.on .plusicon *
{
transition: none;
}
.teamBlock.on .plusicon span
{
transform: translateX(100%);
}
.teamBlock.on .plusicon svg .hideline
{
display: none;
}
.touch .teamBlock .plusicon
{width: 50px;}
.teamInfo
{
position: absolute;
left: 0px;
top: 0px;
width: 100%;
height: 100%;
line-height: 24px;
z-index: 3;
background-color: var(--medium_gray);
color: #fff;
padding: 20px 30px 30px 30px;
text-align: left;
overflow: hidden; opacity: 0;
transition: opacity 0.4s ease .1s;
-webkit-transition: opacity 0.4s ease .1s;
-moz-transition: opacity 0.4s ease .1s;
-o-transition: opacity 0.4s ease .1s; }
.teamBlock.on .teamInfo, .teamBlock.noimg .teamInfo, .teamBlock.onlyInfo  .teamInfo, .bigSize .teamBlock .teamInfo
{
opacity: 1; }
.teamBlock.onlyInfo .teamInfo, .bigSize .teamBlock .teamInfo
{
background-color: transparent;
}
.teamInfo h2
{color: #000; margin-bottom: 5px;
border-bottom: 1px solid #000;}
.teamInfo h6
{font-size: 14px;
line-height: 20px;
margin-bottom: 10px;
font-family: 'avenirbook';
color: #000;
text-transform: uppercase;}
.teamBlock.onlyInfo .teamInfo > div h2, .bigSize .teamBlock .teamInfo > div h2
{
color: #fff;
border: 0px;
margin: 0px;
padding: 0px;
}
.teamInfo p:last-of-type
{
padding: 0px;
}
.teamBlock.onlyInfo.bottomText .teamInfo, .bigSize .teamBlock .teamInfo
{
display: flex;
flex-direction: column;
justify-content: flex-end;
}
.bigSize .teamBlock .teamInfo
{
padding: 5%;
}
.bigSize .teamBlock .teamInfo > div
{ width: 50%;
}
.swiper-slide.mediumSize .teamBlock .teamInfo > div
{ width: 45%;
margin: 0 0 0 auto;
}  .pagenotfound {
text-align: center;
padding: 0px 40px;
overflow: visible;
margin: 0 auto 40px auto;
}
.pagenotfound a {
font-weight: 600;
}
.pagenotfound h2 {
text-align: center;
text-transform: uppercase;
font-size: 2.8125VW ;
line-height: 3.22VW ;
letter-spacing: 0.01em;
color: #fff;
}
#error-404-img {
max-width: 600px;
display: block;
margin: 0 auto;
}
#loupe {
animation: bounceInUp 2s ease forwards;
}
#ombre-loupe {
animation: fadeIn 2s 3s ease forwards;
}
#_x34_-gauche, #_x34_-droite, #ombre-loupe, #decorations {
opacity: 0;
}
#_x34_-gauche, #_x34_-droite {
animation: fadeIn 2s ease forwards;
}
#_x34_-gauche {
animation-delay: 1s;
}
#_x34_-droite {
animation-delay: 2s;
}
#decorations {
transform-origin: center;
animation: fadeIn 2s ease forwards, rotate-grow 50s linear infinite alternate;
animation-delay: 4s;
}
@-webkit-keyframes rotate-grow {
from {
-webkit-transform: rotate(0) scale(.8);
transform: rotate(0) scale(.8);
}
to {
-webkit-transform: rotate(360deg) scale(1.5);
transform: rotate(360deg) scale(1.5);
}
}
@keyframes rotate-grow {
from {
-webkit-transform: rotate(0) scale(.8);
transform: rotate(0) scale(.8);
}
to {
-webkit-transform: rotate(360deg) scale(1.5);
transform: rotate(360deg) scale(1.5);
}
}
@-webkit-keyframes fadeInLeft {
from {
opacity: 0;
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes fadeInRight {
from {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes fadeInRight {
from {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes fadeInLeft {
from {
opacity: 0;
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes fadeIn {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes fadeIn {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes bounceInUp {
from,
60%,
75%,
90%,
to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
from {
opacity: 0;
-webkit-transform: translate3d(0, 3000px, 0);
transform: translate3d(0, 3000px, 0);
}
60% {
opacity: 1;
-webkit-transform: translate3d(0, -20px, 0);
transform: translate3d(0, -20px, 0);
}
75% {
-webkit-transform: translate3d(0, 10px, 0);
transform: translate3d(0, 10px, 0);
}
90% {
-webkit-transform: translate3d(0, -5px, 0);
transform: translate3d(0, -5px, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes bounceInUp {
from,
60%,
75%,
90%,
to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
from {
opacity: 0;
-webkit-transform: translate3d(0, 3000px, 0);
transform: translate3d(0, 3000px, 0);
}
60% {
opacity: 1;
-webkit-transform: translate3d(0, -20px, 0);
transform: translate3d(0, -20px, 0);
}
75% {
-webkit-transform: translate3d(0, 10px, 0);
transform: translate3d(0, 10px, 0);
}
90% {
-webkit-transform: translate3d(0, -5px, 0);
transform: translate3d(0, -5px, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
.bounceInUp {
-webkit-animation-name: bounceInUp;
animation-name: bounceInUp;
}  .gform_wrapper.gravity-theme .gfield_required, .gfield_validation_message {
display: none !important;
}
footer .gform_heading
{
display: none;
}
footer .gform_wrapper.gravity-theme .gform_fields {
grid-column-gap: 20px;
}
.gform_wrapper.gravity-theme .gform_validation_errors {
background: #000 !important;
border: 1px solid #ff2e00 !important;
border-radius: 0px !important;
box-shadow: none !important;
padding: 10px !important;
}
.contactForm .gform_wrapper.gravity-theme .gform_validation_errors h2 {
font-family: 'avenirlight' !important;
font-size: 16px;
line-height: 24px;
color: #ff2e00 !important
}
.gform_wrapper.gravity-theme .gfield textarea.small {
height: 115px !important;
padding-right: 60px !important;
}
.gform_confirmation_message
{
background-color: var(--light_gray);
color: #000;
padding: 20px;
text-align: center;
margin-bottom: 20px;
}
footer .gform_footer {
position: absolute;
right: 25px;
bottom: 10px;
}
footer .gform_wrapper input[type='submit'] {
background-color: transparent;
width: 40px;
font-size: 0px;
margin: 0px !important;
background: url(//socratesint.com/wp-content/themes/socrates-custom/images/next-arrow.svg);
background-repeat: no-repeat;
background-size: 35px;
background-position: center;
font-family: 'avenirblack';
}
footer {
position: relative;
width: 100%;
z-index: 1;
}
.home footer {
background-color: var(--medium_gray);
}
footer .footerlogo {
width: 60px;
height: 80px;
margin: 0 auto 100px auto;
display: block;
}
footer .centerBlock { width: 94%;
padding: 100px 42px 35px 42px;
margin: 0 auto;
font-size: 16px;
line-height: 20px;
letter-spacing: -0.4px;
}
.page-template-template-contact-php footer .centerBlock
{
padding: 40px 42px 35px 42px;
}
footer .centerBlock p {
padding-bottom: 15px;
}
footer .col_1_1
{    align-items: flex-start;}
footer .centerBlock>div>div {
padding: 7px;
}
footer .centerBlock>div h6 {
width: 100%;
font-size: 20px;
line-height: 27px;
letter-spacing: 2px;
padding-bottom: 10px;
margin-bottom: 20px;
font-family: 'avenirblack';
text-transform: uppercase;
border-bottom: 1px solid #fff;
}
footer .centerBlock div.contact {
width: 50%;
}
footer .centerBlock div.contact .contactForm {
width: 65%;
padding-right: 25px;
position: relative;
}
footer .centerBlock div.contact .contactForm .gfmc-container {
width: calc(50% - 12px);
}
footer .centerBlock div.contact .contactForm .gform_fields {
display: flex;
}
footer .centerBlock div.contact .contactForm .gfmc-container .gfmc-column .gfield {
margin-bottom: 20px !important
}
footer .centerBlock div.contact .contactInfo {
width: 18%;
padding-right: 15px;
}
footer .centerBlock div.contact .socialInfo {
width: 17%;
}
footer .centerBlock div.contact .socialInfo a {
display: flex;
align-items: center;
font-size: 14px;
}
footer .centerBlock div.contact .socialInfo a img {
margin-right: 10px;
width: 35px;
height: 35px;
}
footer .centerBlock div.career {
width: 35%;
}
footer .centerBlock div.career div{
max-width: 350px
}
footer .centerBlock div.copyrightLinks {
width: 15%;
font-size: 12px;
line-height: 16px;
letter-spacing: -0.24px;
position: relative;
}
footer .centerBlock div.copyrightLinks .footerMenu {
margin: 0px;
padding: 20px 0px 0px 0px;
list-style: none;
display: flex;
flex-direction: column;
align-items: flex-start;
}
footer .centerBlock div.career a {
font-family: 'avenirblack';
display: inline-block;
cursor: pointer;
}
footer a {
font-family: 'avenirbook' !important;
display: block;
margin-bottom: 5px;
}
body.page-template-template-journal-list-php footer a.footerlogo img {
filter: invert(1);
}
body.page-template-template-our-works-php footer a.footerlogo img, footer a.footerlogo img {
filter: invert(0.6);
}
.home footer a.footerlogo img
{filter: invert(0);}
footer .centerBlock div.copyrightLinks .footerMenu li {
padding: 0px 0px;
}
footer .centerBlock div.copyrightLinks .footerMenu li a {
font-family: 'avenirbook';
}
body:not(.page-template-template-contact-php) footer .centerBlock div.contact .contactForm {
display: none;
}
body:not(.page-template-template-contact-php) footer .centerBlock div.contact .contactInfo {
width: 100%;
max-width: 430px;
display: flex;
}
body:not(.page-template-template-contact-php) footer .centerBlock div.contact .contactInfo div {
padding-right: 3vw;
}
body:not(.page-template-template-contact-php) footer .centerBlock div.contact .socialInfo {
width: 30%;
}
body.page-template-template-contact-php footer .centerBlock div.contact {
width: 65%;
align-items: flex-start;
}
body.page-template-template-contact-php footer .centerBlock div.career {
width: 23%;
}
body.page-template-template-contact-php footer .centerBlock div.copyrightLinks {
width: 12%;
}
.scrollTop {
width: 30px;
height: 60px;
overflow: hidden;
position: absolute;
cursor: pointer;
right: 10px;
bottom: 10px;
}
.scrollTop span:nth-child(1) {
position: absolute;
width: 30px;
height: 60px;
display: block;
bottom: 0px;
}
.scrollTop span:nth-child(2) {
position: absolute;
width: 30px;
height: 60px;
display: block;
background: url(//socratesint.com/wp-content/themes/socrates-custom/images/top-arrow.svg);
background-position: center;
background-size: cover;
background-repeat: no-repeat;
bottom: -85px;
}
.scrollTop span:nth-child(1), .scrollTop span:nth-child(2) {
-webkit-transition: all .3s cubic-bezier(.16, .84, .44, 1);
-moz-transition: all .3s cubic-bezier(.16, .84, .44, 1);
-o-transition: all .3s cubic-bezier(.16, .84, .44, 1);
transition: all .3s cubic-bezier(.16, .84, .44, 1);
transition-timing-function: cubic-bezier(0.16, 0.84, 0.44, 1);
}
.scrollTop:hover span:nth-child(1) {
bottom: 70px;
}
.scrollTop:hover span:nth-child(2) {
bottom: 0;
}
body.page-template-template-contact-php .scrollTop {
display: none;
} .cky-consent-container .cky-consent-bar
{
background: #000000 !important;
color: #fff !important;
border: 0px !important;
padding: 10px !important;
box-shadow: none !important;
}
.cky-notice .cky-title
{
display: none !important
}
.cky-notice .cky-title, .cky-notice-des
{
color: #fff !important; font-family: 'avenirlight'!important;
}
.cky-notice-des p{
padding: 0px;
}
.cky-btn-customize, .cky-btn-reject {
color: #ffffff !important;
background: transparent !important;
border: 1px solid #ffffff !important;
border-radius: 0px !important;
}
.cky-prefrence-btn-wrapper .cky-btn-reject {
color: #000 !important;
background: transparent !important;
border: 1px solid #000 !important;
border-radius: 0px !important;
}
.cky-btn-revisit-wrapper
{
background-color: var(--medium_gray) !important;
}
button.cky-show-desc-btn:not(:hover):not(:active)
{
color: #000 !important;
text-decoration: underline !important;
}
.cky-consent-container
{
border-top: 2px solid #fff !important;
}
.cky-btn-preferences {
color: #000 !important;
background: transparent !important;
border: 1px solid #000 !important;
border-radius: 0px !important;
}
.cky-btn-accept, a.cky-banner-element {
border-radius: 0px !important;
background: #ffffff !important;
color: #000 !important;
border: 2px solid #ffffff !important;
}
.entry a.cky-banner-element
{
padding: 2px 20px !important;
font-size: 18px;
line-height: 22px;
}
.cky-prefrence-btn-wrapper .cky-btn-accept {
color: #fff !important;
background:  #000 !important;
border: 1px solid #000 !important;
border-radius: 0px !important;
}
.cky-notice-des a.cky-policy, .cky-notice-des button.cky-policy{color: #fff !important;
background-color: transparent !important; border: 0px !important}
.cky-footer-wrapper > div:last-child
{display: none !important}
.entry .cky-cookie-audit-table th, .entry .cky-cookie-audit-table tr:nth-child(2n + 1) td,
.entry .cky-cookie-audit-table tr:nth-child(2n) td {
background-color: transparent;
border-bottom: 1px solid #ffffff;
color: #fff;
}
.entry .cky-cookie-audit-table th
{
font-family: 'avenirblack';
}
.entry .cky-cookie-audit-table th, .entry .cky-cookie-audit-table td
{
font-size: 20px;
line-height: 28px;
}
.entry .cky-cookie-audit-table th, .entry .cky-cookie-audit-table td, .entry .cky-cookie-audit-table
{
border-left: 0px;
border-right: 0px;
}
.cky-table-wrapper
{
width: 100%;
overflow: auto;
}
.entry table{
min-width: 600px;
}
.cky-switch input[type="checkbox"]:checked
{background-color: #000 !important}