/* Variable css */
:root {
    --color-main: #3487C9;
    --color-main-dark: #1B263B;
    --color-main-darker: #0D1B2A;
    --color-main-light: #C9DAEA;
    --color-green: #1B998B;
    --color-body: #fafafa;
    --color-secondary: #4B98DC;
    --color-sucess: #38b87c;
    --color-warning: #ffca27;
    --color-danger: #E91D63;
    --color-white: #FFFFFF;
    --color-grey: #656565;
    --color-black: rgb(0, 0, 0);

    --box-shadow: #a1a1a1 0px -1px 20px 4px;
    --box-shadow-container: 0px 1px 20px 0px rgba(0, 0, 0, 0.06);
}

/* Reset CSS */
body {
    font: 16px 'Roboto', sans-serif;
    margin: 0;
    background: var(--color-body);
}

* {
    box-sizing: border-box;
}

.--is-underline {
    text-decoration: underline;
}

.pb-3 {
    padding-bottom: 3rem;
}

.text-center {
    text-align: center;
}

.message-body {
    text-align: left !important;
}

.block-content {
    height: auto;
    min-height: 100%;
    margin-bottom: 0;
    background-color: rgb(250, 250, 250);
}

.illustration-websites {
    display: block;
    width: 12rem;
    margin: 0 auto 1.5rem;
}

.text-left {
    text-align: left !important;
}

/*
        Home page - Menu
*/

.button.is-light {
    background-color: var(--color-main);
    color: var(--color-white);
}

.button.is-logout {
    background-color: var(--color-main-light);
    color: var(--color-main-darker);
}

.button.is-logout:hover {
    background-color: var(--color-danger);
    color: var(--color-white);
}

.navbar {
    box-shadow: var(--box-shadow);
}

a.navbar-item {
    font-size: 1.3rem;
}

body > nav > div.navbar-brand > a.navbar-item {
    color: var(--color-main-dark);
}

.navbar-start .navbar-item {
    text-align: right;
}

.navbar-item ul li {
    list-style: none;
    display: inline;
    padding: 1.1rem 0;
}

.navbar-item ul li a {
    color: var(--color-black);
    padding: 1.1rem;
    font-weight: bold;
}



.item-admin a:hover {
    background-color: var(--color-main-dark);
    color: white;
    transition: 0.5s ease;

}




.item-doctor-space a:hover {
    background-color: var(--color-main);
    color: white;
    transition: 0.5s ease;
}


.item-log_out a:hover {
    background-color: var(--color-danger);
    color: white;
    transition: 0.5s ease;

}

.admin-btn {
    background-color: #223962;
    color: #fafafa !important;
    border: none !important;
}

.space {
    background-color: transparent;
}

.breadcrumb a {
    color: var(--color-black) !important;
}

.breadcrumb {
    display: flex;
}

.breadcrumb-trail {
    font-style: normal;
    color: var(--color-black);
}

a.breadcrumb-trail {
    padding: 0 3px;
}

/* Home page - Banner */

.bloc-banner {
    height: 70vh;
    /* background-color: rgb(177, 177, 177); */
    background-position: center;
    background-size: cover;
    position: relative;
}

.bloc-banner > .container {
    padding-top: 8%;
    text-align: center;
}

.bloc-banner > .container > h1 {
    text-shadow: 1rem 1rem 8rem black;
    color: var(--color-white);
}

div.bloc-banner > div > div.control.block-search {
    display: flex;
}

div.control.block-search a.button.btn-search.is-medium {
    border: none !important;
    border-radius: 0 8px 8px 0;
    margin-right: 5px;
    cursor: default;
}

#search-bar {
    border: none !important;
    box-shadow: none !important;
    border-radius: 8px 0 0 8px;
    margin-left: 5px;
    padding-left: 1.5rem;
}

#searchComponent {
    position: relative;
}

#autocomplete {
    position: absolute;
    width: 99%;
    top: 100%;
    left: 0;
    height: auto;
    max-height: 260px;
    overflow-y: scroll;
    background: white;
    z-index: 2;
    border-radius: 7px;
    border-top: 2px solid rgba(0, 0, 0, 0.05);
    transform: translateX(.5%);
    box-shadow: 0 13px 20px 0 rgba(0, 0, 0, 0.46);
}

#autocomplete > ul > li {
    padding: 1rem 1.5rem;
    font-weight: bold;
    border-bottom: 2px solid rgba(0, 0, 0, 0.05);
}

#autocomplete > ul > li:hover, #autocomplete > ul > .selected {
    background-color: var(--color-secondary);
}

#autocomplete > ul > li:hover a, #autocomplete > ul > .selected > a {
    color: white;
}


#autocomplete > ul > li > a {
    color: var(--color-main);
}

.block-content > .container {
    margin-bottom: 1rem;
}

.block-content .container:nth-child(3) {
    margin-bottom: 8rem;
    min-height: 510px;
}

.navbar-start {
    display: none;
}

.navbar-start div.buttons {
    display: flex;
    justify-content: flex-end;
}

.container > .block-speciality {
    margin: 15px 5px;
    background-color: var(--color-secondary);
    color: var(--color-white);
    border-radius: 8px;
    line-height: 45px;
    padding: 0 1.5rem;
    text-align: left;
    position: relative;
}

.block-speciality > .control {
    display: inline-block;
    padding-left: 1rem;
}

.navbar-burger-treatment {
    color: rgb(74, 74, 74);
    cursor: pointer;
    height: 2.9rem;
    width: 3.25rem;
    margin-left: auto;
    float: right;
    position: absolute;
    top: 0;
    right: 1rem;
    display: none;
}

.navbar-burger-treatment:hover {
    background-color: rgba(0, 0, 0, 0.05);
}

.navbar-burger-treatment span:nth-child(1) {
    top: calc(50% - 6px);
}

.navbar-burger-treatment.is-active span:nth-child(1) {
    transform: translateY(5px) rotate(45deg);
}

.navbar-burger-treatment.is-active span:nth-child(2) {
    opacity: 0;
}

.navbar-burger-treatment.is-active span:nth-child(3) {
    transform: translateY(-5px) rotate(-45deg);
}

.navbar-burger-treatment span:nth-child(2) {
    top: calc(50% - 1px);
}

.navbar-burger-treatment span:nth-child(3) {
    top: calc(50% + 4px);
}

.navbar-burger-treatment span {
    background-color: currentColor;
    display: block;
    height: 1px;
    left: calc(50% - 8px);
    position: absolute;
    -webkit-transform-origin: center;
    transform-origin: center;
    transition-duration: 86ms;
    transition-property: background-color, opacity, transform, -webkit-transform;
    transition-timing-function: ease-out;
    width: 16px;
}

.block-speciality .--treatment {
    padding: 0 .35rem;
}

div.block-speciality input[type="checkbox"] {
    font-size: xx-large;
}

div.block-speciality > div > label {
    margin: 0 20px;
}

body > div.container[role="main"] {
    padding: 10rem 1rem 3rem;
}

.-mr-2 {
    margin-right: 2%;
}

.nav-pagination {
    width: 100%;
}

.nav-pagination nav.pagination {
    width: 40%;
    min-width: 230px;
}

.--marg-auto {
    margin: auto;
}

.--tag-pagination {
    order: 2;
}

.block-search > #searchComponent {
    display: contents;
}

.content-left {
    display: inline-block;
    width: 90%;
}

.center {
    text-align: center;
}

.--marg-left-2 {
    margin-left: 2rem;
}

.result-not-found {
    color: var(--color-grey);
    font-weight: bold;
    font-size: 1.2rem;
}

.result-not-found > span {
    color: var(--color-main);
}

.img-empty {
    padding-top: 1.5rem;
    display: block;
    width: 15rem;
    margin: 0 auto;
}

a.pagination-link.is-current {
    background-color: var(--color-main) !important;
    border-color: var(--color-main) !important;
    color: var(--color-white) !important;
}

hr.separator {
    height: 1px;
    margin: 1rem 0;
    background-color: rgba(0, 0, 0, 0.253);
}

.legal-mentions-box {
    padding: 4.25rem 6.25rem !important;
}

.legal-mentions-box a {
    color: black;
    text-decoration: underline;
}

.legal-mentions-box ul {
    list-style: initial;
    padding: .25rem;
}

.button.is-light:hover {
    background-color: #2a75b1;
    color: var(--color-white)
}

.legal-mentions-box ul li {
    margin-left: 1.5rem;
    padding: .25rem 1rem;
    display: list-item;
}

.footer {
    background-color: var(--color-main-dark);
    padding: 2rem 1.5rem 2rem;
    box-shadow: #e8e8e8 0 -1px 20px 4px;
    color: var(--color-white);
}

.error-left-part {
    display: flex;
    align-items: center;
    justify-content: center;
}

.error-right-part {
    display: flex;
    min-height: 100vh;
    justify-content: center;
    align-items: center;
}

.error-title {
    font-size: 8rem;
    font-weight: 800;
    color: var(--color-main);
    text-align: center;
}

.error-text-1 {
    font-size: 3rem;
    text-align: center;
    font-weight: 500;
}

.error-text-2 {
    font-size: 2rem;
    text-align: center;
}

.error-text-3 {
    font-size: 1.5rem;
    padding-top: 3rem;
    text-align: center;
}

.error-link {
    color: var(--color-main);
    font-weight: 600;
}

footer .title {
    color: var(--color-white);
}

footer .baseline {
    color: var(--color-white);
    font-weight: 300;
    padding-top: .5rem;
    font-size: .9rem;
}

footer .footer-link {
    color: var(--color-white);
}

footer .footer-link:hover {
    color: var(--color-white);
    text-decoration: underline;
}

.left-col {
    position: relative;
}

.bottom-col {
    position: absolute;
    bottom: 1.3rem;
}

footer > div:last-child {
    border-top: 2px solid rgba(255, 255, 255, 0.17);
    padding-top: 1rem;
}

footer .title > span {
    font-weight: lighter;
}

footer ul {
    list-style: none !important;
    display: inline;
    text-align: left;
}

footer ul li {
    margin: .6rem 4%;
}

footer ul li a {
    color: var(--color-white);
}

footer ul li a:hover {
    color: var(--color-white);
    text-decoration: underline;
}