/* ==========================================================================
   NORMALIZE: normalize.css v4.1.1 | MIT License | git.io/normalize
   ========================================================================== */

progress,sub,sup{vertical-align:baseline}button,hr,input{overflow:visible}[type=checkbox],[type=radio],legend{box-sizing:border-box;padding:0}html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background-color:transparent;-webkit-text-decoration-skip:objects}a:active,a:hover{outline-width:0}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:bolder}dfn{font-style:italic}h1{font-size:2em;margin:.67em 0}mark{background-color:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}svg:not(:root){overflow:hidden}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}figure{margin:1em 40px}hr{box-sizing:content-box;height:0}button,input,select,textarea{font:inherit;margin:0}optgroup{font-weight:700}button,select{text-transform:none}[type=reset],[type=submit],button,html [type=button]{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:ButtonText dotted 1px}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{color:inherit;display:table;max-width:100%;white-space:normal}textarea{overflow:auto}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-input-placeholder{color:inherit;opacity:.54}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}

/* ==========================================================================
   BASE
   ========================================================================== */

* {margin: 0; padding: 0;}
*, *:before, *:after {-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;}
a {cursor: pointer; outline: none; transition: all 0.2s ease-in-out;}
a:focus {outline: none;}
fieldset {border: 0; margin: 0; padding: 0;}
textarea {resize: vertical;}
input, select {outline: 0;}
input::-moz-focus-inner {border: 0; outline:0;}

::selection {background: #0f0f0f; color: #fff;}
::-moz-selection {background: #0f0f0f; color: #fff;}
::-webkit-selection {background: #0f0f0f; color: #fff;}

html {width: 100%; height: 100%;}
body {font-family: 'Open Sans', sans-serif; background: #e7e7e7; font-size: 100%; text-align: center; color: #1f1a17; height: 100%;}

/* =============== CONTAINER =============== */

.container {width: 100%;}
.brand {width: 100%; margin: 0 0 50px 0; background: #fff; padding: 25px;}
.brand img {max-width: 202px; width: 100%; height: auto;}
.cita-previa {max-width: 700px; width: 100%; height: auto;}
.admin {width: 100%;}
.entrar {width: 100%; text-align: center; margin: 0px;}
.entrar .entrar-buttons {display: flex; justify-content: center; flex-wrap: wrap;}
.entrar .entrar-buttons a {display: flex; align-items: center; border-radius: 10px;}
.entrar a, .option a {display: inline-block; background: #5e667d; padding: 20px 25px; width: 280px; color: #fff; text-transform: uppercase; text-decoration: none; font-size: 2em; font-weight: 800; margin: 5px 15px; border-radius: 10px;}
.option a {font-size: 1.5em; margin: 10px; font-weight: normal;}
.entrar a:hover, .option a:hover {background: #00182a;}
.info-text {max-width: 700px; width: 90%; margin: 50px auto 10px auto; font-size: .9em;}
.container .info-text:last-child {margin: 15px auto 10px auto;}
.entrarTitle {margin: 0 0 20px 0; font-size: 1.5em;}
.bookTitle {margin: 20px 0 10px 0; font-size: 1.5em}
.checkApp {display: nonde;}
.identifier {padding: 10px; text-align: center;font-size: 1.3em; margin: 10px; min-width: 270px; border-radius: 10px; border: 0;}
.option {display: none; padding: 10px;}
#find {margin-top: 20px;}
#find button {display: inline-block; width: auto; font-size: 1.5em; font-weight: 800; margin: 5px 0px; border-color: #395c78; color: #fff; background-color: #395c78; border-radius: 0px; padding: 10px 20px; border: 0; border-radius: 10px;}
#find button:hover {background: #00182a;}

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */

@media screen and (max-height: 730px) {
.brand {margin: 0 0 20px 0; padding: 10px;}
.brand img {max-width: 150px;}
.cita-previa {max-width: 500px;}
.entrar a, .option a {padding: 10px; width: 200px; font-size: 1.5em; margin: 10px;}
.identifier {padding: 5px; margin: 10px;}
.info-text {margin: 25px auto 10px auto;}
#find {margin: 0px;}
    .modal-find-appointment #resultContainer div button { top: 50px!important;}
}

@media screen and (max-width: 800px) {
.option {padding: 0px;}
.entrar a, .option a {padding: 10px; width: 200px; font-size: 1.5em; margin: 10px;}
.info-text {margin: 25px auto 10px auto;}
#find {margin: 0px;}
}

/* ==========================================================================
   FONTS
   ========================================================================== */

@font-face {
    font-family: 'Open Sans';
    font-weight: 400;
    font-style: normal;
    src: url('../../fonts/Open-Sans-regular/Open-Sans-regular.eot');
    src: url('../../fonts/Open-Sans-regular/Open-Sans-regular.eot?#iefix') format('embedded-opentype'),
        local('Open Sans'),
        local('Open-Sans-regular'),
        url('../../fonts/Open-Sans-regular/Open-Sans-regular.woff2') format('woff2'),
        url('../../fonts/Open-Sans-regular/Open-Sans-regular.woff') format('woff'),
        url('../../fonts/Open-Sans-regular/Open-Sans-regular.ttf') format('truetype'),
        url('../../fonts/Open-Sans-regular/Open-Sans-regular.svg#OpenSans') format('svg');
}

@font-face {
    font-family: 'Open Sans';
    font-weight: 600;
    font-style: normal;
    src: url('../../fonts/Open-Sans-600/Open-Sans-600.eot');
    src: url('../../fonts/Open-Sans-600/Open-Sans-600.eot?#iefix') format('embedded-opentype'),
        local('Open Sans Semibold'),
        local('Open-Sans-600'),
        url('../../fonts/Open-Sans-600/Open-Sans-600.woff2') format('woff2'),
        url('../../fonts/Open-Sans-600/Open-Sans-600.woff') format('woff'),
        url('../../fonts/Open-Sans-600/Open-Sans-600.ttf') format('truetype'),
        url('../../fonts/Open-Sans-600/Open-Sans-600.svg#OpenSans') format('svg');
}

@font-face {
    font-family: 'Open Sans';
    font-weight: 800;
    font-style: normal;
    src: url('../../fonts/Open-Sans-800/Open-Sans-800.eot');
    src: url('../../fonts/Open-Sans-800/Open-Sans-800.eot?#iefix') format('embedded-opentype'),
        local('Open Sans Extrabold'),
        local('Open-Sans-800'),
        url('../../fonts/Open-Sans-800/Open-Sans-800.woff2') format('woff2'),
        url('../../fonts/Open-Sans-800/Open-Sans-800.woff') format('woff'),
        url('../../fonts/Open-Sans-800/Open-Sans-800.ttf') format('truetype'),
        url('../../fonts/Open-Sans-800/Open-Sans-800.svg#OpenSans') format('svg');
}

@font-face {
    font-family: 'Open Sans';
    font-weight: 400;
    font-style: italic;
    src: url('../../fonts/Open-Sans-italic/Open-Sans-italic.eot');
    src: url('../../fonts/Open-Sans-italic/Open-Sans-italic.eot?#iefix') format('embedded-opentype'),
        local('Open Sans Italic'),
        local('Open-Sans-italic'),
        url('../../fonts/Open-Sans-italic/Open-Sans-italic.woff2') format('woff2'),
        url('../../fonts/Open-Sans-italic/Open-Sans-italic.woff') format('woff'),
        url('../../fonts/Open-Sans-italic/Open-Sans-italic.ttf') format('truetype'),
        url('../../fonts/Open-Sans-italic/Open-Sans-italic.svg#OpenSans') format('svg');
}

@font-face {
    font-family: 'Open Sans';
    font-weight: 600;
    font-style: italic;
    src: url('../../fonts/Open-Sans-600italic/Open-Sans-600italic.eot');
    src: url('../../fonts/Open-Sans-600italic/Open-Sans-600italic.eot?#iefix') format('embedded-opentype'),
        local('Open Sans Semibold Italic'),
        local('Open-Sans-600italic'),
        url('../../fonts/Open-Sans-600italic/Open-Sans-600italic.woff2') format('woff2'),
        url('../../fonts/Open-Sans-600italic/Open-Sans-600italic.woff') format('woff'),
        url('../../fonts/Open-Sans-600italic/Open-Sans-600italic.ttf') format('truetype'),
        url('../../fonts/Open-Sans-600italic/Open-Sans-600italic.svg#OpenSans') format('svg');
}

@font-face {
    font-family: 'Open Sans';
    font-weight: 800;
    font-style: italic;
    src: url('../../fonts/Open-Sans-800italic/Open-Sans-800italic.eot');
    src: url('../../fonts/Open-Sans-800italic/Open-Sans-800italic.eot?#iefix') format('embedded-opentype'),
        local('Open Sans Extrabold Italic'),
        local('Open-Sans-800italic'),
        url('../../fonts/Open-Sans-800italic/Open-Sans-800italic.woff2') format('woff2'),
        url('../../fonts/Open-Sans-800italic/Open-Sans-800italic.woff') format('woff'),
        url('../../fonts/Open-Sans-800italic/Open-Sans-800italic.ttf') format('truetype'),
        url('../../fonts/Open-Sans-800italic/Open-Sans-800italic.svg#OpenSans') format('svg');
}

/* =============== LOADING + MODAL =============== */

#myLoading #image-loading {z-index: 999999999; position: absolute; left: 50%; top: 50%; width: 128px; height: 128px; margin-top: -64px; margin-left: -64px; background: url(../../../style/governalia/img/loading.gif) no-repeat 0 0;}
#myLoading {z-index: 9010; background: url(../../../style/governalia/img/loading-bg.png) repeat 0 0; top: 0; left: 0; overflow: hidden; position: absolute; width: 100%; height: 100%; display: none;}

.modal {position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 1050; outline: 0;}
.modal-find-appointment {display: none;}
.modal-cancel-appointment {display: none;}

/* =============== SEARCH APPOINTMENT =============== */

.modal-content {text-align: left;position: fixed;top: 50%;left: 50%;transform: translate(-50%, -50%);max-width: 100%;background-color: #fff;border-radius: 4px;}
.modal-find-appointment .modal-content {width: 600px}
.modal-cancel-appointment .modal-content {width: 350px;border: 1px solid #000;}
.modal-content .modal-header, .modal-content .modal-footer {padding: 15px !important;}
.modal-find-appointment h4.modal-header-title {font-size: 1.2em; font-weight: bold; background: #000; padding: 10px; color: #fff; border-radius: 4px; text-align: center; text-transform: uppercase;}
.modal-cancel-appointment h4.modal-header-title {font-size: 0.8em; font-weight: bold; background: #000; padding: 10px; color: #fff; border-radius: 4px; text-align: center; text-transform: uppercase;}
.modal-find-appointment .modal-find-appointment-label {display: block; width: 100%; text-align: left;}
.modal-find-appointment #searchId {margin: 10px 0 0 0;}
.modal-find-appointment #resultContainer, .modal-cancel-appointment #resultContainer {max-height: 400px; overflow: auto;}
.modal-find-appointment #resultContainer div, .modal-cancel-appointment #resultContainer div {border: 1px solid #E4E4E4; border-radius: 4px; padding: 15px; margin: 0 0 15px 0; position: relative;}
.modal-find-appointment #resultContainer .app-not-found {color:#FF0000; margin-top: 20px;}
.modal-find-appointment #resultContainer .resultApp {border-style: solid;}
.modal-find-appointment #resultContainer div:first-child {margin: 15px 0 15px 0;}
.modal-find-appointment #resultContainer div:last-child {margin: 0px 0 0px 0;}
.modal-find-appointment #resultContainer div h3, .modal-cancel-appointment #resultContainer div h3 {margin: 0 0 10px 0; padding: 0 0 10px 0; font-size: .9em; font-weight: bold; border-bottom: 1px solid #E4E4E4;}
.modal-find-appointment #resultContainer div h4, .modal-cancel-appointment #resultContainer div h4 {font-weight: bold; position: absolute; font-size: 12px; top: 12px; right: 15px; margin: 0; padding: 3px 5px; border-radius: 4px; float: none !important;}
.modal-find-appointment #resultContainer div h4.searched-app-pending {color: #fff; background: #0000ff;float: right;}
.modal-find-appointment #resultContainer div h4.searched-app-done {color: #fff; background: #008000;}
.modal-find-appointment #resultContainer div h4.searched-app-cancelled {color: #000; background: #e6e941;}
.modal-find-appointment #resultContainer div h4.searched-app-error {color: #fff; background: #bd1d1d;}
.modal-find-appointment #resultContainer div p {margin: 0 0 5px 0; font-size: .9em; max-width: 65%;}
.modal-find-appointment #resultContainer div button {position: absolute; top: 80px; right: 15px; background: #fff; font-size: .8em; padding: 8px 12px; border-radius: 4px; color: #000; border: 2px solid #000; font-weight: bold;}
.modal-find-appointment #resultContainer div button:hover {background: #000; color: #fff}
.modal-find-appointment .modal-footer button {background: #43B23C; font-size: 1em; padding: 8px 12px; border-radius: 4px; color: #fff; border: 0;}
.modal-cancel-appointment .modal-footer button {background: #43B23C; margin: 10px; font-size: 1em; padding: 9px 25px; border-radius: 4px; color: #fff; border: 0;}
.modal-footer button:hover {background: #1280C3;}
.modal-footer {text-align: center; border-top: 1px solid #e5e5e5;}
.modal-footer .cancelled-app-error {text-align: right; color:#FF0000; margin: 20px 0px;}
.modal-cancel-appointment .locator {float: left; padding: 8px 12px;}
.pointer:hover, .close:hover {cursor: pointer;}