/* --> Rodamientos El Palomar <<<-----*/

/* -------> Fonts <<<--------------*/


@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("inter.woff2".woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Hind';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url( "hind-medium.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Hind';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("hind-bold.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* --------> Resets and overrides <<<------------*/
	
*{margin:0; padding:0;} 
body, p, div, h1, h2, h3, h4, h5, h6, ul, ol, li, pre, blockquote, address, cite{ margin:0; padding:0;}
*, *:after, *:before {margin:0; padding:0; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -webkit-font-smoothing:antialiased; font-smoothing:antialiased; text-rendering:optimizeLegibility;}
html body {width:100%; height:100vh;  background-color:#B8B8B8;} 
html {overflow-x: hidden !important}
body {font-family: 'hind', sans-serif; font-size:0.980em; color:#1E1E1E; font-weight: 500;}
.clearfix {clear:both; height:0px; font-size:1px;}
:focus {outline:0;}
img, iframe {border:none; text-decoration:none;}
ol, ul {list-style:none;}
a {text-decoration:none; color:#1E1E1E;}
a:hover {text-decoration: underline; color:#90291D;}
p {line-height: normal;font-weight: 400;font-size: 1em;}
h1, h2, h3, h4, h5 {font-size:1em; font-family: 'hind', sans-serif; font-weight: 500;}
input, select, textarea {font-family: 'hind', sans-serif;}
article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary {display:block;}
input:invalid {box-shadow: none;}


/* --------> General <<<-------------*/

.wrapper {background-image: url("../images/background.jpg"); background-size: cover; background-position: left bottom; height:100vh; padding-top: 5%;}

.info {width: 800px; margin: 0 auto 0; display: block; background: url("../images/pattern.png") repeat; padding: 50px 75px; text-align: center; }
.info h1 { margin-bottom: 40px;}
.info h2 {font-size: 1.225em; line-height: 1.325em; margin-bottom: 20px;  display: block;}
.info .contact {font-size: 1.225em;  line-height: 1.325em;}


.info ul {display: flex; justify-content:space-between; text-align: left; margin-top: 30px;}
.info h3 {font-weight: 700; font-size: 0.980em; margin-top: 10px;}
.info p {font-size: 0.980em; line-height: 1.025em;}


/* --------> Media Queries <<<-------------*/

@media (max-width: 980px) {
	
	.info {width: 90%; }
	.info h2 {text-wrap: balance;}
	.wrapper { background-position: center bottom;}
	
}


@media (max-width: 780px) {
	
	.wrapper {background-image: url("../images/background-mobile.jpg");}
	.info {width: 90%; padding:30px 20px;}
	.info h1 {margin-bottom: 20px;}
	.info h1 img {width: 100%; max-width:180px; height: auto;}
	.space {display: block; text-indent: -9999px; height: 1px;}
	.info ul {display:block; text-align: center; margin-top: 20px;} 
	.info ul li:first-child {margin-bottom:16px;}
	.info br {height: 5px; font-size: 5px; display: block;}
	.info h3 {font-weight: 700; font-size: 1.100em; margin-top: 10px;}
.info p {font-size: 1.100em; line-height: 1.025em;}
	
}


@media (max-height: 650px) {
	
	html body {height:100%;}
	.wrapper {height:100%; padding-bottom: 40px;}
	
}

