/*
	#9B253F - Granate
        #561C5B - Lila
*/

/******* GENERAL CSS *******/
html {
        height: 100%; 
        margin-bottom: 1px;
        overflow-y: scroll;
}

body {
	font-family: Arial, Tahoma, Verdana;
  	color:#666;
 /*	background: #fff url("../imagenes/layout/fondos.png") bottom left repeat-x; */
  	font-size:13px;
        min-height: 100%;
        top: 0;
}

div.size {
	width: 900px;
	margin: 0 auto;
	position:relative;
        text-align: center;
}

.clear {
	clear:both;
}

.muy-muy-grande {
        font-size: 25px;
}

.muy-grande {
        font-size: 22px;
}

.grande {
        font-size: 20px;
}

.medio {
        font-size: 18px;
}

.pequeño {
        font-size: 14px;
}

.muy-pequeño {
        font-size: 11px;
}

.gris-oscuro {
        color: #333;
}

.granate {
        color: #9B253F !important;
}

.lila {
        color: #561C5B !important;
}

.bold {
        font-weight: bold;
}

h1, h2, h3 {
        margin-bottom: 20px;
}

.button {
        padding: 5px 10px;
        border-radius: 6px;
        background: #561C5B;
        color: #fff;
        text-decoration: none;
        border: 2px solid #561C5B;;
        cursor: pointer;
}

.button:hover {
        background: #fff;
        border: 2px solid #561C5B;
        color: #561C5B;
}

input.button {
        background: none repeat scroll 0 0 #561C5B;
        border: 2px solid #561C5B;
        border-radius: 6px 6px 6px 6px;
        color: #FFFFFF;
        cursor: pointer;
        padding: 2.5px 5px;
        text-decoration: none;
}

input.button:hover {
        background: #fff;
        border: 2px solid #561C5B;
        color: #561C5B;
}

.button-inverso {
        padding: 5px 10px;
        border-radius: 6px;
        background: #fff;
        color: #561C5B;
        text-decoration: none;
        border: 2px solid #561C5B;;
        cursor: pointer;
}

.button-inverso:hover {
        background: #561C5B;
        border: 2px solid #561C5B;
        color: #fff;
}

.button-plano {
        padding: 2px 5px;
        border-radius: 6px;
        background: #561C5B;
        color: #fff;
        text-decoration: none;
        border: 1px solid #561C5B;;
        cursor: pointer;
        font-size: 11px;
}

.button-plano:hover {
        background: #fff;
        border: 1px solid #561C5B;
        color: #561C5B;
}

.left {
        float: left;
}

.right {
        float: right;
}

.clicable {
        cursor: pointer;
}

.izquierda {
        text-align: left;
}

.derecha {
        text-align: right;
}

.border-granate {
        border-bottom: 1px solid #9B253F;
}

.border-lila {
        border-bottom: 1px solid #561C5B;
}

.bg-lila {
        background: #561C5B;
}

div.barra-subheader {
        float: left;
        width: 100%;
        height: 14px;
        background: #561C5B;
}

.icono-cat-current {
        background: url("../imagenes/layout/boton_menu_on.jpg") no-repeat top right;
}

.last-right {
        margin-right: 0 !important;
}

@font-face {
 font-family: 'Lobster';
 src: url('../fonts/lobster_14.eot');
 src: url('../fonts/lobster_14?#iefix') format('embedded-opentype'), url('../fonts/lobster_14.woff') format('woff'), url('../fonts/lobster_14.ttf') format('truetype'), url('../fonts/lobster_14.svg#Lobster') format('svg');
 font-weight: normal;
 font-style: normal;
}

.lobster {
        font-family: 'Lobster';
}

a.recuperar-mi-password {
    color: #666666;
    text-decoration: none;
}

a.recuperar-mi-password:hover {
    text-decoration: underline;
}


/*********** SLIDER ********** */
div#slider {
        float: left;
        width: 100%;
}

div#slider img {
        width: 100%;
        max-width: 900px;
}

/******** TOP LINE ********/
div#main-header {
        float: left;
        width: 100%;
        position: fixed;
}

div.top-line {
        float: left;
        position: relative;
        padding: 0;
        width: 100%;
        background: #561C5B repeat-x;
        height: 45px;
        margin-bottom: 10px;
        z-index: 10;
}

div.top-line .item-top {
        padding: 0 30px;
}

form.search {
        position: relative;
        float: left;
}

input.top-search {
        position: relative;
        float: left;
        top: 10px;
        width: 150px;
        border: 1px solid #ccc;
        border-radius: 8px;
        padding: 4px;
        color: #666;
     /*   background: #fff url("../imagenes/layout/lupa.png") right no-repeat; */
        z-index: 10;
}

img.lupa {
        position: relative;
        float: right;
        margin: 2px 0 0 -15px;
        z-index: 50;
}

.account-header {
        float: right;
        width: 20%;
        padding: 0;
        border-left: 1px solid #fff;
        border-right: 1px solid #fff;
        text-align: center;
        margin: 15px 0 0 0;
}

.account-header table {
        width: 100%;
     /*   height: 45px; */
}

.account-header table tr td {
        color: #fff;
        vertical-align: top;
        height: 30px;
}

table.date-de-alta tr td {
        color: #fff;
        vertical-align: top;
        height: 30px;
}

div.desconectar {
        float: right;
        width: 10%;
        padding: 0;
        border-left: 1px solid #fff;
        text-align: center;
}

div.desconectar table {
        width: 100%;
        height: 45px;
}

div.desconectar table tr td {
        color: #fff;
        vertical-align: middle;
}

a.logout-link {
        text-decoration: none;
        color: #fff;
}

a.logout-link:hover {
        text-decoration: underline;
}

a.account-links {
        color: #fff;
        text-decoration: none;
}

a.account-links:hover {
        text-decoration: underline;
}

/*********** HEADER ********** */

div#header {
	position: relative;
        margin: 0 0 10px 0;
}

div.cuadrado-header {
        float: left;
}

.cuadrado-margin-left {
        margin-left: 25px;
}

div#header div.account-content {
        float: right;
        width: 26.5%;
     /*   height: 72px; */
        padding: 0;
        border-left: 1px solid #561C5B;
        border-right: 1px solid #561C5B; 
}

div.account-content table {
        width: 100%;
}

div.account-content table.tabla-form-login {
        width: 80%;
}

div.account-content table tr td {
        text-align: right;
        height: 30px;
}

div.account-content table tr td.left {
}

div.account-content span.olvido-password {
        float: left;
        margin: 10px 0 0 10px;
}

div.account-content span.olvido-password a {
        text-decoration: none;
        color: #666;
}

div.account-content span.olvido-password a:hover {
        text-decoration: underline;
}

table.menu-usuario {
    width: 90% !important;
    float: right;
}

table.menu-usuario tr td {
        vertical-align: bottom;
        padding: 0 10px 5px 10px;
        height: 20px !important;
        border-left: 1px solid #aaa;
}

table.menu-usuario tr td a {
        text-decoration: none;
        color: #666;
}

table.menu-usuario tr td a:hover {
        text-decoration: underline;
}

div.account-content form {
        float: left;
        margin-left: 10px;
}

div.account-content form input {
        background: #561C5B;
        color: #fff;
        border-radius: 6px;
        padding: 2px 2px;
        margin-right: 10px;
        margin-left: 10px;
}

div.barra-top-slider {
        float: left;
    /*    margin: 10px 0 0 0; */
        margin: 0;
        height: 20px;
        background: url("../imagenes/layout/head-slider-bg.png") repeat-x;
        width: 100%;
}

div.barra-bottom-slider {
        float: left;
        margin: 0;
        height: 20px;
        background: url("../imagenes/layout/bottom-slider-bg.png") repeat-x;
        width: 100%;
}

/*****************************/
/********* CONTENIDO *********/
/*****************************/

div#main-content {
        float: left;
        position: relative;
        width: 100%;
        height: 100%;
        background: url("../imagenes/layout/main-content-bg-jpg") repeat;
}

div#content {
        float: left;
        padding: 20px 0 0 0;
        width: 75%;
}

div#content p {
        margin-bottom: 20px;
}

div#content .seccion {
        float: left;
      /*  margin-bottom: 20px; */
}

div#content .seccion p {
        text-align: left;
}

.sin-menu {
        width: 100% !important;
}

.con-menu {
        width: 75.6%;
}

div#galeria-seccion {
        position: relative;
        float: left;
        width: 35%;
        margin-right: 20px;
}

div#galeria-seccion div.slide {

}

div#galeria-seccion div.slide img {
        width: 100%;
}

p.subtitulo-seccion {
        float: left;
        width: 100%;
        text-align: left;
        color: #666;
        padding-bottom: 5px;
        border-bottom: 1px solid #E2E2E2;
        margin-bottom: 0 !important;
}

/******* SECCION CONTACTO *******/
div.seccion-contacto {
        float: left;
        width: 100%;
        background: url("../imagenes/layout/contacto-bg.jpg") no-repeat bottom left;
        height: 489px;
}

div#formulario-contacto {
        width: 54%;
        float: right;
        padding-top: 30px;
        margin-bottom: 50px;
}

form#contacto dt {
        clear: both !important;
        text-align: left;
        margin-bottom: 3px;
}

form#contacto dt#submit-label {
        display: none;
}

form#contacto dd {
        clear: both !important;
        text-align: left;
}

form#contacto textarea {
        background: #561C5B;
        border-radius: 6px 6px 6px 6px;
        color: #FFFFFF;
        margin-bottom: 15px;
        padding: 7px;
        width: 93%;
        height: 200px;
}

div.home-registro {
        float: left;
        width: 100%;
        background: url("../imagenes/layout/registro-bg.jpg") no-repeat left;
        height: 450px;
}

/******* REGISTRATE ********/

div#form-registro-socios {
        width: 50%;
	margin: 0 auto;
	position:relative;
        text-align: center;
}

div#form-registro-socios dt {
       /* display: none;*/
       text-align: left;
       margin-bottom: 3px;
}

div#form-registro-socios dd#rel_empresa_id-element {
        text-align: left;
        margin: 10px 0 22px 0;
}

div#form-registro-socios dd#rel_empresa_id-element label {
        color: #561C5B;
        margin-right: 10px;
}

input#rel_empresa_id-distribuidor, input#rel_empresa_id-taller {
        margin-right: 3px;
}

input.roundedinput {
        color: #fff;
        background: #561C5B;
        padding: 7px;
        margin-bottom: 15px;
        border-radius: 6px;
        border: none;
        width: 200px;
}

select.roundedinput {
        float: left;
        color: #fff;
        background: #561C5B;
        padding: 7px;
        margin-bottom: 15px;
        border-radius: 6px;
        border: none;
        width: 213px;
}

input.politica {
        float: left;
        border: 1px solid #9B253F; 
        margin-right: 5px;
}

.registro-link-politica {
        float: left;
        color: #222;
}

.registro-link-politica a {
        color: #222;
}

.registro-link-politica a:hover {
        color: #561C5B;
}


/* ********* HOME *********** */
div#home {
        position: relative;
        width: 100%;
        padding-top: 10px;
}

.columna2-home {
	width: 48%;
	margin-right:2%;
}

.columna1-home {
	width: 100%;
    /*    padding: 10px;*/
}

a.titulo-home-link {
        color: #71b021;
        font-size: 18px;
        font-weight: bold;
        margin: 0 0 2px;
        text-align: left;
        text-decoration: none;
}

a:hover.titulo-home-link {
        text-decoration: underline;
}

.last-columna {
        margin: 0;
}

/********* BANNERS BOTTOM **********/

div#banners-bottom {
        position: relative;
        float: left;
        width: 100%;
        margin: 0 0 20px 0;
        padding: 0;
}

div.banner {
    position: relative;
        float: left;
        text-align: center;
        width: 286px;
        -moz-box-shadow: 0 0 5px #888;
        -webkit-box-shadow: 0 0 5px#888;
        box-shadow: 0 0 5px #888;
}

div.banner a {
    display: block;
    
}

div.banner img {
        position: relative;
        width: 96%;
        z-index: 7;
        margin: 5px;
}

div.banner p.titulo-banner {
        position: absolute;
        width: 261px;
        padding: 7px;
        text-align: center;
        color: #fff;
        font-size: 18px;
        font-weight: bold;
        background: url("../imagenes/layout/bg-banner.png") repeat;
        left: 5px;
        bottom: 5px;
        z-index: 100;
}

div.banner p.subtitulo-banner {
        position: absolute;
        width: 261px;
        padding: 7px;
        text-align: center;
        color: #fff;
        font-size: 15px;
        font-weight: bold;
        background: url("../imagenes/layout/bg-banner-over.png") repeat;
        left: 5px;
        bottom: 5px;
        z-index: 200;
}

/********* FOOTER **********/

div#footer {
        position: relative;
        float: left;
        width: 100%;
        margin: 0 0 0 0;
        padding: 15px 0;
        background: #561C5B;
}

div.menu-footer {
        text-align: center;
        width: 100%;
}

div.menu-footer > ul {
        list-style-type: none !important;
        margin: 0;
        padding: 0;
        text-align: center;
}

div.menu-footer > ul > li {
        display: inline-block;
}

div.menu-footer > ul > li > a {
        text-decoration: none;
        color: #fff;
        font-size: 13px;
        text-transform: uppercase;
        margin: 0 15px;
}

div.menu-footer > ul > li > a:hover {
        text-decoration: underline;
}

.blank-border-right {
        border-right: 1px solid #fff;
}

/***** COLUMNA IZQUIERDA ******/
div#left-column {
        float: left;
        width: 22%;
        margin-right: 20px;
 /*       border-right: 1px solid #333; */
        padding-top: 20px;
}

div#left-column div.box-content {
        float: left;
        width: 97%;
        margin-bottom: 20px;
}

div#left-column div.box-content h3 {
        color: #561C5B;
        border-bottom: 1px solid #561C5B;
        padding-bottom: 3px;
        text-align: right;
        margin-bottom: 1px;
    /*    height: 20px; */
}

div#left-column div.box-content h3 a {
        color: #561C5B;
      /*  font-weight: bold; */
        text-decoration: none;
}

div#left-column div.box-content h3 a:hover {
        font-weight: bold;
}

div#left-column div.box-content h3 img {
        margin-bottom: -4px;
}

/***** PAGINADOR ******/
div#paginador {
        float: left;
        margin-top: 40px;
        width: 100%;
        text-align: center;
        color: #fff;
}

div#paginador .disabled {
        color: #666;
}

div#paginador .current {
        color: #561C5B;
        font-weight: bold;
}

div#paginador a {
        color: #666;
        text-decoration: none;
}

div#paginador a:hover {
        text-decoration: underline;
}

div#paginador a.boton {
        border-radius: 5px;
        padding: 4px;
        border: 1px solid #561C5B;
}

div#paginador a.boton:hover {
        text-decoration: none !important;
        border: 2px solid #561C5B;
}

/****** FORMULARIO CONTACTO *******/
form#contacto input.contacto {
        height: 20px;
        width: 400px;
        padding: 2px 0;
        margin-bottom: 20px;
}

form#contacto textarea.mensaje-form {
        width: 400px;
        height: 200px;
}

form#contacto dt {
        text-align: left;
}

/**** jquery 3d gallery ****/
.dg-container{
	width: 100%;
	height: 350px;
	position: relative;
}
.dg-wrapper{
	width: 732px;
	height: 200px;
	margin: 0 auto;
	position: relative;
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	-o-transform-style: preserve-3d;
	-ms-transform-style: preserve-3d;
	transform-style: preserve-3d;
	-webkit-perspective: 1000px;
	-moz-perspective: 1000px;
	-o-perspective: 1000px;
	-ms-perspective: 1000px;
	perspective: 1000px;
}
.dg-wrapper a {
	width: 732px;
	height: 200px;
	display: block;
	position: absolute;
	left: 0;
	top: 0;
	/*background: transparent url(../images/browser.png) no-repeat top left; */
	box-shadow: 0px 10px 20px rgba(0,0,0,0.3);
}

.dg-wrapper a.dg-center, .dg-wrapper a.dg-center img {z-index: 999;}

.dg-wrapper a.dg-transition{
	-webkit-transition: all 0.5s ease-in-out;
	-moz-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
	-ms-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;
}
.dg-wrapper a img{
	display: block;
	padding: 0px 0px 0px 1px;
}
.dg-wrapper a div{
	font-style: italic;
	text-align: center;
	line-height: 50px;
	text-shadow: 1px 1px 1px rgba(255,255,255,0.5);
	color: #333;
	font-size: 16px;
	width: 100%;
	bottom: -55px;
	display: none;
	position: absolute;
}
.dg-wrapper a.dg-center div{
	display: block;
}
.dg-container nav{
	width: 58px;
	position: absolute;
	z-index: 1000;
	bottom: 40px;
	left: 50%;
	margin-left: -29px;
}
.dg-container nav span{
	text-indent: -9000px;
	float: left;
	cursor:pointer;
	width: 24px;
	height: 25px;
	opacity: 0.8;
	background: transparent url(../imagenes/layout/arrows.png) no-repeat top left;
}
.dg-container nav span:hover{
	opacity: 1;
}
.dg-container nav span.dg-next{
	background-position: top right;
	margin-left: 10px;
}

section {
    display: block;
}

/****** ROUNDABOUT SLIDER ******/
.slider-container{
        position: relative;
        float: left;
     /*   width: 900px; */
        width: 900px;
        height: 335px;
        text-align: center;
        padding: 10px 0;
}

ul#home-slider {
      /*   float: left;
       width: 100%; */
        width: 900px;
        height: 335px;
        margin: 0;
}

ul#home-slider li {
        margin: 0;
        padding: 0;
        width: 800px;
        height: 335px;
}

ul#home-slider li img {
       /* margin-left: -61px; */
       width: 100%;
}


/**** DIV COOKIES RGPD *****/
#overbox3{
    position: fixed;
    bottom: 0px;
    left: 0px;
    width: 100%;
    z-index: 999999;
    display: block;
}
#infobox3{
    margin: auto;
    position:relative;
    top: 0px;
    height: 58px;
    width: 100%;
    text-align: center;
    background-color: #eeeeee;
}
#infobox3 p {
    padding-top: 10px;
    line-height: 18px;
    font-size: 12px;
    text-align: center;
}
#infobox3 p a {
    margin-right: 5px;
    text-decoration: underline;
    color: #561C5B;
}