* {
	margin: 0;
	padding: 0;
	font-size: 10px;
	outline: none !important;
	font-weight: 400;
	font-family: 'Inter', sans-serif;
	color: #fff;
	box-sizing: border-box;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	line-height: 1;
}

*::-moz-focus-inner {
	border: none;
}
h1, h2, h3, h4, h5, h6 {
	margin: 0;
}

h3 {
	font-size: 1.2em;
}

h4 {
	font-size: 2em;
	line-height: 1.2;
}

h5 {
	font-size: 5em;
	font-weight: 600;
	color: #000;
}

html, body {
	width: 100%;
	display: block;
	margin-top: 0 !important;
	background-color: #fff;
	position: relative;
	/*height: 100%;*/
}

a {
	text-decoration: none;
	cursor: pointer;
}
a:hover {}

::-webkit-scrollbar {
	width: 10px;
}

::-webkit-scrollbar-track {
	background: #fff;
}

::-webkit-scrollbar-thumb {
	background: rgba(82, 82, 82, 0.5);
}

::-webkit-scrollbar-thumb:hover {
	background: #828282;
}

section {
	position: relative;
	display: block;
	width: 100%;
}

header {
	position: relative;
	width: 100%;
	height: 46em;
	background-image: url(../img/header_bg.jpg);
	background-position: top;
	color:  #fff;
	z-index: 3;
}

.menu-title {
	margin: auto;
	padding-top: 9em;
	width: 19em;
}

.menu-title img {
	width: 19em;
}

.language {
	float: right;
	display: inline;
	padding: 4.4em 5.7em 0 0;
	color: #fff;
}

.language-responsive {
	position: absolute;
	top: 10px;
	right: 12px;
}

.clearfix{
	display: none;
	list-style: none;
	overflow: hidden;
	border: solid 1px #fff;
	width: 25px;
	height: 20px;
	padding-right: 1px;
	text-align: center;
	transition: all 0.5s ease-in-out;
}

.clearfix:hover {
	background: #000;
	height: 40px;
}

.clearfix h3 {
	font-size: 11pt;
	line-height: 1.3;
}

.timeless-main {
	margin-top: 10.5em;
	text-align: center;
}

.timeless-main img{
	width: 122em;	
}

#timelessss {
	animation: fadeIn linear 1s;
}

@keyframes fadeIn {
	0% {opacity:0;}
	100% {opacity:1;}
}

video {
	height: 50vw;
	width: 100%;
	object-fit: fill;
	display: block;
}

video::-internal-media-controls-download-button {
    display:none;
}

.video-after {
	position: absolute;
	width: 100%;
	height: 100%;
	background-image: url(../img/aftervideo.jpg);
	background-size: cover;
	display: none;
	z-index: 2;
}

.mouse-btn {
	border-right: solid 2px #fff;
	position: absolute;
	display: flex;
	flex-direction: column;
	align-items: center;
	bottom: 50px;
	left: 50px;
	height: 100px;
	font-size: 1.8em;
	font-weight: 300;
	text-transform: uppercase;
	padding-right: 10px;
	z-index: 10;
	cursor: pointer;
}

.mouse-btn:before {
	content: '';
	position: absolute;
	display: block;
	bottom: 3px;
	right: -13px;
	width: 15px;
	border-bottom: solid 2px #fff;
	transform: rotateZ(135deg);
	z-index: 10;
}

.mouse-btn:after {
	content: '';
	position: absolute;
	display: block;
	bottom: 3px;
	right: -4px;
	width: 15px;
	border-bottom: solid 2px #fff;
	transform: rotateZ(45deg);
	z-index: 10;
}

.mouse {
	border-image: conic-gradient(transparent var(--angle), rgba(255, 255, 255, 1) 0 100%) 1;
	border-image-slice: 1 fill;
	position: absolute;
	right: -26px;
	bottom: -20px;
	width: 50px;
	transform: rotateY(180deg);
	height: 50px;
	-webkit-mask-image: radial-gradient(circle, rgba(255,255,255,0) 61%, rgba(255,255,255,1) 64%, rgba(255,255,255,1) 65%, rgba(255,255,255,1) 67%, rgba(255,255,255,0) 69%);
	mask: radial-gradient(circle, rgba(255,255,255,0) 60%, rgba(255,255,255,1) 65%, rgba(255,255,255,0) 70%);
}

.mouse-btn:hover > .mouse {
	--angle: 100%;
	border-image: conic-gradient(transparent var(--angle), rgba(255, 255, 255, 1) 0 100%) 1;
	border-image-slice: 1 fill;
	animation: 0.4s rotate ease-out;
	background: #fff;
	transition:  0s background-color linear 0.4s;
}

@keyframes rotate {
	to {
		--angle: 0%;
	}
}

@property --angle {
	syntax: '<percentage>';
	initial-value: 0%;
	inherits: false;
}

input[type="checkbox"] {
	position: fixed;
	top: 1em;
	left: 1em;
}

.after-content {
	width: 100%;
	height: 100%;
	display: flex;
	text-align: right;
	justify-content: center;
	align-items: center;
}

.after-content img {
	height: 5vw;
	opacity: 0.8;
}

.novo-viver {
	height: 28em;
	display: flex;
	align-items: center; 
	justify-content: center;
	background: #fff;
}

.novo-viver img {
	height: 9em;
}

.hero-banner {
	background: #000;
}

.sofisticacao {
	position: absolute;
	width: 100px;
	height: 100px;
	z-index: 1;
}

.sofist-line {	
	position: absolute;
	margin: 41vw 0 0 8vw;
}

.vertical-circle {
	margin: 20px auto 20px auto;
	margin: auto;
	border: solid 1px #fff;
	border-radius: 7.5em;
	width:  1.4em;
	height: 1.4em;
}

.vertical-line {
	margin: 2em auto 2em auto;
	border-left: solid 1px #fff;
	width: 1px;
	height: 8vw;
}

.sofist-text {
	margin: 40vw 0 0 21em;
}

.sofist-text img {
	height: 11vw;
}

.mainbanner-images .slide img {
	width: 100%;
}

.descriptions {
	display: flex;
	width: 100%;
	height: auto;
	background: #20201f;
    align-items: center;
}

.desc-columns {
	display: flex;
	width: 50%;
}

.main-descript {
	display: flex;
	width: 50%;
	height: 100%;
	float: left;
	justify-content: center;
	align-items: center;
}

.maindes-text {
	margin: 0 14em 0 34em;
	color: #fff;
	text-align: right;
}

.vert-column img {
	width: 100%;
	float: right;
}

.vert-column {
	float: right;
}

.blackbg-column {
	position: absolute;
	width: 100%;
	height: 100%;
	background: #000;
	opacity: 0.35;
	transition: visibility 0.3s, opacity 0.3s linear;
}

.desc-column  {
	position: absolute;
	font-family: 'Inter', sans-serif;
	font-size: 2.1em;	
	color: #fff;
	bottom: 6%;
	right: 16%;
	transition: all 0.5s ease-in-out;
	z-index: 1;
}

.bar-column {
	position: absolute;
	width: 3px;
	height: 4em;
	bottom: 4.4%;
	right: 0%;
	background: #fff;
	transition: all 0.5s ease-in-out;
}

.box-space {
	position: absolute;
	width: 80%;
	right: 10%;
	height: 100%;
	margin: auto;
	overflow: hidden;
}

.coluna, .colunacanto {
	position: relative;
	transition: all .2s ease-in-out;
}

.coluna {
	z-index: 1;
}

.colunacanto {
	z-index: 2;
}

.coluna:hover {
	transform: scale(1.1);
	z-index: 3;
}

.colunacanto:hover {
	transform: scale(1.05, 1.1);
	transform-origin:right center;
}

.coluna:hover > .blackbg-column, .colunacanto:hover > .blackbg-column {
	visibility: hidden;
	opacity: 0;
	transition: visibility 0.3s, opacity 0.3s linear;
}

.coluna:hover > .desc-column, .colunacanto:hover > .desc-column {
	font-weight: 900;
	color: #20201f;
	transform: translate(-2vw, 0);
	transition: all 0.5s ease-in-out;
}

.coluna:hover > .box-space .bar-column, .colunacanto:hover > .box-space .bar-column {
	transform: scale(200, 1.2);
	transform-origin: center center;
	transition: all 0.5s ease-in-out;
}

.lorem {
	width: 100%;
	height: auto;
	background: #fff;
}

.lorem-text {
	width: 100%;
	height: auto;
	text-align: center;
	padding: 5em;
}

.lorem-text img {
	width: 90%;
	max-width: 1000px;
	padding-bottom: 5em;
}

button {
	position: absolute;
	top: 50%;
	transform: translate(-50%, -50%);
	background: none;
	border: none;
	cursor: pointer;
	opacity: 0.6;
	transition: all 0.3s ease;
}

button img {
	width: 20em;
}

button:hover {
	opacity: 1;
}

.produtos-carousel {
	width: 100%;
	/*height: 71.6em;*/
	background: #20201f;
	/*display: flex;*/
	/*align-items: center; */
	/*justify-content: center;*/
	padding: 50px 0;
}

.produtos-containment {
	max-width: 1210px;
	margin: 0 auto;
}

.produtos-images {
	/*margin-left: 40px;*/
	/*width:  1210px;*/
	width: 100%;
	/*max-width: 1210px;*/
	margin: 0 auto;
}

.produtos-images .slide {
	margin: 0 50px;
	padding: 100px 0;
}

.produtos-images .slide img {
	width: 100%;
	display: block;
	/*height: 42em;*/
	margin: 0 auto;
	transition: all 0.5s ease-in-out;
}

.produtos-images .slide.slick-active.slick-center img {
	transform: scale(1.4);
}

.carouselarrows {
	position: absolute;
	top: 50%;
	cursor: pointer;
	opacity: 0.5;
}

.prevarrowmain {
	left: 0;
}

.nextarrowmain {
	right: 0;
}

.prevarrow {
	left: 10em;
}

.nextarrow {
	right: 10em;
}

.timeless-caracs {
	width: 100%;
	height: 108em;
	background: url(../img/caracs-bg.jpg);
	background-size: cover;
}

.caracs-content {
	padding-top: 16em;
}

.sidebar-caracs {
	float: left;
	margin-left: 62em;
}

.sidebar-caracs .vertical-line {
	height: 19em;
}

.caracs-palavras {
	float: left;
	margin-left: 11em;
}

.caracs-palavras img {
	height: 11em;
}

#word1, #word2, #word3, #word4 {
	margin-bottom: 10em;
	display: block;
	opacity: 0;
}

footer {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 110px;
	background: #000;
}

.footer-logo {
	margin-top: 0.5em;
	height: 3.7em;
	padding-right: 30em;
	float: left;
}

.footer-logo img {
	height: 3.7em;
}

.footer-social-media {
	display: flex;
	justify-content: right;
	align-items: center;
	float: right;
	width: 38.9em;
}

.footer-lojaprox {
	height: auto;
	width: auto;
	padding: 0.6em 0.7em;
	display: flex;
	justify-content: center;
	align-items: center;
	margin-right: 1.5em;
	border: solid 1px;
}

.footer-lojaprox h3 {
	font-size: 2em;
	font-weight: 400;
}

.social-icons {
	display: flex;
	justify-content: center;
	align-items: center;
	float: right;
	height: 46px;	
}

.social-icons img {
	width: 20px;
	height: auto;
}

.top-link {
	position: absolute;
	bottom: 23px;
	right: 50px;
	width: 50px;
	height: 50px;
}

.arrow-top {
	display: block;
	width: 48px;
	height: 50px;
	transition: all 0.3s ease-out;
}

.arrow-top h6 {
    text-align: center;
    color: #000;
    transform: translateY(20px);
}

.arrow-top:before {
	content: '';
	position: absolute;
	width: 26px;
	height: 3px;
	top: 10px;
	left: 2px;
	transform: rotateZ(-45deg);
	border-bottom: solid 2px #fff;
	z-index: 5;
}

.arrow-top:after {
	content: '';
	position: absolute;
	width: 26px;
	height: 3px;
	top: 10px;
	right: 2px;
	transform: rotateZ(45deg);
	border-bottom: solid 2px #fff;
	z-index: 5;
}

.arrow-top:hover {
	background: #fff;
	transform: translateY(-37px);
}

.arrow-top:hover:before {
	border-color: #000;
	top: 20px;
	left: 2px;
}

.arrow-top:hover:after {
	border-color: #000;
	top: 20px;
	right: 1px;
}

.arrow-top:hover > h6 {
	color: #fff;
	transform: translateY(55px);
}

@media only screen and (max-width: 1650px) {
	* {
		font-size: 9px;
	}
	
	.sidebar-caracs {
		margin-left: 57em;
	}

	.maindes-text {
		margin: 0 10em 0 30em;
	}
	
	.coluna:hover > .desc-column, .colunacanto:hover > .desc-column {
		transform: translate(-2.7vw, 0);
	}
}

@media only screen and (max-width: 1440px) {
	* {
		font-size: 8.5px;
	}
	
	.sidebar-caracs {
		margin-left: 52em;
	}
	
	.maindes-text {
		margin: 0 6em 0 27em;
	}
	
	.coluna:hover > .desc-column, .colunacanto:hover > .desc-column {
		transform: translate(-1.6vw, 0);
	}
}

@media only screen and (max-width: 1366px) {
	* {
		font-size: 8.5px;
	}
	
	.sidebar-caracs {
		margin-left: 52em;
	}
	
	.maindes-text {
		margin: 0 6em 0 27em;
	}
	
	.coluna:hover > .desc-column, .colunacanto:hover > .desc-column {
		transform: translate(-1.2vw, 0);
	}
}

@media only screen and (max-width: 1280px) {
	* {
		font-size: 6.5px;
	}

	header {		
		height: auto;
	}

	.timeless-main {
		margin-top: 0;
		transform: translate(0, 46%);
	}

	.timeless-main img{
		width: 80%;	
	}

	.mouse-btn {
		border: none;
		height: 25px;
		left: 50%;
		transform: translateX(-50%);
		font-size: 0;
	}

	.mouse:after {
		content: 'saiba mais';
		position: absolute;
		font-size: 1em;
	}
	
	.produtos-carousel {
		padding: 0;
	}

	.produtos-images .slide {
		margin: 30px;
	}

	.main-descript {
		width: 100%;
		height: auto;
	}

	.maindes-text {
		margin: 10em 20em 10em 40em;
	}

	.descriptions {
		flex-direction: column;
		width: 100%;
		height: auto;
	}

	.desc-columns {
		width: 100%;
		height: auto;
	}

	.vert-column img {
		max-width: 100%;
		height: auto;
	}

	.vert-column {
		width: 33.33%;
		height: auto;
	}

	.desc-column {
		font-size: 6em;	
		bottom: 6%;
		right: 16%;
	}

	.bar-column {
		width: 3px;
		height: 10em;
		bottom: 4.4%;
		right: 0%;
	}

	.coluna:hover > .desc-column, .colunacanto:hover > .desc-column {
		transform: translate(-0.5vw, 0);
	}

	.colunacanto {
		float: right;
	}
	
	.coluna {
		float: left;
	}

	.produtos-images .slide.slick-active.slick-center img {
		transform: none;
	}

	.sidebar-caracs {
		margin-left: 32vw;
	}
}

@media only screen and (max-width: 700px) {
	* {
		font-size: 2.1px;
	}
	
	h4 {
		font-size: 5em;
		line-height: 1.5;
	}

	h5 {
		font-size: 8em;
	}

	header {
		height: auto;
	}

	.language {
		display: none;
	}

	.clearfix{
		display: block;
	}

	.menu-title {
		padding-top: 9em;
		width: 37em;
	}

	.menu-title img {
		width: 37em;
	}

	.timeless-main {
		margin-top: 0;
		transform: translate(0, 46%);
	}

	.timeless-main img{
		width: 80%;	
	}

	.novo-viver img {
		height: 11em;
	}

	.sofist-line {	
		margin-left: 10vw;
	}

	.sofist-text {
		margin-left: 16vw;
	}

	.sofist-line .vertical-line {
		height: 28em;
	}

	.lorem-text {
		padding: 5em 0 0;
	}

	button {
		display: none;
	}

	.produtos-images .slide {
		margin: 0 0px;
	}

	.caracs-content {
		display: flex;
		justify-content: center;
		padding: 19em 0;
	}

	.sidebar-caracs {
		margin-left: 10px;
	}

	.timeless-caracs {
		height: auto;
	}

	.vertical-circle {
		width: 3em;
		height: 3em;
	}

	.sidebar-caracs .vertical-line {
		height: 36em;
	}

	.caracs-palavras {
		float: none;
		margin-left: 14em;
	}

	.caracs-palavras img {
		height: 23em;
	}

	.carouselarrows img {
		height: 42px;
		width: auto;
	}

	.produtos-carousel {
		padding: 50px;
	}

	.produtos-images .slide {
		margin: 0;
		padding: 0;
	}

	.produtos-images .slide img {
		max-width: 300px;
	}

	#word1, #word2, #word3{
		margin-bottom: 12em;
	}

	#word4 {
		margin-bottom: 0;
	}

	footer {
		height: auto;
	}

	.footer-logo {
		height: auto;
		padding:0;
		margin: 0;
	}

	.footer-logo img {
		height: 10em;
	}

	.footer-content {
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 25px 0;
		width: 70%;
		max-width: 400px;
	}

	.footer-social-media {
		height: auto;
		float:  right;
		justify-content: right;
		width: auto;
	}

	.footer-lojaprox {
		padding: 2em 3em;
	}

	.footer-lojaprox h3 {
		font-size: 3vw;
	}

	.social-icons {
		font-size: 4pt;
		align-items: initial;
		height: auto;
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.social-icons img {
		padding-left: 1em;
	}

	.top-link {
		bottom: 72px;
    	right: 16px;
	}

	.arrow-top {
		transform: none;
	}

	.arrow-top:before {
		top: 10px;
		left: 2px;

	}

	.arrow-top:after {
		top: 10px;
		right: 2px;
	}

	.arrow-top:hover {
		background: none;
		transform: none;
	}

	.arrow-top:hover:before {
		border-color: #fff;
		top: 10px;
		left: 2px;
	}

	.arrow-top:hover:after {
		border-color: #fff;
		top: 10px;
		right: 2px;
	}

	.arrow-top:hover > h6 {
		display: none;
	}
}