/* CSS Document */
@import url(http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300,700);



/* ---------------------- CUERPO - INICIO -----------------------*/
#cuerpo-top {width:920px;height:120px;margin:auto;}
.cuerpo-top-box1 {width:340px;height:120px;float:left;}
.cuerpo-top-box2 {width:580px;height:120px;float:left;}

#cuerpo-linea{width:920px; height:1px; margin:auto; background:#FFF}
#cuerpo-slide{width:1033px; height:290px; margin:auto}

#cuerpo{
	width:920px;
	margin:auto;
	overflow:hidden;
}
.cuerpo-a{
	width:660px;	
   	padding-bottom: 10000px;
	margin:0px 0px -10000px 10px;
	background:#FFF;		
	float:left;

}
.cuerpo-b{
	width:220px;
	padding-bottom: 10000px;
	margin:10px 0px -10000px 20px;			
	float:left;
}


#cuerpo-base{
	width:920px;
	height:auto;
	margin: auto;
}

.base-a{
	width:670px;
	height:10px;	
	background:url(../img/base-bg-esquina.png) repeat;
	margin: 0px;
	float:left;
	}

.base-b{
	width:670px;
	height:80px;	
	background:url(../img/base-bg.png) repeat;
	margin: 0px;
	float:left;
	}


.box-220{
	width:200px;
	height:auto;
	margin: 0px 0px 10px 0px;
}

.box-220{
	width:220px;
	height:auto;
	margin: 0px 0px 10px 0px;
}

.box-620{
	width:620px;
	height:auto;
	margin:auto;
}
.grs{background:#edeff4;}
/* ---------------------- CUERPO - FIN -----------------------*/


.logo-top {
	display: block;
	width:340px;
	height:120px;
	background: url("../img/logo-cotillon-makukos-25.png") no-repeat;
	text-indent:-9999px;
	}
	a.logo-top:link, a.logo-top:visited, a.logo-top:active {
	background: url("../img/logo-cotillon-makukos-25.png") no-repeat;
	}
	a.logo-top:hover {
	background-position:-340px;
}




/* ---------------------- SOCIAL TOP - INICIO -----------------------*/
.btn-instagram {display:block; text-indent:-9000%; float:left; margin:60px 0px 0px 410px;}
.btn-instagram {width:50px; height:50px; background:url(../img/icono-in.png);}
.btn-instagram:hover {background-position:-50px;}

.btn-twitter {display:block; text-indent:-9000%; float:left; margin:60px 0px 0px 10px;}
.btn-twitter {width:50px; height:50px; background:url(../img/icono-tw.png);}
.btn-twitter:hover {background-position:-50px;}

.btn-facebook {display:block; text-indent:-9000%; float:left; margin:60px 0px 0px 10px;}
.btn-facebook {width:50px; height:50px; background:url(../img/icono-fb.png);}
.btn-facebook:hover {background-position:-50px;}


/* ---------------------- SOCIAL TOP - FIN -----------------------*/


/* ---------------------- MENU - INICIO -----------------------*/
#menu{width:912px;height:45px; margin:auto;background:url(../img/menu-bg-2.png) repeat; padding-left:8px}


.borra-espacio{clear:both;}
.sf-menu{
	font-family: 'Open Sans Condensed', sans-serif;
	font-size: 19px;
	margin:0px;
	padding:0px;
}
.sf-menu, .sf-menu * {
	margin: 0;
	padding: 0;
	height:45px;
	list-style: none;
	
}
.sf-menu li {
	position: relative;
	
}
.sf-menu ul {
	position: absolute;
	display: none;
	top: 100%;
	left: 0;
	z-index: 2099;

}
.sf-menu > li {
	float: left;
}
.sf-menu li:hover > ul,
.sf-menu li.sfHover > ul {
	display: block;
}

.sf-menu a {
	display: block;
	position: relative;
}
.sf-menu ul ul {
	top: 0;
	left: 100%;
}


/*** DEMO SKIN ***/
.sf-menu {
	float: left;

}
.sf-menu ul {
	min-width: 12em; /* allow long menu items to determine submenu width */
	*width: 12em; /* no auto sub width for IE7, see white-space comment below */
}
.sf-menu a {
	padding: .75em 1em;
	text-decoration: none;
	zoom: 1; /* IE7 */
}
.sf-menu a {
	color:#FFF;
}
.sf-menu li {
	white-space: nowrap; /* no need for Supersubs plugin */
	*white-space: normal; /* ...unless you support IE7 (let it wrap) */
	-webkit-transition: background .2s;
	transition: background .2s;
}
.sf-menu ul li {
	background:url(../img/menu-bg-2.png) repeat;
}
.sf-menu ul ul li {
	background:url(../img/menu-bg-2.png) repeat;
}
.sf-menu li:hover,
.sf-menu li.sfHover {
background:#0CC;
	/* only transition out, not in */
	-webkit-transition: none;
	transition: none;
}

/*** arrows (for all except IE7) **/
.sf-arrows .sf-with-ul {
	 padding-right: 2.5em;
	*padding-right: 1em; /* no CSS arrows for IE7 (lack pseudo-elements) */
}
/* styling for both css and generated arrows */
.sf-arrows .sf-with-ul:after {
	content: '';
	position: absolute;
	top: 50%;
	right: 1em;
	margin-top: -3px;
	height: 0;
	width: 0;
}
.sf-arrows > li > .sf-with-ul:focus:after,
.sf-arrows > li:hover > .sf-with-ul:after,
/* styling for right-facing arrows */
.sf-arrows ul .sf-with-ul:after {
	margin-top: -5px;
	margin-right: -3px;
	border-color: transparent;
}
.sf-arrows ul li > .sf-with-ul:focus:after,
.sf-arrows ul li:hover > .sf-with-ul:after,
.sf-arrows ul .sfHover > .sf-with-ul:after {
	border-left-color: white;
}
/* ---------------------- MENU - FIN -----------------------*/



/* ---------------------- BASE - INICIO -----------------------*/
.btn-cotillon {display:block; text-indent:-9000%; float:left; margin:10px 0px 0px 10px;}
.btn-cotillon {width:79px; height:20px; background:url(../img/logo-base.png);}
.btn-cotillon:hover {background-position:-79px;}

.base-txt{
	width: 910px;
	height: auto;
	margin: 0px 0px 0px 10px;
	color: #FFF;
	font-size: 11px;
	line-height: 16px;
}
/* ---------------------- BASE - FIN -----------------------*/


/* ---------------------- ANIMACION BNR - INICIO -----------------------*/
a.bnr {width:220px;	height:110px;display:block;}
.bnr img{transition: margin 0.3s ease-out 0s; margin:0px 0px 0px 0px ;}
.bnr img:hover{margin:0px 0px 0px -15px;}
/* ---------------------- ANIMACION FOTOS - FIN -----------------------*/


/* ---------------------- TEXTOS - INICIO  -----------------------*/
p{text-align:justify; margin:0px;}
h1 {
	background: url(../img/h1-bg.png) no-repeat;
	width: 670px;
	height: 50px;
	color: #FFF;
	font-family: 'Open Sans Condensed', sans-serif;
	font-size: 32px;
	margin: 10px 0px 0px -10px;
	padding: 7px 0px 0px 20px;
	font-weight: 300;
}

h2 {
	background: url(../img/h2-bg.png) no-repeat;
	width: 670px;
	height: 50px;
	color: #FFF;
	font-family: 'Open Sans Condensed', sans-serif;
	font-size: 32px;
	margin: 10px 0px 0px -10px;
	padding: 7px 0px 0px 20px;
	font-weight: 300;
}

h3 {
	font-family: 'Open Sans Condensed', sans-serif;
	font-size: 32px;
	margin: 30px 0px 10px -0px;
	font-weight: 300;
}
/* ---------------------- TEXTOS - FIN  -----------------------*/

.social-box{
	width:216px;
	height:40px;
	margin: -57px 0px 0px 447px;
	
}

.social-txt{
	width:90px;
	height:30px;
	padding:10px 0px 0px 0px;
	font-family: 'Open Sans Condensed', sans-serif;
	font-size: 18px;
	font-weight: 300;
	float:left;
	color:#FFF;

}

.social-icn{
	width:116px;
	height:36px;
	padding:4px 0px 0px 0px;
	float:left;
}



.social-whast {display:block; text-indent:-9000%; float:left; margin:0px 0px 0px 0px;}
.social-whast {width:32px; height:32px; background:url(../img/social-whast.png);}
.social-whast:hover {background-position:32px;}

.social-facebook {display:block; text-indent:-9000%; float:left; margin:0px 0px 0px 10px;}
.social-facebook {width:32px; height:32px; background:url(../img/social-facebook.png);}
.social-facebook:hover {background-position:32px;}

.social-twitter {display:block; text-indent:-9000%; float:left; margin:0px 0px 0px 10px;}
.social-twitter {width:32px; height:32px; background:url(../img/social-twitter.png);}
.social-twitter:hover {background-position:32px;}

.social-instagram {display:block; text-indent:-9000%; float:left; margin:0px 0px 0px 10px;}
.social-instagram {width:32px; height:32px; background:url(../img/social-instagram.png);}
.social-instagram:hover {background-position:32px;}



/* ---------------------- VOLUMEN VISUAL - INICIO  -----------------------*/

.btn-volumen-visual {display:block; text-indent:-9000%; float:left; margin:-25px 0px 0px 578px;}
.btn-volumen-visual {width:82px; height:39px; background:url(../img/volumen-visual.png);}
.btn-volumen-visual:hover {background-position:-82px;}
/* ---------------------- VOLUMEN VISUAL - FIN  -----------------------*/



/* ---------------------- NOTICIAS - INICIO -----------------------*/
.noticia{
	width:620px;
	height:auto;
	margin:auto;
	margin-top:35px;
}
.noticia-cuerpo-a{
	width:225px;
	min-height:100px;
	float:left;
}
.noticia-cuerpo-b{
	width:395px;
	height:auto;
	float:left;
}
.noticia-mas{
	widht:620px;
	height:20px;
	display:block;
}
.noticia-mas-btn {
	width: 620px;
	height: 18px;
	float:left;
	}
	a.noticia-mas-btn:link, a.noticia-mas-btn:visited, a.noticia-mas-btn:active {
	text-align:right;
	color:#0077a3;
	text-decoration: none;
	transition: margin 0.3s ease-out 0s; margin:0px 0px 0px 0px ;
	}
	a.noticia-mas-btn:hover {
	margin:0px 0px 0px -15px;
	}
.noticia-linea{
	width:620px;
	height:1px;
	background:url(../img/noticia-linea.png) repeat-x;
	margin:0px 0px 15px 0px;
	float:left;
}

.noticia-foto{
	width:200px;
	background: #fff;
	border: solid 1px #258ad0;
	padding: 4px;	
	
}

.noticia-titulo{
	font-family: 'Open Sans Condensed', sans-serif;
	font-size: 28px;
	color: #258ad0;
	margin: 0px 0px 20px 0px;
	line-height: 35px;
}

.noticia-bajada{
	font-size:13px;
	color:#666666;
	text-align:justify;
	line-height: 17px;	
}


.noticia-img {
	width: 200px;
	height:151px;
}

.gallery {list-style:none; margin:0px 0px 0px 10px; padding:0px; }
.gallery li {
    margin: 3px;
    padding: 0;
    float: left;
    position: relative;
    width: 207px;
    height: auto;
    padding-right: 3px;
    padding-bottom: 3px;
}
.gallery img {
    background: #fff;
    border: solid 1px #cbcaca;
    padding: 2px;
    margin-right: auto;
    margin-left: auto;
}
/* ---------------------- NOTICIAS - FIN -----------------------*/


/* ---------------------- PRODUCTOS - INICIO -----------------------*/
.producto{
	width:194px;
	height:225px;
	margin:0px 0px 20px 19px;
	background:#efe1a7;
	float:left;
}



.producto-foto{
	width:174px;
	height:125px;
	background: #fff;
	border: solid 1px #d8b423;
	padding: 4px;	
	margin:5px 0px 0px 5px;
}
.producto-cod{
	width:184px;
	margin:auto;
	font-size:9px;
	text-transform:uppercase;
	color: #333;	

}

.producto-txt{
	width:184px;
	margin:auto;
	font-size:12px;
	color: #333;	
}


.producto-consulta a, .producto-mas a{
	font-size:12px;
	color: #C00;
	text-decoration:none;
}

.producto-consulta a:hover, .producto-mas a:hover{
	color: #6a025a;
	font-size:11px;
	font-weight: bold;
}


.producto-consulta{
	width:auto;
	height:25px;
	margin:auto;
	float:left;
	padding: 3px 0px 0px 50px;
}


.producto-mas{
	width:auto;
	height:25px;
	margin:auto;
	float:left;
	padding: 3px 0px 0px 15px;
}

.producto-form {
	margin: 0px 0px 0px 30px;
}

/* ---------------------- PRODUCTOS - INICIO -----------------------*/

/* ----------------------FORMULARIO - INICIO */
.form {width:450px;}

input, textarea {
	width:450px;	
	padding: 7px;
	background:#f1f1f1;	
	border: solid 1px #e1e0e0;
	outline: 0;
	}

input:hover, textarea:hover,
input:focus, textarea:focus {
	background:#a9a9a9;
	color:#5a5a5a;
	font-size: 14px;
	
}


textarea {
	width:450px;
	max-width: 450px;
	height: 100px;
	max-height:100px;
	line-height: 150%;
}

form.form .ultimo{
    margin-bottom: 0;
    position: relative
}

form.form button {
	width: auto;
	margin:10px 0px 0px 396px;
	padding: 9px 15px;
	background: #555;
	border: 0;
	font-size: 14px;
	color: #FFFFFF;
	}

form.form button:hover{
	background:#c20201;
}
/* AJAX Gif y mensajes de exito o fracaso */
.hide{
    display: none;
}
.ajaxgif{
    position: absolute;
    right: 150px;
    top: 5px;
}
.msg{
    color:#ffffff;
    height: 34px;
	margin-top:12px;
    line-height: 32px;
    padding: 0 0px;
	text-align:center;
    position: absolute;
    right: -135px;
    min-width: 135px;
}
.msg_ok{
    background: #589D05;
}
.msg_error{
    background: red;
}
/* ----------------------FORMULARIO - FIN */

/* ----------------------MAPA GOOGLE - INICIO */
#mapa-google{width:620px; height:450px; }
.mapa-google{
	width:620px;
	height:300px;
	margin:20px 0px 0px 0px;
	float:left;	
	border: solid 1px #b5b8bb;
}
#mapa-div{width:380px;}
.mapa-txt-title{ color:#2d548b; font-size:23px;}
.mapa-txt{ color:#333; font-size:12px;}
/* ----------------------MAPA GOOGLE - FIN */