@charset "UTF-8";
/* CSS Document */

/*Para visionar el espacio ocupado por cada caja*/
.prueba-caja{
	background-color:#F0F;
	border:#0F0 solid 2pt;
}
@font-face {
    font-family: 'pocoyo';
    src: url('../fonts/pocoyo_hw-webfont.eot');
    src: url('../fonts/pocoyo_hw-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/pocoyo_hw-webfont.woff2') format('woff2'),
         url('../fonts/pocoyo_hw-webfont.woff') format('woff'),
         url('../fonts/pocoyo_hw-webfont.ttf') format('truetype'),
         url('../fonts/pocoyo_hw-webfont.svg#pocoyo_hand_writeregular') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'VAG';
    src: url('../fonts/vag_rounded_bold-webfont.eot');
    src: url('../fonts/vag_rounded_bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/vag_rounded_bold-webfont.woff2') format('woff2'),
         url('../fonts/vag_rounded_bold-webfont.woff') format('woff'),
         url('../fonts/vag_rounded_bold-webfont.ttf') format('truetype'),
         url('../fonts/vag_rounded_bold-webfont.svg#vag_roundedbold') format('svg');
    font-weight: normal;
    font-style: normal;

}
.pocoyo{font-family:'pocoyo';}
.VAG{font-family:'VAG';}
.contraste{color:#eacb53;}
.centrar{margin:0 auto;}
.izquierda{float:left;}
.derecha{float:right;}

/*   Cabecera   */
header p{font-size:7em; text-align:center; color:#FFF; margin:0 auto;}
#logo{display:table; width:100%; height:150px;}
#logo a{display:table-cell; vertical-align:middle;}

/*Tipos de background*/
body{background-color:#db9600;}
.fondo-blur-1{
	background: url(../es/img/bg-1.jpg), no-repeat, #FC6;
}
.fondo-blur-2{
	background: url(../es/img/bg-2.jpg), no-repeat, #FC6;
}
.fondo-blur-3{
	background: url(../es/img/bg-3.jpg), no-repeat, #FC6;
}
.fondo-blur-4{
	background: url(../es/img/bg-4.jpg), no-repeat, #FC6;
}
.fondo-blur-5{
	background: url(../es/img/bg-5.jpg), no-repeat, #FC6;
}
.fondo-blur-6{
	background: url(../es/img/bg-6.jpg), no-repeat, #FC6;
}
.fondo-white{
	background-color: rgba(255,255,255,0.90);
	padding:10px;
}  
/*    Módulos inferiores    */
.app{background:rgba(166,17,21,1) url(../es/img/biblia-bg.png) no-repeat right}
.app a{text-align:left}

.box{
	border-radius:5px;
	margin:5px auto;
	padding:3%;
	width:100%;
	max-width:230px;
	display:inline-table;
}
.box-md{
	border-radius:5px;
	margin:5px auto;
	padding:3%;
	width:100%;
	display:inline-table;
}
.box-md p{
	font-family:'VAG';
	font-size:104px; color:#FFF;
	text-align:center;
	vertical-align:middle;
	text-shadow: 3px 3px 3px rgba(150, 150, 150, 0.75);
	display:table-cell;
}
.box p{
	font-family:'VAG';
	font-size:74px; color:#FFF;
	text-align:center;
	vertical-align:middle;
	text-shadow: 3px 3px 3px rgba(150, 150, 150, 0.75);
	display:table-cell;
}
.bg-primero{
	background: rgba(132,194,58,1);
	background: -moz-linear-gradient(-45deg, rgba(132,194,58,1) 0%, rgba(174,220,73,1) 100%);
	background: -webkit-gradient(left top, right bottom, color-stop(0%, rgba(132,194,58,1)), color-stop(100%, rgba(174,220,73,1)));
	background: -webkit-linear-gradient(-45deg, rgba(132,194,58,1) 0%, rgba(174,220,73,1) 100%);
	background: -o-linear-gradient(-45deg, rgba(132,194,58,1) 0%, rgba(174,220,73,1) 100%);
	background: -ms-linear-gradient(-45deg, rgba(132,194,58,1) 0%, rgba(174,220,73,1) 100%);
	background: linear-gradient(135deg, rgba(132,194,58,1) 0%, rgba(174,220,73,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#84c23a', endColorstr='#aedc49', GradientType=1 );
}
.bg-segundo{
	background: rgba(159,113,179,1);
	background: -moz-linear-gradient(-45deg, rgba(93,41,116,1) 0%, rgba(199,155,217,1) 100%);
	background: -webkit-gradient(left top, right bottom, color-stop(0%, rgba(93,41,116,1)), color-stop(100%, rgba(199,155,217,1)));
	background: -webkit-linear-gradient(-45deg, rgba(93,41,116,1) 0%, rgba(199,155,217,1) 100%);
	background: -o-linear-gradient(-45deg, rgba(93,41,116,1) 0%, rgba(199,155,217,1) 100%);
	background: -ms-linear-gradient(-45deg, rgba(93,41,116,1) 0%, rgba(199,155,217,1) 100%);
	background: linear-gradient(135deg, rgba(93,41,116,1) 0%, rgba(199,155,217,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5d2974', endColorstr='#c79bd9', GradientType=1 );
}
.bg-tercero{
	background: rgba(61,91,161,1);
background: -moz-linear-gradient(-45deg, rgba(61,91,161,1) 0%, rgba(118,158,209,1) 100%);
background: -webkit-gradient(left top, right bottom, color-stop(0%, rgba(61,91,161,1)), color-stop(100%, rgba(118,158,209,1)));
background: -webkit-linear-gradient(-45deg, rgba(61,91,161,1) 0%, rgba(118,158,209,1) 100%);
background: -o-linear-gradient(-45deg, rgba(61,91,161,1) 0%, rgba(118,158,209,1) 100%);
background: -ms-linear-gradient(-45deg, rgba(61,91,161,1) 0%, rgba(118,158,209,1) 100%);
background: linear-gradient(135deg, rgba(61,91,161,1) 0%, rgba(118,158,209,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3d5ba1', endColorstr='#769ed1', GradientType=1 );
}
.bg-cuarto{
	background: rgba(166,17,21,1);
background: -moz-linear-gradient(-45deg, rgba(166,17,21,1) 0%, rgba(204,63,69,1) 100%);
background: -webkit-gradient(left top, right bottom, color-stop(0%, rgba(166,17,21,1)), color-stop(100%, rgba(204,63,69,1)));
background: -webkit-linear-gradient(-45deg, rgba(166,17,21,1) 0%, rgba(204,63,69,1) 100%);
background: -o-linear-gradient(-45deg, rgba(166,17,21,1) 0%, rgba(204,63,69,1) 100%);
background: -ms-linear-gradient(-45deg, rgba(166,17,21,1) 0%, rgba(204,63,69,1) 100%);
background: linear-gradient(135deg, rgba(166,17,21,1) 0%, rgba(204,63,69,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a61115', endColorstr='#cc3f45', GradientType=1 );
}
.bg-quinto{
	background: rgba(166,98,27,1);
background: -moz-linear-gradient(-45deg, rgba(166,98,27,1) 0%, rgba(198,142,19,1) 100%);
background: -webkit-gradient(left top, right bottom, color-stop(0%, rgba(166,98,27,1)), color-stop(100%, rgba(198,142,19,1)));
background: -webkit-linear-gradient(-45deg, rgba(166,98,27,1) 0%, rgba(198,142,19,1) 100%);
background: -o-linear-gradient(-45deg, rgba(166,98,27,1) 0%, rgba(198,142,19,1) 100%);
background: -ms-linear-gradient(-45deg, rgba(166,98,27,1) 0%, rgba(198,142,19,1) 100%);
background: linear-gradient(135deg, rgba(166,98,27,1) 0%, rgba(198,142,19,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6621b', endColorstr='#c68e13', GradientType=1 );
}
.bg-sexto{
	background: rgba(38,147,118,1);
background: -moz-linear-gradient(-45deg, rgba(38,147,118,1) 0%, rgba(109,171,160,1) 100%);
background: -webkit-gradient(left top, right bottom, color-stop(0%, rgba(38,147,118,1)), color-stop(100%, rgba(109,171,160,1)));
background: -webkit-linear-gradient(-45deg, rgba(38,147,118,1) 0%, rgba(109,171,160,1) 100%);
background: -o-linear-gradient(-45deg, rgba(38,147,118,1) 0%, rgba(109,171,160,1) 100%);
background: -ms-linear-gradient(-45deg, rgba(38,147,118,1) 0%, rgba(109,171,160,1) 100%);
background: linear-gradient(135deg, rgba(38,147,118,1) 0%, rgba(109,171,160,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#269376', endColorstr='#6daba0', GradientType=1 );
}

/*    Módulos laterales   */
.side-box{
	width:100%;
	height:20%;
	border-radius:5px;
	margin:5px auto;
	font-family:pocoyo;
	font-size:2.3em;
	color:#FFF;
	text-align:center !important;
	display:table;
	line-height: 1.0;
}
.side-box a{
	text-decoration:none;
	color:#FFF;
	max-width:50%;
	padding-left:5px
}
#cierre{
	background:none;
	border:none;
}
.clasemodal{
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
	color:#333;
}
.clasemodal p{
	font-size:14px;
	width:100%;
}
.clasemodal a{
	margin:5px;
}
.side-box a{
	display:table-cell;
	vertical-align:middle;
	width:100%;
}
.red{
	background: rgba(133,0,0,1);
background: -moz-linear-gradient(-45deg, rgba(133,0,0,1) 0%, rgba(184,0,0,1) 100%);
background: -webkit-gradient(left top, right bottom, color-stop(0%, rgba(133,0,0,1)), color-stop(100%, rgba(184,0,0,1)));
background: -webkit-linear-gradient(-45deg, rgba(133,0,0,1) 0%, rgba(184,0,0,1) 100%);
background: -o-linear-gradient(-45deg, rgba(133,0,0,1) 0%, rgba(184,0,0,1) 100%);
background: -ms-linear-gradient(-45deg, rgba(133,0,0,1) 0%, rgba(184,0,0,1) 100%);
background: linear-gradient(135deg, rgba(133,0,0,1) 0%, rgba(184,0,0,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#850000', endColorstr='#b80000', GradientType=1 );
}
.blue{
	background: rgba(43,2,138,1);
background: -moz-linear-gradient(-45deg, rgba(43,2,138,1) 0%, rgba(56,0,186,1) 100%);
background: -webkit-gradient(left top, right bottom, color-stop(0%, rgba(43,2,138,1)), color-stop(100%, rgba(56,0,186,1)));
background: -webkit-linear-gradient(-45deg, rgba(43,2,138,1) 0%, rgba(56,0,186,1) 100%);
background: -o-linear-gradient(-45deg, rgba(43,2,138,1) 0%, rgba(56,0,186,1) 100%);
background: -ms-linear-gradient(-45deg, rgba(43,2,138,1) 0%, rgba(56,0,186,1) 100%);
background: linear-gradient(135deg, rgba(43,2,138,1) 0%, rgba(56,0,186,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2b028a', endColorstr='#3800ba', GradientType=1 );
}
.green{
	background: rgba(0,143,117,1);
background: -moz-linear-gradient(-45deg, rgba(0,143,117,1) 0%, rgba(0,184,153,1) 100%);
background: -webkit-gradient(left top, right bottom, color-stop(0%, rgba(0,143,117,1)), color-stop(100%, rgba(0,184,153,1)));
background: -webkit-linear-gradient(-45deg, rgba(0,143,117,1) 0%, rgba(0,184,153,1) 100%);
background: -o-linear-gradient(-45deg, rgba(0,143,117,1) 0%, rgba(0,184,153,1) 100%);
background: -ms-linear-gradient(-45deg, rgba(0,143,117,1) 0%, rgba(0,184,153,1) 100%);
background: linear-gradient(135deg, rgba(0,143,117,1) 0%, rgba(0,184,153,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#008f75', endColorstr='#00b899', GradientType=1 );
}


/*   Elementos del body    */

.titulo-articulo{
	font-size:2.5em;
	text-align:center;
}
.txt-blanco{
	color:#FFF;
}

/*      Menú de navegación      */

nav{
	position:fixed;
	left:0;
	top:150px;
	
}
nav>div{
	margin-bottom:10px;
	background-color:#F3C;
	font-family:'pocoyo';
	color:#ffffff;
	font-size:1.8em;
	padding:10px;
}

/*     Recursos Didácticos        */
#banner div{
	display:table;
	width:100%;
	height:100%;
}
#banner div>p{font-size:5em; margin:0 20px;}


/* botones */
.btn-segundo {
  background-color: hsl(266, 37%, 38%) !important;
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#8e6cbb", endColorstr="#5c3d84");
  background-image: -khtml-gradient(linear, left top, left bottom, from(#8e6cbb), to(#5c3d84));
  background-image: -moz-linear-gradient(top, #8e6cbb, #5c3d84);
  background-image: -ms-linear-gradient(top, #8e6cbb, #5c3d84);
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #8e6cbb), color-stop(100%, #5c3d84));
  background-image: -webkit-linear-gradient(top, #8e6cbb, #5c3d84);
  background-image: -o-linear-gradient(top, #8e6cbb, #5c3d84);
  background-image: linear-gradient(#8e6cbb, #5c3d84);
  border-color: #5c3d84 #5c3d84 hsl(266, 37%, 33%);
  color: #ffffff !important;
  font-weight:bold;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.33);
  -webkit-font-smoothing: antialiased;
}
.btn-tercero{
	  background-color: hsl(211, 72%, 28%) !important;
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#589be3", endColorstr="#13457a");
  background-image: -khtml-gradient(linear, left top, left bottom, from(#589be3), to(#13457a));
  background-image: -moz-linear-gradient(top, #589be3, #13457a);
  background-image: -ms-linear-gradient(top, #589be3, #13457a);
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #589be3), color-stop(100%, #13457a));
  background-image: -webkit-linear-gradient(top, #589be3, #13457a);
  background-image: -o-linear-gradient(top, #589be3, #13457a);
  background-image: linear-gradient(#589be3, #13457a);
  border-color: #13457a #13457a hsl(211, 72%, 19.5%);
  color: #ffffff !important;
  font-weight:bold;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.56);
  -webkit-font-smoothing: antialiased;
}
.btn-quinto {
  background-color: hsl(36, 92%, 40%) !important;
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#f6ab3b", endColorstr="#c37808");
  background-image: -khtml-gradient(linear, left top, left bottom, from(#f6ab3b), to(#c37808));
  background-image: -moz-linear-gradient(top, #f6ab3b, #c37808);
  background-image: -ms-linear-gradient(top, #f6ab3b, #c37808);
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f6ab3b), color-stop(100%, #c37808));
  background-image: -webkit-linear-gradient(top, #f6ab3b, #c37808);
  background-image: -o-linear-gradient(top, #f6ab3b, #c37808);
  background-image: linear-gradient(#f6ab3b, #c37808);
  border-color: #c37808 #c37808 hsl(36, 92%, 35%);
  color: #ffffff !important;
  font-weight:bold;
  text-shadow: 0 1px 1px rgba(255, 255, 255, 0.33);
  -webkit-font-smoothing: antialiased;
}
.btn-sexto {
  background-color: hsl(176, 76%, 31%) !important;
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#23e1d4", endColorstr="#128b83");
  background-image: -khtml-gradient(linear, left top, left bottom, from(#23e1d4), to(#128b83));
  background-image: -moz-linear-gradient(top, #23e1d4, #128b83);
  background-image: -ms-linear-gradient(top, #23e1d4, #128b83);
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #23e1d4), color-stop(100%, #128b83));
  background-image: -webkit-linear-gradient(top, #23e1d4, #128b83);
  background-image: -o-linear-gradient(top, #23e1d4, #128b83);
  background-image: linear-gradient(#23e1d4, #128b83);
  border-color: #128b83 #128b83 hsl(176, 76%, 26%);
  color: #fff !important;
  font-weight:bold;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.33);
  -webkit-font-smoothing: antialiased;
}
/*  Formularios  */

input, textarea{
	display: block;
    background: #fff;
    font: 1em/1.214em Arial, Helvetica, sans-serif;
    color: #444;
    width: 87%;
    padding: 0.75em 1.5em;
    border: 1px solid #DB9600;
    margin-left: 6%;
    margin-top: 2%;
    resize: none;
    -moz-box-shadow: inset 0 0px 3px rgba(0,0,0,0.75);
    -webkit-box-shadow: inset 0 0px 3px rgba(0,0,0,0.75);
    box-shadow: inset 0 0px 3px rgba(0,0,0,0.75);
	border-radius: 0.25em;
}
label{
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
	color:#333;
	font-size:14px;
	font-weight:normal;
}