@font-face {
    font-family: 'Aron';
    src: url('/fonts/Aron-Medium.eot');
    src: url('/fonts/Aron-Medium.eot?#iefix') format('embedded-opentype'),
        url('/fonts/Aron-Medium.woff2') format('woff2'),
        url('/fonts/Aron-Medium.woff') format('woff'),
        url('/fonts/Aron-Medium.svg#Aron-Medium') format('svg');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Aron';
    src: url('/fonts/Aron-Black.eot');
    src: url('/fonts/Aron-Black.eot?#iefix') format('embedded-opentype'),
        url('/fonts/Aron-Black.woff2') format('woff2'),
        url('/fonts/Aron-Black.woff') format('woff'),
        url('/fonts/Aron-Black.svg#Aron-Black') format('svg');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Aron';
    src: url('/fonts/Aron-BoldItalic.eot');
    src: url('/fonts/Aron-BoldItalic.eot?#iefix') format('embedded-opentype'),
        url('/fonts/Aron-BoldItalic.woff2') format('woff2'),
        url('/fonts/Aron-BoldItalic.woff') format('woff'),
        url('/fonts/Aron-BoldItalic.svg#Aron-BoldItalic') format('svg');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Aron';
    src: url('/fonts/Aron-ExtraBoldItalic.eot');
    src: url('/fonts/Aron-ExtraBoldItalic.eot?#iefix') format('embedded-opentype'),
        url('/fonts/Aron-ExtraBoldItalic.woff2') format('woff2'),
        url('/fonts/Aron-ExtraBoldItalic.woff') format('woff'),
        url('/fonts/Aron-ExtraBoldItalic.svg#Aron-ExtraBoldItalic') format('svg');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Aron';
    src: url('/fonts/Aron-ExtraLightItalic.eot');
    src: url('/fonts/Aron-ExtraLightItalic.eot?#iefix') format('embedded-opentype'),
        url('/fonts/Aron-ExtraLightItalic.woff2') format('woff2'),
        url('/fonts/Aron-ExtraLightItalic.woff') format('woff'),
        url('/fonts/Aron-ExtraLightItalic.svg#Aron-ExtraLightItalic') format('svg');
    font-weight: 200;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Aron';
    src: url('/fonts/Aron-BlackItalic.eot');
    src: url('/fonts/Aron-BlackItalic.eot?#iefix') format('embedded-opentype'),
        url('/fonts/Aron-BlackItalic.woff2') format('woff2'),
        url('/fonts/Aron-BlackItalic.woff') format('woff'),
        url('/fonts/Aron-BlackItalic.svg#Aron-BlackItalic') format('svg');
    font-weight: 900;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Aron';
    src: url('/fonts/Aron-Bold.eot');
    src: url('/fonts/Aron-Bold.eot?#iefix') format('embedded-opentype'),
        url('/fonts/Aron-Bold.woff2') format('woff2'),
        url('/fonts/Aron-Bold.woff') format('woff'),
        url('/fonts/Aron-Bold.svg#Aron-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Aron';
    src: url('/fonts/Aron-LightItalic.eot');
    src: url('/fonts/Aron-LightItalic.eot?#iefix') format('embedded-opentype'),
        url('/fonts/Aron-LightItalic.woff2') format('woff2'),
        url('/fonts/Aron-LightItalic.woff') format('woff'),
        url('/fonts/Aron-LightItalic.svg#Aron-LightItalic') format('svg');
    font-weight: 300;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Aron';
    src: url('/fonts/Aron-ExtraLight.eot');
    src: url('/fonts/Aron-ExtraLight.eot?#iefix') format('embedded-opentype'),
        url('/fonts/Aron-ExtraLight.woff2') format('woff2'),
        url('/fonts/Aron-ExtraLight.woff') format('woff'),
        url('/fonts/Aron-ExtraLight.svg#Aron-ExtraLight') format('svg');
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Aron Mediuim';
    src: url('/fonts/Aron-MediuimItalic.eot');
    src: url('/fonts/Aron-MediuimItalic.eot?#iefix') format('embedded-opentype'),
        url('/fonts/Aron-MediuimItalic.woff2') format('woff2'),
        url('/fonts/Aron-MediuimItalic.woff') format('woff'),
        url('/fonts/Aron-MediuimItalic.svg#Aron-MediuimItalic') format('svg');
    font-weight: 500;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Alte Haas Grotesk';
    src: url('/fonts/AlteHaasGrotesk_Bold.eot');
    src: url('/fonts/AlteHaasGrotesk_Bold.eot?#iefix') format('embedded-opentype'),
        url('/fonts/AlteHaasGrotesk_Bold.woff2') format('woff2'),
        url('/fonts/AlteHaasGrotesk_Bold.woff') format('woff'),
        url('/fonts/AlteHaasGrotesk_Bold.svg#AlteHaasGrotesk_Bold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Aron';
    src: url('/fonts/Aron-ExtraBold.eot');
    src: url('/fonts/Aron-ExtraBold.eot?#iefix') format('embedded-opentype'),
        url('/fonts/Aron-ExtraBold.woff2') format('woff2'),
        url('/fonts/Aron-ExtraBold.woff') format('woff'),
        url('/fonts/Aron-ExtraBold.svg#Aron-ExtraBold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Aron';
    src: url('/fonts/Aron-Light.eot');
    src: url('/fonts/Aron-Light.eot?#iefix') format('embedded-opentype'),
        url('/fonts/Aron-Light.woff2') format('woff2'),
        url('/fonts/Aron-Light.woff') format('woff'),
        url('/fonts/Aron-Light.svg#Aron-Light') format('svg');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Aron';
    src: url('/fonts/Aron-Italic.eot');
    src: url('/fonts/Aron-Italic.eot?#iefix') format('embedded-opentype'),
        url('/fonts/Aron-Italic.woff2') format('woff2'),
        url('/fonts/Aron-Italic.woff') format('woff'),
        url('/fonts/Aron-Italic.svg#Aron-Italic') format('svg');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Alte Haas Grotesk';
    src: url('/fonts/AlteHaasGrotesk.eot');
    src: url('/fonts/AlteHaasGrotesk.eot?#iefix') format('embedded-opentype'),
        url('/fonts/AlteHaasGrotesk.woff2') format('woff2'),
        url('/fonts/AlteHaasGrotesk.woff') format('woff'),
        url('/fonts/AlteHaasGrotesk.svg#AlteHaasGrotesk') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Neue Haas Grotesk Display Pro';
    src: url('/fonts/NeueHaasDisplay-Roman.eot');
    src: url('/fonts/NeueHaasDisplay-Roman.eot?#iefix') format('embedded-opentype'),
        url('/fonts/NeueHaasDisplay-Roman.woff2') format('woff2'),
        url('/fonts/NeueHaasDisplay-Roman.woff') format('woff'),
        url('/fonts/NeueHaasDisplay-Roman.svg#NeueHaasDisplay-Roman') format('svg');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'AronVF';
    src: url('/fonts/AronVF-Regular.eot');
    src: url('/fonts/AronVF-Regular.eot?#iefix') format('embedded-opentype'),
        url('/fonts/AronVF-Regular.woff2') format('woff2'),
        url('/fonts/AronVF-Regular.woff') format('woff'),
        url('/fonts/AronVF-Regular.svg#AronVF-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Aron';
    src: url('/fonts/Aron-SemiBoldItalic.eot');
    src: url('/fonts/Aron-SemiBoldItalic.eot?#iefix') format('embedded-opentype'),
        url('/fonts/Aron-SemiBoldItalic.woff2') format('woff2'),
        url('/fonts/Aron-SemiBoldItalic.woff') format('woff'),
        url('/fonts/Aron-SemiBoldItalic.svg#Aron-SemiBoldItalic') format('svg');
    font-weight: 600;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Aron';
    src: url('/fonts/Aron-SemiBold.eot');
    src: url('/fonts/Aron-SemiBold.eot?#iefix') format('embedded-opentype'),
        url('/fonts/Aron-SemiBold.woff2') format('woff2'),
        url('/fonts/Aron-SemiBold.woff') format('woff'),
        url('/fonts/Aron-SemiBold.svg#Aron-SemiBold') format('svg');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Aron Normal';
    src: url('/fonts/Aron-NormalItalic.eot');
    src: url('/fonts/Aron-NormalItalic.eot?#iefix') format('embedded-opentype'),
        url('/fonts/Aron-NormalItalic.woff2') format('woff2'),
        url('/fonts/Aron-NormalItalic.woff') format('woff'),
        url('/fonts/Aron-NormalItalic.svg#Aron-NormalItalic') format('svg');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Neue Haas Grotesk Display Pro';
    src: url('/fonts/NeueHaasDisplay-ThinItalic.eot');
    src: url('/fonts/NeueHaasDisplay-ThinItalic.eot?#iefix') format('embedded-opentype'),
        url('/fonts/NeueHaasDisplay-ThinItalic.woff2') format('woff2'),
        url('/fonts/NeueHaasDisplay-ThinItalic.woff') format('woff'),
        url('/fonts/NeueHaasDisplay-ThinItalic.svg#NeueHaasDisplay-ThinItalic') format('svg');
    font-weight: 100;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Brandink Sans';
    src: url('/fonts/BrandinkSansLight.eot');
    src: url('/fonts/BrandinkSansLight.eot?#iefix') format('embedded-opentype'),
        url('/fonts/BrandinkSansLight.woff2') format('woff2'),
        url('/fonts/BrandinkSansLight.woff') format('woff'),
        url('/fonts/BrandinkSansLight.svg#BrandinkSansLight') format('svg');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Neue Haas Grotesk Display Pro';
    src: url('/fonts/NeueHaasDisplay-XThinItalic.eot');
    src: url('/fonts/NeueHaasDisplay-XThinItalic.eot?#iefix') format('embedded-opentype'),
        url('/fonts/NeueHaasDisplay-XThinItalic.woff2') format('woff2'),
        url('/fonts/NeueHaasDisplay-XThinItalic.woff') format('woff'),
        url('/fonts/NeueHaasDisplay-XThinItalic.svg#NeueHaasDisplay-XThinItalic') format('svg');
    font-weight: 100;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Brandink Sans';
    src: url('/fonts/BrandinkSansRegular.eot');
    src: url('/fonts/BrandinkSansRegular.eot?#iefix') format('embedded-opentype'),
        url('/fonts/BrandinkSansRegular.woff2') format('woff2'),
        url('/fonts/BrandinkSansRegular.woff') format('woff'),
        url('/fonts/BrandinkSansRegular.svg#BrandinkSansRegular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Aron';
    src: url('/fonts/Aron-ThinItalic.eot');
    src: url('/fonts/Aron-ThinItalic.eot?#iefix') format('embedded-opentype'),
        url('/fonts/Aron-ThinItalic.woff2') format('woff2'),
        url('/fonts/Aron-ThinItalic.woff') format('woff'),
        url('/fonts/Aron-ThinItalic.svg#Aron-ThinItalic') format('svg');
    font-weight: 100;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Aron Normal';
    src: url('/fonts/Aron-Normal.eot');
    src: url('/fonts/Aron-Normal.eot?#iefix') format('embedded-opentype'),
        url('/fonts/Aron-Normal.woff2') format('woff2'),
        url('/fonts/Aron-Normal.woff') format('woff'),
        url('/fonts/Aron-Normal.svg#Aron-Normal') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Neue Haas Grotesk Display Pro';
    src: url('/fonts/NeueHaasDisplay-RomanItalic.eot');
    src: url('/fonts/NeueHaasDisplay-RomanItalic.eot?#iefix') format('embedded-opentype'),
        url('/fonts/NeueHaasDisplay-RomanItalic.woff2') format('woff2'),
        url('/fonts/NeueHaasDisplay-RomanItalic.woff') format('woff'),
        url('/fonts/NeueHaasDisplay-RomanItalic.svg#NeueHaasDisplay-RomanItalic') format('svg');
    font-weight: 500;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Aron';
    src: url('/fonts/Aron-Thin.eot');
    src: url('/fonts/Aron-Thin.eot?#iefix') format('embedded-opentype'),
        url('/fonts/Aron-Thin.woff2') format('woff2'),
        url('/fonts/Aron-Thin.woff') format('woff'),
        url('/fonts/Aron-Thin.svg#Aron-Thin') format('svg');
    font-weight: 100;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Neue Haas Grotesk Display Pro';
    src: url('/fonts/NeueHaasDisplay-Thin.eot');
    src: url('/fonts/NeueHaasDisplay-Thin.eot?#iefix') format('embedded-opentype'),
        url('/fonts/NeueHaasDisplay-Thin.woff2') format('woff2'),
        url('/fonts/NeueHaasDisplay-Thin.woff') format('woff'),
        url('/fonts/NeueHaasDisplay-Thin.svg#NeueHaasDisplay-Thin') format('svg');
    font-weight: 100;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Aron';
    src: url('/fonts/Aron-Regular.eot');
    src: url('/fonts/Aron-Regular.eot?#iefix') format('embedded-opentype'),
        url('/fonts/Aron-Regular.woff2') format('woff2'),
        url('/fonts/Aron-Regular.woff') format('woff'),
        url('/fonts/Aron-Regular.svg#Aron-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}


img{
	max-width: 100%;
}

html, body, div, span, p, a, del, em, img, ol, ul, li, fieldset, form, label {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}

html, body {
	line-height: 1;
	min-height:100%;
	font-family:Artial, Verdana, sans-serif;
}



.logo  {
	position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 999;
}

.logo img { max-width: 200px;}

#pleca {
	background: #222;
	width: 100%;
	position: fixed;
	height: 6vh;
	z-index: 999;
}

#pleca2 {
	background: #222;
	width: 100%;
	position: fixed;
	height: 10vh;
	z-index: 999;
	bottom: 0
}

#menu {
	position: fixed;
	top: 50%;  /* position the top  edge of the element at the middle of the parent */
    left: 50%; /* position the left edge of the element at the middle of the parent */
	z-index: 999999;
	transform: translate(-50%, -50%);
	width: 100%;
}

#menu li {
	display: inline-block;
    margin: 0 7vw;
    font-size: 34px;
    color: #fff;
	font-weight: 500;
	
}

	#menu li a {
    color: #000000;
    font-weight: 300;
    font-size: 2.7vw;
    font-family: 'Aron';
    font-family: 'Neue Haas Grotesk Display Pro';
    text-transform: uppercase;
    /* font-family: 'Neue Haas Grotesk Display Pro'; */
    font-family: 'Aron Normal';
    font-family: 'Alte Haas Grotesk';
}


#inicio_home {
	    padding-top: 3vw;

}

.fondo_soon {
	    height: 100%;
		background-color: #68736e;
	padding: 20px 30px;
}

.fondo_verde{
	background-color: #68736e;
	padding: 20px 30px;
}

.amarillo {
	background-color: #fff;
}
.amarillo_dos {
	background-color: #caab7d;
}

.rojo {
	background-color: #af887a;
}

body {
	
	background: #000;
	background-attachment:fixed;
}

ol, ul {
	list-style: none;
}

p {
	margin:1em 0;
	line-height:1.1em;
    font-family: 'Aron';
    text-align: justify;
}

q {
	font-style:italic;
	color:#333;
}

h1 {
       font-size: 2.5vw;
    margin: 0;
    text-transform: uppercase;
    padding-bottom: 3vw;
	 font-family: 'Alte Haas Grotesk';
}

h1 > small {
	text-align:right;
	display:inline-block;
	font-size:.71em;
	text-indent:15em;
	color:#444;
}

h2 {
	color:inherit;
	font-size:1.91em;
	margin:2em 0 1em 0;
}

h2:first-child {margin-top:0;}

h3 {
	color:#333;
	font-size:1.41em;
	margin:1em 0;
}

h4 {
	color:#444;
	font-size:1.11em;
	margin:1em 0;
     font-family: 'Alte Haas Grotesk';
}

#progress {
	height:2%;
	background:#444;
	bottom:0;
	z-index:200;
}

#scrollbar {
	position:fixed;
	right:2px;
	height:50px;
	width:6px;
	background:#444;
	background:rgba(0,0,0,0.6);
	border:1px solid rgba(255,255,255,0.6);
	z-index:300;
	border-radius:3px;
}

.skrollr-desktop #scrollbar {display:none;}

#bg1, #bg2, #bg3 {
	z-index:50;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background:url(images/bubbles.png) repeat 0 0;
}

#bg2 {
	z-index:49;
	background-image:url(images/bubbles2.png);
}

#bg3 {
	z-index:48;
	background-image:url(images/bubbles3.png);
}

#intro {
	width:80%;
	left:50%;
	top:1em;
	margin-left:-40%;
	padding:2em;
	background:#fff;
	text-align:center;
	border-radius:1em;

	-webkit-transform-origin:0 0;
	-moz-transform-origin:0 0;
	-ms-transform-origin:0 0;
	-o-transform-origin:0 0;
	transform-origin:0 0;

	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

#intro .arrows {
	font-size:2em;
	color:#09f;
}

#transform {
	width:70%;
	left:50%;
	top:20%;
	margin-left:-35%;
	text-align:center;
	font-size:150%;

	transform-origin:(50%, 50%);
}

#properties {
	width:100%;
	height:100%;
	padding-top:10%;
	text-align:center;

	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

#easing_wrapper {
	width:100%;
	height:100%;
	top: -10% !important
}

#easing {
	top:10%;
	width:50%;
	z-index:101;
}


#slide1 {background-image: url('/images/1a.jpg');}
#slide2{background-image: url('/images/2b.jpg');}
#slide3{background-image: url('/images/3c.jpg');}
#slide4{background-image: url('/images/1b.jpg');}
#slide5{background-image: url('/images/2c.jpg');}
#slide6{background-image: url('/images/3b.jpg');}
#slide7{background-image: url('/images/1c.jpg');}
#slide8{background-image: url('/images/2d.jpg'); }
#slide9{background-image: url('/images/3a.jpg');}
#slide10{background-image: url('/images/2a.jpg');}
#slide11{background-image: url('/images/1d.jpg');}
#slide12{background-image: url('/images/3d.jpg');}




#slidenuevo1 {background-image: url('/images/rtro_inicio_1.jpg');}
#slidenuevo2 {background-image: url('/images/rtro_inicio_2.jpg');}
#slidenuevo3 {background-image: url('/images/rtro_inicio_3.jpg');}
#slidenuevo4 {background-image: url('/images/rtro_inicio_4.jpg');}

.drop {
	background: #09f;
    font-weight: bold;
  height: 100vh;
    width: 25%;
}

.drop2 {
	background: #000;
    font-weight: bold;
  height: 100vh;
    width: 25%;
}

.drop3 {
	background: #bf1919;
    font-weight: bold;
  height: 100vh;
    width: 25%;
}


.drop4 {
	background: green;
    font-weight: bold;
  height: 100vh;
    width: 25%;
}

#download {
	width:100%;
	left:0%;
	height:100%;
	padding:3em;
	border:0 solid #222;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.twitter-share-button, .twitter-follow-button {
	vertical-align:middle;
}


#overlay {
	position: fixed;
    /* display: none; */
    width: 100vw;
    height: 100vw;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.2);
    z-index: 98;
    cursor: pointer;
  }


.rtro h1{
	    position: absolute;
    top: 78%;
    font-weight: 300;
    font-family: 'Lato', sans-serif;
    left: 50%;
    transform: translate(-50%, 50%);
    margin-top: 50px;
    font-size: 36px;
    letter-spacing: 2px;
    color: #fff;
    opacity: 1;
    /* text-shadow: 0px 0px 10px #000; */
    z-index: 999;
        font-size: 2vw;
    margin: 0;
    text-transform: uppercase;
    padding-bottom: 3vw;
    font-family: 'Alte Haas Grotesk';
}


.rtro h1 a {color: #fff;}

.rtro h1:hover {
	opacity: 1
}


.rtro .column ul.bgs {
    width: 23%;
    height: 100%;
    list-style: none;
    overflow: hidden;
    position: fixed;
	z-index: 10;
	margin-left: -15px;
}

.rtro .column ul.bgs li {
    width: 100%;
    height: 100%;
    position: absolute;
    background: #000;
    background-size: 26% auto!important;
    text-align: center;
	overflow: hidden;
	border:  10px solid #000;
    border-top: 0;
    border-bottom: 0;
}

.rtro {
  display: flex;
  flex-wrap: wrap; /* por si en móvil quieres que se acomoden verticalmente */
  width: 100%;
  height: 100vh;
}

.rtro .column {
  width: 25%;
  position: relative;
  padding: 0;
}

.rtro .column ul.bgs {
  width: 100%;
  height: 100vh;
  list-style: none;
  overflow: hidden;
  position: relative;
  margin: 0;
  padding: 0;
}


#slide1 li{
    border-left:0 ;
}

.titulos {
    font-family: 'Alte Haas Grotesk';
}


@media (min-width: 1400px) {
    .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
        max-width: 1420px;
    }
}

.footer_home {
    position: fixed;
    bottom: 20px;
    width: 100%;
    z-index: 999;
    background: black;
}

.footer_home .container {
    width: 100%;
}

.menu_home	{
	padding-top: 2.2%;
    padding-bottom:  1.2%;
    border-bottom: 1px solid #fff;
	position: relative;
}

.menu_home::after {
	content: '';
	position: absolute;
	right: 10vw;
	height: 8vw;
	width: 1px;
	bottom: 0;
	background-color: #fff;
}

.topbarhome_2 .container {
    width: 100%;
}


.topbarhome_2 {
    background: black;
    position: fixed;
    z-index: 9999;
    width: 100%;
    padding-bottom: 0px;
    height: 100px;
}

.rtro .container {
    width: 100%;
}


.topbarhome .container {
    width: 100%;
}


.topbarhome {
    background: black;
    position: fixed;
    z-index: 9999;
    width: 100%;
    
    height: 150px;
}

a { color: inherit; text-decoration: none;}


.foot {
	       padding-top: 2%;
  
    border-top: 1px solid #fff;
    position: relative;
    margin-top: 3%;
}

.foot p{
	       color: #ffffff;
    font-size: 18px;
    line-height: 16px;
}

.foot::after {
	content: '';
	position: absolute;
	right: 18vw;
	height: 8vw;
	width: 1px;
	top: 0;
	background-color: #fff;
}

.logo_new img{
	       max-width: 19vw;
}

.logo_new_interiores img{
	       max-width: 270px;
}

.isotipo img{
	    max-width: 5vw;
}


.hamburger {
  font-size: 30px;
  background: none;
  border: none;
  cursor: pointer;
  top: 20px;
  right: 20px;
  z-index: 1001;
}

.hamburger  .bi {
    color: white;

}

.overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background: rgba(0, 0, 0, 0.6);
  z-index: 1000;
  opacity: 1;
  transition: opacity 0.3s ease;
}

.overlay.hidden {
  opacity: 0;
  pointer-events: none;
}

.side-menu {
  position: fixed;
  top: 0;
  right: 0;
  height: 100%;
  width: 400px;
  background: #2a2929c9;
  box-shadow: -2px 0 10px rgba(0, 0, 0, 0.3);
  transform: translateX(100%);
  transition: transform 0.3s ease;
  z-index: 1002;
  padding: 20px;
  box-sizing: border-box;
}

.side-menu.open {
  transform: translateX(0);
}

.close-btn {
  font-size: 30px;
  background: none;
  border: none;
  position: absolute;
  top: 20px;
  right: 20px;
  cursor: pointer;
  color: white;
}

.btn_todos {
        position: absolute;
    bottom: 30px;
    right: 100px;
    font-size: 15px;
    font-family: 'Aron';
    text-transform: uppercase;
    letter-spacing: 2px;
    border-bottom: 1px solid;
    padding-bottom: 10px;
}

.top10 { margin-top: 10px;}
.top20 { margin-top: 20px;}
.top30 { margin-top: 30px;}
.top40 { margin-top: 40px;}
.top50 { margin-top: 50px;}
.top60 { margin-top: 60px;}
.top70 { margin-top: 70px;}
.top80 { margin-top: 80px;}

.bot80 { margin-bottom: 30px;}

.menu-content ul {
  list-style: none;
  padding: 0;
  margin-top: 60px;
}

.menu-content ul li {
  margin: 40px 0;
}

.menu-content ul li a {
      text-decoration: none;
    color: white;
    font-size: 18px;
    font-size: 22px;
    font-family: 'Aron';
}

.social {
  margin-top: 40px;
}

.icons a {
  margin-right: 10px;
  text-decoration: none;
}


main h2  {font-size: 1.7rem;
     font-family: 'Aron';
}

.text-right {
        text-align: right;
}

.align-bottom {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  
}

.procura_dow {
        max-width: 80%;
}

.procura_dow h3 {
        color: white;
    font-style: italic;
    font-family: 'Alte Haas Grotesk';
    font-family: 'Aron';
    font-weight: 200;
    padding: 5vw 0;
}

.consultas_abajo {
    padding-top: 50vh;
}

.consultas_abajo h4 {
    color: white;
}

.row-cuadrin {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px; /* como tu .top80 pero entre filas y columnas */
  margin-bottom: 60px;
}

.cuadrin {
  padding: 20px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  border-right: 1px solid white;
}

.bor_der { border-right: 1px solid white;}


.toptrama { margin-top: 30vh;}

#consultoria { color: white; }
#consultoria h4 { color: white;}

.consultoria_fondo {
    background-image: url('/images/consultoria-min.png');
    background-size: 100%;
    background-repeat: no-repeat;
    padding-bottom: 10%;
     min-height: 90vh;
     clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);
    animation: revealDown 3s ease-in-out forwards;
}

.tecnica_fondo {
    background-image: url('/images/tecnica.png');
    background-size: 100%;
    background-repeat: no-repeat;
    padding-bottom: 10%;
    min-height: 90vh;
     clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);
    animation: revealDown 3s ease-in-out forwards;
}


.proyectos_fondo {
    background-image: url('/images/proyectos.png');
    background-size: 100%;
    background-repeat: no-repeat;
    padding-bottom: 10%;
    min-height: 90vh;
     clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);
    animation: revealDown 3s ease-in-out forwards;
}

.proyectos_fondo_abierto {
    background-size: 100%;
    background-repeat: no-repeat;
  
     clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);
    animation: revealDown 3s ease-in-out forwards;
}

.procurement_fondo {
    background-image: url('/images/procurement.png');
    background-size: 100%;
    background-repeat: no-repeat;
    padding-bottom: 0%;
    min-height: 90vh;
     clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);
    animation: revealDown 3s ease-in-out forwards;
}

.comercializacion_fondo {
    background-image: url('/images/comercializacion.png');
    background-size: 100%;
    background-repeat: no-repeat;
    padding-bottom: 0%;
    min-height: 90vh;
     clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);
    animation: revealDown 3s ease-in-out forwards;
}


.nosotros_fondo {
    background-image: url('/images/nosotros.png');
    background-size: 100%;
    background-repeat: no-repeat;
    padding-bottom: 0%;
    min-height: 90vh;
     clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);
    animation: revealDown 3s ease-in-out forwards;
}

.contacto_fondo {    
    background-image: url('/images/contacto.png');
 background-size: 100%;
    background-repeat: no-repeat;
    padding-bottom: 0%;
    min-height: 90vh;
     clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);
    animation: revealDown 3s ease-in-out forwards;

}

@keyframes revealDown {
    to {
        clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
    }
}

.regresar {
        margin-top: 70px;
    float: right;
    font-family: 'Aron';
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-right: 20px;
}

.regresar_consultoria {
        
    float: right;
    font-family: 'Aron';
    text-transform: uppercase;
    letter-spacing: 1px;
   
}


input {
    background: transparent;
    border: none;
    border-bottom: 1px solid white;
    width: 100%;
    text-transform: uppercase;
    color: white;
    height: 50px;
    margin-bottom: 10px;
}

textarea {
    resize: vertical;
    background: transparent;
    border: none;
    border-bottom: 1px solid white;
    width: 100%;
    text-transform: uppercase;
    color: white;
    height: 100px;
    margin-bottom: 10px;
    margin-top: 20px;
}

#contact_form .btn-one{
    border: none;
    text-transform: uppercase;
    letter-spacing: 1px;
    height: 50px;
}

#contact_form .btn-one:hover{
    border: none;
    background-color: #6a736f;
    color: black;
}

.consul_1 { padding-top: 10vh;}
.consul_2 { padding-top: 60vh;}
.consul_3 { padding-top: 20vh;}

.mastwrap { padding-top: 150px;}

.fold-promo h1 {
            font-size: 3rem;
    font-weight: 400;
    font-family: 'Alte Haas Grotesk';
    text-transform: uppercase;
    text-align: center;
    line-height: 30px;
    color: white;
}

.fold-promo h1>span {
        margin-left: 260px;
}

.fold-promo p {
    color: white;
}

.fold-promo  {
    padding-bottom: 80px;
}

.fold-promo h3 {
    font-weight: 400;
     color: white;
    font-family: 'Alte Haas Grotesk';
}

.fold-promo h2 {
  font-family: 'Alte Haas Grotesk';
    text-transform: uppercase;
    font-size: 17px;
    margin-top: 20px;
    font-weight: 900;
      color: white;
}

.fold-promo h1>span::after {
    content: ' ';
    position: absolute;
    left: -60px;
    height: 70px;
    width: 2px;
    background: white;
    transform: rotate(45deg);
    margin: 0 auto;
}

.aviso {
    background: #c8c2ad;
    background-image: url('/images/aviso.jpg');
    background-size: cover;
}

.align-end {align-self: end;}

.tecnica_1 { 
        padding-top: 5vh;
    position: sticky;
    height: 0;
    position: sticky;
    top: 80px;
}
.tecnica_2 { padding-top: 30vh;}
.tecnica_3 { padding-top: 60vh;}

.toptecnica { padding-top: 110vh;}


.abierto { padding: 0 5vw;}
.abierto h1 { padding-bottom: 0; text-align: right;}
.abierto h3 { margin: 0; text-align: right;}

.procur { 
       padding-top: 5vh;
    position: sticky;
    height: 0;
    top: 80px;
    margin-right: 0px;
}

.procur_1 { padding-top: 10vh;}
.procur_2 { padding-top: 30vh;}


.comercio_1 { 
        padding-top: 5vh;
    position: sticky;
    top: 80px;
}

.comercio_2 {    padding-top: 25vh; }
.comercio_3 {    padding-top: 50vh; padding-bottom: 30vh; }

.comercializacion_fondo h3 {
        color: white;
    font-size: 1.7rem;
    font-family: 'Aron';
    padding: 0 0 3vw 0;
}

.comercializacion_fondo h2 { padding-top: 5vh;}



figure.snip1477 {
text-align: left;
  position: relative;
  overflow: hidden;
}
figure.snip1477 *,
figure.snip1477 *:before,
figure.snip1477 *:after {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.55s ease;
  transition: all 0.55s ease;
}
figure.snip1477 img {
  max-width: 100%;
  backface-visibility: hidden;
  vertical-align: top;
  opacity: 0.9;
}
figure.snip1477 .title {
  position: absolute;
  top: 58%;
  left: 25px;
  padding: 5px 10px 10px;
}

figure.snip1477 h2, figure.snip1477 h4 {
    font-size: 16px;
}


figure.snip1477 .title:before,
figure.snip1477 .title:after {
  height: 2px;
  width: 400px;
  position: absolute;
  content: '';
  background-color: #ffffff;
}
#consultoria figure.snip1477 .title h4 {
        background: transparent;
    color: white;
    text-align: left;
    padding: 0;
    font-weight: 100;
    padding-top: 6px;
        text-shadow: 0 0 6px black;
}

figure.snip1477 .title:before {
  top: 0;
  left: 10px;
  -webkit-transform: translateX(100%);
  transform: translateX(100%);
}
figure.snip1477 .title:after {
  bottom: 0;
  right: 10px;
  -webkit-transform: translateX(-100%);
  transform: translateX(-100%);
}
figure.snip1477 .title div:before,
figure.snip1477 .title div:after {
  width: 2px;
  height: 300px;
  position: absolute;
  content: '';
  background-color: #ffffff;
}
figure.snip1477 .title div:before {
  top: 10px;
  right: 0;
  -webkit-transform: translateY(100%);
  transform: translateY(100%);
}
figure.snip1477 .title div:after {
  bottom: 10px;
  left: 0;
  -webkit-transform: translateY(-100%);
  transform: translateY(-100%);
}
figure.snip1477 h2,
figure.snip1477 h4 {
  margin: 0;
  text-transform: uppercase;
}
figure.snip1477 h2 {
  font-weight: 400;
      text-shadow: 0 0 16px black;
}
figure.snip1477 h4 {
  display: block;
  font-weight: 700;
  background-color: #ffffff;
  padding: 5px 10px;
  color: #000000;
}
figure.snip1477 figcaption {
  position: absolute;
  bottom: 42%;
  left: 25px;
  text-align: left;
  opacity: 0;
  padding: 5px 60px 5px 10px;
  font-size: 0.8em;
  font-weight: 500;
  letter-spacing: 1.5px;
}
figure.snip1477 figcaption p {
  margin: 0;
}
figure.snip1477 a {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}
figure.snip1477:hover img,
figure.snip1477.hover img {
  zoom: 1;
  filter: alpha(opacity=35);
  -webkit-opacity: 0.35;
  opacity: 0.35;
}
figure.snip1477:hover .title:before,
figure.snip1477.hover .title:before,
figure.snip1477:hover .title:after,
figure.snip1477.hover .title:after,
figure.snip1477:hover .title div:before,
figure.snip1477.hover .title div:before,
figure.snip1477:hover .title div:after,
figure.snip1477.hover .title div:after {
  -webkit-transform: translate(0, 0);
  transform: translate(0, 0);
}
figure.snip1477:hover .title:before,
figure.snip1477.hover .title:before,
figure.snip1477:hover .title:after,
figure.snip1477.hover .title:after {
  -webkit-transition-delay: 0.15s;
  transition-delay: 0.15s;
}
figure.snip1477:hover figcaption,
figure.snip1477.hover figcaption {
  opacity: 1;
  -webkit-transition-delay: 0.2s;
  transition-delay: 0.2s;
}


.falling-furniture-container {
    position: fixed;
    top: 0;
    left: 50%;
    width: 50vw;
    height: 100vh;
    pointer-events: none;
    z-index: 1;
    overflow: hidden;
  }

  .falling-furniture {
    position: absolute;
    animation-timing-function: cubic-bezier(0.3, 0, 0.2, 1);
    will-change: transform;
    filter: drop-shadow(4px 6px 8px rgba(0,0,0,0.4));
    /* Estado inicial (fuera de pantalla) */
    transform: translateY(-100%);
  }

  @keyframes gentle-fall {
    0% {
      transform: translateY(-100%) rotate(0deg);
    }
    100% {
      transform: translateY(110vh) rotate(calc(var(--rotation) * 1deg));
    }
  }


.topproycts { margin-top: 30vh;}

main {
    padding-top: 100px;
    z-index: 999;
    position: relative;
}

.parallax-img {
     will-change: transform;
    transition: transform 0.1s ease-out;
    max-width: 40vw;
    height: auto;
    max-height: 20%;
    width: auto;
}

.circulo {
    background-image: url('../images/circulo-min.png');
    background-size: contain;
    background-image: url(../images/circulo-min.png);
    background-size: contain;
    background-repeat: no-repeat;
    padding: 90px 0 130px 0;
        margin-left: 5vw;
}

.cir1 {
        margin-top: -30px;
    padding-bottom: 20px;
}

.cir2{
        margin-left: 110px;
    padding-top: 80px;
}

.swiper-button-next:after, .swiper-button-prev:after {
    color: white;
}

.swiper-button-next:after, .swiper-button-prev:after {
        font-size: 16px;
}

.bgwhite {
   background-color:#e8e8e4
}

.bgwhite .topbarhome_2{
   background-color:#e8e8e4;
   z-index: 4;
}

.bgwhite .logo_new_interiores img {
        filter: invert(1);
}

.bgwhite  .menu_home::after {
    background-color: #000;
}

.bgwhite .menu_home {
    border-bottom: 1px solid #000;
}

.bgwhite .hamburger .bi {
    color: black;
}

#proyecto_abierto {
    margin-top: 40px;
}

.align-baseline {
        align-items: baseline;
}

.juntas {
  /* padding-left: 5vw;
    padding-right: 5vw;*/
}

.grises img {
    filter: grayscale(1);
}

.down {
    right: 14vw;
}

@media (min-width: 1920px) {
    .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
        max-width: 90%;
    }
}

@media (max-width: 1100) { 
	#menu li a {font-size: 2.5vw;}
}

@media (max-width: 990px) { 

    .parallax-img {    max-width: 35vw;}
}



/* Scroll horizontal en pantallas pequeñas */
@media (max-width: 768px) {
  .rtro {
    overflow-x: auto;
    flex-wrap: nowrap;
  }

  .rtro .column {
    min-width: 23vw; /* 25% del viewport width, mantiene las 4 columnas visibles horizontalmente */
    flex: 0 0 auto;
  }
}



@media (max-width: 432px) { 

  .flsm { float: left;}
  .frsm { float: right;}

    .parallax-img { display: none;}


    .comercio_2 {
    padding-top: 5vh;
}

.comercio_3 {
    padding-top: 10vh;
    padding-bottom: 0vh;
}

    .row-cuadrin {     grid-template-columns: repeat(1, 1fr);}
    .procura_dow h3 {    margin-top: 28vw;}

    .toptecnica {
    padding-top: 17vh;
}

.tecnica_fondo .celtopminus {
        margin-top: 30px;
    }

    .tecnica_1 {
    padding-top: 4vh;
    position: sticky;
    height: 0;
    position: sticky;
    top: 50px;
    padding-bottom: 30px;
}

.tecnica_fondo h2 {
        background: black;
    padding-bottom: 30px;
            padding-top: 20px;
}

.tecnica_3 {
    padding-top: 4vh;
}


    main {
        padding-top: 66px;
    }
    .isotipo { padding-top: 10px;}

.consul_2 {
    padding-top: 20vh;
}


.tecnica_2 {    padding-top: 0vh;}
.tecnica_fondo .celtopminus{ margin-top: -80px;}

.cuadrin { 
            border: none;
        padding-top: 0;
        padding-bottom: 30px;
        border-bottom: 1px solid;
}
.cuadrin p { margin: 0;}

.consultoria_fondo {    background-image: url('/images/consultoria_cel-min.png');}
.tecnica_fondo {    background-image: url('/images/tecnica_cel.png');}
.procurement_fondo {    background-image: url('/images/procurement_cel.png');}
.comercializacion_fondo {    background-image: url('/images/comercializacion_cel.png');}
.nosotros_fondo {    background-image: url('/images/nosotros_cel.png');}
.contacto_fondo {    background-image: url('/images/contacto_cel.png');}

.nosotros_fondo .toptrama {
    margin-top: 9vh;
    border-top: 1px solid white;
    margin-bottom: 8vh;
}

.procur {    margin-right: 20px; padding-top: 2vh;}
    .procura_dow h3 {
        margin-top: 40vw;
    }

    .procura_dow {
    max-width: 95%;
    padding-left: 20px;
}

    .consultas_abajo {
    padding-top: 2vh;
}

.foot p {
        line-height: 26px;
}

	#overlay { display: none;}
	.rtro h1 {
        transform: rotate(90deg);
        left: -16%;
        font-size: 13px;
        letter-spacing: 4px;
    }
	#menu {    position: fixed;
		top: 32%;
		left: 50%;
		z-index: 999999;
		transform: translate(-50%, -50%);
		width: 100%;}

		#menu li{padding-top: 190px; margin: 0 6vw;}
		#menu li a {
			color: #fff;
			font-weight: 300;
			font-size: 8.5vw;
			padding-top: 70px;
		}


.rtro .col-xs-3 {
	width: 25%;
  }

 
    .col-sm-6 {
        flex: 0 0 auto;
        width: 50%;
    }

	    .col-sm-3 {
        flex: 0 0 auto;
        width: 25%;
    }

	 .col-sm-4 {
        flex: 0 0 auto;
        width: 33.333334%;
    }
	    .col-sm-8 {
        flex: 0 0 auto;
        width: 66.66666667%;
    }

	    .col-sm-10 {
        flex: 0 0 auto;
        width: 83.33333333%;
    }

	    .col-sm-2 {
        flex: 0 0 auto;
        width: 16.66666667%;
    }

	.menu_home::after {
		height: 12vw;
	}

	.isotipo img {
    max-width: 8vw;
    float: right;
	    margin-top: 0px;
}

.foot::after {
    content: '';
    position: absolute;
    right: 32vw;
    height: 18vw;}


  .fondo_verde {
	padding: 20px 20px;
	    margin-bottom: 20px;
  }

h1 {
    font-size: 4.5vw; }

.logo_new img {
    max-width: 35vw;
}

.rtro .column ul.bgs {
        width: 100%;
}


.btn_todos {
     
    right: 20px;
}

.topproycts {
        margin-top: 0vh;
}

.topbarhome {
    height: 80px;
}


}