@font-face {
  font-family: 'museo700-regular';
  src: url(../fonts/museo700-regular.otf); 
}
@font-face {
  font-family: 'museosans-500';
  src: url(../fonts/museosans-500.otf);
}
@font-face {
  font-family: 'museosans-500italic';
  src: url(../fonts/museosans-500italic.otf);
}
@font-face {
  font-family: 'museosans7';
  src: url(../fonts/museosans7.otf);
}
@font-face {
  font-family: 'museosans3';
  src: url(../fonts/museosans3.otf);
}

html, body{
  padding:0;
  margin:0;
  width: 100%;
  height: 100%;
  font-family: "museo", Helvetica, Arial, sans-serif;
  font-size: 16px;
}
img {
	padding:0;
    margin:0;
	border: none;
	outline: none;
}
h1 {
  font-family: 'museo700-regular', Helvetica, Arial, sans-serif;
  font-size: 7.5rem;
	line-height: 7.5rem;
	color:#ffffff;
	margin: 0;
	padding: 0;	
}
h2 {
  font-family: 'museosans7', Helvetica, Arial, sans-serif;
  font-size: 2.8rem;
   text-transform: uppercase;
	color:#26254f;
	margin: 0;
	padding: 0;
}
h3 {
  font-family: 'museosans-500italic', Helvetica, Arial, sans-serif;
  font-size: 3rem;
	color: #aee0fb;
	margin: 0;
	padding: 2rem 0 0 0;
	font-weight:100;
	text-align: left;
}
h4 {
  font-family: 'museosans3', Helvetica, Arial, sans-serif;
  font-size: 2rem;
	color: #aee0fb;
	text-transform: uppercase;
	margin: 0 0 0.5rem 0;
	padding: 0;	
	font-weight:100;
}
h5 {
	padding: 1em;
	margin: 0 auto;
	font-size: 2rem;
	text-align: center;
	color: #ffffff;
	text-transform: uppercase;
	font-family: 'museosans-500', Helvetica, Arial, sans-serif;
	font-weight: 100;
	max-width: 1200px;
}
header{
	width: 100%;
	height: 90%;
	background-image: url("../img/fondo-salon-motor-marbella.jpg");
	background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
	display: block;
	overflow: visible;
}
section {
	margin: 0;
	padding: 0;	
	border: 0;
}
.titular {
	padding-top: 2rem;
	margin-left: 5%;
	max-width: 68rem;
}
.lugar {
	background-color: #aee0fb;
	display: block;
	padding: 1rem 0 1rem 1.5rem;
	width: 40rem;
	margin-top: 2rem;
	margin-left: 5%;
}
.lugar2 {
	background-color: #aee0fb;
	display: none;
	padding: 1rem;
	width: 100%;
	margin: auto;
}
.date {
	background-color: #61b22f;
	position: relative;
	float:right;
	margin: 0 5rem 0 0;
}
.date2 {
	background-color: #61b22f;
	position: relative;
	float:right;
	margin: 0 5rem 0 0;
	display: none;
}
.fecha {
	font-family: 'museosans7', Helvetica, Arial, sans-serif;
    font-size: 8rem;
	line-height: 9rem;
	color:#ffffff;
	margin: 3rem 1.5rem 2.3rem 1.5rem;
	padding: 0;
	position: relative;
	text-align:left;
}
.small {
	font-size: 2rem;
	line-height: 0rem;
	overflow: visible;
}
.wrapper {
	max-width: 1600px;
	margin: 0 auto;
}
.ocasion {
	width: 100%;
	height: auto;
	background: #3389c1;
background: -moz-linear-gradient(top, #3389c1 0%, #225d96 42%, #12336d 100%);
background: -webkit-linear-gradient(top, #3389c1 0%,#225d96 42%,#12336d 100%);
background: linear-gradient(to bottom, #3389c1 0%,#225d96 42%,#12336d 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3389c1', endColorstr='#12336d',GradientType=0 );
}
.columna1 {
	padding: 1em 0;
	font-size: 1.2rem;
	text-align: left;
	line-height: 2rem;
	color: #ffffff;
	font-family: 'museosans3', Helvetica, Arial, sans-serif;
	font-weight: 100;
	max-width: 45%;
	float:left;
	display: block;
	margin-right: 10%;
}
.columna2 {
	padding: 1em 0;
	font-size: 1.2rem;
	text-align: left;
	line-height: 2rem;
	color: #ffffff;
	font-family: 'museosans3', Helvetica, Arial, sans-serif;
	font-weight: 100;
	max-width: 45%;
	float:left;
	display: block;
}
.columna2 b {
	font-family: 'museosans-500', Helvetica, Arial, sans-serif;
}
.columna1 b {
	font-family: 'museosans-500', Helvetica, Arial, sans-serif;
}
.linea {
	display: block;
	position: relative;
	width: 100%;
	margin-left: -82rem;
	padding: 0 0 0.5rem 0;
	border-bottom: 0.3rem;
	border-bottom-color: #aee0fb;
	border-bottom-style: solid;
}
.destacado {
	display: flex;
	flex-wrap: wrap;
	clear: both;
	margin: 0 auto;
	padding: 5rem 0;
}
.descuento {
	background-color: #61b22f;
	padding: 0.3rem 0.5rem;
}
.col, .col2 {
	flex: 0 0 24%;
	max-width: 24%;
}
.plus {
	flex: 0 0 14%;
	max-width: 14%;
	margin: 3rem auto 0 auto;
}

.bloquedestacado {
	width: 100%;
	align-content: center;
	text-align: center;
}
.bloquedestacado p {
	color: #ffffff;
	font-family: 'museosans3', Helvetica, Arial, sans-serif;
	font-size: 1.5rem;
	margin: 0;
	padding: 0;
}
.bloquedestacado img {
	margin-bottom: 1.2rem;
}
.imgfix {
	margin-bottom: 0.1rem !important;
}
.bigtext {
	font-size: 3rem;
	font-family: 'museosans-500', Helvetica, Arial, sans-serif;
}
.visita {
	width: 100%;
	clear: both;
	background: #61b22f;
}
.mapa {
	width: 100%;
	background: #ffffff;
	line-height: 0; 
}
.mapa iframe {
	height: 25rem;
	border:0;
	width: 100%;
}
a {
	text-decoration: none;
	color: #2b697a;
	border: none;
	outline: none;
}
a:hover {
	text-decoration: underline;
	color: #1c4854;
}
footer {
	width: 100%;
	clear: both;
	background: #3f425f;
background: -moz-linear-gradient(top, #3f425f 0%, #1c213b 100%);
background: -webkit-linear-gradient(top, #3f425f 0%,#1c213b 100%);
background: linear-gradient(to bottom, #3f425f 0%,#1c213b 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3f425f', endColorstr='#1c213b',GradientType=0 );
}
.contacto {
	max-width: 1600px;
	padding: 2em;
	text-align: left;
	font-family: 'museosans3', Helvetica, Arial, sans-serif;
	margin: 0 auto;
	font-weight:100;
}
.contacto a {
	text-decoration: none;
	color: #ffffff;
	border: none;
	outline: none;
	font-size: 1.3rem;
	line-height: 3rem;
	margin: 2rem 0 1rem 2rem;
}

.contacto a:hover {
	text-decoration: underline;
}
.contacto img {
	margin-right: 1rem;
	vertical-align: middle;
}
.copyright {
	color: #d2d3d8;
	margin: 3rem 0 0 1rem;
	padding-bottom: 1rem;
	font-family: 'museosans3', Helvetica, Arial, sans-serif;
	font-size: 0.8rem;
}
.copyright a {
	text-decoration: none;
	color: #91bad5;
	border: none;
	outline: none;
}
.copyright a:hover {
	text-decoration: underline;
}

/* Aviso legal */
.aviso {
	width: 100%;
	height: 30%;
	background-image: url("../img/cabecera.jpg");
	background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
	display: block;
	overflow: visible;
}

#legal {
	color:#333333;
	width: 60%;
	margin: 4rem auto;
	padding: 0 1rem;
}
.aviso h1{
  font-size:4rem;
  text-align: center;
  padding-top: 8rem;	
}

#legal p{
	font-family: 'museosans3', Helvetica, Arial, sans-serif;
  	font-size: 1.2rem;
	line-height: 1.7rem;
	margin:0;
	padding: 1rem 0;
	text-align: justify;
}

@media(max-width: 1900px){
	h1 {font-size: 6rem;line-height: 6rem;}
	h2 {font-size: 2rem;}
	.lugar{width: 28.5rem;}
	.fecha {font-size: 7rem;line-height: 7.5rem;}
	.small {font-size: 1.6rem;}
	header {max-height: 60rem;}
	.titular {max-width: 54rem;}
}
@media(max-width: 1720px){
	.wrapper {max-width: 1200px;}
	.contacto {	max-width: 1200px;}
	.linea {margin-left: -57rem;}
	h5 {max-width: 1200px;}
}
@media(max-width: 1400px){
	h1 {font-size: 5rem;line-height: 5rem;}
	h2 {font-size: 1.7rem;}
	h4 {font-size: 1.7rem;}
	h5 {font-size: 1.5rem;max-width: 900px;}
	.lugar{width: 24.5rem; margin-top: 1rem;}
	.fecha {font-size: 6rem;line-height: 6.6rem;}
	.small {font-size: 1.4rem;}
	.wrapper {max-width: 950px;}
	.contacto {	max-width: 950px;}
	.contacto a {font-size: 1.1rem}
	.linea {margin-left: -41.5rem;}
	.date {margin: 0 2rem 0 0;}
	.titular {padding-top: 1rem;max-width: 45rem;}
	.columna1, .columna2 {font-size: 1.1rem;}
	.copyright {margin-top:1rem;}
	header {max-height: 50rem;}
}

@media(max-width: 1200px){
	html, body {font-size:13px;}
	.linea {margin-left: -55rem;}
	.mapa iframe {height: 20rem;}
}

@media(max-width: 1020px){
	html, body {font-size:12px;}
	.wrapper {max-width: 800px;}
	h5 {max-width: 800px;}
	.contacto {	max-width: 800px;}
	.linea {margin-left: -48.6rem;}
	.destacado {padding: 4rem 0;}
	.col2 img {width: 8rem;}
	.col img {width: 5rem;}
	.plus img {width: 5rem;}
	.contacto img  {width: 2rem;}
	header {max-height: 45rem;}
}
@media(max-width: 860px){
	html, body {font-size:11px;}
	h1 {font-size: 4rem;line-height: 4rem;}
	h2 {font-size: 1.5rem;}
	h5 {font-size: 1.5rem; max-width: 650px;}
	.wrapper {max-width: 650px;}
	h5 {max-width: 650px;}
	.contacto {	max-width: 650px;}
	.linea {margin-left: -41rem;}
	.date {margin: 0 1.5rem 0 0;}
	.lugar{width: 18rem; margin-top: 1rem;padding: 1rem 0 1rem 1rem;}
	.fecha {margin: 2rem 1.2rem 2rem 1.2rem;}
	header {max-height: 35rem;}
	.titular {max-width: 36rem;}
}

@media(max-width: 700px){
	h1 {font-size: 3rem;line-height: 3rem;}
	h5 {max-width: 500px;}
	.wrapper {max-width: 500px;}
	.contacto {	max-width: 500px;}
	.linea {margin-left: -27.5rem;}
	.fecha {font-size: 5rem;line-height: 5.6rem;}
	.small {font-size: 1.3rem;}
	.bigtext {font-size: 2rem;}
	.bloquedestacado p {font-size: 1.2rem;}
	.columna1, .columna2 {clear:both;max-width: 100%;font-size: 1.5rem;line-height: 2.5rem;margin-right:0;}
	.plus img {max-width: 3rem;}
	.destacado {padding: 3rem 0;}
	.col img {width: 4rem;}
	.col2 img {max-width: 6rem;}
	.lugar{width: 22rem; margin-top: 1rem; padding: 1rem 0 1rem 1rem;}
}
@media(max-width: 560px){
	html, body {font-size:10px;}
	.wrapper {max-width: 400px;}
	.contacto {	max-width: 400px;}
	.linea {margin-left:-22rem;}
	.destacado {display: block; width: 100%;flex-wrap: nowrap;}
	.col, .col2, .plus {flex: none; max-width: 100%;clear: both;}
	.columna1, .columna2 {font-size: 1.7rem;line-height: 2.5rem;}
	.bloquedestacado p {font-size: 3rem;}
	.plus img {max-width: 5rem; margin: 1rem 0 2rem 0}
	.col img {width: 6rem;}
	.col2 img {max-width: 10rem;}
	.bigtext {font-size: 5rem;}
	h5 {max-width: 400px;font-size: 2.5rem;}
	.mapa iframe {height: 40rem;}
	.contacto img  {max-width: 3rem;}
	.contacto a {font-size: 1.4rem;}
	h4 {font-size: 2rem;}
	.copyright {font-size: 1rem;}
	header {max-height: 40rem;}
	.date {display: none;}
	.date2 {display: block; margin: 0;top:0;width: 100%;clear: both;}
	.fecha {margin: 1rem auto;text-align: center;font-size: 3rem;line-height: 2.5rem;}
	.small {font-size: 2rem;}
	.titular {padding-top: 6rem; max-width: 90%;}
	.lugar {display: none;}
	.lugar2 {display:block;}
	header {max-height: 40rem;background-image: url("../img/fondo-salon-motor-marbella-movil.jpg");	background-position: center top;}
	h1 {font-size: 3.5rem;line-height: 3.6rem;}
	h2 {font-size: 2rem; text-align: center;margin: 0 auto; width: 80%;}
}
@media(max-width: 450px){
	.wrapper {max-width: 300px;}
	.contacto {	max-width: 300px;}
	.linea {margin-left:-12rem;}
	header {max-height: 40rem;}
}
@media(max-width: 350px){
	html, body {font-size:9px;}
	.wrapper {max-width: 280px;}
	.contacto {	max-width: 280px;}
	.linea {margin-left:-10rem;}
	h5 {max-width: 300px;font-size: 2rem;}
	.bigtext {font-size: 3rem;}
	.bloquedestacado p {font-size: 2rem;}
	.plus img {margin: 0 0 2rem 0}
	header {max-height: 35rem;}
	.titular {padding-top: 5rem;}
}