redcomani.org/weblocal/libs/css/master.css

298 lines
5.6 KiB
CSS

html {
height: 100%
}
body {
background: url("") no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
background-color: white;
height: 100%
}
h3 {
margin-top: 0px !important;
}
#redes {
color: white;
font-size: 2em;
padding: 0.4em;
}
.btn-default {
border-color: #cccccc2b;
}
.boton_chat>.btn-lg {
padding: 15px 30px;
font-size: 20px;
border-radius: 30px;
box-shadow: rgb(204, 204, 204) 1px 2px 4px;
}
.boton_chat {
font-size: 2em;
padding-bottom: 2em;
}
#wikihow {
background-image: url(../../images/wikihow.png);
background-repeat: no-repeat;
/* background-attachment: fixed; */
background-position: center;
background-size: 128%;
background-position: -16px -3px;
}
#salud {
background-image: url(../../images/salud.png);
background-repeat: no-repeat;
/* background-attachment: fixed; */
background-position: center;
background-size: 102%;
background-position: -1px -2px;
}
#educalab {
background-image: url(../../images/educalab.jpeg);
background-repeat: no-repeat;
/* background-attachment: fixed; */
background-position: center;
background-size: 113%;
background-position: -2px -9px;
}
#libros {
background-image: url(../../images/libros.png);
background-repeat: no-repeat;
/* background-attachment: fixed; */
background-position: center;
background-size: 125%;
background-position: -14px -2px;
}
#juegos {
background-image: url(../../images/juegos.png);
background-repeat: no-repeat;
/* background-attachment: fixed; */
background-position: center;
background-size: 125%;
background-position: -14px -12px;
}
#retos {
background-image: url(../../images/retos.png);
background-repeat: no-repeat;
/* background-attachment: fixed; */
background-position: center;
background-size: 95%;
background-repeat: no-repeat;
background-position: -5px 0px;
}
.lead {
letter-spacing: 0.06em;
}
#logo_cabecera {
width: 100%;
left: 40px;
background-color: white;
}
#logoRedCoMani {
-webkit-filter: drop-shadow(3px 3px 1px #f9f9f9) !important;
}
.alert-info {
padding-left: 2em;
padding-right: 2em;
color: #341208;
background-image: url("");
}
#cabezote {
background: url(../../images/imagen_principal.jpg) fixed center no-repeat;
background-size: cover;
text-shadow: 0px 2px 3px rgb(0, 0, 0);
color: white;
}
.linea_botones {
display: inline-block;
text-align: center;
margin: 1em;
}
.texto_botones {
font-size: 2em;
color: #7F9E3C !important;
}
.btn-circle.btn-xl {
width: 4em;
height: 4em;
padding: 1.5em;
font-size: 2em;
line-height: 1.33;
border-radius: 5em;
display: inline-flex;
box-shadow: rgb(204, 204, 204) 1px 2px 4px;
}
.franja {
color: white;
background: -webkit-linear-gradient(left, #7F9E3C, #E4A42F);
margin-bottom: 2em;
}
.navbar {
background: -webkit-linear-gradient(left, #7F9E3C, #E4A42F);
color: white;
margin-bottom: 0px !important;
}
.navbar-header>p {
font-size: 20px;
color: white;
font-family: "Open Sans", sans-serif;
font-weight: normal;
display: inline
}
.navbar-header>a {
font-size: 20px;
color: white;
font-family: "Open Sans", sans-serif;
font-weight: normal;
display: inline
}
.navbar-header>strong {
font-size: 20px;
color: white;
font-weight: normal;
font-family: "Open Sans", sans-serif;
display: inline
}
/*.navbar-header {width: 50%;}*/
.div_aplicacion {
background-color: #f0eee1 !important;
}
.div_aplicacion:hover {
-webkit-animation: animatedBackground 1s ease-out 1;
-moz-animation: animatedBackground 1s ease-out 1;
animation: animatedBackground 1s ease-out 1;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
z-index: 10000;
}
#creditos {
column-count: 4;
column-gap: 1em;
}
.img_creditos {
background-color: white;
display: inline-block;
margin: 0 0 1em;
width: 100%;
}
.img_grad {
max-width: 15em;
}
/* Masonry on large screens */
@media only screen and (min-width: 1024px) {
#creditos {
column-count: 2;
}
}
/* Masonry on medium-sized screens */
@media only screen and (max-width: 1023px) and (min-width: 768px) {
#creditos {
column-count: 3;
}
}
/* Masonry on small screens */
@media only screen and (max-width: 767px) and (min-width: 540px) {
#creditos {
column-count: 2;
}
}
@media only screen and (max-width: 540px) {
#creditos {
column-count: 1;
}
}
@-webkit-keyframes animatedBackground {
0% {
-webkit-transform: scale(1, 1);
-moz-transform: scale(1, 1);
-ms-transform: scale(1, 1);
-o-transform: scale(1, 1);
transform: scale(1, 1)
}
100% {
-webkit-transform: scale(1.1, 1.1);
-moz-transform: scale(1.1, 1.1);
-ms-transform: scale(1.1, 1.1);
-o-transform: scale(1.1, 1.1);
transform: scale(1.1, 1.1)
}
}
@-moz-keyframes animatedBackground {
0% {
-webkit-transform: scale(1, 1);
-moz-transform: scale(1, 1);
-ms-transform: scale(1, 1);
-o-transform: scale(1, 1);
transform: scale(1, 1)
}
100% {
-webkit-transform: scale(1.1, 1.1);
-moz-transform: scale(1.1, 1.1);
-ms-transform: scale(1.1, 1.1);
-o-transform: scale(1.1, 1.1);
transform: scale(1.1, 1.1)
}
}
@keyframes animatedBackground {
0% {
-webkit-transform: scale(1, 1);
-moz-transform: scale(1, 1);
-ms-transform: scale(1, 1);
-o-transform: scale(1, 1);
transform: scale(1, 1)
}
100% {
-webkit-transform: scale(1.1, 1.1);
-moz-transform: scale(1.1, 1.1);
-ms-transform: scale(1.1, 1.1);
-o-transform: scale(1.1, 1.1);
transform: scale(1.1, 1.1)
}
}
.pie {
padding-bottom: 1em;
padding-top: 2em;
font-size: 1.5em;
}