@import url(http://fonts.googleapis.com/css?family=Raleway:400,300,700);
BODY{margin:0; background:url(../img/hdr2Bkgcont.jpg) repeat-x top #fff; padding:0}
A IMG {border:none; cursor:pointer}

/*	---	HEADER	---	*/
#HeaderContainer {background:url(../img/hdrBkg.jpg) no-repeat top; position:relative; margin:0 auto; height:543px; width:100%}
#Header2Container {background:url(../img/hdr2Bkg.jpg) no-repeat top; position:relative; margin:0 auto; height:383px; width:100%}
#HeaderContent {width:950px; margin:0 auto; position:relative}
#HeaderContent A IMG {float:left; margin:40px auto 26px auto}

/*	---	MENU ---   */
#HeaderContent UL {list-style:none; float:right; margin:50px auto 0px}
#HeaderContent UL LI {font-family:Tahoma, Arial; font-size:18px; color:#FFFFFF; float:left; padding:5px 15px;}
#HeaderContent UL LI A{text-decoration:none; color:#FFFFFF}
#homeBtn {display:block; width:36px; height:36px; background:url(../img/btnHome.png) no-repeat; cursor:pointer; padding:0px !important; margin-right:10px}
#homeBtn:HOVER{background:url(../img/btnHomeOvr.png) no-repeat; cursor:pointer}

/*	--- MAIN ---   */
#main{width:900px; height:100%; padding:10px 25px; position:relative; margin:0 auto; overflow:hidden}
#main #share {width: 900px; padding:5px 0px 10px; width:auto; height:auto; overflow:hidden}
#share #shareLeft {float:left; width:auto; height:auto; overflow:hidden}
#share #shareLeft SPAN { font-size: 11px; font-weight: bold; font-family: 'arial',verdana,sans-serif !important; color:#FFF}
#share #shareRight {float:right; width:auto; height:auto; overflow:hidden}
#main H2 {font: 28px  Georgia, "Times New Roman", Times, serif; font-weight: normal; color:#4e4a38; padding:15px 0; margin:0; border-bottom:1px solid #b2b2b2}
#main H3 {font:normal 17px Tahoma, Geneva, sans-serif; color:#4e4a38; padding:15px 0; margin:0; border-bottom:1px solid #b2b2b2}
#main P {color:#333333; line-height:20px;font: 14px Georgia, "Times New Roman", Times, serif;font-weight: normal;font-style: italic;}
#main SPAN {font: 16px  Georgia, "Times New Roman", Times, serif; font-weight: normal; color:#4e4a38; font-style:italic;}
#titulo{font:normal 24px Georgia, "Times New Roman", Times, serif; color:#990000; padding:15px 0; margin:0; width:100%}
#main UL {width:auto}
#main UL LI {font-family:Tahoma, Geneva, sans-serif; font-size:14px; color:#333333; line-height:20px}
#main HR{ height:1px; color:#b2b2b2; margin-top:20px}
.col{width:280px; margin-top:30px; float:left; padding-right:30px}
.col H3 {font:normal 16px Tahoma, Geneva, sans-serif; color:#990000; padding:15px 0; margin:0; border-bottom:1px solid #990000}
.col P{font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#333333}
.col A, #ProductConteiner UL LI SPAN A {font-family:Tahoma, Geneva, sans-serif; color:#CC3300; font-size:12px; text-decoration:none; font-weight:bold; font-style:normal}
.col A:HOVER, #ProductConteiner UL LI SPAN A:HOVER{text-decoration:underline}
#BnnrFooter{width:900px; height:108px; margin:40px auto 0px; float:left}
#colRight{float:left; width:470px; padding:0px 5px; height:auto; margin-left:10px}
#colLeft{float:right; width:470px; padding:0px 5px; height:auto; margin-left:10px}
.col700{width:900px; float:left; margin-right:20px}
.col500{width:450px; float:left; margin-right:20px}
#colRightBNNR{float:right; width:200px; height:auto; overflow:hidden; margin-top:20px}
#colRightBNNR IMG {cursor:pointer; margin-bottom:20px;}
#ProductConteiner {width:700px; height:auto; overflow:hidden}
#ProductConteiner UL {list-style:none; margin:0px; padding:0px;}
#ProductConteiner UL LI {float:left; clear:right; background: url(../productos/img/cat_bg.gif) repeat; width:190px; padding:10px; margin-left:20px; margin-bottom:20PX}
#ProductConteiner UL LI IMG {border:1px solid #999}
#ProductConteiner UL LI H3 {font-size:16px !important; color:#900; border-bottom:1px solid #900}


/*	---  MODAL VIDEO  ---   */

#GalleryBKG {z-index:99999; width:100%; height:100%; position:fixed; overflow:hidden; background: url(../img/modalBKG.png); display:none}
#GalleryBKG #modal {width:560px; height:425px; position:relative; margin:13% auto}
#GalleryBKG #modal IMG {position:absolute; top:0px; right:0px; cursor:pointer}
#ContainerVideo {width:500px; height:375px; position:absolute; bottom:0px; left:0px; border:#CCC 10px solid}




/*------------------------------------ FORMULARIO DE CONTACTO ------------------------------------------------*/
#formContenedor{position:relative; text-align:left; width:410px; float:right;}
.input{width:400px; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:13px}
textarea{width:400px; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:13px}
#formContenedor label {width:410px; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; font-size:14px; text-align:left; float:left}
.inputError{border:1px solid #C30; background: #FFD5D6; color: #333; float:left; width:400px; height:30px; vertical-align:middle}
/* Capas de transparencia y mensajes de confirmacion */
#transparencia{background:url(../img/mainBkg.png); z-index:100; position:absolute; width:410px; height:700px; display:none; top:0px; left:0px}
#transparenciaHome{background:url(../img/mainBkg.png); z-index:100; position:absolute; width:310px; height:300px; display:none; top:0px; left:0px}
#transparenciaMensaje{position:relative; width:200px; height:auto; margin:20% auto; text-align:center; overflow:hidden}
#transparenciaMensajeHome{position:relative; width:auto; height:auto; text-align:center; overflow:hidden; top:10px; left:50px;}
#botonEnviar{width:100px; height:36px; border:none; background:url(../img/send_btn.png) no-repeat; margin-top:20px}
#botonEnviar:hover {background:url(../img/send_btn_hv.png) no-repeat}

/*------------------------------------------------------------------------------------------------------------*/



/*	--- FOOTER ---	*/
#Footer {background:url(../img/ftrBkgcont.jpg) repeat-x; width:100%; height:220px; padding:0px; float:left; clear:both}
#FooterContainer {background:url(../img/ftrBkg.jpg) no-repeat; width:950px; margin:0px auto; height:220px; position:relative}
#TXTFtr {width:auto; float:left; margin:90px auto 0 -40px}
#TXTFtr UL {list-style:none; margin:0px 0px auto}
#TXTFtr UL LI {font-family:Tahoma, Geneva, sans-serif; font-size:14px; float:left; padding:5px 15px; color:#fff; border-right:1px solid #fff}
#TXTFtr UL LI A {text-decoration:none; color:#fff}
#TXTFtr UL LI A:HOVER{text-decoration:none; color:#ccc}
#TXTFtr IMG {margin:35px 10px 0px 40px !important; float:left !important; clear:left}
#TXTFtr P {margin-top: 35px; font-family:Tahoma, Geneva, sans-serif; font-size:11px; color:#fff; float:left}
#TXTFtr P SPAN {color:#999999}
#TXTFtr P SPAN A {text-decoration:none; color:#993300}
#TXTFtr P SPAN A:HOVER{text-decoration:underline; color:#CC3300}
#FooterContainer IMG {float:right; margin-top:95px}



nav{
	float: right;
margin: 50px auto 0px;
}
nav a {
	position: relative;
	display: inline-block;
	margin: 15px 15px;
	outline: none;
	color: #fff;
	text-decoration: none;
	letter-spacing: 1px;
	font-weight: 400;
	text-shadow: 0 0 1px rgba(255,255,255,0.3);
	font-size: 1.3em;
	font-family: 'Raleway', sans-serif;
}

nav a:hover,
nav a:focus {
	outline: none;
}

/* Effect 5: same word slide in */
.cl-effect-5 a {
	overflow: hidden;
	padding: 0 4px;
	height: 1em;
}

.cl-effect-5 a span {
	position: relative;
	display: inline-block;
	-webkit-transition: -webkit-transform 0.3s;
	-moz-transition: -moz-transform 0.3s;
	transition: transform 0.3s;
}

.cl-effect-5 a span::before {
	position: absolute;
	top: 100%;
	content: attr(data-hover);
	-webkit-transform: translate3d(0,0,0);
	-moz-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
}

.cl-effect-5 a:hover span,
.cl-effect-5 a:focus span {
	-webkit-transform: translateY(-100%);
	-moz-transform: translateY(-100%);
	transform: translateY(-100%);
}