div.proyecto{ position: relative; width: 370px; height: auto; margin-top: 19px; } div.proyecto .proyecto-fondo{ top:0px; } div.proyecto .proyecto-wrapper{ height: 240px; } div.proyecto .proyecto-fondo .hover-fondo-normal, div.proyecto .proyecto-fondo .hover-fondo-hover{ opacity: 0.6; top: 0; position: absolute; width: 370px; height: 240px; } div.proyecto .element-invisible{ display: none; } div.proyecto .proyecto-fondo .hover-fondo-normal{ opacity: 1; background-color: rgb(247,247,231); top: 0; position: absolute; } div.proyecto .proyecto-fondo .hover-fondo-normal img{ opacity: 0.2; } div.proyecto .proyecto-fondo img{ width: 100%; height:100%; } div.proyecto .proyecto-fondo .hover-fondo-hover{ opacity:0; top: 0; position: absolute; } div.proyecto:hover .proyecto-fondo .hover-fondo-normal{ opacity: 0; } div.proyecto:hover .proyecto-fondo .hover-fondo-hover{ opacity: 1.0; } div.proyecto .proyecto-wrapper > div{ position: absolute; } div.proyecto .proyecto-fondo>div{ position: absolute; } div.proyecto .proyecto-superior{ top: 0px; margin: 0; padding: 0 10px } div.proyecto .proyecto-inferior{ bottom: 0px; margin: 0; padding: 0 10px; } div.proyecto .proyecto-header{ border: 0; } div.proyecto .panel-pane{ margin: 0; } div.proyecto:hover .proyecto-inferior, div.proyecto:hover .proyecto-superior{ opacity: 0; display: none; } div.proyecto .field-name-field-tipo{ margin-left: 0; } div.proyecto .pane-content{ margin-top: 0; } div.proyecto .proyecto-debajo{ position: static; margin-top: 25px; margin-bottom: 15px; } div.proyecto .proyecto-debajo p{ margin-bottom: 0px; } .node-proyecto h3{ text-transform: none; font-size: 16px; line-height: 20px; margin-top: 21px; } .node-proyecto p{ font-size: 12px; line-height: 15px; margin-top: 24px; margin-bottom: 16px; } .panel-pane .views-row{ padding: 0; } div.proyecto .tipo-de-contenido-wrapper, div.proyecto .field-name-field-tipo .field-item{ color: black; } /* Tablet Layout: 770px. Gutters: 24px. Outer margins: 28px. Inherits styles from: Default Layout. ----------------------------------------------------------------- cols 1 2 3 4 5 6 7 8 px 68 160 252 344 436 528 620 712 */ @media only screen and (min-width: 770px) and (max-width: 991px) { } @media only screen and (min-width: 570px) and (max-width: 769px) { div.proyecto{ whidth:370px; height:240px; } }