@import url("font-awesome.min.css");
@import url('https://fonts.googleapis.com/css?family=Quicksand:300,400,500,700');
/*@import url("https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,400italic,700|Open+Sans+Condensed:300,700");*/

/*
        Striped by HTML5 UP
        html5up.net | @ajlkn
        Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
*/

@-webikt-keyframes pulse {
    from { opacity: 0; }
    to { opacity: 0.5; }
}
::-webkit-scrollbar-thumb {
    background: #bbb;
    border: none;
    border-radius: 100px;
    border: solid 3px #e5e5e5;
    box-shadow: inset 0px 0px 3px #999;
}

::-webkit-scrollbar-thumb:hover {
    background: #b0b0b0;
    box-shadow: inset 0px 0px 3px #888;
}

::-webkit-scrollbar-thumb:active {
    background: #aaa;
    box-shadow: inset 0px 0px 3px #7f7f7f;
}


/* Table */

table {
    margin-bottom: 1em;
    width: 100%;
}

table.default tbody tr:nth-child(2n+2) {
    background: #f4f4f4;
}

table.default td {
    padding: 0.5em 1em 0.5em 1em;
}

table.default th {
    text-align: left;
    font-weight: 700;
    padding: 0.75em 1em 0.75em 1em;
}

table.default thead {
    border-bottom: solid 1px #ddd;
}

table.default tfoot {
    border-top: solid 1px #ddd;
    background: #eee;
}

table{
    width:100%;
}

/* Basic */

body {
    background-color: #e8e8e8;
    background-image: url("images/bg06.png");
    font-family: 'Quicksand', sans-serif !important; 
    font-weight: 400;
    color: #565656;
}

input, textarea, select {
    font-family: 'Quicksand', sans-serif !important; 
    font-weight: 400;
    color: #565656;
    margin-top: .5em;
    margin-bottom: .5em;
}

a {
    color: #304d88;
    text-decoration: none;
    margin: .1em .1em;
}
a :hover {
    color: #304d88;
    text-decoration:blue;
}

strong, b {
    font-weight: 700;
    color: #232323;
}

h2, h3, h4, h5, h6 {
    font-family: 'Quicksand', sans-serif !important; 
    font-weight: 700;
    color: #232323;
    font-size: 2em;
}

h2 a, h4 a, h5 a, h6 a {
    text-decoration: none;
    color: inherit;
}
.titulo{
    font-size: 2.8em;
    line-height: 1em;
}

blockquote {
    border-left: solid 5px #ddd;
    padding: 1em 0 1em 2em;
    font-style: italic;
}

em, i {
    font-style: italic;
}

hr {
    border: 0;
    border-top: solid 1px #ddd;
    padding: 1.5em 0 0 0;
    margin: 1.75em 0 0 0;
}

sub {
    position: relative;
    top: 0.5em;
    font-size: 0.8em;
}

sup {
    position: relative;
    top: -0.5em;
    font-size: 0.8em;
}

br.clear {
    clear: both;
}

/* List */

ul.default {
    list-style: disc;
    padding-left: 1em;
}

ul.default li {
    padding-left: 0.5em;
}

ol.default {
    list-style: decimal;
    padding-left: 1.25em;
}

ol.default li {
    padding-left: 0.25em;
}

/* Pagination */

.pagination .pages {
    display: inline-block;
    font-family: 'Quicksand', sans-serif !important; 
    font-weight: 700;
}

.pagination .pages span {
    display: inline-block;
    width: 1.5em;
    text-align: center;
    margin: 0 0.4em 0 0;
}

.pagination .pages a {
    cursor: pointer;
    display: inline-block;
    text-align: center;
    text-decoration: none;
    color: inherit;
    background-color: #e8e8e8;
    background-image: url("images/bg02.png");
    color: #565656;
    margin: 0 0.4em 0 0;
    border-radius: 0.4em;
    -moz-transition: background-color .25s ease-in-out;
    -webkit-transition: background-color .25s ease-in-out;
    -ms-transition: background-color .25s ease-in-out;
    transition: background-color .25s ease-in-out;
    box-shadow: inset 0 0.075em 0.25em 0 rgba(0, 0, 0, 0.1);
}

.pagination .pages a:hover {
    background-color: #dadada;
}

.pagination .pages a.active {
    background-color: #364050;
    color: #fff;
    box-shadow: none;
    text-shadow: -1px -1px 0px rgba(0, 0, 0, 0.5);
}


/* Sidebar */

#titleBar {
    -moz-backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
    backface-visibility: hidden;
    -moz-transition: -moz-transform 0.5s ease;
    -webkit-transition: -webkit-transform 0.5s ease;
    -ms-transition: -ms-transform 0.5s ease;
    transition: transform 0.5s ease;
    display: none;
    height: 44px;
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 10001;
    background: #333 url("images/bg01.png");
}

#titleBar .title {
    display: block;
    color: #fff;
    line-height: 44px;
    font-size: 1.25em;
    font-family: 'Quicksand', sans-serif !important; 
    font-weight: 700;
    letter-spacing: 0.1em;
    text-shadow: -1px -1px 0px rgba(0, 0, 0, 0.5);
    box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.25);
    text-align: center;
}

#titleBar .title a {
    color: inherit;
    text-decoration: none;
}

#titleBar .toggle {
    width: 80px;
    height: 60px;
    position: absolute;
    top: 0;
    left: 0;
}

#titleBar .toggle:before {
    font-family: FontAwesome;
    text-decoration: none;
    font-style: normal;
    font-weight: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    content: '\f0c9';
    display: block;
    position: absolute;
    top: 7px;
    font-size: 14px;
    width: 50px;
    height: 30px;
    line-height: 30px;
    background: #cccccc url("images/bg02.png");
    border-radius: 5px;
    color: #fff;
    text-align: center;
    box-shadow: inset 0px 0px 0px 1px rgba(255, 255, 255, 0.15), 0 0.025em 0.15em 0em rgba(0, 0, 0, 0.25);
    text-shadow: -1px -1px 0px rgba(0, 0, 0, 0.5);
    left: 7px;
}

#titleBar .toggle:active:before {
    background-color: #cccccc;
}

#navbarNav {
    background: #29202a;
    font-size: 13px;

    color: white;

}

#navbarNav i.fa{
    font-size: 25px;
}


#navbarNav form input, #navbarNAv form select, #navbarNav form textarea {
    border: 0;
}

#navbarNav strong, #navbarNav b {
    color: #fff;
}

#navbarNav a {
    color: #d4dde0;
}

#navbarNav h2, #sidebar h3, #sidebar h4, #sidebar h5, #sidebar h6 {
    color: #fff;
}

#navbarNav header {
    margin: 0 0 1.25em 0;
}

#navbarNav ul{
    margin: 0;
    padding: 0;
    list-style: none;
}

ul.menu-buttons{
    border-bottom: 3px solid #146898;
}
ul.menu-buttons li{
    padding: 10px;
    border-bottom: 1px solid #146898;
}

ul.menu-buttons li:hover{
    background: white; 
    text-shadow:none;
}

#navbarNav ul.menu-buttons li:hover a{
    text-decoration: none;
    color: #eee;
}

#nomusuario{
    font-weight: 700;
    text-align: center;
    padding: 10px;
    border-bottom: 3px solid #146898;
    color: #171e23;
}

.title-filtro{
    font-size: 36px;  
    text-align: center;
}

.filtro{
    font-size:15px;
}

.center{
    text-align: center; 
}

.bold{
    font-weight: 600;
}

.underline{
    text-decoration: underline;
}



/* Content */

#content {
    position: relative;
    background-color: white;
    background-image: url("images/bg04.png");
}

#content > .inner {
    position: relative;
    z-index: 1;
}

/* Copyright */

#copyright {
    padding-bottom: 2em;
}

#copyright p {
    opacity: 0.35;
}

#copyright a {
    color: inherit !important;
}

#copyright:before {
    content: '';
    border-top: solid 1px;
    border-bottom: solid 1px;
    border-color: #171E29;
    border-color: rgba(0, 0, 0, 0.25);
    box-shadow: inset 0px 1px 0px 0px rgba(255, 255, 255, 0.075), 0px 1px 0px 0px rgba(255, 255, 255, 0.075);
    display: block;
}

div#slider { overflow: hidden;height: auto }
div#slider figure img { width: 20%;opacity: .8 ;}
div#slider figure { 
    position: relative;
    width: 500%;
    margin: 0;
    left: 0;    
    text-align: left;
    font-size: 0;
    animation: 30s slidy infinite;
}

button {
    color: white;
    margin: .3em 0;
    border: none;
    cursor: pointer;
}

button:hover {
    opacity: 0.8;
}

/* Extra styles for the cancel button */
.danger {
    background-color: #974739;
}
.primary{
    background-color: #09291e;

}
.success{
    background-color: #0F7246;

}
/* Center the image and position the close button */

img.avatar {

    width: 5em;
    height: 5em;
    border-radius: 50%;
    border: 3px solid #09291e;
    overflow: hidden;

}

.container {
    padding: 16px;
}

span.psw {
    float: right;
}

/* The Modal (background) */
.modal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
    padding-top: 50px;
}

/* Modal Content/Box */
.modal-content {
    background-color: #fefefe;
    margin: 5% auto 15% auto; /* 5% from the top, 15% from the bottom and centered */
    border: 1px solid #888;
    width: 23em;
    height: 26em;
    vertical-align: middle
}

.close:hover,
.close:focus {
    color: red;
    cursor: pointer;
}

/* Add Zoom Animation */
.animate {
    -webkit-animation: animatezoom 0.6s;
    animation: animatezoom 0.6s
}


ul.menured * {
    -moz-transition: all .5s ease-in-out;
    -webkit-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out;
}

ul.menured {
    list-style: none;
    padding: 0; 
    text-align: center;
}

ul.menured li {
    text-align: center;
    display:inline-block;
    width:44px; 
    height: 44px;
    cursor:pointer;
    transition: 1s;
    overflow: hidden;
    margin-top: 1em;

}
ul.menured li:hover {
    width:150px;
    background: #939393; /* Old browsers */

    border-radius: 5px;
    transition: 1s;

}
ul.menured li:hover i {
    color: #fff;
    -moz-transform: rotate(360deg); -webkit-transform: rotate(360deg); transform: rotate(360deg);
}

.menured li span{
    color:#fff;
    font-size: 15px;
    display:none;
    float: left;
    transition: .5s ease;
    margin-top: 13px;
    margin-left: 5px;

}

.menured li:hover span{
    display:block;
    transition: .5s ease;
}

.menured li i{
    font-size: 30px;
    margin-top: 10px;
    float: left;

    color: #5e422c;
}

ul.menured li div {
    margin: 0px 1px 1px 38px; text-align: center;
}
ul.menured li div h5 {
    text-align: center; vertical-align: middle;padding-top: .5em;
}
ul.menured div a:hover {
    color: grey;
}


.img-responsive{
    width: 100%;
}

.imginicio:hover{
    -webkit-transform:scale(1.08);
    -moz-transform:scale(1.08);
    -ms-transform:scale(1.08);
    -o-transform:scale(1.08);
    transform:scale(1.08);
}
.imginicio{
    width: 10em;
    margin-right: 2em;
    -webkit-transition:all .2s ease; /* Safari y Chrome */
    -moz-transition:all .2s ease; /* Firefox */
    -o-transition:all .2s ease; /* IE 9 */
    -ms-transition:all .2s ease; /* Opera */
}
.imginicio:active{
    -webkit-transform:scale(1);
    -moz-transform:scale(1);
    -ms-transform:scale(1);
    -o-transform:scale(1);
    transform:scale(1);

}
#menusup{
    background: #12467b !important;
    z-index: 100;
    top: 0;
    height: 60px;
    left: 0;
    width: 100%;
}

.footer {
    position: fixed;
    right: 0;
    bottom: 0;
    left: 0;
    padding: .3rem;
    z-index: 99;
    height: 30px;

    color:#16499a;
    text-shadow: .5px .5px gray;
    background: #e8e8e8 url("images/bg06.png");
    text-align: center;
    vertical-align: middle;
}
.size1{
    width: 6em; 
    text-align: center;
    padding: .8em;
}
.size2{
    width: 13em; 
    text-align: center;
    padding: .8em;
}
.size3{
    width: 3em; 
    text-align: center;
    padding: .8em;
}
.sizecuadrado{
    width: 6em; 
    text-align: center;
    height: 5em;
    padding: .2em;
    font-size: .9em;
    font-style: italic;
}
.vacante{
    width: 100%;
    box-shadow: 1px 1px 1px #778691;
    text-align: left;
    background-color: rgba(0, 0, 0, .03);
    padding: .5em;
    padding-bottom: 0;
}
.vacante.red{
    border-left:#e53544 ridge 10px;
}
.vacante.orange{
    border-left:#D35400 ridge 10px;
}
.vacante.blue{
    border-left:#145f96 ridge 10px;
}
.puestovacante.red{
    background-color:#e53544;
}
.puestovacante.orange{
    background-color:#D35400;
}
.puestovacante.blue{
    background-color:#145f96;
}
.empresalogo
{
    width: 6em;
}
.panelb{
    width: 100%;
    box-shadow: 1px 1px 1px #999999;
    text-align: left;
    background-color: rgba(0, 0, 0, .03);
    padding: 1em;
    padding-bottom: 0;
}
.sombra{
    width: 100%;
    box-shadow: 2px 2px 2px #999999;
    background-color: rgba(0, 0, 0, .03);
    padding: 1em;
    padding-bottom: 0;
}
input[type=checkbox] {
    transform: scale(1.5);
    margin-right: 5px;
}
input[type=radio] {
    transform: scale(1.8);
    margin-right: 5px;
}
.detallesvacante
{
    text-align: right;
    margin-right: 1em;
}
.puestovacante{
    font-family:'Quicksand', sans-serif !important; 
    font-size: 1.25em;
    color: whitesmoke;
    font-weight: 700;
    padding: 10px;
    margin: 0;
    font-style: normal;
    text-decoration: none;
}

.puestovacante a{
    color: whitesmoke;   
}

.puestovacante a:hover{
    color: white;
}

.descripcionvacante{
    padding: 0px;
    font-family: 'Quicksand', sans-serif !important; 
    font-size: .95em;
    color: #333333;
    line-height: 2em;
}

.descripcionvacante .fa-list{
    color: #e8d3ac!important;    
}

.descripcionvacante .fa-check-square-o{
    color: #cb4d37!important;
}

.requisitosvacante{
    font-family: 'Quicksand', sans-serif !important; 
    font-size: .9em;
    color: #006633 !important;
}
.horariovacante{
    font-family: 'Quicksand', sans-serif !important; 
    font-size: .9em;
    color: black;
}
.center{
    text-align: center;
}
.right{
    text-align: right;
}
.left{
    text-align: left;
}
.empresavacante{
    color:black;
    font-family: 'Quicksand', sans-serif !important; 
    font-size: 1.2em;
    line-height: 2em;
}

.empresavacante:hover{
    color:#044f05;
    font-size: 1.2em;
    text-decoration: underline;
}
.desdevacante{
    width: 100%;
    text-align: right;
    font-size: .95em;
    padding: 24px;
}
.info, .correcto, .ojo, .error, .validation {
    margin: 10px 0px;
    padding:15px;
    background-repeat: no-repeat;
    background-position: 10px center;
    font-family: 'Quicksand', sans-serif !important; 
    font-size:1em;
    text-align:left;
    width:auto;
}
.info {
    color: #00529B;
    background-color: #BDE5F8;
}
.correcto {
    color: white;
    background-color: #43a047;
    box-shadow: 1px 1px 3px #515151;
}
.ojo {
    color: #9F6000;
    background-color: #FEEFB3;
}
.error {
    color: white;
    background-color: #ff3333;
}
.btn {
    border: none; /* Remove borders */
    color: white; /* Add a text color */
    padding: 11px 15px; /* Add some padding */
    cursor: pointer; /* Add a pointer cursor on mouse-over */
    font-family:'Quicksand', sans-serif !important; 
    font-size: 1em;
}
.marco{
    -moz-box-shadow: 1px 1px 3px #555;
    -webkit-box-shadow: 1px 1px 3px #555;
    box-shadow: 1px 1px 3px #555;
    border: white solid 15px; 
    margin-top: 20px;
    text-align: center;
}
.success {
    background-color: #006633;
} /* Green */

.success:hover {background-color: #146b31;}

.infor {background-color:#0080C0} /* Blue */
.infor:hover {background: #16499a;}

.warning {background-color: #632F2F;} /* Orange */
.warning:hover {background: #29202A;}

.danger {background-color: #ae2828;} /* Red */ 
.danger:hover {background: #d85555;}

.default {background-color: #09291e; color: white;} /* Gray */ 
.default:hover {background: #e9b78b;}

.hpanel{
    background-color: #1D8348;
    padding: 20px;
    color: white;
    width: 100%;
    font-size: 1.3em;
    text-align: center;
}
.hpanelp{
    margin: 0px 0px !important;
    background-color: #E67E22;
    padding: 10px;
    color: white;
    width: 100%;
    font-size: 1em;
}
.cpanel
{
    min-height: 300px;
    padding: 0px 0px !important;
    box-shadow: 2px 2px 2px #999999;
    background-color: rgba(0, 0, 0, .03);
    padding: 1em;
    padding-bottom: 0;
}
.bdarkOrange{
    background-color:#632f2f !important;
}
.borange{
    background-color:#fff5f2 !important;

}
.bdarkBlue{
    background-color:#cb4d37 !important;
}
.bblue{
    background-color:#fff !important;

}
.bdarkGreen
{
    background-color:#cb4d37 !important;
}
.bgreen{
    background-color:#fff !important;

}
.bwhite{
    background-color:white !important;

}
.bdarkYellow{
    background-color:#cb4d37!important;
}
.bdarkMagenta{
    background-color:#cb4d37 !important;
}
.bginfo
{
    background-color:#1F618D !important;
}
.bmagenta{
    background-color:#fff !important;
}
.byellow{
    background-color:#fff!important;
}
.borderYellow{
    border: #cc9900 solid 1px;
}
.borderGreen{
    border: #006633 solid 1px;
}
.borderBlue{
    border: #006699 solid 1px;
}
.borderOrange{
    border: #d85514 solid 1px;
}
.colorBlue
{
    color:#5e422c;
}
.colorGreen
{
    color:#5e422c;
}
.colordarkMagenta
{
    color:#5e422c;
}
.colorOrange
{
    color:#5e422c;
}
.colorYellow
{
    color:#5e422c;
}

.colorWhite
{
    color:white;
}
.colorBlack
{
    color:black;
}
.padding10{
    padding: 10px;
}
.subrayar{
    text-decoration: none;
}
.subrayar :hover{
    text-decoration: underline;
}
.table{
    padding: 10px;
}
.table tr{
    padding: 10px;
}
.table tr td{
    padding: 10px;
}
.table tr th{
    padding: 10px;
    font-weight: 800;
    border-bottom: #5c5c5c solid 1px;
}
#mensaje{
    position: fixed;
    right: 0px;
    top: 44px;
    z-index: 1111;
    width: auto;
    top: 95vh; 
    font-size: 30px;
    cursor: pointer;
}

#mensaje:hover .fa.fa-comments{
    color: #cdcdcd;
}

#ventana_mensajes{
    position: fixed;
    z-index: 111;
    right: 0;
    bottom: 31px;
}

.msj-right{
    position: relative;
    padding: 10px;
    border-radius: 5px;
    margin: 0 0 4px 10px;
    background-color: #007bff;
    color:white;
}

.msj-left{
    position: relative;
    padding: 10px;
    border-radius: 5px;
    margin: 0 10px 4px 0;
    background-color: #17a2b8;
    color:white;
}

.msj-left:after{
    content: "";
    display: block;
    width: 0;
    height: 0;
    border-top: 6px solid transparent;
    border-right: 12px solid #17a2b8;
    border-bottom: 6px solid transparent;
    position: absolute;
    left: -9px;
    top: 0;
}

.msj-right:after{
    content: "";
    display: block;
    width: 0;
    height: 0;
    border-top: 6px solid transparent;
    border-left: 12px solid #007bff;
    border-bottom: 6px solid transparent;
    position: absolute;
    right: -9px;
    top: 0;
}

input[type=range] {
    -webkit-appearance: none; /* Hides the slider so that custom slider can be made */
    width: 75%; /* Specific width is required for Firefox. */
    background: transparent; /* Otherwise white in Chrome */
}

input[type=range]::-webkit-slider-thumb {
    -webkit-appearance: none;
}

input[type=range]:focus {
    outline: none; /* Removes the blue border. You should probably do some kind of focus styling for accessibility reasons though. */
}

input[type=range]::-ms-track {
    width: 75%;
    cursor: pointer;

    /* Hides the slider so custom styles can be added */
    background: transparent; 
    border-color: transparent;
    color: transparent;
}
/* Special styling for WebKit/Blink */
input[type=range]::-webkit-slider-thumb {
    -webkit-appearance: none;
    border: 1px solid #000000;
    height: 36px;
    width: 12px;
    border-radius: 3px;
    background: #ffffff;
    cursor: pointer;
    margin-top: -14px; /* You need to specify a margin in Chrome, but in Firefox and IE it is automatic */
    box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d; /* Add cool effects to your sliders! */
}

/* All the same stuff for Firefox */
input[type=range]::-moz-range-thumb {
    box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
    border: 1px solid #000000;
    height: 36px;
    width: 16px;
    border-radius: 3px;
    background: #ffffff;
    cursor: pointer;
}

/* All the same stuff for IE */
input[type=range]::-ms-thumb {
    box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
    border: 1px solid #000000;
    height: 36px;
    width: 16px;
    border-radius: 3px;
    background: #ffffff;
    cursor: pointer;
}
input[type=range]::-webkit-slider-runnable-track {
    width: 100%;
    height: 8.4px;
    cursor: pointer;
    box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
    background: #3071a9;
    border-radius: 1.3px;
    border: 0.2px solid #010101;
}

input[type=range]:focus::-webkit-slider-runnable-track {
    background: #367ebd;
}

input[type=range]::-moz-range-track {
    width: 100%;
    height: 8.4px;
    cursor: pointer;
    box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
    background: #3071a9;
    border-radius: 1.3px;
    border: 0.2px solid #010101;
}

input[type=range]::-ms-track {
    width: 100%;
    height: 8.4px;
    cursor: pointer;
    background: transparent;
    border-color: transparent;
    border-width: 16px 0;
    color: transparent;
}
input[type=range]::-ms-fill-lower {
    background: #2a6495;
    border: 0.2px solid #010101;
    border-radius: 2.6px;
    box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
}
input[type=range]:focus::-ms-fill-lower {
    background: #3071a9;
}
input[type=range]::-ms-fill-upper {
    background: #3071a9;
    border: 0.2px solid #010101;
    border-radius: 2.6px;
    box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
}
input[type=range]:focus::-ms-fill-upper {
    background: #367ebd;
}
.chat {
    list-style: none;
    background: none;
    margin: 0;
    padding: 0 0 50px 0;
    margin-top: 60px;
    margin-bottom: 10px;
}
.chat li {
    padding: 0.5rem;
    overflow: hidden;
    display: flex;

}
.chat .avatar {
    width: 40px;
    height: 40px;
    position: relative;
    display: block;
    z-index: 2;
    border-radius: 100%;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    -ms-border-radius: 100%;
    background-color: rgba(255,255,255,0.9);
}
.chat .avatar img {
    width: 40px;
    height: 40px;
    border-radius: 100%;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    -ms-border-radius: 100%;
    background-color: rgba(255,255,255,0.9);
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    box-shadow: 1px 2px 1px #D4D4D4;

}
.chat .day {
    position: relative;
    display: block;
    text-align: center;
    color: #c0c0c0;
    height: 20px;
    text-shadow: 7px 0px 0px #e5e5e5, 6px 0px 0px #e5e5e5, 5px 0px 0px #e5e5e5, 4px 0px 0px #e5e5e5, 3px 0px 0px #e5e5e5, 2px 0px 0px #e5e5e5, 1px 0px 0px #e5e5e5, 1px 0px 0px #e5e5e5, 0px 0px 0px #e5e5e5, -1px 0px 0px #e5e5e5, -2px 0px 0px #e5e5e5, -3px 0px 0px #e5e5e5, -4px 0px 0px #e5e5e5, -5px 0px 0px #e5e5e5, -6px 0px 0px #e5e5e5, -7px 0px 0px #e5e5e5;
    box-shadow: inset 20px 0px 0px #e5e5e5, inset -20px 0px 0px #e5e5e5, inset 0px -2px 0px #d7d7d7;
    line-height: 38px;
    margin-top: 5px;
    margin-bottom: 20px;
    cursor: default;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}

.other .msg {
    order: 1;
    border-top-left-radius: 0px;
    box-shadow: 3px 3px 3px #D4D4D4;
    margin-left: 10px;
}


.self {
    justify-content: flex-end;
    align-items: flex-end;
}
.self .msg {
    order: 1;
    border-bottom-right-radius: 0px;
    box-shadow: 3px 3px 3px #D4D4D4;
    margin-right: 10px;
}
.self .avatar {
    order: 2;
}
.msg {
    background: white;
    min-width: 50px;
    padding: 10px;
    border-radius: 2px;
    box-shadow: 1px 2px 1px rgba(0, 0, 0, 0.07);
    border: #cccccc solid 1px;
}
.msg p {
    font-size: 0.8rem;
    margin: 0 0 0.2rem 0;
    color: #777;
}
.msg img {
    position: relative;
    display: block;
    width: 450px;
    border-radius: 5px;
    box-shadow: 0px 0px 3px #eee;
    transition: all .4s cubic-bezier(0.565, -0.260, 0.255, 1.410);
    cursor: default;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}

.relative{
    position: relative;
}

.calendar-position{
    position: absolute;
    top: 10px;
    right: 10px;
}

.icon-previous,
.icon-arrow-left-4,
.icon-arrow-right-4,
.icon-next{
    width: 16px; 
    height: 16px; 
    display: block;

}

.icon-previous{

    background: url("images/left-arrow.png");
}

.icon-arrow-left-4{
    background: url("images/previous.png");

}

.icon-arrow-right-4{
    background: url("images/next.png");
}

.icon-next{

    background: url("images/right-arrow.png");
}

.calendar-header{
    background: #e9b78b!important; 
    border: 2px solid #fff;
    border-radius: 3px;
}

.calendar tbody tr:nth-child(odd){
    background: #fff;
}

.calendar tbody tr:nth-child(even){
    background: #eee;
}

.calendar a{
    color: #000;
}

.calendar .day{
    width: 30px;
    height: 30px;
    border: 1px solid #cdcdcd;
}

#botoncrear{
    background: #632f2f;
    border: none;
    margin: 10px;
    color: #fff;
    font-size: 20px;
}

.fg-white{
    color: #fff !important;
}

.bg-orange{
    background: #632f2f!important;

}

.bg-darkCyan{
    background:#c44d33!important;
}

.bg-darkPink{
    background: 
        #974739!important
}
.bg-lightBlue{
    background: #e9b78b!important;
}

input[type='checkbox'] {
    cursor: pointer;
}

.fg-white .btn-link{
    color:#fff;
    font-weight: 600;
    font-size: 20px;
}

.btn-link{
    cursor:pointer;
}

#accordionExample .card-header:hover, accordionExample .card-header:focus, .card.p-4.shadow.border.pointer:hover{
    background: gray!important;
    -webkit-box-shadow: inset 0px 20px 62px 2px rgba(0,0,0,0.21);
    -moz-box-shadow: inset 0px 20px 62px 2px rgba(0,0,0,0.21);
    box-shadow: inset 0px 20px 62px 2px rgba(0,0,0,0.21);
}

.btn-link:hover, .btn-link:focus, a.danger:hover {
    color: #eee!important;
    text-decoration: none!important;
}

.button{
    border: none;
    background: #c44d33;
    color: #fff;
    font-size: 20px;
}
.button:hover, .button:focus{
    color: #eee!important;
    text-decoration: none!important;
    -webkit-box-shadow: inset 0px 20px 62px 2px rgba(0,0,0,0.21);
    -moz-box-shadow: inset 0px 20px 62px 2px rgba(0,0,0,0.21);
    box-shadow: inset 0px 20px 62px 2px rgba(0,0,0,0.21);
}




.ventana{
    z-index: 1;
}

.window-overlay{
    z-index: 1111;
    position: absolute;
    top:0;
    width: 100%;
    min-height: 100vh;
}

.window{
    background: #eee;
    border-radius: 0.4em;
}

.btn-close{
    width: 24px;
    height: 24px;
    display: block;
    position: absolute;
    right: 5px;
    padding: 0;
    background: url("images/cancel.png");
}

.caption{
    cursor: default;
    padding: 5px;
    background: #dedede;
    -webkit-box-shadow: 0px 2px 5px 1px rgba(194,194,194,0.83);
    -moz-box-shadow: 0px 2px 5px 1px rgba(194,194,194,0.83);
    box-shadow: 0px 2px 5px 1px rgba(194,194,194,0.83);
}

.content{
    padding: 0px!important;
}



#logo img{
    width: 100%;
}

.uppercase{
    text-transform: uppercase;    
}

.msg time {
    font-size: 0.7rem;
    color: #ccc;
    margin-top: 3px;
    float: right;
    cursor: default;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}
.msg time:before{
    content:"\f017";
    color: #ddd;
    font-family: FontAwesome;
    display: inline-block;
    margin-right: 4px;
}

.window.shadow{
    top: 7em!important;
    position: relative!important;
    width: 50%!important;
}

.tabla-rebelde .cabecera{
    background: #000;
    color: #fff;
    padding: 1em;
    text-align: center;

}

.hidden{
    display: none!important;
}



.left{
    float:left;
    padding: 10px

}

.derbarra{
    overflow: hidden;
    vertical-align: middle;
}

.ovfw-hd{
    overflow: hidden;
}

.font-em{
    font-size: .89em;
}

.font-xs{
    font-size: .6rem;
}

.disabled{
    z-index: -1; 
}

table.disabled{
    background: #ddd; 
}

table.disabled input{
    z-index: -1111111111;
    border: #ddd; 
    color: #ddd; 
}

table.disabled i{
    color: #eee;
}

.ipanel{
    background: #003d78; 
    padding: 15px;
    color: #fff;
    text-align: center;
    font-size: 20px;
}

.ipanel .small{
    font-size: 16px;
}

.head{
    background: #eee;
}

.divider{
    background: #ddd;
}

.dataTables_length, .dataTables_info{
    float:left;
}

.dataTables_filter,  .dataTables_paginate {
    float:right;    
}

.dataTables_length select, .dataTables_filter input{
    border-radius: .25rem;
    border: 1px solid #ced4da;
    padding: .375rem .75rem;
}

a.paginate_button {
    background: #ddd;
    padding: .3em;
    color: #fff;
}

a.paginate_button.current {
    background: #2196f3;
    padding: .3em;
    color: #fff;
}


.shadow{
    -webkit-box-shadow: 0px 3px 20px -3px rgba(128,128,128,0.73);
    -moz-box-shadow: 0px 3px 20px -3px rgba(128,128,128,0.73);
    box-shadow: 0px 3px 20px -3px rgba(128,128,128,0.73);
}

.pointer{
    cursor: pointer;
}

.card.p-4.shadow.border.pointer{

}

.card-header .btn-link:focus{
    color: #007bff!important;
}

.img.marco.img-responsive.mb-5{
    max-height: 315px;
}

.cabecera{
    padding: 15px;
    font-size: 20px;
    font-weight: 500;
}

.table.aniview{
    font-size: 20px;
}

.table.aniview i.fa{
    color: #09291e!important;


}

span.d-block.w-100 {
    font-size: 36px;
}

.modal-content.animate.col-lg-4{
    text-align: center;
}

.btn.danger.derbarra{
    margin-top: 20px;
}



/* Small devices (landscape phones, less than 768px)*/
@media and (max-width: 767px) { 
    .btn.danger.derbarra{
        overflow:hidden; 
        display:block;
        width:100%!important;
        position:relative;
    }

    .btn.danger{
        width:100%;
        color:transparent; 
    }

    .btn.danger i{
        color: #fff;

    }

}


.page-wrapper .sidebar-wrapper,
.sidebar-wrapper .sidebar-brand > a,
.sidebar-wrapper .sidebar-dropdown > a:after,
.sidebar-wrapper .sidebar-menu .sidebar-dropdown .sidebar-submenu li a:before,
.sidebar-wrapper ul li a i,
.page-wrapper .page-content,
.sidebar-wrapper .sidebar-search input.search-menu,
.sidebar-wrapper .sidebar-search .input-group-text,
.sidebar-wrapper .sidebar-menu ul li a,
#show-sidebar,
#close-sidebar {
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

/*----------------page-wrapper----------------*/

.page-wrapper {
    height: 100vh;
}

.page-wrapper .theme {
    width: 40px;
    height: 40px;
    display: inline-block;
    border-radius: 4px;
    margin: 2px;
}

.page-wrapper .theme.chiller-theme {
    background: #1e2229;
}

/*----------------toggeled sidebar----------------*/

.page-wrapper.toggled .sidebar-wrapper {
    left: 0px;
}

@media screen and (min-width: 768px) {
    .page-wrapper.toggled .page-content {
        padding-left: 300px;
    }
}
/*----------------show sidebar button----------------*/
#show-sidebar {
    position: fixed;
    left: -1;
    top: 59px;
    border-radius: 0 4px 4px 0px;
    width: 35px;
    transition-delay: 0.3s;
    padding: 10px;
    width:50px
}
.page-wrapper.toggled #show-sidebar {
    left: -40px;
}
/*----------------sidebar-wrapper----------------*/

.sidebar-wrapper {
    width: 260px;
    position: fixed;
    top: 59px;
    left: -300px;
    z-index: 99;

}

.sidebar-wrapper ul {
    list-style-type: none;
    padding: 0;
    margin: 0;
}

.sidebar-wrapper a {
    text-decoration: none;
}

/*----------------sidebar-content----------------*/

.sidebar-content {
    padding:10px;
    width: 260px;
    max-height: calc(100% - 30px);
    height: calc(100% - 30px);
    position: fixed;
    overflow-y: auto;
}



/*--------------------sidebar-brand----------------------*/

.sidebar-wrapper .sidebar-brand {
    padding: 10px 20px;
    display: flex;
    align-items: center;
}

.sidebar-wrapper .sidebar-brand > a {
    text-transform: uppercase;
    font-weight: bold;
    flex-grow: 1;
}

.sidebar-wrapper .sidebar-brand #close-sidebar {
    cursor: pointer;
    font-size: 20px;
}
/*----------------------sidebar-menu-------------------------*/

.sidebar-wrapper .sidebar-menu {
    padding-bottom: 10px;
}

.sidebar-wrapper .sidebar-menu .header-menu span {
    font-weight: bold;
    font-size: 14px;
    padding: 15px 20px 5px 20px;
    display: inline-block;
}

.sidebar-wrapper .sidebar-menu ul li a {
    display: inline-block;
    width: 100%;
    text-decoration: none;
    position: relative;
    padding: 8px 30px 8px 20px;
}

.sidebar-wrapper .sidebar-menu ul li a i {
    margin-right: 10px;
    font-size: 12px;
    width: 30px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    border-radius: 4px;
}

.sidebar-wrapper .sidebar-menu ul li a:hover > i::before {
    display: inline-block;
    animation: swing ease-in-out 0.5s 1 alternate;
}

.sidebar-wrapper .sidebar-menu .sidebar-dropdown > a:after {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f105";
    font-style: normal;
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-align: center;
    background: 0 0;
    position: absolute;
    right: 15px;
    top: 14px;
}

.sidebar-wrapper .sidebar-menu .sidebar-dropdown .sidebar-submenu ul {
    padding: 5px 0;
}

.sidebar-wrapper .sidebar-menu .sidebar-dropdown .sidebar-submenu li {
    padding-left: 25px;
    font-size: 13px;
}

.sidebar-wrapper .sidebar-menu .sidebar-dropdown .sidebar-submenu li a:before {
    content: "\f111";
    font-family: "Font Awesome 5 Free";
    font-weight: 400;
    font-style: normal;
    display: inline-block;
    text-align: center;
    text-decoration: none;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    margin-right: 10px;
    font-size: 8px;
}

.sidebar-wrapper .sidebar-menu ul li a span.label,
.sidebar-wrapper .sidebar-menu ul li a span.badge {
    float: right;
    margin-top: 8px;
    margin-left: 5px;
}

.sidebar-wrapper .sidebar-menu .sidebar-dropdown .sidebar-submenu li a .badge,
.sidebar-wrapper .sidebar-menu .sidebar-dropdown .sidebar-submenu li a .label {
    float: right;
    margin-top: 0px;
}

.sidebar-wrapper .sidebar-menu .sidebar-submenu {
    display: none;
}

.sidebar-wrapper .sidebar-menu .sidebar-dropdown.active > a:after {
    transform: rotate(90deg);
    right: 17px;
}

/*--------------------------side-footer------------------------------*/


/*--------------------------page-content-----------------------------*/

.page-wrapper .page-content {
    display: inline-block;
    width: 100%;
    padding-left: 35px;
    padding-top: 10px;
}

.page-wrapper .page-content > div {
    padding: 10px 10px;
}

.page-wrapper .page-content {
    overflow-x: hidden;
}

/*------scroll bar---------------------*/

::-webkit-scrollbar {
    width: 13px;
    height: 7px;
}
::-webkit-scrollbar-button {
    width: 0px;
    height: 0px;
}
::-webkit-scrollbar-thumb {
    background: #8f96a2;
    border: 0px none #ffffff;
    border-radius: 0px;
}
::-webkit-scrollbar-thumb:hover {
    background: #606671;
}
::-webkit-scrollbar-thumb:active {
    background: #525965;
}
::-webkit-scrollbar-track {
    background: transparent;
    border: 0px none #ffffff;
    border-radius: 50px;
}
::-webkit-scrollbar-track:hover {
    background: transparent;
}
::-webkit-scrollbar-track:active {
    background: transparent;
}
::-webkit-scrollbar-corner {
    background: transparent;
}


/*-----------------------------chiller-theme-------------------------------------------------*/

.chiller-theme .sidebar-wrapper {
    background: #31353D;
}

.chiller-theme .sidebar-wrapper .sidebar-header,
.chiller-theme .sidebar-wrapper .sidebar-search,
.chiller-theme .sidebar-wrapper .sidebar-menu {
    border-top: 1px solid #3a3f48;
}

.chiller-theme .sidebar-wrapper .sidebar-search input.search-menu,
.chiller-theme .sidebar-wrapper .sidebar-search .input-group-text {
    border-color: transparent;
    box-shadow: none;
}

.chiller-theme .sidebar-wrapper .sidebar-header .user-info .user-role,
.chiller-theme .sidebar-wrapper .sidebar-header .user-info .user-status,
.chiller-theme .sidebar-wrapper .sidebar-search input.search-menu,
.chiller-theme .sidebar-wrapper .sidebar-search .input-group-text,
.chiller-theme .sidebar-wrapper .sidebar-brand>a,
.chiller-theme .sidebar-wrapper .sidebar-menu ul li a,
.chiller-theme .sidebar-footer>a {
    color: #818896;
}

.chiller-theme .sidebar-wrapper .sidebar-menu ul li:hover>a,
.chiller-theme .sidebar-wrapper .sidebar-menu .sidebar-dropdown.active>a,
.chiller-theme .sidebar-wrapper .sidebar-header .user-info,
.chiller-theme .sidebar-wrapper .sidebar-brand>a:hover,
.chiller-theme .sidebar-footer>a:hover i {
    color: #b8bfce;
}

.page-wrapper.chiller-theme.toggled #close-sidebar {
    color: #bdbdbd;
}

.page-wrapper.chiller-theme.toggled #close-sidebar:hover {
    color: #ffffff;
}

.chiller-theme .sidebar-wrapper ul li:hover a i,
.chiller-theme .sidebar-wrapper .sidebar-dropdown .sidebar-submenu li a:hover:before,
.chiller-theme .sidebar-wrapper .sidebar-search input.search-menu:focus+span,
.chiller-theme .sidebar-wrapper .sidebar-menu .sidebar-dropdown.active a i {
    color: #16c7ff;
    text-shadow:0px 0px 10px rgba(22, 199, 255, 0.5);
}

.chiller-theme .sidebar-wrapper .sidebar-menu ul li a i,
.chiller-theme .sidebar-wrapper .sidebar-menu .sidebar-dropdown div,
.chiller-theme .sidebar-wrapper .sidebar-search input.search-menu,
.chiller-theme .sidebar-wrapper .sidebar-search .input-group-text {
    background: #3a3f48;
}

.chiller-theme .sidebar-wrapper .sidebar-menu .header-menu span {
    color: #6c7b88;
}

.chiller-theme .sidebar-footer {
    background: #3a3f48;
    box-shadow: 0px -1px 5px #282c33;
    border-top: 1px solid #464a52;
}

.chiller-theme .sidebar-footer>a:first-child {
    border-left: none;
}

.chiller-theme .sidebar-footer>a:last-child {
    border-right: none;
}
.hpanelpcontent{
    height: 250px;
}
.m-1{
    margin: 5px !important;
}
.m-2{
    margin: 10px !important;
}
.right{
    float:right !important;
}
.p-1{
    padding:5px!important;
}
.p-2{
    padding:10px!important;
}
.p-3{
    padding:15px!important;
}