body {
    /* Ubicaci�n de la imagen */
    /*background-image: url(../_image/fondo1.jpg);*/
    /* Nos aseguramos que la imagen de fondo este centrada vertical y
    horizontalmente en todo momento */
    background-position: center center;
    /* La imagen de fondo no se repite */
    background-repeat: no-repeat;
    /* La imagen de fondo est� fija en el viewport, de modo que no se mueva cuando
     la altura del contenido supere la altura de la imagen. fixed o scroll*/
    background-attachment: fixed;
    /* La imagen de fondo se reescala cuando se cambia el ancho de ventana
     del navegador */
    background-size: cover;
    -webkit-transition: background 1s ease-out;
    -moz-transition: background 1s ease-out;
    -o-transition: background 1s ease-out;
    -ms-transition: background 1s ease-out;
    transition: background 1s ease-out;
    /* Fijamos un color de fondo para que se muestre mientras se est�
    cargando la imagen de fondo o si hay problemas para cargarla  */
    background-color: #6f97b6;
    */
}

.cpointer {
    cursor: pointer;
}

html,
body {
    height: 100%;
    margin: 0;
}

.wrapper {
    display: table;
    height: 100%;
    width: 100%;
}

.content {
    display: table-row;
    /* height is dynamic, and will expand... */
    height: 100%;
    /* ...as content is added (won't scroll) */
}

.footer {
    display: table-row;
}


/*body {
background: url(../_image/fondo.jpg) repeat;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}*/

#images_1 {
    background: transparent url("../_image/_fondo1.jpg") no-repeat 0 0;
}

#images_1 {
    background: transparent url("../_image/_fondo2.jpg") no-repeat 0 0;
}

#images_1 {
    background: transparent url("../_image/_fondo3.jpg") no-repeat 0 0;
}

#images_1 {
    background: transparent url("../_image/_fondo4.jpg") no-repeat 0 0;
}

#images_1 {
    background: transparent url("../_image/_fondo5.jpg") no-repeat 0 0;
}

a:link {
    text-decoration: none;
}

#id_info {
    border-radius: 10px;
}

.logoever {
    max-width: 300px;
    padding: 0px 10px 10px 10px;
}

.panel-slider {
    background-color: rgba(255, 255, 255, 0.9);
    border-radius: 10px;
}

.logocalif {
    max-width: 400px;
    padding: 10px 0px 0px 20px;
}

.panel-info {
    background-color: rgba(255, 255, 255, 0.6);
    border-radius: 10px;
}

.panel-info>.panel-heading {
    background-color: rgba(255, 255, 255, 0.6);
}

.panel-success>.panel-heading {
    background-color: rgba(171, 197, 164, 1);
}

.btn-calif {
    color: #fff;
    background-color: #2673b3;
    border-color: #1b5280;
}

.btn-calif:hover,
.btn-calif:focus,
.btn-calif.focus,
.btn-calif:active,
.btn-calif.active,
.open>.dropdown-toggle.btn-calif {
    color: #fff;
    background-color: #18456b;
    border-color: #10304b;
}

.btn-calif:active,
.btn-calif.active,
.open>.dropdown-toggle.btn-calif {
    background-image: none;
}

.btn-calif.disabled,
.btn-calif[disabled],
fieldset[disabled] .btn-calif,
.btn-calif.disabled:hover,
.btn-calif[disabled]:hover,
fieldset[disabled] .btn-calif:hover,
.btn-calif.disabled:focus,
.btn-calif[disabled]:focus,
fieldset[disabled] .btn-calif:focus,
.btn-calif.disabled.focus,
.btn-calif[disabled].focus,
fieldset[disabled] .btn-calif.focus,
.btn-calif.disabled:active,
.btn-calif[disabled]:active,
fieldset[disabled] .btn-calif:active,
.btn-calif.disabled.active,
.btn-calif[disabled].active,
fieldset[disabled] .btn-calif.active {
    background-color: #2673b3;
    border-color: #18456b;
}

.btn-calif .badge {
    color: #2673b3;
    background-color: #fff;
}

.panel-danger>.panel-heading {
    background: #7999b9;
}

#xid_contenido {
    margin-top: 20px;
    background-color: rgba(255, 255, 255, 0.7);
    border-radius: 10px;
}

.panel-default {
    border-radius: 10px;
}

.sinborde {
    border: 0px solid transparent;
}

.font-tit-2 {
    font-family: sans-serif;
    font-size: 1.5em;
    color: #083e24;
}

.font-blanco-1r {
    font-family: sans-serif;
    font-size: 1.2em;
    color: #083e24;
}

.font-blanco-1s {
    font-family: sans-serif;
    font-size: 0.8em;
    color: #ffffff;
}

.font-blanco-1f {
    font-family: sans-serif;
    font-size: 0.8em;
    color: #ffffff;
    padding-top: 10px;
}

.font-blanco-1 {
    font-family: sans-serif;
    font-size: 1em;
    font-weight: bold;
    color: #ffffff;
}

.font-blanco-2 {
    font-family: sans-serif;
    font-size: 1em;
    font-weight: bold;
    color: #ff0000;
}

.font-blanco-3 {
    font-family: sans-serif;
    font-size: 1em;
    font-weight: bold;
    color: #0d4307;
}

.font-blanco-4 {
    font-family: sans-serif;
    font-size: 1em;
    font-weight: bold;
    color: #312e36;
}

.font-cartel-4 {
    font-family: sans-serif;
    font-size: 4em;
    font-weight: bold;
    color: #312e36;
}

.font-ch-bl-2 {
    font-size: 1.1em;
    color: #3f2e0e;
}

.font-datos {
    font-family: Verdana, Arial, Helvetica;
    font-size: 1.2em;
    color: #070707;
}

.font-lista {
    font-family: Verdana, Arial, Helvetica;
    font-size: 0.8em;
    color: #696866;
}

.font-titulo-sector {
    font-family: Verdana, Arial, Helvetica;
    font-size: 1.2em;
    color: #fff;
}

.font-titulo-item {
    font-family: Verdana, Arial, Helvetica;
    font-size: 1.3em;
    color: #fff;
}

.font-titulo-2 {
    font-family: Verdana, Arial, Helvetica;
    font-size: 1em;
    color: #fff;
}

.padding-05 {
    padding-top: 0.5em;
    padding-bottom: 2em;
}

.btn-sm,
.btn-group-sm>.btn {
    padding: 1px 5px;
    font-size: 12px;
    line-height: 1.5;
    border-radius: 3px;
}

.list-group-item {
    padding: 5px 10px;
}

.glyphicons1 {
    padding-right: 10px;
    opacity: 0.4;
    filter: alpha(opacity=40);
}

.sombra {
    text-shadow: 3px 3px 4px #cccccc;
    text-align: center;
}

.sombra-box {
    -webkit-box-shadow: 0px 0px 18px 0px rgba(255, 255, 255, 0.21);
    -moz-box-shadow: 0px 0px 18px 0px rgba(255, 255, 255, 0.21);
    box-shadow: 0px 0px 18px 0px rgba(0, 0, 0, 0.21);
}

.rotarY:hover {
    transform: rotateY(360deg);
    transition-duration: 1s;
    -webkit-transform: rotateY(360deg);
    -webkit-transition-duration: 1s;
}

.opacity {
    opacity: 0.5;
    filter: alpha(opacity=50);
}

.navbar-brand {
    margin-top: -10px;
}

footer {
    margin-top: 1em;
    background-color: #222;
    padding: 0.55em 0;
}

.costos,
.costos1 {
    font: sans-serif, Verdana, Arial, Helvetica, ;
    padding: 1.5em;
}

.costos1 {
    padding: 1.0em;
}

label.error {
    /* remove the next line when you have trouble in IE6 with labels in list */
    font: sans-serif, Verdana, Arial, Helvetica, ;
    color: #900f30;
    font-size: 0.9em;
    font-style: italic;
    padding: 3;
}

@media screen and (min-width: 300px) {
    .logocalif {
        max-width: 300px;
        padding: 0px 0px 0px 0px;
    }
    #cartel1,
    #cartel2,
    #cartel3,
    #cartel4 {
        margin-top: 20px;
    }
    .panel-slider {
        height: 450px;
        max-width: 340px;
    }
    .font-slider-1 {
        font-size: 2.2em;
    }
    .font-slider-2 {
        font-size: 2.2em;
    }
    .font-slider-3 {
        font-size: 1.1em;
    }
    #id_contenido {
        max-width: 350px;
    }
    #div_contacto {
        max-width: 350px;
    }
    #id_info {
        max-width: 350px;
    }
    .max-box {
        max-width: 280px;
    }
    .max-box-col {
        max-width: 50px;
    }
    .costos,
    .costos1 {
        font-size: 1em;
    }
    #id_panelvinc {
        height: 800px;
    }
    #div_fechas_ins {
        height: 180px;
    }
}

@media screen and (min-width: 480px) {
    .logocalif {
        max-width: 400px;
        padding: 10px 0px 0px 20px;
    }
    #cartel1,
    #cartel2,
    #cartel3,
    #cartel4 {
        margin-top: 30px;
    }
    .panel-slider {
        height: 450px;
        max-width: 450px;
    }
    #id_contenido {
        max-width: 450px;
    }
    #div_contacto {
        max-width: 450px;
    }
    #id_info {
        max-width: 450px;
    }
    .max-box {
        max-width: 300px;
    }
    .max-box-col {
        max-width: 60px;
    }
}

@media screen and (min-width: 768px) {
    #cartel1,
    #cartel2,
    #cartel3,
    #cartel4 {
        margin-top: 90px;
    }
    .panel-slider {
        height: 250px;
        max-width: 700px;
    }
    #id_contenido {
        max-width: 700px;
    }
    #div_frases {
        max-width: 300px;
    }
    .font-slider-1 {
        font-size: 1.7em;
    }
    .font-slider-2 {
        font-size: 1.7em;
    }
    .font-slider-3 {
        font-size: 0.8em;
    }
    .max-box {
        max-width: 200px;
    }
    .max-box-col {
        max-width: 120px;
    }
    #id_panelvinc {
        height: 450px;
    }
    #div_fechas_ins {
        height: 50px;
    }
}

@media screen and (min-width: 1000px) {
    #cartel1,
    #cartel2,
    #cartel3,
    #cartel4 {
        margin-top: 90px;
    }
    .panel-slider {
        height: 250px;
        max-width: 970px;
    }
    #id_contenido {
        max-width: 1200px;
    }
    #div_frases {
        max-width: 700px;
    }
    .font-slider-1 {
        font-size: 2.5em;
    }
    .font-slider-2 {
        font-size: 2.5em;
    }
    .font-slider-3 {
        font-size: 1.3em;
    }
    .max-box {
        max-width: 250px;
    }
    .costos,
    .costos1 {
        font-size: 2em;
    }
}

@media screen and (min-width: 1200px) {
    .panel-slider {
        height: 250px;
        max-width: 1170px;
    }
    .max-box {
        max-width: 300px;
    }
}

.upper {
    text-transform: uppercase;
}

#div_centrado {
    width: 30%;
    height: 26%;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -15%; // Presta atencion al signo negativo!!!
    margin-top: -13%; // Presta atencion al signo negativo!!!
    z-index: 99999;
}


/*-- Animaci�n de Cargando --*/

.spiner {
    padding: 7px;
    margin: 0;
    height: 74px;
    z-index: 99999;
}

.ball1 {
    -webkit-border-radius: 50px;
    -moz-border-radius: 50px;
    border-radius: 50px;
    margin: 0 auto;
    -webkit-box-sizing: initial;
    -moz-box-sizing: initial;
    box-sizing: initial;
}


/*-- C�rculo interior --*/

.ball1 {
    border: 5px solid #b75772;
    border-top: 5px solid rgba(211, 108, 137, 0.31);
    border-left: 5px solid rgba(211, 108, 137, 0.31);
    width: 26px;
    height: 26px;
    position: relative;
    top: -48px;
    -webkit-animation: spinoff 1s infinite linear;
    -o-animation: spinoff 1s infinite linear;
    animation: spinoff 1s infinite linear;
}


/*-- Animaci�n Spin --*/

@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@-moz-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}


/*-- SpinOff --*/

@-webkit-keyframes spinoff {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(-360deg);
        -moz-transform: rotate(-360deg);
        -ms-transform: rotate(-360deg);
        -o-transform: rotate(-360deg);
        transform: rotate(-360deg);
    }
}

@-moz-keyframes spinoff {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(-360deg);
        -moz-transform: rotate(-360deg);
        -ms-transform: rotate(-360deg);
        -o-transform: rotate(-360deg);
        transform: rotate(-360deg);
    }
}

@keyframes spinoff {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(-360deg);
        -moz-transform: rotate(-360deg);
        -ms-transform: rotate(-360deg);
        -o-transform: rotate(-360deg);
        transform: rotate(-360deg);
    }
}

ul.source,
ul.target {
    min-height: 50px;
    margin: 0px 25px 10px 0px;
    padding: 2px;
    border-width: 1px;
    border-style: solid;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    list-style-type: none;
    list-style-position: inside;
}

ul.source {
    border-color: #f8e0b1;
}

ul.target {
    border-color: #add38d;
}

.source li,
.target li {
    margin: 5px;
    padding: 5px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
}

.source li {
    background-color: #fcf8e3;
    border: 1px solid #fbeed5;
    color: #c09853;
}

.target li {
    background-color: #ebf5e6;
    border: 1px solid #d6e9c6;
    color: #468847;
}

.sortable-dragging {
    border-color: #ccc !important;
    background-color: #fafafa !important;
    color: #bbb !important;
}

.sortable-placeholder {
    height: 40px;
}

.source .sortable-placeholder {
    border: 2px dashed #f8e0b1 !important;
    background-color: #fefcf5 !important;
}

.target .sortable-placeholder {
    border: 2px dashed #add38d !important;
    background-color: #f6fbf4 !important;
}

::-webkit-scrollbar {
    width: 10px;
    background: #dbe8ec;
}

::-webkit-scrollbar-button {
    width: 8px;
    height: 5px;
}

::-webkit-scrollbar-track {
    background: #ecedee;
    border: thin solid #b3b4b4;
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
    -webkit-border-radius: 10px;
    border-radius: 10px;
}

::-webkit-scrollbar-thumb {
    background: -webkit-linear-gradient(top, #5aafb0, #4ca06d);
    -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 225, .5), inset 1px 0 0 rgba(255, 255, 255, .4), inset 0 1px 2px rgba(255, 255, 255, .3);
    border: thin solid #5aafb0;
    border-radius: 10px;
    -webkit-border-radius: 10px;
}

::-webkit-scrollbar-thumb:hover {
    background: -webkit-linear-gradient(top, #4ca06d, #5aafb0);
}


/* Pseudo-clase */

::-webkit-scrollbar-thumb:window-inactive {
    background: rgba(77, 161, 112, .6);
}

#id_container {
    /*   background-color: rgba(255,255,255,1);
*/
    max-width: 900px;
    /*	min-height: 600px;*/
}

#id_alumnos,
#id_materias,
#id_docentes {
    min-height: 300px;
}

#doc_disponibles,
#doc_vinculados {
    height: 300px;
    padding: 0px;
}

#id_lista_doc_disp,
#id_lista_doc_vinc {
    overflow-y: auto;
    height: 300px;
}

#id_lista_doc_disp li:hover {
    cursor: move
}

#id_listas li:nth-child(even) {
    background: #eee
}

#id_listas li:nth-child(odd) {
    background: #fff
}

#id_listas li:hover {
    background: #caeac2
}

#mat_disponibles,
#mat_vinculados {
    height: 300px;
    padding: 0px;
}

#id_lista_mat_disp,
#id_lista_mat_vinc {
    overflow-y: auto;
    height: 300px;
}

#id_lista_mat_disp li:hover {
    cursor: move
}

.caja_hora {
    max-width: 40px;
}

#id_contenido {
    max-width: 320px;
    margin-top: 80px;
    background-color: rgba(255, 255, 255, 0.9);
    border-radius: 10px;
}

#div_registro {
    max-width: 250px;
    margin-top: 10px;
}

#bolvido {
    margin-top: 5px;
    cursor: pointer;
}

#bolvido:hover {
    color: #900f30;
}

.datemin {
    max-width: 130px;
    max-height: 25px;
}

.calif45 {
    max-width: 35px;
    text-align: center;
}

.calif45aplazo {
    max-width: 35px;
    text-align: center;
    color: #ff0000;
}

.text60 {
    max-width: 60px;
    text-align: center;
}

.bold {
    font-weight: bold;
}

.textred {
    color: #ff0000;
}

.btn-marg5 {
    margin: 0px 5px 0px 5px;
}

@media only screen and (max-width: 800px) {
    /* Force table to not be like tables anymore */
    #table-vertical table,
    #table-vertical thead,
    #table-vertical tbody,
    #table-vertical th,
    #table-vertical td,
    #table-vertical tr {
        display: block;
    }
    /* Hide table headers (but not display: none;, for accessibility) */
    #table-vertical thead tr {
        position: absolute;
        top: -9999px;
        left: -9999px;
    }
    #table-vertical tr {
        border: 1px solid #ccc;
    }
    #table-vertical td {
        /* Behave  like a "row" */
        border: none;
        border-bottom: 1px solid #eee;
        position: relative;
        padding-left: 50%;
        white-space: normal;
        text-align: left;
        min-height: 30px;
    }
    #table-vertical td:before {
        /* Now like a table header */
        position: absolute;
        /* Top/left values mimic padding */
        top: 6px;
        left: 6px;
        width: 15%;
        padding-right: 10px;
        white-space: nowrap;
        text-align: left;
        font-weight: bold;
    }
    /*
	Label the data
	*/
    #table-vertical td:before {
        content: attr(data-title);
    }
    #table-vertical td.td-left {
        padding-left: 0%;
    }
    #table-vertical td.td-left:before {
        width: 35%;
    }
    /* Force table to not be like tables anymore */
    #table-vertical1 table,
    #table-vertical1 thead,
    #table-vertical1 tbody,
    #table-vertical1 th,
    #table-vertical1 td,
    #table-vertical1 tr {
        display: block;
    }
    /* Hide table headers (but not display: none;, for accessibility) */
    #table-vertical1 thead tr {
        position: absolute;
        top: -9999px;
        left: -9999px;
    }
    #table-vertical1 tr {
        border: 1px solid #ccc;
    }
    #table-vertical1 td {
        /* Behave  like a "row" */
        border: none;
        border-bottom: 1px solid #eee;
        position: relative;
        padding-left: 50%;
        white-space: normal;
        text-align: left;
        min-height: 30px;
    }
    #table-vertical1 td:before {
        /* Now like a table header */
        position: absolute;
        /* Top/left values mimic padding */
        top: 6px;
        left: 6px;
        width: 15%;
        padding-right: 10px;
        white-space: nowrap;
        text-align: left;
        font-weight: bold;
    }
    /*
	Label the data
	*/
    #table-vertical1 td:before {
        content: attr(data-title);
    }
    #table-vertical1 td.td-left {
        padding-left: 0%;
    }
    #table-vertical1 td.td-left:before {
        width: 35%;
    }
    /* Force table to not be like tables anymore */
    #table-vertical2 table,
    #table-vertical2 thead,
    #table-vertical2 tbody,
    #table-vertical2 th,
    #table-vertical2 td,
    #table-vertical2 tr {
        display: block;
    }
    /* Hide table headers (but not display: none;, for accessibility) */
    #table-vertical2 thead tr {
        position: absolute;
        top: -9999px;
        left: -9999px;
    }
    #table-vertical2 tr {
        border: 1px solid #ccc;
    }
    #table-vertical2 td {
        /* Behave  like a "row" */
        border: none;
        border-bottom: 1px solid #eee;
        position: relative;
        padding-left: 50%;
        white-space: normal;
        text-align: left;
        min-height: 30px;
    }
    #table-vertical2 td:before {
        /* Now like a table header */
        position: absolute;
        /* Top/left values mimic padding */
        top: 6px;
        left: 6px;
        width: 15%;
        padding-right: 10px;
        white-space: nowrap;
        text-align: left;
        font-weight: bold;
    }
    /*
	Label the data
	*/
    #table-vertical2 td:before {
        content: attr(data-title);
    }
    #table-vertical2 td.td-left {
        padding-left: 0%;
    }
    #table-vertical2 td.td-left:before {
        width: 35%;
    }
}

.bg-calif {
    background-color: #ececec;
}

a.bg-calif:hover {
    background-color: #c9c7c7;
}

.text-label {
    font: Verdana, Arial, Helvetica, ;
    color: #6189a8;
    font-size: 0.9em;
    font-weight: normal;
}

.text-campo {
    font: Verdana, Arial, Helvetica, ;
    color: #8d8b8b;
    font-size: 0.7em;
    font-weight: normal;
}

.text-titlogin {
    font: Verdana, Arial, Helvetica, ;
    color: #8d8b8b;
    font-size: 1.0em;
    font-weight: normal;
    line-height: 1.25;
}

.text-check {
    font: Verdana, Arial, Helvetica, ;
    color: #8d8b8b;
    font-size: 0.9em;
    font-weight: normal;
    padding-left: 5px;
    cursor: pointer;
}

.text-olvido {
    font-size: 0.9em;
    text-decoration: underline;
    text-align: right;
}

.text-sindatos {
    font: Verdana, Arial, Helvetica, ;
    color: #e62f4d;
    font-size: 1.0em;
    font-weight: normal;
    padding: 10px;
    text-align: center;
}

.panel-calif {
    border-color: #21639a;
}

.panel-calif>.panel-heading {
    color: #fff;
    background-color: #21639a;
    border-color: #21639a;
}

.panel-calif>.panel-heading+.panel-collapse>.panel-body {
    border-top-color: #21639a;
}

.panel-calif>.panel-heading .badge {
    color: #21639a;
    background-color: #fff;
}

.panel-calif>.panel-footer+.panel-collapse>.panel-body {
    border-bottom-color: #21639a;
}

#nombre_curso {
    margin-right: 50px;
}

#div_periodo {
    margin-bottom: 10px;
}

.text-aplazo-medio {
    color: #079007;
    text-align: center;
}

.text-aplazo {
    color: #ff0000;
    text-align: center;
}

.text-aprobado {
    color: #000000;
    text-align: center;
}

.bg-white {
    background-color: #ffffff;
}

.form-group {
    margin-bottom: 8px;
}

.input-group-sm>.form-control,
.input-group-sm>.input-group-addon,
.input-group-sm>.input-group-btn>.btn {
    height: 26px;
    padding: 2px 7px;
    font-size: 12px;
    line-height: 1.5;
    border-radius: 3px;
}

select.input-group-sm>.form-control,
select.input-group-sm>.input-group-addon,
select.input-group-sm>.input-group-btn>.btn {
    height: 26px;
    line-height: 26px;
}

.input-group-addon {
    padding: 2px 7px;
    font-size: 12px;
    font-weight: normal;
    line-height: 1;
    color: #555;
    text-align: center;
    background-color: #eee;
    border: 1px solid #ccc;
    border-radius: 4px;
}

.input-group-addon.input-sm {
    padding: 2px 7px;
    font-size: 10px;
    border-radius: 3px;
}

 ::placeholder {
    color: #767676 !important;
    opacity: 0.4;
    /* Firefox */
    text-transform: lowercase !important;
}