/*----------COLORS---------*/
:root {
    --blue-color: #72c5db;
    --red-color: #d82323;
    --green-color: #79c67e;
    --yellow-color: #ffc107;
    --dark-gray-color: #757679;
    --medium-gray-color: #999999;
    --light-gray-color: #cccccc;
}

/*-------------------------*/

/*----------FONTS---------*/
@font-face {
    font-family: 'Montserrat';
    src: url('../fonts/Montserrat/Montserrat-Black.otf') format('opentype'),
        url('../fonts/Montserrat/Montserrat-BlackItalic.otf') format('opentype'),
        url('../fonts/Montserrat/Montserrat-Bold.otf') format('opentype'),
        url('../fonts/Montserrat/Montserrat-BoldItalic.otf') format('opentype'),
        url('../fonts/Montserrat/Montserrat-ExtraBold.otf') format('opentype'),
        url('../fonts/Montserrat/Montserrat-ExtraBoldItalic.otf') format('opentype'),
        url('../fonts/Montserrat/Montserrat-ExtraLight.otf') format('opentype'),
        url('../fonts/Montserrat/Montserrat-ExtraLightItalic.otf') format('opentype'),
        url('../fonts/Montserrat/Montserrat-Italic.otf') format('opentype'),
        url('../fonts/Montserrat/Montserrat-Light.otf') format('opentype'),
        url('../fonts/Montserrat/Montserrat-LightItalic.otf') format('opentype'),
        url('../fonts/Montserrat/Montserrat-Medium.otf') format('opentype'),
        url('../fonts/Montserrat/Montserrat-MediumItalic.otf') format('opentype'),
        url('../fonts/Montserrat/Montserrat-Regular.otf') format('opentype'),
        url('../fonts/Montserrat/Montserrat-SemiBold.otf') format('opentype'),
        url('../fonts/Montserrat/Montserrat-SemiBoldItalic.otf') format('opentype'),
        url('../fonts/Montserrat/Montserrat-Thin.otf') format('opentype'),
        url('../fonts/Montserrat/Montserrat-ThinItalic.otf') format('opentype'),
        url('../fonts/Montserrat/MontserratAlternates-Black.otf') format('opentype'),
        url('../fonts/Montserrat/MontserratAlternates-BlackItalic.otf') format('opentype'),
        url('../fonts/Montserrat/MontserratAlternates-Bold.otf') format('opentype'),
        url('../fonts/Montserrat/MontserratAlternates-BoldItalic.otf') format('opentype'),
        url('../fonts/Montserrat/MontserratAlternates-ExtraBold.otf') format('opentype'),
        url('../fonts/Montserrat/MontserratAlternates-ExtraBoldItalic.otf') format('opentype'),
        url('../fonts/Montserrat/MontserratAlternates-ExtraLight.otf') format('opentype'),
        url('../fonts/Montserrat/MontserratAlternates-ExtraLightItalic.otf') format('opentype'),
        url('../fonts/Montserrat/MontserratAlternates-Italic.otf') format('opentype'),
        url('../fonts/Montserrat/MontserratAlternates-Light.otf') format('opentype'),
        url('../fonts/Montserrat/MontserratAlternates-LightItalic.otf') format('opentype'),
        url('../fonts/Montserrat/MontserratAlternates-Medium.otf') format('opentype'), url('../fonts/Montserrat/Montserrat-Black.otf') format('opentype'),
        url('../fonts/Montserrat/Montserrat-BlackItalic.otf') format('opentype'),
        url('../fonts/Montserrat/Montserrat-Bold.otf') format('opentype'),
        url('../fonts/Montserrat/Montserrat-BoldItalic.otf') format('opentype'),
        url('../fonts/Montserrat/Montserrat-ExtraBold.otf') format('opentype'),
        url('../fonts/Montserrat/Montserrat-ExtraBoldItalic.otf') format('opentype'),
        url('../fonts/Montserrat/Montserrat-ExtraLight.otf') format('opentype'),
        url('../fonts/Montserrat/Montserrat-ExtraLightItalic.otf') format('opentype'),
        url('../fonts/Montserrat/Montserrat-Italic.otf') format('opentype'),
        url('../fonts/Montserrat/Montserrat-Light.otf') format('opentype'),
        url('../fonts/Montserrat/Montserrat-LightItalic.otf') format('opentype'),
        url('../fonts/Montserrat/Montserrat-Medium.otf') format('opentype'),
        url('../fonts/Montserrat/Montserrat-MediumItalic.otf') format('opentype'),
        url('../fonts/Montserrat/Montserrat-Regular.otf') format('opentype'),
        url('../fonts/Montserrat/Montserrat-SemiBold.otf') format('opentype'),
        url('../fonts/Montserrat/Montserrat-SemiBoldItalic.otf') format('opentype'),
        url('../fonts/Montserrat/Montserrat-Thin.otf') format('opentype'),
        url('../fonts/Montserrat/Montserrat-ThinItalic.otf') format('opentype'),
        url('../fonts/Montserrat/MontserratAlternates-Black.otf') format('opentype'),
        url('../fonts/Montserrat/MontserratAlternates-BlackItalic.otf') format('opentype'),
        url('../fonts/Montserrat/MontserratAlternates-Bold.otf') format('opentype'),
        url('../fonts/Montserrat/MontserratAlternates-BoldItalic.otf') format('opentype'),
        url('../fonts/Montserrat/MontserratAlternates-ExtraBold.otf') format('opentype'),
        url('../fonts/Montserrat/MontserratAlternates-ExtraBoldItalic.otf') format('opentype'),
        url('../fonts/Montserrat/MontserratAlternates-ExtraLight.otf') format('opentype'),
        url('../fonts/Montserrat/MontserratAlternates-ExtraLightItalic.otf') format('opentype'),
        url('../fonts/Montserrat/MontserratAlternates-Italic.otf') format('opentype'),
        url('../fonts/Montserrat/MontserratAlternates-Light.otf') format('opentype'),
        url('../fonts/Montserrat/MontserratAlternates-LightItalic.otf') format('opentype'),
        url('../fonts/Montserrat/MontserratAlternates-Medium.otf') format('opentype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Myriad Pro';
    src: url('../fonts/Myriad_Pro/MYRIADPRO-BOLD.OTF') format('opentype'),
        url('../fonts/Myriad_Pro/MYRIADPRO-BOLDCOND.OTF') format('opentype'),
        url('../fonts/Myriad_Pro/MYRIADPRO-BOLDCONDIT.OTF') format('opentype'),
        url('../fonts/Myriad_Pro/MYRIADPRO-BOLDIT.OTF') format('opentype'),
        url('../fonts/Myriad_Pro/MYRIADPRO-COND.OTF') format('opentype'),
        url('../fonts/Myriad_Pro/MYRIADPRO-CONDIT.OTF') format('opentype'),
        url('../fonts/Myriad_Pro/MyriadPro-Light.otf') format('opentype'),
        url('../fonts/Myriad_Pro/MYRIADPRO-REGULAR.OTF') format('opentype'),
        url('../fonts/Myriad_Pro/MYRIADPRO-SEMIBOLD.OTF') format('opentype'),
        url('../fonts/Myriad_Pro/MYRIADPRO-SEMIBOLDIT.OTF') format('opentype');
    font-weight: normal;
    font-style: normal;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: 'Montserrat', sans-serif !important;
}

body {
    font-family: 'Myriad Pro', sans-serif !important;

}

/*-------------------------*/

.header-principal {
    height: 66px;
    min-width:1134px !important;
    max-width:1134px !important;
    margin-left: auto; 
    margin-right: auto;
}

.white-space-navbar {
    width: 42px;
}
.white-space-navbar-large {
    width: 126px;
}

.hidden-button {
    width: 42px;
}


.nav-link{
    min-height:42px;
    max-height:42px !important;
}
/* search navbar */

.search-navbar {
    height: 33px;
    width: 252px;
    outline: none;
    flex: 1;
    border:none;
    border-bottom: 0.1px solid gray;
    background: transparent !important;
}

.search-navbar:active,
.search-navbar:hover,
.search-navbar:focus {
    border: none;
}
.container-search {
    display: flex;
    align-items: center;
    border-bottom: 0.1px solid;
    border-radius: 25px;
    padding: 4px;
    border-color: var(--medium-gray-color);
}

.svg-search {
    height: 33px;
    width: 33px;
}

.svg-search-patient {
    height: 33px;
    width: 33px;
}

.input-clean {
    background-color: transparent;
    border-right: none !important;
}

/*------------------*/
.svg-navbar {
    height: 33px;
    width: 33px;
}

.logo-navbar {
    height: 42px;
    width: 42px;
}

.profile-image {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    overflow: hidden;
}
.imgprof{
      width: 33px;
    height: 33px;
    border-radius:33px;
}

.header-navbar {
    height: 66px !important;
}

/*action bar*/
.action-bar {
    height: 108px;
}

/**/
.button {
    display: inline-block;
    text-align: center;
    vertical-align: middle;
    padding: 0.4rem 0.4rem;
    border: 2px solid #72c4db;
    border-radius: 50px;
    background: #ffffff;
    background: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#ffffff));
    background: -moz-linear-gradient(top, #ffffff, #ffffff);
    background: linear-gradient(to bottom, #ffffff, #ffffff);
    font: normal normal normal 18px arial;
    color: #72c4db;
    text-decoration: none;
}

.button:hover,
.button:focus {
    border: 2px solid #83e1fc;
    color: #72c4db;
    text-decoration: none;
}

.button:active {
    background: #999999;
    background: -webkit-gradient(linear, left top, left bottom, from(#999999), to(#ffffff));
    background: -moz-linear-gradient(top, #999999, #ffffff);
    background: linear-gradient(to bottom, #999999, #ffffff);
}

.contextual-menu {
    position: fixed;
    bottom: 0;
    width: 100%;
    min-height: 180px; 
    max-height: 180px;

}

/*-------Login------------*/

.img-login {
    background-image: url('../img/doctores.png');
    background-repeat: no-repeat;
    background-size: cover;
    height: 100vh;
    min-height: 100vh;
    background-size: 100% 100%;
}

.button-login {
    display: inline-block;
    text-align: center;
    vertical-align: middle;
    padding: 11px;
    border: 2px solid var(--blue-color);
    border-radius: 50px;
    background: var(--blue-color);
    background: -webkit-gradient(linear, left top, left bottom, from(var(--blue-color)), to(var(--blue-color)));
    background: -moz-linear-gradient(top, var(--blue-color), var(--blue-color));
    background: linear-gradient(to bottom, var(--blue-color), var(--blue-color));
    font: normal normal normal 18px arial;
    text-decoration: none;
    width: 270px;
    color: white;
    font-size: 15px;
}

.button-login:hover,
.button-login:focus {
    border: 2px solid #72c4db;
    color: white;
    text-decoration: none;
}

.button-login:active {
    background: #999999;
    background: -webkit-gradient(linear, left top, left bottom, from(#999999), to(#ffffff));
    background: -moz-linear-gradient(top, #999999, #ffffff);
    background: linear-gradient(to bottom, #999999, #ffffff);
}

.input-email-login {
    border: 0.1px solid !important;
    border-color: var(--dark-gray-color) !important;
    border-radius: 25px !important;
    padding-top: 6px;
    padding-bottom: 6px;
    height: 50px !important;
    width: 100%;

}

.input-password-login {
    border: 0.1px solid !important;
    border-color: var(--dark-gray-color) !important;
    border-radius: 25px !important;
    padding-top: 6px;
    padding-bottom: 6px;
    height: 50px !important;
    width: 100%;

}

.login-form {
    text-align: center !important;
    margin: 0 auto;
}

@media (max-width: 576px) {
    .login-form {
        width: 300px;
    }
}

@media (min-width: 576px) and (max-width: 991.98px) {
    .login-form {
        width: 325px;
    }
}

@media (min-width: 992px) and (max-width: 1199.98px) {
    .login-form {
        width: 325px;
    }
}

@media (min-width: 1200px) {
    .login-form {
        width: 325px;
    }
}

/*------------------------*/