﻿:focus {
    outline: none;
}

/*idea 2015 */
/*canvas{
 -webkit-filter: blur(4px);
 -moz-filter: blur(4px);
  filter: blur(4px);
}
*/
.anuncios-extra
{
    margin-bottom:15px;
}

.modal_alerta img {
    display: block;
    margin: auto;
    max-width: 100%;
    height: auto;
}

.cargando_alertas {
    position: fixed;
    z-index: 999999999;
    bottom: 15px;
    right: 15px;
    background-color: #d9edf7;
    color: #337ab7;
    padding: 3px 8px;
    border: solid 1px;
    font-size: 12px;
    padding: 7px;
    border-radius: 5px;
}

    .cargando_alertas.alertError {
        background-color: #f5cdcd;
        color: #b73333;
    }

    .btn-cal-creditos {
        display: block !important;
        border-radius: 50%;
        width: 30px;
        height: 30px;
        margin: auto;
        padding: 0;
        background: #f8c717;
        border-color: white;
        box-shadow: none;
        color: white;
    }

.showpass
{
    padding-left: 4px;
    padding-right: 20px;
}

.showpass + .form-control-feedback
{
    line-height: 33px;
    width: 20px;
    right: 2px;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
    transition:all .5s linear;
    pointer-events:unset;
}

.showpass + .form-control-feedback:hover
{
    cursor:pointer;
    color:black;
}

#myCarouselPatro div[class^='col'] {
    height: 100%;
    display: flex;
    justify-content: flex-end;
    flex-direction: column;
}

#myCarouselPatro .item
{
    height:185px;
}

.high-school-exercise .row {
    margin: 0;
}

.col-left-zero
{
    padding-left:0
}
.marginTop10
{
    margin-top:10px;
}
.inline-block{
    display:inline-block
}

.marginBot10
{
    margin-bottom:10px;
}
.warning-text
{
    color:white;
}

/*ANIVERSARIO o DIA NINO*/
/*CURSOR    */

/*body{
    cursor:url('https://sofiaxtv2.blob.core.windows.net/imagenes/interfaz/home/misc/CURSOR-NINO.png') 6 3, auto !important;
}*/

/*body{
    cursor:url('https://sofiaxtv2.blob.core.windows.net/imagenes/interfaz/home/misc/CURSOR-SOFIA.png') 6 3, auto;
}

body a:hover, body button:hover, body .btn:hover
{
    cursor:url('https://sofiaxtv2.blob.core.windows.net/imagenes/interfaz/home/misc/POINTER-SOFIA.png') 6 3, auto;
}*/

/*END CURSOR*/

/*.marco-avatar
{
    position:relative;
}

.marco-avatar .thumbnail
{
    border-color:transparent;
    border-radius: 15px;
}*/

/*.marco-avatar:before {
    content: "";
    background-image: url(https://sofiaxtv2.blob.core.windows.net/imagenes/interfaz/home/misc/MARCO.png);
    background-image: url(https://sofiaxtv2.blob.core.windows.net/imagenes/interfaz/home/misc/MARCO-NINO.png) !important;
    background-repeat: no-repeat;
    background-size: 120px;
    width:100%;
    height:100%;
    position:absolute;
}*/

/*@media(min-width:992px)
{
    .marco-avatar:before {
        background-size:175px;
    }
}

@media(min-width:1200px)
{
    .marco-avatar:before {
        background-size:225px;
    }
}*/

/*ANIVERSARIO*/


#loaderDotL2 {
    position: fixed;
    height: 200px;
    width: 200px;
    top: -50%;
    left: 50%;
    transform: translate(-50%);
    -moz-transition: all 1s linear;
    -o-transition: all 1s linear;
    -webkit-transition: all 1s linear;
    transition: all 1s linear;
}

#loaderDotL2 .dot {
    bottom: 0;
    height: 100%;
    left: 0;
    margin: auto;
    position: absolute;
    right: 0;
    top: 0;
    width: 87.5px;
}
#loaderDotL2 .dot::before {
    border-radius: 100%;
    content: "";
    height: 87.5px;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    transform: scale(0);
    width: 87.5px;
}
#loaderDotL2 .dot:nth-child(7n+1) {
    transform: rotate(45deg);
}
#loaderDotL2 .dot:nth-child(7n+1)::before {
    animation: 0.8s linear 0.1s normal none infinite running loadDotL1;
    background: #ec2c39 none repeat scroll 0 0;
}
#loaderDotL2 .dot:nth-child(7n+2) {
    transform: rotate(90deg);
}
#loaderDotL2 .dot:nth-child(7n+2)::before {
    animation: 0.8s linear 0.2s normal none infinite running loadDotL1;
    background: #f15b28 none repeat scroll 0 0;
}
#loaderDotL2 .dot:nth-child(7n+3) {
    transform: rotate(135deg);
}
#loaderDotL2 .dot:nth-child(7n+3)::before {
    animation: 0.8s linear 0.3s normal none infinite running loadDotL1;
    background: #f78d27 none repeat scroll 0 0;
}
#loaderDotL2 .dot:nth-child(7n+4) {
    transform: rotate(180deg);
}
#loaderDotL2 .dot:nth-child(7n+4)::before {
    animation: 0.8s linear 0.4s normal none infinite running loadDotL1;
    background: #ee78aa none repeat scroll 0 0;
}
#loaderDotL2 .dot:nth-child(7n+5) {
    transform: rotate(225deg);
}
#loaderDotL2 .dot:nth-child(7n+5)::before {
    animation: 0.8s linear 0.5s normal none infinite running loadDotL1;
    background: #c21d85 none repeat scroll 0 0;
}
#loaderDotL2 .dot:nth-child(7n+6) {
    transform: rotate(270deg);
}
#loaderDotL2 .dot:nth-child(7n+6)::before {
    animation: 0.8s linear 0.6s normal none infinite running loadDotL1;
    background: #1873ba none repeat scroll 0 0;
}
#loaderDotL2 .dot:nth-child(7n+7) {
    transform: rotate(315deg);
}
#loaderDotL2 .dot:nth-child(7n+7)::before {
    animation: 0.8s linear 0.7s normal none infinite running loadDotL1;
    background: #25bfd7 none repeat scroll 0 0;
}
#loaderDotL2 .dot:nth-child(7n+8) {
    transform: rotate(360deg);
}
#loaderDotL2 .dot:nth-child(7n+8)::before {
    animation: 0.8s linear 0.8s normal none infinite running loadDotL1;
    background: #20b476 none repeat scroll 0 0;
}

#loaderDotL1 .lading {
    /*background-image: url("../images/loading.gif");*/
    background-position: 50% 50%;
    background-repeat: no-repeat;
    position: absolute;
    left: 0;
	right: 0;
    bottom: -40px;
    width: 180px;
	height: 20px;
}

#loaderDotL2.out
{
    opacity:0
}

@keyframes loadDotL1 {
    100% {
        opacity: 0;
        transform: scale(1);
    }
}
@keyframes loadDotL1 {
    100% {
        opacity: 0;
        transform: scale(1);
    }
}

.loader_txt_msg {
  animation: blinkerL11 1s linear infinite;
}

@keyframes blinkerL11 {  
  0% { opacity: 0.2; }
  50% { opacity: 1; }
  100% { opacity: 0.2; }
}

@keyframes snow {
 0% {background-position: 0 0;}
 100% {background-position: 500px 1000px, 400px 400px, 300px 300px;}
}
 
@-moz-keyframes snow {
 0% {background-position: 0 0;}
 100% {background-position: 500px 1000px, 400px 400px, 300px 300px;}
}
 
@-webkit-keyframes snow {
0% {background-position: 0 0;}
 100% {background-position: 500px 1000px, 400px 400px, 300px 300px;}
}
 
@-ms-keyframes snow {
 0% {background-position: 0 0;}
 100% {background-position: 500px 1000px, 400px 400px, 300px 300px;}
}

@-webkit-keyframes wobble {
    25% {
        -moz-transform: rotate(4deg);
        -ms-transform: rotate(4deg);
        -o-transform: rotate(4deg);
        -webkit-transform: rotate(4deg);
        transform: rotate(4deg);
    }
    75% {
        -moz-transform: rotate(-2deg);
        -ms-transform: rotate(-2deg);
        -o-transform: rotate(-2deg);
        -webkit-transform: rotate(-2deg);
        transform: rotate(-2deg);
    }
}

@keyframes wobble {
    25% {
        -moz-transform: rotate(4deg);
        -ms-transform: rotate(4deg);
        -o-transform: rotate(4deg);
        -webkit-transform: rotate(4deg);
        transform: rotate(4deg);
    }
    75% {
        -moz-transform: rotate(-2deg);
        -ms-transform: rotate(-2deg);
        -o-transform: rotate(-2deg);
        -webkit-transform: rotate(-2deg);
        transform: rotate(-2deg);
    }
}

@-webkit-keyframes flyUp {
	75% { opacity: 1;}
    100% {
        -webkit-transform: translateY(-1000px) rotate(20deg);
        -moz-transform: translateY(-1000px) rotate(20deg);
        -ms-transform: translateY(-1000px) rotate(20deg);
        -o-transform: translateY(-1000px) rotate(20deg);
        transform: translateY(-1000px) rotate(20deg);
        opacity: 0;
        display:none;
    }
}

@keyframes flyUp {
	75% { opacity: 1;}
	100% { -moz-transform: translateY(-1000px) rotate(20deg); -ms-transform: translateY(-1000px) rotate(20deg); -o-transform: translateY(-1000px) rotate(20deg); -webkit-transform: translateY(-1000px) rotate(20deg); transform: translateY(-1000px) rotate(20deg); opacity: 0; display:none;}
}

@-webkit-keyframes fallDown {
	75% { opacity: 1;}
    100% {
        -webkit-transform: translateY(100%);
        -moz-transform: translateY(100%);
        -ms-transform: translateY(100%);
        -o-transform: translateY(100%);
        transform: translateY(100%);
        opacity: 0;
        display:none;
    }
}

@keyframes fallDown {
	75% { opacity: 1;}
	100% { -moz-transform: translateY(100%); -ms-transform: translateY(100%); -o-transform: translateY(100%); -webkit-transform: translateY(100%); transform: translateY(100%); opacity: 0; display:none }
}

#modal-regalo {
    background-color:rgba(0,0,0,.8);
    background-image: url('https://sofiaxtv2.blob.core.windows.net/imagenes/interfaz/alumno/SNOW.png'), url('https://sofiaxtv2.blob.core.windows.net/imagenes/interfaz/alumno/SNOW2.png'), url('https://sofiaxtv2.blob.core.windows.net/imagenes/interfaz/alumno/SNOW3.png');
    -moz-animation: snow 20s linear infinite;
    -o-animation: snow 20s linear infinite;
    -webkit-animation: snow 20s linear infinite;
    animation: snow 20s linear infinite;
    -moz-transition: all 1s linear;
    -o-transition: all 1s linear;
    -webkit-transition: all 1s linear;
    transition: all 1s linear;
}

#modal-regalo .modal-content
{
    background:transparent !important;
    box-shadow: none;
    border: none;
}

.header-gift {
    position: absolute;
    top: -300px;
    left: 50%;
    text-align: center;
    color: white;
    width: 300px;
    z-index: 13;
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    padding: 5px;
    font-weight: bolder !important;
    -moz-transition: all 1s linear;
    -o-transition: all 1s linear;
    -webkit-transition: all 1s linear;
    transition: all 1s linear;
}

.header-gift img
{
    width: 150px;
    display: block;
    margin: auto;
}

    .header-gift span {
        background: rgba(0, 0, 0, 0.3);
    }

@media(min-width:768px)
{
    .header-gift {
        width: 600px;
    }
}

.header-gift.hide-header
{
    opacity:0
}

.item-gift {
    position: absolute;
    display: block;
    top:-250px;
    width:250px;
    left: 50%;
    text-align:center;
    -moz-transform: translate(-50%);
    -ms-transform: translate(-50%);
    -o-transform: translate(-50%);
    -webkit-transform: translate(-50%);
    transform: translate(-50%);
    opacity: 0;
    -moz-transition: all 1s cubic-bezier(0.99, 0, 1, 0.24);
    -o-transition: all 1s cubic-bezier(0.99, 0, 1, 0.24);
    -webkit-transition: all 1s cubic-bezier(0.99, 0, 1, 0.24);
    transition: all 1s cubic-bezier(0.99, 0, 1, 0.24);
}

    .item-gift img {
        /*width: 200px;*/
        margin: auto 10px;
        margin-bottom: 10px;
    }

.item-gift h1
{
    color:white;
    font-weight:bolder !important;
    text-align:center
}

.item-gift h2 span
{
    display:block;
}

.avatar-find {
    display: block;
    text-align: center;
    font-size: 19px;
    font-weight: lighter !important;
    margin-top: 10px;
    font-style: italic;
}

.avatar-find strong
{
    display:inline-block
}

.item-gift.show
{
    opacity:1
}

@media(min-width:768px)
{
    .item-gift
    {
        width:500px;
    }

        .item-gift img {
            display:inline-block
        }

    .avatar-find {
        text-align: center;
    }
}

.anim .giftbox .cover{
    -webkit-animation: flyUp 0.4s ease-out forwards;
    -moz-animation: flyUp 0.4s ease-out forwards;
    -o-animation: flyUp 0.4s ease-out forwards;
    animation: flyUp 0.4s ease-out forwards;
}

.anim .giftbox .box {
    -webkit-animation: fallDown 0.2s 0.05s ease-in forwards;
    -moz-animation: fallDown 0.2s 0.05s ease-in forwards;
    -o-animation: fallDown 0.2s 0.05s ease-in forwards;
    animation: fallDown 0.2s 0.05s ease-in forwards;
}


.bk-gif
{
    width: 500px;
	height: 500px;
	position: absolute;
	top: 0;
	left: 50%;
	margin-left: -150px;
	z-index: 10;
	cursor: pointer;
}
    /***********************/
/**********GIFTBOX*************/
    /***********************/

.giftbox:hover {
    -moz-animation: wobble 0.5s linear infinite forwards;
    -o-animation: wobble 0.5s linear infinite forwards;
    -webkit-animation: wobble 0.5s linear infinite forwards;
    animation: wobble 0.5s linear infinite forwards;
}

.giftbox {
	width: 300px;
	height: 220px;
	position: absolute;
	top: -50px;
	left: 50%;
	margin-left: -150px;
	z-index: 10;
    cursor: pointer;
	/*cursor:url('https://sofiaxtv2.blob.core.windows.net/imagenes/interfaz/home/misc/POINTER-SOFIA.png'), auto;*/
}

    .giftbox::after {
        /*content: 'Clic aquí';*/
        position: absolute;
        color: #fff;
        font-family: 'Gandhi';
        bottom: 0;
        left: 0;
        width: 100%;
        text-align: center;
        font-size: 24px;
        z-index: 1000;
        -moz-transform: rotate(-20deg);
        -ms-transform: rotate(-20deg);
        -o-transform: rotate(-20deg);
        -webkit-transform: rotate(-20deg);
        transform: rotate(-20deg);
        -moz-transform-origin: 0 0;
        -ms-transform-origin: 0 0;
        -o-transform-origin: 0 0;
        -webkit-transform-origin: 0 0;
        transform-origin: 0 0;
    }

.giftbox > div {
    background-color:white;
	background-image: url(https://sofiaxtv2.blob.core.windows.net/imagenes/interfaz/alumno/CHRISTMAS-PATTERN.jpg);
    /*background-image: url(https://sofiaxtv2.blob.core.windows.net/imagenes/interfaz/home/misc/PATRON-1.png);*/
	position: absolute;
}

.giftbox .cover {
	top: 0;
	left: 0;
	height: 25%;
	width: 100%;
	z-index: 2;
}

.giftbox .box {
	bottom: 0;
	height: 80%;
	left: 5%;
	right: 5%;
	z-index: 1;
}

.giftbox > div::after,
.giftbox > div::before {
	content: '';
	position: absolute;
	top: 0;
} 

/* ribbon */
    .giftbox > div::before {
        background: #389220;
        width: 50px;
        left: 50%;
        height: 100%;
        -webkit-transform: translateX(-50%);
        -moz-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        -o-transform: translateX(-50%);
        transform: translateX(-50%);
    }

/* shadow */
.giftbox .box::after {
	background: rgba(0,0,0,0.1);
	left: 0;
	height: 30px;
	width: 100%;
}

.giftbox .cover div {
	position: absolute;
	height: 60px;
	width: 60px;
	bottom: 100%;
	left: 50%;
	margin-left: -30px;
}

.giftbox .cover div::before,
.giftbox .cover div::after {
	position: absolute;
	width: 100%;
	height: 100%;
	content: '';
	background: transparent;
	border-radius: 30px;
	box-shadow: inset 0 0 0 14px #389220;
}

    .giftbox .cover div::before {
        -webkit-transform: translateX(-45%) skewY(40deg);
        -moz-transform: translateX(-45%) skewY(40deg);
        -ms-transform: translateX(-45%) skewY(40deg);
        -o-transform: translateX(-45%) skewY(40deg);
        transform: translateX(-45%) skewY(40deg);
    }

    .giftbox .cover div::after {
        -webkit-transform: translateX(45%) skewY(-40deg);
        -moz-transform: translateX(45%) skewY(-40deg);
        -ms-transform: translateX(45%) skewY(-40deg);
        -o-transform: translateX(45%) skewY(-40deg);
        transform: translateX(45%) skewY(-40deg);
    }

    /***********************/
/**********GIFTBOX*************/
    /***********************/

#circle{
  width:214px;
  height:214px;
  background-color:#FFC847;
  border-radius:214px;
  position:absolute;
  top:0;right:0;bottom:0;left:0;
  margin:auto;
  box-shadow:0 1px 2px rgba(0,0,0,0.3);
}
    #circle:after {
        content: "";
        display: block;
        border: 7px dashed white;
        width: 200px;
        height: 200px;
        border-radius: 200px;
        -moz-animation: spin 30s linear infinite;
        -o-animation: spin 30s linear infinite;
        -webkit-animation: spin 30s linear infinite;
        animation: spin 30s linear infinite;
    }
#circle:hover{
  background-image:radial-gradient(#FFED85, #FFC847 70%);
}
#gift{
  position:absolute;
  top:0;right:0;left:0;bottom:0;
  margin:auto;
  width:100px;
  height:125px;
}
#ribbon {
    position: relative;
    width: 60px;
    height: 60px;
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    margin: auto;
    margin-bottom: -38px;
    border-radius: 0 8px 0 8px;
}
#ribbon:before{
  content:"";
  height:24px;
  width:100%;
  background-color:#F04D4D;
  display:block;
  position:absolute;
  top:18px;
  box-shadow:0 0 1px rgba(0,0,0,0.4);
  border-radius:inherit;
}
#ribbon:after{
  content:"";
  height:100%;
  width:24px;
  background-color:#F04D4D;
  display:block;
  margin:auto;
  box-shadow:0 0 1px rgba(0,0,0,0.4);
  border-radius:inherit;
}
#giftbox{
  position:relative;
  margin:auto;
  width:100px;
  height:100px;
  background-color:white;
  border-radius:2px;
  box-shadow:0 0 1px rgba(0,0,0,0.4);
  overflow:hidden;
}
#giftbox:before{
  content:"";
  height:24%;
  width:100%;
  background-color:#F04D4D;
  display:block;
  position:absolute;
  top:38%;
  box-shadow:inherit;
}
#giftbox:after{
  content:"";
  height:100%;
  width:24%;
  background-color:#F04D4D;
  display:block;
  margin:auto;
  box-shadow:inherit;
}



@media(min-width:768px) {
    .warning-text {
        margin: auto;
        width: 70%;
        text-align: center;
    }
}

@media(min-width:992px)
{
    .warning-text
    {
        width: 60%;
    }
}

@media(min-width:1200px)
{
    .warning-text {
        text-align: right;
        float: right;
    }
}

.cvcImage
{
    cursor:pointer;
    position:relative
}

    .cvcImage:hover:after {
        content: url(https://sofiaxtv2.blob.core.windows.net/imagenes/interfaz/home/misc/CVC.png);
        display: block;
        position: absolute;
        left: 0; 
        top: 0;
    }


.alert-fancy {
    border-top: none;
    border-right: none;
    border-bottom: none;
    border-radius: 0;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    font-family: Gandhi;
    font-size: 17px;
    padding-left:50px;
    position:relative;
}

.alert-fancy .alert-link:hover
{
    color:white
}

    .alert-fancy.alert-info {
        background-color: rgb(49, 176, 213);
        border-color: #2c98b7;
    }

        .alert-fancy.alert-info .alert-link {
            color: #1e6376;
        }

    .alert-fancy.alert-primary {
        background-color: rgb(66, 139, 202);
        border-color: #286090;
    }

        .alert-fancy.alert-primary .alert-link {
            color: #15334c;
        }

    .alert-fancy.alert-royal {
        background-color: rgb(119, 44, 218);
        border-color: #42236b;
    }

        .alert-fancy.alert-royal .alert-link {
            color: #42236b;
        }

    .alert-fancy img {
        width: 50px;
        position: absolute;
        left: 5px;
        top: 50%;
        -moz-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        -o-transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
    }

#separador.blue
{
    border-color:#337AB7
}

#separador.skyblue
{
    border-color:#5BC0DE
}

#separador.purple
{
    border-color:#611BBD
}

#separador.green {
    border-color: #71B470
}

#separador.orange {
    border-color: #EEA236
}




.btn-circle-sign {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    border-width: 5px;
    font-size: 1.5em;
    font-family: Gandhi;
    position: relative;
    overflow: hidden;
    padding: 0;
    -moz-transition: all ease .5s;
    -o-transition: all ease .5s;
    -webkit-transition: all ease .5s;
    transition: all ease .5s;
    opacity: 1;
}

    .btn-circle-sign.no-selected {
        opacity: .5;
    }

    .btn-circle-sign:hover,
    .btn-circle-sign:focus,
    .btn-circle-sign:active,
    .btn-circle-sign.active {
        border:none;
        box-shadow: inset 0 0 14px #fff;
        opacity:1
    }
@keyframes btnActive {
    0% {
        border-width: 20px;
    }
    50% {
        
        border-width:3px
    }
    100% {
        border-width: 20px;
    }

}

@-moz-keyframes btnActive {
    0% {
        border-width: 20px;
    }
    50% {
        
        border-width:3px
    }
    100% {
        border-width: 20px;
    }
}

@-webkit-keyframes btnActive {
    0% {
        border-width: 20px;
    }
    50% {
        
        border-width:3px
    }
    100% {
        border-width: 20px;
    }
}

.btn-circle-sign.active:after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    border: rgba(0, 0, 0, 0.14) 3px solid;
    -moz-transition: all ease .5s;
    -o-transition: all ease .5s;
    -webkit-transition: all ease .5s;
    transition: all ease .5s;
    -moz-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    -o-transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    -moz-animation: btnActive 2s ease;
    -o-animation: btnActive 2s ease;
    -webkit-animation: btnActive 2s ease;
    animation: btnActive 2s ease;
    -moz-animation-iteration-count: infinite;
    -o-animation-iteration-count: infinite;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    
}

    .btn-circle-sign:before {
        content: "";
        position: absolute;
        top: 0;
        left: 50%;
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, 0.2);
        -moz-transition: all ease .5s;
        -o-transition: all ease .5s;
        -webkit-transition: all ease .5s;
        transition: all ease .5s;
        -moz-transform: skew(-45deg);
        -ms-transform: skew(-45deg);
        -o-transform: skew(-45deg);
        -webkit-transform: skew(-45deg);
        transform: skew(-45deg);
    }

    .btn-circle-sign > img {
        position: absolute;
        bottom: 0;
        right: 0;
    }

    .btn-circle-sign:hover:before, 
    .btn-circle-sign:focus:before,  
    .btn-circle-sign:active:before,  
    .btn-circle-sign.active:before {
        -moz-transform: skew(0);
        -ms-transform: skew(0);
        -o-transform: skew(0);
        -webkit-transform: skew(0);
        transform: skew(0);
        opacity:0;
        left: 50%;
    }

.text-circle {
    position: absolute;
    display: block;
    top: 50%;
    left: 0;
    width: 100%;
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}


@media (min-width: 768px) {

    .btn-circle-sign {
        width: 130px;
        height: 130px;
    }
}

.container-btn-circle
{
    position:relative;
    display:inline-block
}

    .container-btn-circle:before {
        content: url(https://sofiaxtv2.blob.core.windows.net/imagenes/interfaz/home/misc/COVID-19-08.png);
        position: absolute;
        bottom: -10px;
        right: 0px;
        z-index: 1;
    }

.input-mayor-angulo {
    display: none
}

.well-transparent {
    background-color: rgba(245, 245, 245, 0.8) !important;
}

/*MODAL VERTICAL CENTER*/
/*enseguiida de la clase "modal"*/
.modal-vCenter {
  text-align: center;
  padding: 0!important;
}

.modal-vCenter:before {
  content: '';
  display: inline-block;
  height: 100%;
  vertical-align: middle;
  margin-right: -4px;
}

.modal-vCenter .modal-dialog {
  display: inline-block;
  text-align: left;
  vertical-align: middle;
}

/*MODAL VERTICAL CENTER*/

.no-Scale {
    -moz-transform: scale(1) !important;
    -ms-transform: scale(1) !important;
    -o-transform: scale(1) !important;
    -webkit-transform: scale(1) !important;
    transform: scale(1) !important;
}

.no-padding
{
    padding: 0 !important;
    margin: 0 !important;
}

.no-padding-left {
    padding-left: 0;
}

.no-padding-right {
    padding-right: 0;
}

.dragscroll {
    cursor: move; /* fallback if grab cursor is unsupported */
    cursor: grab;
    cursor: -moz-grab;
    cursor: -webkit-grab;
}

    /* (Optional) Apply a "closed-hand" cursor during drag operation. */
    .dragscroll:active {
        cursor: grabbing;
        cursor: -moz-grabbing;
        cursor: -webkit-grabbing;
    }

.avisoMantenmiento {
    background: rgb(236, 44, 57);
    color: rgb(255, 255, 255);
    margin: 0;
    padding: 0;
    font-family: gandhi;
    text-align: center;
    font-size: 1.2em;
}

    .avisoMantenmiento .container-fluid {
        padding: 0;
    }

.styleToolTip {
    background: rgba(255, 255, 255,.9);
    padding: 5px;
    border: #000 solid 2px;
    color: black;
    -webkit-box-shadow: 6px 6px 13px 0 rgba(0,0,0,0.53);
    -moz-box-shadow: 6px 6px 13px 0 rgba(0,0,0,0.53);
    box-shadow: 6px 6px 13px 0 rgba(0,0,0,0.53);
    margin-bottom: 50px;
    border-radius: 10px;
}

    .styleToolTip .titleToolTip {
        margin-bottom: 0;
    }



.modal-cargando{
  text-align: center;
  padding: 0!important;
}

    .modal-cargando:before {
        content: '';
        display: inline-block;
        height: 100%;
        vertical-align: middle;
        margin-right: -4px;
    }

    .modal-cargando .modal-dialog {
        display: inline-block;
        text-align: left;
        vertical-align: middle;
    }

    .modal-cargando .modal-content {
        background: transparent;
        box-shadow: none;
        border: none;
    }

    .modal-cargando .modal-header {
        border-bottom: none;
    }

    .modal-cargando .modal-title {
        font-family: Gandhi;
        font-weight: lighter;
        color: white;
        text-align: center;
        text-shadow: black 2px -2px 1px;
    }
    
    .modal-cargando .modal-body {
        color: white;
    }

    .modal-cargando .modal-footer {
        border-top: none;
    }


.progress-bk {
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#d4155a+0,fbb827+46,faba27+47,8bc640+66,2babe0+100 */
    background: #d4155a; /* Old browsers */
    background: -moz-linear-gradient(left, #d4155a 0, #fbb827 46%, #faba27 47%, #8bc640 66%, #2babe0 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left, #d4155a 0,#fbb827 46%,#faba27 47%,#8bc640 66%,#2babe0 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, #d4155a 0,#fbb827 46%,#faba27 47%,#8bc640 66%,#2babe0 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d4155a', endColorstr='#2babe0',GradientType=1 ); /* IE6-9 */
}

.progress-change-bk {
    background-color: transparent;
}

@keyframes blink-border {
    25% {
        border-color: #000;
    }

    50% {
        border-color: white;
    }
}

.blink-border {
    -moz-animation: blink-border;
    -o-animation: blink-border;
    -webkit-animation: blink-border;
    animation: blink-border;
    -moz-animation-duration: 1s;
    -o-animation-duration: 1s;
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -moz-animation-iteration-count: infinite;
    -o-animation-iteration-count: infinite;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
    -o-animation-timing-function: linear;
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear;
}

.modal {
    background: rgba(0, 0, 0, 0.8);
}

#modal-cargandofinal .modal-content {
    background: rgba(255, 255, 255, 0);
    box-shadow: none;
    border: none;
}

.blur {
    -webkit-filter: blur(7px);
    -moz-filter: blur(7px);
    filter: blur(7px);
}

.square {
    position: relative;
    width: 80%;
    overflow: hidden;
    float: left;
    -moz-transition: .5s all ease;
    -o-transition: .5s all ease;
    -webkit-transition: .5s all ease;
    transition: .5s all ease;
    -moz-transform: translateX(50%);
    -ms-transform: translateX(50%);
    -o-transform: translateX(50%);
    -webkit-transform: translateX(50%);
    transform: translateX(50%);
    left: -28%;
    outline: 2px solid white;
}

    .square:hover {
        -moz-transform: scale(1.1);
        -ms-transform: scale(1.1);
        -o-transform: scale(1.1);
        -webkit-transform: scale(1.1);
        transform: scale(1.1);
        z-index: 2;
        left: 11%;
        box-shadow: 8px 8px 9px rgba(0,0,0,.4);
        outline: none;
    }

    .square:after {
        content: "";
        display: block;
        padding-bottom: 100%;
    }

@media (min-width: 768px) {
    .square {
        width: 50%;
        -moz-transform: translate(0);
        -ms-transform: translate(0);
        -o-transform: translate(0);
        -webkit-transform: translate(0);
        transform: translate(0);
        left: inherit;
    }

        .square:hover {
            left: inherit;
        }
}

@media (min-width: 992px) {
    .square {
        width: 33.3333333333%;
    }
}

@media (min-width: 1200px) {
    .square {
        width: 25%;
    }
}

.square-name {
    width: 100%;
    position: absolute;
    top: 50%;
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    text-align: center;
    -moz-transition: .5s all ease;
    -o-transition: .5s all ease;
    -webkit-transition: .5s all ease;
    transition: .5s all ease;
    padding: 10px;
    color: white;
    background: rgba(0,0,0,.5);
    font-family: 'Gandhi Sans';
    font-size: 22px;
}


.square:hover .square-name {
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    -webkit-transform: translateY(0);
    transform: translateY(0);
    top: 101%;
}

.square-content {
    position: absolute;
    width: 100%;
    height: 100%;
}

.square-content-hide {
    color: white;
    padding: 5px;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    position: absolute;
    left: 0;
    top: -100%;
    font-size: 16px;
    -moz-transition: .5s all ease;
    -o-transition: .5s all ease;
    -webkit-transition: .5s all ease;
    transition: .5s all ease;
    font-family: gandhi;
}

.square-content-block {
    display: block;
}

.square-content-start {
    width: 100%;
    position: absolute;
    top: 50%;
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    text-align: center;
    left: 0;
    padding: 10px;
}

    .square-content-start:hover {
        text-decoration: none;
    }

.square-content-description {
    width: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    position: absolute;
    bottom: 0;
    left: 0;
    padding: 5px;
}

.square:hover .square-content-hide {
    top: 0;
}

.square-content img {
    width: 100%;
    height: 100%;
}


    .btn-sq-lg {
        width: 150px !important;
        height: 150px !important;
    }

    .btn-sq {
        width: 100px !important;
        height: 100px !important;
        font-size: 10px;
    }

    .btn-sq-sm {
        width: 50px !important;
        height: 50px !important;
        font-size: 10px;
    }

    .btn-sq-xs {
        width: 25px !important;
        height: 25px !important;
        padding: 2px;
    }

    .btn-sq-text {
        display: block;
        margin-top: 20px;
        font-size: 18px;
        font-weight: bolder;
    }

.fraction {
    display: inline-block;
    vertical-align: middle;
    margin: 0 0.2em 0.4ex;
    text-align: center;
}

    .fraction > span {
        display: block;
        padding-top: 0.15em;
    }

    .fraction span.den {
        border-top: thin solid black;
    }

    .fraction span.bar {
        display: none;
    }


.datepicker.dropdown-menu {
    z-index: 1500;
}

.reset-this {
    -moz-animation: none;
    -o-animation: none;
    -webkit-animation: none;
    animation: none;
    -moz-animation-delay: 0;
    -o-animation-delay: 0;
    -webkit-animation-delay: 0;
    animation-delay: 0;
    -moz-animation-direction: normal;
    -o-animation-direction: normal;
    -webkit-animation-direction: normal;
    animation-direction: normal;
    -moz-animation-duration: 0;
    -o-animation-duration: 0;
    -webkit-animation-duration: 0;
    animation-duration: 0;
    -moz-animation-fill-mode: none;
    -o-animation-fill-mode: none;
    -webkit-animation-fill-mode: none;
    animation-fill-mode: none;
    -moz-animation-iteration-count: 1;
    -o-animation-iteration-count: 1;
    -webkit-animation-iteration-count: 1;
    animation-iteration-count: 1;
    -moz-animation-name: none;
    -o-animation-name: none;
    -webkit-animation-name: none;
    animation-name: none;
    -moz-animation-play-state: running;
    -o-animation-play-state: running;
    -webkit-animation-play-state: running;
    animation-play-state: running;
    -moz-animation-timing-function: ease;
    -o-animation-timing-function: ease;
    -webkit-animation-timing-function: ease;
    animation-timing-function: ease;
    -moz-backface-visibility: visible;
    -webkit-backface-visibility: visible;
    backface-visibility: visible;
    background: 0;
    background-attachment: scroll;
    -moz-background-clip: border-box;
    -webkit-background-clip: border-box;
    background-clip: border-box;
    background-color: transparent;
    background-image: none;
    -moz-background-origin: padding-box;
    -webkit-background-origin: padding-box;
    background-origin: padding-box;
    background-position: 0 0;
    background-position-x: 0;
    background-position-y: 0;
    background-repeat: repeat;
    background-size: auto auto;
    border: 0 none;
    border-width: medium;
    border-color: inherit;
    border-bottom: 0;
    border-bottom-width: medium;
    border-collapse: separate;
    -moz-border-image: none;
    -o-border-image: none;
    -webkit-border-image: none;
    border-image: none;
    border-left: 0;
    border-left-color: inherit;
    border-left-style: none;
    border-left-width: medium;
    border-radius: 0;
    border-right: 0;
    border-right-color: inherit;
    border-right-style: none;
    border-right-width: medium;
    border-spacing: 0;
    border-top: 0;
    border-top-color: inherit;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    border-top-style: none;
    border-top-width: medium;
    bottom: auto;
    box-shadow: none;
    -moz-box-sizing: content-box;
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    caption-side: top;
    clear: none;
    clip: auto;
    color: inherit;
    -moz-columns: auto;
    -webkit-columns: auto;
    columns: auto;
    -moz-column-count: auto;
    -webkit-column-count: auto;
    column-count: auto;
    column-fill: balance;
    -moz-column-gap: normal;
    -webkit-column-gap: normal;
    column-gap: normal;
    -moz-column-rule: medium none currentColor;
    -webkit-column-rule: medium none currentColor;
    column-rule: medium none currentColor;
    -moz-column-rule-color: currentColor;
    -webkit-column-rule-color: currentColor;
    column-rule-color: currentColor;
    -moz-column-rule-style: none;
    -webkit-column-rule-style: none;
    column-rule-style: none;
    -moz-column-rule-width: initial;
    -webkit-column-rule-width: initial;
    column-rule-width: initial;
    -webkit-column-span: initial;
    column-span: initial;
    -moz-column-width: auto;
    -webkit-column-width: auto;
    column-width: auto;
    content: normal;
    counter-increment: none;
    counter-reset: none;
    cursor: auto;
    direction: ltr;
    display: inline;
    empty-cells: show;
    float: none;
    font: normal;
    font-family: inherit;
    font-size: medium;
    font-style: normal;
    font-variant: normal;
    font-weight: normal;
    -moz-hyphens: none;
    -ms-hyphens: none;
    -webkit-hyphens: none;
    hyphens: none;
    left: auto;
    letter-spacing: normal;
    line-height: normal;
    list-style: none;
    list-style-position: outside;
    list-style-type: disc;
    margin: 0;
    max-height: none;
    max-width: none;
    min-height: 0;
    min-width: 0;
    opacity: 1;
    orphans: 0;
    outline: 0;
    outline-color: invert;
    outline-style: none;
    outline-width: medium;
    overflow: visible;
    overflow-x: visible;
    overflow-y: visible;
    padding: 0;
    padding-bottom: 0;
    padding-left: 0;
    padding-right: 0;
    padding-top: 0;
    page-break-after: auto;
    page-break-before: auto;
    page-break-inside: auto;
    -moz-perspective: none;
    -ms-perspective: none;
    -webkit-perspective: none;
    perspective: none;
    -moz-perspective-origin: 50% 50%;
    -ms-perspective-origin: 50% 50%;
    -webkit-perspective-origin: 50% 50%;
    perspective-origin: 50% 50%;
    position: static;
    right: auto;
    -o-tab-size: 8;
    tab-size: 8;
    table-layout: auto;
    text-align: inherit;
    -moz-text-align-last: auto;
    -ms-text-align-last: auto;
    text-align-last: auto;
    text-decoration: none;
    -moz-text-decoration-color: inherit;
    text-decoration-color: inherit;
    -moz-text-decoration-line: none;
    text-decoration-line: none;
    -moz-text-decoration-style: solid;
    text-decoration-style: solid;
    text-indent: 0;
    text-shadow: none;
    text-transform: none;
    top: auto;
    -moz-transform: none;
    -ms-transform: none;
    -o-transform: none;
    -webkit-transform: none;
    transform: none;
    -webkit-transform-style: flat;
    transform-style: flat;
    -moz-transition: none;
    -o-transition: none;
    -webkit-transition: none;
    transition: none;
    -moz-transition-delay: 0s;
    -o-transition-delay: 0s;
    -webkit-transition-delay: 0s;
    transition-delay: 0s;
    -moz-transition-duration: 0s;
    -o-transition-duration: 0s;
    -webkit-transition-duration: 0s;
    transition-duration: 0s;
    -moz-transition-property: none;
    -o-transition-property: none;
    -webkit-transition-property: none;
    transition-property: none;
    -moz-transition-timing-function: ease;
    -o-transition-timing-function: ease;
    -webkit-transition-timing-function: ease;
    transition-timing-function: ease;
    unicode-bidi: normal;
    vertical-align: baseline;
    visibility: visible;
    white-space: normal;
    widows: 0;
    width: auto;
    word-spacing: normal;
    z-index: auto;
}

@media (max-width: 768px) {
 
}
/*DIALOG*/
#timeout {
    display: none;
    z-index: 999999999999999999;
}

.dialog {
    border-radius: 15px;
}

.ui-dialog-titlebar-close {
    display: none;
}

/*DIALOG*/
.ui-dialog-titlebar {
    padding: 10px;
    font-size: 30px;
    font-family: gandhi;
    text-align: center;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}

.ui-dialog-content {
    padding: 10px;
    background: white;
    font-size: 20px;
    text-align: center;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
}

/*END DIALOG*/


.well {
    color: #444;
}

.nowrap {
    white-space: nowrap;
}

.avatar-accesorio-item:hover .comprado {
    display: none;
}

.comprado {
    position: absolute;
    top: 55px;
    width: 100%;
    z-index: 1000;
    display: block;
    text-align: center;
    padding: 2px;
    font-weight: bold;
    background: rgb(240, 245, 246);
    border-top: solid 2px #FFDF00;
    border-bottom: solid 2px #FFDF00;
}

.main.version {
    background: #F7F7F7 !important;
}

.page-header.version {
    padding-bottom: 0px !important;
    margin: 20px 0 15px !important;
    border-bottom: none !important;
}

hr.version {
    border-bottom: 2px solid #B6A003 !important;
}

.less-space [class*="col"] {
    padding-left: 2px !important;
    padding-right: 2px !important;
}

.combodate {
    display: block;
}

.profile_data_group {
    font-size: 16px;
}

hr.pad_name {
    margin: 0 20px 15px;
}

hr.pad_group {
    margin: 0 0 10px;
    border-bottom: 2px groove #eee;
}

.nav-img {
    position: relative;
    top: -5px;
    float: left;
    left: -5px;
    background: white;
    width: 31px;
    height: 30px;
    overflow: hidden;
}

    .nav-img img {
        width: 31px;
    }


.quickmenu canvas {
    position: absolute;
    -webkit-filter: blur(4px);
    -moz-filter: blur(4px);
    filter: blur(4px);
}

.quickmenu #imgAnim img {
    -webkit-filter: blur(4px);
    -moz-filter: blur(4px);
    filter: blur(4px);
}

.quickmenu .imgBanner img {
    -webkit-filter: blur(4px);
    -moz-filter: blur(4px);
    filter: blur(4px);
}

.imgBanner img {
    position: absolute;
    width: 100%;
    margin-top: -66px;
}

.vcenter {
    display: inline-block;
    vertical-align: middle;
    float: none;
}

html {
    overflow: auto;
    overflow-x: auto;
    position: relative;
    height: 100%;
}


body {
    padding-top: 55px;
    margin-bottom: 80px;
}

.centerAligment h3 {
}

/*SNOw*/
#flake {
    z-index: 99999999;
}

    #flake:hover {
        z-index: 0;
    }

dd {
    margin-left: 10px;
}

.footer {
    position: absolute;
    bottom: 0;
    width: 100%;
    /* Set the fixed height of the footer here */
    height: auto;
    min-height: 40px;
    background-color: #F7F7F7;
    -moz-box-shadow: -1px -1px 6px rgba(102, 102, 102, 0.4);
    -webkit-box-shadow: -1px -1px 6px rgba(102, 102, 102, 0.4);
    box-shadow: -1px -1px 6px rgba(102, 102, 102, 0.4);
}

.nav-tabs.tabs-registro > li > a {
    color: #4b4c4e;
    -moz-transition: all .5s ease;
    -o-transition: all .5s ease;
    -webkit-transition: all .5s ease;
    transition: all .5s ease;
}

.nav-tabs.tabs-registro > li.active > a, .nav-tabs.tabs-registro > li.active > a:hover, .nav-tabs.tabs-registro > li.active > a:focus
{
    border-top: solid #e43f2c;
}

.nav.tabs-registro > li > a:hover
{
    border-color: transparent;
    background-color:white;
    border-top: 1px solid #e43f2c;
}


#aviso {
    display: none;
}

.main {
    -moz-box-shadow: 1px 1px 6px rgba(102, 102, 102, 0.4);
    -webkit-box-shadow: 1px 1px 6px rgba(102, 102, 102, 0.4);
    box-shadow: 1px 1px 6px rgba(102, 102, 102, 0.4);
    margin-bottom: 20px;
    padding: 10px 15px 10px;
    position: relative;
    overflow: visible;
    background: #fff;
}

    .main:after {
        content: '';
        clear: both;
        display: block;
    }

.well:after {
    content: '';
    clear: both;
    display: block;
}

.container {
    margin-top: 10px;
}

.header {
    text-align: center;
    margin-bottom: 10px;
}

    .header img {
        width: 130px;
    }

.row {
    clear: left;
}

.replace {
    font-family: 'Gandhi';
    font-weight: lighter;
}

/************************ALERTAS**************************/

.alert {
    color: #fff !important;
    border-width: 5px;
}

.media-body .alert {
    margin-right: 10px;
}

.alert-default {
    background-color: rgba(213,213,213,.75);
    border-color: #B4B4B4;
}

.alert-primary {
    background-color: rgba(66, 139, 202,.75);
    border-color: #007ab4;
}

.alert-success {
    background-color: rgba(68,157,68,.75);
    border-color: #4cae4c;
}

.alert-info {
    background-color: rgba(91,192,222,.75);
    border-color: #46b8da;
}

.alert-warning {
    background-color: rgba(240, 173, 78,.75);
    border-color: #eea236;
}

.alert-danger {
    background-color: rgba(217,83,79,.75);
    border-color: #d43f3a;
}

.column-left .logros img {
    width: 67px;
    margin: 0 5px 10px;
    float: left;
}

/*.column-left-new .partial_logro {
    width: 33.33333333% !important;
    height: auto !important;
}*/

.item_logro {
}

.no_logro {
    opacity: .3;
}

.nombre_logro {
    display: block;
    text-align: center;
    font-size: 16px;
    font-weight: bold;
}

.fecha_logro {
    display: block;
    text-align: center;
    font-size: 16px;
    font-style: italic;
}

/*.popover {
    background: #F7F7F7;
}
    .popover.right > .arrow:after {
        border-right-color:#F7F7F7
    }
    .popover.left > .arrow:after {
        border-left-color:#F7F7F7
    }
    .popover.top > .arrow:after {
        border-top-color:#F7F7F7
    }
    .popover.bottom > .arrow:after {
        border-bottom-color:#F7F7F7
    }*/

.popover-title {
}

.popover-content {
}


.column-center .main {
    -webkit-border-bottom-right-radius: 8px;
    -webkit-border-bottom-left-radius: 8px;
}

.d-flex {
   display: flex;
}

.justify-space-between {
    justify-content: space-between;
}

.btn-secondary {
    color: #fff;
    background-color: #707071;
    border-color: #707070;
}

.btn-secondary:hover {
    color: #fff;
    background-color: #5c636a;
    border-color: #565e64;
}

.column-center .nav li a {
    position: relative;
}

    .column-center .nav li a .badge {
        position: absolute;
        right: 0;
        top: -5px;
    }

.page_title {
    margin: 0;
}

    .page_title h1, .page_title h2, .page_title h3, .page_title h4, .page_title h5, .page_title h6 {
        text-align: center;
        margin: 0;
    }

.logros.perfil img {
    width: 101px;
}

.column-right .stats {
}


.navbar-default {
    border: none;
    -moz-box-shadow: 1px 1px 6px rgba(102, 102, 102, 0.4);
    -webkit-box-shadow: 1px 1px 6px rgba(102, 102, 102, 0.4);
    box-shadow: 1px 1px 6px rgba(102, 102, 102, 0.4);
}

    .navbar-default .navbar-text {
        font-weight: bolder;
    }

        .navbar-default .navbar-text > span {
            font-weight: lighter;
        }

.navbar-logo {
    position: absolute;
    left: 50%;
    margin-left: -39px;
    top: 0;
}

.navbar-brand img {
    margin-top: -15px;
}


/*****BADGES*******/

.badge {
    color: white;
}

    .badge.badge-success {
        background: #88AA31;
    }

    .badge.badge-info {
        background: #2d86b3;
    }

    .badge.badge-caution {
        background: #ffd200;
    }

    .badge.badge-warning {
        background: #ff9900;
    }

    .badge.badge-danger {
        background: #cc3300;
    }

.profile_data {
    text-align: center;
}

    .profile_data strong {
        font-size: large;
    }

/*******COLOR DROPDOWN***************/

/*******BOTON MORADO****************/
.btn-royal {
    color: #ffffff;
    background-color: #611BBD;
    border-color: #441187;
}

    .btn-royal:hover,
    .btn-royal:focus,
    .btn-royal:active,
    .btn-royal.active,
    .open .dropdown-toggle.btn-royal {
        color: #ffffff;
        background-color: #49247A;
        border-color: #441187;
    }

    .btn-royal:active,
    .btn-royal.active,
    .open .dropdown-toggle.btn-royal {
        background-image: none;
    }

    .btn-royal.disabled,
    .btn-royal[disabled],
    fieldset[disabled] .btn-royal,
    .btn-royal.disabled:hover,
    .btn-royal[disabled]:hover,
    fieldset[disabled] .btn-royal:hover,
    .btn-royal.disabled:focus,
    .btn-royal[disabled]:focus,
    fieldset[disabled] .btn-royal:focus,
    .btn-royal.disabled:active,
    .btn-royal[disabled]:active,
    fieldset[disabled] .btn-royal:active,
    .btn-royal.disabled.active,
    .btn-royal[disabled].active,
    fieldset[disabled] .btn-royal.active {
        background-color: #611BBD;
        border-color: #441187;
    }

    .btn-royal .badge {
        color: #611BBD;
        background-color: #ffffff;
    }

/*********BOTON AMARILLO****************/
.btn-canary {
    color: #FFFFFF;
    background-color: #F8C717;
    border-color: #EBBC12;
}

    .btn-canary:hover,
    .btn-canary:focus,
    .btn-canary:active,
    .btn-canary.active,
    .open .dropdown-toggle.btn-canary {
        color: #FFFFFF;
        background-color: #E6B812;
        border-color: #EBBC12;
    }

    .btn-canary:active,
    .btn-canary.active,
    .open .dropdown-toggle.btn-canary {
        background-image: none;
    }

    .btn-canary.disabled,
    .btn-canary[disabled],
    fieldset[disabled] .btn-canary,
    .btn-canary.disabled:hover,
    .btn-canary[disabled]:hover,
    fieldset[disabled] .btn-canary:hover,
    .btn-canary.disabled:focus,
    .btn-canary[disabled]:focus,
    fieldset[disabled] .btn-canary:focus,
    .btn-canary.disabled:active,
    .btn-canary[disabled]:active,
    fieldset[disabled] .btn-canary:active,
    .btn-canary.disabled.active,
    .btn-canary[disabled].active,
    fieldset[disabled] .btn-canary.active {
        background-color: #F8C717;
        border-color: #EBBC12;
    }

    .btn-canary .badge {
        color: #F8C717;
        background-color: #FFFFFF;
    }

/**BOTON ROSA*/
.btn-flamingo {
    color: #ffffff;
    background-color: #FC47A8;
    border-color: #F03E9D;
}

    .btn-flamingo:hover,
    .btn-flamingo:focus,
    .btn-flamingo:active,
    .btn-flamingo.active,
    .open .dropdown-toggle.btn-flamingo {
        color: #ffffff;
        background-color: #CC1E7B;
        border-color: #F03E9D;
    }

    .btn-flamingo:active,
    .btn-flamingo.active,
    .open .dropdown-toggle.btn-flamingo {
        background-image: none;
    }

    .btn-flamingo.disabled,
    .btn-flamingo[disabled],
    fieldset[disabled] .btn-flamingo,
    .btn-flamingo.disabled:hover,
    .btn-flamingo[disabled]:hover,
    fieldset[disabled] .btn-flamingo:hover,
    .btn-flamingo.disabled:focus,
    .btn-flamingo[disabled]:focus,
    fieldset[disabled] .btn-flamingo:focus,
    .btn-flamingo.disabled:active,
    .btn-flamingo[disabled]:active,
    fieldset[disabled] .btn-flamingo:active,
    .btn-flamingo.disabled.active,
    .btn-flamingo[disabled].active,
    fieldset[disabled] .btn-flamingo.active {
        background-color: #FC47A8;
        border-color: #F03E9D;
    }

    .btn-flamingo .badge {
        color: #FC47A8;
        background-color: #ffffff;
    }



.btn-group-no-side-padding .btn {
    padding-left: 0;
    padding-right: 0;
}

.btn-group-active-shadow .btn.active {
    -webkit-box-shadow: inset 0 0 15px rgba(0, 0, 0, 1);
    box-shadow: inset 0 0 15px rgba(0, 0, 0, 1);
}

/*MENU */

.navbar-nav > li > a {
    font-weight: bold;
}

.navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:hover {
    background: transparent;
}

/***************Index HOME*************************/

.colinas {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    margin-top: 50px;
}

.arbusto_left {
    position: fixed;
    z-index: 1;
    bottom: 0;
    left: 0;
}

.arbusto_right {
    position: fixed;
    z-index: 1;
    bottom: 0;
    right: 0;
}

.nivo-directionNav {
    display: none;
}

.home.container {
    margin-top: -170px;
}

#logohome img {
    position: absolute;
    left: 50%;
    top: 20px;
    margin-left: -130px;
    z-index: 8;
}

.btn-home {
    padding: 51px 49px;
    position: absolute;
    z-index: 10;
    left: 229px;
    top: -8px;
    background: url('img/Slider/miniSlider/casa.png') no-repeat;
    background-position: 100px;
}

    .btn-home:hover {
        background-position: -8px -3px;
    }


.header_slide {
    position: absolute;
    z-index: 2;
}

.home #simpleSlider {
    width: 480px;
    height: 270px;
    overflow: hidden;
    margin: 0;
    padding: 0;
    position: absolute;
    left: 36px;
    top: 72px;
}

    .home #simpleSlider > div {
        position: absolute;
        top: 63px;
        left: 55px;
        z-index: 0;
    }

    .home #simpleSlider img {
        width: 100%;
        *width: 390px;
        margin: 0;
        padding: 0;
        border: 0;
    }

.lobster.home {
    font-size: 50px;
    text-shadow: -2px -2px 0 #fff, 2px -2px 0 #fff, -2px 2px 0 #fff, 2px 2px 0 #fff;
}

.btn_responsive {
    width: 100%;
    position: absolute;
    z-index: 2;
}

.btn-danger.home {
    display: none;
}

.navbar.home {
    z-index: 1;
    width: 515px;
    float: right;
    background: #339BE8;
    color: white;
}

    .navbar.home .navbar-nav > li > a {
        color: #fff;
    }

body.home {
    overflow-x: hidden;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    padding-top: 50px;
    margin-bottom: 40px;
}

#canvas
/*Slider Home*/
#slide-container {
    z-index: 0;
    margin: 0;
    margin-top: 110px;
    width: 100%;
    height: auto;
    /*height: 254px;*/
}

#slider-wrapper {
    width: 100%;
}

#slider {
    width: 100%;
}

.nivo-controlNav {
    display: none;
}

#canvas.home {
    position: absolute;
    top: 0;
    width: 100%;
    /*height: 390px;*/
}

.btn-group.home {
    float: right;
}



.dropdown-menu.home {
    background-color: #E51D6A;
}

    .dropdown-menu.home li a {
        color: white;
        font-size: 18px;
        font-weight: bolder;
        padding: 10px;
    }

        .dropdown-menu.home li a:hover {
            color: #666;
        }

.btn-menu-home {
    color: #ffffff;
    background-color: #E51D6A;
    border-color: #E81566;
    z-index: 2;
    position: relative;
}

    .btn-menu-home:hover,
    .btn-menu-home:focus,
    .btn-menu-home:active,
    .btn-menu-home.active,
    .open .dropdown-toggle.btn-menu-home {
        color: #ffffff;
        background-color: #D10050;
        border-color: #E81566;
    }

    .btn-menu-home:active,
    .btn-menu-home.active,
    .open .dropdown-toggle.btn-menu-home {
        background-image: none;
    }

    .btn-menu-home.disabled,
    .btn-menu-home[disabled],
    fieldset[disabled] .btn-menu-home,
    .btn-menu-home.disabled:hover,
    .btn-menu-home[disabled]:hover,
    fieldset[disabled] .btn-menu-home:hover,
    .btn-menu-home.disabled:focus,
    .btn-menu-home[disabled]:focus,
    fieldset[disabled] .btn-menu-home:focus,
    .btn-menu-home.disabled:active,
    .btn-menu-home[disabled]:active,
    fieldset[disabled] .btn-menu-home:active,
    .btn-menu-home.disabled.active,
    .btn-menu-home[disabled].active,
    fieldset[disabled] .btn-menu-home.active {
        background-color: #E51D6A;
        border-color: #E81566;
    }

    .btn-menu-home .badge {
        color: #E51D6A;
        background-color: #ffffff;
    }
/****************END Animacion HOME********************/

/*********COLORES **************/

/**************** ROSA *********************/
.navbar-nav .pink .fa {
    color: #ff66ff;
}

.navbar-default .navbar-nav .pink > a:hover, .navbar .navbar-nav .open.pink .dropdown-menu > li > a:hover {
    background: #ff66ff;
    color: white;
}

.navbar-default .navbar-nav > .open.pink > a, .navbar-default .navbar-nav > .open.pink > a:hover, .navbar-default .navbar-nav > .open.pink > a:focus {
    background: #ff66ff;
    color: white;
}


.navbar-nav .open.pink .fa, .navbar-nav li.pink:hover .fa, .navbar-nav li.pink:hover a:hover, .navbar-nav .open.pink .dropdown-menu li:hover .glyphicon {
    color: white;
}

.navbar-nav .open.pink .dropdown-menu .fa {
    color: #333;
}

/**************** AMARILLO*********************/

.navbar-nav .yellow .fa {
    color: #ffd200;
}

.navbar-default .navbar-nav .yellow > a:hover, .navbar .navbar-nav .open.yellow .dropdown-menu > li > a:hover {
    background: #ffd200;
    color: white;
}


.navbar-default .navbar-nav > .open.yellow > a, .navbar-default .navbar-nav > .open.yellow > a:hover, .navbar-default .navbar-nav > .open.yellow > a:focus {
    background: #ffd200;
    color: white;
}


.navbar-nav .open.yellow .fa, .navbar-nav li.yellow:hover .fa, .navbar-nav li.yellow:hover a:hover, .navbar-nav .open.yellow .dropdown-menu li:hover .fa {
    color: white;
}

.navbar-nav .open.yellow .dropdown-menu .fa {
    color: #333;
}


/************MORADO*****************/

.navbar-nav .purple .fa {
    color: #8c2db3;
}

.navbar-default .navbar-nav .purple > a:hover, .navbar .navbar-nav .open.purple .dropdown-menu > li > a:hover {
    background: #8c2db3;
    color: white;
}

.navbar-default .navbar-nav > .open.purple > a, .navbar-default .navbar-nav > .open.purple > a:hover, .navbar-default .navbar-nav > .open.purple > a:focus {
    background: #8c2db3;
    color: white;
}


.navbar-nav .open.purple .fa, .navbar-nav li.purple:hover .fa, .navbar-nav li.purple:hover a:hover, .navbar-nav .open.purple .dropdown-menu li:hover .fa {
    color: white;
}

.navbar-nav .open.purple .dropdown-menu .fa {
    color: #333;
}

/************AZUL*****************/

.navbar-nav .blue .fa {
    color: #2d86b3;
}

.navbar-default .navbar-nav .blue > a:hover, .navbar .navbar-nav .open.blue .dropdown-menu > li > a:hover {
    background: #2d86b3;
    color: white;
}



.navbar-default .navbar-nav > .open.blue > a,
.navbar-default .navbar-nav > .open.blue > a:hover,
.navbar-default .navbar-nav > .open.blue > a:focus {
    background: #2d86b3;
    color: white;
}


.navbar-nav .open.blue .fa,
.navbar-nav li.blue:hover .fa,
.navbar-nav li.blue:hover a:hover,
.navbar-nav .open.blue .dropdown-menu li:hover .fa {
    color: white;
}

.navbar-nav .open.blue .dropdown-menu .fa {
    color: #333;
}


/****************** VERDE************************/

.navbar-nav .green .fa {
    color: #88AA31;
}


.navbar-default .navbar-nav .green > a:hover, .navbar .navbar-nav .open.green .dropdown-menu > li > a:hover {
    background: #88AA31;
    color: white;
}


.navbar-default .navbar-nav > .open.green > a, .navbar-default .navbar-nav > .open.green > a:hover, .navbar-default .navbar-nav > .open.green > a:focus {
    background: #88AA31;
    color: white;
}


.navbar-nav .open.green .fa, .navbar-nav li.green:hover .fa, .navbar-nav li.green:hover a:hover, .navbar-nav .open.green .dropdown-menu li:hover .fa {
    color: white;
}

.navbar-nav .open.green .dropdown-menu .fa {
    color: #333;
}


/********************** NARANJA **********************/

.navbar-nav .orange .fa {
    color: #ff9900;
}

.navbar-default .navbar-nav .orange > a:hover, .navbar .navbar-nav .open.orange .dropdown-menu > li > a:hover {
    background: #ff9900;
    color: white;
}

.navbar-default .navbar-nav > .open.orange > a, .navbar-default .navbar-nav > .open.orange > a:hover, .navbar-default .navbar-nav > .open.orange > a:focus {
    background: #ff9900;
    color: white;
}


.navbar-nav .open.orange .fa, .navbar-nav li.orange:hover .fa, .navbar-nav li.orange:hover a:hover, .navbar-nav .open.orange .dropdown-menu li:hover .fa {
    color: white;
}

.navbar-nav .open.orange .dropdown-menu .fa {
    color: #333;
}


/********************** ROJO *********************************/

.navbar-nav .red .fa {
    color: #cc3300;
}


.navbar-default .navbar-nav .red > a:hover, .navbar .navbar-nav .open.red .dropdown-menu > li > a:hover {
    background: #cc3300;
    color: white;
}

.navbar-default .navbar-nav > .open.red > a, .navbar-default .navbar-nav > .open.red > a:hover, .navbar-default .navbar-nav > .open.red > a:focus {
    background: #cc3300;
    color: white;
}


.navbar-nav .open.red .fa, .navbar-nav li.red:hover .fa, .navbar-nav li.red:hover a:hover, .navbar-nav .open.red .dropdown-menu li:hover .fa {
    color: white;
}

.navbar-nav .open.red .dropdown-menu .fa {
    color: #333;
}



/*************NAV-TABS*************/
.nav-tabs.nav-justified > .active > a, .nav-tabs.nav-justified > .active > a:hover, .nav-tabs.nav-justified > .active > a:focus {
    border-top: none;
    border-left: none;
    border-right: none;
}

    .nav-tabs.nav-justified > .active > a {
        border-top: none;
        border-left: none;
        border-right: none;
        padding-top: 18px;
    }

.nav-tabs.nav-justified > li > a {
    font-weight: bolder;
    border: 1px solid #ddd;
}

    .nav-tabs.nav-justified > li > a:hover {
        border: 1px solid #ddd;
    }

    .nav-tabs.nav-justified > li > a > .icon {
        display: block;
        font-size: 18px;
    }



/*************END NAV-TABS*************/


.spinner-badge
{
    position: absolute;
    top: -8px;
    right: 0;
    left: 0;
}

.column-center .nav > li > a
{
    padding: 8px;
}

.column-center .nav > li > a[data-css="tabTareas"]{
    padding: 6px 8px;
    padding-top: 8px;
}

@media(min-width:768px)
{
    .column-center .nav > li > a[data-css="tabTareas"] {
        padding: 6px;
        padding-top: 8px;
    }
}
@media(min-width:992px)
{
    .column-center .nav > li > a[data-css="tabTareas"] {
        padding: 8px;
        padding-top: 10px;
    }
}

@media(min-width:1200px)
{
    .column-center .nav > li > a[data-css="tabTareas"] {
        padding: 6px;
        padding-top: 8px;
    }
}



.row.ejercicios h1,
.row.ejercicios h2,
.row.ejercicios h3,
.row.ejercicios h4,
.row.ejercicios h5 {
    margin-top: 10px;
    text-align: center;
}

#ejercicios .btn .center {
    display: block;
    text-align: center;
}

#ejercicios .btn img {
    width: 22px;
    height: 22px;
}

#ejercicios .btn.btnLibro img {
    width: inherit;
    height: auto;
}

.practicas .btn-group > .btn + .dropdown-toggle {
    padding-top: 18px;
    padding-bottom: 18px;
}


/***********EJERCICIOS**************/

.inputEjercicio {
    -moz-transition: all 0.75s ease-in-out;
    -o-transition: all 0.75s ease-in-out;
    -webkit-transition: all 0.75s ease-in-out;
    transition: all 0.75s ease-in-out;
    color: black;
    border-radius: 3px;
    /*background:white; MARCO, ESTO QUITABAN COLORES INPUTS ROJO/VERDE*/
    border: 1px solid #000000;
}
.inputEjercicio2 {
    -moz-transition: all 0.75s ease-in-out;
    -o-transition: all 0.75s ease-in-out;
    -webkit-transition: all 0.75s ease-in-out;
    transition: all 0.75s ease-in-out;
    color: black;
    border-radius: 3px;
    /*background:white; MARCO, ESTO QUITABAN COLORES INPUTS ROJO/VERDE*/
    border: 1px solid #000000;
}
    .inputEjercicio:focus {
        border-radius: 0;
        color: black;
        background: white;
        border-color: #37a1d7;
        box-shadow: 0 0 10px #37a1d7;
    }
	.inputEjercicio2:focus {
        border-radius: 0;
        color: black;
        background: white;
        border-color: #37a1d7;
        box-shadow: 0 0 10px #37a1d7;
    }

/******floats tabs  ********/

.float-tabs-container {
    position: fixed;
    top: 50%;
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    height: auto;
    z-index: 1000;
    margin-left:-110px;
}

.button-tab > i {
    margin: 0;
    position: absolute;
    right: 8px;
    top: 50%;
    -moz-transform: translate(10%,-50%);
    -ms-transform: translate(10%,-50%);
    -o-transform: translate(10%,-50%);
    -webkit-transform: translate(10%,-50%);
    transform: translate(10%,-50%);
    font-size: 1.7em;
}

.button-tab {
    -moz-transition: all .5s ease;
    -o-transition: all .5s ease;
    -webkit-transition: all .5s ease;
    transition: all .5s ease;
    left: 0;
    position: relative;
    display: block;
    margin-bottom: 5px;
    text-align: left;
    padding: 15px;
    padding-left: 20px;
    width: 160px;
}

    .button-tab:hover {
        left: 100px;
    }

.btn-face {
    color: #ffffff;
    background-color: #5472B3;
    border-color: #3B5998;
}

    .btn-face:hover,
    .btn-face:focus,
    .btn-face:active,
    .btn-face.active,
    .open .dropdown-toggle.btn-face {
        color: #ffffff;
        background-color: #3B5998;
        border-color: #3B5998;
    }

    .btn-face:active,
    .btn-face.active,
    .open .dropdown-toggle.btn-face {
        background-image: none;
    }

    .btn-face.disabled,
    .btn-face[disabled],
    fieldset[disabled] .btn-face,
    .btn-face.disabled:hover,
    .btn-face[disabled]:hover,
    fieldset[disabled] .btn-face:hover,
    .btn-face.disabled:focus,
    .btn-face[disabled]:focus,
    fieldset[disabled] .btn-face:focus,
    .btn-face.disabled:active,
    .btn-face[disabled]:active,
    fieldset[disabled] .btn-face:active,
    .btn-face.disabled.active,
    .btn-face[disabled].active,
    fieldset[disabled] .btn-face.active {
        background-color: #5472B3;
        border-color: #3B5998;
    }

    .btn-face .badge {
        color: #5472B3;
        background-color: #ffffff;
    }

.btn-sofia {
    color: white;
    background-color: white;
    -moz-animation-name: change-color;
    -o-animation-name: change-color;
    -webkit-animation-name: change-color;
    animation-name: change-color;
    -moz-animation-duration: 3s;
    -o-animation-duration: 3s;
    -webkit-animation-duration: 3s;
    animation-duration: 3s;
    -moz-animation-iteration-count: infinite;
    -o-animation-iteration-count: infinite;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
}

    .btn-sofia:hover,
    .btn-sofia:focus,
    .btn-sofia:active,
    .btn-sofia.active,
    .open .dropdown-toggle.btn-sofia {
        color:white;
        border-color: white;
        -moz-animation-play-state: paused;
        -o-animation-play-state: paused;
        -webkit-animation-play-state: paused;
        animation-play-state: paused;
    }

    .btn-sofia:active,
    .btn-sofia.active,
    .open .dropdown-toggle.btn-sofia {
        background-image: none;
    }

    .btn-sofia.disabled,
    .btn-sofia[disabled],
    fieldset[disabled] .btn-sofia,
    .btn-sofia.disabled:hover,
    .btn-sofia[disabled]:hover,
    fieldset[disabled] .btn-sofia:hover,
    .btn-sofia.disabled:focus,
    .btn-sofia[disabled]:focus,
    fieldset[disabled] .btn-sofia:focus,
    .btn-sofia.disabled:active,
    .btn-sofia[disabled]:active,
    fieldset[disabled] .btn-sofia:active,
    .btn-sofia.disabled.active,
    .btn-sofia[disabled].active,
    fieldset[disabled] .btn-sofia.active {
        
        border-color: white;
        -moz-animation-play-state: paused;
        -o-animation-play-state: paused;
        -webkit-animation-play-state: paused;
        animation-play-state: paused;
    }

    .btn-sofia .badge {
        color: white;
    }

    .btn-sofia img {
        width: 35px;
        float: right;
        margin: -5px -10px 0 0;
        vertical-align: middle;
    }


/******end pestañas flotantes*/


/**********THEME-PICKER************/
.theme-picker {
    margin-top: 5px;
    padding-top: 3px;
    overflow: hidden;
}

    .theme-picker li {
        list-style: none;
        float: left;
        margin-top: 3px;
    }

        .theme-picker li a {
            padding: 5px 10px 0;
            margin: 0 5px 0 0;
        }

            .theme-picker li a.active {
                padding-top: 10px;
            }

                .theme-picker li a.active > .fa {
                    color: white !important;
                }

    .theme-picker .default {
        background: #2d86b3;
    }

    .theme-picker .alpha {
        background: #516f07;
    }

    .theme-picker .bravo {
        background: #FF196C;
    }

    .theme-picker .charlie {
        background: #622D67;
    }

    .theme-picker .delta {
        background: #DF2B0D;
    }

    .theme-picker .face {
        background: #3B5998;
    }

    .theme-picker .hallowen {
        background: #F05A23;
    }

    .theme-picker .sofiaxt {
        background: rgb(40,164,221);
        background: -moz-linear-gradient(top, rgba(40,164,221,1) 0, rgba(138,195,66,1) 50%, rgba(244,144,34,1) 100%);
        background: -webkit-linear-gradient(top, rgba(40,164,221,1) 0,rgba(138,195,66,1) 50%,rgba(244,144,34,1) 100%);
        background: linear-gradient(to bottom, rgba(40,164,221,1) 0,rgba(138,195,66,1) 50%,rgba(244,144,34,1) 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#28a4dd', endColorstr='#f49022',GradientType=0 );
    }

    .theme-picker > a:hover {
        padding-top: 10px;
    }




/**********POST**********************/

.thumbnail.img-responsive.logro {
    width: 40%;
}

.feed {
    font-size: 17px;
}

.title-feed {
}

.body-feed {
    margin-top: -15px;
}

.hide-text-comments {
    display: none;
}

@media (min-width: 768px) {

    .item-feed .thumbnail img {
        float: left;
    }

    .item-feed .thumbnail .caption {
        line-height: 45px;
    }

    .hide-text-comments {
        display: inline-block;
    }
}

.header-feed {
}

    .header-feed .img-header-feed {
        float: left;
        width: 48px;
        height: 48px;
        background: white;
        overflow: hidden;
        margin-right: 10px;
    }

        .header-feed .img-header-feed a {
            display: block;
        }

        .header-feed .img-header-feed img {
            width: 48px;
        }

.item-feed {
    overflow: hidden;
}

.btnFeedsImg {
    width: 200px;
    display: block;
    margin: auto;
}

#muroFilter, .feedC {
    -moz-box-shadow: 1px 4px 6px rgba(102, 102, 102, 0.4);
    -webkit-box-shadow: 1px 4px 6px rgba(102, 102, 102, 0.4);
    box-shadow: 1px 4px 6px rgba(102, 102, 102, 0.4);
    margin-bottom: 10px;
    padding: 10px 15px 10px;
    position: relative;
    overflow: visible;
    margin-left: -30px;
    margin-right: -30px;
}

    #muroFilter:after, .feedC::after {
        content: '';
        clear: both;
        display: block;
    }

/*******intro css*/
.introjs-helperNumberLayer {
    -moz-box-sizing: initial;
    -webkit-box-sizing: initial;
    box-sizing: initial;
}

/*Dashboard Teacher*/
@-moz-document url-prefix() {
    fieldset {
        display: table-cell;
    }
}

.pricing {
    text-align: center;
    margin-top: 10px;
}

/*body.profesor {
    background-image: url(/Content/img/fondos/Default/fondo-maestros.jpg);
     "background-repeat": "no-repeatr", "-webkit-background-size": "cover", "-moz-background-size": "cover", "-o-background-size": "cover", "background-size": "cover";
}*/

.html-profesor {
    min-height: 100%;
    height: inherit;
}

.profesor {
    margin-top: 10px;
}

    .profesor hr {
        border-bottom: solid gray 1px;
    }

.upload-file > input {
    cursor: pointer;
}

.profesor:after {
    content: '';
    clear: both;
    display: block;
}

.profesor .asignar_tarea {
}

.profesor .table tr {
    background: #fff;
}

.profesor .table td, .table th {
    text-align: left;
}

.profesor .table-responsive > .fixed-column {
    position: absolute;
    display: inline-block;
    width: auto;
    border-right: 1px solid #ddd;
    z-index: 1;
    cursor: auto;
}

    .profesor .table-responsive > .fixed-column:active {
        cursor: auto;
    }

/*@media (min-width:768px) {
       .profesor .table-responsive > .fixed-column {
        display: none;
        }
    }*/
.profesor .btn-link {
    color: #E57200;
}

    .profesor .btn-link:hover {
        text-decoration: none;
        color: #428BCA;
    }


.profesor .tabs-alumno li a .badge {
    position: absolute;
    right: 0;
    top: -5px;
    background: #E57201;
}

.profesor .tabs-alumno li.active a .badge {
    background: #0082C0;
}

.profesor .tabs-alumno li a .badge .fa {
    color: white !important;
}

.profesor .list-group-item {
    background-color: transparent;
    border-left: none;
    border-right: none;
}

    .profesor .list-group-item .fa-stack {
        height: 0;
        margin-left: -.3em;
    }

        .profesor .list-group-item .fa-stack .fa-stack-2x {
            font-size: 1.4em;
            margin-top: -.5em;
        }

        .profesor .list-group-item .fa-stack .fa-stack-1x {
            margin-top: -.9em;
        }

    .profesor .list-group-item .row .col-sm-1 {
        padding-left: 16px;
        padding-right: 0;
        margin-bottom: 10px;
    }

    .profesor .list-group-item .row .col-sm-8 {
        margin-bottom: 10px;
    }

.profesor a.show-all {
    border-top-width: 2px !important;
    border-top-color: #333 !important;
    border-bottom: none;
}

    .profesor a.show-all:hover {
        border-top-width: 2px;
        border-top-color: #333;
    }

.profesor a.list-group-item:hover,
.profesor a.list-group-item:focus,
.profesor a.list-group-item.active {
    background-color: #428bca;
    color: #fff;
    border-color: #428bca;
}

    .profesor a.list-group-item:hover .fa-inverse,
    .profesor a.list-group-item:focus .fa-inverse,
    .profesor a.list-group-item.active .fa-inverse {
        color: #555;
    }

.profesor .list-group-item.disabled,
.profesor .list-group-item.disabled:hover,
.profesor .list-group-item.disabled:focus {
    color: #777 !important;
    background-color: #eee !important;
    border-color: #eee !important;
    cursor: not-allowed;
}

.profesor .show-all .list-group {
    margin-bottom: 0;
}

.profesor .show-all .list-group-item .fa {
    margin-right: 10px;
}

.profesor .fa-ul {
    margin: 0;
}

.profesor .list-group-item:first-child {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

.profesor .list-group-item:last-child {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

.profesor .table.table-checkList tbody td {
    text-align: center;
}

.profesor .table {
    margin-bottom: 0;
}

    .profesor .table .checkbox {
        padding: 5px;
        font-size: 11px;
        display: block;
        position: relative;
        text-wrap: normal;
    }

        .profesor .table .checkbox input[type="checkbox"] {
            top: 50%;
            margin-top: -6.5px;
        }

        .profesor .table .checkbox .alert {
            padding: 0;
        }

    .profesor .table tbody td {
        text-align: left;
    }

        .profesor .table tbody td.text-center {
            text-align: center;
        }

td .checkbox label:hover {
}

.profesor .table tbody td > a {
    padding: 3px;
}

.profesor .table tbody td a:hover {
    text-decoration: none;
}

.profesor .table tbody td ul.fa-ul {
    margin-left: 0;
}

.profesor .table > thead > tr > th {
    background: #EDF0F1;
    color: #0082c0;
}

.profesor .table .list-group {
    margin-bottom: 0;
}

.profesor .full-box {
    padding: 0;
}

    .profesor .full-box:after {
        content: '';
        clear: both;
        display: block;
    }

.profesor .full-box-item {
    padding: 10px 15px 10px;
}

    .profesor .full-box-item:after {
        content: '';
        clear: both;
        display: block;
    }

    .profesor .full-box-item .panel .list-group {
        margin: 0;
    }

    .profesor .full-box-item .tab-content {
        border-top: solid 1px rgb(221, 221, 221);
        margin: -1px -15px;
        padding: 0 15px;
    }

    .profesor .full-box-item > .list-group {
        margin: 0 -15px;
        margin-bottom: -10px;
        margin-top: -11px;
    }

.profesor .full-box .tab-pane .list-group {
    margin: 0 -15px;
    margin-bottom: -11px;
}

.profesor .full-box-item .nav-tabs + .tab-content .list-group {
    margin-top: -1px;
}

.profesor .full-box-item .list-group-item.divider {
    border-top: 5px solid #ddd;
    padding: 0;
}

.profesor .main {
    background: rgb(247,247,247) !important;
}

.profesor .page_title {
    margin: 0;
    background: #EDF0F1 !important;
    border-color: #CBCBCB;
    border-bottom: none;
}

    .profesor .page_title h1, .profesor .page_title h2, .profesor .page_title h3, .profesor .page_title h4, .profesor .page_title h5, .profesor .page_title h6 {
        text-align: left;
    }

.profesor .nav-tabs.nav-justified > li > a {
    background: transparent;
    border-top: none;
    border-left: none;
    border-right: none;
}

    .profesor .nav-tabs.nav-justified > li > a:hover {
        color: #333;
    }

.profesor .nav-tabs.nav-justified > .active > a,
.profesor .nav-tabs.nav-justified > .active > a:hover,
.profesor .nav-tabs.nav-justified > .active > a:focus {
    border: 1px #CBCBCB solid !important;
    border-bottom-color: transparent !important;
}

.profesor .nav-tabs, .profesor .nav-justified {
    position: relative;
    z-index: 1;
}

    .profesor .nav-tabs > li > a, .profesor .nav-justified > li > a {
        color: #333;
        font-size: 120%;
        font-weight: lighter;
    }

    .profesor .nav-tabs li .fa, .profesor .nav-justified li .fa {
        color: #0082C0;
    }

    .profesor .nav-tabs > li > a:hover, .profesor .nav-justified > li > a:hover {
        border-color: transparent;
        border-bottom-color: #e57200;
        background-color: transparent;
    }

    .profesor .nav-tabs > li.active > a,
    .profesor .nav-tabs > li.active > a:hover,
    .profesor .nav-tabs > li.active > a:focus,
    .profesor .nav-justified > li.active > a,
    .profesor .nav-justified > li.active > a:hover,
    .profesor .nav-justified > li.active > a:focus {
        background-color: #EDF0F1;
        color: #0082C0;
        border-color: #CBCBCB;
        border-bottom-color: transparent;
    }

.profesor ul.nav-tabs li a span.icon.fa {
    display: block;
    text-align: center;
}

.profesor ul.nav-tabs li a span.tab-text {
    font-size: .8em;
}

/*TAB PREMIUM*/

.profesor .nav-tabs li.premium .fa, .profesor .nav-justified li.premium .fa {
    color: #f78d27;
}

.profesor .nav-tabs > li.premium > a:hover, .profesor .nav-justified > li.premium > a:hover {
    border-color: transparent;
    border-bottom-color: #1873ba;
}

.profesor .nav-tabs > li.active.premium > a,
.profesor .nav-tabs > li.active.premium > a:hover,
.profesor .nav-tabs > li.active.premium > a:focus,
.profesor .nav-justified > li.active.premium > a,
.profesor .nav-justified > li.active.premium > a:hover,
.profesor .nav-justified > li.active.premium > a:focus {
    background: white;
    color: #f78d27;
}

.profesor .nav-tabs li.premium.active .fa, .profesor .nav-justified li.premium.active .fa {
    color: #f78d27;
}

.profesor .nav-tabs > li.premium.active > a:hover, .profesor .nav-justified > li.premium.active > a:hover {
    border-color: #CBCBCB;
    border-bottom-color: transparent;
    border-bottom-width: 1px;
}

/*END TAB PREMIUM*/

.profesor ul.nav-tabs li a span.fa-stack {
    display: block;
    margin: auto;
    height: 1.6em;
    margin-top: -.56em;
}

    .profesor ul.nav-tabs li a span.fa-stack .fa-stack-2x {
        font-size: 1.5em;
        margin-top: .2em;
    }

.profesor .fa-stack-text {
    margin-top: .6em;
    font-size: 11px;
}

.profesor .alert {
    border-width: 1px;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}

.profesor .alert-default {
    color: #555 !important;
    background-color: #E4E4E4;
    border-color: #CECECE;
}

.profesor .alert-success {
    color: #3c763d !important;
    background-color: #dff0d8;
    border-color: #d6e9c6;
}

.profesor .alert-info {
    color: #31708f !important;
    background-color: #d9edf7;
    border-color: #bce8f1;
}

.profesor .alert-warning {
    color: #8a6d3b !important;
    background-color: #fcf8e3;
    border-color: #faebcc;
}

.profesor .alert-danger {
    color: #a94442 !important;
    background-color: #f2dede;
    border-color: #ebccd1;
}

.profesor .panel-group {
    /*margin-bottom:-10px*/
}

    .profesor .panel-group .panel-collapse {
        border-radius: 0;
        margin: 0 0 -1px;
    }

        .profesor .panel-group .panel-collapse textarea {
            border-radius: 0;
        }

            .profesor .panel-group .panel-collapse textarea:focus {
                border-color: none;
                box-shadow: none;
            }

.profesor .panel-heading-collapse {
    padding: 0;
}

.profesor .panel-title a {
    display: block;
    padding: 9px 8px;
    position: relative;
    text-transform: uppercase;
    color: rgb(0, 130, 192);
}

.panel-title a.active {
    background: rgb(230, 230, 230);
    text-decoration: underline;
}

.profesor .panel-title a:hover, .profesor .panel-title a:active, .profesor .panel-title a:visited {
    text-decoration: underline;
    background: rgb(230, 230, 230);
}

.profesor .tr-title:hover {
    background: white !important;
}

.profesor .tr-title th {
    color: rgb(0, 130, 192);
}

.profesor .list-panel .table-responsive {
    margin-bottom: 0;
}

.profesor .list-panel .table-hover > tbody > tr.click-row:hover {
    cursor: pointer;
}

.btn-spacebelow {
    display: block;
}

@media (min-width: 426px) {
    .btn-spacebelow {
        display: inline-block;
    }
}

.btn-edit-groups .fa-check {
    color: green !important;
}

.overlay, .overlay-list-group {
    display: none;
    width: 100%;
    z-index: 1000;
    position: absolute;
    height: 100%;
    background-color: rgba(29, 28, 28, 0.5);
    top: 0;
    left: 0;
}

.overlay-list-group {
    background: transparent;
}

/* Rotate Move */
@-webkit-keyframes rotate-move {
    25% {
         -moz-transform: rotate(10deg); 
         -ms-transform: rotate(10deg); 
         -o-transform: rotate(10deg);
        -webkit-transform: rotate(10deg);
        transform: rotate(10deg);
    }

    75% {
        -moz-transform: rotate(0);
        -ms-transform: rotate(0);
        -o-transform: rotate(0);
        -webkit-transform: rotate(0);
        transform: rotate(0);
    }
}

@keyframes rotate-move {
    25% {
        -moz-transform: rotate(10deg);
        -ms-transform: rotate(10deg);
        -o-transform: rotate(10deg);
        -webkit-transform: rotate(10deg);
        transform: rotate(10deg);
    }

    75% {
        -moz-transform: rotate(0);
        -ms-transform: rotate(0);
        -o-transform: rotate(0);
        -webkit-transform: rotate(0);
        transform: rotate(0);
    }
}

.btn-remove-group {
    display: none;
    position: absolute;
    z-index: 1001;
    right: 10px;
    top: 50%;
    margin-top: -11px;
}

    .btn-remove-group .fa {
        -moz-animation-name: rotate-move;
        -o-animation-name: rotate-move;
        -webkit-animation-name: rotate-move;
        animation-name: rotate-move;
        -webkit-animation-duration: .5s;
        -moz-animation-duration: .5s;
        -o-animation-duration: .5s;
        animation-duration: .5s;
        -webkit-animation-timing-function: linear;
        -moz-animation-timing-function: linear;
        -o-animation-timing-function: linear;
        animation-timing-function: linear;
        -webkit-animation-iteration-count: infinite;
        -moz-animation-iteration-count: infinite;
        -o-animation-iteration-count: infinite;
        animation-iteration-count: infinite;
    }

        .btn-remove-group .fa:hover {
            -moz-animation: none;
            -o-animation: none;
            -webkit-animation: none;
            animation: none;
            -moz-transform: rotate(0);
            -ms-transform: rotate(0);
            -o-transform: rotate(0);
            -webkit-transform: rotate(0);
            transform: rotate(0);
        }

/*RECURSOS*/

.profesor .resources {
}

.profesor .resource-search {
    padding: 25px 0;
    margin-top: -15px;
    background: url(/Content/img/recursos/banner-recursos.jpg) center center no-repeat !important;
    background-size: cover !important;
}

.profesor .resource-search-text {
    font-weight: bold;
    font-size: 17px;
    margin-top: 15px;
    color: #403F3F;
}

.profesor .resources div[class^="col"] {
    padding-right: 10px;
    padding-left: 10px;
}



.list-group-item.resources .resources-name {
    overflow: hidden;
    -ms-text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.list-group-item.resources .thumbnail {
    margin-bottom: 0;
}

.resources-name {
    line-height: 1;
}

.profesor .resources-name a {
}

.profesor .resources-name, .profesor .resources-name a {
    font-size: 20px;
    color: black;
}

.profesor .resources-tags .label {
    margin-right: 5px;
}

.profesor .resources-create {
    font-size: 18px;
}

.profesor .resources-price {
    text-align: center;
    margin-bottom: 10px;
    font-size: 20px;
}

.profesor .resources-rate {
    text-align: center;
    margin-bottom: 10px;
}

    .profesor .resources-rate .resources-rate-stars {
        display: inline-block;
    }

.acotaciones-calendar {
    padding: 0;
    margin: 0;
    list-style: none;
}

    .acotaciones-calendar li {
        display: inline-block;
        margin-right: 10px;
    }

        .acotaciones-calendar li:nth-child(1) > span {
            color: #1873ba;
        }

        .acotaciones-calendar li:nth-child(2) > span {
            color: #20b476;
        }

        .acotaciones-calendar li:nth-child(3) > span {
            color: #f7d942;
        }

        .acotaciones-calendar li:nth-child(4) > span {
            color: #ec2c39;
        }

        .acotaciones-calendar li:nth-child(5) > span {
            color: #c21d85;
        }

        .acotaciones-calendar li:nth-child(6) > span {
            color: #f78d27;
        }

        .acotaciones-calendar li:nth-child(7) > span {
            color: #f15b28;
        }

.resources-rate-stars .fa {
    color: gold;
    cursor: pointer;
}

.resources-downloads {
    text-align: center;
}

.resources-filter .list-group-item:hover {
    background: transparent;
}

.resources-filter-hr {
    border-bottom: 2px solid;
    margin: 4px 0 0;
}

.resources-filter-link {
    display: block;
    color: gray;
    margin-left: 5px;
}

    .resources-filter-link:hover {
        color: black;
        text-decoration: none;
    }

    .resources-filter-link.active {
        color: black;
        font-weight: bolder;
    }

.resources-items .thumbnail h3 {
    overflow: hidden;
    white-space: nowrap;
    -ms-text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
}

.resources-items .truncate-text {
    height: 60px;
}

.resources-comments .page_title {
    margin: 0;
}

.resources-comment-add {
}

.resources-upload-image {
    display: block;
}

    .resources-upload-image i:hover {
        cursor: pointer;
    }

    .resources-upload-image img:hover {
        cursor: pointer;
    }

.resources-label {
    font-weight: bolder;
    margin-top: 5px;
    margin-bottom: 5px;
}

div.product-chooser {
}
    /*Selector de Libros*/
    div.product-chooser.disabled div.product-chooser-item {
        -ms-zoom: 1;
        zoom: 1;
        filter: alpha(opacity=60);
        opacity: 0.6;
        cursor: default;
    }

    div.product-chooser div.product-chooser-item {
        padding: 11px;
        border-radius: 6px;
        cursor: pointer;
        position: relative;
        border: 1px solid #efefef;
        margin-bottom: 10px;
        margin-left: 10px;
        margin-right: 10px;
        overflow:hidden;
    }

        div.product-chooser div.product-chooser-item:hover {
            outline: 4px solid #428bca;
        }

        div.product-chooser div.product-chooser-item.selected {
            outline: 4px solid #428bca;
            background: #efefef;
        }

            div.product-chooser div.product-chooser-item.selected > span {
                color: white;
                font-size: 18px;
                display: block !important;
                position: absolute;
                z-index: 1;
                left: 0;
                top: 0;
                background-color: rgba(26, 221, 41,.5);
                width: 100%;
                height: 100%;
                text-align: center;
            }

                div.product-chooser div.product-chooser-item.selected > span > p {
                    position: absolute;
                    background: rgba(0,0,0,.5);
                    top: 50%;
                    left: 0;
                    right: 0;
                }

        div.product-chooser div.product-chooser-item img {
            padding: 0;
        }

        div.product-chooser div.product-chooser-item span.title {
            display: block;
            margin: 10px 0 5px 0;
            font-weight: bold;
            font-size: 12px;
        }

        div.product-chooser div.product-chooser-item span.description {
            font-size: 12px;
        }

        div.product-chooser div.product-chooser-item input {
            position: absolute;
            left: 0;
            top: 0;
            visibility: hidden;
        }

.dl-horizontal dt {
    text-align: left;
    margin-bottom: 1em;
    width: auto;
    padding-right: 1em;
}

.dl-horizontal dd {
    margin-left: 0;
    /*margin-bottom: 1em;*/
}

.table-user-information > thead > tr {
    border: rgb(203, 203, 203) 1px solid;
    border-top: none;
    border-bottom: none;
}

.table-user-information > thead th {
    text-align: center;
}


.table-user-information > tbody > tr {
    border-top: 1px solid rgb(221, 221, 221);
}

    .table-user-information > tbody > tr:first-child {
        border-top: 0;
    }


    .table-user-information > tbody > tr > td {
        border-top: 0;
    }

.title-resumen dt.replace {
    font-size: 18px;
    margin-bottom: 3px;
}

.title-resumen dd {
    margin-bottom: 5px;
    margin-left: 0;
}

.items-teacher {
    margin: 0 -2px;
}

    .items-teacher li.items > a {
        float: left;
        width: 33.3333333%;
        height: 100px;
        padding: 10px;
        font-size: 12px;
        line-height: 1.4;
        text-align: center;
        color: #666;
        background: #fff;
        border: 1px solid #f7f7f7;
    }

        .items-teacher li.items > a:hover, .items-teacher li.items > a:hover .glyphicon {
            color: #fff;
            background-color: #e57200;
            text-decoration: none;
        }

    .items-teacher li.items .glyphicon {
        margin-top: 5px;
        margin-bottom: 10px;
        font-size: 18px;
        color: #666;
    }

    .items-teacher li.items .text-items {
        display: block;
        text-align: center;
        -ms-word-wrap: break-word;
        word-wrap: break-word;
    }

.items-teacher-list {
    padding-left: 0;
    list-style: none;
    margin-bottom: 0;
}

    .items-teacher-list .btn {
        border-radius: 0;
        padding: 6px 7px;
        color: #666;
        background: #fff;
        border: 1px solid #f7f7f7;
    }

        .items-teacher-list .btn:hover {
            color: #fff;
            background-color: #e57200;
        }

        .items-teacher-list .btn .glyphicon {
            font-size: 18px;
        }

        .items-teacher-list .btn .caret {
            position: absolute;
            right: 14px;
        }

.div_grupos li.items a {
    font-size: 18px;
}

.div_grupos li.items .fa {
    font-size: 24px;
}

.div_temas li.items a {
    height: 100px;
}

.div_alumnos_p .glyphicon, .div_alumnos_n .glyphicon {
    margin-right: 5px;
    font-size: 20px !important;
}

.div_alumnos_p li.items a, .div_alumnos_n li.items a {
    float: none;
    width: auto;
    line-height: normal;
    display: block;
    text-align: left;
    height: auto;
}

.div_alumnos_p li.items .text-items, .div_alumnos_n li.items .text-items {
    display: inline;
}

.text-about {
    font-size: 18px;
    margin-top: 10px;
}

.text-important {
    font-size: 22px;
    margin-top: 15px;
    margin-bottom: 15px;
    text-align: center;
}


ul.sofia > li {
    list-style-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAIGNIUk0AAHolAACAgwAA+f8AAIDoAABSCAABFVgAADqXAAAXb9daH5AAAAOPSURBVDjLXczJb1R1AMDx7+9ts3SWTmfKlE4709YCSRtSi0CQUDQuiJXFo3jQmHjAqIkH5YaJBzy5Jy6JeJAlkbhFqq1oLYWkFctewS5AIwotMPNmfbTvzfJ+Hkw8+PkDPkJKyZv79gnHcQJ30mlPd1dXfnJysupKKOYL4aWlu83xpqZMPpdPJxIJoela5OjAQLRQKFhCiLQGoCmqFF5vKRZpKI0MD9OaSkXNbHbL9WtXnjVvzz9QbOs4E40vf+P82XMjgVAwu7a3t7C8pUVTFAUFoFwuc2xwSBgeT+fdUun10R+Hjo8NHT1sOrXH6tdt8VpS33Tt97Pf2ovWh0BbJBqrRerrHQSuBiCEWGNZ1kuHDhx4klo14o+30rn9eYwN2zEj7WjzM+jD+wPWqR92z18pbE0kmt9SFOXAz8d+KgkpJU9s3Xro0uTlpxLNy1TjwV2kNz7D5nuWsaejRlSrcX7R4IPLFrMTJwmPHaI0dcYNRKIDuULhZQ2gUq0qnSs60IwA9tRpfHjI+HYy2pCkRYMlJIpQqAQbUWNJ4rEFJbdYerjilNs1gOKidPvaamzrznLktMmF0b+5OXOK9/t2Yad6CP51gcBvAzTNTSG8Lv5UGPKG5VSqtgaQyWZrvnaDTfevYf3qLF8MTvL1tIt67GMaDYNqJo/wWMT7NLofaUAVKr+850jHrkoNYMm23TpDlW7uDr6+PTzXNs6GsUHeHiwxVfSwql+l56EO+nr6aQ2v5rOv3mFpMSt1Q/s3CPj9lbAPhK8OGu+F+gTxuQka5R9MNwTZvG09T697FYNmJm4dJJ1fQBFaLRAI1DQAQ1fQdBVaesDOwPXjOH+eplgL4wmHsJ0CN6wZ6oTFRfNLnPJdVEK25lXLCoCuq9lvZoLy8KcHsQZ2g2pRjvZQlnV4DUHanuaS+R05ZQaqPorXvQjQPB5D0QCSzfF3Y80p8dEl/wvjC9ngnsznBHUVqUfQ61Qam0LctuY4cXSOmVGH3A1kIhmZbU0lc0JKyc4dO0h1rFT9Xu+jY+em9kbUwsZNSclUxk+tXSeWrHJt3OHObKWmeOREx8rUwf7+x49cvHAx+1+QbF9BJBQglzNjZt565eYt80Wf7tbjQnmRSiDkPekPefZ3dXd9rwvFOjEygm3baPyP68qM32vs7Uw1/Wqa5muKohZ771v1SckqjMzPL9hre9doc1evhl3XLQNL/wBTDJK4A7lTRQAAAABJRU5ErkJggg==') /*img/list-sofia.png*/;
    margin-bottom: 10px;
    font-family: 'Gandhi';
    font-size: 18px;
}

.btn-group.btn-block > .btn.btn-block > .fa {
    position: absolute;
    right: 14px;
}

    .btn-group.btn-block > .btn.btn-block > .fa.icon-dropdown {
        position: static;
    }


/*******************  CHAT *****************/
.btn-chat {
    width: 285px;
    height: auto;
    overflow: hidden;
    position: fixed;
    right: 25px;
    bottom: 0;
    cursor: pointer;
    font-size: 18px;
    padding: 5px;
    z-index: 999;
}

    .btn-chat img {
        float: left;
        width: 30px;
        margin-right: 10px;
    }

    .btn-chat .replace {
        margin: 0;
        padding: 0;
    }

.chat {
    width: 285px;
    height: 285px;
    background: white;
    position: fixed;
    overflow: hidden;
    right: 335px;
    bottom: 0;
    -moz-box-shadow: 3px 3px 7px rgba(102, 102, 102, 0.4);
    -webkit-box-shadow: 3px 3px 7px rgba(102, 102, 102, 0.4);
    box-shadow: 3px 3px 7px rgba(102, 102, 102, 0.4);
    border: #fff solid 1px;
    z-index: 100;
}

.chat-header {
    width: 100%;
    height: 35px;
    line-height: 27px;
    overflow: hidden;
    padding: 5px;
    position: relative;
    float: left;
    font-weight: bold;
    cursor: pointer;
    z-index: 200;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    white-space: nowrap;
    -ms-text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    padding-right: 25px;
}


    .chat-header .close-chat {
        position: absolute;
        right: 5px;
        top: -3px;
    }

.chat-body {
    background: #EDEFF4;
    width: 285px;
    height: 285px;
    -moz-box-sizing: initial;
    -webkit-box-sizing: initial;
    box-sizing: initial;
}

.conversacion-chat {
    margin-top: 35px;
    height: 210px;
    overflow: scroll;
    overflow-x: hidden;
    padding: 5px;
    -moz-box-sizing: initial;
    -webkit-box-sizing: initial;
    box-sizing: initial;
}

.text-chat {
    position: absolute;
    bottom: 0;
    border: none;
    width: 100%;
    height: 30px;
    padding: 0 5px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}


/**/
/*****************************************/
/***burbujas de chat**/
.chat-user {
    position: relative;
    background: #88AA31;
    padding: 5px;
    float: right;
    max-width: 75%;
    min-width: 10%;
    width: auto;
    color: White;
    font-weight: bold;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    margin: 4px 0;
    margin-right: 5px;
    clear: both;
}

    .chat-user:after {
        left: 100%;
        top: 50%;
        border: solid transparent;
        content: " ";
        height: 0;
        width: 0;
        position: absolute;
        pointer-events: none;
        border-color: rgba(136, 183, 213, 0);
        border-left-color: #88AA31;
        border-width: 10px;
        margin-top: -10px;
    }

.chat-guest {
    position: relative;
    background: #3399cc;
    padding: 5px;
    float: left;
    max-width: 75%;
    min-width: 10%;
    width: auto;
    color: White;
    font-weight: bold;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    margin: 4px 0;
    margin-left: 5px;
    clear: both;
}

    .chat-guest:after {
        right: 100%;
        top: 50%;
        border: solid transparent;
        content: " ";
        height: 0;
        width: 0;
        position: absolute;
        pointer-events: none;
        border-color: rgba(136, 183, 213, 0);
        border-right-color: #3399cc;
        border-width: 10px;
        margin-top: -10px;
    }

.chat-status {
    float: right;
    margin-top: 3px;
    white-space: pre;
    position: absolute;
    right: 0;
}
/*******************************************/
/***Chat list ******/



.chat-list {
    width: 295px;
    height: 400px;
    background: white;
    position: fixed;
    overflow: hidden;
    right: 25px;
    bottom: 0;
    -moz-box-shadow: 3px 3px 7px rgba(102, 102, 102, 0.4);
    -webkit-box-shadow: 3px 3px 7px rgba(102, 102, 102, 0.4);
    box-shadow: 3px 3px 7px rgba(102, 102, 102, 0.4);
    z-index: 99999999;
}

    .chat-list .chat-body {
        width: auto;
        height: 365px;
        background: white;
    }

.chat-header-list {
    width: 100%;
    height: 35px;
    overflow: hidden;
    cursor: pointer;
    font-size: 18px;
    padding: 5px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.chat-body .select-group-chat {
    padding: 5px;
}

.chat-header-list img {
    float: left;
    width: 30px;
    margin-right: 10px;
}

.chat-header-list .replace {
    margin: 0;
    padding: 0;
}

.chat-list .text-chat {
    border-top: #ccc solid 1px;
}

#chat-div-chats .list-user {
    height: 323px;
}

.list-user {
    height: 250px;
    overflow: auto;
    overflow-x: hidden;
    padding: 5px;
}

    .list-user li {
        list-style: none;
        padding: 5px;
        padding-right: 24px;
        white-space: nowrap;
        overflow: hidden;
        -ms-text-overflow: ellipsis;
        -o-text-overflow: ellipsis;
        text-overflow: ellipsis;
        position: relative;
    }

        .list-user li:hover {
            background: #DFF0F5;
            cursor: pointer;
        }

/*************Autocomplete****************/

.ui-autocomplete {
    border: 1px solid #aaaaaa;
    color: #000000;
    background: white;
    width: 193px;
    padding: 0;
}

.ui-menu .ui-menu-item {
    margin: 0;
    cursor: pointer;
    min-height: 0;
    list-style: none;
    overflow: hidden;
}

    .ui-menu .ui-menu-item:hover {
        background: #428BCA;
    }

        .ui-menu .ui-menu-item:hover a {
            color: white;
        }

    .ui-menu .ui-menu-item .ui-menu-img {
        float: left;
        width: 50px;
        height: 50px;
        background: white;
        overflow: hidden;
        margin: 5px;
    }

    .ui-menu .ui-menu-item .ui-menu-school {
        display: block;
        margin: 5px;
        margin-top: 0;
        float: left;
        color: #848484;
        font-size: 13px;
    }

.ui-menu-img img {
    width: 50px;
}

.ui-widget-content a {
    padding: 5px;
    font-size: 82%;
    display: inline-block;
}

    .ui-widget-content a:hover {
        text-decoration: none;
    }

.twitter-typeahead {
    width: 100%;
}

    .twitter-typeahead .tt-query,
    .twitter-typeahead .tt-hint {
        margin-bottom: 0;
    }

.tt-dropdown-menu {
    min-width: 160px;
    margin-top: 2px;
    padding: 5px 0;
    background-color: #fff;
    border: 1px solid #ccc;
    border: 1px solid rgba(0,0,0,.2);
    *border-right-width: 2px;
    *border-bottom-width: 2px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
    -webkit-box-shadow: 0 5px 10px rgba(0,0,0,.2);
    -moz-box-shadow: 0 5px 10px rgba(0,0,0,.2);
    box-shadow: 0 5px 10px rgba(0,0,0,.2);
    -webkit-background-clip: padding-box;
    -moz-background-clip: padding;
    background-clip: padding-box;
    width: 100%;
}

.tt-suggestion {
    display: block;
    padding: 3px 20px;
}

    .tt-suggestion.tt-is-under-cursor {
        color: #fff;
        background-color: #0081c2;
        background-image: -moz-linear-gradient(top, #0088cc, #0077b3);
        background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0088cc), to(#0077b3));
        background-image: -webkit-linear-gradient(top, #0088cc, #0077b3);
        background-image: -o-linear-gradient(top, #0088cc, #0077b3);
        background-image: linear-gradient(to bottom, #0088cc, #0077b3);
        background-repeat: repeat-x;
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff0088cc', endColorstr='#ff0077b3', GradientType=0);
    }

        .tt-suggestion.tt-is-under-cursor a {
            color: #fff;
        }

    .tt-suggestion p {
        margin: 0;
    }

/****************TIENDA*******************/

.title-product {
    -ms-text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    padding-bottom: 2px;
}

.producto .text-center {
    height: 22px;
}

.text-product {
    height: 89px;
    overflow: hidden;
    margin-bottom: 1em;
}

.main.producto img {
    min-height: 90px;
    max-height: 90px;
}

/*SLIDER*/
/* 
 * 	Core Owl Carousel CSS File
 *	v1.3.3
 */

/* clearfix */
.owl-carousel .owl-wrapper:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}
/* display none until init */
.owl-carousel {
    display: none;
    position: relative;
    width: 100%;
    -ms-touch-action: pan-y;
    touch-action: pan-y;
}

    .owl-carousel .owl-wrapper {
        display: none;
        position: relative;
        -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
        -o-transform: translate3d(0, 0, 0);
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

    .owl-carousel .owl-wrapper-outer {
        overflow: hidden;
        position: relative;
        width: 100%;
    }

        .owl-carousel .owl-wrapper-outer.autoHeight {
            -webkit-transition: height 500ms ease-in-out;
            -moz-transition: height 500ms ease-in-out;
            -o-transition: height 500ms ease-in-out;
            transition: height 500ms ease-in-out;
        }

    .owl-carousel .owl-item {
        float: left;
    }

.owl-controls .owl-page,
.owl-controls .owl-buttons div {
    cursor: pointer;
}

.owl-controls {
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.owl-item .item {
    margin: 0 10px;
    padding: 10px;
    position: relative;
    overflow: visible;
}

    .owl-item .item .row {
        margin-right: -10px;
        margin-left: -10px;
    }

    .owl-item .item:after {
        content: '';
        clear: both;
        display: block;
    }

    .owl-item .item img {
        max-height: 87px;
    }
/* mouse grab icon */
.grabbing {
    cursor: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAO0lEQVQ4y2NgGHbgPxTjY+PWDAP42PgM+k8IwNRQZAg+A/5TYsB/UgBFBtDM/0QZQkxawGsI3QygLwAAbjZlqS88cqkAAAAASUVORK5CYII=') /*img/grabbing.png*/ 8 8, move;
}

/* fix */
.owl-carousel .owl-wrapper,
.owl-carousel .owl-item {
    -moz-backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -moz-transform: translate3d(0,0,0);
    -ms-transform: translate3d(0,0,0);
    -o-transform: translate3d(0,0,0);
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
}

/* 
 *  Owl Carousel CSS3 Transitions 
 *  v1.3.2
 */

.owl-origin {
    -webkit-perspective: 1200px;
    -webkit-perspective-origin-x: 50%;
    -webkit-perspective-origin-y: 50%;
    -moz-perspective: 1200px;
    -moz-perspective-origin-x: 50%;
    -moz-perspective-origin-y: 50%;
    -ms-perspective: 1200px;
    perspective: 1200px;
}
/* fade */
.owl-fade-out {
    z-index: 10;
    -webkit-animation: fadeOut .7s both ease;
    -moz-animation: fadeOut .7s both ease;
    -o-animation: fadeOut .7s both ease;
    animation: fadeOut .7s both ease;
}

.owl-fade-in {
    -webkit-animation: fadeIn .7s both ease;
    -moz-animation: fadeIn .7s both ease;
    -o-animation: fadeIn .7s both ease;
    animation: fadeIn .7s both ease;
}
/* backSlide */
.owl-backSlide-out {
    -webkit-animation: backSlideOut 1s both ease;
    -moz-animation: backSlideOut 1s both ease;
    -o-animation: backSlideOut 1s both ease;
    animation: backSlideOut 1s both ease;
}

.owl-backSlide-in {
    -webkit-animation: backSlideIn 1s both ease;
    -moz-animation: backSlideIn 1s both ease;
    -o-animation: backSlideIn 1s both ease;
    animation: backSlideIn 1s both ease;
}
/* goDown */
.owl-goDown-out {
    -webkit-animation: scaleToFade .7s ease both;
    -moz-animation: scaleToFade .7s ease both;
    -o-animation: scaleToFade .7s ease both;
    animation: scaleToFade .7s ease both;
}

.owl-goDown-in {
    -webkit-animation: goDown .6s ease both;
    -moz-animation: goDown .6s ease both;
    -o-animation: goDown .6s ease both;
    animation: goDown .6s ease both;
}
/* scaleUp */
.owl-fadeUp-in {
    -webkit-animation: scaleUpFrom .5s ease both;
    -moz-animation: scaleUpFrom .5s ease both;
    -o-animation: scaleUpFrom .5s ease both;
    animation: scaleUpFrom .5s ease both;
}

.owl-fadeUp-out {
    -webkit-animation: scaleUpTo .5s ease both;
    -moz-animation: scaleUpTo .5s ease both;
    -o-animation: scaleUpTo .5s ease both;
    animation: scaleUpTo .5s ease both;
}
/* Keyframes */
/*empty*/
@-webkit-keyframes empty {
    0% {
        opacity: 1;
    }
}

@-moz-keyframes empty {
    0% {
        opacity: 1;
    }
}

@keyframes empty {
    0% {
        opacity: 1;
    }
}

@-webkit-keyframes fadeIn {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@-moz-keyframes fadeIn {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes fadeIn {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@-webkit-keyframes fadeOut {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

@-moz-keyframes fadeOut {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

@keyframes fadeOut {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

@-webkit-keyframes backSlideOut {
    25% {
        opacity: .5;
        -webkit-transform: translateZ(-500px);
    }

    75% {
        opacity: .5;
        -webkit-transform: translateZ(-500px) translateX(-200%);
    }

    100% {
        opacity: .5;
        -webkit-transform: translateZ(-500px) translateX(-200%);
    }
}

@-moz-keyframes backSlideOut {
    25% {
        opacity: .5;
        -moz-transform: translateZ(-500px);
    }

    75% {
        opacity: .5;
        -moz-transform: translateZ(-500px) translateX(-200%);
    }

    100% {
        opacity: .5;
        -moz-transform: translateZ(-500px) translateX(-200%);
    }
}

@keyframes backSlideOut {
    25% {
        opacity: .5;
        -moz-transform: translateZ(-500px);
        -ms-transform: translateZ(-500px);
        -o-transform: translateZ(-500px);
        -webkit-transform: translateZ(-500px);
        transform: translateZ(-500px);
    }

    75% {
        opacity: .5;
        -moz-transform: translateZ(-500px) translateX(-200%);
        -ms-transform: translateZ(-500px) translateX(-200%);
        -o-transform: translateZ(-500px) translateX(-200%);
        -webkit-transform: translateZ(-500px) translateX(-200%);
        transform: translateZ(-500px) translateX(-200%);
    }

    100% {
        opacity: .5;
        -moz-transform: translateZ(-500px) translateX(-200%);
        -ms-transform: translateZ(-500px) translateX(-200%);
        -o-transform: translateZ(-500px) translateX(-200%);
        -webkit-transform: translateZ(-500px) translateX(-200%);
        transform: translateZ(-500px) translateX(-200%);
    }
}

@-webkit-keyframes backSlideIn {
    0%, 25% {
        opacity: .5;
        -webkit-transform: translateZ(-500px) translateX(200%);
    }

    75% {
        opacity: .5;
        -webkit-transform: translateZ(-500px);
    }

    100% {
        opacity: 1;
        -webkit-transform: translateZ(0) translateX(0);
    }
}

@-moz-keyframes backSlideIn {
    0%, 25% {
        opacity: .5;
        -moz-transform: translateZ(-500px) translateX(200%);
    }

    75% {
        opacity: .5;
        -moz-transform: translateZ(-500px);
    }

    100% {
        opacity: 1;
        -moz-transform: translateZ(0) translateX(0);
    }
}

@keyframes backSlideIn {
    0%, 25% {
        opacity: .5;
        -moz-transform: translateZ(-500px) translateX(200%);
        -ms-transform: translateZ(-500px) translateX(200%);
        -o-transform: translateZ(-500px) translateX(200%);
        -webkit-transform: translateZ(-500px) translateX(200%);
        transform: translateZ(-500px) translateX(200%);
    }

    75% {
        opacity: .5;
        -moz-transform: translateZ(-500px);
        -ms-transform: translateZ(-500px);
        -o-transform: translateZ(-500px);
        -webkit-transform: translateZ(-500px);
        transform: translateZ(-500px);
    }

    100% {
        opacity: 1;
        -moz-transform: translateZ(0) translateX(0);
        -ms-transform: translateZ(0) translateX(0);
        -o-transform: translateZ(0) translateX(0);
        -webkit-transform: translateZ(0) translateX(0);
        transform: translateZ(0) translateX(0);
    }
}

@-webkit-keyframes scaleToFade {
    to {
        opacity: 0;
        -webkit-transform: scale(.8);
    }
}

@-moz-keyframes scaleToFade {
    to {
        opacity: 0;
        -moz-transform: scale(.8);
    }
}

@keyframes scaleToFade {
    to {
        opacity: 0;
        -moz-transform: scale(.8);
        -ms-transform: scale(.8);
        -o-transform: scale(.8);
        -webkit-transform: scale(.8);
        transform: scale(.8);
    }
}

@-webkit-keyframes goDown {
    from {
        -webkit-transform: translateY(-100%);
    }
}

@-moz-keyframes goDown {
    from {
        -moz-transform: translateY(-100%);
    }
}

@keyframes goDown {
    from {
        -moz-transform: translateY(-100%);
        -ms-transform: translateY(-100%);
        -o-transform: translateY(-100%);
        -webkit-transform: translateY(-100%);
        transform: translateY(-100%);
    }
}

@-webkit-keyframes scaleUpFrom {
    from {
        opacity: 0;
        -webkit-transform: scale(1.5);
    }
}

@-moz-keyframes scaleUpFrom {
    from {
        opacity: 0;
        -moz-transform: scale(1.5);
    }
}

@keyframes scaleUpFrom {
    from {
        opacity: 0;
        -moz-transform: scale(1.5);
        -ms-transform: scale(1.5);
        -o-transform: scale(1.5);
        -webkit-transform: scale(1.5);
        transform: scale(1.5);
    }
}

@-webkit-keyframes scaleUpTo {
    to {
        opacity: 0;
        -webkit-transform: scale(1.5);
    }
}

@-moz-keyframes scaleUpTo {
    to {
        opacity: 0;
        -moz-transform: scale(1.5);
    }
}

@keyframes scaleUpTo {
    to {
        opacity: 0;
        -moz-transform: scale(1.5);
        -ms-transform: scale(1.5);
        -o-transform: scale(1.5);
        -webkit-transform: scale(1.5);
        transform: scale(1.5);
    }
}


/*Aviso compatibilidad*/
.avisoBrowser {
    position: fixed;
    left: 0px;
    right: 0px;
    bottom: 0px;
    padding: 0;
    padding-top: 20px;
    margin: 0;
    width: 100%;
    height: auto;
    min-height: 165px;
    background: #e42f29;
    z-index: 9999;
    display: none;
}

    .avisoBrowser .main.browser {
        box-shadow: none !important;
        background: transparent !important;
    }

.link_browsers {
    display: block;
    padding: 5px;
}

    .link_browsers:hover {
        background: #dd5955;
    }

.avisoText {
    color: white;
    margin-bottom: 10px;
}

/*SLIDER INDEX*/

.carousel-inner > .item > img, .carousel-inner > .item > a > img {
    height: 180px;
}

.carousel .right, .carousel .left {
    float: none;
}

@media (min-width: 768px) {
    .carousel-inner > .item > img, .carousel-inner > .item > a > img {
        display: block;
        height: auto;
        max-width: 100%;
        line-height: 1;
        width: 100%;
    }
}

/*********************************************************************************************/
/*Estilos nuevo index*/
/*********************************************************************************************/

body#home {
    margin-bottom: 0;
    /*display: flex;
    flex-direction: column;*/
    width: 100%;
    min-height: 100vh;
    padding: 0;
    padding-top: 60px;
    background: #4B4C4E;
}

#navbar-top .replace {
    margin: 0;
    font-size: 127%;
    text-align: center;
    padding: 4px 70px 0 0;
    color: white;
}

#navbar-top .container {
    margin-top: 0;
}

.Grid-body {
    padding: 0;
    margin: 0;
    height: 100%;
}

.Grid {
    margin: 0;
    padding: 0;
    table-layout: fixed;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: table;
    width: 100%;
    height: 100%;
    overflow:hidden;
}

.Srow {
    display: table-row;
    position: relative;
}

    .Srow.Expand {
        height: auto;
    }

    .Srow.Header {
        height: 53px;
    }

a.link-home {
    color: #45B8E8;
}

    a.link-home:hover {
        text-decoration: none;
        color: white;
        -moz-transition: all 1s ease;
        -o-transition: all 1s ease;
        -webkit-transition: all 1s ease;
        transition: all 1s ease;
    }

header .container {
    margin-top: 0;
}

/*.imgBanner {
    margin-top: -66px;
}*/



.header-top {
    background: #4b4c4e;
    padding: 30px 10px;
}

    .header-top .container {
        margin-top: 0;
    }

    .header-top blockquote {
        color: white;
    }

        .header-top blockquote footer {
            color: #CECECE;
        }

/*.header-slider {
    position: relative;
    height: 900px;
    background: url(/Content/img/index/landscape-movil.jpg) no-repeat center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
}*/

.header-slider {
    position: relative;
    height: 900px;
    background: no-repeat center center;
    background-image: url(https://sofiaxtv2.blob.core.windows.net:443/imagenes/interfaz/home/fondos/landscape.jpg);
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

    .header-slider .carousel {
        position: static;
    }

.carousel-home .carousel-caption {
    top: -5px;
    width: 100%;
    left: 0;
    font-size: 19px;
    font-family: 'ChunkFive';
    font-weight: lighter;
}

    .carousel-home .carousel-caption h1 {
        margin-bottom: 5px;
        font-size: 24px;
        color: white;
        font-family: 'ChunkFive';
        font-weight: lighter;
    }

.bk-espacio {
    margin-top: -30px;
    height: 3981px;
    background: url(/Content/img/index/bk.svg);
    background-repeat: no-repeat;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

.bk-cielo {
    height: 2851px;
    background: url(/Content/img/index/FONDO-CIELO.svg) no-repeat center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

.bk-sol {
    height: 787px;
    background: url(/Content/img/index/SOL-NUBES.svg) no-repeat center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

.bk-espacio-1 {
    margin-top: -30px;
    height: 1080px;
    background: url(/Content/img/index/bk-espacio1.jpg) no-repeat center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

.bk-espacio-2 {
    height: 1080px;
    background: url(/Content/img/index/bk-espacio2.jpg) no-repeat center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

.bk-espacio-3 {
    height: 1080px;
    background: url(/Content/img/index/bk-espacio3.jpg) no-repeat center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

.bk-espacio-4 {
    height: 787px;
    background: url(/Content/img/index/SOL-NUBES.svg) no-repeat center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

.header-bottom {
    position: relative;
    margin-bottom: -6px;
}


    .header-bottom #imgAnim img {
        margin-top: 0;
    }

    .header-bottom canvas {
        margin-top: -66px;
    }

.mas-info {
    position: fixed;
    font-family: gandhi;
    background: #EA0061;
    font-size: 38px;
    bottom: 0;
    left: 50%;
    margin-left: -40px;
    z-index: 1;
    color: white;
    padding: 10px;
    width: 80px;
    height: 65px;
    border-radius: 100%;
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
    text-align: center;
    border: solid transparent 2px;
    border-bottom: none;
    -moz-transition: all .5s ease;
    -o-transition: all .5s ease;
    -webkit-transition: all .5s ease;
    transition: all .5s ease;
}

    .mas-info:hover, .mas-info:focus {
        border-color: #EA0061;
        color: #EA0061;
        background: white;
        width: 90px;
        height: 75px;
        margin-left: -45px;
    }

    .mas-info .fa, .mas-info .fa {
        -moz-transition: all .5s ease;
        -o-transition: all .5s ease;
        -webkit-transition: all .5s ease;
        transition: all .5s ease;
    }

    .mas-info:hover .fa, .mas-info:focus .fa {
        -moz-transform: scale(1.5);
        -ms-transform: scale(1.5);
        -o-transform: scale(1.5);
        -webkit-transform: scale(1.5);
        transform: scale(1.5);
    }

.botones-slider img {
    margin-bottom: 10px;
}

.botones-slider .registrar-button {
    position: relative;
    -moz-transition: all 1s ease;
    -o-transition: all 1s ease;
    -webkit-transition: all 1s ease;
    transition: all 1s ease;
}

    .botones-slider .registrar-button:hover {
        -moz-transform: scale(1.2,1.2);
        -ms-transform: scale(1.2,1.2);
        -o-transform: scale(1.2,1.2);
        -webkit-transform: scale(1.2,1.2);
        transform: scale(1.2,1.2);
        z-index: 9999;
    }



.botones-slider .info-button {
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

    .botones-slider .info-button:hover {
        -webkit-transform: rotate(1080deg);
        -moz-transform: rotate(1080deg);
        -o-transform: rotate(1080deg);
        -ms-transform: rotate(1080deg);
        transform: rotate(1080deg) scale(.8);
    }

.botones-slider .probar-button {
    -moz-transition: all 1s ease;
    -o-transition: all 1s ease;
    -webkit-transition: all 1s ease;
    transition: all 1s ease;
}

    .botones-slider .probar-button:hover {
        -moz-transform: rotateY(360deg);
        -ms-transform: rotateY(360deg);
        -o-transform: rotateY(360deg);
        -webkit-transform: rotateY(360deg);
        transform: rotateY(360deg);
    }

.botones-slider .soporte-button {
    -moz-transition: all .5s ease;
    -o-transition: all .5s ease;
    -webkit-transition: all .5s ease;
    transition: all .5s ease;
    position:relative;
}

    .botones-slider .soporte-button:hover {
        -moz-transform: skew(-15deg, 23deg) translateX(-25px);
        -ms-transform: skew(-15deg, 23deg) translateX(-25px);
        -o-transform: skew(-15deg, 23deg) translateX(-25px);
        -webkit-transform: skew(-15deg, 23deg) translateX(-25px);
        transform: skew(-15deg, 23deg) translateX(-25px);
        z-index: 999999;
    }

.header-h1 {
    text-align: center;
    color: rgb(255, 255, 255);
    font-family: 'gandhi';
    font-size: 16px;
    margin: 5px 0 0 0;
}

.item-canvas {
    position: static;
    padding: 15px;
}


    .item-canvas a img:hover {
        margin-top: -5px;
    }

.navbar-home .navbar-brand img {
    margin-top: -30px;
}

.navbar-home .container {
    margin-top: 0px;
}

.navbar-home .navbar-nav {
    margin-top: -4px;
}

.navbar-movil {
    visibility: visible;
    position: static;
    left: auto;
    height: auto;
    background: rgb(248, 248, 248);
}

.navbar-home-top .navbar-brand {
    padding-right: 5px;
}

.navbar-home-top .navbar-brand img {
    margin-top: -12px;
    width: 66px;
}

.navbar-home-top .navbar-toggle {
    border-color: white;
}

    .navbar-home-top .navbar-toggle:hover {
        background: white;
    }

    .navbar-home-top .navbar-toggle .icon-bar {
        background: white;
    }

    .navbar-home-top .navbar-toggle:hover .icon-bar {
        background: #4B4C4E;
    }

.navbar-home-top input[type=text] {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    border-bottom-style:hidden;
}

.navbar-home-top input[type=password] {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

@media(min-width:768px) {

    .navbar-home-top input[type=text] {
        border-bottom-left-radius: 4px;
        border-bottom-right-radius: 4px;
        border-bottom-style:solid;
    }

    .navbar-home-top input[type=password] {
        border-top-left-radius:4px;
        border-top-right-radius:4px;
    }
}


.navbar-home-top .second-row {
    background: #eee;
    -webkit-box-shadow: 0px 4px 25px -2px rgba(0,0,0,0.52);
    -moz-box-shadow: 0px 4px 25px -2px rgba(0,0,0,0.52);
    box-shadow: 0px 4px 25px -2px rgba(0,0,0,0.52);
}

.first-row {
    background: #4B4C4E;
}

.orange-link:hover {
    color: white;
}

.dropdown.news a .fa-newspaper-o {
    color: #e43f2c;
}

ul.dropdown-news {
    min-width: 400px;
    padding: 0;
    background: #eee;
}

    ul.dropdown-news li a {
        padding: 15px;
        display: inline-block;
        width: 100%;
        line-height: 60px;
        border-bottom: 1px solid rgba(102, 102, 102, 0.4);
    }

    ul.dropdown-news > li > a:hover,
    ul.dropdown-news > li > a:focus {
        background: rgba(209, 209, 209, 1);
    }

    ul.dropdown-news li a strong {
        font-size: 18px;
    }

    ul.dropdown-news li a img {
        float: left;
        width: 60px;
    }

.navbar-home-top .second-row .nav > li > a:hover {
    margin-top: -4px;
    padding-top: 19px;
    text-decoration: none;
    background-color: rgba(246, 246, 246, 1);
    border-top: solid #e43f2c 4px;
    color: #000;
}

.navbar-home-top .second-row .nav > li > a:focus {
    background: transparent;
}

.navbar-home-top .second-row .nav > li.active > a {
    margin-top: -4px;
    padding-top: 19px;
    text-decoration: none;
    background-color: rgba(246, 246, 246, 1);
    border-top: solid #e43f2c 4px;
}

.navbar-home .navbar-toggle {
    border-color: #ddd;
    border-width: 2px;
}

    .navbar-home .navbar-toggle:hover {
        background: #E5E5E5;
    }

    .navbar-home .navbar-toggle .icon-bar {
        background: #333;
    }

.secciones {
    background: #4B4C4E;
    color: white;
    padding: 60px 10px;
}

    .secciones.inside-pages {
        margin-bottom: 10px;
        padding: 10px 15px 10px;
        position: relative;
        overflow: visible;
    }

        .secciones.inside-pages:after {
            content: '';
            clear: both;
            display: block;
        }

    .secciones .text-about i {
        font-size: 17px;
    }

    .secciones p {
        color: white;
    }

    .secciones hr {
        background: none;
        height: auto;
        line-height: normal;
        border-bottom: 2px solid white;
    }

    .secciones .replace, .secciones .lobster {
        color: white;
    }

    .secciones a.link-home {
        color: #45B8E8;
    }

        .secciones a.link-home:hover {
            text-decoration: none;
            color: white;
            -moz-transition: all 1s ease;
            -o-transition: all 1s ease;
            -webkit-transition: all 1s ease;
            transition: all 1s ease;
        }

    .secciones:nth-child(odd) {
        background: white;
        color: #4B4C4E;
    }

        .secciones:nth-child(odd).inside-pages {
            background: rgba(255, 255, 255,.9);
        }

        .secciones:nth-child(odd) p {
            color: #4B4C4E;
        }

        .secciones:nth-child(odd) hr {
            background: none;
            height: auto;
            line-height: normal;
            border-bottom: 2px solid #4B4C4E;
        }

        .secciones:nth-child(odd) .replace, .secciones:nth-child(2n+1) .lobster {
            color: #4B4C4E;
        }

        .secciones:nth-child(odd) a.link-home {
            color: #45B8E8;
        }

            .secciones:nth-child(odd) a.link-home:hover {
                text-decoration: none;
                color: black;
                -moz-transition: all 1s ease;
                -o-transition: all 1s ease;
                -webkit-transition: all 1s ease;
                transition: all 1s ease;
            }


.seccion-sofia,
.seccion-novedades,
.seccion-nosotros,
.seccion-contacto,
.seccion-noticias {
}

.seccion-browser {
    padding: 60px 10px;
}

.seccion-sofia {
}

    .seccion-sofia .rollover {
        width: 133px;
    }

    .seccion-sofia .mouse-on {
        margin-top: -133px;
    }

    .seccion-sofia .total-sofia {
        margin-bottom: 20px;
    }

.seccion-browser {
    background: rgb(229, 108, 51);
}

    .seccion-browser .col-sm-4,
    .seccion-browser .col-xs-6 {
        margin-bottom: 15px;
    }

    .seccion-browser .container {
        margin-top: 0px;
    }

.browser-img {
    margin-top: 15px;
}

.seccion-novedades {
}

    .seccion-novedades .container {
        margin-top: 0px;
    }

    .seccion-novedades .carousel-control {
        background: transparent;
    }


.novedades > div img {
    width: 100%;
}

.novedades > div {
    margin-bottom: 20px;
}

.novedades .col-sm-4,
.novedades .col-xs-6 {
    padding: 0px;
    margin: 0px;
    margin-top: -6px;
}

.seccion-nosotros {
    color: #4B4C4E;
}

    .seccion-nosotros .que-es {
        margin-top: 20px;
    }

    .seccion-nosotros .total-sofia {
        margin-bottom: 20px;
    }

body.modal-open {
    padding-right: 0 !important;
    overflow: hidden;
}

#carousel-escuelas .carousel-control {
    background: transparent;
    color: #8cc63f;
    width: 10%;
}

    #carousel-escuelas .carousel-control.right {
        color: #d4145a;
    }

#carousel-escuelas div[class^="col"] {
    padding: 5px;
}

    #carousel-escuelas div[class^="col"] a {
        margin-bottom: 5px;
        margin-top: 1px;
    }

@media(min-width:768px) {
    #carousel-escuelas .carousel-control {
        width: 5%;
    }

        #carousel-escuelas .carousel-control:hover {
            background: rgba(140, 198, 63, 0.50);
        }

        #carousel-escuelas .carousel-control.right:hover {
            background: rgba(212, 20, 90, 0.50);
        }
}


blockquote[class^="testimonios"] {
    padding: 10px 20px;
    margin: 0 0 30px;
    font-size: 17.5px;
    position: relative;
}

    blockquote[class^="testimonios"] ul {
        list-style: none;
        padding: 0px;
        height: 100%;
        width: 10px;
        font-size: 0;
        position: absolute;
        top: 0px;
    }

    blockquote[class^="testimonios"] li {
        width: 5px;
        height: 11.1111111%;
    }

        blockquote[class^="testimonios"] li:nth-child(1) {
            background: #ec2c39;
        }

        blockquote[class^="testimonios"] li:nth-child(2) {
            background: #f15b28;
        }

        blockquote[class^="testimonios"] li:nth-child(3) {
            background: #f78d27;
        }

        blockquote[class^="testimonios"] li:nth-child(4) {
            background: #ee78aa;
        }

        blockquote[class^="testimonios"] li:nth-child(5) {
            background: #c21d85;
        }

        blockquote[class^="testimonios"] li:nth-child(6) {
            background: #1873ba;
        }

        blockquote[class^="testimonios"] li:nth-child(7) {
            background: #25bfd7;
        }

        blockquote[class^="testimonios"] li:nth-child(8) {
            background: #28b9aa;
        }

        blockquote[class^="testimonios"] li:nth-child(9) {
            background: #20b476;
        }

    blockquote[class^="testimonios"] p:before {
        content: '“ ';
    }

    blockquote[class^="testimonios"] p:after {
        content: ' ”';
    }

.testimonios {
    text-align: left;
}

    .testimonios ul {
        left: 5px;
    }

.testimonios-right {
    text-align: right;
}

    .testimonios-right ul {
        right: 0;
    }

    .testimonios p:before, .testimonios p:after, .testimonios-right p:before, .testimonios-right p:after {
        font-weight: bold;
        text-shadow: gray 2px 3px 3px;
    }


.header-slider ul, .text-important ul {
    list-style: none;
    padding: 0px;
    width: 100%;
    font-size: 0;
    position: absolute;
    bottom: -10px;
}

.text-important ul {
    position: static;
    width: 90%;
    margin: auto;
}

.header-slider li, .text-important li {
    display: inline-block;
    width: 11.1111111%;
    height: 10px;
}

    .header-slider li:nth-child(1), .text-important li:nth-child(1) {
        background: #ec2c39;
    }

    .header-slider li:nth-child(2), .text-important li:nth-child(2) {
        background: #f15b28;
    }

    .header-slider li:nth-child(3), .text-important li:nth-child(3) {
        background: #f78d27;
    }

    .header-slider li:nth-child(4), .text-important li:nth-child(4) {
        background: #ee78aa;
    }

    .header-slider li:nth-child(5), .text-important li:nth-child(5) {
        background: #c21d85;
    }

    .header-slider li:nth-child(6), .text-important li:nth-child(6) {
        background: #1873ba;
    }

    .header-slider li:nth-child(7), .text-important li:nth-child(7) {
        background: #25bfd7;
    }

    .header-slider li:nth-child(8), .text-important li:nth-child(8) {
        background: #28b9aa;
    }

    .header-slider li:nth-child(9), .text-important li:nth-child(9) {
        background: #20b476;
    }

.text-important li {
    height: 5px;
}



.modal-open .navbar-default, .modal-open .navbar-default {
    padding-right: 0 !important;
}

.modal-image {
    -moz-transform: translate(0, 50%) !important;
    -ms-transform: translate(0, 50%) !important;
    -o-transform: translate(0, 50%) !important;
    -webkit-transform: translate(0, 50%) !important;
    transform: translate(0, 50%) !important;
}

    .modal-image .modal-content {
        background: transparent;
        box-shadow: none;
        border: none;
    }

.mouse-out {
    opacity: 1;
}

.mouse-on {
    opacity: 0;
    -moz-transition: all ease 1s;
    -o-transition: all ease 1s;
    -webkit-transition: all ease 1s;
    transition: all ease 1s;
}

.rollover:hover .mouse-on {
    opacity: 1;
}

.tiles {
    position: relative;
    overflow: hidden;
    width: 100%;
}

    .tiles .images-tiles {
        position: absolute;
        width: 100%;
        top: -100%;
        transition: all ease 1s 
    }

    .tiles:hover .images-tiles {
        top: 0;
    }

    .tiles:hover .images-tiles {
        top: 0;
    }

    .tiles:hover .tiles-mouse-out {
    }

.brand-image-small {
    opacity: 0;
    -moz-transition: all ease 1s;
    -o-transition: all ease 1s;
    -webkit-transition: all ease 1s;
    transition: all ease 1s;
    position: absolute;
    bottom: 0;
    display: block;
}

.brand-image-big {
    opacity: 1;
    position: absolute;
    -moz-transition: all ease 1s;
    -o-transition: all ease 1s;
    -webkit-transition: all ease 1s;
    transition: all ease 1s;
    display: none;
    width: 100px;
    z-index: 1;
}

.affix {
    width: 100%;
    background: #eee !important;
    top: 90px;
    -moz-transition: all ease 1s;
    -o-transition: all ease 1s;
    -webkit-transition: all ease 1s;
    transition: all ease 1s;
    display: block !important;
}

    .affix .navbar-nav {
        margin-top: 0px;
    }

        .affix .navbar-nav > li > a {
            padding-top: 15px !important;
            padding-bottom: 15px !important;
        }

.footer.black {
    position: static;
    height: 60px;
    padding: 15px 0px 0px;
    background-color: #333333;
}

    .footer.black .container {
        margin-top: 0px;
        color: white;
    }

    .footer.black p {
        margin: 0px;
        line-height: 30px;
    }

.footer hr {
    background: none;
    height: auto;
    line-height: normal;
    margin-top: 15px;
    border-bottom: 2px solid white;
}

.footer-top {
    padding: 15px;
}

.inside-pages .footer-bottom {
    border-top: #333333 solid 10px;
}

.navbar-guest .header-h1 {
    color: #fff;
    margin: 2px 0 0 85px;
    padding: 0 0 0 0;
    font-size: 16px;
}

.footer-bottom {
    background: #4B4C4E;
    padding: 15px;
}

.socia-footer span {
    font-size: 30px;
    color: white;
}

.socia-footer.facebook .fa:hover {
    color: #3b5998;
    -moz-transition: all ease 1s -o-transition:all ease 1s -webkit-transition:all ease 1s transition:all ease 1s;
}

.socia-footer.twitter .fa:hover {
    color: #00aced;
    -moz-transition: all ease 1s -o-transition:all ease 1s -webkit-transition:all ease 1s transition:all ease 1s;
}

/*.carousel {
    min-height: 489px;
}

.peopleCarouselImg img {
  width: auto;
  height: 225px;
  max-height: 225px;
}*/
.btn-registro-navbar {
    position: fixed;
    bottom: 0;
    right: 0;
    z-index: 10000;
}

    .btn-registro-navbar img {
        width: 75px;
        left: 50%;
        z-index: 1;
    }

.btn-registro-menu-navbar {
    display: none;
}


/*#btn-buscador {
    display: none;
}

#buscador {
    display: block !important;
}*/

.hide-text {
    display: inline;
}

.btn-quicktest {
    height: 120px;
    width: 120px;
    line-height: 1;
    background: #1da452;
    text-align: center;
    padding-top: 33px;
    color: white;
    border: 5px solid white;
    border-radius: 50%;
    font-family: Gandhi;
    font-weight: bold;
    font-size: 17px;
    box-shadow: rgba(123, 132, 126,1) 5px 5px 5px;
    -moz-transition: all ease 1s;
    -o-transition: all ease 1s;
    -webkit-transition: all ease 1s;
    transition: all ease 1s;
}

    .btn-quicktest span {
        font-size: 27px;
        -moz-transition: all ease 1s -o-transition:all ease 1s -webkit-transition:all ease 1s transition:all ease 1s;
    }

    .btn-quicktest:hover {
        background: #38c871;
        cursor: pointer;
        text-decoration: none;
        color: white;
    }

    .btn-quicktest.menu-navbar {
        display: none;
    }


body.actividad {
    padding-top: 0;
    height:100%;
}


.wrapper {
    padding-left: 0;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

    .wrapper.toggled {
        padding-left: 250px;
    }

.sidebar-wrapper {
    z-index: 1000;
    position: fixed;
    right: 45px;
    width: 45px;
    height: 100%;
    margin-right: -195px;
    overflow-x: hidden;
    overflow-y: auto;
    background: #FFF;
    font-family:Gandhi;
    border-left: 1px solid #ccc;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

.wrapper.toggled .sidebar-wrapper {
    width: 45px;
}

.page-content-wrapper {
    width: 100%;
    position: absolute;
    padding: 0 45px 0 0;
}

.wrapper.toggled .page-content-wrapper {
    position: absolute;
    margin-right: -45px;
}

.avatar-alumno .resultado {
    position: fixed;
    left: 0;
    top: -100%;
    -moz-transform: translate(0,-50%);
    -ms-transform: translate(0,-50%);
    -o-transform: translate(0,-50%);
    -webkit-transform: translate(0,-50%);
    transform: translate(0,-50%);
    z-index: -1;
    opacity: 0;
    -moz-transition: all 1s ease;
    -o-transition: all 1s ease;
    -webkit-transition: all 1s ease;
    transition: all 1s ease;
    max-width: 450px;
    max-height: 450px;
}

@media (min-width: 768px) {
    .avatar-alumno .resultado {
        opacity: 1;
        top: 50%;
    }
}

@media (min-width: 1200px) {
    .avatar-alumno .resultado {
        left: 5%;
    }
}

.alert-preguntaDiaria {
    padding: 0px;
    position: relative;
}

    .alert-preguntaDiaria > .close {
        position: absolute;
        right: 5px;
        color: white;
        opacity: .5;
    }

        .alert-preguntaDiaria > .close:hover {
            opacity: 1;
        }
/* Sidebar Styles */

.sidebar-nav {
    display: none;
    position: absolute;
    top: 0;
    width: 150px;
    margin: 0;
    padding: 0;
    list-style: none;
}

    .sidebar-nav li {
        text-indent: 5px;
        line-height: 40px;
        position:relative;
    }

    .sidebar-nav .sidebar-nav-next.disabled .fa {
        -moz-animation: stop -o-animation:stop -webkit-animation:stop animation:stop;
    }

    .sidebar-nav .sidebar-nav-next.disabled {
        background: transparent;
        border-left: 4px solid #5CB86A;
        -moz-transition: all 1s ease;
        -o-transition: all 1s ease;
        -webkit-transition: all 1s ease;
        transition: all 1s ease;
    }

    .sidebar-nav li.disabled {
        text-decoration: line-through;
    }

        .sidebar-nav li.disabled:hover {
            background: transparent !important;
        }

            .sidebar-nav li.disabled:hover a {
                cursor: no-drop !important;
            }

        .sidebar-nav li.disabled a {
            color: #999999 !important;
            pointer-events: none;
        }

        .sidebar-nav li.disabled .fa {
            color: #999999 !important;
        }

    .sidebar-nav .fa {
        margin-right: 15px;
    }

    .sidebar-nav .sidebar-nav-img img {
        width: 36px;
        margin-left: 5px;
    }

    .sidebar-nav .sidebar-nav-home {
        /*background:#5CB866; */
        background: #8bc24D;
        border-top: 1px solid #ccc;
        border-bottom: 1px solid #ccc;
        line-height: 55px;
        transition: all .5s ease-in-out;
    }
        .sidebar-nav .sidebar-nav-home:hover {
            background: white;
        }

        .sidebar-nav .sidebar-nav-home a {
            color: white;
        }

        .sidebar-nav .sidebar-nav-home:hover a, .sidebar-nav .sidebar-nav-home:hover .fa {
            color: #8bc24D;
        }

        .sidebar-nav .sidebar-nav-help .fa {
            color: #2d86b3;
        }

    .sidebar-nav .sidebar-nav-help:hover {
        background: #2d86b3;
    }


    .sidebar-nav .sidebar-nav-report {
    }

        .sidebar-nav .sidebar-nav-report .fa {
            color: #ffd200;
        }

        .sidebar-nav .sidebar-nav-report:hover {
            background: #ffd200;
        }

    .sidebar-nav .sidebar-nav-arithmetic .fa {
        color: #8729C2;
    }

    .sidebar-nav .sidebar-nav-arithmetic:hover {
        background: #8729C2;
    }

    .sidebar-nav .sidebar-nav-skip .fa {
        color: #ff9900;
    }

    .sidebar-nav .sidebar-nav-skip:hover {
        background: #ff9900;
    }

    .sidebar-nav .sidebar-nav-eraser .fa {
        color: #cc3300;
    }

    .sidebar-nav .sidebar-nav-eraser:hover {
        background: #cc3300;
    }

    .sidebar-nav .sidebar-nav-exit {
        /*background: #cc3300;*/
        background: #F49322;
        border-bottom: 1px solid #ccc;
        border-top: 1px solid #ccc;
        line-height: 55px;
    }

        .sidebar-nav .sidebar-nav-exit a {
            color: white;
            padding: 6px 0 11px 0;
            transition: all .5s ease-in-out;
        }

            .sidebar-nav .sidebar-nav-exit a:hover {
                color: #F49322;
                background: white;
            }

        .sidebar-nav .sidebar-nav-exit:hover .fa {
            color: #F49322;
        }

    .sidebar-nav .sidebar-nav-next {
        /*background: #ffffff;*/
        background: #26A7DE;
        border-bottom: 1px solid #ccc;
        border-top: 1px solid #ccc;
        line-height: 55px;
    }

        .sidebar-nav .sidebar-nav-next a {
            color: white;
            padding: 6px 0 11px 0;
            transition: all .5s ease-in-out;
        }

            .sidebar-nav .sidebar-nav-next a:hover {
                background: white;
                color: #26A7DE;
            }

                .sidebar-nav .sidebar-nav-next a:hover .fa {
                    color: #26A7DE;
                }

        .sidebar-nav .text-sidebar-option {
            display: block;
            position: relative;
            line-height: 20px;
            text-align: center;
            width: 110px;
            margin-left: 24px;
            margin-top: -48px;
        }

    .sidebar-nav .sidebar-nav-blankSpace {
        height: 80px;
        background: #f4f4f4;
    }

    .sidebar-nav .last {
        border-bottom: 1px solid #ccc;
    }

/* Change color icon */
@-webkit-keyframes change-color {
    0% {
        background: #c9302c;
    }

    25% {
        background: #F8C717;
    }

    50% {
        background: #5cb85c;
    }

    75% {
        background: #337ab7;
    }

    100% {
        background: #c9302c;
    }
}

@keyframes change-color {
    0% {
        background: #c9302c;
    }

    25% {
        background: #F8C717;
    }

    50% {
        background: #5cb85c;
    }

    75% {
        background: #337ab7;
    }

    100% {
        background: #c9302c;
    }
}

.button-cal-act {
    margin-left: -200px;
    -moz-animation-name: change-color;
    -o-animation-name: change-color;
    -webkit-animation-name: change-color;
    animation-name: change-color;
    -webkit-animation-duration: 2s;
    -moz-animation-duration: 2s;
    -o-animation-duration: 2s;
    animation-duration: 2s;
    -webkit-animation-timing-function: linear;
    -moz-animation-timing-function: linear;
    -o-animation-timing-function: linear;
    animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;
    -moz-animation-iteration-count: infinite;
    -o-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -moz-transition: .5s all ease;
    -o-transition: .5s all ease;
    -webkit-transition: .5s all ease;
    transition: .5s all ease;
    color: white;
}

    .button-cal-act:hover {
        color: white;
        -webkit-animation-play-state: paused;
        -moz-animation-play-state: paused;
        -o-animation-play-state: paused;
        animation-play-state: paused;
    }

    .button-cal-act .fa {
        color: white;
    }

.float-tabs-container-activity {
    top: 35px;
    -moz-transform: translate(-72%,0);
    -ms-transform: translate(-72%,0);
    -o-transform: translate(-72%,0);
    -webkit-transform: translate(-72%,0);
    transform: translate(-72%,0);
}


.activity-wrap div[class^="col"] {
    padding-right: 5px;
    padding-left: 5px;
}

.activity-btns {
    margin-top: 15px;
}

.activity-resultados {
    text-align: center;
    font-size: 18px;
    color: white;
    padding: 10px;
    margin-top: 5px;
    border-radius: 10px;
    font-family: 'Gandhi';
    display: block;
}

.activity-circle
{
    width: 120px;
    height: 120px;
    border-radius: 100%;
    padding-top: 25px;
    display: inline-block;
}

    .activity-resultados > span {
        font-size: 35px;
        font-weight: bolder;
    }

        .activity-resultados > span#calificacion {
            font-size: 40px;
        }

    .activity-resultados.calificacion {
        background: #2d86b3;
    }

    .activity-resultados.puntos {
        background: #ff9900;
    }

    .activity-resultados.correctos {
        background: #88AA31;
    }

    .activity-resultados.creditos {
        background: #F8C717;
    }

    .activity-resultados.incorrectos {
        background: #cc3300;
    }

@keyframes ninoEspecial {
    /*0% {
        background: rgb(248, 199, 23);
    }

    50% {
        background: rgb(253, 225, 126);
    }*/
    from {
        box-shadow: 0 0 10px #fff, 0 0 20px #fff, 0 0 30px #fff, 0 0 40px rgb(248, 199, 23), 0 0 70px rgb(248, 199, 23), 0 0 80px rgb(248, 199, 23), 0 0 100px rgb(248, 199, 23), 0 0 150px rgb(248, 199, 23);
    }

    to {
        box-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 15px #fff, 0 0 20px rgb(248, 199, 23), 0 0 35px rgb(248, 199, 23), 0 0 40px rgb(248, 199, 23), 0 0 50px rgb(248, 199, 23), 0 0 75px rgb(248, 199, 23);
    }
}

@-moz-keyframes ninoEspecial {
    0% {
        background: rgb(248, 199, 23);
    }

    50% {
        background: rgb(253, 225, 126);
    }

    100% {
        background: rgb(248, 199, 23);
    }
}

@-webkit-keyframes ninoEspecial {
    0% {
        background: rgb(248, 199, 23);
    }

    50% {
        background: rgb(253, 225, 126);
    }

    100% {
        background: rgb(248, 199, 23);
    }
}

.activity-resultados.creditos.active {
    -moz-animation-name: ninoEspecial;
    -o-animation-name: ninoEspecial;
    -webkit-animation-name: ninoEspecial;
    animation-name: ninoEspecial;
    -webkit-animation-duration: 1s;
    -moz-animation-duration: 1s;
    -o-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-timing-function: linear;
    -moz-animation-timing-function: linear;
    -o-animation-timing-function: linear;
    animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;
    -moz-animation-iteration-count: infinite;
    -o-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    position: relative;
    z-index: 1;
}

/* Right Move */
@-webkit-keyframes next-move {
    25% {
        -moz-transform: translateX(5px);
        -ms-transform: translateX(5px);
        -o-transform: translateX(5px);
        -webkit-transform: translateX(5px);
        transform: translateX(5px);
    }

    75% {
        -moz-transform: translateX(0);
        -ms-transform: translateX(0);
        -o-transform: translateX(0);
        transform: translateX(0);
    }
}

@keyframes next-move {
    25% {
        -moz-transform: translateX(5px);
        -ms-transform: translateX(5px);
        -o-transform: translateX(5px);
        -webkit-transform: translateX(5px);
        transform: translateX(5px);
    }

    75% {
        -moz-transform: translateX(0);
        -ms-transform: translateX(0); 
        -o-transform: translateX(0); 
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }
}

.sidebar-nav .sidebar-nav-next .fa {
    -moz-animation-name: next-move;
    -o-animation-name: next-move;
    -webkit-animation-name: next-move;
    animation-name: next-move;
    -webkit-animation-duration: 1s;
    -moz-animation-duration: 1s;
    -o-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-timing-function: linear;
    -moz-animation-timing-function: linear;
    -o-animation-timing-function: linear;
    animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;
    -moz-animation-iteration-count: infinite;
    -o-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
}

.sidebar-nav .sidebar-nav-answers {
    padding-top: 5px;
    text-align: center;
}

    .sidebar-nav .sidebar-nav-answers .badge {
        text-align: center;
        padding: 4px 8px;
        display: block;
        margin-left: 5px;
        margin-bottom: 5px;
        width: 35px;
    }

        .sidebar-nav .sidebar-nav-answers .badge.badge-danger {
            padding: 5px 10px;
        }

        .sidebar-nav .sidebar-nav-answers .badge .fa {
            display: block;
            margin-left: -5px;
            margin-right: 0;
            margin-bottom: 4px;
        }



.sidebar-nav li a {
    display: block;
    text-decoration: none;
    color: #999999;
    font-size: 16px;
}

    .sidebar-nav li a:hover {
        text-decoration: none;
        color: white;
    }

        .sidebar-nav li a:hover .fa {
            color: white;
        }

    .sidebar-nav li a:active,
    .sidebar-nav li a:focus {
        text-decoration: none;
    }

.sidebar-nav > .sidebar-brand {
    height: 50px;
    font-size: 20px;
    line-height: 50px;
    text-indent: 20px;
    border-bottom: 1px solid #ccc;
}

    .sidebar-nav > .sidebar-brand a {
        color: #999999;
    }

        .sidebar-nav > .sidebar-brand a:hover {
            color: #fff;
            background: none;
        }


.title-retro {
    position: relative;
    text-align: left;
    margin-top: 10px;
    margin-bottom: 5px;
    font-family: gandhi;
    font-size: 25px;
}

    .title-retro:after {
        content: "";
        background: #0082c0;
        position: absolute;
        bottom: 0;
        left: 0;
        height: 2px;
        width: 100%;
    }


.retroalimentacion {
    text-align: left;
    color: #333;
    font-size: 18px;
    margin-bottom: 15px;
}

    .retroalimentacion .retro-operacion {
    }

    .retroalimentacion .retro-resultado {
        color: green;
        font-size: 19px;
    }

    .retroalimentacion .retro-desc, .retroalimentacion .retro-calif {
        font-weight: bold;
    }

    .retroalimentacion .retro-pasos-buenos, .retroalimentacion .retro-pasos {
        font-weight: bold;
        color: blue;
    }

    .retroalimentacion .retro-calif-total {
        color: green;
        font-weight: bold;
    }

    .retroalimentacion .retro-ident-num {
        color: rgb(117, 47, 209);
    }

    .retroalimentacion .retro-title-message {
        margin-top: 15px;
        text-align: center;
        font-family: Gandhi;
        font-weight: lighter;
    }

    .retroalimentacion .retro-buttons-message {
        text-align: center;
    }

.time-activity {
    font-size: 16px;
}

.time-activity-text {
    font-weight: bold;
}

.title-gandhi {
    font-family: Gandhi;
    text-align: center;
}

.title-aritmetica,
.title-fracciones,
.title-conceptos,
.title-geometria {
    font-family: Gandhi;
    font-weight: lighter;
    border-bottom: 3px solid;
    color: black;
}

.title-aritmetica {
    border-bottom-color: #d9534f;
}

.title-fracciones {
    border-bottom-color: #337ab7;
}

.title-conceptos {
    border-bottom-color: #ec971f;
}

.title-geometria {
    border-bottom-color: #449d44;
}

.libre-lista-ejercicios {
    list-style-type: none;
    padding-left: 0;
    margin-bottom: 10px;
}

    .libre-lista-ejercicios.fracciones {
        width: auto;
    }

    .libre-lista-ejercicios li {
        font-family: Gandhi;
        font-size: 16px;
        margin-bottom: 10px;
        text-align: center;
    }

    .libre-lista-ejercicios.aritmetica li img,
    .libre-lista-ejercicios.fracciones li img,
    .libre-lista-ejercicios.conceptos li img,
    .libre-lista-ejercicios.geometria li img {
        padding: 6px;
        width: 48px;
        margin-right: 5px;
        vertical-align: middle;
    }

    .libre-lista-ejercicios.aritmetica li img {
        background: #d9534f;
    }

    .libre-lista-ejercicios.fracciones li img {
        background: #337ab7;
    }

    .libre-lista-ejercicios.conceptos li img {
        background: #ec971f;
    }

    .libre-lista-ejercicios.geometria li img {
        background: #449d44;
    }

.progress.actividad {
    margin-top: -30px;
    height: 30px;
    margin-bottom: 0px;
    width: 100%;
    padding-right: 45px;
    border-radius: 0px;
    top: 0;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

    .progress.actividad .progress-bar {
        line-height: 29px;
        font-size: 15px;
        font-weight: bold;
    }

.sidebar-option.bottom {
    border-bottom: 1px solid #ccc;
}

.sidebar-nav-arithmetic .fa-trash {
    margin-left: 3px;
}

.carousel-home .carousel-caption {
    text-shadow: 5px 3px 3px rgba(0, 0, 0, .6);
}


.btn-overlay {
    position: fixed;
    left: 0;
    top: 0;
    z-index: 999;
    background: rgba(0, 0, 0, 0);
    color: #544F4F;
    width: 100%;
    height: 100%;
    -moz-transition: all .2s linear -o-transition:all .2s linear -webkit-transition:all .2s linear transition:all .2s linear;
}

/*NUEVOS DISENO EJERCICIOS*/

.temas h1,
.temas h2,
.temas h3,
.temas h4 .temas h5 {
    text-align: left;
}

.less-padding {
    padding-right: 15px;
    margin-right: 0;
}

.less-padding-left {
    padding-left: 15px;
}


.less-padding .btn-group label:first-child {
    border-bottom-left-radius: 0;
}

.less-padding .btn-group label:last-child {
    border-bottom-right-radius: 0;
}

.less-padding-left .btn-group label:first-child {
    border-top-left-radius: 0;
}

.less-padding-left .btn-group label:last-child {
    border-top-right-radius: 0;
}
/*.less-padding .btn-group*/
/*.temas:after {
        content: '';
        clear: both;    
        display: block;
    }

    .temas .item-masonry {
        display:inline-block;
        padding:0px 15px;
        width:50%;
    }*/
.temas .title-temas {
    color: white;
    padding: 5px;
    padding-left: 35px;
    padding-right: 30px;
    border-radius: 5px;
    text-align: center;
    position: relative;
    margin-bottom: -1px;
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
}

.title-temas .badge {
    padding: 3px 6px;
    font-size: 16px;
    background: white;
    position: absolute;
    left: 5px;
    top: 50%;
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}

.title-temas .flecha-abajo {
    position: absolute;
    right: 5px;
    top: 50%;
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}

.temas a.list-group-item:focus {
    outline: transparent;
}

.title-subtemas {
    margin-bottom: 0px;
}

    .title-subtemas a {
        display: block;
        padding: 9px 8px;
        padding-left: 42px;
        padding-right: 32px;
        text-align: center;
        position: relative;
    }

        .title-subtemas a:hover {
            background: #E8E8E8;
        }

        .title-subtemas a .first-text-uppercase {
            display: block;
            text-transform: lowercase;
        }

        .title-subtemas a .badge, .title-subtemas a .fa.expand {
            font-size: 14px;
            padding: 4px 6px;
            text-transform: uppercase;
            position: absolute;
            left: 5px;
            top: 50%;
            -moz-transform: translateY(-50%);
            -ms-transform: translateY(-50%);
            -o-transform: translateY(-50%);
            -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
        }

        .title-subtemas a .fa.expand {
            padding: 0px;
            right: 9px;
            left: inherit;
            font-weight: bold;
            font-size: 25px;
        }

        .title-subtemas a .first-text-uppercase::first-letter {
            text-transform: uppercase;
        }

        .title-subtemas a:hover, .title-subtemas a:active, .title-subtemas a:focus {
            text-decoration: none;
        }

.title-temas + .panel-group {
    margin-left: -1px;
    margin-right: -1px;
}


.lista-conceptos {
    padding: 10px;
    border-top: 0px;
    color: white;
}

    .lista-conceptos .btn {
        text-transform: lowercase;
        position: relative;
        padding-left: 35px;
        padding-right: 17px;
    }

        .lista-conceptos .btn .first-text-uppercase {
            display: block;
        }

            .lista-conceptos .btn .first-text-uppercase::first-letter {
                text-transform: uppercase;
            }

        .lista-conceptos .btn.prox {
            background: #e6e6e6;
            border-color: #ccc;
            cursor: default;
        }

        .lista-conceptos .btn .fa.isExtra {
            color: gold;
            position: absolute;
            right: 2px;
            top: 50%;
            -moz-transform: translateY(-50%);
            -ms-transform: translateY(-50%);
            -o-transform: translateY(-50%);
            -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
        }

        .lista-conceptos .btn .badge.clave {
            position: absolute;
            left: 2px;
            top: 50%;
            -moz-transform: translateY(-50%);
            -ms-transform: translateY(-50%);
            -o-transform: translateY(-50%);
            -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
        }

        .lista-conceptos .btn .fa.prox {
            position: absolute;
            left: 5px;
            top: 50%;
            -moz-transform: translateY(-50%);
            -ms-transform: translateY(-50%);
            -o-transform: translateY(-50%);
            -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
        }

/*.lista-conceptos .btn .fa-stack.prox .calendar-text {
                font-size: 9px;
                margin-top: .2em;
                text-transform: lowercase;
                display: block;
            }

                .lista-conceptos .btn .fa-stack.prox .calendar-text:first-letter {
                    text-transform: uppercase;
                }*/

.temas .btn {
    white-space: normal !important;
    -ms-word-wrap: break-word;
    word-wrap: break-word;
}

/*.change-size {
    transition: all 1s ease;
}*/

.temas .temas-panel-heading {
    background: white;
    border-bottom: none;
    padding: 0px;
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
}

.temas .temas-panel {
    background: transparent;
    border-color: transparent;
    margin-bottom: -8px;
}

.modal .title-exercise {
    text-transform: lowercase;
}

    .modal .title-exercise:first-letter {
        text-transform: uppercase;
    }

p:first-letter {
    text-transform: uppercase;
}

.radio-buttons label input[type="radio"] {
    position: absolute;
    clip: rect(0, 0, 0, 0);
    pointer-events: none;
}

.items .cargando {
    padding: 10px;
    background: white;
}

/*COLORES EJERCICIOS SEP*/

/*ROJO*/
.title-temas.danger, .items.danger .title-subtemas a .badge, .items.danger .lista-conceptos, .items.danger .lista-conceptos .btn .badge.clave {
    background: #d9534f;
}

    .title-temas.danger .badge, .items.danger .temas-panel-heading a {
        color: #d9534f;
    }

.items.danger .temas-panel-heading {
    border: #d9534f solid 1px;
}

/*AZUL*/
.title-temas.primary, .items.primary .title-subtemas a .badge, .items.primary .lista-conceptos, .items.primary .lista-conceptos .btn .badge.clave {
    background: #337ab7;
}

    .title-temas.primary .badge, .items.primary .temas-panel-heading a {
        color: #337ab7;
    }

.items.primary .temas-panel-heading {
    border: #337ab7 solid 1px;
}

/*NARANJA*/
.title-temas.warning, .items.warning .title-subtemas a .badge, .items.warning .lista-conceptos, .items.warning .lista-conceptos .btn .badge.clave {
    background: #f0ad4e;
}

    .title-temas.warning .badge, .items.warning .temas-panel-heading a {
        color: #f0ad4e;
    }

.items.warning .temas-panel-heading {
    border: #f0ad4e solid 1px;
}

/*VERDE*/
.title-temas.success, .items.success .title-subtemas a .badge, .items.success .lista-conceptos, .items.success .lista-conceptos .btn .badge.clave {
    background: #5cb85c;
}

    .title-temas.success .badge, .items.success .temas-panel-heading a {
        color: #5cb85c;
    }

.items.success .temas-panel-heading {
    border: #5cb85c solid 1px;
}

/*MORADO*/
.title-temas.royal, .items.royal .title-subtemas a .badge, .items.royal .lista-conceptos, .items.royal .lista-conceptos .btn .badge.clave {
    background: #9733D5;
}

    .title-temas.royal .badge, .items.royal .temas-panel-heading a {
        color: #9733D5;
    }

.items.royal .temas-panel-heading {
    border: #9733D5 solid 1px;
}

.btn-pruebalo-menu-navbar {
    display: none;
}

.total-sofia .text_big {
    font-size: 22px;
}

.navbar-brand > img.img-sm-logo {
    display: none;
    position: absolute;
    /*width: 113px !important;*/
    z-index: 2000;
    -moz-transition: all 1s ease;
    -o-transition: all 1s ease;
    -webkit-transition: all 1s ease;
    transition: all 1s ease;
}

/*.float-tabs-container {
    display: none;
}
*/

.padding-bloque-left
{
    padding:0
}

.padding-bloque-right
{
    padding:0
}


@media(min-width: 768px)
{
    .padding-bloque-right {
        padding-left: 15px;
        padding-right: 0
    }
}

/* Tamaño SM*/
@media (min-width: 768px) {

    #muroFilter, .feedC {
        margin-left: 0;
        margin-right: 0;
    }

    .float-tabs-container {
        display: block;
    }

    /*.header-slider {
        position: relative;
        height: 900px;
        background: url(/Content/img/index/landscape.png) no-repeat center center fixed;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
    }*/

    .navbar-brand > img.img-xs-logo {
        display: none;
    }

    .navbar-brand > img.img-sm-logo {
        display: block;
    }

    .Srow.Header {
        height: 155px;
    }

    .navbar-guest .header-h1 {
        margin: 30px 0 0 55px;
        padding: 0;
        font-size: 23px;
        width: auto;
    }

    .total-sofia .text_big {
        font-size: xx-large;
    }

    .less-padding .btn-group label:first-child {
        border-bottom-left-radius: 4px;
    }

    .less-padding .btn-group label:last-child {
        border-bottom-right-radius: 0;
        border-top-right-radius: 0;
    }

    .less-padding-left .btn-group label:first-child {
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
    }

    .less-padding-left .btn-group label:last-child {
        border-top-right-radius: 4px;
    }

    .temas .title-temas {
        padding-left: 30px;
    }

    .less-padding-left {
        padding-left: 0;
    }

    .less-padding-right {
        padding-right: 0;
    }

    .less-padding {
        padding-right: 0px;
        margin-right: -1px;
    }
    /*.botones-slider .registrar-button {
        margin-top: 10px;
    }*/

    .header-slider .carousel {
        position: absolute;
    }

    .botones-slider img {
        margin-bottom: 10px;
    }

    .progress.actividad {
        padding-right: 151px;
    }

    .wrap-retro-division .title-retro:after {
        content: "";
        background: #0082c0;
        position: absolute;
        bottom: 0;
        left: 0;
        height: 2px;
        width: 70%;
    }

    .wrap-retro-division {
        position: absolute;
        top: 170px;
    }

    .sidebar-nav .sidebar-nav-progressbar {
        text-align: center;
    }

        .sidebar-nav .sidebar-nav-progressbar .progress {
            border-radius: 0px;
            height: 30px;
        }

    .sidebar-nav .sidebar-nav-answers .badge {
        display: inline;
    }

    body#home {
        padding-top: 100px;
    }

    .wrapper {
        /*padding-left: 150px;*/
    }

        .wrapper.toggled {
            padding-left: 0;
        }

    .sidebar-wrapper {
        width: 151px;
    }

    .sidebar-nav .fa {
        margin-right: 5px;
    }

    .sidebar-nav .sidebar-nav-img img {
        max-width: 50%;
        width: inherit;
        margin-left: auto;
    }

    .wrapper.toggled .sidebar-wrapper {
        width: 0;
    }

    .page-content-wrapper {
        padding: 1px 150px 0px;
        padding-left: 0px;
        position: relative;
    }

    .wrapper.toggled .page-content-wrapper {
        position: relative;
        margin-right: 0;
    }

    .btn-quicktest {
        height: 150px;
        width: 150px;
        padding-top: 40px;
        font-size: 23px;
    }

        .btn-quicktest span {
            font-size: 33px;
        }

        .btn-quicktest.menu-navbar {
            position: absolute;
            display: inline;
            top: 0;
            left: 1%;
            padding-top: 24px;
            font-size: 14px;
        }

            .btn-quicktest.menu-navbar span {
                font-size: 22px;
            }

    .header-h1 {


    }

    .first-row {
        height: 100px;
    }

        .first-row .navbar-form {
            padding-top: 0;
            /*margin-top: -25px;*/
        }

        .first-row .container > .navbar-collapse {
            
        }

    .carousel-home .carousel-caption {
        top: 25px;
        width: 100%;
        left: 0;
        text-align: left;
        font-size: 22px;
        padding: 0;
    }

        .carousel-home .carousel-caption h1 {
            font-size: 30px;
            color: white;
        }

    .hide-text {
        text-indent: -9999px;
        position: absolute;
    }

    .navbar-movil {
        visibility: hidden;
        position: absolute;
        left: -999999px;
        height: 0px;
    }

    .brand-image-big {
        display: block;
        width: initial;
    }

    .brand-image-small {
        display: none;
    }

    .navbar-home {
        margin-bottom: 0px;
        background: rgba(248, 248, 248, 0.65);
    }

    .navbar-home-top .second-row .navbar-nav > li > a {
        color: rgb(75, 76, 78);
        border-top: solid transparent 4px;
        -moz-transition: all 1s ease;
        -o-transition: all 1s ease;
        -webkit-transition: all 1s ease;
        transition: all 1s ease;
    }

    .navbar-home-top .navbar-nav.second-row-navbar {
        float: none;
        margin: 0 auto;
        display: table;
        table-layout: fixed;
        font-size: 12pt;
    }

    .navbar-home-top .navbar-brand img {
        width: 12%;
        left: 0;
        top: 20px;
        z-index: 0;
    }

    .navbar-home-top .navbar-brand {
       
    }

    .btn-registro-navbar {
        visibility: hidden;
    }

    .btn-registro-menu-navbar {
        display: block;
        display: inline !important;
    }

        .btn-registro-menu-navbar img {
            width: 10%;
            position: absolute;
            top: 0px;
            right: 1%;
            z-index: 1;
        }

    .btn-pruebalo-menu-navbar {
        display: block;
        display: inline !important;
    }

        .btn-pruebalo-menu-navbar img {
            width: 10%;
            position: absolute;
            top: 0;
            left: 1%;
            z-index: 1;
        }

    .sidebar-nav .sidebar-nav-answers .badge .fa {
        display: inline-block;
        margin: 0;
    }


    /*.navbar-header {
      float: none;
    }
    .navbar-left,.navbar-right {
        float: none !important;
    }
    .navbar-toggle {
        display: block;
    }
    .navbar-collapse {
        border-top: 1px solid transparent;
        box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);
    }
    .navbar-fixed-top {
		top: 0;
		border-width: 0 0 1px;
	}
    .navbar-collapse.collapse {
        display: none!important;
    }
    .navbar-nav {
        float: none!important;
		margin-top: 7.5px;
	}
	.navbar-nav>li {
        float: none;
    }
    .navbar-nav>li>a {
        padding-top: 10px;
        padding-bottom: 10px;
    }

    .collapse.in{
  		display:block !important;
	}*/

    .quicktest .btn > label {
        display: block !important;
    }

    .btn-registro-quicktest img {
        position: absolute;
        top: 0;
        right: 1%;
        z-index: 1;
        width: 145px;
    }

    .box-progressbar {
        position: absolute;
        width: 400px;
        left: -100px;
        top: 300px;
        margin-top: 0;
    }

    .progress.vertical {
        display: inline-block;
        width: 100%;
        height: 30px;
        -webkit-transform: rotate(-90deg); /* Chrome, Safari, Opera */
        -moz-transform: rotate(-90deg);
        -ms-transform: rotate(-90deg);
        -o-transform: rotate(-90deg);
        transform: rotate(-90deg);
    }
}



/* Tamaño MD*/
@media (min-width : 992px) {

    .buttons-marginTop
    {
        margin-top: -10px;
    }

    .row.btnsTareasGrupo .btn .fa {
        display: block;
        margin: 3px 0;
    }

    .navbar-brand > img.img-sm-logo {
        width: 150px;
        left: 60px;
    }

    .navbar-guest .header-h1 {
       margin: 8px 0 0 140px;
    padding: 25px 0 0 0;
    font-size: 28px;
    }

    .wrap-retro-division .title-retro:after {
        content: "";
        background: #0082c0;
        position: absolute;
        bottom: 0;
        left: 0;
        height: 2px;
        width: 50%;
    }

    .header-h1 {
        /*width: 180px;
        color: #fff;
        margin: 0 0 0 80px;
        padding: 10px 0 0 0;
        position: static;
        -moz-transform: initial;
        -ms-transform: initial;
        -o-transform: initial;
        -webkit-transform: initial;
        transform: initial;*/

    }

    .ie11 .header-h1,
    .ie10 .header-h1 {
        color: #fff;
        margin: 0 0 0 222px;
        padding: 25px 0 0 0;
        position: static;
        -moz-transform: initial;
        -ms-transform: initial;
        -o-transform: initial;
        -webkit-transform: initial;
        transform: initial;
    }

    .ie10 .first-row .navbar-right.navbar-form,
    .ie11 .first-row .navbar-right.navbar-form {
        margin-right: -30px;
        margin-top: -50px;
    }

    .btn-quicktest {
        height: 180px;
        width: 180px;
        padding-top: 55px;
        font-size: 25px;
    }

        .btn-quicktest span {
            font-size: 36px;
        }

        .btn-quicktest.menu-navbar {
            width: 120px;
            height: 120px;
            padding-top: 28px;
            font-size: 19px;
        }

            .btn-quicktest.menu-navbar span {
                font-size: 30px;
            }

    .carousel-home .carousel-caption {
        width: 100%;
        font-size: 36px;
    }

        .carousel-home .carousel-caption h1 {
            font-size: 45px;
        }



    .item-canvas {
        position: absolute;
        width: 100%;
        top: 80%;
    }

    .first-row .navbar-form.navbar-right {
        margin-right: -20px;
        margin-top: 4px;
        padding: 0;
    }
}

/* Tamaño LG*/
@media (min-width : 1200px) {

    .navbar-guest .header-h1 {
        margin: 0;
        padding: 35px 0 0 0;
        font-size: 28px;
        width: 100%;
        position: relative;
    }

    .first-row .navbar-form.navbar-right {
        margin-top: 16px;
    }

    .row.btnsTareasGrupo .btn .fa {
        display: inline;
        margin: 0;
    }

    .navbar-brand > img.img-sm-logo {
        width: 150px !important;
        left: inherit;
        -moz-transform: translateX(-16px);
        -ms-transform: translateX(-16px);
        -o-transform: translateX(-16px);
        -webkit-transform: translateX(-16px);
        transform: translateX(-16px);
    }

    .btn-quicktest {
        height: 200px;
        width: 200px;
        padding-top: 55px;
        font-size: 30px;
    }

        .btn-quicktest span {
            font-size: 40px;
        }

        .btn-quicktest.menu-navbar {
            width: 180px;
            height: 180px;
            padding-top: 55px;
            font-size: 27px;
        }

            .btn-quicktest.menu-navbar span {
                font-size: 40px;
            }

    .carousel-home .carousel-caption {
        top: 20%;
        width: 100%;
        font-size: 45px;
    }

        .carousel-home .carousel-caption h1 {
            font-size: 60px;
        }

    .header-h1 {
        margin: -8px 0 0 140px;
        padding: 25px 0 0 0;
        font-size: 24px;
        width: 320px;
        position:absolute;
    }

    .ie11 .header-h1,
    .ie10 .header-h1 {
        color: #fff;
        margin: 0 0 0 300px;
        padding: 25px 0 0 0;
        position: static;
        -moz-transform: initial;
        -ms-transform: initial;
        -o-transform: initial;
        -webkit-transform: initial;
        transform: initial;
    }

    .ie11 .first-row .navbar-form.navbar-right {
    }
}

/*Custom to Navbar*/

@media (min-width : 1120px) {
    .hide-text {
        text-indent: 0;
        position: static;
    }
}

/*LEADERBOARD*/

.leaderboard {
    font-family: "Gandhi";
}

.avatar-leaderboard {
    width: 55px;
    height: 55px;
    border-radius: 20%;
    background: white;
    overflow: hidden;
    border: solid 3px;
    margin: auto;
    margin-bottom: 5px;
}

.FechaCalculo {
    font-weight: bolder;
    font-size: 16px;
    display:block;
    text-align:center

}

@media (min-width: 992px) {

    .avatar-leaderboard {
        margin-bottom: 0;
    }
}

.position-leaderboard {
    font-family: cursive;
    position: absolute;
    top: 5px;
    left: 15px;
    font-weight: bolder;
    font-size: 30px;
    padding: 0;
    margin: 0;
    width: 15px;
    line-height: 40px;
}



.leaderboard .list-group-item:nth-child(1) .position-leaderboard {
    font-size: 40px;
}

.leaderboard .list-group-item:nth-child(2) .position-leaderboard {
    font-size: 35px;
}

.leaderboard .list-group-item:nth-child(3) .position-leaderboard {
    font-size: 30px;
}

.leaderboard .list-group-item:nth-child(4) .position-leaderboard {
    font-size: 29px;
}

.leaderboard .list-group-item:nth-child(5) .position-leaderboard {
    font-size: 27px;
}

.name-leaderboard {
    font-size: 15px;
    font-weight: bolder;
    text-align: center;
    padding: 10px;
    padding-top: 0px;
    padding-bottom: 0px;
    -ms-text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    overflow: hidden;
    display: block;
}


.points-leaderboard {
    font-size: 21px;
    font-weight: bolder;
    text-align: center;
    padding: 10px;
    padding-top: 0px;
    padding-bottom: 0px;
}

    .points-leaderboard span {
        -ms-text-overflow: ellipsis;
        -o-text-overflow: ellipsis;
        text-overflow: ellipsis;
        overflow: hidden;
        display: block;
    }

@media (min-width: 992px) {
    .name-leaderboard {
        padding-left: 0px;
    }

    .points-leaderboard {
        padding-left: 0px;
    }
}

.leaderboard .no-padding {
    padding: 0px;
}


/*COMENTARIOS FEED*/

.feed-comment {
    margin-top: 5px;
    margin-bottom: -10px;
    padding: 10px 15px;
}

    .feed-comment .input-group-addon {
        padding: 0px 0px;
        border: none;
    }

.feedC hr {
    border-bottom: 1px solid;
    margin: 4px 0 10px;
}

.comentarios .img-feed-comment {
    margin-left: -38px;
}

.img-feed-comment {
    width: 34px;
    height: 34px;
    background: rgb(255, 255, 255);
    overflow: hidden;
    float: left;
}

    .img-feed-comment img {
        width: 34px;
    }

.fechaComment {
    float: none;
    display: block;
}

@media(min-width: 768px) {
    .fechaComment {
        float: right;
        display: inline;
    }
}

.txtComentario {
    margin-bottom: 10px;
}

.comentariosInput {
    margin-bottom: 5px;
}

.comentarioContent {
    border-top: 1px solid rgb(214, 214, 214);
    margin: 0px -15px;
    padding: 10px;
    -ms-word-break: break-all;
    word-break: break-all;
    padding-left: 44px;
}

.comentarioContentUsername {
    display: block;
}

.text-comment {
}

@media (min-width: 768px) {
    .comentarioContentUsername {
        display: inline-block;
    }

    .comentarioContent {
        border-top: none;
        -ms-word-break: break-word;
        word-break: break-word;
    }
}




/*BOTONES AVATAR*/
.btn-subCat {
    padding: 0px;
    box-shadow: 2px 2px 4px rgb(177, 177, 177);
    -moz-transition: all .5s ease -o-transition: all .5s ease -webkit-transition: all .5s ease transition: all .5s ease;
}

    .btn-subCat:hover {
        padding: 5px;
        box-shadow: none;
    }

.btn-subCat-trajes {
    padding: 6px 12px;
    box-shadow: 2px 2px 4px rgb(177, 177, 177);
    -moz-transition: all .5s ease -o-transition: all .5s ease -webkit-transition: all .5s ease transition: all .5s ease;
}

    .btn-subCat-trajes:hover {
        box-shadow: none;
    }



/*COLORES ESTADISTICAS*/

.renglon-color-text {
    font-weight: bolder;
}

.renglon-amarillo {
    border-bottom: solid #FEC520;
}

    .renglon-amarillo .badge {
        background: #FEC520;
    }

    .renglon-amarillo > .renglon-color-text, td.amarillo {
        color: #FEC520;
        font-weight: bolder;
    }

.renglon-rojo {
    border-bottom: solid #C1262A;
}

    .renglon-rojo .badge {
        background: #C1262A;
    }

    .renglon-rojo > .renglon-color-text, td.rojo {
        color: #C1262A;
        font-weight: bolder;
    }

.renglon-azul {
    border-bottom: solid #1671B8;
}

    .renglon-azul .badge {
        background: #1671B8;
    }

    .renglon-azul > .renglon-color-text, td.azul {
        color: #1671B8;
        font-weight: bolder;
    }

.renglon-verde {
    border-bottom: solid #3AB54A;
}

    .renglon-verde .badge {
        background: #3AB54A;
    }

    .renglon-verde > .renglon-color-text, td.verde {
        color: #3AB54A;
        font-weight: bolder;
    }

.renglon-naranja {
    border-bottom: solid #F78F2C;
}

    .renglon-naranja .badge {
        background: #F78F2C;
    }

    .renglon-naranja > .renglon-color-text, td.naranja {
        color: #F78F2C;
        font-weight: bolder;
    }

.medallero {
    font-family: 'ChunkFive';
    color: #7D1C26;
    letter-spacing: 4px;
}

.medallero-container {
    width: 300px;
}

form.navbar-form.navbar-left.buscador {
    padding: 0px;
}

@media(min-width: 768px) {
}


/*/////////////////////SOFIA PREMIUM//////////////////////////*/
.premium .carousel-control {
    width: 25px;
    /*width:5%;*/
}

.school-news {
    height: 250px;
    /*height:400px;*/
    background-color: #1A2574;
    background-image: url(/Content/img/Premium/FONDO-TRANSPARENTE.png);
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

.school-news-info, .school-news-picture {
    height: 100%;
}

.school-news-info {
    padding: 15px 25px;
    /*padding:60px*/
}

.school-news-title, .school-news-subtitle, .school-news-text {
    color: white;
}

.school-news-title, .school-news-subtitle {
    font-family: 'Gandhi';
}

.school-news-title {
    /*font-size:3em;*/
    font-size: 2.3em;
    width: 100%;
    white-space: nowrap;
    overflow: hidden;
    -ms-text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    text-align: center;
}

.school-news-subtitle {
    /*font-size: 2.3em;*/
    font-size: 1.7em;
    width: 100%;
    white-space: nowrap;
    overflow: hidden;
    -ms-text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    text-align: center;
}

.school-news-text {
    /*font-size: 20px;
    height: 30px;*/
    font-size: 18px;
    height: 25px;
    width: 100%;
    white-space: nowrap;
    overflow: hidden;
    -ms-text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    text-align: center;
}

.school-news-picture {
    display: none;
    padding: 0;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

.school-name {
    padding: 10px 0px;
    font-family: gandhi;
    text-align: center;
    font-weight: bolder;
    font-size: 3em;
    line-height: 1em;
}

.school-socialmedia:after {
    content: '';
    clear: both;
    display: block;
}

.school-socialmedia .tab-content {
    text-align: center;
    padding: 10px;
    position: relative;
    z-index: 1;
    margin-top: 20px;
}

.school-socialmedia .school-socialmedia-icons a {
    color: rgba(255,255,255,0.5);
    display: block;
    padding: 10px;
    -moz-transition: ease 1s all;
    -o-transition: ease 1s all;
    -webkit-transition: ease 1s all;
    transition: ease 1s all;
}

    .school-socialmedia .school-socialmedia-icons a:hover {
        color: white;
    }

.school-socialmedia .school-socialmedia-icons {
    margin: 0;
    text-align: center;
    padding: 0;
    background: #F15B28;
    position: relative;
}

    .school-socialmedia .school-socialmedia-icons .powered {
        position: absolute;
        bottom: 10px;
        color: #e8e8e8;
        font-family: gandhi;
        font-size: smaller;
        text-align: center;
    }

        .school-socialmedia .school-socialmedia-icons .powered .img-powered {
            width: 25px;
            float: none;
            margin-left: 5px;
        }

@media(min-width:768px) {
    .school-socialmedia .school-socialmedia-icons .powered {
        font-size: small;
    }

        .school-socialmedia .school-socialmedia-icons .powered .img-powered {
            float: right;
        }
}

.school-socialmedia .school-socialmedia-icons li {
    display: inline-block;
    width: 100px;
    padding: 0;
    position: relative;
    z-index: 1;
}


    .school-socialmedia .school-socialmedia-icons li.active:before {
        left: 50%;
        bottom: -39px;
        border: solid transparent;
        content: " ";
        height: 0;
        width: 0;
        position: absolute;
        pointer-events: none;
        border-top-color: #F15B28;
        border-width: 20px;
        margin-left: -20px;
        -moz-transition: all ease 1s;
        -o-transition: all ease 1s;
        -webkit-transition: all ease 1s;
        transition: all ease 1s;
    }

    .school-socialmedia .school-socialmedia-icons li.active a {
        color: white;
    }


.school-news-button {
    width: 100%;
    text-align: center;
    /*text-align:right;*/
    color: white;
}

    .school-news-button .btn-link {
        color: white;
    }

@keyframes loading {
    25% {
        background: rgba(255, 255, 255, 0.30);
    }

    50% {
        background: rgba(255, 255, 255, 0.60);
    }
}

#modalNews img {
    max-width: 100%;
    display: block;
    height: auto;
}

.cargando-news .school-news-title, .cargando-news .school-news-subtitle, .cargando-news .school-news-text {
    height: 25px;
    margin: 10px auto;
    -moz-animation: loading;
    -o-animation: loading;
    -webkit-animation: loading;
    animation: loading;
    -moz-animation-duration: 2s;
    -o-animation-duration: 2s;
    -webkit-animation-duration: 2s;
    animation-duration: 2s;
    -moz-animation-iteration-count: infinite;
    -o-animation-iteration-count: infinite;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -moz-animation-timing-function: linear -o-animation-timing-function:linear -webkit-animation-timing-function:linear animation-timing-function:linear;
}

.cargando-news .school-news-title {
    width: 30%;
}

.cargando-news .school-news-subtitle {
    width: 50%;
}

.cargando-news .school-news-text {
    width: 250px;
}

.cargando-news .school-news-picture {
    -moz-animation: loading;
    -o-animation: loading;
    -webkit-animation: loading;
    animation: loading;
    -moz-animation-duration: 3s;
    -o-animation-duration: 3s;
    -webkit-animation-duration: 3s;
    animation-duration: 3s;
    -moz-animation-iteration-count: infinite;
    -o-animation-iteration-count: infinite;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -moz-animation-timing-function: cubic-bezier(0.19, -0.15, 0.49, 0.36) -o-animation-timing-function: cubic-bezier(0.19, -0.15, 0.49, 0.36) -webkit-animation-timing-function: cubic-bezier(0.19, -0.15, 0.49, 0.36) animation-timing-function: cubic-bezier(0.19, -0.15, 0.49, 0.36);
}

.school-feed-post {
    text-align: justify;
    -moz-transition: all ease 1s;
    -o-transition: all ease 1s;
    -webkit-transition: all ease 1s;
    transition: all ease 1s;
}

    .school-feed-post .panel-heading {
        background: transparent;
        border: none;
        padding: 10px;
        padding-bottom: 0px;
        -webkit-transform: translateZ(0px);
    }

    .school-feed-post .panel-body {
        padding: 10px;
        padding-top: 0px;
    }

    .school-feed-post .list-group-item {
        text-align: center;
    }

    .school-feed-post:hover {
        -webkit-box-shadow: 0px 4px 9px -1px rgba(0,0,0,0.75);
        -moz-box-shadow: 0px 4px 9px -1px rgba(0,0,0,0.75);
        box-shadow: 0px 4px 9px -1px rgba(0,0,0,0.75);
    }

.masonry {
    -webkit-column-count: 1;
    column-count: 1;
    -moz-column-count: 1;
}

.item-masonry {
    display: inline-block;
    width: 100%;
}

body.premium {
    padding-top: 60px;
}

.premium .navbar-home-top {
    background: rgb(255,255,255);
}

.premium .navbar {
}

.premium .navbar-brand {
    width: 133px;
    padding: 0;
    overflow: hidden;
}

    .premium .navbar-brand img {
        width: 100%;
        margin-top: 0;
    }

.premium .orange-link:hover {
    color: black;
}

.premium .navbar-form input[name="UserName"] {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

.premium .navbar-form input[name="Password"] {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    border-top-width: 0px;
}

.premium form {
    margin-top: -5px;
}

@media(min-width: 992px) {
    .premium form {
        margin-top: 8px;
    }
}

/* DIRECTOR PREMIUM */

.btn-premium {
    margin-top: 10px;
    margin-bottom: 10px;
    padding-left: 5px;
    padding-right: 5px;
}

    /*.btn-premium a {
        display: block;
        text-align: center;
        padding: 5px;
    }*/

    .btn-premium a .fa {
        display: block;
        font-size: 2.5em;
    }

    .btn-premium a .fa-nextTo {
        font-size: 1.5em;
        display: inline;
    }

/* END DIRECTOR PREMIUM */

@media(min-width: 768px) {
    body.premium {
        padding-top: 130px;
    }

    .premium .container {
        margin-top: 0px;
    }

    .premium .navbar {
        min-height: 50px;
    }

    .premium .navbar-header {
        float: none;
    }

    .premium .navbar-brand {
        float: none;
        display: block;
        height: auto;
        width: 133px;
        margin-left: auto !important;
        margin: 0px auto;
        padding: 0px;
    }

    .premium .navbar-form input[name="UserName"] {
        border-bottom-left-radius: 4px;
        border-bottom-right-radius: 4px;
    }

    .premium .navbar-form input[name="Password"] {
        border-top-left-radius: 4px;
        border-top-right-radius: 4px;
        border-top-width: 1px;
    }

    .premium .navbar-form {
        float: none !important;
    }

    .school-news-title, .school-news-subtitle, .school-news-text {
        text-align: left;
    }

    .school-news {
        height: 400px;
    }

    .school-news-button {
        text-align: right;
    }

    .school-news-picture {
        display: block;
    }

    .school-news-info {
        padding: 15px 45px;
    }

    .premium .carousel-control {
        width: 45px;
    }

    .premium .carousel-control {
        width: 60px;
    }

    .school-news-info {
        padding: 60px;
    }

    .cargando-news .school-news-title, .cargando-news .school-news-subtitle, .cargando-news .school-news-text {
        margin: 10px 0;
    }

    .masonry {
        -webkit-column-count: 3;
        column-count: 3;
        -moz-column-count: 3;
    }
}

@media(min-width: 992px) {

    .premium .navbar-header {
        float: left;
    }

    .premium .navbar-form {
        float: right !important;
    }

    body.premium {
        padding-top: 95px;
    }

    .masonry {
        -webkit-column-count: 4;
        column-count: 4;
        -moz-column-count: 4;
    }

    .premium .navbar-brand {
        width: 200px;
        margin: 5px;
    }
}

@media(min-width: 1200px) {
    .school-news-title {
        font-size: 3em;
    }

    .school-news-subtitle {
        font-size: 2.3em;
    }

    .school-news-text {
        font-size: 20px;
        height: 30px;
    }
}

/*/////////////////////END SOFIA PREMIUM//////////////////////////*/



/*/////////////////////PLAN COMPRA PREMIUM//////////////////////////*/

.plancompra {
    font-family: gandhi;
    border: none;
    border-radius: 0px;
    -moz-transition: all ease 1s;
    -o-transition: all ease 1s;
    -webkit-transition: all ease 1s;
    transition: all ease 1s;
}

    .plancompra:hover {
        box-shadow: 0px 0px 20px 0px rgba(50, 50, 50, 1);
    }

    .plancompra .panel-heading {
        font-size: 24px;
        text-align: center;
        background: rgb(24, 115, 186);
        color: rgb(255, 255, 255);
        border-top-left-radius: 0px;
        border-top-right-radius: 0px;
        box-shadow: inset 0px -5px 10px -8px rgb(0, 0, 0);
    }

        .plancompra .panel-heading small {
            display: block;
        }

    .plancompra .panel-body {
        font-size: 22px;
        text-align: center;
        font-weight: bolder;
        color: rgb(255, 255, 255);
        background: rgb(24, 115, 186);
    }

    .plancompra .list-group-item:hover {
        background: white;
    }

    .plancompra .list-group-item > span {
        display: block;
    }

    .plancompra .list-group {
        margin: 0px !important;
    }


    .plancompra.premium .panel-heading, .plancompra.premium .panel-body {
        background: #f78d27;
    }

    .plancompra.alumno .panel-heading, .plancompra.alumno .panel-body {
        background: #20b476;
    }

    .plancompra.profesor .panel-heading, .plancompra.profesor .panel-body {
        background: #1873ba;
    }

.ribbon-aprobado {
    position: absolute;
    right: -5px;
    top: -5px;
    z-index: 1;
    overflow: hidden;
    width: 75px;
    height: 75px;
    text-align: right;
}

    .ribbon-aprobado span {
        font-size: 10px;
        font-weight: bold;
        color: #FFF;
        text-transform: uppercase;
        text-align: center;
        line-height: 20px;
        -moz-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
        -o-transform: rotate(45deg);
        transform: rotate(45deg);
        -webkit-transform: rotate(45deg);
        width: 100px;
        display: block;
        background: #79A70A;
        background: linear-gradient(#20B476 0%, #20b476 100%);
        box-shadow: 0 3px 10px -5px rgba(0, 0, 0, 1);
        position: absolute;
        top: 19px;
        right: -21px;
    }

        .ribbon-aprobado span::before {
            content: "";
            position: absolute;
            left: 0px;
            top: 100%;
            z-index: -1;
            border-left: 3px solid #20b476;
            border-right: 3px solid transparent;
            border-bottom: 3px solid transparent;
            border-top: 3px solid #20b476;
        }

        .ribbon-aprobado span::after {
            content: "";
            position: absolute;
            right: 0px;
            top: 100%;
            z-index: -1;
            border-left: 3px solid transparent;
            border-right: 3px solid #20b476;
            border-bottom: 3px solid transparent;
            border-top: 3px solid #20b476;
        }

.ribbon-cancelado {
    position: absolute;
    right: -5px;
    top: -5px;
    z-index: 1;
    overflow: hidden;
    width: 75px;
    height: 75px;
    text-align: right;
}

    .ribbon-cancelado span {
        font-size: 10px;
        font-weight: bold;
        color: #FFF;
        text-transform: uppercase;
        text-align: center;
        line-height: 20px;
        -moz-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
        -o-transform: rotate(45deg);
        transform: rotate(45deg);
        -webkit-transform: rotate(45deg);
        width: 100px;
        display: block;
        background: #79A70A;
        background: linear-gradient(#EC2C39 0%, #EC2C39 100%);
        box-shadow: 0 3px 10px -5px rgba(0, 0, 0, 1);
        position: absolute;
        top: 19px;
        right: -21px;
    }

        .ribbon-cancelado span::before {
            content: "";
            position: absolute;
            left: 0px;
            top: 100%;
            z-index: -1;
            border-left: 3px solid #EC2C39;
            border-right: 3px solid transparent;
            border-bottom: 3px solid transparent;
            border-top: 3px solid #EC2C39;
        }

        .ribbon-cancelado span::after {
            content: "";
            position: absolute;
            right: 0px;
            top: 100%;
            z-index: -1;
            border-left: 3px solid transparent;
            border-right: 3px solid #EC2C39;
            border-bottom: 3px solid transparent;
            border-top: 3px solid #EC2C39;
        }

/*TUTOR VIRTUAL*/
.info-tutor {
    padding: 0px;
    margin: 0px;
    margin-bottom: 15px;
}

    .info-tutor li {
        list-style: none;
        font-family: gandhi;
        font-size: 1.5em;
        line-height: 1em;
        padding: 10px 0px;
        border-bottom: solid 1px;
    }

    .info-tutor span {
        float: right;
        font-weight: bold;
    }

.subtemaName-hab, .name-hab, .nomen-hab {
    font-family: gandhi;
    margin: 0px;
}

.disabled .subtemaName-hab, .disabled .name-hab, .disabled .nomen-hab {
    color: #ccc;
}

.subtemaName-hab {
    margin-bottom: .3em;
}

.name-hab {
    font-weight: lighter;
}

.nomen-hab {
    color: #8c8c8c;
    font-style: italic;
    font-size: 1em;
    border-bottom: solid 1px;
    float: right;
    margin-top: 5px;
}

.closeTutor {
    position: absolute;
    right: 20px;
    top: 0px;
    font-size: 35px;
    display: inline;
    color: white;
    text-shadow: 4px 4px 4px #333;
    z-index: 3;
}

    .closeTutor:hover {
        text-shadow: none;
        color: white;
    }


@media screen and (orientation:portrait) {
    /* Portrait styles */
    /*hide your main content and display message */
    .toLandscape {
        height: 100%;
        width: 100%;
        -moz-transition: 1s linear all;
        -o-transition: 1s linear all;
        -webkit-transition: 1s linear all;
        transition: 1s linear all;
        background-color: #0082C0;
        top: 0px;
        left: 0px;
        z-index: -10005;
        position: fixed;
        margin: 0 auto;
        white-space: nowrap;
        background-image: url(/Content/img/portrait_warning.png);
        background-repeat: no-repeat;
        background-position: center center;
        color: white;
        opacity: 0;
    }

        .toLandscape.in {
            opacity: 1;
            z-index: 10005;
        }
}

@media screen and (orientation:landscape) {
    /* Landscape styles */
    /* show your content*/

    .toLandscape {
        opacity: 0;
        z-index: -10005;
        -moz-transition: 1s linear all;
        -o-transition: 1s linear all;
        -webkit-transition: 1s linear all;
        transition: 1s linear all;
    }
}


.tutorVirtual {
    position: fixed;
    top: 0px;
    -moz-transform: translateY(-1000px);
    -ms-transform: translateY(-1000px);
    -o-transform: translateY(-1000px);
    -webkit-transform: translateY(-1000px);
    transform: translateY(-1000px);
    opacity: 0;
    left: 0;
    background-color: black;
    background-image: url(https://sofiaxtv2.blob.core.windows.net:443/imagenes/interfaz/alumno/tutorvirtual/fondos/inicio-verde.jpg);
    z-index: -10000;
    width: 100%;
    height: 100%;
    -moz-transition: 1s linear all;
    -o-transition: 1s linear all;
    -webkit-transition: 1s linear all;
    transition: 1s linear all;
    margin: 0 auto;
    white-space: nowrap;
    /*background-attachment:;*/
    background-repeat: repeat;
    background-size: initial;
    overflow-y: hidden;
    font-family: Jaapokki;
}

.replace-tutor {
    color: white;
    margin-top: 50px;
    text-shadow: 5px 5px 5px #333;
    font-size: 35px;
    font-family: gandhi;
}

.tutorVirtual .tab-pane .col-sm-4 {
    width: 400px;
}

.tutorVirtual.in {
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
    -moz-transform: translateY(0);
    -webkit-transform: translateY(0);
    opacity: 1;
    z-index: 10000;
}

.noscroll {
    overflow: hidden;
}

.listacubos {
    list-style: none;
    padding: 0;
    margin: 0;
    position: absolute;
    top: 50%;
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}

.diagonal {
    width: 203px;
    height: 3px;
    /*background: gainsboro;*/
    display: block;
    position: absolute;
    z-index: -1;
    right: -170px;
}

.listacubos > li {
    display: inline-block;
    margin: 0 70px;
    width: 116px;
    -moz-transform: translateY(-50px);
    -ms-transform: translateY(-50px);
    -o-transform: translateY(-50px);
    -webkit-transform: translateY(-50px);
    transform: translateY(-50px);
}


.listacubos li .diagonal {
    /*transform: rotate(25deg);
    top: 127px;*/
    top: 76px;
    left: 73px;
    -moz-transform: rotate(25deg);
    -ms-transform: rotate(25deg);
    -o-transform: rotate(25deg);
    -webkit-transform: rotate(25deg);
    transform: rotate(25deg);
}

.listacubos > li:nth-child(2n+1) {
    -moz-transform: translateY(50px);
    -ms-transform: translateY(50px);
    -o-transform: translateY(50px);
    -webkit-transform: translateY(50px);
    transform: translateY(50px);
}

.listacubos li:nth-child(2n+1) .diagonal {
    /*top: 28px;
    transform: rotate(-25deg);*/
    top: -24px;
    left: 40px;
    -moz-transform: rotate(-29deg);
    -ms-transform: rotate(-29deg);
    -o-transform: rotate(-29deg);
    -webkit-transform: rotate(-29deg);
    transform: rotate(-29deg);
}

/*.listacubos li:nth-last-child(2) .diagonal
{
    display:none
}*/

.listacubos > li:nth-last-child(1) {
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    -webkit-transform: translateY(0);
    transform: translateY(0);
}

.cubo-habilidad {
    width: 116px;
    height: 128px;
    display: block;
}

.cubo-road .secuencia-cubos {
    position: absolute;
    color: white;
    left: 50%;
    top: 50%;
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    font-weight: bolder;
    font-family: gandhi;
    font-size: 2.2em;
    text-shadow: #333 2px 2px 1px;
}

.cubo-habilidad img:first-child {
    position: relative;
    z-index: 1;
}

.cubo-habilidad:focus {
    outline: none;
}

    .cubo-habilidad:active .cubo-resplandor, .cubo-habilidad:focus .cubo-resplandor, .cubo-habilidad:hover .cubo-resplandor, .cubo-habilidad:visited .cubo-resplandor {
        visibility: visible !important;
    }

.cubo-resplandor {
    visibility: hidden;
    position: absolute;
    left: 0;
}

.nav-tutor {
    text-align: center;
    position: absolute;
    width: 100%;
    left: 0;
    top: 50%;
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}

.cargando-habilidades {
    position: absolute;
    z-index: 99999;
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    left: 50%;
    top: 50%;
    font-size: 5em;
    color: white;
    text-shadow: #333 3px 3px 3px;
    font-family: gandhi;
}

.tutorVirtual .popover {
    background: rgba(37, 37, 37, 0.8);
    color: white;
    font-family: Gandhi;
    max-width: 700px;
    min-width: 300px;
    z-index: 11000;
}

    .tutorVirtual .popover h3 {
        color: white;
    }

.tutorVirtual .popover-title {
    background: transparent;
    color: white;
    line-height: 1.5;
    letter-spacing: 5px;
    font-weight: lighter;
    font-size: 20px;
    border-bottom: none;
    text-align: center;
}


.tutorVirtual .popover-content {
    text-align: center;
    min-width: 200px;
}

.tutorVirtual .popover > .arrow {
    display: none;
}

.tutorVirtual .popover.right > .arrow:after {
    border-right-color: #333;
}

.tutorVirtual .popover.bottom > .arrow:after {
    border-bottom-color: #333;
}

.tutorVirtual .popover.top > .arrow:after {
    border-top-color: #333;
}

.tutorVirtual .popover.left > .arrow:after {
    border-left-color: #333;
}

.tutorVirtual .cubo-boss + .popover {
    min-width: 700px;
}

    .tutorVirtual .cubo-boss + .popover .popover-content {
        font-size: 3em;
    }

    .tutorVirtual .cubo-boss + .popover .popover-title {
        font-size: 3.5em;
        font-weight: bolder;
    }

    .tutorVirtual .cubo-boss + .popover h3 {
        color: white;
        font-weight: lighter;
    }

#modalCubos {
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.44);
}

    #modalCubos .modal-dialog {
        margin: auto;
        top: 50%;
        -moz-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        -o-transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
    }

    #modalCubos .modal-content {
        background: rgba(37, 37, 37, 0.8);
        color: white;
    }



    #modalCubos .modal-header {
        border-bottom: none;
        padding: 0 15px;
        padding-top: 60px;
    }

@media(min-width: 768px) {
    #modalCubos .modal-header {
        border-bottom: none;
        padding: 0 15px;
        padding-top: 19px;
    }
}

#modalCubos h1, #modalCubos h2, #modalCubos h3, #modalCubos h4, #modalCubos h5, #modalCubos h6 {
    color: white;
    white-space: pre-line;
    text-align: center;
}

#modalCubos .modal-header .close {
    color: white;
    opacity: .6;
    font-size: 35px;
    margin-top: -18px;
}

    #modalCubos .modal-header .close:hover, #modalCubos .modal-header .close:focus {
        color: white;
        filter: alpha(opacity=100);
        opacity: 1;
    }

#modalCubos .modal-body {
    color: white;
    font-family: gandhi;
}

#modalCubos .modal-footer {
    text-align: center;
    font-family: gandhi;
}

.btn-GameTutor {
    display: inline-block;
    background: #f04497;
    position: relative;
    text-align: center;
    color: white;
    margin-top: 10px;
    font-size: 17px;
}

    .btn-GameTutor:hover, .btn-GameTutor:hover::before, .btn-GameTutor:hover::after {
        background: #ef68a9;
    }

    /* common background color to all */
    .btn-GameTutor, .btn-GameTutor::before, .btn-GameTutor::after {
        background-color: #f04497;
    }

        /* shared styles to make left and right lines */
        .btn-GameTutor::before, .btn-GameTutor::after {
            content: "";
            position: absolute;
            height: 25px;
            width: 5px;
            top: 5px;
        }

        /* pull the left 'line' out to the left */
        .btn-GameTutor::before {
            left: -5px;
        }

        /* pull the right 'line' out to the right */
        .btn-GameTutor::after {
            right: -5px;
        }

#carousel-tutor .carousel-indicators li {
    background-color: rgba(63, 169, 245, 0.63);
}

    #carousel-tutor .carousel-indicators li.active {
        background: #3fa9f5;
    }

.nav-tutor > li.active > a, .nav-tutor > li.active > a:hover, .nav-tutor > li.active > a:focus {
    background: transparent;
}

.nav-tutor > li > a > img:first-child {
    position: relative;
    z-index: 2;
}

.nav-tutor > li > a:active .nav-tutor-select, .nav-tutor > li > a:focus .nav-tutor-select, .nav-tutor > li > a:hover .nav-tutor-select, .nav-tutor > li > a:visited .nav-tutor-select {
    visibility: visible;
}

.nav-tutor-select {
    visibility: hidden;
    position: absolute;
    left: 0;
}

.nav-tutor > li {
    float: none;
    display: inline-block;
    width: 15%;
}

    .nav-tutor > li > a {
        border-radius: 100%;
        width: 200px;
        margin: 5px auto;
        padding: 0;
    }

        .nav-tutor > li > a:hover, .nav-tutor > li > a:focus {
            background: transparent;
        }


.header-tutor {
    position: absolute;
    width: 100%;
    background: rgba(255, 255, 255, 0.8);
    height: 50px;
}

.bottom-tutor {
    position: absolute;
    width: 100%;
    left: 0;
    bottom: 30px;
}

    .bottom-tutor .fa {
        color: white;
        font-size: 6em;
        bottom: 0;
    }

.back-grado {
    position: absolute;
    left: 10px;
    top: 0;
    height: 50px;
}

.hud-img-grado {
    width: 48px;
    vertical-align: middle;
    margin-top: -5px;
}

.btn-backMenu {
    margin-right: 15px;
    color: black;
    z-index: 1;
    font-family: gandhi;
    font-size: 28px;
    height: 50px;
    display: inline-block;
}

    .btn-backMenu:hover, .btn-backMenu:focus, .btn-backMenu:active {
        text-decoration: underline;
        color: black;
    }

.hud-info {
    color: black;
    z-index: 1;
    font-family: gandhi;
    font-size: 28px;
    line-height: 50px;
}

    .hud-info img {
        width: 40px;
        margin-top: -5px;
        margin-right: 10px;
        vertical-align: middle;
    }

.hud-info-grado {
    color: black;
    z-index: 1;
    font-family: gandhi;
    font-size: 3em;
    font-weight: bolder;
    vertical-align: middle;
    display: inline-block;
    margin-top: -20px;
    height: 50px;
}

.bottom-estrellas span.fa {
    color: white;
    font-size: 5em;
    bottom: 0;
    text-shadow: 5px 5px 5px #333;
}

.hud-recom {
    background: rgba(255, 255, 255, 0.8);
    display: block;
    position: relative;
    z-index: 100;
}

.hab-recom {
    display: block;
    text-align: center;
    overflow: hidden;
    color: white;
}

.cubosReq {
    text-align: center;
    color: white;
}

.lista-recom {
    padding: 5px;
    margin: 0;
}

    .lista-recom li {
        list-style: none;
        white-space: normal;
        line-height: 25px;
        position: relative;
        font-size: .8em;
        width: 33.33%;
        display: inline-block;
    }

.overThree {
    display: inline;
    float: left;
}

.hab-recom .img-hub-recom {
    width: 70%;
    margin: 0;
}

.hab-recom .ordenCubo {
    position: absolute;
    top: 50%;
    left: 50%;
    -moz-transform: translate(-50%);
    -ms-transform: translate(-50%);
    -o-transform: translate(-50%);
    -webkit-transform: translate(-50%);
    transform: translate(-50%);
    font-size: 19px;
    text-shadow: #333 2px 2px 1px;
}

.lista-req {
    padding: 0;
}

    .lista-req li {
        list-style: none;
        white-space: normal;
        line-height: 25px;
        position: relative;
        font-size: 1em;
        width: 33.33%;
        display: inline-block;
    }

    .lista-req .ordenCuboReq {
        position: absolute;
        top: 50%;
        left: 50%;
        -moz-transform: translate(-50%);
        -ms-transform: translate(-50%);
        -o-transform: translate(-50%);
        -webkit-transform: translate(-50%);
        transform: translate(-50%);
        font-size: 19px;
        text-shadow: #333 2px 2px 1px;
    }

hr.tutor {
    border-bottom: 1px solid #fff;
}


.flecha-tutor {
    position: absolute;
    top: 50px;
    right: 50%;
    -moz-transform: translateX(50%);
    -ms-transform: translateX(50%);
    -o-transform: translateX(50%);
    -webkit-transform: translateX(50%);
    transform: translateX(50%);
}

.listacubos .linea {
    height: 2px;
    background: #ddd;
    position: absolute;
    width: 95%;
    margin: 0 auto;
    left: 0;
    right: 0;
    top: 50%;
    z-index: 0;
}

.listacubos .img-boss {
    width: 270px;
}

.listacubos .boss-resplandor {
    width: 270px;
}

#cubos1 .listacubos .linea {
    width: 90%;
}


.table-row {
    display: table;
}

.table-cell-column {
    display: table-cell;
    float: none !important;
}

.wrapper.tutor .label {
    color: black;
    text-shadow: none;
}

.wrapper.tutor #accordion td, .wrapper.tutor [data-toggle="collapse"] {
    color: black;
    text-shadow: none;
}

.wrapper.tutor h1, .wrapper.tutor h2, .wrapper.tutor h3, .wrapper.tutor h4, .wrapper.tutor h5, .wrapper.tutor h6, .wrapper.tutor td, .wrapper.tutor td > span, .wrapper.tutor .retroalimentacion, .wrapper.tutor .excer, .wrapper.tutor #time {
    color: black;
    font-weight: bold;
}

.wrapper.tutor hr, .wrapper.tutor .title-retro:after {
    background-color: black;
    border-color: black;
}

.wrapper.tutor .retro-resultado, .wrapper.tutor .retro-pasos-buenos, .wrapper.tutor .retro-pasos, .wrapper.tutor .retro-calif-total, .wrapper.tutor .retro-ident-num {
    color: white;
    padding: 1px;
    text-shadow: none;
}

.wrapper.tutor .retro-resultado, .wrapper.tutor .retro-calif-total {
    background: green;
}

.wrapper.tutor .retro-pasos-buenos, .wrapper.tutor .retro-pasos {
    background: blue;
}

.wrapper.tutor .retro-ident-num {
    background: rgb(117, 47, 209);
}



/*////////////////// JEFE FINAL /////////////////////////*/

.wrapper.tutor-jefe .ejercicio-tutor {
    background: rgba(0,0,0,.4);
    padding: 10px;
}

.wrapper.tutor-jefe .label {
    color: white;
    text-shadow: none;
}

.wrapper.tutor-jefe #accordion td, .wrapper.tutor-jefe [data-toggle="collapse"] {
    color: black;
    text-shadow: none;
}

.wrapper.tutor-jefe h1, .wrapper.tutor-jefe h2, .wrapper.tutor-jefe h3, .wrapper.tutor-jefe h4, .wrapper.tutor-jefe h5, .wrapper.tutor-jefe h6, .wrapper.tutor-jefe td, .wrapper.tutor-jefe td > span, .wrapper.tutor-jefe .retroalimentacion, .wrapper.tutor-jefe .excer, .wrapper.tutor-jefe #time {
    color: white;
    font-weight: bold;
}

.wrapper.tutor-jefe .panel h1, .wrapper.tutor-jefe .panel h2, .wrapper.tutor-jefe .panel h3, .wrapper.tutor-jefe .panel h4, .wrapper.tutor-jefe .panel h5, .wrapper.tutor-jefe .well h6, .wrapper.tutor-jefe .well h1, .wrapper.tutor-jefe .well h2, .wrapper.tutor-jefe .well h3, .wrapper.tutor-jefe .well h4, .wrapper.tutor-jefe .well h5, .wrapper.tutor-jefe .well h6 {
    color: black;
}

.wrapper.tutor-jefe hr, .wrapper.tutor-jefe .title-retro:after {
    background-color: white;
    border-color: black;
}

.wrapper.tutor-jefe .retro-resultado, .wrapper.tutor-jefe .retro-pasos-buenos, .wrapper.tutor-jefe .retro-pasos, .wrapper.tutor-jefe .retro-calif-total, .wrapper.tutor-jefe .retro-ident-num {
    color: white;
    padding: 1px;
    text-shadow: none;
}

.wrapper.tutor-jefe .retro-resultado, .wrapper.tutor-jefe .retro-calif-total {
    background: green;
}

.wrapper.tutor-jefe .retro-pasos-buenos, .wrapper.tutor-jefe .retro-pasos {
    background: blue;
}

.wrapper.tutor-jefe .retro-ident-num {
    background: rgb(117, 47, 209);
}

.wrapper.tutor-jefe .retroalimentacion {
    margin-top: 15px;
    background: rgba(0,0,0,0.4);
}

.wrapper.tutor-jefe #wrap-retro {
}

.hub-versus-tutor {
    width: 300px;
    height: 50px;
    position: fixed;
    bottom: 70px;
    ;
    left: 0;
    right: 150px;
    margin: auto;
}

.hub-VS {
    width: 20%;
    height: 100%;
    position: absolute;
    color: white;
    font-family: gandhi;
    font-weight: bolder;
    left: 0;
    right: 0;
    margin: auto;
    text-align: center;
    line-height: 50px;
    font-size: 3em;
    text-shadow: #333 3px 3px 3px;
}

.correct-tutor {
    position: absolute;
    left: -10px;
    background: #5cb866;
    color: white;
    font-size: 33px;
    font-weight: bolder;
    width: 40%;
    text-align: center;
    border-radius: 5px;
    box-shadow: #3f3f3f 3px 3px 3px;
}

.wrong-tutor {
    position: absolute;
    right: -10px;
    background: #cc3300;
    color: white;
    font-size: 33px;
    font-weight: bolder;
    width: 40%;
    text-align: center;
    border-radius: 5px;
    box-shadow: #3f3f3f 3px 3px 3px;
}

@keyframes name {
    from {
        background: red;
    }

    to {
        background: yellow;
    }
}

@-moz-keyframes name {
}

@-webkit-keyframes name {
}

.hub-tutor {
    width: 250px;
    height: 300px;
    background: rgba(103, 103, 103, 0.8);
    color: black;
    position: fixed;
    z-index: 10068;
    top: 50%;
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    right: 20%;
    display: none;
}

.hub-title {
    padding: 5px;
    background: #ccc;
}

.hub-content {
    padding: 5px;
}
/*INDEX PREMIUM*/

#canvas {
    width: 100%;
}

.animacion-premium {
    position: relative;
    height: auto;
    display: block;
    background-color: #c2cfd8;
    background-image: url("../Content/img/bk-premium.png");
    background-repeat: no-repeat;
    background-size: cover;
    border-style: solid;
    border-width: 0 0 10px;
    -moz-border-image: url(/Content/img/barra.png) 0 0 27 stretch;
    -webkit-border-image: url(/Content/img/barra.png) 0 0 27 stretch;
    -o-border-image: url(/Content/img/barra.png) 0 0 27 stretch;
    border-image: url(/Content/img/barra.png) 0 0 27 fill stretch;
}


.section {
    padding: 0 0 25px;
    background-image: url(/Content/img/Premium/FONDO-TRANSPARENTE.png);
    background-size: cover;
    overflow: hidden;
}

.feature-premium {
    display: flex;
    -ms-flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    align-items: center;
    text-align: center;
}

hr.premium {
    height: 10px;
    border: 0;
    box-shadow: 0 10px 10px -10px #8c8b8b inset;
}

#conversacion {
    background: white;
    overflow: auto;
    min-height: 600px;
    max-height: 600px;
    padding: 10px;
}

.bubble-message {
    margin-top: 10px;
    padding: 10px;
    border-radius: 20px;
    display: block;
    float: right;
    clear: both;
    max-width: 75%;
    min-width: 10%;
    border-bottom-right-radius: 0px;
}


    .bubble-message.guest {
        float: left;
        border-top-right-radius: 20px;
        border-bottom-right-radius: 20px;
        border-bottom-left-radius: 0;
    }

/*.section:nth-child(even) {
        background-color: white;
    }

        .section:nth-child(even) h1 {
            color: black;
        }

    .section:nth-child(odd) {
        background-color: #333;
        color: white;
    }

        .section:nth-child(odd) h1 {
            color: white;
        }*/

.section h1 {
    color: #333;
}

.section h2 {
    font-family: gandhi;
    font-size: 2.1em;
    text-align: center;
}

@media(min-width:768px) {
    .section {
        padding: 35px 15px;
    }

        .section h2 {
            text-align: left;
        }

    hr.premium {
        width: 600px;
        margin: auto;
    }

    .feature-premium {
        text-align: left;
    }
}

@media(min-width:1200px) {
    hr.premium {
        width: 800px;
    }
}

.section p {
    font-size: 18px;
}

/*.feature-premium {
    display: block;
    margin-bottom: 60px;
    overflow: hidden;
}*/

/*PRICING TABLE*/
/* Use a wide full screen for small screens like tablets. */
@media (min-width: 768px) and (max-width:992px) {
    .container.my_plans {
        width: initial;
        padding-left: 2em;
        padding-right: 2em;
    }
}

.my_plans {
    color: black;
}
/* --- Plans ---------------------------- */

.my_planHeader {
    text-align: center;
    color: white;
    padding-top: 0.2em;
    padding-bottom: 0.2em;
    font-family: gandhi;
}

.my_planTitle {
    font-size: 2em;
    font-weight: bold;
}

.my_planPrice {
    font-size: 1.4em;
    font-weight: bold;
}

.my_planDuration {
    margin-top: -0.6em;
}

@media (max-width: 768px) {

    .my_planPrice {
        font-size: 1em;
    }
}

/* --- Features ------------------------- */

.my_feature {
    line-height: 2.8em;
}

    .my_feature sup {
        vertical-align: middle;
        cursor: help;
    }

.my_title {
    text-align: center;
    font-weight: bolder;
    font-size: large;
}

@media (max-width: 768px) {
    .my_feature {
        text-align: center;
    }
}

.my_featureRow {
    margin-top: 0.2em;
    margin-bottom: 0.2em;
    border: 0.1em solid rgb(218, 218, 218);
    background: white;
    font-family: gandhi;
}

    .my_featureRow:hover {
        background: rgb(241, 241, 241);
    }

.my_titleRow {
    background: #f7f7f7;
    margin-bottom: -1em;
    border-bottom: none;
}

/* --- Plan 1 --------------------------- */
.my_plan1 {
    background: rgba(32,180,118,.20);
}

.my_planHeader.my_plan1 a {
    color: white;
}

.my_planHeader.my_plan1 {
    background: #20b476;
    border-bottom: thick solid #1b7751;
}

/* --- Plan 2 --------------------------- */
.my_plan2 {
    background: rgba(37,191,215,.2);
}

.my_planHeader.my_plan2 a {
    color: white;
}

.my_planHeader.my_plan2 {
    background: #25bfd7;
    border-bottom: thick solid #248a9a;
}

/* --- Plan 3 --------------------------- */
.my_plan3 {
    background: rgb(254,235,212);
}

.my_planHeader.my_plan3 a {
    background: rgb(199, 127, 40);
    color: white;
}

.my_planHeader.my_plan3 {
    background: rgb(253, 161, 49);
    border-bottom: thick solid rgb(199, 127, 40);
}


/*Titulos*/

.my_planFeature {
    text-align: center;
    font-size: 2em;
}

    .my_planFeature i.my_check {
        color: #20b476;
    }

    .my_planFeature i.my_times {
        color: #ec2c39;
    }


.img-brand-premium {
    width: 50px;
}

.slogan {
    padding: 5px;
    position: absolute;
    margin-bottom: 0;
    z-index: 1;
    left: 50%;
    top: 70%;
    -moz-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    -o-transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    white-space: nowrap;
    font-size: 1.4em;
    font-weight: lighter;
    font-family: chunkfive;
    color: white;
    border-radius: 5px;
    text-shadow: -3px -3px 3px #1873ba, 3px -3px 3px #1873ba, -3px 3px 3px #1873ba, 3px 3px 3px #1873A9;
}

    .slogan .block {
        display: block;
    }

.navbar-default .navbar-link-plan {
    color: white;
    margin-right: 2em;
    -moz-transition: all .5s ease;
    -o-transition: all .5s ease;
    -webkit-transition: all .5s ease;
    transition: all .5s ease;
    text-shadow: 3px 3px 3px #333;
}

    .navbar-default .navbar-link-plan:hover {
        color: #f78d27;
        text-decoration: none;
        text-shadow: none;
    }

.link-premium {
    text-align: center;
    display: block;
    color: white;
    text-decoration: none;
    margin-top: 10px;
    border-bottom: transparent 2px;
}

    .link-premium:hover, .link-premium:focus {
        text-decoration: none;
        color: white;
        border-bottom: solid 2px;
    }

.text-link-premium {
    font-family: museo500;
    display: block;
    font-size: 2em;
    font-weight: bolder;
}

.img-nav-premium {
    width: 50px;
    margin-left: 0px;
    display: inline-block;
    float: none;
}

    .img-nav-premium img {
        width: 100%;
    }

.navbar-form .btn {
    display: block;
    width: 100%;
}

.link-btn-navbar-form {
    text-align: center;
}

.title-group-vinculacion {
    background: #eee;
    padding: 8px;
    font-size: 20px;
    border: 1px solid #ddd;
    margin: 0px;
}

.panel-group-vinculacion {
    border-radius: 0px !important;
    border-top: 0px;
    margin-bottom: -5px !important;
}

.panel-heading-vinculacion {
    padding: 0px;
}

    .panel-heading-vinculacion h4 {
        margin: 0;
    }

    .panel-heading-vinculacion a {
        padding: 10px 10px;
        display: block;
    }

.list-group-vinculacion li {
    margin: 0;
    margin-bottom: 4px;
    padding: 0;
}

    .list-group-vinculacion li > label {
        display: block;
        padding: 10px;
    }

.list-group-vinculacion input[type='checkbox'] {
    position: static;
    margin-left: -3px;
}

.panel-vinculacion {
    border-radius: 0 !important;
}

    .panel-vinculacion .panel-heading {
        border-radius: 0px;
    }

@media (min-width: 768px) {



    .img-nav-premium {
        float: right;
        margin-left: 10px;
    }

    .navbar-form .btn {
        display: inline-block;
        width: auto;
        /*margin-bottom:4px;*/
    }

    .slogan {
        font-size: 2.4em;
        top: 50%;
    }

        .slogan .block {
            display: block;
        }

    .img-brand-premium {
        width: 100px;
    }
}

@media (min-width: 992px) {

    .img-brand-premium {
        width: 150px;
    }

    .link-btn-navbar-form {
        text-align: left;
    }

    .navbar-form .btn {

    }
}

@media (min-width: 1200px) {

    .slogan {
        font-size: 4.4em;
    }

    .img-brand-premium {
        width: 190px;
    }
}

@media (max-width: 767px) {
}

.table-responsive .dropdown-menu {
    position: relative !important;
}


.list-planner li {
    padding-top: 15px;
    border-bottom-width: 5px;
}

.buttons-item-planner {
    padding-top: 15px;
}


@media print {

    #body-invisible-print * {
        visibility: hidden;
    }

    #verModal, #verModal * {
        visibility: visible;
        overflow: initial;
    }

        #verModal .nav-tabs {
            display: none;
        }

        #verModal .tab-content > .tab-pane {
            display: block !important;
            opacity: 1 !important;
            visibility: visible !important;
        }
}


.col-xs-5ths,
.col-sm-5ths,
.col-md-5ths,
.col-lg-5ths {
    position: relative;
    min-height: 1px;
    padding-right: 10px;
    padding-left: 10px;
}

.col-xs-5ths {
    width: 20%;
    float: left;
}

@media (min-width: 768px) {
    .col-sm-5ths {
        width: 20%;
        float: left;
    }
}

@media (min-width: 992px) {
    .col-md-5ths {
        width: 20%;
        float: left;
    }
}

@media (min-width: 1200px) {
    .col-lg-5ths {
        width: 20%;
        float: left;
    }
}


.container-preview {
    height: 250px;
    overflow: hidden;
    border: 1px solid #000;
}

.header-preview {
    background: white;
    height: 35px;
    overflow: hidden;
    padding: 5px;
    padding: 10px;
}

.logo-header-preview {
    font-weight: bolder;
    color: #7d7c7c;
    font-size: 17px;
    display: inline-block;
    margin-top: -5px;
}

.header-textBox-preview {
    border-radius: 3px;
    width: 40px;
    border: #c3c3c3 solid 1px;
    padding: 5px;
    margin: 0 2px;
    display: inline-block;
}

.button-header-preview {
    /*background: #3243BB;*/
    border: none;
    padding: 6px;
    width: 25px;
}

@media(min-width:992px) {
    .header-textBox-preview {
        border-radius: 3px;
        width: 88px;
        border: #c3c3c3 solid 1px;
        padding: 7px;
        margin: 0 2px;
        display: inline-block;
    }

    .button-header-preview {
        /*background: #3243BB;*/
        border: none;
        padding: 8px;
        width: 61px;
    }
}

.header-border-preview {
    /*background: #3243bb;*/
    height: 10px;
}

.bk-slider-preview {
    /*background: #111e79;*/
    height: 120px;
}

.text-bk-slider {
    height: 100%;
    width: 50%;
    float: left;
    padding: 15px;
}

.bk-text-sm {
    width: 80px;
    height: 15px;
    display: block;
    margin-bottom: 10px;
    color: white;
}

.bk-text-lg {
    width: 140px;
    height: 15px;
    display: block;
    color: white;
}

.image-slider-preview {
    background: rgba(255,255,255,.5);
    height: 100%;
    width: 50%;
    float: right;
}

.misc-preview {
    /*background: #3243bb;*/
    height: 30px;
}

.text-container-preview {
    padding: 5px;
    /*color:#3243bb*/
}



/*INPUT RADIO WITH FONT AWESOME*/


#modal_ticket .input-hidden {
    position: absolute;
    left: -9999px;
}

#modal_ticket input[type=radio] + label {
    text-align: center;
    display: block;
    border-radius: 15px;
    padding: 20px;
    margin-bottom: 30px;
    color: white;
    /*opacity: .5;*/
    -moz-transition: all .5s linear;
    -o-transition: all .5s linear;
    -webkit-transition: all .5s linear;
    transition: all .5s linear;
}

    #modal_ticket input[type=radio] + label[for=soporte] {
        background: #F78D27;
        box-shadow: 0 0 0 1px #d2741a inset, 0 0 0 2px rgba(255,255,255,0.15) inset, 0 8px 0 0 #c36c18, 0 8px 8px 1px rgba(0,0,0,0.5);
    }

#modal_ticket input[type=radio]:checked + label[for=soporte] {
    background: #d2741a;
}

#modal_ticket input[type=radio] + label[for=bug] {
    background: #EC2C39;
    box-shadow: 0 0 0 1px #d2232f inset, 0 0 0 2px rgba(255,255,255,0.15) inset, 0 8px 0 0 #ca1622, 0 8px 8px 1px rgba(0,0,0,0.5);
}

#modal_ticket input[type=radio]:checked + label[for=bug] {
    background: #d2232f;
}

#modal_ticket input[type=radio] + label[for=mejora] {
    background: #1873BA;
    box-shadow: 0 0 0 1px #1264a5 inset, 0 0 0 2px rgba(255,255,255,0.15) inset, 0 8px 0 0 #0c5690, 0 8px 8px 1px rgba(0,0,0,0.5);
}

#modal_ticket input[type=radio]:checked + label[for=mejora] {
    background: #1264a5;
}

#modal_ticket input[type=radio] + label[for=info] {
    background: #20B476;
    box-shadow: 0 0 0 1px #19905e inset, 0 0 0 2px rgba(255,255,255,0.15) inset, 0 8px 0 0 #148052, 0 8px 8px 1px rgba(0,0,0,0.5);
}

#modal_ticket input[type=radio]:checked + label[for=info] {
    background: #19905e;
}

#modal_ticket input[type=radio] + label .text-radio {
    display: block;
}

#modal_ticket input[type=radio]:hover + label {
    /*color:white;*/
    cursor: pointer;
    /*opacity:1;*/
}

#modal_ticket input[type=radio]:checked + label {
    cursor: default;
}

    #modal_ticket input[type=radio]:checked + label[for=soporte], #modal_ticket input[type=radio] + label[for=soporte]:active {
        box-shadow: 0 0 0 1px #d2741a inset, 0 0 0 1px rgba(255,255,255,0.15) inset, 0 1px 3px 1px rgba(0,0,0,0.3);
    }

    #modal_ticket input[type=radio]:checked + label[for=bug], #modal_ticket input[type=radio] + label[for=bug]:active {
        box-shadow: 0 0 0 1px #d2232f inset, 0 0 0 1px rgba(255,255,255,0.15) inset, 0 1px 3px 1px rgba(0,0,0,0.3);
    }

    #modal_ticket input[type=radio]:checked + label[for=mejora], #modal_ticket input[type=radio] + label[for=mejora]:active {
        box-shadow: 0 0 0 1px #1264a5 inset, 0 0 0 1px rgba(255,255,255,0.15) inset, 0 1px 3px 1px rgba(0,0,0,0.3);
    }

    #modal_ticket input[type=radio]:checked + label[for=info], #modal_ticket input[type=radio] + label[for=info]:active {
        box-shadow: 0 0 0 1px #19905e inset, 0 0 0 1px rgba(255,255,255,0.15) inset, 0 1px 3px 1px rgba(0,0,0,0.3);
    }


/*VALIDACION*/

.form-soporte label.error {
    color: #EC2C39;
    display: block;
}


/*EL BOTON CSS*/

.El_Boton .input-hidden
{
   position: absolute;
    left: -9999px;

}

.El_Boton .input-hidden + label {
    text-align: center;
    display: block;
    border-radius: 15px;
    padding: 0;
    margin-bottom: 30px;
    color: #000;
    position: relative;
    -moz-transition: all .5s linear;
    -o-transition: all .5s linear;
    -webkit-transition: all .5s linear;
    transition: all .5s linear;
}

.El_Boton .input-hidden:hover + label {
    cursor: pointer;
    /*opacity:1;*/
}


.El_Boton .input-hidden + label > img {
    -moz-transition: all .5s linear;
    -o-transition: all .5s linear;
    -webkit-transition: all .5s linear;
    transition: all .5s linear;
    -webkit-filter: grayscale(1);
    filter: grayscale(1);
}

.El_Boton .input-hidden:hover + label > img {
    -webkit-filter: grayscale(0);
    filter: grayscale(0);
}

.El_Boton .input-hidden + label > span {
    opacity: 1;
    position: absolute;
    width: 100%;
    left: 50%;
    top: 100%;
    background: rgba(255, 255, 255, 0.51);
    -moz-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    -o-transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    font-size: 20px;
    font-weight: bolder;
    -moz-transition: all .5s linear;
    -o-transition: all .5s linear;
    -webkit-transition: all .5s linear;
    transition: all .5s linear;
}


.El_Boton .input-hidden:checked + label > img {
    -webkit-filter: grayscale(0);
    filter: grayscale(0);
}



.El_Boton .panel
{
    border-width:2px;
}
/*FIN EL BOTON CSS*/

/*CROPP IMAGE*/

.container-image {
    opacity: 0;
    -moz-transition: all 1s ease;
    -o-transition: all 1s ease;
    -webkit-transition: all 1s ease;
    transition: all 1s ease;
}

    .container-image.in {
        opacity: 1;
    }


/*EJERCICIOS*/

.table-CM {
    table-layout: fixed;
}

@media(min-width: 768px) {
}

@media(min-width: 992px) {

    .table-CM {
        width: 80%;
        margin: auto;
    }
}

@media(min-width: 1200px) {

    .table-CM {
        width: 60%;
    }
}

.table-CM th {
    text-align: center;
    font-size: 25px;
    border-top: none !important;
    border-bottom: 5px solid;
}

.table-CM .last-column {
    border-right: 5px solid !important;
}

    .table-CM .last-column + th, .table-CM .last-column + td {
        border-bottom: 3px dashed;
    }

.table-CM .dashed {
    border-bottom: 3px dashed !important;
}

.no-border {
    border: none !important;
}

.table-CM tr:last-child {
    border-bottom: none !important;
}

.container-image.in
{
    opacity:1
}

/*EJERCICIOS*/

@media(min-width: 768px)
{

}
.table-CM {
    table-layout: fixed;
}

@media(min-width: 992px) {

    .table-CM {
        width: 80%;
        margin: auto;
    }
}
@media(min-width: 1200px) {

    .table-CM {
        width: 60%;
    }
}

    .table-CM th {
        text-align: center;
        font-size: 25px;
        border-top: none !important;
        border-bottom: 5px solid;
    }

    .table-CM .last-column {
        border-right: 5px solid !important;
    }

        .table-CM .last-column + th, .table-CM .last-column + td {
            border-bottom: 3px dashed;
        }

    .table-CM td.minimocomun {
        border-bottom: 3px dashed !important;
    }

.no-border {
    border: none !important;
}

.table-CM tr:last-child td {
    border-bottom: none !important;
}

#modal-usoCasa .modal-content {
    background-color: #ffffff;
    background-image: url(/Content/img/Premium/FONDO-TRANSPARENTE.png);
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    border: none;
}

#modal-usoCasa .modal-header {
    border-bottom: none;
    padding: 15px 15px 0 15px;
    background-image: url(https://sofiaxtv2.blob.core.windows.net/imagenes/interfaz/alumno/PLACASUPERIOR.png);
    height: 140px;
    background-repeat: no-repeat;
    background-position: top center;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
}

#modal-usoCasa .modal-title
{
    font-family: Gandhi;
    color: black;
    font-weight: bold;
    font-size:22px;
    padding:10px;
}

/* LESTHER */
/* Loader */
#LsuperLoader{
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 10;
    width: 160px;
    height: 160px;
    margin: -80px 0 0 -80px;
    text-indent: -999em;
    background-color: #111;
    background: rgba(0,0,0,0.8) url(https://sofiaxtv2.blob.core.windows.net/imagenes/interfaz/win10_loading2.gif) no-repeat center center;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}