@font-face { font-family:'Open Sans'; font-style:normal; font-weight:300; src:url('../fonts/open-sans/OpenSans-Light.ttf') }
@font-face { font-family:'Open Sans'; font-style:normal; font-weight:400; src:url('../fonts/open-sans/OpenSans-Regular.ttf') }
@font-face { font-family:'Open Sans'; font-style:normal; font-weight:600; src:url('../fonts/open-sans/OpenSans-SemiBold.ttf') }
@font-face { font-family:'Open Sans'; font-style:normal; font-weight:700; src:url('../fonts/open-sans/OpenSans-Bold.ttf') }
@font-face { font-family:'Open Sans'; font-style:normal; font-weight:800; src:url('../fonts/open-sans/OpenSans-ExtraBold.ttf') }

@font-face { font-family:'Roboto'; font-style:normal; font-weight:300; src:url('../fonts/Roboto/Roboto-Light.ttf') }
@font-face { font-family:'Roboto'; font-style:normal; font-weight:400; src:url('../fonts/Roboto/Roboto-Regular.ttf') }
@font-face { font-family:'Roboto'; font-style:normal; font-weight:600; src:url('../fonts/Roboto/Roboto-SemiBold.ttf') }
@font-face { font-family:'Roboto'; font-style:normal; font-weight:700; src:url('../fonts/Roboto/Roboto-Bold.ttf') }
@font-face { font-family:'Roboto'; font-style:normal; font-weight:800; src:url('../fonts/Roboto/Roboto-ExtraBold.ttf') }

*::before,
*::after { -webkit-box-sizing:border-box; box-sizing:border-box }
@-ms-viewport { width:device-width }

@keyframes loading {
    0% { transform:rotate(0deg); -moz-transform:rotate(0deg); -ms-transform:rotate(0deg); -o-transform:rotate(0deg); -webkit-transform:rotate(0deg); background:#003C66 }
    50% { transform:rotate(180deg); -moz-transform:rotate(180deg); -ms-transform:rotate(180deg); -o-transform:rotate(180deg); -webkit-transform:rotate(180deg); background:#0074C8 }
    100% { transform:rotate(360deg); -moz-transform:rotate(360deg); -ms-transform:rotate(360deg); -o-transform:rotate(360deg); -webkit-transform:rotate(360deg); background:#003C66 }
}
@keyframes loading_after {
    0% { border-top:10px solid #0074C8; border-bottom:10px solid #0074C8 }
    50% { border-top:10px solid #003C66; border-bottom:10px solid #003C66 }
    100% { border-top:10px solid #0074C8; border-bottom:10px solid #0074C8 }
}

/*-------------------------------------------------*/
/*--------------------GENERICO---------------------*/
/*-------------------------------------------------*/

/* Contenido */

html { line-height:1.15; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; -ms-overflow-style:scrollbar; -webkit-tap-highlight-color:rgba(0, 0, 0, 0) }
body { background-color:#EFF3F5; font-family:'Open Sans', sans-serif; font-size:0.8rem; padding-top:0 }

.jumbotron.content { background-color:#FFF; border:1px solid #E7E7E7; border-radius:2px; box-shadow:0 2px 2px #E7E7E7; color:#004880; margin:0 0 15px 0; padding:10px 20px }

footer,
header > .container,
section > .container,
section > .container-xl { display:none }

body.th-light,
body.th-dark { font-family:'Roboto', sans-serif; font-size:0.9rem; padding-top:0 }

body.th-light { background-color:#ebf0f1!important }
body.th-light .bg-surface { background-color:#fafbfc!important; border-radius:.75em; color:#465f65!important }

body.th-dark { background-color:#252627!important }
body.th-dark .bg-surface { background-color:#313334!important; border-radius:.75em; color:#f2f2f2!important }

section .bg-imed { background-color:#0078c9!important; color:#ffffff!important }
section .bg-imed label { font-size:1.25em }
section .bg-imed label > a { color:#ffffff!important }

section .parametros { align-items:center; cursor:pointer; display:flex }

section .parametros p > span:first-of-type { font-size:1.2em; font-weight:600 }
section .parametros p > span:last-of-type { font-size:1.1em }

section .parametros i.fa-circle { color:#0078c9!important }
section .parametros i.fa-phone { color:#ffffff!important }

h1, h2, h3, h4, h5, h6 { font-weight:600; margin-bottom:.5em; margin-top:.75em }

@media screen and  (min-width:1400px) {
    .container, .container-lg, .container-md, .container-sm, .container-xl { max-width:1320px }
}
@media screen and (max-width:767px) {
    body { font-size:.95em }

    h1, h2, h3, h4, h5, h6 { font-weight:500; margin-bottom:.5em; margin-top:.75em }
    h1 { font-size:1.75em }
    h2 { font-size:1.5em }
    h3 { font-size:1.35em }
    h5 { font-size:1.25em }
}

/* Footer */

footer { display:block; margin-top:50px; width:100%; z-index:100 }
footer .container { margin-left:auto; margin-right:auto; padding-left:15px; padding-right:15px }
footer .bottom { background:#0078C9; color:#fff; font-size:13px; font-weight:400 }
footer .bottom p { margin:20px 0 }

/* Navbar */

.navbar-brand { font-size:1rem; padding-bottom:.75rem; padding-top:.75rem }
.navbar .navbar-toggler { right:1rem; top:.75rem }
.navbar .form-control { border-radius:0; border-width:0; padding:.75rem 1rem }

.form-control-dark { background-color:rgba(255, 255, 255, .1); border-color:rgba(255, 255, 255, .1); color:#fff }
.form-control-dark:focus { border-color:transparent; box-shadow:0 0 0 3px rgba(255, 255, 255, .25) }

.navbar .nav-item a { font-size:.9rem; font-weight:600; margin-right:10px }
.navbar .nav-item a span { letter-spacing:1px; font-weight:500 }

/* Cargando Pagina */

.cargandoPag { background:#f2f2f2 url(../imgs/LogoImed_Peq.png) no-repeat center; height:100%; position:absolute; opacity:1; width:100%; z-index:99999 }
#loading {
    animation:loading 1.5s infinite linear;
    -moz-animation:loading 1.5s infinite linear;
    -o-animation:loading 1.5s infinite linear;
    -webkit-animation:loading 1.5s infinite linear;
    background:#003c66;
    border-radius:50px;
    position:relative;
    height:25px;
    left:49%;
    top:58%;
    width:25px;
}
#loading:after {
    animation:loading_after 1.5s infinite linear;
    -moz-animation:loading_after 1.5s infinite linear;
    -o-animation:loading_after 1.5s infinite linear;
    -webkit-animation:loading_after 1.5s infinite linear;
    border-top:10px solid #0074c8;
    border-bottom:10px solid #0074c8;
    border-left:10px solid transparent;
    border-right:10px solid transparent;
    border-radius :50px;
    content:'';
    position:absolute;
    height:55px;
    left:-15px;
    top:-15px;
    width:55px;
}

@media all and (max-device-width:992px) and (orientation:portrait){
    #loading { top:62% }
}
@media all and (max-device-width:992px) and (orientation:landscape){
    #loading {top:70% }
}

/*-------------------------------------------------*/
/*--------------------CONTENIDO--------------------*/
/*-------------------------------------------------*/

/*Index*/

.table { font-size:.9em!important }
.table td, .table th { padding:.5rem!important }

#protecciondatos { margin-bottom:20px }
#protecciondatos thead { background:#0078C9; color:#ffffff }
#protecciondatos tr th { border:2px solid #0078C9; padding:10px }
#protecciondatos tr td { border:1px solid #333; padding:10px }

#grabacion > li::marker { font-size:1.25em; font-weight:600 }