/*

Theme Name: Blending Trends
Theme URI: https://www.blendingtrends.com/
Author: Hamid Shavarean
Version: 1.0

*/

@import 'css/normalize.css';
@import url('css/Textify.min.css');
@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@200..800&family=Playfair+Display:ital,wght@0,400..900;1,400..900&display=swap');
@import url('https://unpkg.com/aos@2.3.1/dist/aos.css');
@import url('https://cdn.jsdelivr.net/npm/@splidejs/splide@4.1.4/dist/css/splide.min.css');

:root {
  --first: #FFFFFF;
  --second: #101E34;
  --third: #ED2121;
  --fourth: #211F5E;
  --fifth: #4040E3;
  --sixth: #FC799B;
  --seventh:#13AE5C;
  --eighth: #BBF6E2;
  --ninth: #4B5563;
  --tenth: #F9FAFB;
}

.pace {
	-webkit-pointer-events: none;
	pointer-events: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	user-select: none;
}

.pace-inactive {
	display: none;
}

.pace .pace-progress {
	background: var(--first);
	position: fixed;
	z-index: 2000;
	top: 0;
	right: 100%;
	width: 100%;
	height: 2px;
}

.pace .pace-progress-inner {
	display: block;
	position: absolute;
	right: 0px;
	width: 100px;
	height: 100%;
	box-shadow: 0 0 10px var(--first), 0 0 5px var(--first);
	opacity: 1.0;
	-webkit-transform: rotate(3deg) translate(0px, -4px);
	-moz-transform: rotate(3deg) translate(0px, -4px);
	-ms-transform: rotate(3deg) translate(0px, -4px);
	-o-transform: rotate(3deg) translate(0px, -4px);
	transform: rotate(3deg) translate(0px, -4px);
}

.pace .pace-activity {
	display: block;
	position: fixed;
	z-index: 2000;
	top: 15px;
	left: 15px;
	width: 14px;
	height: 14px;
	border: solid 2px transparent;
	border-top-color: var(--first);
	border-left-color: var(--first);
	border-radius: 10px;
	-webkit-animation: pace-spinner 400ms linear infinite;
	-moz-animation: pace-spinner 400ms linear infinite;
	-ms-animation: pace-spinner 400ms linear infinite;
	-o-animation: pace-spinner 400ms linear infinite;
	animation: pace-spinner 400ms linear infinite;
}

@-webkit-keyframes pace-spinner {
	0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); }
	100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
}
@-moz-keyframes pace-spinner {
	0% { -moz-transform: rotate(0deg); transform: rotate(0deg); }
	100% { -moz-transform: rotate(360deg); transform: rotate(360deg); }
}
@-o-keyframes pace-spinner {
	0% { -o-transform: rotate(0deg); transform: rotate(0deg); }
	100% { -o-transform: rotate(360deg); transform: rotate(360deg); }
}
@-ms-keyframes pace-spinner {
	0% { -ms-transform: rotate(0deg); transform: rotate(0deg); }
	100% { -ms-transform: rotate(360deg); transform: rotate(360deg); }
}
@keyframes pace-spinner {
	0% { transform: rotate(0deg); transform: rotate(0deg); }
	100% { transform: rotate(360deg); transform: rotate(360deg); }
}

html, body {
  height:100%;
}

/* Body */
body {
  cursor:default;
  background:var(--first);
  color:var(--second);
  margin:0;
  padding:0;
  overflow-x:hidden;
  -webkit-tap-highlight-color:rgba(0,0,0,0);
  font-family: "Manrope", sans-serif;
  font-optical-sizing: auto;
  font-weight:400;
  width:100%;
  height:100%;
  display: table;
}

body.no-scroll {
  overflow: hidden;
  height: 100%;
}

::selection {
  color:var(--first);
  background:var(--second);
/* Safari */
}

::-moz-selection {
  color:var(--second);
  background:var(--first);
/* Firefox */
}

.button, img, input, button, label, header {
	user-select: none;
	-webkit-user-select: none;
}

b, strong {
  font-weight:700;
}

a {
  color:var(--second);
  text-decoration:none;
}

a:hover {
  color:var(--third);
  text-decoration:none;
}

.wrapper {
	/* width:100%; */
	max-width:1240px;
	padding:1.5rem;
	margin:0 auto;
}

header {
	position:fixed;
	width:100%;
	top:0;
	left:0;
	background:var(--third);
	background: linear-gradient(0deg,rgba(237, 33, 33, 0) 0%, var(--third));
	transition: top .3s ease-out;
	backdrop-filter: blur(0);
	z-index:99;
}

header.home {
	background:none;
}

header.hide {
	top:-6.5rem;
}

header .wrapper {
	width:initial;
	display:flex;
	justify-content: space-between;
	align-items: center;
}

.blending-trends {
	width:100%;
	max-width:12rem;
	display:flex;
	min-height:56px;
}

.blending-trends svg {
	width:100%;
	height:auto;
}

.blending-trends svg path {
	fill: var(--first);
	stroke: var(--first);
	transition: stroke .15s ease-out;
}

.blending-trends:hover svg g g:last-child g path {
	stroke:var(--second);
}

header.home .blending-trends:hover svg g g:last-child g path {
	stroke:var(--third);
}


header nav {
	display: flex;
	align-items: center;
}

header nav ul {
	list-style:none;
	display:flex;
	gap: 1.5rem;
	margin: 0;
	padding: 0;
}

header nav ul li {
	position:relative;
}

header nav ul li a {
	text-transform:uppercase;
	font-weight: 700;
	color:var(--first);
}

header nav ul li ul {
	position:absolute;
	width:max-content;
	left:0;
	top:0;
	margin:0;
	padding:2rem 0 0 0;
	display:none;
	flex-direction: column;
	gap:1rem;
	overflow:hidden;
}

header nav ul li ul li {
	width:100%;
	padding:0;
	margin:0;
}

header nav ul li.menu-item-has-children a:first-child {
	display: flex;
	align-items: center;
}

header nav ul li.menu-item-has-children a:first-child:after {
	display:block;
	content:'';
	width:6px;
	height:6px;
	border-left:2px solid var(--fourth);
	border-bottom:2px solid var(--fourth);
	transform:rotate(-45deg);
	margin-left:.5rem;
	margin-bottom:.25rem;
	top:0;
	right:0;
	transition:all .1s ease-in;
}

header nav ul li.menu-item-has-children:hover a:first-child {
	color:var(--second);
}

header nav ul li.menu-item-has-children:hover a:first-child:after {
	border-left:2px solid var(--second);
	border-bottom:2px solid var(--second);
	transform:rotate(0deg);
	margin-bottom:.1rem;
}

header.home nav ul li.menu-item-has-children a:first-child:after, header.home nav ul li.menu-item-has-children:hover a:first-child:after {
	border-left:2px solid var(--first);
	border-bottom:2px solid var(--first);
}

header nav ul li ul.sub-menu > li a:after {
	display:none !important;
}

header nav ul li ul.sub-menu > li a {
	color:var(--first) !important;
}

header nav ul li ul.sub-menu > li a:hover {
	color:var(--second) !important;
}

header.home nav ul li.menu-item-has-children:hover a:first-child {
	color:var(--third);
}

header.home nav ul li ul.sub-menu > li a:hover {
	color:var(--third) !important;
}

header nav ul li a:hover, header nav ul li.current-menu-item a, header nav ul li ul li.current_page_item a {
	color:var(--second) !important;
}

header.home nav ul li a:hover {
	color:var(--third) !important;
}

header .lets-talk {
	background-color:var(--first);
	padding:.5rem 1rem;
	border-radius:1.5rem;
}

header .lets-talk span {
	color:var(--third);
	font-weight:700;
}

header .lets-talk span i {
	margin-right:.25rem;
}

header .lets-talk:hover {
	background-color:var(--second);
}

header .lets-talk:hover span {
	color:var(--first);
}

header .lets-talk:hover span i {
	color:var(--third);
}

/* Navbar Handle */

.menu-mobile {
	display:none;
	width:30px;
	height:45px;
	z-index:999;
	-webkit-transform:rotate(0deg);
	-moz-transform:rotate(0deg);
	-o-transform:rotate(0deg);
	transform:rotate(0deg);
	-webkit-transition:.15s ease-in-out;
	-moz-transition:.15s ease-in-out;
	-o-transition:.15s ease-in-out;
	transition:.15s ease-in-out;
	cursor:pointer;
	position:absolute;
	top: 2.25rem;
	right: 1.5rem;
}

.menu-mobile span {
	display:block;
	position:absolute;
	height:3px;
	width:100%;
	background: var(--first);
	opacity:1;
	left:0;
	-webkit-transform:rotate(0deg);
	-moz-transform:rotate(0deg);
	-o-transform:rotate(0deg);
	transform:rotate(0deg);
	-webkit-transition:.15s ease-in-out;
	-moz-transition:.15s ease-in-out;
	-o-transition:.15s ease-in-out;
	transition:.15s ease-in-out;
}

.menu-mobile span:nth-child(1) {
	top:0;
}

.menu-mobile span:nth-child(2),.menu-mobile span:nth-child(3) {
	top:8px;
}

.menu-mobile span:nth-child(4) {
	top:16px;
}

.menu-mobile.close span:nth-child(1) {
	top:18px;
	width:0;
	left:50%;
}

.menu-mobile.close span:nth-child(2) {
	-webkit-transform:rotate(45deg);
	-moz-transform:rotate(45deg);
	-o-transform:rotate(45deg);
	transform:rotate(45deg);
}

.menu-mobile.close span:nth-child(3) {
	-webkit-transform:rotate(-45deg);
	-moz-transform:rotate(-45deg);
	-o-transform:rotate(-45deg);
	transform:rotate(-45deg);
}

.menu-mobile.close span:nth-child(4) {
	top:18px;
	width:0;
	left:50%;
}




@media (max-width:790px) {
	
header .blending-trends {
	max-width:10rem;
	min-height:46px;
}

header .wrapper {
	flex-direction: column;
	align-items: flex-start;
	gap: 2rem;
	height:48px;
	overflow:hidden;
}

header {
	height:96px;
	transition:all .5s ease-out;
}

header.open {
	height:100%;
}

header.open {
	backdrop-filter:blur(5px);
}

header.open .wrapper {
	justify-content: flex-start;
	height:calc(100% - 5rem);
}

header.open nav ul.show-on-mobile {
	flex-direction: column;
}

header nav ul li ul {
	position:initial;
	display:none;
	padding:1rem 0 0 .5rem;
}

header nav ul li ul li {
	margin-bottom:1rem;
}

header nav ul li ul li:last-child {
	margin-bottom:0;
}

.menu-mobile {
	display:block;
}
}


section.home {
	
}


section.home .intro {
	height: calc(100vh);
	position:relative;
}

section.home .intro #bt-intro {
	height:100%;
	display: flex;
	justify-content: center;
	align-items: center;
	z-index:2;
	background-color:var(--fifth);
	mix-blend-mode:multiply;
	position:relative;
}

section.home .intro #bt-intro svg {
	width:calc(85% - 5rem) !important;
	height:calc(85% - 7.5rem) !important;
}

section.home .intro .background {
	position:absolute;
	width:100%;
	height:100%;
	z-index:-1;
	top:0;
	left:0;
	/* background-attachment: fixed; */
	background-position:center center;
	background-size:cover;
	background-repeat:no-repeat;
}

section.home .intro video {
	object-fit: cover;
	position: absolute;
	width: 100%;
	height: 100%;
	z-index:-1;
	top: 0;
	left: 0;
	z-index:1;
}

section.home .intro .bglayer {
	position:absolute;
	width:100%;
	height:100%;
	top:0;
	left:0;
	z-index:0;
	background-color:black;
}

.unmute-btn {
  position: absolute;
  bottom:1.5rem;
  right:1.5rem;
  background:var(--first);
  color: var(--second);
  border: none;
  padding: 10px 15px;
  border-radius:10rem;
  font-size: 16px;
  cursor: pointer;
  transition: all 0.15s ease;
  z-index:2;
}

.unmute-btn:hover {
  color:var(--third);
  background: var(--second);
}

section.home .intro .essence {
	position:absolute;
	width:100%;
	z-index:2;
	bottom:50%;
	left:50%;
	transform:translate(-50%,50%);
}

section.home .intro span {
	display:block;
	color:var(--first);
	text-align:center;
	padding:0 1rem;
}

section.home .intro span:nth-child(1) {
	font-size:3rem;
	text-transform:uppercase;
	font-weight:200;
	line-height:3rem;
	margin-bottom:1rem;
}

section.home .intro span:nth-child(2) {
	font-weight:400;
	font-size:1rem;
	line-height:1.5rem;
}

section.home .intro span b {
	font-weight:800;
}

section.home .intro span font {
	font-family: "Playfair Display", serif;
	font-style:italic;
	display:inline-block;
}

/* Pages */
section .hero {
	display:block;
	width:100%;
	height:calc(100vh - 6.5rem);
	background-position:center center;
	background-size:cover;
	background-repeat:no-repeat;
	padding-top:6.5rem;
	z-index:-1;
}

section .hero.mini {
	background-position:top center;
	height:calc(100vh - 15rem);
	padding-top:0;
}

section .hero .wrapper {
	display:flex;
	height:calc(100% - 3.25rem);
	align-items: flex-start;
	flex-direction: column;
	justify-content: center;
	gap:1rem;
}

section.about .hero .wrapper {
	align-items: center;
}

section .hero .wrapper span {
	display:block;
	width:100%;
	font-size:3rem;
	color:var(--first);
	line-height:3rem;
}

section .hero .wrapper span font {
	display:inline-block;
}

section.about .hero .wrapper span div.word {
	height:4.85rem;
}

section.about .hero .wrapper span font div[data-char="A"] {
	padding-left:1rem;
}

section.about .hero .wrapper span {
	font-size:4rem;
	line-height:4.5rem;
	font-weight:200;
}

section .hero .wrapper span .line .word {
	height:3.6rem;
}

section .hero .wrapper p {
	display:block;
	width:100%;
	max-width:30rem;
	color:var(--first);
	font-size:1.25rem;
	line-height:1.75rem;
}

section .hero .wrapper .buttons {
	display:flex;
	flex-wrap: wrap;
	gap:1rem;
}

/* Buttons */
section.home .intro .essence .button, section .hero .button {
	position:relative;
	display:flex;
	margin:0 auto;
	width:max-content;
	background-color:var(--third);
	padding:.75rem 1rem;
	transition:background-color .15s ease-in-out;
	margin-top:1.5rem;
}

section .hero .button {
	margin-top:0;
}

section.home .intro .essence .button:hover, section .hero .button:hover {
	background-color:var(--second);
}

section.home .intro .essence .button span, section .hero .button span {
	position:relative;
	display:block;
	font-size:1rem;
	line-height:1.25rem;
	font-weight:700;
	margin:0;
	padding:0;
}

section.home .intro .essence .button span i, section .hero .button span i {
	margin-left:.25rem;
	transition:margin-left .15s ease-in-out;
}

section.home .intro .essence .button:hover span i, section .hero .button:hover span i {
	color:var(--third);
	margin-left:.5rem;
}

section .inside {
	
}

section .two-grids {
	display:grid;
	grid-template-columns: repeat(2, 1fr);
	gap:2rem;
}

section .two-grids div.adjd {
	display:flex;
	flex-direction: column;
	justify-content: center;
}

section .two-grids img {
	width:100%;
	max-width:25rem;
	height:auto;
	margin: 0 auto;
	display: block;
}

section .inside h1 {
	display:block;
	width: 100%;
	padding:0;
	font-weight:200;
	font-size:2.75rem;
	text-align:center;
	color:var(--first);
	margin:2rem 0;
}

section span.secdes {
	display:block;
	font-size:2rem;
	font-weight:200;
	padding:2rem;
	color:var(--ninth);
}

section .inside h1.fw {
	max-width:initial;
}

section .inside h1.ca {
	text-align:center;
}

section .inside.wwc, .page {
	background-color:var(--tenth);
}

section .inside.wwc .gray-section {
	background-color:var(--ninth);
	padding:5rem 2rem;
}

section .inside.wwc .gray-section span {
	text-transform:uppercase;
	font-size:3.5rem;
	color:var(--seventh);
	font-weight:100;
}

section .inside.wwc .columns.three-c {
	display:grid;
	grid-template-columns: repeat(3, 1fr);
}

section .inside.wwc .columns.three-c div.column {
	display:flex;
	flex-direction: column;
	justify-content: space-between;
	min-height:10rem;
	padding:2rem 3rem;
}

section .inside.wwc .columns.three-c div.column:nth-child(1) {
	background-color:var(--seventh);
}

section .inside.wwc .columns.three-c div.column:nth-child(2) {
	background-color:var(--sixth);
}

section .inside.wwc .columns.three-c div.column:nth-child(3) {
	background-color:var(--third);
}

section .inside.wwc .columns.three-c span.title {
	display:block;
	font-size:1.75rem;
	font-weight:300;
	color:var(--first);
}

section .inside.wwc .columns.three-c .column .line {
	width:3rem;
	height:3px;
	background-color:var(--first);
	margin:1.5rem 0;
}

section .inside.wwc .columns.three-c span.description {
	display:block;
	color:var(--first);
}

section .inside.wwc .video video {
	aspect-ratio: 16 / 9;
	width: 100%;
	display: block;
}

section .inside.wwc .wrapper {
	display:flex;
	flex-direction: column;
}

section .inside.wwc .wwctmi {
	display:grid;
	grid-template-columns: repeat(3, 1fr);
	gap:2rem;
	margin:2rem 0;
}

section .inside.wwc .wwctmi.wilwwfc {
	grid-template-columns: repeat(2, 1fr);
}

section .inside.wwc .wwctmi .items {
	display:flex;
	align-items: flex-start;
	gap:1rem;
	padding:.5rem 1.5rem;
	background-color:var(--tenth);
	transition:background-color .3s ease-in;
}

section .inside.wwc .wwctmi .items .count span {
	font-size:3rem;
	font-weight:200;
	line-height:3rem;
	color:var(--fifth);
	opacity:.5;
	transition:all .3s ease-in;
}

section .inside.wwc .wwctmi .items .description span.title {
	display:block;
	font-weight:600;
	margin-bottom:1.5rem;
}

section .inside.wwc .wwctmi .items .description span {
	font-size:1.3rem;
	line-height:1.75rem;
	color:var(--ninth);
	transition:color .3s ease-in;
}

section .inside.wwc .wwctmi .items div {
	z-index:1;
}

section .inside.wwc .wwctmi .items:hover {
	background-color:var(--sixth);
}

section .inside.wwc .wwctmi .items:hover span {
	color:var(--first);
	opacity:1;
}

section .inside.wwc .bltiofscl {
	display:grid;
	grid-template-columns: repeat(5, 1fr);
	gap:2rem;
	margin:2rem 0;
}

@media ( max-width : 970px ) {
section .inside.wwc .bltiofscl {
	grid-template-columns: repeat(3, 1fr);
}
}

@media ( max-width : 613px ) {
section .inside.wwc .bltiofscl {
	grid-template-columns: repeat(2, 1fr);
}
}

section .inside.wwc .bltiofscl span.title {
	display:block;
	color:var(--third);
	font-size:3rem;
	font-weight:200;
	text-align:center;
	margin-bottom:.5rem;
}

section .inside.wwc .bltiofscl span.subtitle {
	display:block;
	text-align:center;
	font-size:1.25rem;
	
}

section .inside.wwc .bltiofscl span.subtitle .line {
	
}

section .inside.wwc .bltiofscl span.description {
	display:block;
	text-align:center;
	font-size:1.15rem;
	margin-top:.5rem;
}

section .inside.wwc .wwbwy {
	display:grid;
	grid-template-columns: repeat(4, 1fr);
	gap:0rem;
	margin:2rem 0;
}

section .inside.wwc .wwbwy span.number {
	position:absolute;
	right:1rem;
	top:.5rem;
	line-height:6rem;
	font-weight:700;
	font-size:6rem;
	text-align:right;
	color:var(--ninth);
	opacity:.05;
}


section .inside.wwc .wwbwy .item {
	position:relative;
	display:flex;
	flex-direction: column;
	justify-content: space-between;
	height:15rem;
	background-color:var(--first);
	padding:1.5rem;
	border:1px solid rgba(252,121,155,.5);
	margin-right:-1px;
	margin-top:-1px;
	overflow:hidden;
}

@media ( max-width : 930px ) {
section .inside.wwc .wwbwy {
	grid-template-columns: repeat(3, 1fr);
}
}

@media ( max-width : 740px ) {
section .inside.wwc .wwbwy {
	grid-template-columns: repeat(2, 1fr);
}
section .inside.wwc .columns.three-c div.column {
	padding:2rem;
}
}

@media ( max-width : 450px ) {
section .inside.wwc .wwbwy {
	grid-template-columns: repeat(1, 1fr);
}
section .inside.wwc .wwbwy .item {
	height:10rem;
}
}

@media ( max-width : 600px ) {
section .inside.wwc .gray-section {
	padding:2rem;
}
section .inside.wwc .gray-section span {
	font-size:2.5rem;
}

section .inside.wwc .gray-section .textify .char {
	height:1.5rem;
}
section .inside.wwc .columns.three-c {
	grid-template-columns: repeat(1, 1fr);
}
}

section .inside.wwc .wwbwy .item span {
	transition:color .3s ease-in-out;
}

section .inside.wwc .wwbwy .item span.title {
	display:block;
	width:60%;
	color:var(--third);
	font-weight:bold;
	z-index:2;
}

section .inside.wwc .wwbwy .item span.description {
	font-size:.8rem;
	line-height:1.25rem;
	z-index:1;
	opacity:1;
	margin-top:0;
	transition:all .3s ease-in-out;
}

section .inside.wwc .wwbwy .item span.short-text {
	position: absolute;
	width: calc(100% - 2.5rem);
	left: 1.5rem;
	bottom: -3rem;
	font-size:.8rem;
	line-height:1.25rem;
	color:var(--first);
	z-index:2;
	opacity:0;
	transition:all .3s ease-in-out;
}

section .inside.wwc .wwbwy .item:after {
	content:'';
	position:absolute;
	width:100%;
	height:0;
	top:0;
	left:0;
	background-color:var(--third);
	z-index:0;
	transition:height .3s ease-in-out;
}

section .inside.wwc .wwbwy .item:hover span {
	color:var(--first);
}

section .inside.wwc .wwbwy .item:hover:after {
	height:100%;
}

section .inside.wwc .wwbwy .item:hover span.description {
	opacity:0;
	margin-top:15rem;
}

section .inside.wwc .wwbwy .item:hover span.short-text {
	opacity:1;
	bottom:1.5rem;
}

@media ( max-width : 970px ) {
section .inside.wwc .wwctmi {
	grid-template-columns: repeat(2, 1fr);
}
}

@media ( max-width : 735px ) {
section .inside.wwc .wwctmi, section .inside.wwc .wwctmi.wilwwfc {
	grid-template-columns: repeat(1, 1fr);
}

section .inside.wwc .wwctmi .items {
	flex-direction: column;
	align-items: center;
}

section .inside.wwc .wwctmi .items .description span {
	text-align:center;
}
}

section .moveasone h1 {
	margin:2rem auto;
	color:var(--first);
	text-align:center;
	padding: 0;
	font-weight: 200;
	font-size: 2.75rem;
}

section .moveasone h1 font {
	font-family: "Playfair Display", serif;
	font-style:italic;
}


section .inside.wwc h1 {
	margin:2rem auto;
	color:var(--second);
	text-align:center;
}

section .inside.wwc h1.la {
	margin:2rem 0;
	text-align:left;
}

section .inside.wwc h1.tifyi {
	margin:0 0 1rem 0;
	text-align:left;
}

section .inside.wwc h1.lawm {
	margin:2rem 0;
	text-align:left;
	color:var(--second);
}

div.fcc {
	display:flex;
	flex-direction: column;
	justify-content: center;
}

section .inside.wwc h1.grh {
	max-width:initial;
	text-align:left;
	font-size:2.65rem;
	margin:0;
}

.textify .char {
	height:3.4rem;
}

section .inside h1 font, section .hero .wrapper span font {
	font-family: "Playfair Display", serif;
	font-style:italic;
}

section .inside.bddp h1 {
	color:var(--ninth);
	max-width: 26rem;
	text-align:center;
	margin:2rem auto;
}

section .inside.bddp h1 red {
	color:var(--third);
	font-weight:400;
}

section .inside.bddp .buttons {
	display:block;
	width:max-content;
	margin:0 auto 1.5rem auto;
}

section .inside.bddp .button {
	position:relative;
	display:flex;
	margin:0 auto;
	width:max-content;
	background-color:var(--first);
	border:1px solid var(--seventh);
	padding:.75rem 1rem;
	border-radius:10rem;
	transition:background-color .15s ease-in-out;
	margin-top:1.5rem;
}

section .inside.bddp .button:hover {
	background-color:var(--seventh);
}

section .inside.bddp .button span {
	position:relative;
	display:block;
	font-size:1rem;
	line-height:1.25rem;
	font-weight:400;
	color:var(--seventh);
	margin:0;
	padding:0;
	transition:color .15s ease-in-out;
}

section .inside.bddp .button span i {
	margin-left:.25rem;
	transition:margin-left .15s ease-in-out;
}

section .inside.bddp .button:hover span i {
	margin-left:.5rem;
}

section .inside.bddp .button:hover span {
	color:var(--first);
}

section .inside.whn h1 font div[data-char-index="11"] {
	padding-left: .3rem;
}

section .inside.whn {
	background: var(--fourth);
	background: linear-gradient(0deg, var(--fourth) 0%, var(--fifth) 100%);
}

section .inside h1.btbyptg {
	text-align:center;
}

section .inside.whn h1 {
	color:var(--first);
}

section .inside.whn p {
	color:var(--first);
	font-size:1.5rem;
	line-height:2rem;
	font-weight:200;
	display:block;
	width: 100%;
	text-align:center;
	margin:3rem 0;
}

section .inside.whn .whns {
	display:grid;
	grid-template-columns: repeat(4, 1fr);
	gap:2rem;
	margin:2rem 0;
}

section .inside.whn .whns .items .count span {
	color:var(--sixth);
	font-size: 3rem;
	font-weight: 200;
}

section .inside.whn .whns .items .description span:nth-child(1) {
	display:block;
	color:var(--first);
	font-weight:700;
	font-size:1.5rem;
	line-height:1.75rem;
	margin:1rem 0 2rem 0;
}

section .inside.whn .whns .items .description span:nth-child(1) .line {
	height:2rem;
}

section .inside.whn .whns .items .description span:nth-child(2) {
	display:block;
	color:var(--first);
	font-weight:200;
	line-height:1.5rem;
}

@media ( max-width : 760px ) {
section .inside.whn .two-grids {
	grid-template-columns: repeat(1, 1fr);
}

section .inside.whn .whns {
	grid-template-columns: repeat(1, 1fr);
}

section .inside.whn h1 {
	max-width:initial;
	text-align:center;
	margin:0 auto;
}

section .inside.whn .whns .items .count span {
	display:block;
	text-align:center;
}

section .inside.whn .whns .items .description span {
	text-align:center;
}

section .inside.whn .whns .items .description span:nth-child(1) {
	margin:1rem 0 .5rem 0;
}

section .inside.whn p {
	max-width:initial;
	text-align:center;
}
}

.divider {
	display:block;
	width:60%;
	height:1px;
	margin:2rem auto;
	background-color:var(--ninth);
	opacity:.3;
}

section .inside h1.btbyptg {
	max-width:33rem;
	margin:0 auto;
}

section .inside.wwc .dtfetw {
	display:grid;
	grid-template-columns: repeat(2, 1fr);
	gap:3rem;
	margin-bottom:3rem;
}

section .inside.wwc .dtfetw .image {
	background-size: cover;
	background-position: center center;
	background-repeat:no-repeat;
}

@media ( max-width : 830px ) {
section .inside.wwc .dtfetw {
	grid-template-columns: repeat(1, 1fr);
}

section .inside.wwc .dtfetw .image {
	height:18rem;
}
}

/* Accordion */
.accordion {
	width:100%;
}

.accordion .accordion-item {
  border-bottom: 1px solid #caccd0;
  padding:1rem .5rem;
}

.accordion .accordion-item:first-child {
	padding-top:0;
}

.accordion .accordion-item:last-child {
	border-bottom:none;
	padding-bottom:0;
}

.accordion .accordion-item button {
  position: relative;
  display: block;
  text-align: left;
  width: 100%;
  padding:0;
  color:var(--second);
  border: none;
  background: none;
  outline: none;
}

.accordion .accordion-item button:hover{
	color:var(--third);	
}

.accordion .accordion-item button:hover, .accordion .accordion-item button:focus {
  cursor: pointer;
}
.accordion .accordion-item button:hover::after, .accordion .accordion-item button:focus::after {
  cursor: pointer;
  color: var(--third);
}
.accordion .accordion-item button .accordion-title {
	font-size:1.25rem;
	font-weight:600;
	display:block;
	padding:0 1.5rem 0 0;
}

.accordion .accordion-item button .accordion-title i {
	width:1.5rem;
	margin-right:.5rem;
	color:var(--ninth);
	opacity:.3;
	transition:all .15s ease-in-out;
}
.accordion .accordion-item button .icon {
  display: inline-block;
  position: absolute;
  top: 50%;
  right: 0;
  transform:translateY(-50%) rotate(0deg);
  transition:transform .15s ease-in;
}

.accordion .accordion-item button[aria-expanded=true] .icon {
	/* border-left:2px solid var(--third);
	border-bottom:2px solid var(--third); */
	transform:translateY(-50%) rotate(180deg);
}

.accordion .accordion-item button[aria-expanded=true] .accordion-title {
  color: var(--third);
}

.accordion .accordion-item button[aria-expanded=true] .accordion-title i {
	color:var(--second);
	opacity:1;
}

.accordion .accordion-content {
  display:none;
  overflow: hidden;
}
.accordion .accordion-content p {
  font-size:1rem;
  color:var(--ninth);
  padding-left:2.1rem;
  margin-bottom:0;
}

.accordion .accordion-content.brand-launch p {
	padding-left:0;
}

/* Portfolio */

/* Filter buttons */
.filters {
  display:flex;
  flex-wrap: wrap;
  justify-content: center;
  gap:1rem;
  margin-bottom: 2rem;
}
.filters button {
  background: none;
  border: 1px solid var(--second);
  padding: .75rem 1rem;
  border-radius: 10rem;
  cursor: pointer;
  font-size: 1rem;
  line-height: 1.25rem;
  font-weight: 400;
  transition: all 0.3s ease;
}
.filters button.is-checked,
.filters button:hover {
  background: var(--second);
  color: var(--first);
}

@media ( max-width : 500px ) {
.filters {
	gap:.5rem;
	margin:1rem 0rem;
}
.filters button {
	padding:.5rem .75rem;
	font-size:.9rem;
}
}

.portfolio .portfolio-hero {
	height:400px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding-top:3.5rem;
}

.portfolio.general .portfolio-hero {
	height:100px;
	padding-top:7rem;
}

.portfolio .portfolio-hero.single {
	height:300px;
	padding-top:6rem;
}

.portfolio .portfolio-hero h1 {
	color:var(--second) !important;
}

.portfolio .portfolio-hero.single h1 {
	display:block;
	font-size:3rem;
	line-height:3.85rem;
	font-weight:200;
	max-width:800px;
}

@media ( max-width : 480px ) {
.portfolio .portfolio-hero.single {
	padding-top:8rem;
}
.portfolio .portfolio-hero.single h1 {
	font-size:2.5rem;
	line-height:2.25rem;
}
}

.portfolio .portfolio-hero span {
	display:block;
	width:100%;
	max-width:580px;
	font-size:1.548rem;
	line-height:2rem;
	font-weight:300;
	color:var(--ninth);
}

.portfolio .portfolio-hero.tags-hero span {
	text-align:center;
}

.portfolio-grid {
	display: flex;
	  flex-wrap: wrap;
}

.portfolio-grid a {
	width:33.333%;
	overflow: hidden;
	/* transition: transform 0.3s ease; */
}

@media (max-width : 580px) {
.portfolio-grid a {
	width:50%;
}
}

@media (max-width : 395px) {
.portfolio-grid a {
	width:100%;
}
}

.portfolio-grid figure {
	position: relative;
	width:100%;
	padding-bottom:100%;
	height: 0;
	margin:0;
	overflow:hidden;
}

.portfolio-grid figure img {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	-o-object-fit: cover;
	object-fit: cover;
	z-index: 1;
}

.portfolio-grid figure .caption {
	position:absolute;
	width:100%;
	height:auto;
	background-color:var(--third);
	z-index:2;
	left:0;
	bottom:-10rem;
	transition:bottom .3s ease-out;
}

.portfolio-grid figure:hover .caption {
	bottom:0;
}

.portfolio-grid figure .caption .caption-wrapper {
	padding:1.5rem;
}

.portfolio-grid figure .caption .title {
	display:block;
	color:var(--first);
	font-size:1.65rem;
}

.portfolio-grid figure .caption .category {
	color:var(--first);
	font-size:1.15rem;
	font-weight:300;
	line-height:1.75rem;
	margin-top:.5rem;
}

.portfolio-grid figure .caption .category.separator {
	color:var(--second);
}

@media ( max-width : 633px ) {
.portfolio .portfolio-hero span {
	text-align:center;
}
}

.portfolio .portfolio-header img {
	display:block;
	width:100%;
	height:auto;
}

.portfolio .project-info {
	display:flex;
	justify-content: flex-start;
	flex-wrap: wrap;
	gap:1rem 5rem;
	margin:2.5rem 0 4rem 0;
}

.portfolio .project-info div span {
	display:block;
	font-size:1.25rem;
}

.portfolio .project-info div span:first-child {
	color:var(--third);
	font-weight:500;
	margin-bottom:.25rem;
}

.portfolio .project-info div span:last-child {
	font-weight:300;
}

.portfolio .project-info div a {
	text-decoration:underline;
}

.portfolio .project-info div a span {
	display:initial;
	color:var(--second) !important;
}

.portfolio .project-info div a:hover span {
	color:var(--third) !important;
}

.portfolio .project-info div .tags {
	display:flex;
	gap:2rem;
}

.portfolio .project-details {
	margin:0 0 4rem 0;
}

.portfolio .project-details span.subtitle {
	display:block;
	font-family: "Playfair Display", serif;
	font-style:italic;
	font-size:2rem;
	color:var(--ninth);
}

.portfolio .project-details p, .portfolio .project-details ul li {
	font-size:1.35rem;
	font-weight:300;
	line-height:2rem;
}

.portfolio .project-details p:last-child {
	margin-bottom:0;
}

.portfolio .project-details ul {
	padding:0 0 0 1rem ;
}

.portfolio .project-details ul:last-child {
	margin-bottom:0;
}

.portfolio iframe {
	aspect-ratio: 16 / 9;
	width: 100%;
	height:auto;
	display: block;
	margin-bottom:.25rem;
}

.portfolio .gallery img {
	display:block;
	width:100%;
	height:auto;
	margin-bottom:.25rem;
}

.portfolio .gallery img:last-child {
	margin-bottom:0;
}

/* Carousel */
.splide__list li figure {
	position: relative;
	width:100%;
	padding-bottom:50%;
	height: 0;
	margin:0;
	overflow:hidden;
}

.splide__list li figure img {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	-o-object-fit: cover;
	object-fit: cover;
	z-index: 1;
}

.splide__list li .caption {
	position:relative;
	width:100%;
	height:5rem;
	display:block;
	z-index:2;
}

.splide__list li .caption .caption-wrapper {
	position:absolute;
	width:100%;
	height:auto;
	top:0;
	left:0;
	padding:1rem 0;
}

.splide__list li .caption .title {
	display:block;
	color:var(--second);
	font-size:1.65rem;
}

.splide__list li .caption .category {
	color:var(--second);
	font-size:1.15rem;
	font-weight:300;
	line-height:1.75rem;
	margin-top:.5rem;
}

.splide__list li .caption .category.separator {
	color:var(--second);
}

/* Statistics */
.statistics {
	background-color:var(--third);
}

.statistics .wrapper {
	padding:0;
}
.statistics .grid {
	display:grid;
	grid-template-columns: repeat(4, 1fr);
}

.statistics .grid div.items {
	padding:3rem 1.5rem;
	border-right:1px solid var(--first);
}

.statistics .grid div.items:last-child {
	border-right: none;
}

.statistics .grid span {
	display:block;
	text-align:center;
	color:var(--first);
}

.statistics .grid span.title {
	font-size:3rem;
}

.statistics .grid span.subtitle {
	display:block;
	margin:.5rem auto 0 auto;
	font-size:1.2rem;
	max-width:8rem;
	text-align:center;
}

@media ( max-width : 905px ) {
.statistics .grid span.title {
	font-size:2.2rem;
}

.statistics .grid span.subtitle {
	font-size:1rem;
}
}

@media ( max-width : 670px ) {
.statistics .grid {
	grid-template-columns: repeat(2, 1fr);
}

.statistics .grid div.items {
	border-bottom:1px solid var(--first);
}

.statistics .grid div.items:nth-child(2) {
	border-right:none;
}
.statistics .grid span.title {
	font-size:2.5rem;
}

.statistics .grid span.subtitle {
	font-size:1.2rem;
}
}

.ourstory {
	display: block;
	width: 100%;
	font-size: 1.548rem;
	line-height: 2rem;
	font-weight: 300;
	text-align:center;
	color: var(--second);
}

.team {
	display:block;
	width:100%;
	margin:4rem 0 5rem 0;
}

.team .splide__pagination {
	width:max-content;
	bottom:-4rem;
	background-color:rgba(0,0,0,.05);
	padding:.25rem .5rem;
	border-radius:1rem;
	left:50%;
	transform:translateX(-50%);
}

.team .splide__pagination li {
	line-height:0;
}

.team .splide__pagination__page {
	background:var(--second);
	opacity:.2;
}

.team .splide__pagination__page.is-active {
	transform:scale(1);
	color:var(--second);
	background:var(--second);
	opacity:1;
}

.carousel-progress {
	display:block;
	margin:4rem auto 0 auto;
	width:60%;
	background:rgba(1,1,1,.1);
  }
  
.carousel-progress-bar {
	background: var(--fifth);
	height:2px;
	transition: width 400ms ease;
	width: 0;
  }

.member {
	width:100%;
	display:grid;
	grid-template-columns: 1fr 1fr;
	box-sizing: border-box;
	gap:2rem;

}

.team ul.splide__list li:nth-child(even) .member {
	direction:rtl;
}

.team .splide__list li figure {
	padding-bottom:65%;
}

.member .about {
	width:100%;
	display:flex;
	flex-direction: column;
	justify-content: space-between;
	box-sizing: border-box;   /* ensures padding doesn’t blow up width */
	min-width: 0;             /* key fix: prevents flex child overflow */
}

.member .about span {
	display:block;
	width:100%;
	direction:ltr !important;
}

.member .about span.name {
	font-size:1.75rem;
	font-weight:500;
	margin-bottom:.5rem;
}

.member .about span.role {
	font-size:1.25rem;
}

.member .about p {
	width:100%;
	font-size:1.25rem;
	line-height:2rem;
	direction:ltr !important;
}

.member .about span.ps {
	font-family: "Playfair Display", serif;
	font-style:italic;
	font-size:1.35rem;
	padding-bottom:.05rem;
}

@media ( max-width : 630px ) {
.member {
	grid-template-columns: repeat(1, 1fr);
	gap:1.5rem;
}

.member .about p {
	font-size:1rem;
	line-height:1.5rem;
}

.member .about span.ps {
	font-size:1.15rem;
}

.awards .two-grids {
	grid-template-columns: repeat(1, 1fr);
	gap:1rem;
}
}

.awards {
	margin:4rem 0;
}

.awards .content {
	display:flex;
	flex-direction: column;
	justify-content: space-between;
}

.awards .content p {
	font-size: 1.25rem;
	line-height: 1.75rem;
}

.awards .image img {
	max-width:initial;
}

.our-cycle {
	background-color:var(--second);
}

.our-cycle h1 {
	color:var(--first) !important;
}

.our-cycle img {
	display:block;
	width:100%;
	max-width:800px;
	height:auto;
	margin:1rem auto 4rem auto;
}

section .hero.mini.wbinbt {
	height: calc(100vh - 5rem);
}

.wbinbt h1 {
	color:var(--first) !important;
}

section .inside.wwc .columns.taglines div.column {
	justify-content: center;
	align-items: center;
}

@media ( max-width : 630px ) {
section .inside.wwc .columns.taglines span.title {
	text-align:center;
}
}

.accordion .accordion-content span {
	display:block;
	margin: 1rem 0;
}

.partners {
	display:grid;
	grid-template-columns: repeat(6, 1fr);
	gap:2rem;
}

@media ( max-width : 920px ) {
.partners {
	grid-template-columns: repeat(4, 1fr);
}
}

@media ( max-width : 630px ) {
.partners {
	grid-template-columns: repeat(3, 1fr);
}
}

.partners div img {
	width:100%;
	height:auto;
}

.cf h1 {
	width:100%;
	text-align:left;
	margin:-.75rem 0 1rem -.75rem !important;
}

.error {
	display:block;
	margin:2rem auto;
	color:var(--first);
	text-align:center;
	font-size:1.25rem;
	line-height:1.75rem;
}

.cf .error {
	color:var(--second);
}

.error i {
	display:block;
	color:var(--sixth);
	font-size:3rem;
	margin-bottom:.5rem;
}

.error.sent i {
	color:var(--seventh);
}

.error.notsent i {
	color:var(--sixth);
}

.contact {
	display:grid;
	grid-template-columns: repeat(2, 1fr);
	gap:1.5rem;
	margin-top:3rem;
}

.contact .socials {
	display:grid;
	grid-template-columns: repeat(2, 1fr);
}

.contact .socials a {
	height:100%;
	position: relative;
	display:flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: flex-end;
	height: 15rem;
	background-color: var(--first);
	padding: 1.5rem;
	border: 1px solid rgba(252, 121, 155, .5);
	margin-right: -1px;
	margin-top: -1px;
	overflow: hidden;
	transition:all .15s ease-in-out;
}

.contact .socials a .arrow svg {
	width:1.5rem;
	height:auto;
	fill:var(--ninth);
	opacity:.2;
	transition:all .15s ease-in-out;
}

.contact .socials a:hover .arrow svg {
	fill:var(--third);
	opacity:1;
}

.contact .socials a .social-info {
	display:flex;
	justify-content: space-between;
	align-items: center;
	gap:1rem;
	width: 100%;
}

.contact .socials a .social-info span {
	text-transform:uppercase;
	font-size:1.25rem;
	font-weight:bold;
	color:var(--third);
}

.contact .socials a .social-info i {
	font-size:1.25rem;
	color:var(--second);
	transition:color .15s ease-in-out;
}

.contact .socials a:hover .social-info i {
	color:var(--third);
}

.contact-form {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	flex-wrap: wrap;
	height:calc(100% - 3.75rem);
}

.contact-form input, .contact-form textarea {
	width:calc(100%-3rem);
	padding:1.5rem;
	background-color: var(--first);
	border:none;
	color: var(--second);
	outline: none;
	margin-bottom:.75rem;
}

.contact-form input[type="checkbox"] {
	width:initial;
	margin-right:.5rem;
	padding:0;
}

.contact-form input:focus {
	
}

.contact-form a {
	text-decoration:underline;
}

.contact-form button {
	display:block;
	cursor:pointer;
	padding:.75rem 2rem;
	border-radius:2rem;
	background-color: var(--fifth);
	border:none;
	color: var(--first);
	outline: none;
	text-align:center;
	cursor:pointer;
	margin:0 auto;
}

.contact-form button:hover {
	background-color: var(--sixth);
}

.contact-form button span {
	font-weight:700;
}

.contact-form button span i {
	margin-left:.25rem;
	transition:margin-left .15s ease-in-out;
}

.contact-form button:hover span i {
	margin-left:.5rem;
}

@media ( max-width : 835px ) {
.contact {
	grid-template-columns: repeat(1, 1fr);
}
.cf h1 {
	margin:.5rem 0 1.5rem -.75rem !important;
}
.cf .contact-form {
	height:100%;
	justify-content: flex-start;
	gap:1rem;
	margin-bottom:-2rem;
}
}

@media ( max-width : 470px ) {
.contact .socials a {
	height:8rem;
	padding:1rem;
}
.contact .socials a .social-info span, .contact .socials a .social-info i {
	font-size:1rem;
}
}

.general .content p {
	
}

.general .content ol {
	margin:0;
	padding:0 0 0 1rem;
}

.general .content ol li {
	margin-bottom:1rem;
	line-height:1.75rem;
}

.general .content ol li::marker {
	font-weight:bold;
}

.general .content ol li a {
	text-decoration:underline;
}

/* Footer */

footer {
	width: 100%;
	display: table-row;
	height: 6rem;
	background-color:var(--fourth);
	color:var(--first);
}

footer .wrapper {
	width:initial;
	margin-bottom:1.5rem;
}


footer .fh {
	height:100%;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

footer .footer-g {
	width:100%;
	display:grid;
	grid-template-columns: repeat(3, 1fr);
	gap:2rem;
}

footer .footer-g-t {
	width:100%;
	display:grid;
	grid-template-columns: repeat(3, 1fr);
	gap:2rem;
	margin-top:2rem;
	font-size:.8rem;
}

footer a {
	color:var(--first);
}

footer .bt svg {
	display:block;
	width:100%;
	max-width:2.5rem;
	height:auto;
	margin-bottom:1rem;
}

footer .bt svg path {
	fill: var(--first);
}

footer span {
	display:block;
	margin-bottom:1rem;
	font-size:.9rem;
	line-height:1.25rem;
}

footer span:last-child {
	margin-bottom:0;
}

footer font {
	font-family: "Playfair Display", serif;
	font-style:italic;
}

footer ul {
	margin:0;
	padding:0;
	list-style:none;
	display:flex;
	flex-direction: column;
	gap:.8rem;
}

footer ul li {
	font-size:1rem
}

footer ul li a {
	display:flex;
	width:max-content;
	flex-direction: row;
	align-items: center;
	gap:.5rem;
}

footer ul li a i {
	font-size:.9rem;
	transform:rotate(-45deg);
	transition:transform .15s ease-in-out;
}

footer ul li a:hover i {
	transform:rotate(-90deg);
}


footer .connect span {
	margin-bottom:0;	
}

footer i.fa-whatsapp {
	font-size:1.5rem;
	margin-right:.25rem;
}

footer .connect a {
	width:max-content;
	display:flex;
	align-items: center;
}

footer span.pt {
	text-transform:uppercase;
	margin-top:1rem;
	margin-bottom:.5rem;
}

footer span.pt:first-child {
	margin-top:0;
}

footer .socials {
	display:flex;
	gap:.75rem;
}

footer .socials i {
	font-size:1.25rem;
}

footer span.copyright {
	font-size:.75rem;
	margin-bottom:.25rem;
}

footer span.copyright b {
	text-transform:uppercase;
}

footer font.rd {
	display:inline-block;
	margin:0 .5rem;
}

@media ( max-width : 630px ) {
footer .footer-g, footer .footer-g-t {
	grid-template-columns: repeat(1, 1fr);
}

footer .footer-g-t {
	grid-template-columns: repeat(1, 1fr);
	gap:.5rem;
}

footer .footer-g-t div:nth-child(2) {
	display:none;
}

footer .fh, footer ul {
	align-items: center;
}

footer ul {
	margin-top:.5rem;
}

footer span {
	text-align:center;
}
}


textarea,
input [type="text"],
input [type="tel"],
input [type="email"],
select,
option,
input[type="button"],
input[type="submit"] {
	 -webkit-appearance: none;
	 border-radius: 0;
}

.discovery-call {
	display:block;
	width: 100%;
	max-width: 20rem;
	margin:4rem auto;
}

.discovery-call *,
.discovery-call *::before,
.discovery-call *::after {
  box-sizing: border-box;
}

.discovery-call input {
	width:100%;
	padding:.75rem;
	border-radius:2rem;
	background-color: var(--first);
	border:none;
	color: var(--second);
	outline: none;
	text-align:center;
	margin-bottom:.75rem;
}

.discovery-call input:focus {
	
}

.discovery-call button {
	display:block;
	width:100%;
	cursor:pointer;
	padding:.75rem 1rem;
	border-radius:2rem;
	background-color: var(--seventh);
	border:none;
	color: var(--first);
	outline: none;
	text-align:center;
	cursor:pointer;
 
}

.discovery-call button:hover {
	background-color: var(--sixth);
}

.discovery-call button span {
	font-weight:700;
}

.discovery-call button span i {
	margin-left:.25rem;
	transition:margin-left .15s ease-in-out;
}

.discovery-call button:hover span i {
	margin-left:.5rem;
}

.lozad[data-loaded="true"], [data-loaded="true"] .lozad {
	animation-name: lozad;
	animation-duration: .3s;
	animation-timing-function:ease-in-out;
}
@keyframes lozad {
from {
	opacity: 0;
} to {
	opacity: 1; }
}

#cookies {
  user-select: none;
  -webkit-user-select: none;
  position:fixed;
  display:flex;
  align-items: center;
  justify-content: center;
  gap:.75rem .5rem;
  width: 100%;
  max-width: 28.8rem;
  bottom:1.5rem;
  left:50%;
  transform:translate(-50%, 0);
  font-size:.9rem;
  color:var(--second);
  padding:1rem;
  background-color:var(--first);
  animation: cookies .5s ease;
  z-index:99;
}

@keyframes cookies {
  0% {
	transform:translate(-50%, 10rem);
  }
  100% {
	transform:translate(-50%, 0);
  }
}

#cookies.disabled {
  transform:translate(-50%, 10rem);
  animation: disabled .5s ease;
}

@keyframes disabled {
  0% {
	transform:translate(-50%, 0);
  }
  100% {
	transform:translate(-50%, 10rem);
  }
}

#cookies a {
  position:relative;
  font-weight:700;
  text-decoration:underline;
}

#cookies a:hover:after {
  width:0;
}

@media (max-width: 500px) {
#cookies {
  max-width:17.8rem;
  flex-wrap:wrap;
}
}

#cookies button {
  border:0;
  outline:0;
  padding:.5rem .75rem;
  line-height:1rem;
  background:var(--third);
  color:var(--first);
  font-weight:700;
  text-transform:uppercase;
  cursor:pointer;
}

#cookies button:hover {
  background:var(--fourth);
}

#cookies button#decline {
  font-weight:400;
  background:var(--ninth);
  color:var(--first);
}

#cookies button#decline:hover {
  background:var(--fourth);
  color:var(--first);
}