/**
 * -----------------------------------------------------------------------------------
 * 
 *     [Master Stylesheet]
 * 
 *     Project:    Terio - Creative Agency HTML Template
 *     
 *     Version:    1.0
 * 
 * -----------------------------------------------------------------------------------
 * 
 *     [Table of contents]
 *     
 *     1. General Style
 *     2. header
 *     3. hero-section-one
 *     4. small-services
 *     5. welcome
 *     6. how-it-works
 *     7. reaview-section
 *     8. Contacto
 *     9. footer
 *     10. breadcrumb
 *     11. heading-boder
 *     12. style-shapes
 *     13. video-img
 *     14. get in touch
 *     15. form.touch
 *     16. btn
 *     17. home 2 style
 *     18. marketing
 *     19. brands-we-work
 *     20. Sercives
 *     21. strategic-sercives
 *     22. testimonials
 *     23. case-studies-two
 *     24. team-member
 *     25. blog posts
 *     26. home 3
 *     27. header two style
 *     28. our clients
 *     29. why-choose-us
 *     30. choose-us-img
 *     31. makes-us-different
 *     32. counter
 *     33. case-studies
 *     34. satisfied-clients
 *     35. client-review
 *     36. form touch.two
 *     37. 404 page
 *     38. blog page
 *     39. splash-area-section
 *     40. discovery
 *     41. team-welcome-text
 *     42. Pricing-style
 *     43. accordion
 *     44. splash-area.blog
 *     45. portfolio
 *     46. blog-content
 *     47. content-form
 *     48. content page offices
 *     49. next-previous
 *     50. about paga
 *     51. awards
 *     52. search-btn
 *     53. mobile-nav
 *     54. back to top button
 *     55. Preloader Start
 *     56. transition sped
 *     57. Comprar 
 * 
 * 
 * -----------------------------------------------------------------------------------
 *
 * @format
 */

/* 1. General Style */

/* @font-face {
    font-family: "HelveticaNow-light";
   
    src:url("../fonts/HelveticaNowDisplay-Light.ttf") 
	
   
}

@font-face {
    font-family: "HelveticaNow";
   
    src:url("../fonts/HelveticaNowDisplay-Medium.ttf") 
	
   
}

@font-face {
    font-family: "HelveticaNow-Bold";
   
    src:url("../fonts/HelveticaNowDisplay-Bold.ttf") 
	
   
}

@font-face {
    font-family: "HelveticaNow-Regular";
   
    src:url("../fonts/HelveticaNowDisplay-Regular.ttf") 
	
   
} */

@font-face {
	font-family: "HelveticaNow";
	src: url("../fonts/HelveticaNowDisplay-Regular.ttf") format("truetype");
	font-weight: normal;
	/* font-style: normal; */
}

@font-face {
	font-family: "HelveticaNow";
	src: url("../fonts/HelveticaNowDisplay-ExtLt.ttf") format("truetype");
	font-weight: 100;
	/* font-style: italic; */
}

@font-face {
	font-family: "HelveticaNow";
	src: url("../fonts/HelveticaNowDisplay-Light.ttf") format("truetype");
	font-weight: lighter;
	/* font-style: italic; */
}

@font-face {
	font-family: "HelveticaNow";
	src: url("../fonts/HelveticaNowDisplay-Bold.ttf") format("truetype");
	font-weight: bolder;
	/* font-style: normal; */
}

@font-face {
	font-family: "HelveticaNow";
	src: url("../fonts/HelveticaNowDisplay-Bold.ttf") format("truetype");
	font-weight: bold;
	/* font-style: italic; */
}

@font-face {
	font-family: "HelveticaNow";
	src: url("../fonts/HelveticaNowDisplay-Medium.ttf") format("truetype");
	font-weight: medium;
	/* font-style: italic; */
}
@font-face {
	font-family: "HelveticaNow";
	src: url("../fonts/HelveticaNowDisplay-ExtraBold.ttf") format("truetype");
	font-weight: bold;
	/* font-style: italic; */
}

@import url("https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500;600;700;800;900&display=swap");
body {
	overflow-x: hidden !important;
	font-family: "Inter";
}

p {
	font-size: 16px;
	line-height: 28px;
	color: #666;
	margin: 0;
	font-weight: 100;
}
* {
	margin: 0;
	padding: 0;
}
a,
h2,
h3,
h4,
h5 {
	color: #000;
}
a {
	text-decoration: none;
}
h1 {
	font-size: 65px;
	color: #222;
}
h2 {
	font-size: 40px;
	line-height: 50px;
	color: #222222cc;
}
h3 {
	font-size: 26px;
	line-height: 36px;
	color: #222;
}
h4 {
	color: #222;
	font-size: 24px;
	line-height: 34px;
}
h5 {
	font-size: 22px;
	line-height: 32px;
	color: #222;
}
h6 {
	font-size: 20px;
	line-height: 28px;
	color: #222;
}
img {
	object-fit: cover;
}
.underline {
	display: flex;
	justify-content: center;
	margin: auto;
	border-bottom: 1.5px solid rgb(148, 148, 148);
	max-width: 80%;
	margin-top: 10px;
	margin-bottom: 5px;
}
.title-sub {
	border-bottom: 2px solid #6f6f6f;
	display: flex;
	max-width: 45px;
	padding-top: 5px;
}

.title-sub-thin {
	border-bottom: 1px solid #6f6f6f;
	display: flex;
	max-width: 30px;
	padding-top: 5px;
}

.sub-title-white {
	display: flex;
	border-bottom: solid 2px white;
	max-width: 40px;
}

.gap {
	padding: 100px 0;
}

@media only screen and (max-width: 991px) {
	.gap {
		padding: 50px 0;
	}
}

.no-top {
	padding-top: 0;
}

ul {
	padding: 0;
	margin: 0;
}
li {
	display: block;
}

figure {
	overflow: hidden;
	margin: 0;
}

/* @media only screen and (max-width: 2700px) and (min-width: 1400px) {
	.container {
		max-width: 1920px;
	}
} */

/* 2. header*/

header {
	width: auto;
	background-color: #494949;
	/* margin-bottom: 10px; */
}

.nav {
	width: auto;
	height: 100px;
	justify-content: space-between;
	position: relative;
}
.menu {
	display: flex;
	/* list-style: none; */
	margin: 0;
	padding: 0;
}
.menu li {
	margin-top: 20px;
}
header .logo {
	padding-right: 30px;
	margin-top: -10px;
}
.logo img {
	width: 160px;
}

@media (max-width: 576px) {
	.logo img {
		width: 135px;
		margin-left: 15px;
	}
	#header-mobile-icons-container {
		margin-right: 15px;
	}
}

.menu a {
	text-transform: capitalize;
	font-size: 0.9em;
	font-family: HelveticaNow, sans-serif;
	color: white;
	display: block;
	margin-left: 40px;
	text-decoration: none;
	margin-right: 30px;
	font-weight: 100;
}

/* .menu a::before {
  content: attr(title);
  font-weight: 600;
  height: 0;
  overflow: hidden;
  visibility: hidden;
} */

.menu a:hover {
	font-weight: 600;
}

.custom-sub-menu a {
	/* margin-left: 4px;
  margin-right: 4px; */
}

.menu > a {
	padding-bottom: 10px;
}

.menu > li {
	display: block;
	position: relative;
	left: 50px;
	align-items: center;
	padding-bottom: 20px;
	padding-top: 20px;
}

header .themebtu {
	color: white;
	border: 1px solid #fff;
	background-image: linear-gradient(45deg, #fff 50%, transparent 50%);
}
header .themebtu:hover {
	color: #222;
}
.menu .sub-menu {
	z-index: 1111111;
	clip: rect(1px, 1px, 1px, 1px);
	opacity: 0.1;
	transition: transform 0.3s cubic-bezier(0.2, 0, 0.2, 1), opacity 0.2s cubic-bezier(0.2, 0, 0.2, 1);
	transform: translateY(-10px) scaleY(0.5);
	transform-origin: top;
	box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.3);
	list-style: none;
	margin: 0;
	padding: 0;
	position: absolute;
	top: 100%;
	left: 0;
	width: 10em;
}
.menu > li:hover > .sub-menu {
	clip: auto;
	opacity: 1;
	transform: translateY(0) scaleY(1);
	width: 200px;
}
.menu > li .sub-menu li {
	padding: 15px 20px;
	background-color: #222;
	position: relative;
}
.menu > li .sub-menu li:not(:last-child):before {
	content: "";
	background-color: #6669;
	bottom: 0%;
	width: 80%;
	height: 1px;
	position: absolute;
}
.menu > li > .sub-menu li a {
	margin: 0;
}

.bar {
	display: block;
	width: 100%;
	height: 3px;
	background-color: #f2eaea;
	position: relative;
	transition: transform 0.3s ease;
}

.bar:nth-child(1) {
	top: -4px;
}

.bar:nth-child(2) {
	top: 1px;
}

.bar:nth-child(3) {
	top: 6px;
}
.lenguaje {
	display: block;
	position: relative;
	left: 425px;
	align-items: center;
	padding-bottom: 18px;
	padding-top: 42px;
}
.lang {
	font-size: large;
	color: white;
	margin: 1px;
}

.content-input {
	display: block;
	position: relative;
	left: 420px;
	align-items: center;
	padding-bottom: 18px;
	padding-top: 35px;
	font-size: large;
}

.square {
	max-width: 280px;
}

.divider {
	height: 100px;
	color: white;
}

/* 3. hero-section-one */
.hero-section-one {
	max-width: 1920px;
	max-height: 982px;
	padding-top: 280px;
	padding-bottom: 220px;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	overflow: hidden;
}
.heading {
	z-index: 1;
	position: relative;
}
.heading h6 {
	text-transform: capitalize;
}
.heading.two {
	text-align: center;
}
.hero-section-one.two {
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
}

/* 4. small-services */
.col-4.flex {
	display: inline-block;
	justify-content: center;
	align-items: center;
	margin-top: 20px;
}
.title-uno {
	margin-left: 30px;
	margin-top: 25px;
	font-size: 1.4em;
	font-weight: 600;
	color: #515151;
}
.border-left {
	border-left: solid 2px rgb(128, 122, 122);
}
.title-dos {
	margin-left: 30px;
	margin-top: 0px;
	font-size: 1.4em;
	font-weight: 600;
	color: #515151;
}
.col-4.flex p {
	line-height: 1;
	margin-top: 8px;
	margin-left: 30px;
	margin-bottom: 0px;
	font-size: 1.1em;
	color: #a9a9a9;
}
.parrafo-dos {
	display: inline-block;
	line-height: 1;
	margin-left: 30px;
	margin-top: 5px;
	font-size: 1.1em !important;
	color: #a9a9a9;
}

.col-4.flex a i {
	display: flex;
	margin-top: 30px;
	margin-bottom: 8px;
	margin-right: 8px;
	justify-content: flex-end;
}

.small-services-color {
	background-color: #f2edf5;
	width: 90%;
	margin: 0 auto;
	margin-top: -10px;
	box-shadow: rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px;
}

.small-services-wrapper > div {
	flex: 0 0 calc(50% - 15px);
	margin-bottom: 20px;
}

.narrower-container {
	max-width: 700px;
	max-height: 190px;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

/* 5. welcome */
.welcome img.img-welcome {
	position: absolute;
	bottom: -14%;
	right: 0;
}
img.dots {
	z-index: -1;
	position: absolute;
	right: 2%;
	top: 27%;
}

.quienes-somos {
	display: flex;
	margin-top: 10px;
	margin-bottom: 7px;
	font-size: 30px;
	color: rgb(50, 50, 50);
}
.heading h2 {
	font-weight: 600;
	display: inline-block;
}

#prevButton {
	color: #4f4f4f;
	background-color: transparent;
	margin-left: 10px;
	margin-top: 6px;
	font-size: xx-large;
	border: none;
	cursor: pointer;
}
#nextButton {
	color: #4f4f4f;
	background-color: transparent;
	margin-right: 10px;
	font-size: xx-large;
	border: none;
	cursor: pointer;
}

#prevButton:hover {
	color: #031e61;
}
#nextButton:hover {
	color: #031e61;
}
.col-1 {
	display: flex;
	justify-content: center;
}

.h5 {
	color: #555;
}
.pl-75 {
	padding-left: 75px !important;
}
.welcome-text h5 {
	font-weight: 600;
	padding-bottom: 10px;
}

.welcome-text p {
	font-size: 1em;
	color: gray;
	font-weight: 300;
	line-height: normal;
	padding-bottom: 50px;
}

.welcome {
	position: relative;
	margin-bottom: 86px;
	z-index: 1;
}

/* 6. how-it-works */
.how-it-works .heading h2 {
	width: 37%;
}

.negocio-contenedor {
	position: relative;
}

.negocio-contenedor {
	width: 60%;
	margin-right: auto;
	margin-left: auto;
}

.negocio-contenedor h2 {
	position: absolute;
	font-weight: 500;
	font-size: 180px;
	/* line-height: 145px; */
	z-index: -100;
}

.strategic {
	/* position: relative; */
}
.strategic h2 {
	/* font-size: 140px;
	font-weight: 800;
	position: absolute;
	z-index: -19;

	line-height: 145px; */
}
.pl-80 {
	padding-left: 80px;
}
.strategic h4 {
	display: inline-block;
	padding-bottom: 40px;
	margin-bottom: 0;
	padding-top: 60px;
	font-weight: 600;
	color: black;
}
.project-text {
	margin-top: 40px;
}
.project-text {
	margin-top: 40px;
	padding-left: 40px;
}
.project-data {
	position: relative;
	z-index: 1;
}
.project {
	position: relative;
	overflow: hidden;
}

.project:before {
	width: 100%;
	position: absolute;
	content: "";
	height: 40%;
	background-color: #e6e6e6;
	top: 0;
	z-index: -1111;
}
.project-text h5 {
	padding-top: 15px;
	margin-left: 28px;
	font-weight: 600;
}
.swiper-button-next,
.swiper-button-prev {
	width: 60px;
	height: auto;
}
.swiper-button-next:after,
.swiper-button-prev:after {
	display: none;
}
.swiper-button-next svg,
.swiper-button-prev svg {
	fill: #929292;
}
.swiper-button-next:hover svg,
.swiper-button-prev:hover svg {
	fill: #05070b;
}
.swiper-button-next.swiper-button-disabled,
.swiper-button-prev.swiper-button-disabled {
	opacity: 1;
	cursor: auto;
	pointer-events: auto;
}
.swiper-button-prev svg {
	transform: rotate(180deg);
}
.swiper-button-prev:before {
	position: absolute;
	content: "";
	height: 30px;
	width: 30px;
	/* background-color: #b6b4b4; */
	background-color: #dcdcdc85;
	border-radius: 50%;
	border: 0.5px solid gray;
	left: -17%;
}
.swiper-button-next:before {
	position: absolute;
	content: "";
	height: 30px;
	width: 30px;
	background-color: #ededed;
	border-radius: 50%;
	right: -17%;
	z-index: -1;
	border: 0.5px solid gray;
}
.project-text p {
	color: #999;
	padding-bottom: 12px;
	max-width: 400px;
	margin-left: 30px;
}
.project-text a {
	padding-bottom: 10px;
	text-align: right;
	font-weight: 500;
	display: block;
}
.swiper-container {
	width: 100%;
	height: 100%;
	margin-left: auto;
	margin-right: auto;
	position: relative;
	text-align: center;
}
.swiper-button-next {
	margin-right: -7%;
}
.swiper-button-prev {
	margin-left: -8%;
}
span.swiper-pagination-bullet {
	background-color: transparent;
	border: 1px solid #cfcfcf;
	opacity: 1;
}
span.swiper-pagination-bullet.swiper-pagination-bullet-active {
	background-color: transparent;
	border: 1px solid #000;
}
.swiper-pagination.swiper-pagination-clickable.swiper-pagination-bullets.swiper-pagination-horizontal {
	display: block;
	margin-top: 100px;
	position: relative;
}

/* 7. reaview-section */
.reaview-section {
	padding-top: 50px;
	position: relative;
	padding-bottom: 60px;
}

@media (max-width: 600px) {
	.reaview-section {
		padding-bottom: 30px;
	}
}

.reaview span {
	line-height: 26px;
}
.reaview-section .heading {
	margin-bottom: 100px;
}
.reaview img {
	border-radius: 50%;
}
.reaview-section {
	position: relative;
	overflow: hidden;
}
.reaview img {
	border-radius: 50%;
	align-items: center;
	transform: translateY(-60px);
	margin-top: 100px;
}
.reaview {
	background-color: #f2f2f2;
	text-align: center;
	border: 1px solid #ebebeb;
	padding: 26px;
	padding-top: 32px;
	padding-top: 0;
}
.reaview p {
	color: #5f5c5c;
	text-align: left;
	font-size: small;
	line-height: 26px;
}
.reaview span {
	color: #121212;
	font-size: 16px;
	line-height: 24px;
}

/* 8. Contacto */
.text-contact {
	line-height: normal;
	font-size: smaller;
	max-width: 700px;
	margin-top: -10px;
	margin-bottom: 30px;
}
.border-comprar {
	display: flex;
	margin-top: 40px;
	border-right: solid 1px #4b4949;
	max-width: 1px;
	margin-left: -20px;
	margin-right: 20px;
}
.text-description-uno {
	display: inline-block;
	margin-top: 80px;
	margin-left: -150px;
}
.text-description {
	height: 130px;
	position: absolute;
	display: inline-block;
	margin-top: 75px;
	margin-left: 40px;
}
.text-description-uno h1 {
	font-size: x-large;
	margin-right: -10px;
	margin-bottom: 10px;
}
.text-description h1 {
	display: inline-block;
	font-size: x-large;
	margin-top: 5px;
}
.text-description span,
.text-description-uno span {
	display: flex;
	line-height: 1;
	font-size: small;
	max-width: 350px;
	margin-bottom: 15px;
}
.text-description button {
	margin-top: 15px;
}
.logo-comprar {
	margin-top: -130px;
	max-width: 315px;
	height: 240px;
	margin-left: 90px;
	position: absolute;
}

.logo-service {
	max-width: 316px;
	height: 240px;
	margin-top: -141px;
	margin-left: 90px;
	justify-content: center;
	align-items: center;
	text-align: center;
	position: absolute;
}
.col-lg-6.res {
	flex: 0 0 auto;
	width: 22%;
}

/* 9. footer */

.logoFv {
	display: flex;
	justify-content: center;
	align-items: center;
	margin-top: -80px;
	left: 50%;
}

.logoFv img {
	max-width: 160px;
	max-height: 200px;
}

.footer-logo p {
	color: #999;
}
.links h6,
.latest-news h6 {
	color: white;
	margin: 0;
	text-transform: capitalize;
	line-height: 20px;
}
.links ul li {
	padding-bottom: 8px;
}
.links ul li a {
	text-transform: capitalize;
}
.footer-logo img,
.links h6,
.latest-news h6 {
	padding-bottom: 40px;
}
.links ul li a {
	color: #999;
	position: relative;
}
.links ul li a:before {
	position: absolute;
	content: "";
	width: 0%;
	height: 2px;
	background-color: white;
	bottom: -4px;
}
.links ul li a:hover {
	color: white;
}
.links ul li a:hover:before {
	width: 100%;
}
.links {
	padding-left: 40px;
}
.latest-news p {
	color: #999;
}
.latest-news span {
	color: #666;
	padding-top: 10px;
	display: block;
}
.latest-news form {
	display: flex;
	position: relative;
	padding-top: 26px;
}
.latest-news form input {
	width: 100%;
	height: 60px;
	padding-left: 20px;
	background-color: transparent;
	border: 1px solid #999;
	outline: none;
	color: #666;
}
.latest-news form input::placeholder {
	color: #666;
}
.latest-news form button {
	background-color: #0049ff;
	height: 60px;
	right: 0;
	margin-top: 0px;
	border: 0;
	color: white;
	width: 90px;
	font-size: 16px;
	position: absolute;
	text-transform: capitalize;
	outline: none;
}
.footer-icons {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	/* margin-left: 20px; */
}

.footer-icons img {
	width: 100px;
	height: auto;
	margin: 18px;
}

.col-xl-6 .footer-icons {
	margin-bottom: 20px;
}
.datos {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	margin: 0;
}
.info-footer {
	display: inline-block;
	margin-top: 15px;
	border-left: solid 2px white;
}

.info-footer li {
	/* display: block; */
	color: white;
	font-size: small;
	/* justify-content: center; */
	margin: 12px;
}
.redes {
	display: block;
	margin-top: 15px;
	margin-left: 1px;
	border-left: solid 2px white;
}

.redes p {
	line-height: 2;
	color: white;
	font-size: small;
	margin-top: 12px;
	/* text-align: center; */
	align-items: center;
	/* justify-content: center; */
	/* margin-left: -50px; */
}
.redes a {
	display: inline-block;
	text-align: center;
	align-items: center;
	justify-content: center;
	margin-left: 28px;
	margin-top: 12px;
	color: white;
}
.suscribirse {
	border-left: solid 2px white;
	margin-top: 17px;
	margin-left: -40px;
}
.suscribirse p {
	color: white;
	text-align: center;
	justify-content: center;
	margin-left: 12px;
	margin-top: 10px;
	margin-bottom: 8px;
	font-size: small;
	line-height: 2;
}
.btn-suscription {
	background-color: #cdc2c2;
	width: 130px;
	height: 37px;
	margin-left: 18px;
	position: relative;
}
.btn-suscription:hover {
	background-color: rgb(241, 238, 238);
}

.footer-bottom p {
	font-size: smaller;
}
.footer-bottom {
	display: flex;
	align-items: center;
	justify-content: center;
	/* padding-top: 20px; */
	margin-top: 30px;
	border-top: 1px solid #f7f4f4;
	padding-bottom: 20px;
}
.img-franzi {
	margin-top: 20px;
}

/* 10. breadcrumb */
.title-blog h2 {
	font-size: 70px;
	width: 70%;
	font-weight: 600;
	line-height: 80px;
}
.title-blog a {
	font-size: 20px;
	padding-top: 5px;
}
.title-blog {
	padding-bottom: 60px;
}
.title {
	font-weight: 500;
}
.blog-item h6 {
	padding-top: 40px;
}
.p-30 {
	padding-top: 30px;
}
.quote-bg {
	padding: 40px;
	background-color: #f2edf5;
	display: flex;
	align-items: start;
	margin-top: 40px;
	margin-bottom: 60px;
}
.quote-bg h6 {
	padding: 0;
	margin: 0;
	padding-left: 30px;
	font-weight: 600;
}
.pl-60 {
	padding-left: 60px;
}

/* 11. heading-boder */
.heading-boder {
	z-index: 1111;
}
.heading-boder h2 {
	font-size: 70px;
	width: 52%;
	line-height: 80px;
	font-weight: 600;
	position: relative;
	z-index: 111;
}
.heading-boder span {
	position: relative;
	padding-left: 10px;
	z-index: 111;
}
.heading-boder span:before {
	position: absolute;
	content: "";
	background-image: url(../img/text-line.png);
}
.heading-boder p {
	color: #999999;
	font-size: 20px;
	padding-bottom: 70px;
	position: relative;
}
.heading-boder span:before {
	position: absolute;
	content: "";
	background-image: url(../img/text-line.png);
	height: 19%;
	background-repeat: no-repeat;
	width: 100%;
	top: 93%;
}

/* 12. style-shapes */
.style-shapes-4 {
	position: absolute;
	bottom: 39%;
	z-index: 0;
	animation: tp-float-2 6s infinite alternate;
}
.style-shapes-5 {
	position: absolute;
	animation: zoomInOut 6s infinite alternate;
	z-index: 0;
	right: 9%;
	top: 40%;
}
.style-shapes-6 {
	position: absolute;
	animation: zoomInOut 5s infinite alternate;
	z-index: 0;
	top: 20%;
	left: 23%;
}
.style-shapes-3 {
	position: absolute;
	display: block;
	width: 30px;
	height: 30px;
	background-color: #e2ecf1;
	border-radius: 60%;
	top: 33%;
	left: 3%;
	animation: tp-float-1 12s infinite alternate;
}
.style-shapes-1 {
	position: absolute;
	display: block;
	border: 10px solid #e2ecf1;
	top: 8%;
	width: 60px;
	height: 60px;
	left: 75%;
	z-index: 0;
	animation: zoomInOut 8s infinite alternate;
}
.style-shapes-2 {
	position: absolute;
	top: 6%;
	left: 37%;
	animation: rotateme 2s infinite alternate;
}
@keyframes tp-float-1 {
	0% {
		transform: translate(0px, 0px) rotate(0deg) scale(1);
	}

	50% {
		transform: translate(30px, 40px) rotate(0deg) scale(1);
	}

	100% {
		transform: translate(0px, 0px) rotate(0deg) scale(1);
	}
}

@keyframes tp-float-2 {
	0% {
		transform: translate(0px, 0px) rotate(0deg) scale(1);
	}

	50% {
		transform: translate(30px, -30px) rotate(0deg) scale(1);
	}

	100% {
		transform: translate(0px, 0px) rotate(0deg) scale(1);
	}
}
@keyframes rotateme {
	from {
		transform: rotate(0deg);
	}
	to {
		transform: rotate(360deg);
	}
}
.rotate-me {
	animation-name: rotateme;
	animation-duration: 20s;
	animation-iteration-count: infinite;
	animation-timing-function: linear;
}
.zoominout {
	animation-name: zoomInOut;
	animation-duration: 3s;
	animation-iteration-count: infinite;
	animation-timing-function: ease-in-out;
}

@keyframes zoomInOut {
	0% {
		-webkit-transform: rotate(0deg) scale(0.7);
		transform: rotate(0deg) scale(0.7);
		opacity: 0;
	}

	50% {
		-webkit-transform: rotate(180deg) scale(1);
		transform: rotate(180deg) scale(1);
		opacity: 1;
	}

	100% {
		-webkit-transform: rotate(360deg) scale(0.7);
		transform: rotate(360deg) scale(0.7);
		opacity: 0;
	}
}
/* 13. video-img */
.heading-boder.two {
	text-align: center;
}
.heading-boder.two h2 {
	margin: auto;
}
.heading-boder p {
	color: #999999;
	font-size: 20px;
	padding-bottom: 70px;
	position: relative;
	padding-top: 20px;
}
.video-section {
	position: relative;
}
.video-section .style-shapes-4 {
	top: 3%;
	right: 62%;
}
.video-img {
	position: relative;
}
.video-img i {
	position: absolute;
	color: white;
	font-size: 20px;
	top: 50%;
	left: 50%;
	display: block;
	line-height: 50%;
	padding: 20px;
	border: 1px solid #fff;
	transform: translate(-50%, -50%);
	border-radius: 42px;
	height: 80px;
	width: 80px;
	display: flex;
	align-items: center;
	justify-content: center;
}
.video-img {
	position: relative;
	margin-bottom: -120px;
	z-index: 111;
}
.video-section .style-shapes-2 {
	left: 6%;
	top: 11%;
}
.style-shapes-7 {
	left: 88%;
	top: 20%;
	position: absolute;
	animation: tp-float-2 6s infinite alternate;
	z-index: 0;
}
/* 14. get in touch */
.get-in-touch {
	padding-top: 240px;
	background-color: #222;
}
.get-in-touch .heading h2 {
	color: white;
}
.get-in-touch .heading p {
	color: #999;
	width: 90%;
	padding-top: 10px;
}
/* 15. form.touch */
form.touch input {
	border: 0;
	outline: none;
	background-color: transparent;
	border-bottom: 1px solid #b7b7b7;
	width: 100%;
	color: #ccc;
}
form.touch textarea {
	border: 0;
	outline: none;
	background-color: transparent;
	border-bottom: 1px solid #b7b7b7;
	width: 100%;
	color: #ccc;
	margin-top: 50px;
	padding: 0;
}
form.touch textarea::placeholder {
	color: #ccc;
}
form.touch input::placeholder {
	color: #ccc;
}
form.touch input:focus {
	border-bottom: 1px solid #fff;
}
form.touch textarea:focus {
	border-bottom: 1px solid #fff;
}
form.touch .btugap {
	padding: 0;
	text-align: end;
	padding-top: 40px;
}
/* 16. btn */
.themebtu {
	color: #0049ff;
	border: 1px solid #0049ff;
	border-radius: 5px;
	font-size: 16px;
	font-weight: 600;
}
.themebtu {
	border-color: #0049ff;
	color: #0049ff;
	padding: 12px 40px;
	background-image: linear-gradient(45deg, #0049ff 50%, transparent 50%);
	background-position: 100%;
	background-size: 400%;
	transition: 0.5s ease-in-out;
	display: inline-block;
}
.themebtu:hover {
	background-position: 0;
	color: white;
}
.themebtu.full {
	background-color: #0049ff;
	color: white;
}
.themebtu.full {
	border: #0049ff 1px solid;
	background-image: linear-gradient(45deg, #000000 50%, transparent 50%);
}
.themebtu.full:hover {
	border: black 1px solid;
}

.btugap {
	text-align: center;
	padding-top: 70px;
}
.themebtu:hover {
	background-position: 0;
	color: white;
}
/* 17. home 2 style */
.herotwoswiper .swiper-pagination.swiper-pagination-clickable.swiper-pagination-bullets.swiper-pagination-horizontal {
	position: absolute;
	margin: 0;
	bottom: 16%;
}
.hero-section-one.two .heading-boder span {
	display: inline-block;
	width: auto;
}
.hero-section-one.two {
	padding-top: 311px;
	padding-bottom: 280px;
	clip-path: polygon(0 0%, 100% 0, 100% 85%, 0 100%);
}
/* 18. marketing */
.marketing h4 {
	padding-top: 20px;
	padding-bottom: 30px;
	font-size: 20px;
	line-height: 30px;
	margin-bottom: 0;
}
.marketing p {
	padding-bottom: 30px;
}
.marketing.two p {
	padding-bottom: 30px;
	width: 90%;
}
.successful h3 {
	font-weight: 600;
	font-size: 40px;
	line-height: 50px;
	padding-right: 16px;
}
.successful p {
	line-height: 26px;
}
.separator {
	display: block;
	width: 1px;
	height: 90px;
	background-color: #ebebeb;
	margin: 0px 30px;
}
.successful {
	display: flex;
	justify-content: space-between;
	padding-top: 30px;
	border-top: 1px solid #ebebeb;
}
/* 19. brands-we-work */
.brands-we-work {
	text-align: center;
	border-top: 1px solid #ebebeb;
	padding: 60px 0;
}
.brands-we-work h6 {
	font-size: 20px;
	font-weight: 600;
	margin-bottom: 0;
	padding-bottom: 50px;
}
.swiper-container.brandswiper,
.swiper-container.testimonialsswiper,
.studiesswiper {
	overflow: hidden;
}
.studiesswiper .swiper-pagination.swiper-pagination-clickable.swiper-pagination-bullets.swiper-pagination-horizontal {
	display: block;
	margin-top: 0px;
	position: absolute;
}
.studiesswiper {
	margin-bottom: 60px;
}
/* 20. Sercives */
.sercives {
	position: relative;
	overflow: hidden;
	padding-top: 180px;
}
.sercives:before {
	position: absolute;
	content: "";
	width: 100%;
	height: 716px;
	background-color: #f3f8fb;
	top: 0;
	clip-path: polygon(0 0, 100% 18%, 100% 100%, 0 82%);
}
.sercive-style {
	position: relative;
	z-index: 111;
}
.sercive-style-text {
	border: 1px solid #ebebeb;
	padding: 35px;
	text-align: center;
	background-color: white;
}
.sercive-style-text h6 {
	font-weight: 600;
}
.sercive-style-text a {
	padding-top: 0px;
	display: block;
	opacity: 0;
	visibility: hidden;
	margin-top: -27px;
}
.sercive-style:hover {
	box-shadow: -1px 0px 42px -10px rgba(0, 0, 0, 0.11);
	-webkit-box-shadow: -1px 0px 42px -10px rgba(0, 0, 0, 0.11);
	-moz-box-shadow: -1px 0px 42px -10px rgba(0, 0, 0, 0.11);
}
.sercive-style:hover .sercive-style-text a {
	opacity: 1;
	visibility: visible;
	padding-top: 14px;
	margin-top: 0px;
}
.sercives .style-shapes-5 {
	animation: tp-float-2 6s infinite alternate;
}

/* 21. strategic-sercives */
.strategic-sercives {
	display: flex;
}
.strategic-sercives h4 {
	font-weight: 600;
}
.strategic-sercives h2 {
	font-size: 70px;
	font-weight: 800;
	color: #f2edf5;
	padding-right: 12px;
	line-height: 70px;
}
/* 22. testimonials */
.testimonials {
	position: relative;
	display: flex;
	align-items: center;
}
.testimonialsswiper {
	position: relative;
}
.testimonials i {
	position: absolute;
	top: -14px;
	left: 25%;
	z-index: -1;
	font-size: 90px;
	color: #f2edf5;
}
.testimonials p {
	color: #222;
	padding-bottom: 20px;
	width: 95%;
}
.testimonials span {
	color: #222;
	font-size: 13px;
}
.testimonials img {
	border-radius: 50%;
	margin-right: 50px;
}
.testimonials h6 {
	font-weight: 600;
	padding-bottom: 10px;
	margin: 0;
}
/* 23. case-studies-two */
.section-case-studies {
	border-top: 1px solid #ebebeb;
	position: relative;
}
.case-studies-two {
	position: relative;
	z-index: 11;
}
.case-studies .heading-boder span {
	padding: 0;
}
.section-case-studies .heading-boder.two {
	padding-bottom: 50px;
}
.section-case-studies .style-shapes-4 {
	top: 10%;
	left: 1%;
}
.section-case-studies .style-shapes-7 {
	left: 92%;
	top: 27%;
}
.section-case-studies .style-shapes-5 {
	right: 20%;
	top: 5%;
}
.section-case-studies .style-shapes-6 {
	top: auto;
	bottom: 8%;
	left: 23%;
}
.case-studies-two figure:before {
	position: absolute;
	content: "";
	width: 0%;
	height: 0%;
	opacity: 0;
}
.case-studies-two:hover figure:before {
	opacity: 0.8;
	width: 100%;
	height: 100%;
}
.case-studies-text {
	position: absolute;
	text-align: center;
	top: 40%;
	left: 50%;
	transform: translate(-50%, -50%);
	opacity: 0;
	width: 100%;
}
.case-studies-text li {
	font-weight: 600;
}
.case-studies-text li {
	color: white;
	display: inline-block;
}
.case-studies-text h5 {
	font-size: 20px;
	line-height: 30px;
	font-weight: 600;
}
.case-studies-text h5,
.case-studies-text a {
	color: white;
}
.case-studies-two:hover .case-studies-text {
	opacity: 1;
	top: 50%;
}
/* 24. team-member */
.team-section {
	position: relative;
	overflow: hidden;
	padding-top: 220px;
}
.team-section:before {
	position: absolute;
	content: "";
	width: 100%;
	height: 652px;
	background-color: #f2edf5;
	top: 0;
	clip-path: polygon(0 18%, 100% 0, 100% 82%, 0 100%);
}
.team-member-text {
	border: 1px solid #e9e9ea;
	padding: 35px;
	text-align: center;
	background-color: white;
}
.team-member {
	margin-bottom: 20px;
}
.team-member-text h6 {
	margin: 0;
	color: #222;
	font-weight: 600;
}
.brandicon {
	display: flex;
	justify-content: center;
	align-items: center;
	opacity: 0;
	margin-top: -20px;
	visibility: hidden;
}
.brandicon li {
	padding-right: 15px;
}
.brandicon li a i {
	color: #b3baca;
	font-size: 14px;
}
.team-member:hover .brandicon {
	opacity: 1;
	visibility: visible;
	margin-top: 20px;
}
.team-member {
	position: relative;
	z-index: 1111;
}
.team-member:hover,
.blog-posts-text:hover,
.makes-us-different-text:hover {
	box-shadow: -1px 0px 42px -10px rgba(0, 0, 0, 0.11);
	-webkit-box-shadow: -1px 0px 42px -10px rgba(0, 0, 0, 0.11);
	-moz-box-shadow: -1px 0px 42px -10px rgba(0, 0, 0, 0.11);
}
.team-section .style-shapes-5 {
	right: 26%;
	top: 8%;
}
.join-our-team h5 {
	margin-bottom: 0;
	font-weight: 600;
}
.join-our-team {
	width: 100%;
	height: 504px;
	border: 1px solid #0049ff;
	text-align: center;
	justify-content: center;
	align-items: center;
	display: flex;
}
.join-our-team span {
	color: #666;
}
/* 25. blog posts */
.blog-posts-text {
	padding: 40px;
	border: 1px solid #ebebeb;
}
.blog-posts {
	overflow: hidden;
}
.blog-posts-text a {
	color: #999;
	font-size: 13px;
}
.blog-posts-text a i {
	padding-right: 6px;
}
.blog-posts-text a h4 {
	color: #222;
	padding-top: 10px;
	margin-bottom: 0;
	padding-bottom: 10px;
	font-weight: 600;
}
.blog-posts-text > span {
	font-weight: 600;
	padding-top: 20px;
	display: block;
}
section.blog-posts .heading-boder.two h2 {
	padding-bottom: 65px;
}
.awesome-project {
	text-align: center;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 60px 0;
	border-top: 1px solid #ebebeb;
}
.awesome-project h4 {
	font-weight: 700;
	padding-right: 70px;
}
/* 26. home 3 */
/* 27. header two style */
header.two .bar-menu i {
	color: #222;
}
header.two {
	position: relative;
	padding-bottom: 10px;
}
header.two .menu a {
	color: #222;
}
header.two .menu > li .sub-menu li:before {
	height: 2px;
}
header.two .menu > li > .sub-menu li a {
	margin: 0;
	color: white;
}
header.two .square {
	border: 1px solid #222;
	color: #222;
}
header.two input {
	border: 2px solid #222;
	color: #222;
}
header.two .themebtu {
	color: #0049ff;
	border: 1px solid #0049ff;
	background-image: linear-gradient(45deg, #0049ff 50%, transparent 50%);
}
header.two .themebtu:hover {
	color: #fff;
}
.hero-section-three .heading-boder h2 {
	width: 100%;
}
.hero-section-three .heading-boder {
	padding-left: 49px;
}
.hero-section-three .heading-boder span {
	display: block;
	padding-left: 0;
}
header.two .search:before,
header.two .close:after {
	background-color: #222;
}
.hero-section-three .heading-boder span:before {
	background-image: url(../img/text-line-blu.png);
}
section.hero-section-three {
	position: relative;
}
.swiper-pagination.two-style {
	margin: 0 !important;
	padding: 0;
	left: -38%;
	top: 78%;
	position: absolute !important;
}
/* 28. our clients */
.our-clients {
	text-align: center;
}
.our-clients h4 {
	font-size: 18px;
	font-weight: 600;
	line-height: 28px;
}
.why-choose-us .heading-boder span {
	padding-left: 0;
}
.our-clients span {
	font-size: 14px;
	color: #999;
}
.our-clients ul {
	display: flex;
	width: 100%;
	flex-wrap: wrap;
	align-items: center;
	margin-top: 40px;
}
.our-clients ul li {
	width: 25%;
	padding: 60px;
	border: 1px solid #edf0f3;
	margin: -1px;
	margin-bottom: 0px;
}
.our-clients ul li img:hover {
	transform: scale(1.2);
}
/* 29. why-choose-us */
section.why-choose-us .heading-boder h2 {
	width: 100%;
}
.why-choose-text h6 {
	font-size: 20px;
	padding-top: 40px;
	line-height: 30px;
}
.why-choose-text h5 {
	font-size: 20px;
	font-weight: 600;
	line-height: 30px;
	padding-top: 30px;
}
.why-choose-text {
	width: 88%;
}
/* 30. choose-us-img */
.choose-us-img {
	position: relative;
}
.choose-us-img {
	position: relative;
	margin-bottom: 25px;
}
.choose-us-img-text {
	position: absolute;
	text-align: center;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}
.choose-us-img-text svg {
	width: 50px;
	height: auto;
	fill: white;
}
.choose-us-img-text h5 {
	color: white;
	font-size: 22px;
	padding-top: 14px;
	font-weight: 600;
	line-height: 32px;
	padding-bottom: 10px;
}
.choose-us-img-text a {
	color: white;
	opacity: 0;
	margin-top: -20px;
	display: block;
}
.choose-us-img figure:before {
	position: absolute;
	content: "";
	width: 0%;
	height: 0%;
	opacity: 0;
}
.choose-us-img:hover figure:before {
	opacity: 0.8;
	width: 100%;
	height: 100%;
}
.choose-us-img:hover .choose-us-img-text a {
	opacity: 1;
	margin-top: 0;
}
/* 31. makes-us-different */
.makes-us-different {
	padding-top: 240px;
	margin-top: -120px;
}
.makes-us-different .heading {
	margin-bottom: 60px;
}
.makes-us-different-text {
	background-color: white;
	padding: 40px;
	text-align: center;
}
.makes-us-different-text svg {
	width: 70px;
	height: auto;
}
.makes-us-different-text h4 {
	font-weight: 600;
	padding-top: 30px;
	padding-bottom: 20px;
	margin: 0;
}
.makes-us-different-text a {
	font-weight: 500;
	opacity: 0;
	padding-top: 0;
	display: block;
}
.makes-us-different-text:hover a {
	opacity: 1;
	padding-top: 20px;
}
.counter-text .boder {
	width: 60px;
	height: 1px;
}
/* 32. counter */
.counter-text h6 {
	margin: 0;
	line-height: 19px;
	font-size: 50px;
}
.counter {
	font-size: 50px;
	font-weight: 600;
	line-height: 50px;
}
.counter-text {
	text-align: center;
}
/* 33. case-studies */
.case-studies .heading-boder h2 {
	width: 100%;
}
.case-studies {
	background-color: #222;
}
.case-studies .heading-boder h2 {
	color: white;
}
.case-studies .heading-boder span:before {
	background-image: url(../img/text-line-b.png);
}
.case-studies .heading-boder span {
	display: block;
}
.case-studies .heading-boder p {
	padding-bottom: 50px;
}
.case-studies-project img {
	border-radius: 5px;
}
.case-studies-project p {
	color: #999;
	padding-bottom: 10px;
}
.case-studies-project h4 {
	color: white;
	font-weight: 600;
	padding-top: 20px;
	font-size: 20px;
}
.case-studies-project a {
	position: relative;
}
.case-studies-project a:hover {
	color: white;
}
.case-studies-project a:hover:before {
	width: 100%;
}
.case-studies-project a:before {
	content: "";
	position: absolute;
	width: 0%;
	height: 1px;
	bottom: 0;
	background-color: white;
}
.case-studies .style-shapes-3 {
	left: 33%;
	top: 55%;
}
.case-studies .style-shapes-1 {
	border: 10px solid #0049ff;
}
.style-shapes-2 {
	position: absolute;
	top: 6%;
	left: 5%;
	animation: rotateme 39s infinite alternate;
}
.services-two {
	position: relative;
}
.services-two .style-shapes-4 {
	left: 59%;
	top: 63%;
}
.services-two .style-shapes-6 {
	top: 69%;
	left: 48%;
}
.services-two .style-shapes-5 {
	right: 6%;
}
.services-two .style-shapes-7 {
	left: 79%;
	top: 7%;
}
/* 34. satisfied-clients */
.satisfied-clients .heading-boder h2 {
	width: 69%;
}
.satisfied-clients .heading-boder span {
	padding-left: 0;
}
/* 35. client-review */
.client-review {
	border: 1px solid #ebebeb;
	padding: 50px;
	text-align: center;
	padding-top: 0;
	background-color: white;
}
.client-review i {
	color: white;
	height: 70px;
	width: 70px;
	font-size: 35px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: auto;
	transform: translateY(-34px);
}
.client-review h4 {
	font-weight: 600;
	margin: 0;
}
.client-review p {
	color: black;
	padding-bottom: 30px;
	padding-top: 20px;
}
.satisfied-clients {
	position: relative;
	overflow: hidden;
}
.satisfied-clients:before {
	position: absolute;
	content: "";
	z-index: -1;
	width: 100%;
	background-color: #f3f8fb;
	height: 76%;
	bottom: 0;
}
.satisfied-clients .heading-boder p {
	color: #666;
}
/* 36. form touch.two */
form.touch.two {
	margin-top: 100px;
}
form.touch.two input {
	border: 0;
	outline: none;
	background-color: transparent;
	border-bottom: 1px solid #b7b7b7;
	width: 100%;
	color: #666;
}
form.touch.two textarea {
	border: 0;
	outline: none;
	background-color: transparent;
	border-bottom: 1px solid #b7b7b7;
	width: 100%;
	color: #666;
	margin-top: 50px;
	padding: 0;
}
form.touch.two textarea::placeholder {
	color: #666;
}
form.touch.two input::placeholder {
	color: #666;
}
form.touch.two input:focus {
	border-bottom: 1px solid #000;
}
form.touch.two textarea:focus {
	border-bottom: 1px solid #000;
}
form.touch.two .btugap {
	text-align: inherit;
}
.map iframe {
	width: 100%;
	height: 493px;
}
.case-studies {
	position: relative;
}
/* 37. 404 page */
.page-not {
	display: flex;
	align-items: center;
}
.page-not h2 {
	color: white;
	font-size: 100px;
	line-height: 66px;
	font-weight: 600;
	padding-right: 40px;
	margin-right: 40px;
	border-right: 1px solid #b3baca;
	margin-bottom: 0;
}
.page-not h3 {
	color: white;
	font-size: 40px;
	line-height: 50px;
	font-weight: 600;
	margin: 0;
}
.page-not h5 {
	color: #b3baca;
	font-size: 16px;
	font-weight: 400;
	margin: 0;
}
.error-page {
	padding-top: 320px;
	padding-bottom: 275px;
}
/* 38. blog page */
header.three {
	padding-bottom: 10px;
	position: relative;
	margin-bottom: 70px;
}
.blog-recent-posts {
	border-top: 1px solid #ebebeb;
	padding-top: 70px;
	margin-top: 70px;
}
.blog-recent-posts h4 {
	font-weight: 600;
	font-size: 22px;
}
.sidebar h4 {
	font-size: 18px;
	margin: 0;
	font-weight: 600;
	padding-bottom: 2px;
}
.sidebar span {
	color: #999;
}
.sidebar li {
	padding-bottom: 12px;
}
ul.sidebar .brandicon {
	opacity: 1;
	visibility: visible;
	margin: 0;
	justify-content: flex-start;
}
/* 39. splash-area-section */
.splash-area-section {
	background-position: center;
	background-size: cover;
	padding-top: 180px;
	padding-bottom: 120px;
}
.splash-area h2 {
	color: white;
	width: 58%;
	font-weight: 600;
	font-size: 70px;
	line-height: 80px;
	margin-bottom: 0;
}
.splash-area a {
	color: white;
	font-size: 20px;
	text-transform: capitalize;
}
/* 40. discovery */
.discovery {
	position: relative;
}
.discovery .style-shapes-4 {
	bottom: 39%;
	left: 47%;
}
.discovery .style-shapes-7 {
	left: 39%;
	top: 98%;
}
.discovery .style-shapes-6 {
	top: 4%;
	left: 33%;
}
.discovery .heading p {
	width: 90%;
	padding-top: 20px;
	padding-bottom: 35px;
}
.discovery-text {
	background-color: #222;
	padding: 30px 80px;
}
.discovery-text svg {
	width: 60px;
	height: auto;
	fill: white;
}
.discovery-text h4 {
	color: white;
	font-weight: 600;
	padding-top: 25px;
	padding-bottom: 10px;
}
.discovery-text p {
	color: white;
}
.discovery-img {
	margin-bottom: -100px;
	position: relative;
	z-index: 1;
}
.digital-services {
	padding-top: 220px;
}
.digital-services .heading {
	margin-bottom: 30px;
}
.discovery-text.two {
	background-color: white;
	border: 1px solid #ebebeb;
	padding: 30px 55px;
}
.discovery-text.two h4 {
	color: #222;
	display: inline-block;
}
.discovery-text.two p {
	color: #999;
}
.digital-services .discovery-img {
	margin: 0;
	margin-bottom: 28px;
}
/* 41. team-welcome-text */
.team-welcome-text {
	padding-top: 40px;
}
.team-welcome-text p {
	padding-bottom: 20px;
}
/* 42. Pricing-style */
.Pricing-style {
	background-color: white;
	padding: 70px;
	border: 1px solid #fff;
	border-radius: 5px;
}
.Pricing-style:hover {
	background-color: white;
	border: 1px solid #0049ff;
}
.standard span {
	font-size: 40px;
	font-weight: 600;
}
.standard span sup {
	font-size: 23px;
}
.standard h5 {
	font-size: 20px;
	font-weight: 600;
}
.standard {
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-bottom: 1px solid #eae2ef;
	padding-bottom: 15px;
	margin-bottom: 30px;
}
.plans-pricing .heading {
	padding-bottom: 35px;
}
.plans-pricing {
	position: relative;
}
.Pricing-style {
	position: relative;
	z-index: 1;
}
.Pricing-style p {
	color: #999;
}
.Pricing-style ul {
	padding: 30px 0;
	padding-top: 20px;
}
.Pricing-style ul li {
	padding-bottom: 14px;
}
.Pricing-style ul li i {
	padding-right: 10px;
}
/* 43. accordion */
.accordion {
	width: 100%;
	max-width: 75rem;
}
.accordion-item {
	position: relative;
	background-color: transparent;
	border: 0;
}
.questions h4 {
	font-weight: 600;
	border-bottom: 1px solid #e8f1f7;
	padding-bottom: 25px;
	margin-bottom: 20px;
}
.accordion-item.active .heading {
	color: #222;
}
.accordion-item.active .icon:before {
	background: #222;
}
.accordion-item.active .icon:after {
	width: 0;
}
.accordion-item.active .icon:before {
	background: #222;
}
.accordion-item .heading {
	display: block;
	text-transform: capitalize;
	text-decoration: none;
	color: #222;
	font-weight: 700;
	font-size: 16;
	position: relative;
	transition: 0.3s ease-in-out;
	padding-bottom: 20px;
}
@media (min-width: 40rem) {
	.accordion-item .heading {
		font-size: 1.2rem;
	}
}
.accordion-item .heading:hover {
	color: #222;
}
.accordion-item .heading:hover .icon:before,
.accordion-item .heading:hover .icon:after {
	background: #000000;
}
.accordion-item .icon {
	position: absolute;
	top: 47%;
	right: 0;
	height: 2rem;
	transform: translateY(-50%);
}
.accordion-item .icon:before,
.accordion-item .icon:after {
	content: "";
	width: 12px;
	height: 3px;
	background: black;
	position: absolute;
	border-radius: 3px;
	left: 50%;
	top: 50%;
	transition: 0.3s ease-in-out;
	transform: translate(-50%, -50%);
}
.accordion-item.active .heading:hover .icon:before {
	background: #222;
}
.accordion-item .icon:after {
	transform: translate(-50%, -50%) rotate(90deg);
	z-index: -1;
}
.accordion-item .content {
	display: none;
}
.accordion-item .content p {
	margin-top: 0;
	color: #666;
	margin-left: 0;
	width: 94%;
	margin-bottom: 26px;
}
@media (min-width: 40rem) {
	.accordion-item .content {
		line-height: 1.75;
	}
}
.questions {
	margin-top: 20px;
}
/* 44. splash-area.blog */
.splash-area.blog h2 {
	color: #222;
}
.latest-blog-post {
	padding-top: 70px;
}
.latest-blog.gap {
	overflow: hidden;
}

/* 45. portfolio */
.portfolio-controllers {
	margin-bottom: 40px;
}
.portfolio-controllers button {
	background-color: transparent;
	border: 0;
	margin: 0 20px 0 0px;
	font-size: 20px;
	color: #666;
}
.portfolio-controllers button.is-checked {
	border-bottom: 1px solid;
}
.portfolio-img span {
	color: #999;
	display: block;
	padding-bottom: 4px;
}
.portfolio-img h3 {
	font-size: 16px;
	font-weight: 600;
	margin-bottom: 4px;
	padding-top: 12px;
	line-height: 26px;
	margin-bottom: 0;
}
.portfolio-detail {
	background: rgba(255, 255, 255, 0.8);
	width: 100%;
	height: 100%;
	padding: 0;
}
.portfolios-data h4 {
	font-size: 16px;
	font-weight: 600;
	margin: 0;
}
.portfolios-three {
	position: relative;
	margin-bottom: 20px;
}
.portfolios-data {
	position: absolute;
	background-color: #ffffffc4;
	width: 100%;
	bottom: 0;
	padding: 20px 32px;
	opacity: 0;
}
.portfolios-three:hover .portfolios-data {
	opacity: 1;
}
.portfolimg {
	padding-top: 40px;
}
.portfolimg span {
	font-size: 13px;
}
.portfolimg.two {
	padding-top: 0;
	padding-bottom: 25px;
}

/* 46. blog-content */
.blog-content {
	display: flex;
	align-items: center;
	background-color: #f3f8fb;
}
.blog-content .latest-blog-post {
	padding: 0;
	padding: 50px 70px;
}
.blog-content .latest-blog-post p {
	font-size: 20px;
}
.blog-content .latest-blog-post a span {
	padding-top: 0;
}
.blog-content .latest-blog-post span {
	padding-top: 40px;
}
.latest-blog-post h2 {
	font-weight: 600;
	padding-bottom: 12px;
	padding-top: 10px;
}

/* 47. content-form */
form.content-form input {
	width: 100%;
	margin-bottom: 20px;
	height: 45px;
	padding-left: 15px;
	border: 1px solid #cccccc;
}
form.content-form input,
textarea {
	width: 100%;
	margin-bottom: 20px;
	height: 50px;
	padding-left: 15px;
	border: 1px solid #cccccc;
	outline: none;
}
textarea {
	height: 120px;
	padding-top: 14px;
}
form.content-form button.themebtu {
	background-color: transparent;
}
section.offices {
	margin-top: -7px;
}
/* 48. content page offices */
.offices {
	position: relative;
	overflow: hidden;
}
.offices .style-shapes-7 {
	left: 75%;
	top: 5%;
}
.offices .style-shapes-6 {
	top: 85%;
	left: 23%;
}
.offices .heading p {
	width: 90%;
}
.offices .style-shapes-5 {
	right: 58%;
	top: 17%;
}
.view-map-data {
	text-align: center;
	padding: 50px;
	padding-top: 0;
	background-color: white;
}
.view-map-data h5 {
	font-size: 20px;
	font-weight: 600;
	margin-bottom: 0;
	padding-bottom: 20px;
}
.view-map-data i {
	font-size: 25px;
	color: white;
	width: 70px;
	height: 70px;
	justify-content: center;
	align-items: center;
	display: flex;
	margin: auto;
	border-radius: 50%;
	transform: translateY(-40px);
}
.view-map-data p {
	color: #222;
	padding-bottom: 20px;
}
/* 49. next-previous */
.next-previous svg {
	width: 45px;
	height: auto;
	fill: #999;
}
.next-previous a {
	color: #666;
}
.next-previous a:hover svg {
	fill: #4f4f4f;
}
.prev svg {
	transform: rotate(180deg);
	margin-right: 20px;
}
.next-previous {
	padding-top: 70px;
	padding-bottom: 70px;
	border-top: 1px solid #ebebeb;
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.next-previous-page.two .next-previous {
	padding-bottom: 0;
	border: 0;
}
.next svg {
	margin-left: 20px;
}
section.gap.blog-recent-posts .latest-blog-post {
	padding-top: 0;
}
/* 50. about paga */
.things-differently {
	position: relative;
}
.things-differently .heading img.dots {
	left: 30%;
}
.ceo {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-top: 35px;
}
.ceo span {
	display: block;
	font-size: 16px;
	color: #999;
	padding-top: 14px;
}
.we-deliver-results .makes-us-different-text {
	margin-top: 30px;
}
/* 51. awards */
.awards span {
	color: #999;
	padding-bottom: 40px;
	display: block;
}
.awards-text h6 {
	font-size: 15px;
	color: white;
	font-weight: 600;
	padding-bottom: 0;
}
.awards-text .boder {
	width: 70px;
	height: 1px;
	background: white;
}
.awards-text {
	background-color: #b3baca;
	text-align: center;
	padding: 60px 50px;
	margin-left: 3px;
	height: 100%;
}
.offices .client-review {
	margin-top: 36px;
}

/* 52. search-btn */
header #content {
	position: absolute;
	height: auto;
	width: auto;
}
header #content.on {
	-webkit-animation-name: in-out;
	animation-name: in-out;
	-webkit-animation-duration: 0.2s;
	animation-duration: 0.2s;
	-webkit-animation-timing-function: linear;
	animation-timing-function: linear;
	-webkit-animation-iteration-count: 1;
	animation-iteration-count: 1;
}
header input {
	box-sizing: border-box;
	width: 20px;
	height: 20px;
	border: 2px solid #ffffff;
	border-radius: 50%;
	background: none;
	color: #fff;
	font-size: 16px;
	font-weight: 400;
	outline: 0;
	-webkit-transition: width 0.2s ease-in-out, border-radius 0.2s ease-in-out, padding 0.2s;
	transition: width 0.2s ease-in-out, border-radius 0.2s ease-in-out, padding 0.2s;
	-webkit-transition-delay: 0.2s;
	transition-delay: 0.2s;
	-webkit-transform: translate(-100%, -50%);
	-ms-transform: translate(-100%, -50%);
	transform: translate(-100%, -50%);
}
header .search {
	background: none;
	position: absolute;
	top: 0px;
	left: 0;
	height: 50px;
	width: 50px;
	padding: 0;
	border-radius: 100%;
	outline: 0;
	border: 0;
	color: inherit;
	cursor: pointer;
	-webkit-transition: 0.2s ease-in-out;
	transition: 0.2s ease-in-out;
	-webkit-transform: translate(-100%, -50%);
	-ms-transform: translate(-100%, -50%);
	transform: translate(-100%, -50%);
}
header .search:before {
	content: "";
	position: absolute;
	width: 10px;
	height: 1px;
	background-color: #fff;
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
	margin-top: 13px;
	margin-left: 18px;
	-webkit-transition: 0.2s ease-in-out;
	transition: 0.2s ease-in-out;
}
header .close {
	-webkit-transition: 0.2s ease-in-out;
	transition: 0.2s ease-in-out;
	-webkit-transition-delay: 0.2s;
	transition-delay: 0.2s;
}
header .close:before {
	content: "";
	position: absolute;
	width: 27px;
	height: 4px;
	margin-top: -1px;
	margin-left: -13px;
	background-color: #fff;
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
	-webkit-transition: 0.2s ease-in-out;
	transition: 0.2s ease-in-out;
}
header .close:after {
	content: "";
	position: absolute;
	width: 27px;
	height: 4px;
	background-color: #fff;
	margin-top: -1px;
	margin-left: -13px;
	cursor: pointer;
	-webkit-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	transform: rotate(-45deg);
}
header .square {
	box-sizing: border-box;
	padding: 0 40px 0 10px;
	width: 300px;
	height: 50px;
	border: 1px solid #ffffff;
	border-radius: 0;
	background: none;
	color: #fff;
	font-size: 16px;
	font-weight: 400;
	outline: 0;
	-webkit-transition: width 0.2s ease-in-out, border-radius 0.2s ease-in-out, padding 0.2s;
	transition: width 0.2s ease-in-out, border-radius 0.2s ease-in-out, padding 0.2s;
	-webkit-transition-delay: 0.2s, 0s, 0.2s;
	transition-delay: 0.2s, 0s, 0.2s;
	-webkit-transform: translate(-100%, -50%);
	-ms-transform: translate(-100%, -50%);
	transform: translate(-100%, -50%);
	border-radius: 5px;
}
/* 53. mobile-nav */
.mobile-nav {
	position: fixed;
	top: 0;
	left: 0;
	width: 30%;
	height: 100%;
	background-color: #222;
	padding: 50px 40px 15px;
	z-index: 5;
	transition: 0.45s ease-in-out;
	transform: translateX(-101%);
	-webkit-transform: translateX(-101%);
	-moz-transform: translateX(-101%);
	-o-transform: translateX(-101%);
	overflow-y: auto;
}

.mobile-nav ul li a svg {
	width: 11px;
}

.for #nav-icon4 {
	color: black;
}

#nav-icon4 span:nth-child(1) {
	top: 0px;
	-webkit-transform-origin: left center;
	-moz-transform-origin: left center;
	-o-transform-origin: left center;
	transform-origin: left center;
}

#nav-icon4 span:nth-child(2) {
	top: 13px;
	-webkit-transform-origin: left center;
	-moz-transform-origin: left center;
	-o-transform-origin: left center;
	transform-origin: left center;
}

.responsive-bar {
	display: none;
}

#nav-icon4 span:nth-child(3) {
	top: 25px;
	-webkit-transform-origin: left center;
	-moz-transform-origin: left center;
	-o-transform-origin: left center;
	transform-origin: left center;
}

#nav-icon4.open span:nth-child(1) {
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	-o-transform: rotate(45deg);
	transform: rotate(45deg);
	top: -3px;
	left: 8px;
}

#nav-icon4.open span:nth-child(2) {
	width: 0%;
	opacity: 0;
}

#nav-icon4.open span:nth-child(3) {
	-webkit-transform: rotate(-45deg);
	-moz-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	transform: rotate(-45deg);
	top: 35px;
	left: 8px;
}

i#nav-icon4 {
	display: none;
}

#nav-icon4 {
	width: 40px;
	height: 25px;
	position: relative;
	-webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	transform: rotate(0deg);
	-webkit-transition: 0.5s ease-in-out;
	-moz-transition: 0.5s ease-in-out;
	-o-transition: 0.5s ease-in-out;
	transition: 0.5s ease-in-out;
	cursor: pointer;
	display: none;
	font-size: 25px;
	color: white;
}

#nav-icon4 span {
	display: block;
	position: absolute;
	height: 3px;
	width: 100%;
	opacity: 1;
	left: 0;
	-webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	transform: rotate(0deg);
	-webkit-transition: 0.25s ease-in-out;
	-moz-transition: 0.25s ease-in-out;
	-o-transition: 0.25s ease-in-out;
	transition: 0.25s ease-in-out;
}

.mobile-nav > ul > li.menu-item-has-children:before {
	content: "";
	background-image: url(../img/down-arrow.svg);
	background-repeat: no-repeat;
	position: absolute;
	top: 20px;
	right: 0;
	width: 10px;
	height: 10px;
	transform: rotate(-90deg);
	-webkit-transform: rotate(-90deg);
	-moz-transform: rotate(-90deg);
	-o-transform: rotate(-90deg);
}

.mobile-nav > ul > li.menu-item-has-children.active:before {
	background-image: url(../img/down-arrow-clr.svg);
	transform: rotate(0deg);
	-webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-o-transform: rotate(0deg);
}

.mobile-nav > ul > li {
	position: relative;
	border-bottom: 0px solid #d4d4d4;
	padding: 10px 0;
	display: block;
}

.mobile-nav > ul > li:not(:last-child) {
	border-bottom: 1px solid #d4d4d4;
}

.mobile-nav > ul li > a {
	font-size: 14px;
	line-height: 26px;
	text-transform: capitalize;
	color: #ffffff;
}

.mobile-nav > ul > li > a {
	font-size: 16px;
	line-height: 30px;
	color: white;
}

.mobile-nav > ul > li.menu-item-has-children > ul.sub-menu {
	padding-left: 25px;
	padding-top: 10px;
	padding-bottom: 5px;
	position: absolute;
	height: 0;
	opacity: 0;
	visibility: hidden;
	transform: translateX(15px);
	-webkit-transform: translateX(15px);
	-moz-transform: translateX(15px);
	-o-transform: translateX(15px);
	border-top: 1px solid #d4d4d4;
	margin-top: 8px;
}

.mobile-nav > ul > li.menu-item-has-children.active > ul.sub-menu {
	position: relative;
	height: auto;
	opacity: 1;
	visibility: visible;
	transform: translateX(0);
	-webkit-transform: translateX(0);
	-moz-transform: translateX(0);
	-o-transform: translateX(0);
	transition-delay: 0.1s;
}

.mobile-nav > ul > li.menu-item-has-children.active > ul.sub-menu li {
	padding: 5px 0;
	position: relative;
}

.res-log img {
	margin-left: -10px;
	width: 180px;
	justify-content: flex-start;
}

.mobile-nav > ul > li.menu-item-has-children.active > ul.sub-menu li:before {
	content: "";
	width: 6px;
	height: 6px;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	left: -13px;
}

.res-log {
	margin-bottom: 30px;
}

.mobile-nav .donation {
	display: flex;
	align-items: center;
	margin: 25px 0;
}

.mobile-nav .donation a:first-child {
	margin-right: 40px;
}

.mobile-nav .donation a.theme-btn {
	padding: 10px 30px;
}

.mobile-nav .donation a.cart {
	position: relative;
}

.mobile-nav .donation a.cart:before {
	content: "1";
	color: white;
	width: 25px;
	height: 25px;
	position: absolute;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50px;
	top: -7px;
	right: -19px;
	z-index: 1;
	font-size: 13px;
}

.res-rights p {
	color: #d6d6d6;
	font-weight: bold;
	letter-spacing: 5px;
	margin-top: 30px;
}

.mobile-nav.open {
	transform: translateX(0) !important;
	z-index: 33333333;
	box-shadow: 3px 3px 39px -4px rgba(0, 0, 0, 0.75);
	-webkit-box-shadow: 3px 3px 39px -4px rgba(0, 0, 0, 0.75);
	-moz-box-shadow: 3px 3px 39px -4px rgba(0, 0, 0, 0.75);
}

li.menu-item-has-children.active {
	background-color: transparent;
}

.mobile-nav a#res-cross:before {
	content: "";
	width: 35px;
	height: 35px;
	background-image: url("../img/remove.svg");
	background-repeat: no-repeat;
	position: absolute;
	top: 15px;
	right: 20px;
}

.bar-menu i {
	position: relative;
	color: white;
	top: 5px;
	order: 2;
	font-size: 24px;
}

.bar-menu {
	display: none;
	justify-content: flex-end;
}

/* 54. back to top button  */
#button {
	display: inline-block;
	width: 40px;
	height: 40px;
	text-align: center;
	border-radius: 4px;
	position: fixed;
	bottom: 30px;
	right: 30px;
	transition: background-color 0.3s, opacity 0.5s, visibility 0.5s;
	opacity: 0;
	visibility: visible;
	z-index: 1000;
}
#button::after {
	content: "\f077";
	font-family: FontAwesome;
	font-weight: normal;
	font-style: normal;
	font-size: 20px;
	line-height: 44px;
	color: #fff;
}
#button:hover {
	cursor: pointer;
	background-color: #beb6b6;
}
#button:active {
	background-color: #c5baba;
}
#button.show {
	opacity: 1;
	visibility: visible;
}
/* 55. Preloader Start */
.preloader {
	width: 100%;
	height: 100%;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	position: fixed;
	z-index: 999111111;
	left: 0;
	top: 0;
	transition-duration: 1s;
	-webkit-transition-duration: 1s;
	transition-timing-function: cubic-bezier(0.86, 0, 0.09, 1);
	-webkit-transition-timing-function: cubic-bezier(0.86, 0, 0.09, 1);
}
.page-loaded .preloader {
	left: -100%;
}
.squarebox {
	background-color: white;
	display: grid;
	place-items: center;
	border-radius: 5px;
	animation: load 1.6s ease infinite;
}

@keyframes load {
	0% {
		transform: scale(1);
	}
	50% {
		transform: scale(0);
		background-color: var(--color);
	}
	100% {
		transform: scale(1);
	}
}

.two {
	animation-delay: 0.1s;
}
.three {
	animation-delay: 0.2s;
}
.four {
	animation-delay: 0.3s;
}
.five {
	animation-delay: 0.4s;
}
/* .preloader .container {
	width: 100px;
	height: 80px;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 0.3rem;
	transform: rotate(-45deg);
} */
.contact-page .heading {
	margin-bottom: 30px;
}
/* 56. transition sped */
.next-previous svg,
.next-previous a,
.Pricing-style,
.portfolio-img h3 a,
.our-clients ul li img,
.choose-us-img figure:before,
.case-studies-two figure:before,
.case-studies-project a,
.choose-us-img-text a,
.makes-us-different-text a,
.blog-posts-text a h4,
.blog-posts-text,
.links ul li a,
.case-studies-project a:before,
.latest-blog-post h4,
.brandicon,
.team-member,
.links ul li a:before,
.brandicon li a i,
.footer-bottom ul li a,
.sercive-style-text a,
.sercive-style,
.strategic-sercives h4,
.case-studies-text,
header.two .menu a,
.team-member-text h6,
.portfolios-data,
.makes-us-different-text,
.discovery-text.two h4,
.mobile-nav > ul li > a {
	transition: 0.3s ease-in-out;
}

/* 57-COMPRAR */

.col-sm-4.titulo {
	width: 35%;
	margin-top: 15px;
}

.text-parrafo {
	display: inline-block;
	font-size: smaller;
	max-width: auto;
	margin-top: -10px;
	margin-bottom: 30px;
	line-height: 1;
}
.mapa-form {
	display: flex;
	justify-content: flex-start;
	width: auto;
}
.h5-title {
	display: inline-block;
	color: #000000;
	margin-top: 18px;
}
.p-text {
	color: #867c7c;
	line-height: 1;
	top: 0;
}
/* 58-FORMULARIO */
#email-form {
	position: relative !important;
}

.contact-input {
	width: 100%;
	padding: 8px;
	margin-bottom: 15px;
	border: 1px solid #ccc;
	border-radius: 4px;
	box-sizing: border-box;
}

label {
	font-weight: bold;
	display: block;
	margin-bottom: 5px;
}

.form-group {
	margin-bottom: 20px;
}

.title {
	margin-bottom: 20px;
	font-size: 1.2em;
}

#contact-submit {
	background-color: #4caf50;
	color: white;
	padding: 10px 20px;
	border: none;
	border-radius: 4px;
	cursor: pointer;
}

#contact-submit:hover {
	background-color: #307533;
}

/* 59-CATALOGO*/
.bg-gray-light {
	background-color: #dddddd;
}
.navbar-expand-lg {
	margin-bottom: 0;
}
.menu-item::after {
	content: "\25BC";
	position: absolute;
	top: -22px;
	left: 50%;
	transform: translateY(-50%);
}

.grid-container {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	grid-gap: 10px;
}
.portfolio-img {
	border-radius: 1em;
	overflow: hidden;
	width: 90%;
	margin-top: 10px;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	position: relative;
}

.portfolio-img figure {
	margin: 0;
	max-width: 400px;
	height: 350px;
}

.portfolio-img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}

.portfolio-img h3 {
	letter-spacing: 3px;
	font-size: 19px;
	text-align: left;
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	margin: 0;
	padding: 10px;
	padding-left: 30px;
	/* background: radial-gradient(circle, rgba(255, 215, 0, 12), transparent); Color del fondo de los titulos */
	background: rgba(255, 238, 80, 0.546);
	color: white;
}
.dropdown-menu {
	display: none;
}

.dropdown-custom-sub-menu {
	display: none;
}

.dropdown-custom-menu {
	display: none;
}

.dropdown-li:hover nav.dropdown-menu {
	display: block;
}

.dropdown-custom-sub-li:hover nav.dropdown-custom-sub-menu {
	display: block;
}

.dropdown-custom-li:hover nav.dropdown-custom-menu {
	display: block;
}

.page-item .active {
	/* background-color: #00a5ea; */
	background-color: black;
	color: #fff;
}

#bathroomsDropdownMenu {
	display: none;
	top: 55px;
	background-color: #9fc8f3;
}
.submenu {
	display: none;
	top: 55px;
	position: absolute;
	background-color: #dadadb;
	top: 0;
	font-size: 14px;
	width: 150px;
	left: 100%;
	margin-left: 10px;
}

.dropdown-item.active + .submenu {
	display: block;
}
.card-title .d-flex {
	/* font-size: large; */

	justify-content: center;
	flex-wrap: wrap;
}
.card-title {
	font-size: 14px;
	color: #555;
}

.card-sub {
	font-weight: 300;
	color: #867c7c;
	font-size: 14px;
	margin-left: 7px;
}
#border-b {
	border-bottom: solid 1px rgb(223, 223, 19);
	display: flex;
	width: 50px;
	margin-bottom: 3px;
}
#card-border-none {
	border: none;
	min-width: 250px;
}
.card-text {
	text-align: center;
}

@media (max-width: 1200px) {
	.menu-item::after {
		display: none;
	}
}

@media (max-width: 998px) {
	.grid-container {
		grid-template-columns: repeat(3, 1fr);
	}
	.menu-item::after {
		display: none;
	}
}

@media (max-width: 768px) {
	.grid-container {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 576px) {
	.grid-container {
		grid-template-columns: repeat(2, 1fr);
	}
	.grid-container .portfolio-img {
		width: calc(100% - 10px);
	}
}

@media (max-width: 440px) {
	.grid-container {
		grid-template-columns: repeat(1, 1fr);
	}
	.grid-container .portfolio-img {
		/* width: calc(60% - 10px); */
		width: 80%;
		display: flex;
		justify-content: center;
		left: 10%;
	}
}

/* 58-PRODUCTOS */

.card {
	max-width: 350px;
	margin-top: 15px;
}
.card-body h5 {
	margin-bottom: 1px;
}
.card-text.aling {
	text-align: left;
	margin-bottom: 2px;
}

@media (max-width: 576px) {
	.col-xl-3.col-sm-4.produc {
		display: flex;
		justify-content: center;
	}
	#product {
		margin-left: 10px;
	}
}

/* DETAIL */

.img-fluid.rounded-start.img-main {
	width: 100%;
	max-width: 600px;
	height: auto;
	object-fit: contain;
	padding: 40px;
}

.col-xl-6.col-sm-8.img {
	display: flex;
	align-items: center;
	width: auto;
	height: auto;
}
.body-text {
	margin-top: -4px;
	width: auto;
}
.card-body {
	width: 100%;
}

.img-fluid.colors {
	/* max-width: 40%; */
	height: 30px;
	border-radius: 50%;
}

.color-container {
	text-align: center;
	margin-top: 10px;
	margin-right: 10px;
}
.list-color {
	display: flex;
	flex-wrap: wrap;
	align-items: start;
	text-align: center;
}

.color-title {
	font-weight: 200;
	margin-top: 2px;
	line-height: 1.2;
	text-align: center;
	color: #333;
	font-size: 12px;
	max-width: 75px;
	white-space: normal;
	/* padding-left: 10px; */
	overflow: hidden;
	text-overflow: ellipsis;
}

.img-sub-images {
	width: 100%;
	display: flex;
	justify-content: center;
	padding-bottom: 15px;
	/* padding-top: 20px; */
	margin-top: 10px;
}

.img-color {
	width: 110px;
	height: auto;
	margin: 0 5px;
}
.list-button {
	width: 100%;
}
.list-button li {
	padding-top: 10px;
}

.col-xl-6.col-sm-8.img {
	/* flex: 3; */
	display: flex;
	flex-direction: column;
}

.col-xl-6.col-sm-4.body-text {
	flex: 2;
	margin-left: 5px;
}

@media (max-width: 993px) {
	.list-button li {
		display: inline-block;
	}
}

@media (max-width: 767px) {
	.img-sub-images {
		justify-content: center;
	}

	.color-container {
		/* width: 100%; */
		text-align: center;
	}
	.body-text {
		margin-top: 10px;
	}
	.col-xl-6.col-sm-8.img {
		flex: none;
	}

	.col-sm-6.body-text {
		display: grid;
		justify-content: center;
		margin-bottom: 18px;
	}
	.list-colorr {
		/* display: grid; */
		/* grid-template-columns: repeat(2, 1fr); */
		/* grid-template-columns: repeat(auto-fit, minmax(80px, 1fr)); */
		/* gap: 0; */
	}
	.color-title {
		max-width: none;
	}
}
@media (max-width: 600px) {
	.img-sub-images {
		justify-content: center;
	}
}

/* PAGINATION */

.pagination-left {
	display: flex;
	align-items: center;
	justify-content: flex-start;
}
.pagination-right {
	display: flex;
	align-items: center;
	justify-content: flex-end;
}

.prev,
.next {
	padding: 10px 20px;
	text-decoration: none;
	background-color: #f8f9fa;
	border: 1px solid #dee2e6;
	border-radius: 4px;
	color: #000;
	cursor: pointer;
	z-index: 999;
}

.prev:hover,
.next:hover {
	background-color: #e2e6ea;
}

.card {
	width: 100%;
	border: 1px solid #e2e2e2;
	border-radius: 8px;
	overflow: hidden;
	margin-bottom: 20px;
	transition: transform 0.3s ease;
}

.card:hover {
	transform: translateY(-5px);
}
.produc.classic {
	display: flex;
	justify-content: center;
}
.card.classic {
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	max-width: 250px;
	height: auto;
}
.card-img-top.classic {
	object-fit: contain;
	width: 150px;
	height: auto;
}

#product-list {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	margin: 0;
	padding: 0;
	list-style: none;
}

.produc {
	padding: 10px;
	box-sizing: border-box;
	flex: 0 0 100%;
}

@media (min-width: 576px) {
	.produc {
		flex: 0 0 50%;
	}
}

@media (min-width: 768px) {
	.produc {
		flex: 0 0 33.33%;
	}
}

@media (min-width: 992px) {
	.produc {
		flex: 0 0 25%;
	}

	.card {
		max-width: 100%;
		margin-bottom: 10px;
		transition: transform 0.3s ease-in-out;
	}

	.card:hover {
		transform: translateY(-3px);
	}
}

/* Index  Client Services section*/

.client-services-h1 {
	font-size: 2em;
}

/* BANNER FILTRO COLORES */

.container-fluid{
	width: 100vw; 
    position: relative;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
	margin-bottom: 20px;
}

.filter-banner {
    display: flex;
	background-color: #f8f8f8;
	padding: 17px 30px;
    width: 100vw;
    align-items: center;
}

.filter-title {
	display: flex;
	margin-bottom: 23px;
	margin-left: 35px;
}
.filter-title p{
	font-size: 17px;
	font-weight: 400;
	color: #121212;
	border-bottom: #222 solid 1px;
}
.filter-title span{
	font-size: 17px;
	color: #a9a9a9;
	margin-left: 8px;
	margin-top: 2px;
}

.filter-options {
	gap: 15px;
	margin-left: 30px;
    margin-top: 26px;
    justify-content: flex-start;
    /* flex-wrap: wrap; */
}

.filter-option {
	display: flex;
	margin-left: 10px;
	text-align: center;
	color: #919090;
}
.name{
	display: flex;
	font-size: 10px;
	max-width: 40px;
    line-height: normal;
	color: #888787;
}

.filter-option:last-child .span-border {
    display: none;
}

.filter-option .circle {
	width: 42px;
	height: 42px;
	border-radius: 50%;
	margin: 0 auto 5px;
	margin-right: 12px;
}

.filter-option .circle:hover {
	transform: scale(1.2);
	box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.2);
}

.span-border {
	border-right: 1px solid lightgray;
	margin-left: 20px;
	/* margin-right: 15px; */
}

.mb-8 {
    margin-bottom: 7rem;
}

/* DOWNLOADS */


.downloads a {
    background: #f6f6f6;
    display: flex;
    width: 100%;
    color: #816052;
    margin-bottom: 2em;
}

.downloads figure {
    background: #534d48;
    text-align: center;
    padding: 2em;
    margin: 0;
}

.downloads figure img {
    height: 5em;
    object-fit: contain;
}

.downloads h2 {
    margin: 0;
    font-size: 2em;
}

.downloads div {
    padding: 2rem;
    font-size: 1.1em;
    font-weight: 300;
}

.downloads .icon {
    height: 3em;
}

.downloads small {
    font-size: 0.7em;
    color: #816052;
    margin-top: 1em;
}

.mini_products .product {
    max-width: 20em;
    margin: auto;
}

#downloads .downloads {
    max-width: 70em;
    margin: auto;
}

#downloadsAccordion article {
    margin-top: 1em;
}

#downloadsAccordion .accordion-header,
#downloadsAccordion .accordion-body .layout {
    max-width: 900px;
    margin: auto;
}

#downloadsAccordion .accordion-body .layout span {
    margin-top: 5.5rem;
}

#downloadsAccordion .accordion-button {
    font-size: 1.1em;
    text-align: center;
    color: #816052 !important;
    justify-content: center;
    align-items: flex-start;
    position: relative;
}

#downloadsAccordion .accordion-button h2 {
    margin: 0;
}

#downloadsAccordion .accordion-button small {
    font-size: 0.8rem;
    margin-left: 2rem;
    margin-top: 0.5em;
    position: absolute;
    right: 0;
    text-transform: uppercase;
    display: flex;
    align-items:center;
}

#downloadsAccordion .accordion-button:not(.collapsed) {
    /* color: inherit; */
    background: none;
}

#downloadsAccordion .accordion-button::after {
    display: none;
}

#downloadsAccordion .products {
    display: flex;
    flex-wrap: wrap;
}

#downloadsAccordion .product {
    font-size: 0.9em;
    margin: 0.5%;
    box-shadow: none !important;
}

#downloadsAccordion .items .item h2 {
    margin: 2rem;
}

#modal_downloads {
    padding: 2em;
}

#modal_downloads .title {
    display: flex;
    align-items: center;
}

#modal_downloads h2 {
    margin: 0;
    font-size: 1.8em;
}

#modal_downloads .container {
    min-width: 60em;
}

#modal_downloads li {
    margin: 0.5em 0;
    padding-bottom: 1em;
    border-bottom: 1px solid #dedede;
}

#modal_downloads li a {
    color: #816052;
    font-size: 0.9em;
    white-space: nowrap;
    margin-right: 8px;
}

#where .dealers .item {
    background: rgb(249, 249, 249);
    position: relative;
    padding-bottom: 6em !important;
}

#where .dealers .item h3 {
    font-size: 2em;
    color: #bc7c24;
    text-transform: uppercase;
    background: #f2eadd;
    padding: 1rem;
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    margin: 0;
}

.nombre-coleccion{
	font-size: 1.5em;
	line-height: normal;
}

#collection-custom-container a{
    margin-top: 1.2em !important;
    color: #816052 !important;
}  

.titulo.col-12.col-md-3{
	display: flex;
	align-items: center;
	justify-content: center;
}

.col-6.col-md-9.flex-column.gap-2{
	display: flex;
	align-items: center;
	justify-content: end;
	max-width: 300px;
}

.col-6.col-md-9.flex-column.gap-2 a{
	width: 100%;
    align-items: center;
    display: flex;
    font-size: 14px;
    justify-content: end;
}

@media all and (max-width: 630px) {

    #collection-custom-container a{
        margin-top: 0.5em !important;
    }   
}

.accordion-data-text{
align-items: end !important;
}

.portfolio-img .catalogo-titulo {
    letter-spacing: 2px !important;
}



/* jQuery Fancybox 3 */
body.compensate-for-scrollbar{overflow:hidden}.fancybox-active{height:auto}.fancybox-is-hidden{left:-9999px;margin:0;position:absolute!important;top:-9999px;visibility:hidden}.fancybox-container{-webkit-backface-visibility:hidden;height:100%;left:0;outline:none;position:fixed;-webkit-tap-highlight-color:transparent;top:0;-ms-touch-action:manipulation;touch-action:manipulation;transform:translateZ(0);width:100%;z-index:99992}.fancybox-container *{box-sizing:border-box}.fancybox-bg,.fancybox-inner,.fancybox-outer,.fancybox-stage{bottom:0;left:0;position:absolute;right:0;top:0}.fancybox-outer{-webkit-overflow-scrolling:touch;overflow-y:auto}.fancybox-bg{background:#1e1e1e;opacity:0;transition-duration:inherit;transition-property:opacity;transition-timing-function:cubic-bezier(.47,0,.74,.71)}.fancybox-is-open .fancybox-bg{opacity:.9;transition-timing-function:cubic-bezier(.22,.61,.36,1)}.fancybox-caption,.fancybox-infobar,.fancybox-navigation .fancybox-button,.fancybox-toolbar{direction:ltr;opacity:0;position:absolute;transition:opacity .25s ease,visibility 0s ease .25s;visibility:hidden;z-index:99997}.fancybox-show-caption .fancybox-caption,.fancybox-show-infobar .fancybox-infobar,.fancybox-show-nav .fancybox-navigation .fancybox-button,.fancybox-show-toolbar .fancybox-toolbar{opacity:1;transition:opacity .25s ease 0s,visibility 0s ease 0s;visibility:visible}.fancybox-infobar{color:#ccc;font-size:13px;-webkit-font-smoothing:subpixel-antialiased;height:44px;left:0;line-height:44px;min-width:44px;mix-blend-mode:difference;padding:0 10px;pointer-events:none;top:0;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.fancybox-toolbar{right:0;top:0}.fancybox-stage{direction:ltr;overflow:visible;transform:translateZ(0);z-index:99994}.fancybox-is-open .fancybox-stage{overflow:hidden}.fancybox-slide{-webkit-backface-visibility:hidden;display:none;height:100%;left:0;outline:none;overflow:auto;-webkit-overflow-scrolling:touch;padding:44px;position:absolute;text-align:center;top:0;transition-property:transform,opacity;white-space:normal;width:100%;z-index:99994}.fancybox-slide:before{content:"";display:inline-block;font-size:0;height:100%;vertical-align:middle;width:0}.fancybox-is-sliding .fancybox-slide,.fancybox-slide--current,.fancybox-slide--next,.fancybox-slide--previous{display:block}.fancybox-slide--image{overflow:hidden;padding:44px 0}.fancybox-slide--image:before{display:none}.fancybox-slide--html{padding:6px}.fancybox-content{background:#fff;display:inline-block;margin:0;max-width:100%;overflow:auto;-webkit-overflow-scrolling:touch;padding:44px;position:relative;text-align:left;vertical-align:middle}.fancybox-slide--image .fancybox-content{animation-timing-function:cubic-bezier(.5,0,.14,1);-webkit-backface-visibility:hidden;background:transparent;background-repeat:no-repeat;background-size:100% 100%;left:0;max-width:none;overflow:visible;padding:0;position:absolute;top:0;transform-origin:top left;transition-property:transform,opacity;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:99995}.fancybox-can-zoomOut .fancybox-content{cursor:zoom-out}.fancybox-can-zoomIn .fancybox-content{cursor:zoom-in}.fancybox-can-pan .fancybox-content,.fancybox-can-swipe .fancybox-content{cursor:grab}.fancybox-is-grabbing .fancybox-content{cursor:grabbing}.fancybox-container [data-selectable=true]{cursor:text}.fancybox-image,.fancybox-spaceball{background:transparent;border:0;height:100%;left:0;margin:0;max-height:none;max-width:none;padding:0;position:absolute;top:0;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;width:100%}.fancybox-spaceball{z-index:1}.fancybox-slide--iframe .fancybox-content,.fancybox-slide--map .fancybox-content,.fancybox-slide--pdf .fancybox-content,.fancybox-slide--video .fancybox-content{height:100%;overflow:visible;padding:0;width:100%}.fancybox-slide--video .fancybox-content{background:#000}.fancybox-slide--map .fancybox-content{background:#e5e3df}.fancybox-slide--iframe .fancybox-content{background:#fff}.fancybox-iframe,.fancybox-video{background:transparent;border:0;display:block;height:100%;margin:0;overflow:hidden;padding:0;width:100%}.fancybox-iframe{left:0;position:absolute;top:0}.fancybox-error{background:#fff;cursor:default;max-width:400px;padding:40px;width:100%}.fancybox-error p{color:#444;font-size:16px;line-height:20px;margin:0;padding:0}.fancybox-button{background:rgba(30,30,30,.6);border:0;border-radius:0;box-shadow:none;cursor:pointer;display:inline-block;height:44px;margin:0;padding:10px;position:relative;transition:color .2s;vertical-align:top;visibility:inherit;width:44px}.fancybox-button,.fancybox-button:link,.fancybox-button:visited{color:#ccc}.fancybox-button:hover{color:#fff}.fancybox-button:focus{outline:none}.fancybox-button.fancybox-focus{outline:1px dotted}.fancybox-button[disabled],.fancybox-button[disabled]:hover{color:#888;cursor:default;outline:none}.fancybox-button div{height:100%}.fancybox-button svg{display:block;height:100%;overflow:visible;position:relative;width:100%}.fancybox-button svg path{fill:currentColor;stroke-width:0}.fancybox-button--fsenter svg:nth-child(2),.fancybox-button--fsexit svg:first-child,.fancybox-button--pause svg:first-child,.fancybox-button--play svg:nth-child(2){display:none}.fancybox-progress{background:#ff5268;height:2px;left:0;position:absolute;right:0;top:0;transform:scaleX(0);transform-origin:0;transition-property:transform;transition-timing-function:linear;z-index:99998}.fancybox-close-small{background:transparent;border:0;border-radius:0;color:#ccc;cursor:pointer;opacity:.8;padding:8px;position:absolute;right:-12px;top:-44px;z-index:401}.fancybox-close-small:hover{color:#fff;opacity:1}.fancybox-slide--html .fancybox-close-small{color:currentColor;padding:10px;right:0;top:0}.fancybox-slide--image.fancybox-is-scaling .fancybox-content{overflow:hidden}.fancybox-is-scaling .fancybox-close-small,.fancybox-is-zoomable.fancybox-can-pan .fancybox-close-small{display:none}.fancybox-navigation .fancybox-button{background-clip:content-box;height:100px;opacity:0;position:absolute;top:calc(50% - 50px);width:70px}.fancybox-navigation .fancybox-button div{padding:7px}.fancybox-navigation .fancybox-button--arrow_left{left:0;left:env(safe-area-inset-left);padding:31px 26px 31px 6px}.fancybox-navigation .fancybox-button--arrow_right{padding:31px 6px 31px 26px;right:0;right:env(safe-area-inset-right)}.fancybox-caption{background:linear-gradient(0deg,rgba(0,0,0,.85) 0,rgba(0,0,0,.3) 50%,rgba(0,0,0,.15) 65%,rgba(0,0,0,.075) 75.5%,rgba(0,0,0,.037) 82.85%,rgba(0,0,0,.019) 88%,transparent);bottom:0;color:#eee;font-size:14px;font-weight:400;left:0;line-height:1.5;padding:75px 44px 25px;pointer-events:none;right:0;text-align:center;z-index:99996}@supports (padding:max(0px)){.fancybox-caption{padding:75px max(44px,env(safe-area-inset-right)) max(25px,env(safe-area-inset-bottom)) max(44px,env(safe-area-inset-left))}}.fancybox-caption--separate{margin-top:-50px}.fancybox-caption__body{max-height:50vh;overflow:auto;pointer-events:all}.fancybox-caption a,.fancybox-caption a:link,.fancybox-caption a:visited{color:#ccc;text-decoration:none}.fancybox-caption a:hover{color:#fff;text-decoration:underline}.fancybox-loading{animation:a 1s linear infinite;background:transparent;border:4px solid #888;border-bottom-color:#fff;border-radius:50%;height:50px;left:50%;margin:-25px 0 0 -25px;opacity:.7;padding:0;position:absolute;top:50%;width:50px;z-index:99999}@keyframes a{to{transform:rotate(1turn)}}.fancybox-animated{transition-timing-function:cubic-bezier(0,0,.25,1)}.fancybox-fx-slide.fancybox-slide--previous{opacity:0;transform:translate3d(-100%,0,0)}.fancybox-fx-slide.fancybox-slide--next{opacity:0;transform:translate3d(100%,0,0)}.fancybox-fx-slide.fancybox-slide--current{opacity:1;transform:translateZ(0)}.fancybox-fx-fade.fancybox-slide--next,.fancybox-fx-fade.fancybox-slide--previous{opacity:0;transition-timing-function:cubic-bezier(.19,1,.22,1)}.fancybox-fx-fade.fancybox-slide--current{opacity:1}.fancybox-fx-zoom-in-out.fancybox-slide--previous{opacity:0;transform:scale3d(1.5,1.5,1.5)}.fancybox-fx-zoom-in-out.fancybox-slide--next{opacity:0;transform:scale3d(.5,.5,.5)}.fancybox-fx-zoom-in-out.fancybox-slide--current{opacity:1;transform:scaleX(1)}.fancybox-fx-rotate.fancybox-slide--previous{opacity:0;transform:rotate(-1turn)}.fancybox-fx-rotate.fancybox-slide--next{opacity:0;transform:rotate(1turn)}.fancybox-fx-rotate.fancybox-slide--current{opacity:1;transform:rotate(0deg)}.fancybox-fx-circular.fancybox-slide--previous{opacity:0;transform:scale3d(0,0,0) translate3d(-100%,0,0)}.fancybox-fx-circular.fancybox-slide--next{opacity:0;transform:scale3d(0,0,0) translate3d(100%,0,0)}.fancybox-fx-circular.fancybox-slide--current{opacity:1;transform:scaleX(1) translateZ(0)}.fancybox-fx-tube.fancybox-slide--previous{transform:translate3d(-100%,0,0) scale(.1) skew(-10deg)}.fancybox-fx-tube.fancybox-slide--next{transform:translate3d(100%,0,0) scale(.1) skew(10deg)}.fancybox-fx-tube.fancybox-slide--current{transform:translateZ(0) scale(1)}@media (max-height:576px){.fancybox-slide{padding-left:6px;padding-right:6px}.fancybox-slide--image{padding:6px 0}.fancybox-close-small{right:-6px}.fancybox-slide--image .fancybox-close-small{background:#4e4e4e;color:#f2f4f6;height:36px;opacity:1;padding:6px;right:0;top:0;width:36px}.fancybox-caption{padding-left:12px;padding-right:12px}@supports (padding:max(0px)){.fancybox-caption{padding-left:max(12px,env(safe-area-inset-left));padding-right:max(12px,env(safe-area-inset-right))}}}.fancybox-share{background:#f4f4f4;border-radius:3px;max-width:90%;padding:30px;text-align:center}.fancybox-share h1{color:#222;font-size:35px;font-weight:700;margin:0 0 20px}.fancybox-share p{margin:0;padding:0}.fancybox-share__button{border:0;border-radius:3px;display:inline-block;font-size:14px;font-weight:700;line-height:40px;margin:0 5px 10px;min-width:130px;padding:0 15px;text-decoration:none;transition:all .2s;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;white-space:nowrap}.fancybox-share__button:link,.fancybox-share__button:visited{color:#fff}.fancybox-share__button:hover{text-decoration:none}.fancybox-share__button--fb{background:#3b5998}.fancybox-share__button--fb:hover{background:#344e86}.fancybox-share__button--pt{background:#bd081d}.fancybox-share__button--pt:hover{background:#aa0719}.fancybox-share__button--tw{background:#1da1f2}.fancybox-share__button--tw:hover{background:#0d95e8}.fancybox-share__button svg{height:25px;margin-right:7px;position:relative;top:-1px;vertical-align:middle;width:25px}.fancybox-share__button svg path{fill:#fff}.fancybox-share__input{background:transparent;border:0;border-bottom:1px solid #d7d7d7;border-radius:0;color:#5d5b5b;font-size:14px;margin:10px 0 0;outline:none;padding:10px 15px;width:100%}.fancybox-thumbs{background:#ddd;bottom:0;display:none;margin:0;-webkit-overflow-scrolling:touch;-ms-overflow-style:-ms-autohiding-scrollbar;padding:2px 2px 4px;position:absolute;right:0;-webkit-tap-highlight-color:rgba(0,0,0,0);top:0;width:212px;z-index:99995}.fancybox-thumbs-x{overflow-x:auto;overflow-y:hidden}.fancybox-show-thumbs .fancybox-thumbs{display:block}.fancybox-show-thumbs .fancybox-inner{right:212px}.fancybox-thumbs__list{font-size:0;height:100%;list-style:none;margin:0;overflow-x:hidden;overflow-y:auto;padding:0;position:absolute;position:relative;white-space:nowrap;width:100%}.fancybox-thumbs-x .fancybox-thumbs__list{overflow:hidden}.fancybox-thumbs-y .fancybox-thumbs__list::-webkit-scrollbar{width:7px}.fancybox-thumbs-y .fancybox-thumbs__list::-webkit-scrollbar-track{background:#fff;border-radius:10px;box-shadow:inset 0 0 6px rgba(0,0,0,.3)}.fancybox-thumbs-y .fancybox-thumbs__list::-webkit-scrollbar-thumb{background:#2a2a2a;border-radius:10px}.fancybox-thumbs__list a{-webkit-backface-visibility:hidden;backface-visibility:hidden;background-color:rgba(0,0,0,.1);background-position:50%;background-repeat:no-repeat;background-size:cover;cursor:pointer;float:left;height:75px;margin:2px;max-height:calc(100% - 8px);max-width:calc(50% - 4px);outline:none;overflow:hidden;padding:0;position:relative;-webkit-tap-highlight-color:transparent;width:100px}.fancybox-thumbs__list a:before{border:6px solid #ff5268;bottom:0;content:"";left:0;opacity:0;position:absolute;right:0;top:0;transition:all .2s cubic-bezier(.25,.46,.45,.94);z-index:99991}.fancybox-thumbs__list a:focus:before{opacity:.5}.fancybox-thumbs__list a.fancybox-thumbs-active:before{opacity:1}@media (max-width:576px){.fancybox-thumbs{width:110px}.fancybox-show-thumbs .fancybox-inner{right:110px}.fancybox-thumbs__list a{max-width:calc(100% - 10px)}}