@charset utf-8;
/*
Theme Name: Redondo
Author: Code by Ricardo Juárez Design by Phantasia
Author URI: http://rjvv.com/
Version: 1.0
License: GNU/GPL Version 2 or later. http://www.gnu.org/licenses/gpl.html
Copyright: (c) 2025 Ricardo Juárez
*/


:root 	{
	--body: 24px;
	--linebody: 120%;
	--lsbody:0;

	
	--primary:#FFFFFF;
	--contrast: #000000;
	
	--pad:20px;
	--padb:60px;
	--padb2:100px;
	--padh:150px;
	--pads: 10px;
    
	--sans: "IvoryMonoLLWeb-Regular", Times, serif;

	 --real100: 100vh;
}

*{
	-webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
     -webkit-touch-callout: none;
    -webkit-tap-highlight-color: transparent;

}
html, body
{
	overscroll-behavior-block: none;
overscroll-behavior: none;
margin:0;
width:100%;
     }
     
     	html { margin-top: 0px !important; background-color: var(--primary);}
	* html body { margin-top: 0px !important; }
	@media screen and ( max-width: 782px ) {
		html { margin-top: 0px !important; }
		* html body { margin-top: 0px !important; }
	}
	

body {
margin:0;
-moz-osx-font-smoothing: grayscale; 
text-rendering:geometricPrecision;
-webkit-font-smoothing: subpixel-antialiased;
font-size: var(--body);
line-height: var(--linebody);
font-weight: 400;
font-family: var(--sans);
color: var(--contrast);
}



    .marquee {
	    padding: 120px 0 40px;
      overflow: hidden;
      white-space: nowrap;
    }

    .marquee .client-item {
      display: inline-block;
      padding: 0 10px;
    }

    .marquee img {
    max-width: 126px;
        width: auto !important;
height: auto;
  max-height: 20px;
    }

.js-marquee{
	display: flex;
	align-items: center;
}






	#single-logo-rotator{
		width: 100%;
	}
	
	
	.client-item img{
		max-width: 220px;
		width: auto;
		height: auto;
		max-height: 40px;
	}	
	
	.client-item{
	display: flex;
	justify-content: center;
	align-items: center;
	aspect-ratio: 4/2;
}	
	.gallery-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 20px;
}

	
.first   { grid-column-start: 1; }
.second  { grid-column-start: 2; }
.third   { grid-column-start: 3; }
.fourth  { grid-column-start: 4; }
.fifth   { grid-column-start: 5; }


.smallsize  { width: 285px; }
.mediumsize { width: 440px; }
	
	
	.logos-clientes {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 5px;
}

.logo-client {

    opacity: 0;
}

.logo-client img {
    width: auto !important;
    max-height: 50px;
    max-width: 200px;
    height: auto;
    }

.logo-client.visible {
    opacity: 1;
}

	.absleft{
		position: absolute;
		width: 100%;
		height: 100%;
		text-align: center;
		display: flex;
		align-items: flex-start;
		justify-content: center;
		gap:20px;
		padding: 20px;
		flex-direction: column;
	}	
	.abscenter{
		position: absolute;
		width: 100%;
		height: 100%;
		text-align: center;
		display: flex;
		justify-content: center;
		align-items: center;
	}
.logos-clientes {
    position: sticky;
    top: 0;
    width: 100vw;
    height: 100vh;
    overflow: hidden;
}


.landing-header{
	display: flex;
	position: fixed;
	top: 0;
	left: 0;
	padding: 20px;
	gap:20px;
	z-index: 9999;
	
}
.mfooter{
	margin-bottom: 60px;
}

.padded{
	padding: 20px;
}
.footer{
	display: flex;
	position: fixed;
	bottom: 0;
	left: 0;
	padding: 20px;
	gap:20px;
	z-index: 9999;
}

.sticky-logo-gallery {
    position: relative;
}

.logos-redondo.sticky {
    position: sticky;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 0;
}

.gallery {
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: relative;
    z-index: 999;
    padding: 0 175px;
}

.gallery-item {
    margin: 0px 0 300px;
}

.logo-item {
    width: 100vw;
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
}

.logo-item img, .logo-item svg {
    width: calc(100vw - 40px) !important;
    height: 100% !important;
}


@media all and (-ms-high-contrast:none){}