/*
	CSS personalizado para 02 CASAS RURALES
*/

/**************************************** GAMA DE COLORES ****************************************/

/*      Verde Oscuro: 4D746A rgb( 77,116,106) */
/*              Gris: 999999 rgb(153,153,153) */
/*       Verde Medio: A6B9B4 rgb(166,185,180) */
/*       Verde Claro: D2DCD9 rgb(210,220,217) */
/*   Verde muy Claro: E8EDEC rgb(232,237,236) */

/************************************ MODIFICADOS DE syle-home ***********************************/

/**************************************** #rowCasasRurales ***************************************/

#rowCasasRurales *                                { -webkit-transition: all 0.3s ease; transition: all 0.3s ease; }
#rowCasasRurales .divCasa                         { margin-bottom: 60px; position: relative; }
#rowCasasRurales .divCasaIzda .divTexto           { left:  0px; padding: 60px 90px 60px  0px; }
#rowCasasRurales .divCasaDcha .divTexto           { right: 0px; padding: 60px  0px 60px 90px; }
#rowCasasRurales .divCasaIzda .divFotos           { text-align: right; }
#rowCasasRurales .divCasaDcha .divFotos           { text-align: left; }
#rowCasasRurales .divTexto                        { position: absolute; top: 50%; transform: translateY(-50%); width: 50%; background: #FFFFFF; }
#rowCasasRurales .divPrecio                       { float: right; position: relative; top: -10px; }
#rowCasasRurales .divPrecio   span                { color: var(--color1-hex); display: block; text-align: center; }
#rowCasasRurales .divPrecio   span:nth-of-type(1) { font-size: 20px; font-weight: 500; }
#rowCasasRurales .divPrecio   span:nth-of-type(2) { margin-top: 6px; font-size: 40px; font-weight: 900; }
#rowCasasRurales .divPrecio   span:nth-of-type(3) { margin-top: 6px; font-size: 24px; font-weight: 500; letter-spacing: -2px; }
#rowCasasRurales .divNombre   span                { font-size: 30px; }
#rowCasasRurales .divNombre   h2                  { letter-spacing: -3px; }
#rowCasasRurales .divTexto    ul                  { margin: 20px 0px 20px 20px; list-style-type: disc; }
#rowCasasRurales .divTexto    .aButton            { padding: 10px 20px; width: fit-content; font-size: 20px; font-weight: 500; color: #FFFFFF; background: var(--color1-hex); }
#rowCasasRurales .divTexto    .aButton            { border-radius: 10px; text-decoration: none; display: inline-block; }
#rowCasasRurales .divTexto    .aButton:hover      { color: #FFFFFF !important; transform: scale(1.1); }
#rowCasasRurales .divTexto    .aNormas            { margin-left: 20px; }
#rowCasasRurales .divTexto    .pNota              { font-size: 14px; line-height: 120%; }
#rowCasasRurales .divFotos                        { width: 100%; line-height: 0px; }
#rowCasasRurales .divFotos    img                 { width: 640px; }

@media (max-width: 1280px) {
	#rowCasasRurales .divCasasRurales                 { padding: 0px 40px; }
	#rowCasasRurales .divCasaIzda .divTexto           { padding: 40px 80px 40px  0px; }
	#rowCasasRurales .divCasaDcha .divTexto           { padding: 40px  0px 40px 80px; }
	#rowCasasRurales .divPrecio   span:nth-of-type(1) { font-size: 18px; }
	#rowCasasRurales .divPrecio   span:nth-of-type(2) { font-size: 38px; }
	#rowCasasRurales .divPrecio   span:nth-of-type(3) { font-size: 20px; }
	#rowCasasRurales .divNombre   span                { font-size: 28px; }
	#rowCasasRurales .divTexto    ul                  { margin: 15px 0px 15px 15px; }
	#rowCasasRurales .divFotos    img                 { width: 580px; }
}

@media (max-width: 1180px) {
	#rowCasasRurales .divCasaIzda .divTexto           { padding: 30px 60px 30px  0px; }
	#rowCasasRurales .divCasaDcha .divTexto           { padding: 30px  0px 30px 60px; }
	#rowCasasRurales .divFotos    img                 { width: 540px; }
}

@media (max-width: 1080px) {
	#rowCasasRurales .divTexto                        { width: 55%; }
	#rowCasasRurales .divCasaIzda .divTexto           { padding: 20px 40px 20px  0px; }
	#rowCasasRurales .divCasaDcha .divTexto           { padding: 20px  0px 20px 40px; }
	#rowCasasRurales .divFotos    img                 { width: 500px; }
}

@media (max-width:  980px) {
	#rowCasasRurales .divCasasRurales                 { padding: 0px 30px; }
	#rowCasasRurales .divCasa                         { display: flex; flex-wrap: wrap; }
	#rowCasasRurales .divCasaIzda .divTexto           { position: initial; transform: none; padding: 0px 30px 0px  0px; width: 60%; }
	#rowCasasRurales .divCasaDcha .divTexto           { position: initial; transform: none; padding: 0px  0px 0px 30px; width: 60%; }
	#rowCasasRurales .divCasaIzda .divFotos           { width: 40%; }
	#rowCasasRurales .divCasaDcha .divFotos           { width: 40%; }
	#rowCasasRurales .divNombre   span                { font-size: 24px; }
	#rowCasasRurales .divTexto    ul                  { margin: 10px 0px 10px 10px; }
	#rowCasasRurales .divTexto    .aButton            { font-size: 18px; }
	#rowCasasRurales .divTexto    .aNormas            { margin-left: 10px; }
	#rowCasasRurales .divFotos    img                 { width: 100%; }
}

@media (max-width:  780px) {
	#rowCasasRurales .divCasasRurales                 { padding: 0px 20px; }
	#rowCasasRurales .divCasaIzda                     { flex-direction: column; }
	#rowCasasRurales .divCasaDcha                     { flex-direction: column-reverse; }
	#rowCasasRurales .divCasa     .divTexto           { padding: 0px !important; width: 100%; }
	#rowCasasRurales .divCasa     .divFotos           { width: 100% !important; display: flex; flex-wrap: wrap; justify-content: center; }
	#rowCasasRurales .divPrecio                       { top: 0px; }
	#rowCasasRurales .divPrecio   span:nth-of-type(1) { font-size: 16px; }
	#rowCasasRurales .divPrecio   span:nth-of-type(2) { margin-top: 4px; font-size: 32px; }
	#rowCasasRurales .divPrecio   span:nth-of-type(3) { margin-top: 4px; font-size: 18px; letter-spacing: normal; }
	#rowCasasRurales .divNombre                       { text-align: center; }
	#rowCasasRurales .divNombre   span                { font-size: 20px; }
	#rowCasasRurales .divNombre   h2                  { letter-spacing: normal; }
	#rowCasasRurales .divTexto    ul                  { margin: 20px 0px 0px 10px; }
	#rowCasasRurales .divTexto    .aButton            { font-size: 16px; }
	#rowCasasRurales .divFotos    img                 { width: 50%; }
}

@media (max-width:  580px) {
	#rowCasasRurales .divTexto    .pNota              { font-size: 13px; }
	#rowCasasRurales .divFotos    img                 { width: 100%; max-width: 400px; }
}

@media (max-width:  480px) {
	#rowCasasRurales .divCasasRurales                 { padding: 0px 10px; }
	#rowCasasRurales .divPrecio   span:nth-of-type(3) { letter-spacing: -2px; }
	#rowCasasRurales .divNombre   h2                  { letter-spacing: -2px; }
	#rowCasasRurales .divTexto    .aButton            { font-size: 14px; }
	#rowCasasRurales .divTexto    .pNota              { font-size: 12px; }
}

@media (max-width:  380px) {
	#rowCasasRurales .divPrecio                       { top: -20px; }	
	#rowCasasRurales .divPrecio   span:nth-of-type(2) { font-size: 28px; }
	#rowCasasRurales .divNombre                       { text-align: left; }
	#rowCasasRurales .divTexto    .aButton            { margin: 10px auto; width: auto; font-size: 16px; display: block; text-align: center; }
	#rowCasasRurales .divTexto    .aNormas            { margin: 10px auto; width: auto; font-size: 16px; display: block; text-align: center; }
}

/******************************************* #rowNormas ******************************************/

#rowNormas *                  { -webkit-transition: all 0.3s ease; transition: all 0.3s ease; }
#rowNormas .divNormas a       { margin: auto; width: fit-content; color: var(--color1-hex) !important; text-decoration: none !important; }
#rowNormas .divNormas a       { display: flex; align-items: center; justify-content: center; }
#rowNormas .divNormas a:hover { transform: scale(1.2); }
#rowNormas .divNormas img     { margin: 0px 20px; width: 200px; }
#rowNormas .divNormas span    { margin: 0px 20px; font-size: 42px; font-weight: 600; text-align: center; line-height: 120%; }

@media (max-width:  780px) {
	#rowNormas .divNormas img  { width: 160px; }
	#rowNormas .divNormas span { font-size: 36px; }
}

@media (max-width:  580px) {
	#rowNormas .divNormas img  { margin: 0px 10px 0px  0px; width: 140px; }
	#rowNormas .divNormas span { margin: 0px  0px 0px 10px; font-size: 30px; letter-spacing: -2px; }
}

@media (max-width:  380px) {
	#rowNormas .divNormas a    { display: block; }
	#rowNormas .divNormas img  { margin:  0px auto !important; display: block; }
	#rowNormas .divNormas span { margin: 20px auto !important; letter-spacing: normal; display: block; }
}