/*DIV CON SUBTITULO IMAGEN*/
.divChupete{
    float:left;
    text-align:center;
    width: 75px;
    height: 95px;
    border: 2px solid white; 
    border-radius: 5px;
}
.divChupete:hover{
    border: 2px solid #E4E4E4; 
    border-radius: 5px;
    cursor: pointer;
}

/*ESTILO DEL COLLAPSE MOVIL*/
.accordion-group{
    /*border: 1px solid #878787;*/
    border: 1px solid white;
    border-bottom: 1px solid #D2D0D0;
    border-top: 1px solid #D2D0D0;
    margin-bottom: 5px;
}
.accordion-toggle{
    background-color: #F0F0F0;
    /*margin-right: 15px;*/
    background-image: url("../images/Configurador/flecha_up_2022.png"); 
    background-repeat: no-repeat;
    background-position: right;  
}
.accordion-toggle.collapsed{
    background-image: url("../images/Configurador/flecha_down_2022.png"); 
}
.accordion-body.in.collapse{
    padding-bottom: 20px;
}
/*ESTILO DE LA PANTALLA DE CONFIGURADOR*/
#opacity-cover-producto-popup {
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0.4);
    display: none;
    height: 100%;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 100000000;
}

#opacity-cover-producto-popup h5.principal_add_product {
    background: none repeat scroll 0 0 #e2007a;
    border-top-left-radius: 5px;
    color: #fff;
    margin: 0;
    padding: 20px 20px 20px 40px;
    position: relative;
}
.marco{
    margin-top:30px;
    /*
    -webkit-box-shadow: 0px 0px 5px 0px rgba(50, 50, 50, 0.63);
    -moz-box-shadow:    0px 0px 5px 0px rgba(50, 50, 50, 0.63);
    box-shadow:         0px 0px 5px 0px rgba(50, 50, 50, 0.63);


   background: rgba(201,201,201,1);
    background: -moz-linear-gradient(left, rgba(201,201,201,1) 0%, rgba(230,230,230,1) 18%, rgba(230,230,230,1) 54%, rgba(230,230,230,1) 85%, rgba(201,201,201,1) 100%);
    background: -webkit-gradient(left top, right top, color-stop(0%, rgba(201,201,201,1)), color-stop(18%, rgba(230,230,230,1)), color-stop(54%, rgba(230,230,230,1)), color-stop(85%, rgba(230,230,230,1)), color-stop(100%, rgba(201,201,201,1)));
    background: -webkit-linear-gradient(left, rgba(201,201,201,1) 0%, rgba(230,230,230,1) 18%, rgba(230,230,230,1) 54%, rgba(230,230,230,1) 85%, rgba(201,201,201,1) 100%);
    background: -o-linear-gradient(left, rgba(201,201,201,1) 0%, rgba(230,230,230,1) 18%, rgba(230,230,230,1) 54%, rgba(230,230,230,1) 85%, rgba(201,201,201,1) 100%);
    background: -ms-linear-gradient(left, rgba(201,201,201,1) 0%, rgba(230,230,230,1) 18%, rgba(230,230,230,1) 54%, rgba(230,230,230,1) 85%, rgba(201,201,201,1) 100%);
    background: linear-gradient(to right, rgba(201,201,201,1) 0%, rgba(230,230,230,1) 18%, rgba(230,230,230,1) 54%, rgba(230,230,230,1) 85%, rgba(201,201,201,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c9c9c9', endColorstr='#c9c9c9', GradientType=1 );
   */


   -webkit-box-shadow: 0px 0px 5px 0px rgba(100, 100, 100, 0.63);
    -moz-box-shadow:    0px 0px 5px 0px rgba(100, 100, 100, 0.63);
    box-shadow:         0px 0px 5px 0px rgba(100, 100, 100, 0.63);

   background: #f0f0f0;


}/*
.botonesEditor{                               
    background: rgba(255,255,255,1);
    background: -moz-radial-gradient(center, ellipse cover, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 73%, rgba(237,237,237,1) 100%);
    background: -webkit-gradient(radial, center center, 0px, center center, 100%, 0%, color-stop(0%, rgba(255,255,255,1)), color-stop(73%, rgba(246,246,246,1)), color-stop(100%, rgba(237,237,237,1)));
    background: -webkit-radial-gradient(center, ellipse cover, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 73%, rgba(237,237,237,1) 100%);
    background: -o-radial-gradient(center, ellipse cover, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 73%, rgba(237,237,237,1) 100%);
    background: -ms-radial-gradient(center, ellipse cover, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 73%, rgba(237,237,237,1) 100%);
    background: radial-gradient(ellipse at center, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 73%, rgba(237,237,237,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ededed', GradientType=1 );
    border-radius: 3px;
    padding:5px 2px;
    border: 1px solid transparent;
    margin-right: 5px;
    margin-top: 5px;
    text-align: center;
}*/

#seccion-banner .titulo {
    position:relative;
    left:0px;
    bottom:0px;
}
.botonesEditor:hover{cursor: pointer;/*border:solid 1px #BFBDBD;text-align: center;*/}
.seleccionado{
    outline: 1px solid #9F9E9E;
    border-radius: 3px;
}

.deseleccionado{
    border-radius: 3px;

}
#imagenMover:hover{cursor: move;outline: 1px solid #0090d2; }
.simulador:hover{cursor: move;outline: 1px solid #0090d2; }
.simulador{
    font-family: comic sans ms,sans-serif;
}
.editable{
    cursor: text !important;
    background:#FFFF99;
    outline: 2px dashed #0090d2 !important;
}
.chupeteSimulador{
    /*border-radius: 3px;
    -webkit-box-shadow: 0px 0px 5px 0px rgba(50, 50, 50, 0.63);
    -moz-box-shadow:    0px 0px 5px 0px rgba(50, 50, 50, 0.63);
    box-shadow:         0px 0px 5px 0px rgba(50, 50, 50, 0.63);*/
}
.imagenChupete{
    height: 50px;
    margin: 0 10px;
}

.btnColor{
     background: white;
   border-radius: 10px;
    padding:5px 2px;
    border: 1px solid transparent;
    margin-bottom: 5px;
    padding:2px;

}
.btnColor:hover{cursor: pointer;}
.spanNombreBoton{font-size: 14px;font-weight: bold;}
.btnSeleccionado{
   /*background: #DCD9D9;*/
    /*border:1px solid #BFBDBD;
    border-radius:8px;*/

    /*border:1px solid #e2007a;border-radius:8px;
    border-bottom: 1px solid #EBEBEB;
    border-bottom-right-radius: 0px;
    border-bottom-left-radius: 0px;
    bottom: -1px;position: relative;*/
}
.toolbarPrincipal{text-align: center;background-color: white;}
.toolbarSecundaria{
   /* background: #DCD9D9;
    border:1px solid transparent;
    border-radius:8px;*/
    /*padding: 5px;*/
   /* margin-top:3px;*/
  /*  border-top:1px solid #e2007a;*/
   /* border-radius: 5px;*/
}
#cuadroColor{
  /*width: 32px;
  height: 30px;
  border: 1px solid #949393;
  background:black;  
  margin: auto;*/
 border-radius: 50%;
 width: 40px;
height: 40px;
background: black;
margin:auto;
margin-top: 20px;
}
.flotante{
      border-radius: 50%;
        width: 50px;
       height: 50px;
       background: #989696;
       margin:auto;
       margin-top: 20px;
       opacity: 0.65;
      margin:0px 10px;
}

.btnFontStile{
    background: transparent;
}
.btnFontStile:hover{
cursor: auto;
border: 1px solid transparent;
}
#fonts{
    font-family:comic sans ms,sans-serif;
}
.listaTipos div:hover{
    background: #E3E3E3;
    cursor: pointer;
}
.listaTipos{
     border: 1px solid #F0C49B;
   border-radius: 4px;
    background: #ECECEC;

    /*text-align: center;*/
}
.tipo{
    text-align: center;
    /*font-size: 20px;
    margin-top: 5px;*/
}
.btnAlignSelect{
    border:1px solid #BFBDBD;
    border-radius:8px;
}
.btnColorSeleccionado{
    border:1px solid #EC89BC;border-radius:8px;padding:2px;
}
.btnColorSeleccionado:hover{
    /*border:1px solid #e2007a;border-radius:8px;padding:2px;*/
}
.generando{
    /*top:0px;
    left:0px;*/
    display:none;
    margin-left: -5px;
    margin-top: -5px;
    /*margin-top: 30px;*/
    padding: 5px; 
    border-radius: 3px;
    z-index: 100;
    position:absolute;
    text-align: center;
   background-color:rgba(0,0,0,0.3);
   color:white;
   height: 100%;
}
.movimiento:hover{
    cursor:pointer;
}
.movimiento{
    height: 35px; 
}
.lato{
    font-family: 'Lato', sans-serif;
}
 .imgIcono:hover{
    background: #E4E4E4; 
    border-radius: 5px;
    cursor: pointer;
 }
 .imgChupete{
     border: 2px solid white;
 }
 .imgChupete:hover{
    /*border: 2px solid #E4E4E4; 
    border-radius: 5px;
    cursor: pointer;*/
 }
 .modalConf{/*
   width: 55%;
    left: 22%; 

    margin-left:auto;
    margin-right:auto; */
 }
 div#responsive_configurator{
        float: left;
        width: 100%;
        /*margin-top:10px;*/
    }
    div#responsive_configurator ul{
        float: left;
        width: 100%;
        margin-bottom: -1px;
    }
    div#responsive_configurator ul li{
        -webkit-box-sizing:border-box;
        -moz-box-sizing:border-box;
        box-sizing:border-box;
        float:left;
        /*width: 100px;
        height:100px;*/
        max-width: 148px;
        width:33.333%;
        height: 100px;
        overflow: hidden;
        margin:0;
        padding:0;
        border:1px solid #cccccc;
        margin-top:-1px;
        color: #606060;
        font-family: "Lato",sans-serif;
        /*font-weight: bold;*/
    }
    div#responsive_configurator ul li a{
        text-align: center;
        display: block;
        width: 100%;
        height: 100%;
        font-size: 13px;
        color: #606060;
        font-family: "Lato",sans-serif;
        font-weight: bold;
    }
    div#responsive_configurator #txtFont{
        text-align: center;
        display: block;
        width: 100%;
        height: 100%;
        font-size: 13px;
        color: #606060;
        font-family: "Lato",sans-serif;
        font-weight: bold;
    }
    div#responsive_configurator ul li a img{
        padding-top:17px;

        height: 40px;
    }
    #SinBorde{border:1px solid white !important;}
    .btnSeleccionado{
    color: #E6007E !important;
    }
    /*.move
        {
            position:absolute;

            -webkit-transition: -webkit-transform 0.35s ease-in-out 0.0s;  
                -ms-transition:     -ms-transform 0.35s ease-in-out 0.0s;  
               -moz-transition:    -moz-transform 0.35s ease-in-out 0.0s;  
                 -o-transition:      -o-transform 0.35s ease-in-out 0.0s;  
                    transition:         transform 0.35s ease-in-out 0.0s;  
        }

        .move:hover
        {
            -webkit-transform: scale(1.2);
                -ms-transform: scale(1.2);
               -moz-transform: scale(1.2);
                 -o-transform: scale(1.2);
                    transform: scale(1.2);

            -webkit-transition: -webkit-transform 0.35s ease-in-out 0.0s;  
                -ms-transition:     -ms-transform 0.35s ease-in-out 0.0s;  
               -moz-transition:    -moz-transform 0.35s ease-in-out 0.0s;  
                 -o-transition:      -o-transform 0.35s ease-in-out 0.0s;  
                    transition:         transform 0.35s ease-in-out 0.0s;  
        }*/
    .btnFlotantes{display:none;}
     /* #slider2_container{
        margin-top: 20px;
        display:none !important;
    } #slider3_container{
        margin-top: 20px;
        display:none !important;
    }*/
     .radio-toolbar label{text-align:center;}
      .radio-toolbar span{margin-left:5px;}
      .capaImgTetina{
          background: #EBEBEB;
          border-radius: 50%;
          border: solid 2px #EBEBEB;
      }
      .tetinaSeleccionada .capaImgTetina{
          background: #FBC4E2;
          border-radius: 50%;
          border: solid 2px #FBC4E2;
      }
      .tetinaSeleccionada .nombreTetina{
          color:#E2007A;
      }
      #desciptionDiv ul{ padding-left:40px !important;}
     /* #desciptionDiv li{ color:#D80073 !important;}*/
     #bannerTitulo{
         margin-bottom: 40px;
     }
/*TABLET*/
@media (max-width:1024px){    
      #divPanel{
          width: 100%;
          }
}
/*MOBILE*/
@media (max-width:767px){
    #bannerTitulo{
         margin-bottom: 120px;
     }
    .marco{
       margin-top:-60px;
       box-shadow: none;
       border-bottom: 1px solid #D2D0D0;
    }
    .tituloPaso3{
        text-align: left;
        margin-left: 20px;
        background-image: url("../images/Configurador/flecha_up.png"); 
        background-repeat: no-repeat;
        background-position: right;  
        margin-right: -5px;
    }
    .panelEscritorio{display:none !important;}
    .btnSeleccionado{
background: #E6007E !important;
}
    .btnFlotantes{display:block !important;}
      #divPanel{
          width: 100%;
          }
        .toolbarPrincipal div{/*
            width: 30% !important;
            float:left !important;*/
        }
        .btnColor{
             width: 23% !important;
              float:left !important;
              margin: 0 8px;
        }
        .toolbarText div{/*
            width: 30% !important;
            float:left !important;*/
        }
        .toolbarIcon div{/*
            width: 30% !important;
            float:left !important;*/
        }
        #cuadroColor{
        }

        #sidebar-personalizar{display:none;}
        .numero{color: #E2007A;
        font-size: 18px;}
        #select_tetinas{width: 90% !important;}
        #pagina-personalizar .content{
        margin-left: 5%;}
        #chupetes{width: 100%;}
        .span4{margin-bottom: 20px;}
        .btnColor{float: none !important;margin:4px;width: auto !important;display: inline-block;}
        .imagenChupete{height: 45px; margin:4px;}
        .ocultarPhone{display:none;}
        .izq{margin-left:10px;}

}