/* CSS personalizado para Página/s 05 ACCESORIOS */ /**************************************** GAMA DE COLORES ****************************************/ /* Azul Oscuro: 005376 rgb( 0, 83,118) */ /* Gris: 999999 rgb(153,153,153) */ /* Azul Medio: 8CA8C2 rgb(140,168,194) */ /* Azul Claro: C8D8E8 rgb(200,216,232) */ /* Azul Muy Claro: E0F3FC rgb(224,243,252) */ /* Verde 1: 90C254 rgb(144,194, 84) */ /* Verde 2: C8DDAB rgb(200,221,171) */ /* Verde 3: E6F0D7 rgb(230,240,215) */ /* Naranja 1: FF7711 rgb(255,119, 17) */ /* Naranja 2: FFEEDD rgb(255,238,221) */ /************************************ MODIFICADOS DE syle-home ***********************************/ /***************************************** #rowCabecera ******************************************/ #rowCabecera .divHeading h1 { margin: 0px 90px !important; display: flex; align-items: center; justify-content: center; } @media (max-width: 1080px) { } @media (max-width: 980px) { #rowCabecera .divHeading h1 { margin: 0px 80px !important;} } @media (max-width: 780px) { #rowCabecera .divHeading h1 { margin: 0px 60px !important;} } @media (max-width: 580px) { #rowCabecera .divHeading h1 { margin: 0px 50px !important;} } @media (max-width: 480px) { #rowCabecera .divHeading h1 { margin: 0px 40px !important;} } /*************************************** #rowGridAccesorios **************************************/ #rowGridAccesorios .divLugar { margin-bottom: 20px; padding: 10px 20px 20px 20px; background: var(--color-nar1-hex); } #rowGridAccesorios .divLugar .divLabel { margin-bottom: 10px; font-size: 24px; font-weight: 400; color: #FFFFFF; border-bottom: solid 1px #FFFFFF; } #rowGridAccesorios .divLugar .divValue { position: relative; padding: 20px; color: var(--color-nar1-hex); background: #FFFFFF; } #rowGridAccesorios .divLugar .divDatosLugar { display: flex; align-items: center; } #rowGridAccesorios .divLugar .divDatosLugar > img { margin-right: 40px; width: 200px; } #rowGridAccesorios .divLugar .divDatosLugar .spanName { font-size: 24px; font-weight: 600; display: block; } #rowGridAccesorios .divLugar .divDatosLugar .spanName i { margin-right: 10px; } #rowGridAccesorios .divLugar .divDatosLugar .spanAdress { margin-left: 24px; font-size: 20px; font-weight: 300; display: block; } #rowGridAccesorios .divLugar .divDatosLugar .spanMap { position: absolute; top: 15px; right: 15px; width: 64px; height: 64px; } #rowGridAccesorios .divAccesorios { display: flex; flex-wrap: wrap; justify-content: center; } #rowGridAccesorios .divAccesorios * { -webkit-transition: all 0.3s ease; transition: all 0.3s ease; } #rowGridAccesorios .divAccesorio { margin: 20px; width: calc((100% - 120px) / 3); } #rowGridAccesorios .divAccesorio .divFoto { line-height: 0px; } #rowGridAccesorios .divAccesorio .divNombre { margin-top: 15px; font-family: var(--font-family-narrow); font-size: 24px; font-weight: 600; text-align: center; line-height: 110%; } #rowGridAccesorios .divAccesorio table { margin-top: 15px; border: solid 1px var(--color3-hex); border-collapse: collapse; } #rowGridAccesorios .divAccesorio th { padding: 5px; font-size: 14px; font-weight: 400; color: #FFFFFF; background: var(--color1-hex); } #rowGridAccesorios .divAccesorio th { border: solid 1px var(--color3-hex); text-align: center; } #rowGridAccesorios .divAccesorio td { padding: 5px; font-size: 16px; font-weight: 600; color: #000000; background: var(--color5-hex); } #rowGridAccesorios .divAccesorio td { border: solid 1px var(--color3-hex); text-align: center; } #rowGridAccesorios .divAccesorio .divDescripcion { margin-top: 15px; font-size: 14px; line-height: 120%; text-align: justify; } #rowGridAccesorios .divAccesorio .divButton { margin-top: 15px; padding: 10px 20px; font-size: 18px; font-weight: 400; color: #FFFFFF; } #rowGridAccesorios .divAccesorio .divButton { background-color: var(--color-nar1-hex); text-align: center; cursor: pointer; } #rowGridAccesorios .divAccesorio .divButton:hover { color: var(--color-nar1-hex); background-color: var(--color-nar2-hex); } @media (max-width: 1180px) { #rowGridAccesorios .divLugar { margin: 0px 20px 20px 20px; } } @media (max-width: 1080px) { #rowGridAccesorios .divAccesorio { margin: 15px; width: calc((100% - 90px) / 3); } #rowGridAccesorios .divAccesorio .divNombre { font-size: 22px; } } @media (max-width: 980px) { #rowGridAccesorios .divLugar .divLabel { font-size: 20px; } #rowGridAccesorios .divLugar .divValue { padding: 15px; } #rowGridAccesorios .divLugar .divDatosLugar > img { margin-right: 30px; width: 160px; } #rowGridAccesorios .divLugar .divDatosLugar .spanName { font-size: 20px; } #rowGridAccesorios .divLugar .divDatosLugar .spanAdress { margin-left: 20px; font-size: 18px; } #rowGridAccesorios .divLugar .divDatosLugar .spanMap { top: 15px; right: 15px; width: 56px; height: 56px; } #rowGridAccesorios .divAccesorio .divNombre { margin-top: 10px; font-size: 20px; } #rowGridAccesorios .divAccesorio table { margin-top: 10px; } #rowGridAccesorios .divAccesorio th { font-size: 13px; } #rowGridAccesorios .divAccesorio td { font-size: 14px; } #rowGridAccesorios .divAccesorio .divDescripcion { margin-top: 10px; font-size: 13px; } #rowGridAccesorios .divAccesorio .aButton { margin-top: 10px; } } @media (max-width: 780px) { #rowGridAccesorios .divLugar .divLabel { font-size: 18px; } #rowGridAccesorios .divLugar .divValue { padding: 10px; } #rowGridAccesorios .divLugar .divDatosLugar > img { margin-right: 20px; width: 140px; } #rowGridAccesorios .divLugar .divDatosLugar .spanName { font-size: 18px; } #rowGridAccesorios .divLugar .divDatosLugar .spanAdress { margin-left: 18px; font-size: 16px; } #rowGridAccesorios .divLugar .divDatosLugar .spanMap { top: 10px; right: 10px; width: 48px; height: 48px; } #rowGridAccesorios .divAccesorio { margin: 15px; width: calc((100% - 60px) / 2); } } @media (max-width: 580px) { #rowGridAccesorios .divLugar { padding: 10px 15px 15px 15px; } #rowGridAccesorios .divLugar .divLabel { font-size: 16px; } #rowGridAccesorios .divLugar .divDatosLugar > img { margin-right: 15px; width: 100px; } #rowGridAccesorios .divLugar .divDatosLugar .spanName { font-size: 16px; } #rowGridAccesorios .divLugar .divDatosLugar .spanAdress { font-size: 14px; } #rowGridAccesorios .divLugar .divDatosLugar .spanMap { top: 5px; right: 10px; width: 32px; height: 32px; } #rowGridAccesorios .divAccesorio { margin: 15px; width: calc(100% - 30px); max-width: 340px; } #rowGridAccesorios .divAccesorio .divFoto { margin: auto; max-width: 200px; } } @media (max-width: 500px) { #rowGridAccesorios .divLugar .divLabel { font-size: 16px; text-align: center; } } @media (max-width: 480px) { #rowGridAccesorios .divLugar { margin: 0px 15px 15px 15px; padding: 10px; } #rowGridAccesorios .divLugar * { line-height: 120%; } #rowGridAccesorios .divLugar .divValue { padding: 5px; } #rowGridAccesorios .divLugar .divDatosLugar > img { margin-right: 10px; width: 80px; } #rowGridAccesorios .divLugar .divDatosLugar .spanName { font-size: 14px; } #rowGridAccesorios .divLugar .divDatosLugar .spanName i { display: none; } #rowGridAccesorios .divLugar .divDatosLugar .spanAdress { margin-left: 0px; font-size: 14px; } #rowGridAccesorios .divLugar .divDatosLugar .spanMap { top: auto; bottom: 5px; right: 5px; } #rowGridAccesorios .divAccesorio { margin: 15px; width: calc(100% - 30px); max-width: 340px; } #rowGridAccesorios .divAccesorio .divFoto { margin: auto; max-width: 200px; } } @media (max-width: 380px) { #rowGridAccesorios .divLugar { margin: 0px 10px 10px 10px; } #rowGridAccesorios .divLugar .divDatosLugar .spanMap { width: 28px; height: 28px; } } /************************************* #rowLightboxAccesorios ************************************/ #rowLightboxAccesorios { position: fixed; top: 0px; left: 0px; margin: 0px !important; padding: 0px !important; } #rowLightboxAccesorios { width: 100%; height: 100%; z-index: 9999; display: none; } #rowLightboxAccesorios * { box-sizing: border-box; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; } #rowLightboxAccesorios .divLightboxAccesorios { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; } #rowLightboxAccesorios .divMascaraLightboxAccesorios { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; background: rgba(0,0,0,0.7); } #rowLightboxAccesorios .divCloseLightboxAccesorios { position: absolute; top: 40px; right: 40px; width: 50px; height: 50px; border: solid 2px #FFFFFF; border-radius: 50%; } #rowLightboxAccesorios .divCloseLightboxAccesorios { display: flex; align-items: center; justify-content: center; cursor: pointer; } #rowLightboxAccesorios .divCloseLightboxAccesorios:before { content: "\f00d"; font-family: "FontAwesome"; font-size: 36px; color: #FFFFFF; } #rowLightboxAccesorios .divCloseLightboxAccesorios:hover { transform: scale(1.1); } #rowLightboxAccesorios .divPopupLightboxAccesorios { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 90%; max-width: 780px; background: #FFFFFF; } #rowLightboxAccesorios .divCabeceraVerde { padding: 12px 20px; width: 100%; font-family: var(--font-family-narrow); color: var(--color2-hex); } #rowLightboxAccesorios .divCabeceraVerde { border: solid 2px var(--color-ver1-hex); background: var(--color-ver3-hex); text-align: center; } #rowLightboxAccesorios .divTitle { font-size: 28px; font-weight: 900; } #rowLightboxAccesorios .divTexto { margin-top: 5px; font-size: 16px; font-weight: 400; line-height: 120%; } #rowLightboxAccesorios .divForm { padding: 10px 20px; width: 100%; border: solid #DDDDDD; border-width: 0px 2px 2px 2px; } #rowLightboxAccesorios .divForm * { font-family: var(--font-family-narrow); font-weight: 400; line-height: 120%; } #rowLightboxAccesorios .divGrupo { margin-top: 10px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; } #rowLightboxAccesorios .divGrupoHeading { margin-bottom: 15px; padding-bottom: 2px; width: 100%; font-size: 20px; } #rowLightboxAccesorios .divGrupoHeading { color: var(--color-ver1-hex); border-bottom: solid 1px var(--color-ver1-hex); } #rowLightboxAccesorios .divField { margin-bottom: 15px; width: 100%; display: flex; align-items: center; } #rowLightboxAccesorios .divField > span { width: 100%; } #rowLightboxAccesorios .divField span[role="alert"] { position: absolute; top: 100%; right: 0px; padding-top: 2px; font-size: 12px; z-index: 1; } #rowLightboxAccesorios .divField .wpcf7-not-valid-tip { position: absolute; top: 100%; right: 0px; padding-top: 2px; font-size: 12px; z-index: 1; } #rowLightboxAccesorios input { width: 100%; height: 40px; font-size: 16px; color: var(--color-nar1-hex); background: #F6F6F6; border: none; border-radius: 0px; } #rowLightboxAccesorios textarea { width: 100%; height: 60px; font-size: 16px; color: var(--color-nar1-hex); background: #F6F6F6; border: none; border-radius: 0px; } #rowLightboxAccesorios input::placeholder { color: var(--color-nar1-hex); } #rowLightboxAccesorios textarea::placeholder { color: var(--color-nar1-hex); } #rowLightboxAccesorios .divGrupoAlquiler { display: block; } #rowLightboxAccesorios .divGrupoAlquiler .divGrupoHeading { font-size: 28px; font-weight: 600; } #rowLightboxAccesorios .divGrupoAlquiler label { flex: 0 0 80px; } #rowLightboxAccesorios .divFieldFoto { float: left; margin-right: 50px; width: 180px; height: 180px; background-repeat: no-repeat; background-size: contain; } #rowLightboxAccesorios .divFieldRecogida { width: 300px; } #rowLightboxAccesorios .divFieldDevolucion { width: 300px; } #rowLightboxAccesorios .divGrupoPrecio .divGrupoHeading { margin-bottom: 5px; } #rowLightboxAccesorios .divImporte { font-size: 24px; } #rowLightboxAccesorios .divImporte strong { font-weight: 600; } #rowLightboxAccesorios .divGrupoDatos { clear: both; } #rowLightboxAccesorios .divFieldNombre { width: calc((100% - 140px - 40px) / 2); } #rowLightboxAccesorios .divFieldMail { margin-left: 20px; width: calc((100% - 140px - 40px) / 2); } #rowLightboxAccesorios .divFieldTelefono { margin-left: 20px; width: 140px; } #rowLightboxAccesorios .divFieldComentarios { width: 100%; } #rowLightboxAccesorios .divAcepto { margin-bottom: 20px; width: 100%; display: flex; justify-content: center; } #rowLightboxAccesorios .divAcepto > span { margin: 2px 10px; line-height: 0px; } #rowLightboxAccesorios .divAcepto > span * { margin: 0px; line-height: 0px; } #rowLightboxAccesorios input[type="checkbox"] { width: 20px; height: 20px; } #rowLightboxAccesorios .divAcepto p { margin: 0px; width: 540px; font-size: 14px; text-align: justify; } #rowLightboxAccesorios .divAcepto a { color: var(--color-ver1-hex) !important; } #rowLightboxAccesorios .divAcepto a:hover { color: var(--color-ver2-hex) !important; } #rowLightboxAccesorios .divSubmit { position: relative; width: 100%; display: block; flex-direction: column; align-items: center; } #rowLightboxAccesorios input[type="submit"] { padding: 10px 60px; height: auto; font-size: 18px; color: #FFFFFF; background: var(--color-nar1-hex); } #rowLightboxAccesorios .divSubmit .wpcf7-spinner { position: absolute; top: 50%; right: 0px; transform: translateY(-50%); margin: 0px 10px; } #rowLightboxAccesorios .divSubmit .wpcf7-spinner { background: var(--color-ver1-hex); opacity: 1; } #rowLightboxAccesorios .divLegal p { font-size: 12px; text-align: justify; } @media (max-width: 980px) { #rowLightboxAccesorios .divCloseLightboxAccesorios { top: 20px; left: 50%; right: auto; transform: translateX(-50%); } #rowLightboxAccesorios .divCloseLightboxAccesorios { background: var(--color-ver1-hex); border-color: var(--color-ver3-hex); } #rowLightboxAccesorios .divTitle { font-size: 24px; } #rowLightboxAccesorios .divTexto { font-size: 14px; } #rowLightboxAccesorios .divGrupoHeading { margin-bottom: 10px; font-size: 18px; } #rowLightboxAccesorios .divField { margin-bottom: 10px; } #rowLightboxAccesorios .divField span[role="alert"] { font-size: 11px; } #rowLightboxAccesorios .divField .wpcf7-not-valid-tip { font-size: 11px; } #rowLightboxAccesorios input { padding: 8px 10px; height: 36px; font-size: 14px; } #rowLightboxAccesorios textarea { padding: 8px 10px; height: 50px; font-size: 14px; } #rowLightboxAccesorios .divGrupoAlquiler .divGrupoHeading { font-size: 24px; } #rowLightboxAccesorios .divFieldFoto { width: 160px; height: 160px; } #rowLightboxAccesorios .divImporte { font-size: 20px; } #rowLightboxAccesorios .divAcepto { margin-bottom: 15px; } #rowLightboxAccesorios .divAcepto > span { margin: 2px 8px; } #rowLightboxAccesorios input[type="checkbox"] { width: 18px; height: 18px; } #rowLightboxAccesorios .divAcepto p { width: auto; font-size: 12px; } #rowLightboxAccesorios input[type="submit"] { padding: 8px; } } @media (max-width: 780px) { #rowLightboxAccesorios .divCloseLightboxAccesorios { width: 40px; height: 40px; } #rowLightboxAccesorios .divCloseLightboxAccesorios:before { font-size: 28px; } #rowLightboxAccesorios .divTitle { font-size: 20px; } #rowLightboxAccesorios .divTexto { font-size: 13px; } #rowLightboxAccesorios .divGrupoHeading { font-size: 16px; } #rowLightboxAccesorios input { height: 32px; font-size: 13px; } #rowLightboxAccesorios textarea { font-size: 13px; } #rowLightboxAccesorios .divGrupoAlquiler .divGrupoHeading { font-size: 20px; } #rowLightboxAccesorios .divGrupoAlquiler label { flex: 0 0 70px; font-size: 14px; } #rowLightboxAccesorios .divFieldFoto { margin-right: 30px; width: 120px; height: 120px; } #rowLightboxAccesorios .divImporte { font-size: 18px; } #rowLightboxAccesorios .divFieldNombre { width: 100%; } #rowLightboxAccesorios .divFieldMail { margin-left: 0px; width: calc(100% - 120px - 10px); } #rowLightboxAccesorios .divFieldTelefono { margin-left: 10px; width: 120px; } #rowLightboxAccesorios .divLegal p { font-size: 10px; } } @media (max-width: 700px) { #rowLightboxAccesorios .divTexto br5000:before { content: " "; } } @media (max-width: 580px) { #rowLightboxAccesorios .divCloseLightboxAccesorios { top: 10px; width: 30px; height: 30px; } #rowLightboxAccesorios .divCloseLightboxAccesorios:before { font-size: 24px; } #rowLightboxAccesorios .divTitle { font-size: 18px; } #rowLightboxAccesorios .divTexto { font-family: var(--font-family-narrow); } #rowLightboxAccesorios .divGrupoHeading { font-size: 14px; } #rowLightboxAccesorios .divField span[role="alert"] { font-size: 10px; } #rowLightboxAccesorios .divField .wpcf7-not-valid-tip { font-size: 10px; } #rowLightboxAccesorios .divGrupoAlquiler .divGrupoHeading { font-size: 18px; } #rowLightboxAccesorios .divGrupoAlquiler label { flex: 0 0 60px; font-size: 13px; } #rowLightboxAccesorios .divFieldFoto { margin-right: 10px; } #rowLightboxAccesorios .divFieldRecogida { width: calc(100% - 10px - 120px); } #rowLightboxAccesorios .divFieldDevolucion { width: calc(100% - 10px - 120px); } #rowLightboxAccesorios .divImporte { font-size: 16px; } } @media (max-width: 500px) { #rowLightboxAccesorios .divTexto br700:before { content: " "; } } @media (max-width: 480px) { #rowLightboxAccesorios .divForm { max-height: calc(100vh - 120px - 100px); overflow-y: auto; } #rowLightboxAccesorios .divFieldFoto { float: none; margin: 0px auto 10px auto; width: 90px; height: 90px; } #rowLightboxAccesorios .divFieldRecogida { width: 100%; } #rowLightboxAccesorios .divFieldDevolucion { width: 100%; } #rowLightboxAccesorios .divFieldMail { margin-left: 0px; width: 100%; } #rowLightboxAccesorios .divFieldTelefono { margin-left: 0px; width: 100%; } #rowLightboxAccesorios input[type="checkbox"] { width: 16px; height: 16px; } #rowLightboxAccesorios .divAcepto p { font-size: 11px; } }