/* ==========================================================================
   Author's custom styles
   ========================================================================== */

body.modulo1-book1 {
	background: url('../img/bd-bg-top.png') repeat-x, url('../img/body-bg.png') repeat #97c9e9;
}

body.modulo1-bookprocesos {
  background: url('') repeat-x, url('../img/body-bg.png') repeat #3c763d;
}

body.modulo1-bookinnovacion {
  background: url('') repeat-x, url('../img/body-bg.png') repeat #673ab7;
}

body.modulo1-book2 {
  background: url('../img/bd-bg-top-2.png') repeat-x #dae282;
}
body.modulo1-book3 {
  background: url('../img/bd-bg-top-3.png') repeat-x #fceeb3;
}
body.modulo1-book4 {
  background: url('../img/bd-bg-top-4.png') repeat-x #e4bfd7;
}
body.modulo1-book5 {
  background: url('../img/bd-bg-top-5.png') repeat-x, url('../img/body-bg-4.png') repeat #e7ad6d;
}
body.modulo1-book6 {
  background: url('../img/bd-bg-top-6.png') repeat-x, url('../img/body-bg-6.png') repeat-x #ccdbf1; 
}
body.modulo1-book7 {
  background: url('../img/bd-bg-top-7.png') repeat-x #d2cc8c;
}
body.modulo1-book8 {
  background: url('../img/bd-bg-top-8.png') repeat-x #c4c2e0;
}
body.modulo1-book9 {
  background: url('../img/bd-bg-top-9.png') repeat-x #c7da83;
}
body.modulo1-book10 {
  background: url('../img/bd-bg-top-10.png') repeat-x #c4c2e0
}
body.modulo1-book11 {
  background: url('../img/bd-bg-top-11.png') repeat-x #fff58a
}

footer {
  padding-bottom: 20px;
}

h2 {
  margin-top: 50px !important
}

.topm {
  cursor: pointer;
  margin-top: 10px;
}

.topm1 {
  cursor: pointer;
  margin-top: 80px;
}

#header {
	display: inline-block;
	width: 100%;
	max-height: 196px;
	position: relative;
}

.title {
    text-align: center;
    padding: 50px 0;
    float: left;
}

.title1 {
    text-align: left;
    padding: 50px 45px;
    float: left;
}

.attitud {
    padding-top: 10px;
    text-align: right;
}

.menu-items {
    text-align: center;
}

ul.menu-mod1 li {
  display: inline-block;
  width: 35%
}




/* Mod1-Book1-Act1 */

.tools {
  display: inline-block;
  text-align: center;
  padding-top: 30px;
  /* width: 20%;*/
}
.tools .title {
  display: block;
  width: 100%;
  padding: 0;
}

.tools button {
  border: 0px;
}


.save {
  background: url('../img/save.png');
  display: inline-block;
  width: 75px;
  height: 75px;
}

.finish {
  background: url('../img/finalizar.png');
  background-size: 100%;
    background-repeat: no-repeat;
  display: inline-block;
    width: 175px;
    height: 52px;
}

.print {
  background: url('../img/print.png');
  display: inline-block;
  width: 75px;
  height: 75px;
}

.tool-box {
  display: block;
  background: url('../img/toolbox.jpg') center center no-repeat;
  width: 205px;
  height: 387px;
  margin: 0 auto;
  /*margin-top: 20px;
  /*padding: 40px 10px;*/
}

.tool-box-calido {
  display: block;
  background: url('../img/toolbox.jpg') center center no-repeat;
  width: 205px;
  height: 231px;
  margin: 0 auto;
  /*margin-top: 20px;
  /*padding: 40px 10px;*/
}

.tool-box-color1 {
  display: block;
  background: url('../img/') center center no-repeat;
  width: 205px;
  /*height: 187px;*/
  margin: 0 auto;
  /*margin-top: 20px;
  /*padding: 40px 10px;*/
}

.tool-box-2 {
  display: block;
  background: url('../img/toolbox.jpg') center center no-repeat;
  width: 205px;
  height: 385px;
  margin: 0 auto;
  /*margin-top: 20px;
  /*padding: 40px 10px;*/
}
.tool-box-6 {
  display: block;
  background: url('../img/toolbox-6.png') center center no-repeat;
  width: 205px;
  height: 385px;
  margin: 0 auto;
  /*margin-top: 20px;
  padding: 40px 10px;*/
}
.tool-box-10 {
  display: block;
  background: url('../img/toolbox-10.png') center center no-repeat;
  width: 205px;
  height: 385px;
  margin: 0 auto;
  /*margin-top: 20px;
  padding: 40px 10px;*/
}
.tool-box-11 {
  display: block;
  background: url('../img/toolbox-11.png') center center no-repeat;
  width: 205px;
  height: 385px;
  margin: 0 auto;
  /*margin-top: 20px;
  padding: 40px 10px;*/
}
.tool-box-title {
  margin-bottom: 10px;
  margin-top:15px;
  width: 150px;
}
.tool-box4 {
  display: block;
  background: url(../img/toolbox4.jpg) center center no-repeat;
  width: 205px;
  height: 446px;
  margin: 0 auto;
  margin-top: 20px;
  padding: 40px 10px;
}
.pencils-box {
  display: block;
  width: 205px;
  height: 299px;
  margin: 0 auto;
  margin-top: 20px;
  padding: 40px 10px;
}
.pencils1 {
  background: url('../img/pencils-1.png');
  display: inline-block;
  width: 57px;
  height: 80px;
}
.pencils2 {
  background: url('../img/pencils-2.png');
  display: inline-block;
  width: 57px;
  height: 80px;
}
.pencils3 {
  background: url('../img/pencils-3.png');
  display: inline-block;
  width: 57px;
  height: 80px;
}
.pencils4 {
  background: url('../img/pencils-4.png');
  display: inline-block;
  width: 57px;
  height: 80px;
}
.pencils5 {
  background: url('../img/pencils-5.png');
  display: inline-block;
  width: 57px;
  height: 80px;
}
.pencils6 {
  background: url('../img/pencils-6.png');
  display: inline-block;
  width: 57px;
  height: 80px;
}
.pencils7 {
  background: url('../img/pencils-7.png');
  display: inline-block;
  width: 57px;
  height: 80px;
}
.pencils8 {
  background: url('../img/pencils-8.png');
  display: inline-block;
  width: 57px;
  height: 80px;
}
.pencils9 {
  background: url('../img/pencils-9.png');
  display: inline-block;
  width: 57px;
  height: 80px;
}

.pencil {
  background: url('../img/pencil.jpg');
  display: inline-block;
  width: 75px;
  height: 75px;
}

.pencil1 {
  background: url('../img/pencil1.png');
  display: inline-block;
  width: 75px;
  height: 75px;
}

.pencil2 {
  background: url('../img/delineador.png');
  display: inline-block;
  width: 75px;
  height: 75px;
}

.brush {
  background: url('../img/brush.jpg');
  display: inline-block;
  width: 75px;
  height: 75px;
}
.brush1 {
  background: url('../img/marcador.png');
  display: inline-block;
  width: 75px;
  height: 75px;
}

.brush2 {
  background: url('../img/pincelgris.png');
  display: inline-block;
  width: 75px;
  height: 75px;
}

.pallete {
  background: url('../img/pallete.jpg');
  display: inline-block;
  width: 75px;
  height: 75px;
}

.pallete1 {
  background: url('../img/gotero.png');
  display: inline-block;
  width: 75px;
  height: 75px;
}

.pallete2 {
  background: url('../img/pincel1.png');
  display: inline-block;
  width: 75px;
  height: 75px;
}


.eraser {
  background: url('../img/eraser.jpg');
  display: inline-block;
  width: 75px;
  height: 75px;
}
.zoom {
  background: url('../img/brushnew.png');
  display: inline-block;
  width: 75px;
  height: 75px;
}

.amarillo {
  background: url('../img/botonamarillo.png');
  display: inline-block;
  width: 75px;
  height: 75px;
}

.verde {
  background: url('../img/botonverde.png');
  display: inline-block;
  width: 75px;
  height: 75px;
}

.azul {
  background: url('../img/botonazul.png');
  display: inline-block;
  width: 75px;
  height: 75px;
}

.rojo {
  background: url('../img/botonrojo.png');
  display: inline-block;
  width: 75px;
  height: 75px;
}

.naranjado {
  background: url('../img/botonnaranjado.png');
  display: inline-block;
  width: 75px;
  height: 75px;
}

.morado {
  background: url('../img/botonmorado.png');
  display: inline-block;
  width: 75px;
  height: 75px;
}

.clarito {
  background: url('../img/clarito.png');
  display: inline-block;
  width: 75px;
  height: 75px;
}

.oscuro {
  background: url('../img/oscuro.png');
  display: inline-block;
  width: 75px;
  height: 75px;
}



.shapes {
  background: url('../img/zoom1.jpg');
  display: inline-block;
  width: 75px;
  height: 75px;
}
.rotate {
  background: url('../img/muestracolores.png');
  display: inline-block;
  width: 172px;
  height: 75px;
}

.rotate1 {
  background: url('../img/colorcitos.png');
  display: inline-block;
  width: 168px;
  height: 150px;
}
.shapes4 {
  background: url('../img/shapes-4.png');
  display: inline-block;
  width: 75px;
  height: 75px;
}

.teacher {
  margin: 10px 0;
}

.sound {
  background: url('../img/sound.png');
  display: inline-block;
  width: 36px;
  height: 41px;
  margin: 10px 20px;
}
.play {
  background: url('../img/play.png');
  display: inline-block;
  width: 31px;
  height: 41px;
  margin: 10px 20px;
}

.back {
  background: url('../img/back.png');
  display: inline-block;
  width: 76px;
  height: 59px;
  margin: 20px 0px;
  margin-top: 1px;
}

.next {
  background: url('../img/siguiente.png');
  display: inline-block;
  width: 76px;
  height: 59px;
  margin: 20px 0px;
}

.back4 {
  border: 0px;
  background: url('../img/back-4.png');
  display: inline-block;
  width: 76px;
  height: 59px;
  margin: 20px 0px;
}
.menu6 {
  border: 0px;
  background: url('../img/menu.png');
  display: inline-block;
  width: 77px;
  height: 58px;
  margin: 20px 0px;
  margin-top: 1px;
}
.salir10 {
  border: 0px;
  background: url('../img/salir.png');
  display: inline-block;
  width: 77px;
  height: 58px;
  margin: 20px 0px;
  margin-top: 1px;
}

.options {
  display: inline-block;
  width: 100%;
  vertical-align: top;
  text-align: center;
  padding-top: 30px;
}
.options li {
  display: inline-block;
  width: 40%;
  margin: 10px 0px;
  list-style-type: none;
}

form.activiy-resgister {
    /* background: url(../img/form.png) center center; */
  text-align: center;
  /*margin: 0 auto;*/
  margin-top: 20px;
  margin-left: 220px;
  background: white;
  height: 39px;
  width: 670px;
  padding: 3px 20px;
  border-radius: 5px;
  box-shadow: 4px 5px 0px #648ba8;
}

form.activiy-resgister1 {
    /* background: url(../img/form.png) center center; */
  text-align: center;
  /*margin: 0 auto;*/
  margin-top: 25px;
  margin-left: 220px;
  background: white;
  height: 39px;
  width: 670px;
  padding: 3px 20px;
  border-radius: 5px;
  box-shadow: 4px 5px 0px #648ba8;
}

form.activiy-resgister input {
    border: 0px;
    border-bottom: 1px solid #a5d6f6;
}
.name {
  width: 250px;
}
.code, .group, .teacher-code {
  display: inline-block;
  width: 120px;
}

form.activiy-resgister1 input {
    border: 0px;
    border-bottom: 1px solid #a5d6f6;
}
.name {
  width: 250px;
}
.code, .group, .teacher-code {
  display: inline-block;
  width: 120px;
}


/* FORMULARIOS */

.menu-indes {
  background: #bcdbef;
  border-radius: 30px;
  box-shadow: 5px 2px 1px #86afcd;
  text-align: center;
  width: 720px;
  height: auto;
  margin: 0 auto;
  margin-top: 35px; 
  display: block;
  padding: 30px 15px 10px;
}

.menu-indesproc {
    background: #dff0d8;
    border-radius: 30px;
    box-shadow: 5px 2px 1px #86afcd;
    text-align: center;
    width: 720px;
    height: auto;
    margin: 0 auto;
    margin-top: 35px;
    display: block;
    padding: 30px 15px 10px;
}

.logos {
  display: table;
  width: 100%
}
.logos li {
  display: table-cell;
  width: 38%;
  margin: 0 20px;
}

form.login {
  margin: 40px 30px;
  display: block;
  background: rgba(255, 255, 255, 0.5);
  border-radius: 10px;
  text-align: center;
  padding: 15px;
}
form.login h2 {
  margin-bottom: 30px;
}

form.login input {
  display: block;
  margin: 0 auto;
  margin-top: 10px;
  width: 60%;
  text-align: center;
  padding: 5px;
  border-radius: 5px;
  border: 1px solid blue;
  
}

button.submit {
  background: #86afcd;
  border: 0px;
  padding: 8px 40px;
  margin: 10px 0;
  width: 60%;
  color: white;
  font-size: 16px;
  font-weight: bold;
  border-radius: 5px;
}


input.teacher {
  background: #86afcd;
  border: 0px !important;
  padding: 8px 40px !important;
  margin-top: 10px !important;
  color: white;
  font-size: 16px;
  font-weight: bold;
  margin-bottom: 30px !important;
  border-radius: 5px;
}

.login p {
  width: 70%;
  text-align: center;
  margin: 0 auto;
}

.school-int, .location, .details, .hours {
  width: 100%;
  display: block;
  margin: 20px 0;
  text-align: left;
  padding: 0 20px;
}
.name-school {
  display: block;
}

input.institucion {
  border: 0px;
  width: 350px;
  margin-right: 30px;
  padding: 8px;
}

input.institucion1 {
  border: 0px;
  width: 100%;
  margin-right: 30px;
  padding: 8px;
}

select#pais, select#estado, select#ciudad, select#profesor{
  max-width: 140px !important;
  border: 0px;
  margin-right: 12px;
  padding: 8px;
}

.details input {
  width: 210px;
}

input.address {
    margin-right: 20px;
}

.address {
  display: inline-block;
  width: 58%;
}
.phone {
  display: inline-block;
  width: 40%;
}

.address label, .phone label {
  display: block;
}

.address input {
  width: 350px;
  border: 0;
  padding: 8px;
}

.phone input, .email select {
  width: 100%;
  border: 0;
  padding: 8px;
}

.website {
  margin-right: 20px;
}
.website, .email {
  width: 48%;
  display: inline-block;
}

.website label, .email label {
  display: block;
}

.website input, .email input {
  width: 100%;
  display: block;
  border: 0px;
  padding: 8px;
}

.hours label {
  display: block;
}

.hours input:first-child {
  margin-right: 0px !important;
}
.hours input {
  margin-left: 40px;
}

input.form-btn {
  background: #86afcd;
  border: 0px !important;
  padding: 8px 40px;
  margin-top: 20px;
  color: white;
  font-size: 16px;
  font-weight: bold;
  margin-bottom: 30px;
  border-radius: 5px;
}

p.disclaimer {
  width: 60%;
  margin: 0 auto;
}

.name-teachers, .lastname, .id-number, .mobile-phone, .email-teachs, .birthday, .decision, .schedule, .experience, .institution-belong, .school-name, .grade, .std-teach-name, .std-teach-lname {
  display: inline-block;
  width: 48%
}
.name-teachers, .id-number, .email-teachs, .decision, .experience, .school-name, .std-teach-name {
  margin-right: 10px;
}

.name-teachers input, .lastname input, .id-number input, .mobile-phone input, .email-teachs input, .birthday input, .decision input, .schedule input, #desdeotro input, .experience input, .institution-belong input, .school-name input, .devep input, .std-teach-name input, .std-teach-lname input {
  width: 100% !important;
  margin-right: 30px !important;
  padding: 8px !important;  
  border: 0px !important;
  border-radius: 0px !important;
}

.institution-belong select#institucion {
  width: 100%;
}

.academy {
  display: block;
}
.decision input {
  display: inline-block !important;
  width: 20px !important;
  margin-right: 10px !important;
}

.lines input {
  display: inline-block !important;
  width: 20px !important;
  margin-right: 30px !important;
}
.lines2 input {
  display: inline-block !important;
  width: 20px !important;
  margin-right: 30px !important;
}

.experience {
  vertical-align: top;
}
select#institucion, select#grados, select#grade, select#profesor {
  border: 0px;
  margin-right: 12px;
  padding: 8px;
  margin-top: 10px;
}

.lines {
  width: 48%;
  display: inline-block;
}

.lines1 {
  width: 24%;
  display: inline-flex;
}

.lines2 {
  width: 100%;;
}

.lines3 {
  width: 45%;
  display: inline-flex;
}

.save {
  margin-top: 30px !important;
}

.student {
  margin-bottom: 20px;
  display: block;
}
.student input {
  border-radius: 0px !important;
  border: 0px !important;
  padding: 8px !important;
}
.student-disclaimer {
  width: 80% !important;
  margin-bottom: 40px !important;
}

.std-pais, .std-dpto, .std-city {
  display: inline-block;
  width: 32%;
}

.devep {
  width: 98%
}

.details span {
  font-weight: bold;
  float: left;
  width: 85px;
}

.details-std {
  display: inline-block;
  width: 84%;
}

.details input {
  background: url() center bottom repeat-x;
}

.example-buttons {
  text-align: right;
  max-width: 924px;
  width: 920px;
  margin: 0 auto;
  margin-top: 20px;
}

.example-buttons li {
  cursor: pointer;
  list-style-type: none;
  display: inline-block;
}
.example-buttons li:last-child {
  cursor: pointer;
}

.bottom-list {
  display: block;
  width: 920px;
  margin: 0 auto;
}
.example-buttons-4 {
  display: inline-block;
  text-align: right;
  vertical-align: text-bottom;
  width: 90%;
}
.example-buttons-4 li {
  cursor: pointer;
  list-style-type: none;
  display: inline-block;
}

.canvas-act5-2 {
  display: inline-block;
}

.example-buttons-7 {
  display: inline-block;
  text-align: right;
  width: 85%;
  margin: 20px 0;
}
.example-buttons-7 li {
  cursor: pointer;
  list-style-type: none;
  display: inline-block;
}
.example-buttons-7 li:last-child {
  cursor: pointer;
}
.eraser-sheet {
  display: inline-block;
  width: 130px;
}

.eraser-sheet li {
  cursor: pointer;
  display: inline-block;
}

.pictures {
  background: url('../img/shapes.jpg');
  display: inline-block;
  width: 75px;
  height: 75px;
}

.pictures1 {
  background: url('../img/shapes-4.png');
  display: inline-block;
  width: 75px;
  height: 75px;
}

.pictures2 {
  background: url('../img/simbolos.png');
  display: inline-block;
  width: 75px;
  height: 75px;
}

.pictures3 {
  background: url('../img/tresd.png');
  display: inline-block;
  width: 75px;
  height: 75px;
}

.pictures4 {
  background: url('../img/bocaboton.png');
  display: inline-block;
  width: 75px;
  height: 75px;
}

.pictures5 {
  background: url('../img/ojosboton.png');
  display: inline-block;
  width: 75px;
  height: 75px;
}

.pictures6 {
  background: url('../img/botonfiguras.png');
  display: inline-block;
  width: 75px;
  height: 75px;
}

.pictures7 {
  background: url('../img/letras.png');
  display: inline-block;
  width: 75px;
  height: 75px;
}

.pictures8 {
  background: url('../img/rompecabezas.png');
  display: inline-block;
  width: 75px;
  height: 75px;
}

.pictures9 {
  background: url('../img/miro.png');
  display: inline-block;
  width: 75px;
  height: 75px;
}

.carousel-inner.onebyone-carosel { margin: auto; width: 90%; }
.onebyone-carosel .active.left { left: -33.33%; }
.onebyone-carosel .active.right { left: 33.33%; }
.onebyone-carosel .next { left: 33.33%; }
.onebyone-carosel .prev { left: -33.33%; }

.carousel_pictures {
    display: none;
}

.carousel_pictures1 {
    display: none;
}

.controls {
    display: flex;
}

.pictures-item {
    cursor: pointer;
}

.pictures-item1 {
    cursor: pointer;
}


button.sound.show {
    display: inline-block !important;
}

button.sound.hide {
    display: inline-block !important;
}



.password.animated.zoomIn {
    position: absolute;
    left: 180px;
    width: 320px;
    background: white;
    padding: 20px;
    border-radius: 10px;
    bottom: 25px;
    border: 3px solid gray;
    z-index: 123;
    box-shadow: 2px 2px 10px gray;
}

.container {
  position: relative;
}
.proffesor {
  position: fixed;
  /*right: -60px;*/
  z-index: 999;
  top: 25%;
}

.proffesor1 {
  position: absolute;
  right: 0px;
  z-index: 999;
  top: 70px;
}
.proffesor button {
  border: 0px;
}

.proffesor1 button {
  border: 0px;
}

.finalizar {

  text-align: center;
    padding-top: 10px;
    list-style-type: none;
}

.finalizar li  {

  text-align: center;
    padding-top: 10px;
    list-style-type: none;
    
}

.finalizar img {

  text-align: center;
    list-style-type: none;
    width: 130px;
    height: 40px; 
}

.square {
  background: url('../img/gotero.png');
  display: inline-block;
  width: 75px;
  height: 75px;
}


.logo{
    width:150px;
    margin: 15px;
    position:relative;
    top:-10px;
}

.square-colors{
    background:#b3d458;
    border-radius:20px;
    padding:2px;
       
}

.square-colors1{
    background:#EF7C00;
    border-radius:20px;
    padding:2px;
       
}

.square-white {
    margin-bottom:30px;
}

table{
    margin-left:30px;
}

.item{
    margin:5px;
}

.title-square{
    text-align:center;
    font-weight:bolder;
}

.elements{
    margin:10px 0px;
}

.image-plus{
    width:25px;    
    cursor:pointer;
}

.image-plus:first-child{
    margin-right:25px;
    margin-left:5px;
}

.nav-div{
    position:relative;
    top:-110px;
    right:170px;
}

.nav-image:first-child{
    margin-right: 100px;
    margin-left: -20px;    
}

.nav-image{
    cursor:pointer;
}

.markers{
    position: absolute;
    top: 60px;
}

.paint-div{
    position:relative;
    top:-258px;
}

.container1 {
    padding-right: 15px;
    padding-left: 15px;
    /* margin-right: auto; */
    margin-left: 150px;
}

#square_transparent {
  background-size: 86px 61px;
  background-color: #fff;
}