@charset "UTF-8";
/* CSS Document */

/*
    font-family: 'Dancing Script', cursive;
    font-family: 'Assistant', sans-serif;
*/

html, body {
	margin:0;
	padding:0;
}

body {	
	font-family: 'Assistant', sans-serif;
	font-size:150%;
	line-height:100%;
	font-weight:200;
	color:#9ba44e;
	text-align:justify;
	
	background: url(../img/layout/fondo.jpg) 0 0 fixed; 
}

/* herramientas */

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

a:hover {
	color:#333;
	text-decoration:none;
}

a:active, a:focus { outline:0; }

a, :hover, .logo, .datos, .tels, .icon {
	-webkit-transition: .5s;
	-moz-transition: .5s;
	-ms-transition: .5s;
	-o-transition: .5s;
	transition: .5s;
}

.clear { clear:both; }
.separador { margin:0 0 50px 0; padding:30px 0 0 0; height:1px; border-bottom:1px dotted #999; }
.punteado { border-top:1px dotted #999; border-bottom:1px dotted #999; margin:0 0 15px 0; padding:20px 0; }

.txt-left { text-align:left; }
.txt-center { text-align:center; }
.txt-right { text-align:right; }

p {
	margin:0 0 20px 0;
	padding:0 0 0 0;
}

.space { height:130px; }

/* títulos */

h1 {
	margin:0 0 15px 0;
	padding:0;
	
	font-size:200%;
	line-height:100%;
	font-weight:700;
}

h2 {
	margin:0 0 30px 0;
	padding:0;
	
	font-size:200%;
	font-weight:400;
	line-height:100%;
	text-transform:uppercase;
	text-align:center;
}

h3 {
	margin:0 0 8px 0;
	padding:0;
	
	font-size:150%;
	line-height:100%;
	font-weight:700;
}

h4 {
	margin:0 0 8px 0;
	padding:0;
	
	font-size:140%;
	line-height:100%;
	font-weight:200;
	text-transform:uppercase;
}

h5 {
	margin:0 0 8px 0;
	padding:0;
	
	font-size:100%;
	line-height:100%;
	font-weight:200;
	text-align:left;
	text-transform:uppercase;
}

h6 {
	display:block;
	margin:0 auto 30px auto;
	padding:20px;
	
	max-width:1200px;
	
	font-size:100%;
	font-weight:200;
	line-height:100%;
	text-transform:uppercase;
	text-align:center;
	color:#9ba44e;
	
	border-radius:20px;
	background:#dcd98e;
	
	cursor:pointer;
}

h6:hover {
	color:#dcd98e;
	background:#9ba44e;
}


/* top */

.top {
	z-index:2;
	position:fixed; top:0; right:0; left:0;
	
	margin:auto;
	padding:0;
	
	width:100%;
	height:145px;
}

.logo {
	position:absolute; top:0; left:0; z-index:2;
	
	width:275px;
	height:120px;
	
	text-indent:-100%;
	
	background:url(../img/top/surti-fiestas-logo.jpg) 50% 50% no-repeat;
}

.datos {
	height:60px;
	
	font-size:80%;
	line-height:100%;
	font-weight:200;
	color:#dcd98e;
	text-align:right;
	
	background:#9ba44e;
}

.datos span { display:block; padding:6px 20px 0 0; }

.tels {
	padding:4px 20px 0 0 !important;
	
	font-size:120%;
	font-weight:400;
}

.tels img { display:inline-block; vertical-align:middle; padding:0 3px 0; }

.menu {
	width:100%;
	height:60px;
	
	font-size:86%;
	line-height:100%;
	text-transform:uppercase;
	color:#9ba44e;
	
	background:#dcd98e;
}

.menu > ul {
	margin:20px 20px 0 0;
	padding:0;

	float:right;
}

.menu > ul > li {
	margin:0 20px 0 0;
	padding:0;

	float:left;
	list-style:none;
}

.menu > ul > li img {
	margin:-4px 0 0 0;
}

.menu > ul > li:last-child { margin:0 0 0 0; }

/* movil */

@media only screen and (min-width:850px) {
	.movil { display:none; }
}

@media only screen and (min-width:661px) and (max-width:849px){
	.completo { display:none;  }
	.icon ul { margin:15px 10px 0 0; }
	.facebook { margin:15px 20px 0 0; }
}

@media only screen and (max-width:660px){
	.completo { display:none;  }
	.icon ul { margin:6px 10px 0 0; }
	.facebook { margin:6px 20px 0 0; }
}

.icon ul {
	padding:5.5px 0 0 0;
	
	width:28px;
	height:22.5px;
	
	float:right;
	cursor:pointer;
	
	background:#9da446;
}

.icon ul:hover { background:#6b6e21; }

.icon li {
	display:block;
	margin:0 auto 4px auto;
	padding:0;
	
	width:65%;
	height:3px;
	
	background:#ded888;
}

.facebook { float:right; }

.mmovil {
	display:none;
	z-index:3;
	position:fixed; top:0; right:0; bottom:0; left:0;
	
	width:100%;
	height:100%;
	
	background:url(../img/menu/mmovil.png);
}

.mmovil > ul {
	position:absolute; top:0; right:0; bottom:0; left:0;
	margin:auto;
	padding:0;
	
	width:90%;
	height:270px;
	
	background:url(../img/menu/mmovil.png);
}

.mmovil > ul > li {
	display:block;
	margin:0;
	padding:0;
	
	font-size:120%;
	line-height:100%;
	text-align:center;
	color:#dcd98f;
	
	list-style:none;
	
	border-bottom:1px dotted #dcd98f;
}

.mmovil > ul > li:last-child { border:none; }

.mmovil > ul > li > a {
	display:block;
	padding:12px 0;
}

.mmovil .icon-cerrar {
	text-align:right;
}

.mmovil .icon-cerrar img {
	margin:10px;
	
	width:30px;
	height:auto;
	
	cursor:pointer;
}

.mmovil .icon-cerrar img:hover {
	background:url(../img/menu/mmovil.png);
}


@media only screen and (max-width:660px) {
	.logo {
		width:100%;
		height:80px;
		
		background:url(../img/top/surti-fiestas-logo.png) 50% 50% no-repeat #fff;
		-webkit-background-size: 150px auto;
		-moz-background-size: 150px auto;
		-o-background-size: 150px auto;
		background-size: 150px auto;
	}
	
	.datos {
		position:absolute; top:80px; right:0; left:0;
		height:40px;

		text-align:center;
	}
	
	.datos span:first-child { display:none; }
	
	.tels {
		padding:10px 0 0 0 !important;
	}
	
	.tels img { width:auto; height:15px; padding:0 0 0 0; }
	
	.menu {
		position:absolute; top:120px; right:0; left:0;
		height:40px;
	}
	
	.menu > ul {
		margin:10px 0 0 0;
		padding:0;
	
		float:right;
	}
	
	.menu > ul > li {
		margin:0 20px 0 0;
		padding:0;
	
		float:left;
		list-style:none;
	}
	
	.menu > ul > li:last-child { margin:0 0 0 0; }
	
	.space { height:160px; }
	
	.sombra { top:161px !important; }
}

.sombra {
	position:fixed; top:121px;
	margin:auto;
	padding:0;

	width:100%;
	height:24px;
}

.sombraa {
	margin:auto;
	padding:0;

	width:100%;
	height:24px;
}

.sombra img, .sombraa img {
	display:block;

	width:100%;
	height:24px;
}

.eslogan {
	padding:30px 0 50px 0;
	
	font-family: 'Dancing Script', cursive;
	font-size:150%;
	line-height:100%;
	font-weight:700;
	color:#9ba44e;
	text-align:center;
	
	background:url(../img/layout/eslogan-fondo.png) 50% 44% no-repeat;
}

/* inicio */

.bienvenidos {
	margin:auto;
	width:90%; max-width:1200px;
}

.productos-inicio {
	margin:40px 0;
	padding:40px 0;
	width:100%;
	
	text-align:center;
	
	background:url(../img/inicio/fondo.png);
}

.productos-servicios {
	margin:0;
	padding:0;
	width:100%;
	
	text-align:center;
}

.productos-inicio > ul, .productos-servicios > ul {
	margin:auto;
	padding:0;
	
	width:90%; max-width:1200px;
}

.productos-inicio > ul > li, .productos-servicios > ul > li {
	margin:0 4% 30px 0;
	padding:0;
	
	float:left;
	list-style:none;
}

@media only screen and (min-width:400px) and (max-width:767px) {
	.productos-inicio > ul > li, .productos-servicios > ul > li { width:48%; }
	.productos-inicio > ul > li:nth-child(2n+0), .productos-servicios > ul > li:nth-child(2n+0) { margin:0 0 30px 0; }
	.productos-inicio > ul > li:nth-child(2n+1), .productos-servicios > ul > li:nth-child(2n+1) { clear:both; }
}

@media only screen and (min-width:768px) {
	.productos-inicio > ul > li, .productos-servicios > ul > li { width:22%; }
	.productos-inicio > ul > li:nth-child(4n+0), .productos-servicios > ul > li:nth-child(4n+0) { margin:0 0 30px 0; }
	.productos-inicio > ul > li:nth-child(4n+1), .productos-servicios > ul > li:nth-child(4n+1) { clear:both; }
}

.productos-inicio img, .productos-servicios img {
	display:block;
	margin:0;
	padding:0 0 21px 0;
	
	width:100%;
	height:auto;
	
	background:url(../img/top/sombra.png) 100% 100% no-repeat;
	-webkit-background-size: 100% 20px;
	-moz-background-size: 100% 20px;
	-o-background-size: 100% 20px;
	background-size: 100% 20px;
}

.productos-inicio a, .productos-servicios a {
	display:block;
}

.productos-inicio a:hover, .productos-servicios a:hover {
	padding:20px;
	border-radius:20px;
	box-shadow:0 0 4px #9ba44e;
	background:url(../img/inicio/fondo.png);
}

.secciones-inicio {
	margin:auto;
	width:90%; max-width:1200px;
}

.secciones-inicio > ul {
	margin:0;
	padding:0;
}

.secciones-inicio > ul > li {
	padding:0;
	
	float:left;
	list-style:none;
}

@media only screen and (max-width:767px) {
	.secciones-inicio > ul > li { width:100%; margin:0 0 30px 0; }
	.secciones-inicio > ul > li:nth-child(2n+0) { margin:0 0 0 0; }
	.secciones-inicio > ul > li:nth-child(2n+1) { clear:both; }
	
	.secciones-inicio a {
		display:block;
		margin:0;
		padding:0 0 0 80px;
	}
	
	.secciones-nosotros { background:url(../img/inicio/nosotros.png) 0 0 no-repeat; }
	.secciones-contacto { background:url(../img/inicio/contacto.png) 0 0 no-repeat; }
	
	.secciones-nosotros, .secciones-contacto {
		-webkit-background-size: 100% 20px;
		-moz-background-size: 100% 20px;
		-o-background-size: 100% 20px;
		background-size: 70px auto;
	}
}

@media only screen and (min-width:768px) {
	.secciones-inicio > ul > li { width:45%; margin:0 10% 0 0; }
	.secciones-inicio > ul > li:nth-child(2n+0) { margin:0 0 0 0; }
	.secciones-inicio > ul > li:nth-child(2n+1) { clear:both; }
	
	.secciones-inicio a {
		display:block;
		margin:0;
		padding:0 0 0 170px;
	}
	
	.secciones-nosotros { background:url(../img/inicio/nosotros.png) 0 0 no-repeat; }
	.secciones-contacto { background:url(../img/inicio/contacto.png) 0 0 no-repeat; }
}

.base {
	margin:40px 0;
	padding:60px 0 0 0;
	
	text-align:center;
	
	background:url(../img/base/separador.png) 50% 0 no-repeat;
}

.base img { display:block; margin:auto; padding:0 0 20px 0; }

/* contenidos */

.contenidos, .contenidos-triple {
	margin:auto;
	padding:0;
	
	width:90%; max-width:1200px;
}

.contenidos img, .contenidos-triple img {
	display:block;
	margin:0 0 30px 0;
	
	width:100%;
	height:auto;
	
	border-radius:14px;
	box-shadow:0 0 6px #81893b;
}

.contenidos > ul, .contenidos-triple > ul {
	margin:0;
	padding:0;
}

.contenidos > ul > li, .contenidos-triple > ul > li {
	padding:0;
	
	float:left;
	list-style:none;
}

@media only screen and (max-width:767px) {
	.contenidos > ul > li, .contenidos-triple > ul > li { width:100%; margin:0 0 30px 0; }
	.contenidos > ul > li:nth-child(2n+0), .contenidos-triple > ul > li:nth-child(3n+0) { margin:0 0 30px 0; }
	.contenidos > ul > li:nth-child(2n+1), .contenidos-triple > ul > li:nth-child(3n+1) { clear:both; }
}

@media only screen and (min-width:768px) {
	.contenidos > ul > li { width:48%; margin:0 4% 30px 0; }
	.contenidos > ul > li:nth-child(2n+0) { margin:0 0 30px 0; }
	.contenidos > ul > li:nth-child(2n+1) { clear:both; }
	
	.contenidos-triple > ul > li { width:30.66666666666667%; margin:0 4% 30px 0; }
	.contenidos-triple > ul > li:nth-child(3n+0) { margin:0 0 30px 0; }
	.contenidos-triple > ul > li:nth-child(3n+1) { clear:both; }
}

#map {
	margin:auto;
	padding:0;
	
	width:900%; max-width:1200px;
	height:400px;
	
	border-radius:14px;
	box-shadow:0 0 6px #81893b;
}

/* galeria */

.galeria {
	margin:auto;
	padding:0;
	
	width:90%; max-width:1200px;
}

.galeria > ul {
	margin:auto;
	padding:0;
	
	width:100%;
}

.galeria > ul > li {
	margin:0 4% 30px 0;
	padding:0;
	
	float:left;
	list-style:none;
}

@media only screen and (max-width:767px) {
	.galeria > ul > li { width:48%; }
	.galeria > ul > li:nth-child(2n+0) { margin:0 0 30px 0; }
	.galeria > ul > li:nth-child(2n+1) { clear:both; }
}

@media only screen and (min-width:768px) {
	.galeria > ul > li { width:22%; }
	.galeria > ul > li:nth-child(4n+0) { margin:0 0 30px 0; }
	.galeria > ul > li:nth-child(4n+1) { clear:both; }
}

.galeria img {
	display:block;
	margin:0;
	padding:0;
	
	width:100%;
	height:auto;
}

.galeria a {
	display:block;
	box-shadow:0 0 4px #9ba44e;
}

.galeria a:hover {
	padding:20px;
	box-shadow:0 0 4px #9ba44e;
}

@media only screen and (min-width:768px) and (max-width:1023px) {
}