/*
Theme Name: Digitalform
Theme URI: https://digitalform.hu/
Description: Default website template of Digitalform
Author: Digitalform
Author URI: https://digitalform.hu/
Version: 3.0
*/

*{
margin: 0;
border: 0;
padding: 0;
flex-wrap: wrap;
text-decoration: none;
}

@font-face { 
	font-family: 'Roboto'; 
	src: url("fonts/roboto-regular.woff2") format('woff2');
	font-weight: 400; 
	font-style: normal;
	font-stretch: normal;
	font-display: swap;
}

@font-face { 
	font-family: 'Roboto'; 
	src: url("fonts/roboto-italic.woff2") format('woff2');
	font-weight: 400; 
	font-style: italic;
	font-stretch: normal;
	font-display: swap;
}

@font-face { 
	font-family: 'Roboto'; 
	src: url("fonts/roboto-medium.woff2") format('woff2');
	font-weight: 500; 
	font-style: normal;
	font-stretch: normal;
	font-display: swap;
}

@font-face { 
	font-family: 'Roboto'; 
	src: url("fonts/roboto-medium-italic.woff2") format('woff2');
	font-weight: 500; 
	font-style: italic;
	font-stretch: normal;
	font-display: swap;
}

@font-face { 
	font-family: 'Roboto'; 
	src: url("fonts/roboto-bold.woff2") format('woff2');
	font-weight: 700; 
	font-style: normal;
	font-stretch: normal;
	font-display: swap;
}

@font-face { 
	font-family: 'Roboto'; 
	src: url("fonts/roboto-bold-italic.woff2") format('woff2');
	font-weight: 700; 
	font-style: italic;
	font-stretch: normal;
	font-display: swap;
}

*, 
*:after, 
*::before { -webkit-box-sizing: border-box; box-sizing: border-box; }

:root {
	--color-red: #F03454;
	--color-dark: #1B1D1F;
	--color-silver: #F1F1F3;
	--color-gray: #B3B3B3;
	--color-sand: #F6F2EA;
	--color-white-a60: rgba(255 255 255 / 70%);
	--size-h2: calc(clamp(4em, 5vw, 4.5em) * .6);
	--size-h3: calc(clamp(3.5em, 5vw, 4.5em) * .4);
	--size-h4: 13px;
	--fc-spacing: 150px;
}

body { height: 100%; font-family: 'Roboto', sans-serif; font-size: 20px; font-weight: 400; color: var(--color-dark); line-height: 35px; overflow-x: hidden; }
body.dark { color: var(--color-white-a60); background-color: var(--color-dark); }
body.sand { background-color: var(--color-sand); }

ul { list-style-type: none; }

a { text-decoration: none; }
a.has_line { position: relative; }

a.has_arrow { margin-right: 20px; padding: 5px 0; font-size: 20px; font-weight: 400; text-decoration: none !important; color: var(--color-dark) !important; line-height: 20px; display: inline-block; position: relative; }
a.has_arrow:before { width: 50px; height: 50px; left: -40px; top: -10px !important; background: var(--color-red) url(images/icon-arrow-right-white.svg) no-repeat center; background-size: 16px auto; position: absolute; content: ''; opacity: 0%; transform: scale(0%); -webkit-border-radius: 50%; border-radius: 50%; }
a.has_arrow:after { width: 100%; height: 1px; right: 0; bottom: 0; background: var(--color-dark); position: absolute; content: ''; }
a.has_arrow:hover { padding-left: 20px; margin-right: 0; position: relative; }
a.has_arrow:hover:before { opacity: 100%; transform: scale(100%); }
a.has_arrow:hover:after { width: 0; }

hr { height: 30px; margin-top: 30px; border-top: 1px solid #ddd; clear: both; }
h1, h2, h3, h4, h5, h6 { font-weight: normal; line-height: 100%; }

input, textarea, select, button { font-family: 'Roboto', sans-serif; font-weight: 400; outline: none; }
input[type=submit] { font-family: 'Roboto', sans-serif; }

img.alignleft { margin: 0 20px 10px 0; float: left; }

code { font-size: 90%; top: -1px; margin: 0 3px 0 1px; padding: 0 5px 2px; font-family: monospace; background: #eee; border-radius: 4px; position: relative; }

input[type="radio"] { width: 30px; height: 30px; margin: -4px 4px 0 0; padding: 0 !important; text-align: center !important; background-color: var(--color-silver); clear: none; cursor: pointer; display: inline-block; line-height: 0; outline: 0; vertical-align: middle !important;  -webkit-appearance: none; -webkit-box-shadow: none; box-shadow: none; -webkit-transition: .05s border-color ease-in-out; transition: .05s border-color ease-in-out; }
input[type="radio"] { -webkit-border-radius: 50%; border-radius: 50%; }
input[type="radio"]:checked:before { width: 18px; height: 18px; left: 4px; top: 4px; background: #34a853; position: relative; border-radius: 8px; display: block; text-align: center; content: ''; }

input[type=checkbox] { width: 30px; height: 30px; margin: -4px 4px 0 0; padding: 0 !important; background-color: var(--color-silver); clear: none; cursor: pointer; display: inline-block; line-height: 0; outline: 0; vertical-align: middle !important; -webkit-appearance: none; -webkit-box-shadow: none; box-shadow: none; -webkit-transition: .05s border-color ease-in-out; transition: .05s border-color ease-in-out; }
input[type=checkbox]:checked { background: var(--color-dark); border-color: var(--color-dark); }
input[type=checkbox]:checked:before { width: 100%; height: 100%; left: 0; top: 0; font-size: 20px; color: #FFFFFF; position: relative; display: flex; justify-content: center; align-items: center; content: '✔'; }


/*
-----------------
	CLASSES
-----------------
*/
.left { float: left; }
.right { float: right; }
.clear { clear: both; }
.inner { max-width: 1280px; margin: auto; position: relative; }
.hide { display: none !important; }
.center { text-align: center !important; }
.b_r_3 { -webkit-border-radius: 3px; border-radius: 3px; }
.b_r_5 { -webkit-border-radius: 5px; border-radius: 5px; }
.b_r_50p { -webkit-border-radius: 50%; border-radius: 50%; }
.vertical_middle { top: 50%; position: relative; -webkit-transform: translateY(-50%); transform: translateY(-50%); }
.space_h30 { height: 30px; clear: both; }

/* Buttons */
.button { min-height: 50px; padding: 10px 30px; font-size: 20px !important; text-align: center; text-decoration: none !important; color: white !important; line-height: 20px; background: var(--color-red); display: inline-flex; align-items: center; justify-content: center; position: relative; z-index: 0; overflow: hidden; cursor: pointer; -webkit-border-radius: 25px; border-radius: 25px; }
.button:after { display: none !important; }
.button::before { background: rgba(255 255 255 / 10%); position: absolute; z-index: -1; content: ''; -webkit-border-radius: 40px; border-radius: 40px; transform: scaleX(0); transform-origin: right; transition: transform 0.5s ease-in-out; inset: 0; }
.button:hover::before { transform: scaleX(1); transform-origin: left; }

.button.button_h80 { -webkit-border-radius: 40px; border-radius: 40px; }

/* Font */
.red { color: var(--color-red); }
.uppercase { text-transform: uppercase; }

/* Animation */
.anim, :before, :after  { -webkit-transition: all 0.3s ease-out; transition: all 0.3s ease-out; }
.anim_v2  { -webkit-transition: all 0.6s ease-in-out; transition: all 0.6s ease-in-out; } 
.anim_cubic { -webkit-transition: all 1s cubic-bezier(0.19, 1, 0.22, 1); transition: all 1s cubic-bezier(0.19, 1, 0.22, 1); }

.skew_animation { transform: skewY(5deg) translateY(70px); opacity: 0; position: relative; transition: all 0.5s ease-out; }
.skew_animation.reveal { transform: skewY(0deg) translateY(0); opacity: 1; }


/*
----------------
	RWD NAV
----------------
*/
#rwd_menu { width: 100%; left: 0; top: 0; bottom: 0; position: fixed; z-index: 100; visibility: hidden; } 
#rwd_menu .rwd_menu_wrap { width: 700px; height: 100%; right: -100%; top: 0; padding: 100px 50px 50px; background: var(--color-silver); position: absolute; overflow-y: auto; } 

/* Primary menu */
#rwd_menu .primary_menu label { padding-bottom: 10px; font-size: var(--size-h4); font-weight: 500; text-transform: uppercase; color: var(--color-gray); border-bottom: 1px solid var(--color-gray); display: block; }

#rwd_menu .primary_menu ul li { margin: 20px 0; }
#rwd_menu .primary_menu ul li a { font-size: 40px; color: var(--color-dark); line-height: 100%; display: block; position: relative; }
#rwd_menu .primary_menu ul li a:hover { text-decoration: underline; text-decoration-thickness: 1px; }

/* Button */
#rwd_menu .button { width: 450px; left: -100%; bottom: 0; padding: 0 !important; text-align: center; display: block; position: fixed; -webkit-border-radius: 0; border-radius: 0; }
#rwd_menu .button:hover { color: white !important; background-color: #333 !important; }

body.rwd_menu__opened #rwd_menu { visibility: visible; }
body.rwd_menu__opened #rwd_menu .rwd_menu_wrap { right: 0; }


/*
----------------------
	ROTATE WARNING
----------------------
*/
.rotate_warning { width: 100%; height: 100%; inset: 0; padding: 20px; font-size: 18px; line-height: 25px; text-align: center; background: var(--color-sand); display: none; align-items: center; align-content: center; justify-content: center; position: fixed; z-index: 100000; }
.rotate_warning img { width: auto; height: 60px; display: block; }
.rotate_warning .rotate_warning_img { width: 100%; margin-bottom: 20px; display: flex; justify-content: center; }
.rotate_warning .rotate_warning_text { max-width: 400px; margin: auto; }


/*
--------------
	CURSOR
--------------
*/
.cursor { width: 150px; height: 150px; visibility: hidden; position: absolute; z-index: 100; cursor: none; pointer-events: none; }
.cursor:after { width: 100%; height: 100%; left: 0; top: 0; font-size: var(--size-h4); font-weight: 500; text-transform: uppercase; color: #FFFFFF; line-height: 16px; background: var(--color-red); display: flex; justify-content: center; align-items: center; position: absolute; content: 'Megnézem'; -webkit-border-radius: 50%; border-radius: 50%; opacity: 0; transform: scale(0%); }
.cursor.active { visibility: visible; }
.cursor.active:after { opacity: 100%; transform: scale(100%); }


/*
-------------
	GRIDS
-------------
*/
.grids { width: 100%; max-width: 1280px; height: 100%; left: 50%; top: 0; position: absolute; z-index: -1; -webkit-transform: translateX(-50%); transform: translateX(-50%); pointer-events: none; }
.grids .grid { width: 1px; height: 100%; left: 0; top: 0; background: rgba(255 255 255 / 5%); position: absolute; }
.grids.light .grid { background: rgba(0 0 0 / 5%); }

.grids .grid.grid_2 { left: 25%; }
.grids .grid.grid_3 { left: 50%; }
.grids .grid.grid_4 { left: 75%; }
.grids .grid.grid_5 { left: 100%; }


/*
--------------
	HEADER
--------------
*/
#header { width: 100%; left: 0; top: -100px; position: fixed; z-index: 100; animation-name: header_animation; animation-duration: 0.6s; animation-delay: 0.4s; animation-fill-mode: forwards; animation-timing-function: ease-out; }
#header.hide_on_scroll { top: -100px !important; }

/* Logo */
#header .logo { height: 40px; left: 50px; top: 30px; position: absolute; z-index: 2; }
#header .logo img { width: auto; height: 100%; display: block; }

/* Menu */
#header ul.menu { left: 50%; top: 35px; display: flex; justify-content: center; position: absolute; z-index: 1; -webkit-transform: translateX(-50%); transform: translateX(-50%); }
#header ul.menu li { margin-left: 30px; }
#header ul.menu li:first-child { margin-left: 0; }
#header ul.menu li a { font-size: 19px; font-weight: 500; color: var(--color-dark); line-height: 20px; position: relative; }
#header ul.menu li a:after { width: 100%; height: 1px; right: 0; bottom: 0; background: var(--color-dark); position: absolute; content: ''; }
#header ul.menu li a:hover:after { width: 0; }

body.dark #header ul.menu li a, 
body.single-work #header ul.menu li a { color: #FFFFFF; }

body.dark #header ul.menu li a:after, 
body.single-work #header ul.menu li a:after { background: #FFFFFF; }

/* Contact */
#header a.contact_menu_item { height: 50px; right: 30px; top: 25px; padding: 0 30px; font-size: 19px; font-weight: 500; color: var(--color-dark) !important; line-height: 50px; display: block; position: absolute; overflow: hidden; z-index: 1; -webkit-border-radius: 25px; border-radius: 25px; }
#header a.contact_menu_item span { position: relative; }
#header a.contact_menu_item span:after { width: 100%; height: 1px; right: 0; bottom: 0; background: var(--color-dark); position: absolute; content: ''; }
#header a.contact_menu_item:hover { color: var(--color-red); }
#header a.contact_menu_item:hover span:after { width: 0; }

#header a.contact_menu_item.active { color: white !important; background: var(--color-red) !important; }
#header a.contact_menu_item.active span:after { background: white !important; }

#header a.contact_menu_item.active::before { background: rgba(255 255 255 / 10%); position: absolute; z-index: -1; content: ''; -webkit-border-radius: 40px; border-radius: 40px; transform: scaleX(0); transform-origin: right; transition: transform 0.5s ease-in-out; inset: 0; }
#header a.contact_menu_item.active:hover::before { transform: scaleX(1); transform-origin: left; }

#header a.contact_menu_item.hide_this { visibility: hidden; opacity: 0; }

body.dark #header a.contact_menu_item, 
body.single-work #header a.contact_menu_item { color: #FFFFFF !important; }

body.dark #header a.contact_menu_item span:after, 
body.single-work #header a.contact_menu_item span:after { background: #FFFFFF; }

/* RWD button */
#header .rwd_button { width: 52px; height: 52px; right: 20px; top: 24px; font-size: 20px; font-weight: 500; background: var(--color-red); display: none; position: absolute; cursor: pointer; }
#header .rwd_button .burg { width: 20px; height: 2px; left: 16px; top: 26px; display: block; position: absolute; -webkit-transition: 0.2s; transition: 0.2s; }

#header .rwd_button .burg:before, 
#header .rwd_button .burg:after { width: 20px; height: 1px; background: #FFFFFF; position: absolute; content: ''; -webkit-transition: 0.2s; transition: 0.2s; }

#header .rwd_button .burg:before { top: -3px; left: 0; }
#header .rwd_button .burg:after { top: 3px; right: 0; }

body.rwd_menu__opened #header .rwd_button { background: var(--color-dark); }
body.rwd_menu__opened #header .rwd_button .burg { background: transparent; }
body.rwd_menu__opened #header .rwd_button .burg:before { top: 0; -webkit-transform: rotate(45deg); }
body.rwd_menu__opened #header .rwd_button .burg:after { top: 0; -webkit-transform: rotate(-45deg); }

/* RWD menu is opened */
body.rwd_menu__opened #header .logo { opacity: 0 !important; }


/*
-------------
	INTRO
-------------
*/
#intro { height: calc(100vh - 150px); }
#intro .intro_wrap { height: 100%; padding-bottom: 150px; display: flex; align-content: end; }

#intro .intro_wrap .title_wrap { margin-bottom: 30px; animation-name: intro_animation; animation-duration: 0.4s; animation-delay: 1s; animation-fill-mode: forwards; animation-timing-function: ease-out; }
#intro .intro_wrap .title_wrap .title { font-size: calc(clamp(3em, 7vw, 8em) * .8); font-weight: 400; color: var(--color-dark); letter-spacing: -1px; line-height: 110%; }

#intro .intro_wrap .typing-text { color: var(--color-red); }
#intro .intro_wrap .typing-text::after { color: var(--color-red); content: '|'; animation: blink ease 1s infinite; }

#intro .intro_wrap .action_buttons { width: 100%; animation-name: intro_animation; animation-duration: 0.4s; animation-delay: 1.2s; animation-fill-mode: forwards; animation-timing-function: ease-out; }


/*
--------------
	SLIDER
--------------
*/
#slider { padding-left: 180px; position: relative; }
#slider:before { width: 100%; height: calc(100% - 150px); left: 0; bottom: 0; background-color: var(--color-dark); /*background-image: url(images/bgr_body.webp); background-image: -webkit-image-set(url(images/bgr_body.webp) 1x); background-image: image-set(url(images/bgr_body.png) 1x);*/ position: absolute; content: ''; z-index: -1; }

/* Progress bar */
#slider .progress_bar { height: 5px; background: rgba(0 0 0 / 7%); display: flex; opacity: 0; }
#slider .progress_bar .item { height: 100%; flex-grow: 1; flex-basis: 0; position: relative; }
#slider .progress_bar .item:before { width: 0; height: 100%; left: 0; top: 0; background: rgba(0 0 0 / 15%); position: absolute; content: ''; }
#slider .progress_bar .item.active:before { -webkit-animation: 7s linear 0s forwards  alternate move; }

/* Controller */
#slider .controller { right: 50px; top: -50px; display: flex; position: absolute; }
#slider .controller div { width: 60px; height: 30px; background: url(images/icon-arrow-left.svg) no-repeat left center; background-size: 50px auto; cursor: pointer; opacity: 40%; }
#slider .controller div:hover { opacity: 100%; }
#slider .controller .next_slide { background-image: url(images/icon-arrow-right.svg); background-position: right center; }

/* Slides */
#slider .slides { height: 100vh; background: var(--color-silver); position: relative; z-index: 2; overflow: hidden; }
#slider .slides .slick-list, 
#slider .slides .slick-track, 
#slider .slides .slick-slide { height: 100%; }
#slider .slides .item { margin-top: -100px; height: 120%; background-repeat: no-repeat; background-position: center; background-size: cover; position: relative; overflow: hidden; position: relative; }
#slider .slides .item a { width: 100%; height: 100%; left: 0; top: 50%; background: #000; position: absolute; cursor: none; transform: translateY(-50%); display: flex; justify-content: center; align-items: center; }
#slider .slides .item img { width: 100%; height: 100%; left: 0; top: 0; position: absolute; z-index: -1; object-fit: cover; object-position: center; }

/* Body is loaded */
#slider .progress_bar { animation-name: progress_bar_animation; animation-duration: 0.6s; animation-delay: 1s; animation-fill-mode: forwards; animation-timing-function: ease-out; }
#slider .slides { animation-name: skew_animation_reveal; animation-duration: 0.6s; /*animation-delay: 0.4s;*/ animation-fill-mode: forwards; animation-timing-function: ease-out; }

/* Keyframes */
@keyframes move {
	from { width: 0px; }
	to { width: 100%; }
}


/*
----------------
	ABOUT US
----------------
*/
#aboutus { padding-top: 150px; color: var(--color-white-a60); background-color: var(--color-dark); position: relative; }
#aboutus .aboutus_title { width: 80%; margin-bottom: 50px; padding-left: 70px; font-size: var(--size-h2); color: #FFFFFF; line-height: 120%; position: relative; z-index: 2; }
#aboutus .aboutus_text { padding-left: calc(25% + 70px); padding-right: 150px; line-height: 160%; position: relative; z-index: 2; }
#aboutus .aboutus_text p { margin-bottom: 30px; }
#aboutus .aboutus_text p:last-child { margin-bottom: 0; }
#aboutus .aboutus_text a { text-decoration: underline; text-decoration-thickness: 2px; color: #FFFFFF; }


.marquee { display: flex; flex-wrap: nowrap !important; white-space: nowrap; overflow: hidden; -webkit-mask-image: linear-gradient(to right, rgba(0, 0, 0, 0) 0%, #000 30%, #000 calc(100% - 30%), rgba(0, 0, 0, 0) 100%); mask-image: linear-gradient(to right, rgba(0, 0, 0, 0) 0%, #000 30%, #000 calc(100% - 30%), rgba(0, 0, 0, 0) 100%); }
.marquee .marquee_wrap { display: flex; flex-wrap: nowrap !important; white-space: nowrap; -webkit-animation: animate-marquee 40s infinite linear; animation: animate-marquee 40s infinite linear; transition: .7s margin-left ease-out; will-change: transform, margin-left; }
/*.marquee:hover .marquee_wrap { -webkit-animation-play-state: paused; animation-play-state: paused; }*/
.marquee.second_row .marquee_wrap { animation-direction: reverse; }

@-webkit-keyframes animate-marquee {
	0% { transform: translateX(0%) translateZ(0); }
	100% { transform: translateX(-100%) translateZ(0); }
}

@keyframes animate-marquee { 
	0% { transform: translateX(0%) translateZ(0); }
	100% { transform: translateX(-100%) translateZ(0); }
}


/*
----------------
	SERVICES
----------------
*/
#services { padding-top: 150px; padding-bottom: 150px; color: #FFFFFF; background-color: var(--color-dark); position: relative; }
#services .services_marquee { margin-bottom: 100px; position: relative; overflow: hidden; z-index: 2; }
#services .services_marquee div { font-size: 12vw; color: #FFFFFF; line-height: 120%; white-space: nowrap; }
#services .services_marquee .marquee_top { position: relative; }
#services .services_marquee .marquee_top .marquee_top_wrap { display: flex; flex-wrap: nowrap; justify-content: center; white-space: nowrap; position: relative; -webkit-transform: translateX(-50%); transform: translateX(-50%); }
#services .services_marquee .marquee_top .marquee_top_wrap div:nth-child(odd) { color: var(--color-gray); }

#services .services_marquee .marquee_bottom { position: relative; }
/*#services .services_marquee .marquee_bottom:before { padding-top: 13%; display: block; content: ''; }*/
#services .services_marquee .marquee_bottom .marquee_bottom_wrap { display: flex; flex-wrap: nowrap; justify-content: center; white-space: nowrap; position: relative; -webkit-transform: translateX(-50%); transform: translateX(-50%); }
#services .services_marquee .marquee_bottom .marquee_bottom_wrap div:nth-child(odd) { color: var(--color-gray); }

#services .services_wrap { color: var(--color-white-a60); display: flex; position: relative; z-index: 2; }
#services .services_wrap a { text-decoration: underline; text-decoration-thickness: 1px; color: var(--color-white-a60); }
#services .services_wrap a:hover { color: #FFFFFF; }
#services .services_wrap .service { width: 50%; margin-top: 100px; padding: 0 70px; }
#services .services_wrap .service:nth-child(1) { margin-top: 0; }
#services .services_wrap .service:nth-child(2) { margin-top: 200px; }
#services .services_wrap .service:nth-child(3) { margin-top: -100px; }
#services .services_wrap .service .service_title { margin-bottom: 30px; font-size: var(--size-h2); font-weight: 500; color: #FFFFFF; line-height: 100%; position: relative; }
#services .services_wrap .service .service_title .count { left: -70px; bottom: 7px; font-size: 16px; color: var(--color-white-a60); line-height: 16px; position: absolute; }


/*
-----------------------
	FEATURED POSTS
-----------------------
*/
#featured_works { padding: 150px 0; position: relative; }
#featured_works .featured_works_title { width: 80%; margin-bottom: 50px; padding-left: 70px; font-size: var(--size-h2); line-height: 120%; position: relative; z-index: 2; }
#featured_works .featured_works_text { padding: 0 70px; line-height: 160%; position: relative; z-index: 2; }
#featured_works .featured_works_text p { margin-bottom: 30px; }
#featured_works .featured_works_text p:last-child { margin-bottom: 0; }

#featured_works .featured_works_wrap { margin-top: 100px; position: relative; z-index: 2; }
#featured_works .featured_works_wrap .wrap_left { width: 50%; position: relative; }
#featured_works .featured_works_wrap .wrap_right { width: 50%; height: 100%; right: 0; top: 0; position: absolute; overflow: hidden; }
#featured_works .featured_works_wrap .wrap_right .wrap_right_length { position: relative; }

.featured_works_wrap .post { width: calc(100% - 140px); margin-top: 100px; margin-left: 70px; margin-right: 70px; text-decoration: none !important; display: block; }
.featured_works_wrap .post:after { display: none !important; }
.featured_works_wrap .post picture { margin-bottom: 30px; display: block; overflow: hidden; }
.featured_works_wrap .post picture img { width: 100%; height: auto; display: block; transform: scale(1); transition: transform 1s cubic-bezier(0.19, 1, 0.22, 1); }
.featured_works_wrap .post picture:hover img { transform: scale(1.05); }
.featured_works_wrap .post .entry .work_title { margin-bottom: 10px; font-size: var(--size-h3) !important; color: var(--color-dark); line-height: 100%; }
.featured_works_wrap .post .entry .work_services { font-size: 18px; color: var(--color-dark); line-height: 100% !important; display: flex; align-items: center; }

body.home .featured_works_wrap .wrap_left .post:first-child { margin-top: 0 !important; }
body.home .featured_works_wrap .wrap_right .post:first-child { margin-top: 0 !important; }

body.page-template-works .featured_works_wrap { margin-top: 0; display: flex; }
body.page-template-works .featured_works_wrap .post { width: calc(50% - 140px);  }
body.page-template-works .featured_works_wrap .post:nth-child(even) { margin-top: 200px; }


/*
--------------------
	MORE CLIENTS
--------------------
*/
#more_clients { padding: 0 0 150px; line-height: 120%; position: relative; }
#more_clients .more_clients_wrap { padding: 0 70px; line-height: 120%; position: relative; z-index: 2; }
#more_clients .more_clients_wrap .title { margin-bottom: 30px; font-size: var(--size-h4); font-weight: 500; line-height: 120%; }
#more_clients .more_clients_wrap .brands { font-size: var(--size-h2); font-weight: 500; color: var(--color-red); line-height: 120%; }


/*
--------------------
	CLIENTS GRID
--------------------
*/
.clients_grid { margin-top: 100px; padding: 100px 0; color: var(--color-dark); background-color: var(--color-sand); position: relative; z-index: 99; }
.clients_grid .content_wrap { padding: 0 70px; }
.clients_grid ul { margin: 0 !important; list-style: none !important; }
.clients_grid ul li { padding: 10px 0 !important; display: flex; align-items: center; position: relative; }
.clients_grid ul li.is-dimmed { opacity: 40%; }

.clients_grid ul li .client_name { width: 50%; padding: 0 20px 0 70px; font-weight: 700; }
.clients_grid ul li .client_name a { padding-right: 20px; text-decoration: none !important; color: var(--color-dark) !important; line-height: 120%; background: url(images/icon-external-link-dark.svg) no-repeat right center / auto 12px !important; display: inline-block; }

.clients_grid ul li .client_year, 
.clients_grid ul li .client_category { width: 25%; padding-left: 70px; font-size: 13px; font-weight: 700; text-transform: uppercase; line-height: 100%; }

.clients_grid .image_reveal { width: 50%; height: auto; right: 0; position: absolute; object-fit: contain; pointer-events: none; opacity: 0; transition: top 0.35s ease, opacity 0.2s ease; will-change: top, opacity; z-index: 999; } 

body.page-template-works .clients_grid { margin-bottom: -200px; }


/*
---------------
	CONTENT
---------------
*/
#container {}

#content { padding: 200px 0; position: relative; }
body.single-work #content { padding: 0; }
body.page-template-contact #content, 
body.page-template-services #content, 
body.page-template-flexible-content #content { padding-bottom: 0; }

#content .inner { position: relative; z-index: 2; }
#content .content_wrap { padding: 0 70px; }

/* Is loaded */
/*body.is_loaded #content .skew_animation_reveal { top: 0; -webkit-transform: skewY(0); transform: skewY(0); opacity: 100%; }*/
#content .skew_animation_reveal { animation-name: skew_animation_reveal; animation-duration: 0.6s; /*animation-delay: 0.4s;*/ animation-fill-mode: forwards; animation-timing-function: ease-out; }

#content h1 { max-width: 50%; margin-bottom: 50px; font-size: clamp(40px, 5vw, 60px); color: var(--color-dark); line-height: 110%; }
#content h2 { margin-bottom: 30px; font-size: clamp(32px, 4vw, 48px); color: var(--color-dark); line-height: 110%; }
#content h3 { margin-bottom: 30px; font-size: clamp(24px, 3vw, 36px); line-height: 150%;  }
#content h4 { margin-bottom: 30px; font-size: var(--size-h4); font-weight: 500; text-transform: uppercase; line-height: 16px; }

#content p { margin-bottom: 30px; }
#content p img { width: 100%; height: auto; display: block; }

#content a:not(.has_arrow):not(.post):not(.button):not(.thumbnail):not(.meta_right a) { text-decoration: none; color: #FFFFFF; background-image: linear-gradient(#FFFFFF, #FFFFFF); background-repeat: no-repeat; background-size: 100% 1px;  background-position: right bottom; transition: background-size .3s ease-out; } 
#content a:not(.has_arrow):not(.post):not(.button):not(.thumbnail):hover { background-size: 0% 1px; }
#content a.big { font-size: var(--size-h3); }

body.light-template #content a:not(.has_arrow):not(.post):not(.button):not(.thumbnail) { color: var(--color-dark) !important; background-image: linear-gradient(var(--color-dark), var(--color-dark)) !important; } 

#content ul { margin-bottom: 30px; margin-left: 50px; list-style: disc; }
#content ul li { padding-left: 20px; }

#content table { width: 100%; margin-bottom: 30px; font-size: smaller; border-collapse: collapse; }
#content table thead tr th { text-align: left; border-bottom: 1px solid var(--color-gray); }
#content table tbody tr td { padding: 10px 0; line-height: 20px; background: #FFFFFF; border-bottom: 1px solid var(--color-silver); }
#content code h1 { margin: 0 !important; font-size: inherit !important; font-weight: inherit !important; }

#content blockquote { margin-bottom: 30px; padding: 40px 100px 40px 40px; font-style: italic; background: var(--color-sand); position: relative; border-radius: 5px; }
#content blockquote:before { width: 60px; height: 60px; right: 20px; top: -30px; background: var(--color-dark) url(images/icon-quote-white.svg) no-repeat center; background-size: auto 24px; position: absolute; content: ''; border-radius: 50%; }
#content blockquote p:last-child { margin-bottom: 0 !important; }

#content .wp-caption { width: 100% !important; }
#content .wp-caption img { width: 100% !important; height: auto !important; display: block; }
#content .wp-caption img.has_border { border: 1px solid var(--color-silver); border-bottom: none; }
#content .wp-caption .wp-caption-text { padding: 10px; font-size: 15px; line-height: 20px; background: var(--color-silver); }

body.dark #content h1 { color: #FFFFFF; }

body.single #content h1 { max-width: none; }
body.single #content .content_wrap { max-width: 960px; margin: auto; padding: 0; }

body.archive.category #content h1 { max-width: none; margin-bottom: 100px; font-size: clamp(40px, 6vw, 72px); line-height: 130%; }
body.archive.category #content h1 span { color: #999; }
body.archive.category #content h1 video { width: auto; height: 100px; margin: 0 0 0 20px; vertical-align: middle; }

/* Blog */
#content .syntaxhighlighter { margin: 0 0 50px !important; }

#content .blog_intro { margin-top: -50px; margin-bottom: 100px; }
#content .blog_intro p { margin-bottom: 0 !important; }

#content .news_wrap article { margin-bottom: 100px; display: flex; justify-content: space-between; gap: 140px; }
#content .news_wrap article:last-child { margin-bottom: 0; }
#content .news_wrap article .thumbnail { width: calc(50% - 70px); }
#content .news_wrap article .thumbnail img { width: 100%; height: auto; display: block; }
#content .news_wrap article .entry { width: calc(50% - 70px); }
#content .news_wrap article .entry h3 { margin-bottom: 20px !important; line-height: 120% !important; }
#content .datetime { margin-bottom: 10px !important; font-size: 15px; color: var(--color-red); line-height: 20px !important; }


/*
--------------------
	PROGRESS BAR
--------------------
*/
#progress-container { width: 100%; height: 6px; left: 0; bottom: 0; background: var(--color-silver); position: sticky; z-index: 9999; }
#progress-container.hide { bottom: -6px; }
#progress-container #progress-bar { width: 0%; height: 100%; background: var(--color-red); transition: width 0.1s linear; }


/*
------------------------
	TABLE OF CONTENT
------------------------
*/
.ez-toc-counter { margin-bottom: 30px !important; padding: 40px !important; background: var(--color-sand) !important; border: none !important; -webkit-box-shadow: none !important; box-shadow: none !important; }
.ez-toc-counter .ez-toc-title { margin-bottom: 20px !important; font-size: 20px !important; font-weight: 700 !important; color: #000 !important; display: block !important; }
.ez-toc-counter ul { margin-left: 0 !important; margin-bottom: 0 !important; list-style: none !important; }
.ez-toc-counter ul li { margin-bottom: 5px !important; padding-left: 30px !important; position: relative; list-style: none !important; }
.ez-toc-counter ul li:last-child { margin-bottom: 0; }
.ez-toc-counter ul li:before { left: 0; margin-right: 1em; color: var(--color-dark); position: absolute; content: '→'; }
.ez-toc-counter ul li a { color: var(--color-pink) !important; }
.ez-toc-counter ul li a:hover { color: var(--color-dark) !important; }
.ez-toc-counter ul li a:after { background: var(--color-dark) !important; }


/*
------------
	WORK
------------
*/
#content .hero { height: 100vh; background-color: var(--color-dark); background-repeat: no-repeat; background-position: center; background-size: cover; position: relative; z-index: 2; animation-name: hero_animation; animation-duration: 0.6s; animation-delay: 0.6s; animation-fill-mode: forwards; animation-timing-function: ease-in-out; }

body.single-work .meta { padding: 100px 0; display: flex; align-content: start; }
body.single-work .meta h4 { width: 100%; margin-bottom: 10px !important; }
body.single-work .meta .meta_left { width: 50%; display: flex; align-content: start; }
body.single-work .meta .meta_left .meta_left_left { width: 50%; padding: 0 30px; }
body.single-work .meta .meta_left .meta_left_right { width: 50%; padding: 0 30px; }
body.single-work .meta .meta_right { width: 50%; padding: 0 30px; }
body.single-work .meta .meta_right a { text-decoration: underline; color: var(--color-dark); }

body.single-work .flexible_content { position: relative; z-index: 2; }
body.single-work .flexible_content .full_image { position: relative; background-repeat: no-repeat; background-position: center bottom; background-size: cover; overflow: hidden; }
body.single-work .flexible_content .full_image img { width: 100%; max-width: fit-content; height: auto; margin: auto; display: block; }
body.single-work .flexible_content .full_image.is_screenshot { padding: 100px 0; }
body.single-work .flexible_content .full_image.is_screenshot .image_wrap { margin: 0 30px; display: block; overflow: hidden; }
body.single-work .flexible_content .full_image.is_screenshot .image_wrap picture img { -webkit-border-radius: 15px; border-radius: 15px; }

body.single-work .flexible_content .images { display: flex; }
body.single-work .flexible_content .images .image { flex-grow: 1; flex-basis: 0; }
body.single-work .flexible_content .images .image img { width: 100%; height: auto; display: block; }

body.single-work .flexible_content .two_mobile_screenshot { padding: 100px 0; background-repeat: no-repeat; background-position: center bottom; background-size: cover; }
body.single-work .flexible_content .two_mobile_screenshot_wrap { display: flex; }
body.single-work .flexible_content .two_mobile_screenshot_wrap picture { width: 50%; padding: 0 30px; }
body.single-work .flexible_content .two_mobile_screenshot_wrap picture:nth-child(even) { margin-top: 40px; }
body.single-work .flexible_content .two_mobile_screenshot_wrap picture img { width: 100%; height: auto; display: block; filter: drop-shadow(10px 20px 40px rgba(0 0 0 / 20%)); -webkit-border-radius: 15px; border-radius: 15px; }

body.single-work .flexible_content .three_mobile_screenshot { padding: 100px 0; background-repeat: no-repeat; background-position: center bottom; background-size: cover; }
body.single-work .flexible_content .three_mobile_screenshot_wrap { display: flex; }
body.single-work .flexible_content .three_mobile_screenshot_wrap picture { width: 33.3333333333%; padding: 0 30px; }
body.single-work .flexible_content .three_mobile_screenshot_wrap picture:nth-child(even) { margin-top: 40px; }
body.single-work .flexible_content .three_mobile_screenshot_wrap picture img { width: 100%; height: auto; display: block; filter: drop-shadow(10px 20px 40px rgba(0 0 0 / 20%)); -webkit-border-radius: 15px; border-radius: 15px; }

body.single-work .flexible_content .only_text { padding: 100px 0; }
body.single-work .flexible_content .only_text .only_text_wrap { padding: 0 70px; font-size: var(--size-h3); line-height: 150%; }
body.single-work .flexible_content .only_text .only_text_wrap.has_normal_font_size { font-size: inherit; line-height: inherit; }
body.single-work .flexible_content .only_text .only_text_wrap p:last-child { margin-bottom: 0 !important; }

body.single-work .flexible_content .video { padding: 100px 0; }
body.single-work .flexible_content .video video { width: 100%; filter: drop-shadow(10px 20px 40px rgba(0 0 0 / 20%)); -webkit-border-radius: 15px; border-radius: 15px; }
body.single-work .flexible_content .colors .colors_wrap { display: flex; }
body.single-work .flexible_content .colors .colors_wrap .color { width: 100%; display: flex; align-items: space-between; align-content: space-between; }
body.single-work .flexible_content .colors .colors_wrap .color:nth-child(1), 
body.single-work .flexible_content .colors .colors_wrap .color:nth-child(2) { width: 50%; height: 400px; padding: 30px 50px; }
body.single-work .flexible_content .colors .colors_wrap .color .color_name { width: 100%; font-size: var(--size-h3); line-height: 100%; }
body.single-work .flexible_content .colors .colors_wrap .color .color_hex_rgb { font-size: 16px; font-weight: 700; text-transform: uppercase; }
body.single-work .flexible_content .colors .colors_wrap .color .color_hex_rgb > div { line-height: 20px; display: flex; }
body.single-work .flexible_content .colors .colors_wrap .color .color_hex_rgb > div .name { width: 120px; }

body.single-work .flexible_content .colors .colors_wrap .color:nth-child(n+3) { height: 70px; align-content: center; }
body.single-work .flexible_content .colors .colors_wrap .color:nth-child(n+3) .color_name { width: 50%; padding-left: 50px; }
body.single-work .flexible_content .colors .colors_wrap .color:nth-child(n+3) .color_hex_rgb { width: 50%; display: flex; align-items: center; }
body.single-work .flexible_content .colors .colors_wrap .color:nth-child(n+3) .color_hex_rgb > div { margin-right: 100px; }
body.single-work .flexible_content .colors .colors_wrap .color:nth-child(n+3) .color_hex_rgb > div:last-child { margin-right: 0; }
body.single-work .flexible_content .colors .colors_wrap .color:nth-child(n+3) .color_hex_rgb > div .name { width: 50px; }


/* Services */
#content .service_intro { margin-bottom: 100px; }
#content .service_intro_title { padding: 0 70px; }
#content .service_intro_title h1 { max-width: none; }
#content .service_intro_content { padding: 0 70px; }

#content .service_outro { margin-bottom: 200px; background: url(images/digitalform_service_01.jpg) no-repeat center; background-size: cover; position: relative; }
#content .service_outro:before { padding-top: 55%; display: block; content: ''; }
#content .service_outro .triangle-top-right { width: 0; height: 0; right: 0; top: 0; border-top: 100px solid var(--color-dark); border-left: 100px solid transparent; position: absolute; z-index: 2; }
#content .service_outro .triangle-bottom-left { width: 0; height: 0; right: 0; top: 0; border-bottom: 100px solid var(--color-red); border-right: 100px solid transparent; position: absolute; }

#content .services .service { margin-bottom: 200px; position: relative; } 
#content .services .service:last-child { margin-bottom: 0; } 
#content .services .service.custom_background { padding: 200px 0; background: rgba(0 0 0 / 20%); } 

#content .services .service .service_title { padding-left: 70px; }
#content .services .service .service_title h2 { color: #FFFFFF; position: relative; }
#content .services .service .service_title .count { left: -70px; bottom: 10px; font-size: 16px; color: var(--color-white-a60); line-height: 16px; position: absolute; }
#content .services .service .service_content { padding-left: calc(25% + 70px); padding-right: 70px; color: var(--color-white-a60); }

#content .services .service.left_align .service_title { padding-right: calc(25% + 70px); }
#content .services .service.left_align .service_content { padding-left: 70px; padding-right: calc(25% + 70px); }

#content .services .service.center_align .service_title { padding-left: calc(25% + 70px); padding-right: calc(25% + 70px); }
#content .services .service.center_align .service_content { padding-left: calc(25% + 70px); padding-right: calc(25% + 70px); }

#content .services .service .paroller { background-color: rgba(0 0 0 / 20%); background-repeat: no-repeat; background-position: center; background-size: cover; position: absolute; z-index: -1; }
#content .services .service .paroller_foreground { width: calc(50% - 140px); height: 500px; left: 70px; top: 20%; }
#content .services .service .paroller_foreground.paroller_foreground_2 { left: auto; right: 70px; }
#content .services .service .paroller_foreground .cover { width: 100%; height: 100%; left: 0; top: 0; background: rgba(23 23 23 / 80%); position: absolute; }

#content .services .service .paroller_background { width: calc(((100% - 1280px) /2) + (1280px / 4)); height: calc(100% + 100px); right: 0; top: -50px; }
#content .services .service.custom_background .paroller_background { height: 100%; top: 0; }

#content .logos { padding: 100px 0; background: rgba(0 0 0 / 20%); }
#content .logos .logos_wrap { display: flex; }
#content .logos .logos_wrap .logo { width: 25%; height: 200px; display: flex; justify-content: center; align-items: center; align-content: center; opacity: 0; }
#content .logos .logos_wrap .logo img { width: auto; max-width: 70%; height: auto; max-height: 120px; display: block; }

#content .logos .logos_wrap.reveal .logo { opacity: 100%; }

/* CONTACT */
#content .content_top { padding-bottom: 100px; color: #FFFFFF; }
#content .content_top a { color: #FFFFFF; }

#content .content_bottom { padding: 100px 0; color: var(--color-dark); background: #FFFFFF; }
#content .content_bottom h3 { color: var(--color-dark); }


/*
-----------------
	NEXT POST
-----------------
*/
#next_post { background: var(--color-red); position: relative; }
#next_post .inner { width: 100%; }
#next_post a {  width: 100%; padding: 100px 0; color: #FFFFFF; white-space: nowrap; display: flex; justify-content: center; flex-direction: row; position: relative; overflow: hidden; z-index: 2; }
#next_post h4 { width: 100%; margin-bottom: 30px; padding-left: 70px; font-size: var(--size-h4); font-weight: 500; text-transform: uppercase; line-height: 16px; }
#next_post .next_post_wrap { display: inline-flex; flex-wrap: nowrap; align-items: start; }
#next_post .next_post_wrap .item { margin-right: 100px; font-size: 3vw; line-height: 120%; }


/*
------------------------
	FLEXIBLE CONTENT
------------------------
*/
.flexible_content .fc_intro { margin-bottom: var(--fc-spacing); position: relative; }
.flexible_content .fc_intro h1 { max-width: none !important; padding: 0 70px; font-size: clamp(20px, 3vw, 28px) !important; line-height:  130% !important; }
.flexible_content .fc_intro .fc_intro_text { max-width: 75%; padding: 0 70px; font-size: clamp(32px, 5.5vw, 56px); line-height: 120%; }

.flexible_content .fc_large_image { margin-bottom: var(--fc-spacing); position: relative; }
.flexible_content .fc_large_image .fc_large_image_wrap { display: flex; }
.flexible_content .fc_large_image .fc_large_image_parallax { flex: 1; height: 80vh; background-repeat: no-repeat; background-position: center; background-size: cover; position: relative; overflow: hidden; }
.flexible_content .fc_large_image .fc_large_image_parallax.has_text { height: 70vh; }
.flexible_content .fc_large_image .fc_large_image_text { width: 25%; }
.flexible_content .fc_large_image .fc_large_image_text .text { top: var(--fc-spacing); padding-left: 70px; position: sticky; }
.flexible_content .fc_large_image .fc_large_image_text .text span { padding-bottom: 30px; font-size: 17px; line-height: 130%; display: block; position: relative; }
.flexible_content .fc_large_image .fc_large_image_text .text span:after { width: 100px; height: 1px; left: 0; bottom: 0; background: rgba(0 0 0 / 10%); position: absolute; content: ''; }

.flexible_content .fc_parallax_1 { padding-top: var(--fc-spacing); padding-bottom: var(--fc-spacing); color: #FFFFFF; background: var(--color-dark); position: relative; }
.flexible_content .fc_parallax_1 .fc_parallax_1_title { padding-left: 70px; }
.flexible_content .fc_parallax_1 .fc_parallax_1_title h2 { color: #FFFFFF !important; position: relative; }
.flexible_content .fc_parallax_1 .fc_parallax_1_title .count { left: -70px; bottom: 10px; font-size: 16px; color: var(--color-white-a60); line-height: 16px; position: absolute; }
.flexible_content .fc_parallax_1 .fc_parallax_1_text { padding-left: calc(25% + 70px); padding-right: 70px; color: var(--color-white-a60); }
.flexible_content .fc_parallax_1 .fc_parallax_1_text strong { color: #FFFFFF; }
.flexible_content .fc_parallax_1 .paroller_foreground { width: calc(50% - 140px); left: 70px; top: 20%; background-color: rgba(0 0 0 / 20%); background-repeat: no-repeat; background-position: center; background-size: cover; position: absolute; z-index: -1; }
.flexible_content .fc_parallax_1 .paroller_foreground:before { padding-top: 100%; display: block; content: ''; }
.flexible_content .fc_parallax_1 .paroller_foreground .cover { inset: 0; background: rgba(23 23 23 / 80%); position: absolute; }

.flexible_content .fc_parallax_2 { color: #FFFFFF; background: var(--color-dark); position: relative; }
.flexible_content .fc_parallax_2 .fc_parallax_2_wrap { display: flex; }
.flexible_content .fc_parallax_2 .fc_parallax_2_content { flex: 1; padding-top: var(--fc-spacing); padding-bottom: var(--fc-spacing); }
.flexible_content .fc_parallax_2.has_image .fc_parallax_2_content { padding-left: calc((100% - 1280px) / 2); padding-right: 100px; }
.flexible_content .fc_parallax_2 .fc_parallax_2_title { padding-left: 70px; }
.flexible_content .fc_parallax_2 .fc_parallax_2_title h2 { color: #FFFFFF !important; position: relative; }
.flexible_content .fc_parallax_2 .fc_parallax_2_title .count { left: -70px; bottom: 10px; font-size: 16px; color: var(--color-white-a60); line-height: 16px; position: absolute; }
.flexible_content .fc_parallax_2 .fc_parallax_2_text { padding-left: 70px; color: var(--color-white-a60); }
.flexible_content .fc_parallax_2 .fc_parallax_2_text strong { color: #FFFFFF; }
.flexible_content .fc_parallax_2 .paroller_background { width: calc(((100% - 1280px) /2) + (1280px / 4)); background-repeat: no-repeat; background-position: center; background-size: cover; }

.flexible_content + div { padding-top: 0; }

.flexible_content .fc_title_and_text { padding-top: var(--fc-spacing); padding-bottom: 50px; color: #FFFFFF; background: var(--color-dark); position: relative; }
.flexible_content .fc_title_and_text .fc_title_and_text_title { padding-left: 70px; }
.flexible_content .fc_title_and_text .fc_title_and_text_title h2 { margin-bottom: 50px !important; font-size: clamp(32px, 5vw, 60px) !important; color: #FFFFFF !important; position: relative; }
.flexible_content .fc_title_and_text .fc_title_and_text_title .count { left: -70px; bottom: 10px; font-size: 16px; color: var(--color-white-a60); line-height: 16px; position: absolute; }
.flexible_content .fc_title_and_text .fc_title_and_text_content { padding-left: calc(25% + 70px); font-size: clamp(20px, 2.5vw, 28px); line-height: 150%; }


/* 
--------------
	FOOTER 
--------------
*/
#footer { background: var(--color-dark); position: relative; }

/* Footer top */
#footer .footer_top { padding: 150px 0; color: #FFFFFF; position: relative; z-index: 2; }
#footer .footer_top .footer_top_part1_wrap { margin-bottom: 50px; padding: 0 70px; }
#footer .footer_top .footer_top_part1_wrap .text { font-size: clamp(30px, 6vw, 60px); line-height: 100%; }

#footer .footer_top .footer_top_part2_wrap { display: flex; align-items: center; justify-content: space-between; }
#footer .footer_top .footer_top_part2_wrap .wrap_left { flex: 1; padding: 0 70px; line-height: 160%; }
#footer .footer_top .footer_top_part2_wrap .wrap_right { padding: 0 70px; display: flex; }
#footer .footer_top .footer_top_part2_wrap .wrap_right .button { display: flex; }

#footer .footer_top .footer_top_part2_wrap .wrap_right .button_facebook { width: 80px; height: 80px; margin-left: 20px; font-size: 0; background: rgba(255 255 255 / 10%) url(images/icon-facebook-white.svg) no-repeat center / auto 32px; display: block; border-radius: 50%; }
#footer .footer_top .footer_top_part2_wrap .wrap_right .button_facebook:hover { background-color: rgba(255 255 255 / 15%); }

#footer .footer_top .footer_top_part3_wrap { padding-top: 70px; display: flex; align-items: center; }
#footer .footer_top .footer_top_part3_wrap .wrap_left { width: 50%; padding: 0 70px; }
#footer .footer_top .footer_top_part3_wrap h4 { margin-bottom: 30px; font-size: var(--size-h4); font-weight: 500; text-transform: uppercase; line-height: 16px; }
#footer .footer_top .footer_top_part3_wrap a { font-size: var(--size-h3); color: #FFFFFF; position: relative; }
#footer .footer_top .footer_top_part3_wrap a:after { width: 100%; height: 1px; right: 0; bottom: 0; background: #FFFFFF; position: absolute; content: ''; } 
#footer .footer_top .footer_top_part3_wrap a:hover:after { width: 0; } 

/* Footer center */
#footer .footer_center { padding: 50px 0 150px; color: #FFFFFF; }
#footer .footer_center .footer_center_wrap {  }

/* Footer bottom */
#footer .footer_bottom { padding: 20px 0; font-size: 15px; color: var(--color-dark); background: #FFFFFF; position: relative; z-index: 2; }
#footer .footer_bottom .footer_bottom_wrap { display: flex; justify-content: space-between; }
#footer .footer_bottom .footer_bottom_wrap .wrap_right ul { display: flex; }
#footer .footer_bottom .footer_bottom_wrap .wrap_right ul li { margin-left: 20px; }
#footer .footer_bottom .footer_bottom_wrap .wrap_right ul li a { text-decoration: underline; color: var(--color-dark); }
#footer .footer_bottom .footer_bottom_wrap .wrap_right ul li a:hover { color: var(--color-red); }


/* 
--------------------
	CONTACT FORM
--------------------
*/
.wpcf7 form { display: flex; justify-content: space-between; }

.wpcf7 a:after { background: var(--color-dark) !important; }

.wpcf7 .form_row { width: 100%; margin-bottom: 20px; }
.wpcf7 .form_row.form_row_first, 
.wpcf7 .form_row.form_row_last { width: calc(50% - 70px); }

.wpcf7 .form_row p { margin-bottom: 0 !important; }
.wpcf7 .form_row label { font-size: var(--size-h4); font-weight: 500; text-transform: uppercase; color: var(--color-gray); line-height: 16px; }

.wpcf7 .form_row select, 
.wpcf7 .form_row textarea, 
.wpcf7 .form_row input[type=tel], 
.wpcf7 .form_row input[type=text], 
.wpcf7 .form_row input[type=email] { width: 100%; height: 60px; padding-left: 20px; font-size: 17px; background: var(--color-silver); border-bottom: 2px solid var(--color-silver); -webkit-transition: all 0.3s ease-out; transition: all 0.3s ease-out; }

.wpcf7 .form_row select:focus, 
.wpcf7 .form_row textarea:focus, 
.wpcf7 .form_row input[type=tel]:focus, 
.wpcf7 .form_row input[type=text]:focus, 
.wpcf7 .form_row input[type=email]:focus { border-bottom-color: var(--color-dark); }

.wpcf7 .form_row textarea { min-height: 200px; padding: 20px; resize: vertical; }

.wpcf7 .wpcf7-checkbox { display: flex; }
.wpcf7 .wpcf7-checkbox .wpcf7-list-item { margin: 0 20px 20px 0; }
.wpcf7 .wpcf7-checkbox .wpcf7-list-item label { font-size: initial; text-transform: none; color: var(--color-dark); cursor: pointer; }

.wpcf7 .wpcf7-form-control-wrap { display: block; position: relative; }
.wpcf7 .wpcf7-not-valid-tip { width: auto; height: 60px; right: 20px; top: 0; font-size: 14px; font-weight: 700; color: var(--color-red); display: flex; align-items: center; position: absolute; }

.hidden-fields-container { width: 100%; }

.wpcf7 .wpcf7-acceptance { text-transform: none !important; }
.wpcf7 .wpcf7-acceptance a { text-transform: none !important; text-decoration: underline !important; color: var(--color-dark) !important; }
.wpcf7 .wpcf7-acceptance a:hover { text-decoration: none !important; }
.wpcf7 .wpcf7-acceptance label { font-size: 16px !important; text-transform: none !important; color: var(--color-dark); }


/*
---------------
	LOADING
---------------
*/
.loader { width: 100%; height: 100%; left: 0; top: 0; color: #FFFFFF; background: var(--color-dark); display: flex; justify-content: center; align-items: center; align-content: center; position: fixed; z-index: 10000; }
.loader img { width: auto; height: 60px; top: 70px; position: relative; top: 0; -webkit-transform: skewY(0); transform: skewY(0); opacity: 100%; }
.loader div { width: 100%; text-align: center; }

.loader.loader_1 { visibility: visible; opacity: 100%; }

.loader.loader_2 { visibility: hidden; opacity: 0; transition: all 0.5s ease; }
.loader.loader_2 img { top: 30px; -webkit-transform: skewY(5deg); transform: skewY(5deg); opacity: 0%; }
.loader.loader_2.active { visibility: visible; opacity: 100%; }
.loader.loader_2.reveal_skew img { top: 0; -webkit-transform: skewY(0); transform: skewY(0); opacity: 100%; transition: all 0.5s ease; }

.loader.loader_1 { animation-name: loader_1_animation; animation-duration: 0.5s; animation-delay: 0s; animation-fill-mode: forwards; animation-timing-function: ease-in; }
.loader.loader_1 img { animation-name: loader_1_img_animation; animation-duration: 0.5s; animation-delay: 0s; animation-fill-mode: forwards; }


/*
-----------------
	KEYFRAMES
-----------------
*/
@keyframes loader_1_animation {
	0% { 
		height: 100%;
	} 100% {
		height: 0;
	}
}

@keyframes loader_1_img_animation {
	100% {
		top: -30px;
		-webkit-transform: skewY(-5deg); transform: skewY(-5deg); opacity: 0%;
	}
}

@keyframes header_animation {
	0% { 
		top: -100px;
	} 100% {
		top: 0%;
	}
}

@keyframes intro_animation {
	100% {
		top: 0; -webkit-transform: skewY(0); transform: skewY(0); opacity: 100%;
	}
}

@keyframes hero_animation {
	0% { 
		height: 100vh;
	} 100% {
		height: 80vh;
	}
}

@keyframes blink {
	0%, 100% {
		opacity: 0;
	} 50% {
		opacity: 1;
	}
}

@keyframes skew_animation_reveal {
	100% {
		top: 0; -webkit-transform: skewY(0); transform: skewY(0); opacity: 100%; 
	}
}

@keyframes progress_bar_animation {
	100% {
		opacity: 100%; 
	}
}


/*
-----------------
	SCROLL UP
-----------------
*/
#scroll_up { width: 50px; height: 50px; left: 50%; bottom: 50px; background: var(--color-red) url(images/icon-arrow-up-white.svg) no-repeat center; background-size: 16px auto; display: none; position: fixed; z-index: 100; cursor: pointer; -webkit-border-radius: 50%; border-radius: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); box-shadow: 0 0 10px rgba(0 0 0 / 15%); }


/*
-----------
	RWD
-----------
*/
@media only screen and (max-width: 1440px) {
	
	/* HEADER: Logo */
	#header .logo { left: 30px; }
	
	/* HEADER: Contact */
	#header a.contact_menu_item { right: 20px; }
	
	/* INTRO */
	#intro .intro_wrap { max-width: none; padding-left: 30px; padding-right: 30px; }
	#intro .intro_wrap .title_wrap .title { font-size: 6vw; }
	
	/* SLIDER */
	#slider { padding-left: 100px; }
	#slider .slides { height: 700px; }
	
	/* FLEXIBLE CONTENT */
	.flexible_content .fc_intro h1 { padding: 0 30px; }
	.flexible_content .fc_intro .fc_intro_text { padding: 0 30px; }
}

@media only screen and (max-width: 1280px) { 

	/* DISPLAY: None */
	.hide_in_1280 { display: none !important; }
	
	/* DEFAULT */
	.p_l_20 { padding-left: 30px; }
	.p_r_20 { padding-right: 30px; }
	
	/* INTRO */
	#intro .intro_wrap { padding-left: 20px; padding-right: 20px; }
	
	/* SLIDER */
	#slider { padding-left: 30px; }
	#slider .slides { height: 600px; }
	
	/* ABOUT US */
	#aboutus { padding-top: 100px; }
	#aboutus .aboutus_title { width: 100%; padding-left: 30px; }
	#aboutus .aboutus_text { padding-left: 50px; padding-right: 30px; }

	/* SERVICES */
	#services { padding-top: 100px; padding-bottom: 100px; }
	#services .services_marquee div { font-size: 12vw; }
	
	/* FEATURED POSTS */
	#featured_works { padding: 100px 0; }
	#featured_works .featured_works_text { padding-left: 0; padding-right: 0; } 
	#featured_works .featured_works_wrap { margin-left: -30px; margin-right: -30px; } 
	
	.featured_works_wrap .post { width: calc(100% - 60px); }
	.featured_works_wrap .post { margin-left: 30px; margin-right: 30px; }
	
	body.page-template-works .featured_works_wrap { margin-left: -30px; margin-right: -30px; }
	body.page-template-works .featured_works_wrap .post { width: calc(50% - 60px); }
	
	/* MORE CLIENTS */
	#more_clients .more_clients_wrap { padding: 0; }
	
	/* CONTENT */
	#content .content_wrap { padding: 0; }
	#content blockquote { margin: 0 0 20px; }
	
	/* CONTENT: Work */
	body.single-work .meta .meta_left .meta_left_left { padding: 0 30px; }
	body.single-work .meta .meta_left .meta_left_right { padding: 0 30px; }
	body.single-work .meta .meta_right { padding: 0 30px; }
	
	body.single-work .flexible_content .three_mobile_screenshot_wrap picture { padding: 0 20px; }
	
	body.single-work .flexible_content .only_text { padding: 100px 0; }
	body.single-work .flexible_content .only_text .only_text_wrap { padding: 0 30px; }
	
	/* CONTENT: Services */
	#content .service_intro_title { padding: 0; }
	#content .service_intro_content { padding: 0; }
	
	#content .service_outro { margin-bottom: 100px; }
	
	#content .services .service { margin-bottom: 100px; } 
	#content .services .service:last-child { margin-bottom: 0; } 
	#content .services .service.custom_background { padding: 100px 0; } 
	
	#content .services .service .service_title .count { left: -40px; }
	#content .services .service .service_content { padding-left: 50px; padding-right: 20px; }

	#content .services .service .paroller_foreground { width: calc(50% - 60px); height: 400px; left: 30px; }
	#content .services .service .paroller_foreground.paroller_foreground_2 { right: 30px; }
	
	/* CONTENT: Blog */
	#content .news_wrap article { gap: 60px; }
	#content .news_wrap article .thumbnail, 
	#content .news_wrap article .entry { width: calc(50% - 30px); }
	
	/* FLEXIBLE CONTENT */
	.flexible_content .fc_intro h1 { padding: 0; }
	.flexible_content .fc_intro .fc_intro_text { padding: 0; }
	
	/* CONTACT FORM */
	.wpcf7 .form_row.form_row_first, 
	.wpcf7 .form_row.form_row_last { width: calc(50% - 20px); }
	
	/* NEXT POST */
	#next_post h4 { padding-left: 0; }
	#next_post .next_post_wrap .item { font-size: clamp(20px, 5vw, 48px); }
	
	/* FLEXIBLE CONTENT */
	.flexible_content .fc_parallax_2.has_image .fc_parallax_2_content { padding-left: 30px; padding-right: 50px; }
	.flexible_content .fc_parallax_2 .paroller_background { width: 25%; }
	
	/* CLIENTS GRID */
	.clients_grid ul li .client_name { padding: 0; }
	.clients_grid ul li .client_year, 
	.clients_grid ul li .client_category { padding-left: 20px; }
	
	/* FOOTER: Footer top */
	#footer .footer_top { padding: 100px 0; }
	#footer .footer_top .footer_top_part1_wrap { padding: 0; }
	#footer .footer_top .footer_top_part2_wrap .wrap_left { padding: 0; }
	#footer .footer_top .footer_top_part2_wrap .wrap_right { padding: 0; }
	
	#footer .footer_top .footer_top_part3_wrap .wrap_left { width: 50%; padding: 0; }
	#footer .footer_top .footer_top_part3_wrap .wrap_left:nth-child(2) { padding-left: 30px; }
}

@media only screen and (max-width: 960px) {
	
	:root {
		--fc-spacing: 100px;
	}
	
	/* DISPLAY: None */
	.hide_in_960 { display: none !important; }
	
	/* DISPLAY: Block */
	.show_in_960 { display: block !important; }
	
	/* DEFAULT */
	.p_l_20 { padding-left: 20px; }
	.p_r_20 { padding-right: 20px; }
	
	/* HEADER: Logo */
	#header .logo { left: 20px; }
	
	/* HEADER: Contact */
	#header a.contact_menu_item { right: 10px; }
	
	/* INTRO */
	#intro { height: calc(100vh - 200px); }
	#intro .intro_wrap { padding-bottom: 50px; }
	#intro .intro_wrap .title_wrap .title { font-size: 7vw; }
	
	/* SLIDER */
	#slider { padding-left: 20px; }
	#slider .slides { height: 500px; }
	#slider .slides .item { background-size: 120% auto; }
	
	/* ABOUT US */
	#aboutus .aboutus_title { padding-left: 20px; }
	#aboutus .aboutus_text { padding-right: 20px; }
	
	/* SERVICES */
	#services .services_marquee div { font-size: 13vw; }
	
	#services .services_wrap .service { margin-top: 100px; padding: 0 20px 0 0; }
	#services .services_wrap .service:nth-child(even) { padding: 0 20px; }
	#services .services_wrap .service .service_title .count { display: none; }
	
	/* FEATURED POSTS */
	#featured_works .featured_works_wrap { margin-left: -20px; margin-right: -20px; } 
	
	.featured_works_wrap .post { width: calc(100% - 40px); margin-top: 50px; margin-left: 20px; margin-right: 20px; }
	.featured_works_wrap .post picture { margin-bottom: 20px; }
	
	body.page-template-works .featured_works_wrap { margin-left: -20px; margin-right: -20px; }
	body.page-template-works .featured_works_wrap .post { width: calc(50% - 40px); }
	body.page-template-works .featured_works_wrap .post:nth-child(even) { margin-top: 100px; }
	
	/* MORE CLIENTS */
	#more_clients { padding: 0 0 100px; }
	
	/* CONTENT: Work */
	body.single-work .meta { padding: 50px 0; }
	body.single-work .meta .meta_left { width: 100%; margin-bottom: 50px; }
	body.single-work .meta .meta_left .meta_left_left { padding: 0 20px; }
	body.single-work .meta .meta_left .meta_left_right { padding: 0 20px; }
	body.single-work .meta .meta_right { width: 100%; padding: 0 20px; }
	
	body.single-work .flexible_content .images .image { flex-grow: inherit; flex-basis: auto; }
	
	body.single-work .flexible_content .two_mobile_screenshot { padding: 50px 0; }
	body.single-work .flexible_content .two_mobile_screenshot_wrap picture { width: 50%; padding: 0 50px; }
	body.single-work .flexible_content .two_mobile_screenshot_wrap picture:nth-child(3) { display: none; }
	
	body.single-work .flexible_content .colors .colors_wrap .color:nth-child(1), 
	body.single-work .flexible_content .colors .colors_wrap .color:nth-child(2) { width: 100%; height: 300px; padding: 20px 30px; }
	body.single-work .flexible_content .colors .colors_wrap .color:nth-child(n+3) { height: auto; padding: 30px; }
	body.single-work .flexible_content .colors .colors_wrap .color:nth-child(n+3) .color_name { width: 100%; margin-bottom: 20px; padding-left: 0; }
	body.single-work .flexible_content .colors .colors_wrap .color:nth-child(n+3) .color_hex_rgb { width: 100%; }
	
	/* CONTENT: Services */
	#content .service_outro .triangle-top-right { border-top-width: 75px; border-left-width: 75px; }
	#content .service_outro .triangle-bottom-left { border-bottom-width: 75px; border-right-width: 75px; }

	#content .services .service .service_title { padding-left: 20px; }
	#content .services .service .service_title .count { display: none; }

	#content .services .service.left_align .service_title { padding-right: calc(25% + 100px); }
	#content .services .service.left_align .service_content { padding-left: 20px; padding-right: calc(25% + 100px); }

	#content .services .service.center_align .service_title { padding-left: 50px; padding-right: 20px; }
	#content .services .service.center_align .service_content { padding-left: 50px; padding-right: 20px; }

	#content .services .service .paroller_foreground { width: calc(50% - 40px); left: 20px; }
	#content .services .service .paroller_foreground.paroller_foreground_2 { display: none; }
	
	#content .services .service .paroller_background { width: 25%; background-size: auto 120%; }
	
	/* CONTENT: Blog */
	body.archive.category #content h1 video { width: 30%; height: auto; }

	#content .blog_intro { max-width: none; margin-bottom: 50px; }
	
	#content .news_wrap article { gap: 30px; }
	#content .news_wrap article .thumbnail { width: 100%; }
	#content .news_wrap article .entry { width: 100%; }
	
	/* NEXT POST */
	#next_post .next_post_wrap .item { font-size: 6vw; }
	
	/* FLEXIBLE CONTENT */
	.fc_parallax + .fc_parallax { padding-bottom: 20px !important; }
	
	.flexible_content .fc_intro .fc_intro_text { max-width: none; line-height: 130%; }
	
	.flexible_content .fc_large_image .fc_large_image_text { display: none; }
	.flexible_content .fc_large_image .fc_large_image_parallax.has_text { height: 50vh; }
	
	.flexible_content .fc_parallax_1 .fc_parallax_1_title { padding-left: 0; }
	.flexible_content .fc_parallax_1 .fc_parallax_1_title .count { display: none; }
	.flexible_content .fc_parallax_1 .fc_parallax_1_text { padding-left: 0; padding-right: 0; }
	.flexible_content .fc_parallax_1 .paroller_foreground { width: calc(50% + 10px); left: 40px; }
	
	.flexible_content .fc_parallax_2.has_image .fc_parallax_2_content { padding-left: 20px; padding-right: 20px; }
	.flexible_content .fc_parallax_2 .fc_parallax_2_title { padding-left: 0; }
	.flexible_content .fc_parallax_2 .fc_parallax_2_title .count { display: none; }
	.flexible_content .fc_parallax_2 .fc_parallax_2_text { padding-left: 0; }
	.flexible_content .fc_parallax_2 .paroller_background { width: 100%; }
	.flexible_content .fc_parallax_2 .paroller_background:before { padding-top: 100%; display: block; content: ''; }
	
	.flexible_content .fc_title_and_text .fc_title_and_text_title { padding-left: 0; }
	.flexible_content .fc_title_and_text .fc_title_and_text_title .count { display: none; }
	.flexible_content .fc_title_and_text .fc_title_and_text_content { padding-left: 0; }
	
	/* CLIENTS GRID */
	.clients_grid { margin-top: 50px; padding: 50px 0; }
}

/* PORTRAIT – max 960px */
@media only screen and (max-width: 960px) and (orientation: portrait) {

	@keyframes hero_animation {
		0% {
			height: 100vh;
		}
		100% {
			height: 50vh;
		}
	}

}

/* LANDSCAPE – max 960px */
@media only screen and (max-width: 960px) and (orientation: landscape) {
	
	/* ROTATE WARNING */
	.rotate_warning { display: flex; }

	@keyframes hero_animation {
		0% {
			height: 100vh;
		}
		100% {
			height: 80vh;
		}
	}

}

@media only screen and (max-width: 768px) { 
	
	:root { 
		--size-h2: calc(clamp(3em, 5vw, 4.5em) * .6);
	}
	
	/* RWD NAV */
	#rwd_menu .rwd_menu_wrap { width: calc(100% - 50px); } 
	
	/* GRIDS */
	.grids .grid.grid_2 { left: 33.3333333333%; }
	.grids .grid.grid_3 { left: 66.66666666666%; }
	.grids .grid.grid_4, 
	.grids .grid.grid_5 { display: none !important; }
	
	/* INTRO */
	#intro .intro_wrap .title_wrap .title { }
	
	/* SLIDER */
	#slider .slides { height: 400px; }
	#slider .slides .item { margin-top: 0px; transform: none !important; will-change: auto; }
	
	/* SERVICES */
	#services .services_marquee div { font-size: 15vw; }
	
	/* CONTENT */
	#content { padding: 150px 0; }
	
	/* CONTENT: Work */
	body.single-work .flexible_content .full_image.is_screenshot { padding: 50px 0; }
	body.single-work .flexible_content .full_image.is_screenshot .image_wrap { margin: 0; }
	body.single-work .flexible_content .full_image.is_screenshot .image_wrap picture img { -webkit-border-radius: 10px; border-radius: 10px; }

	body.single-work .flexible_content .two_mobile_screenshot picture { padding: 0 20px; }
	body.single-work .flexible_content .two_mobile_screenshot picture:nth-child(1) { padding-left: 0; }
	body.single-work .flexible_content .two_mobile_screenshot picture:nth-child(2) { padding-right: 0; }
	body.single-work .flexible_content .two_mobile_screenshot_wrap picture img { -webkit-border-radius: 10px; border-radius: 10px; }
	
	body.single-work .flexible_content .three_mobile_screenshot { padding: 50px 0; }
	body.single-work .flexible_content .three_mobile_screenshot_wrap picture { width: 50%; }
	body.single-work .flexible_content .three_mobile_screenshot_wrap picture:nth-child(1) { padding-left: 0; }
	body.single-work .flexible_content .three_mobile_screenshot_wrap picture:nth-child(2) { padding-right: 0; }
	body.single-work .flexible_content .three_mobile_screenshot_wrap picture:nth-child(3) { display: none; }
	
	body.single-work .flexible_content .only_text { padding: 50px 0; }
	body.single-work .flexible_content .only_text .only_text_wrap { padding: 0; }
	
	body.single-work .flexible_content .video { padding: 50px 0; }
	
	/* CONTENT: Services */
	#content .services .service.left_align .service_title { padding-right: calc(33.3333333333% + 20px); }
	#content .services .service.left_align .service_content { padding-right: calc(33.3333333333% + 20px); margin-bottom: 100px; }
	
	#content .services .service .paroller_foreground { width: calc(66.6666666666% - 40px); }
	#content .services .service .paroller_foreground.paroller_foreground_2 { right: 30px; }
	
	#content .services .service .paroller_background { width: 33.3333333333%; }
	
	#content .logos .logos_wrap .logo { width: 33.3333333333%; }
	
	/* CLIENTS GRID */
	.clients_grid ul li .client_name { width: 100%; }

	.clients_grid ul li .client_year, 
	.clients_grid ul li .client_category { width: auto; margin-right: 20px; padding-left: 0; }
	.clients_grid .image_reveal { width: 33.3333333333%; } 
	
	/* CONTACT FORM */
	.wpcf7 .form_row.form_row_first, 
	.wpcf7 .form_row.form_row_last { width: 100%; }
	
	.wpcf7 .wpcf7-checkbox .wpcf7-list-item { width: 100%; margin: 0 0 10px 0; display: block; }
	
	/* NEXT POST */
	#next_post a { padding: 50px 0; }
	#next_post .next_post_wrap .item { font-size: 7vw; }
	
	/* FOOTER: Footer top */
	#footer .footer_top .footer_top_part2_wrap .wrap_left { width: 100%; margin-bottom: 30px; }
	#footer .footer_top .footer_top_part2_wrap .wrap_right { width: 100%; }
	#footer .footer_top .footer_top_part2_wrap .wrap_right .button { width: auto; padding: 0 50px; display: inline-flex; }
	#footer .footer_top .footer_top_part3_wrap { padding-top: 50px; }
	#footer .footer_top .footer_top_part3_wrap .wrap_left { width: 100%; padding: 0; }
	#footer .footer_top .footer_top_part3_wrap .wrap_left:nth-child(2) { padding-left: 0; padding-top: 30px; }
	#footer .footer_top .footer_top_part3_wrap h4 { margin-bottom: 20px; }
	
	/* FOOTER: Footer bottom */
	#footer .footer_bottom .footer_bottom_wrap .wrap_left { width: 100%; order: 2; }
	#footer .footer_bottom .footer_bottom_wrap .wrap_right { order: 1; }
	#footer .footer_bottom .footer_bottom_wrap .wrap_right ul li { margin-left: 0; margin-right: 20px; }
	
	/* SCROLL UP */
	#scroll_up { left: auto; right: 20px; bottom: 20px; -webkit-transform: translateX(0); transform: translateX(0); }
}


@media only screen and (max-width: 640px) { 
	
	/*
	:root {
		--size-h3: 22px;
	}
	*/
	
	/* INTRO */
	#intro .intro_wrap .title_wrap .title { font-size: 10vw; }
	#intro .intro_wrap .typing-text { display: block; }
	
	/* SLIDER */
	#slider .slides { height: 300px; }
	
	/* SERVICES */
	#services .services_marquee div { font-size: 16vw; }
	#services .services_marquee .marquee_top { margin: 10px 0; }
	#services .services_marquee .marquee_bottom { margin: 10px 0; }
	
	#services .services_wrap .service { width: 100%; margin-top: 100px; padding-right: 50px; }
	#services .services_wrap .service:nth-child(even) { padding-left: 50px; padding-right: 0; }
	#services .services_wrap .service:nth-child(1) { margin-top: 0; }
	#services .services_wrap .service:nth-child(2) { margin-top: 100px; }
	#services .services_wrap .service:nth-child(3) { margin-top: 100px; }

	/* FEATURED POSTS */
	#featured_works .featured_works_wrap { margin-top: 50px; }
	#featured_works .featured_works_wrap .wrap_left { width: 100%; display: flex; }
	#featured_works .featured_works_wrap .wrap_right { width: 100%; height: auto; right: auto; top: auto; display: flex; position: relative; }
	#featured_works .featured_works_wrap .wrap_right .post:first-child { margin-top: 100px !important; }
	
	#featured_works .featured_works_wrap .post { width: 100%; }
	
	body.page-template-works .featured_works_wrap .post { width: 100%; margin-top: 100px !important; }
	body.page-template-works .featured_works_wrap .post:first-child { margin-top: 50px !important; }
	
	/* TABLE OF CONTENT */
	.ez-toc-counter ul li a { display: ruby !important; }
	
	/* CONTENT: Work */
	body.single-work .meta .meta_left .meta_left_left { width: 100%; margin-bottom: 50px; }
	body.single-work .meta .meta_left .meta_left_right { width: 100%; }
	
	body.single-work .flexible_content .full_image.is_screenshot .image_wrap picture img { -webkit-border-radius: 5px; border-radius: 5px; }
	
	body.single-work .flexible_content .two_mobile_screenshot_wrap picture { width: 100%; margin-top: 40px; padding: 0; -webkit-transition-delay: 0s !important; transition-delay: 0s !important; }
	body.single-work .flexible_content .two_mobile_screenshot_wrap picture:nth-child(1) { margin-top: 0; }
	body.single-work .flexible_content .two_mobile_screenshot_wrap picture img { width: 100%; -webkit-border-radius: 5px; border-radius: 5px; }
	
	/* CONTENT: Services */
	#content .services .service.custom_background { padding-bottom: 0; } 
	
	#content .services .service.left_align .service_title { padding-right: 20px; }
	#content .services .service.left_align .service_content { padding-right: 50px; }
	
	#content .services .service .paroller_foreground { width: calc(66.6666666666% - 40px); }
	#content .services .service .paroller_foreground.paroller_foreground_2 { right: 30px; }
	
	#content .services .service .paroller_background { width: 100%; left: auto; right: auto; background-size: cover; position: relative; }
	#content .services .service .paroller_background:before { padding-top: 50%; display: block; content: ''; }
	
	#content .logos .logos_wrap .logo { height: 150px; }
	#content .logos .logos_wrap .logo img { max-height: 100px; }

	/* NEXT POST */
	#next_post .next_post_wrap .item { font-size: 8vw; }
	
	/* FLEXIBLE CONTENT */
	.flexible_content .button { width: 100%; max-width: calc(100% - 70px); }
}

@media only screen and (max-width: 480px) { 
	
	/* DEFAULT */
	.fullwidth_in_480 { width: 100% !important; }
	
	a.has_arrow:before { display: none; }
	a.has_arrow:after { display: none; }
	a.has_arrow:hover { padding-left: 0; }
	
	/* RWD NAV */
	#rwd_menu .rwd_menu_wrap { width: 100%; padding: 100px 20px 40px; } 
	
	/* INTRO */	
	#intro .intro_wrap .title_wrap .title { font-size: 12vw; }
	#intro .intro_wrap .action_buttons { padding-top: 30px; border-top: 1px solid #ddd; display: flex; justify-content: space-between; }
	#intro .intro_wrap .action_buttons a { margin-right: 0; font-size: 16px; }
	
	/* SLIDER */
	#slider .slides { height: 250px; }
	#slider .slides .slick-slide { background-size: auto 120%; }
	
	/* SERVICES */
	#services .services_marquee div { font-size: 18vw; }
	#services .services_marquee .marquee_top, 
	#services .services_marquee .marquee_bottom { margin: 20px 0; }
	
	/* CONTENT */
	#content h3 { line-height: 130%; }
	#content ul { margin-left: 30px; }
	#content blockquote { padding: 30px 80px 30px 30px; }
	
	/* CONTENT: Work */
	body.is_loaded #content .hero { height: 50vh; }
	
	/* CONTENT: Services */
	#content .logos .logos_wrap .logo { height: 120px; }
	#content .logos .logos_wrap .logo img { max-width: 60%; max-height: 80px; }
	
	body.archive.category #content h1 { line-height: 110%; display: flex; }
	body.archive.category #content h1 span { display: contents; }
	body.archive.category #content h1 video { width: 100%; height: auto; margin: 20px 0 0; order: 100; }
	
	/* NEXT POST */
	#next_post .next_post_wrap .item { font-size: 9vw; }
	
	/* TABLE OF CONTENT */
	.ez-toc-counter { padding: 30px !important; }
	
	/* FOOTER: Footer bottom */
	#footer .footer_bottom .footer_bottom_wrap .wrap_right ul li {  }

	/* LOADING */
	.loader img { height: 40px; }
	
	/* FORM */
	.wpcf7 .button { width: 100%; }
}