body {
}

.with-fixed-body {
    padding-top:50px;
    overflow-x:hidden;
}

.empty-content {
    background-color: #e1e0e1;
}

    .empty-content .panel-empty {
        color: #a7a6a6;
        padding-top:10%;
    }

input.ic {
    background-position: right 40px center;
    background-repeat: no-repeat;
    background-size: 25px;
}

span.ic {
    width: 20px;
    height: 20px;
    padding:15px;
    background-repeat: no-repeat;
    background-size:20px;
    background-position-y:50%;
}

.ic-email {
    background-image: url('/Content2/img/ic_email@1x.png');
}

.ic-name {
    background-image: url('/Content2/img/ic_name@1x.png');
}

.ic-pass {
    background-image: url('/Content2/img/ic_pass@1x.png');
}

.ic-pass {
    background-image: url('/Content2/img/ic_pass@1x.png');
}

.ic-search {
    background-image: url('/Content2/img/ic_search@15x.png');
}

.ic-add-patient {
    background-image: url('/Content2/img/ic_add_patient@15x.png');
}

.ic-agenda {
    background-image: url('/Content2/img/ic_drawer_agenda@1x.png');
}

.ic-reportes {
    background-image: url('/Content2/img/ic_drawer_reportes@1x.png');
}

.ic-formatos {
    background-image: url('/Content2/img/ic_drawer_formato@1x.png');
}

.ic-configuracion {
    background-image: url('/Content2/img/ic_drawer_configuracion@1x.png');
}

.ic-logout {
    background-image: url('/Content2/img/ic_drawer_logout@1x.png');
}

.inverted {
    -moz-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
    filter: FlipH;
    -ms-filter: "FlipH";
}

.login-input {
    border: 0px solid;
    border-radius: 25px 25px;
    background-color: #f5f5f5;
    height:45px;
    margin-bottom: 0px;
    padding: 10px 20px;
    text-align:left;
    width:100%;
}

.login-drop-down {
    width:100%;
}

.login-input .caret {
    position: absolute;
    right: 20px;
    top: 20px;
}

.general-form .form-group, .options-form .form-group {
    border-bottom: 1px solid #eee;
}

    .general-form .form-group label {
        font-size: 11px;
    }

.options-form .panel-body {
    padding-top:0;
    padding-bottom:0;
}

.options-form .form-group {
    padding-top:15px;
    padding-bottom:10px;
    margin-bottom:0;
}

    .options-form .form-group a {
        color:#000;
    }

.options-form .profile-image {
    width: 60px;
}

.options-form .profile-image-label {
    padding-left:20px;
}

.details-form .label-column, .details-form .data-column {
    padding-top:10px;
    padding-bottom:10px;
}

.details-form .text-right {
    text-align: right;
}

.details-form .text-left {
    text-align: left;
}

.details-form .label-column label {
    font-size: 13px;
    color: #a2a1b8;
}

.details-form .data-column label {
    font-size: 13px;
    color: #151431;
}

.general-input {
    border: 1px solid #fff;
    color: #b2b2b2;
    box-shadow: none;
    -webkit-box-shadow:none;
}

.general-form .dropdown .btn.dropdown-toggle {
    font-size: 11px;
    font-weight: 700;
    margin-bottom: 6px;
    padding: 0;
}

.btn-round, .btn-round:active, .btn-round:focus {
    background: #0dcdfe; /* For browsers that do not support gradients */
    background: -webkit-linear-gradient(left top, #0dcdfe, #0e81c2); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(bottom right, #0dcdfe, #0e81c2); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(bottom right, #0dcdfe, #0e81c2); /* For Firefox 3.6 to 15 */
    background: linear-gradient(to bottom right, #0dcdfe, #0e81c2); /* Standard syntax */
    border: none;
    border-radius: 25px;
    color: #fff;
    padding: 10px 20px;
    width: 100%;
}

.login-link {
    color: #0dc3f6;
}

    .login-link:hover {
        color: #0dc3f6;
        text-decoration:none;
    }

.panel {
    box-shadow:none;
}

.login-panel-top {
    height:14.58em;
    padding-top: 6.4em;
}

.login-panel-bottom {
    height:7.11em;
    padding-top:5.69em;
}

.round-picture {
    border-radius: 50%;
}

.profile-picture-container {
    position: relative;
    width: 156px;
    height: 156px;
    margin: 0 auto;
}

.profile-picture {
    position: absolute;
}

.profile-picture-add {
    right:-18px;
    position:absolute;
    top:59px;
}

.panel-empty {
    background-color: #e1e0e1;
}

.navbar-blue {
    background-color: #2196f3;
    border-color: #2196f3;
    margin-bottom:0;
}

    .navbar-blue.navbar-blue-transparent {
        background-color: transparent;
        border-color: transparent;
    }

.navbar-blue:after {
    content: "";
    width: 100%;
    height: 1px;
    display: block;
    position: absolute;
    -webkit-box-shadow: 0px 0px 15px 1px #000000;
       -moz-box-shadow: 0px 0px 15px 1px #000000;
            box-shadow: 0px 0px 15px 1px #000000;
}

    .navbar-blue.navbar-blue-transparent:after {
        content: "";
        width: 100%;
        height: 1px;
        display: block;
        position: absolute;
        -webkit-box-shadow: none;
        -moz-box-shadow: none;
        box-shadow: none;
    }

.navbar-blue .navbar-link {
    color: #fff;
}

    .navbar-blue .navbar-link:hover {
        color: #fff;
    }

.navbar-blue .btn-link {
    color: #9d9d9d;
}

    .navbar-blue .btn-link:hover,
    .navbar-blue .btn-link:focus {
        color: #fff;
    }

    .navbar-blue .btn-link[disabled]:hover,
    fieldset[disabled] .navbar-blue .btn-link:hover,
    .navbar-blue .btn-link[disabled]:focus,
    fieldset[disabled] .navbar-blue .btn-link:focus {
        color: #444;
    }




    .navbar-blue .navbar-brand {
        color: #fff;
    }

        .navbar-blue .navbar-brand:hover,
        .navbar-blue .navbar-brand:focus {
            color: #fff;
            background-color: transparent;
        }

    .navbar-blue .navbar-text {
        color: #fff;
    }

    .navbar-blue .navbar-nav > li > a {
        color: #fff;
    }

        .navbar-blue .navbar-nav > li > a:hover,
        .navbar-blue .navbar-nav > li > a:focus {
            color: #fff;
            background-color: transparent;
        }

    .navbar-blue .navbar-nav > .active > a,
    .navbar-blue .navbar-nav > .active > a:hover,
    .navbar-blue .navbar-nav > .active > a:focus {
        color: #fff;
        background-color: #1880d3;
    }

    .navbar-blue .navbar-nav > .disabled > a,
    .navbar-blue .navbar-nav > .disabled > a:hover,
    .navbar-blue .navbar-nav > .disabled > a:focus {
        color: #444;
        background-color: transparent;
    }

    .navbar-blue .navbar-toggle {
        border-color: #2196f3;
    }

        .navbar-blue .navbar-toggle:hover,
        .navbar-blue .navbar-toggle:focus {
            background-color: #1880d3;
        }

        .navbar-blue .navbar-toggle .icon-bar {
            background-color: #fff;
        }

    .navbar-blue .navbar-collapse,
    .navbar-blue .navbar-form {
        border-color: #1880d3;
    }

    .navbar-blue .navbar-nav > .open > a,
    .navbar-blue .navbar-nav > .open > a:hover,
    .navbar-blue .navbar-nav > .open > a:focus {
        color: #fff;
        background-color: #1880d3;
    }

    .navbar-blue .nav.left-tool, .navbar-blue .nav.left-tool-w-text {
        padding-top: 10px;
        padding-bottom: 10px;
    }

    .navbar-blue .nav-header-center.nav-title {
        color: #fff;
        padding-top:14px;
        min-width:66%;
    }

    .navbar-blue .nav-header-center.nav-title p{
        font-size:18px;
    }

        .navbar-blue .nav-header-tools a{
            color:#fff;
        }

.nav .open > a, .nav .open > a:focus, .nav .open > a:hover {
    background-color: #1880d3;
}

    .navbar-blue .nav-header-center {
        min-width:62%;
        padding-top:4px;
    }

    .navbar-blue .nav-header-tools {
        padding-top:4px;
    }

.navbar-blue .nav-left-button {
    max-width:10%;
}

.navbar-blue .nav.left-tool.nav-header-tools, .navbar-blue .nav.left-tool-w-text.nav-header-tools {
    padding-top:14px;
}

.navbar-blue .nav.left-tool-w-text {
    max-width:33%;
}

.nav-tool {
    margin-left: 10px;
    margin-right: 10px;
    color:#fff;
}

table.profile-table>tbody>tr>td {
    vertical-align: middle;
}

    .profile-table td:first-child > img {
        max-width: 50%;
    }

.profile-table td p {
    color: #cdcdce;
    font-size:80%;
    margin:0;
}

    .profile-table td p:first-child {
        margin: 0;
        color: #000;
        font-size: 100%;
        font-weight: bold;
    }

table.expanded-table>tbody>tr>td {
    padding:15px;
}

table.profile-table > tbody > tr > td.col-a-eliminar {
    overflow: hidden;
    height:80px;
    width:75%;
    position:relative;
}

    table.profile-table > tbody > tr > td.col-a-eliminar div {
        position: absolute;
        top: 15px;
        left: -50px;
        padding-right: 10px;
    }

.profile-table .col-eliminar {
    background-color: #ed5564;
    color:#fff;
    font-size:12px;
    text-align:center;
}

.profile-top {
    background-color: #e1e0e1;
    margin-bottom:0;
}

    .profile-top .profile-top-options {
        position:relative;
    }
    
    .profile-top .profile-top-options a {
        color: #b4b4b4;
    }

.drop-down-menu-container {
    position: absolute;
    left: 50%;
    background-color: transparent;
    border: none;
    border-radius: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
}

    .drop-down-menu-container .dropdown-menu-options {
        position: relative;
        left: -50%;
        position: absolute;
        top: 0;
        z-index: 1000;
        float: left;
        min-width: 160px;
        padding: 5px 0;
        margin: 2px 0 0;
        font-size: 14px;
        text-align: left;
        list-style: none;
        background-color: #fff;
        -webkit-background-clip: padding-box;
        background-clip: padding-box;
        border: 1px solid #ccc;
        border: 1px solid rgba(0, 0, 0, .15);
        border-radius: 4px;
        -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
        box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
    }

.dropdown-menu-options > li > a {
    display: block;
    padding: 7px 30px;
    clear: both;
    font-weight: normal;
    line-height: 1.42857143;
    color: #333;
    white-space: nowrap;
}

    .dropdown-menu-options > li > a:hover,
    .dropdown-menu-options > li > a:focus {
        color: #262626;
        text-decoration: none;
        background-color: #f5f5f5;
    }

.dropdown-menu-options > .active > a,
.dropdown-menu-options > .active > a:hover,
.dropdown-menu-options > .active > a:focus {
    color: #fff;
    text-decoration: none;
    background-color: #337ab7;
    outline: 0;
}

.general-form .dropdown .dropdown-toggle {
    border: 1px solid #fff;
    text-align: left;
    width: 100%;
}

.general-form .dropdown span.caret{
    float:right;
    margin-top:5px;
}

.general-form .first-col {
    border-right: 1px solid #e1e0e1;
}

.general-form .form-group:last-child {
    margin-bottom: 0;
}

.general-form .form-group {
    padding-top: 15px;
    margin-bottom:0;
}

.general-form .form-group.first-row {
    padding-top: 0;
}

.general-form .panel-body {
    padding-bottom:0;
    padding-top:0;
}

.panel.general-form {
    margin-bottom:0;
}

.panel.options-form {
    margin-bottom: 0;
}

.options-form .form-group:last-child {
    margin-bottom: 0;
}

.panel.panel-title-middle {
    padding-bottom: 5px;
    padding-top: 15px;
    padding-left:5px;
    background-color: #e1e0e1;
    color: #ababab;
    margin-bottom: 0;
    font-size: 11px;
    font-weight: bold;
    color: #ababab;
    border-radius:0 0;
}

    .panel.panel-title-middle a {
        font-size: 13px;
    }

.lista-pacientes {
    position:absolute;
    top:0;
    left:82%;
    width:100%;
    height:100%;
    z-index:999;
}

    .lista-pacientes.inactive {
        background-color:#fff;
    }

    .lista-pacientes.inactive .navbar {
        position:relative;
    }

    .lista-pacientes .overlay {
        background-color: rgba(0, 0, 0, 0.4);
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 9999;
    }

.profile-header {
    background-image: url("/Content2/img/bg_drawer@15x.png");
    background-repeat:repeat-x;
}

    .profile-header p, .profile-header h1, .profile-header h2, .profile-header h3, .profile-header h4 {
        color: #fff;
    }

    .profile-header .profile-image {
        width: 28%;
    }

.menu-pacientes {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 99;
}

.menu-pacientes .list-group-item {
    border: none;
}

.detalles-header {
    background-image: url("/Content2/img/bg_patients@15x.png");
    background-repeat: repeat-x;
}

.detalles-header {
    height: 300px;
    padding-left: 0;
    padding-right: 0;
}

    .detalles-header .header-container {
        position: absolute;
        width: 100%;
        color: #fff;
    }

        .detalles-header .header-container .detalles-header-left {
            position: absolute;
            width: 25%;
            top: 100px;
            left: 10px;
        }

        .detalles-header .header-container .detalles-header-center {
            position: absolute;
            left: 50%;
            width: 50%;
        }

            .detalles-header .header-container .detalles-header-center .center-container {
                position: relative;
                left: -50%;
                height: 300px;
            }

        .detalles-header .header-container .detalles-header-right {
            position: absolute;
            right: 10px;
            width: 25%;
            top: 100px;
        }

.center-container .bottom-container {
    position: absolute;
    left: 50%;
    bottom:10px;
}

.center-container .bottom-container-details {
    position: relative;
    left: -50%;
}


.editable-image-container {
    position: absolute;
    left: 50%;
}

.detalles-header-center .profile-image {
    position: relative;
    left: -50%;
}

.edit-option {
    position: absolute;
    bottom: 5px;
    right: 50%;
}


.buttons-tab {
    width:100%;
    padding-bottom:10px;
    text-align:center;
}

    .buttons-tab .btn-group {
        display: inline-block;
        min-width:180px;
        max-width:400px;
    }

.buttons-tab .btn-group .btn {
    border: none;
    border-right: 1px solid #d2d1d4;
    margin-right:0.7%;
    width:19.5%;
}

    .buttons-tab .btn-group .btn:last-child {
        border: none;
    }

.buttons-tab .btn-group .btn img{
    max-width:70%;
    min-width:20px;
    min-height:20px;
}

.small-side-note {
    text-align:center;
    font-size:10px;
}

.btn-rounder {
    border-radius:25px 25px;
    padding:15px 40px;
    font-size:12px;
}

.top-container {
    background-color:#fff;
    height: 50%;
}

    .top-container .panel {
        margin-bottom:10px;
    }

.bottom-container {
    height: 50%;
}

.floating-bottom-button {
    position: fixed;
    bottom: 10px;
    right: 15px;
    background-image: url(/Content2/img/floating_add@1x.png);
    background-size: 66px;
    z-index: 999;
    width: 66px;
    height:66px;
}

.gray-background-container {
    background-color: #e1e0e1;
}

.panel-schedule {
    background-color: transparent;
}

    .panel-schedule .panel-heading {
        background-color:#fff;
        position:relative;
        height:200px;
        padding-left:0;
        padding-right:0;
        border-bottom:none;
    }

    .panel-schedule .left-tool-w-text a {
        color:#000;
    }

    .panel-schedule .schedule-month {
        padding-top:0px;
        font-weight:bold;
    }

    .panel-schedule .schedule-days-bar {
        width: 100%;
        overflow: hidden;
        position: absolute;
        bottom: 0;
    }

        .panel-schedule .schedule-days-bar .schedule-day {
            width: 8.5714%;
            color: #ababab;
            float: left;
            margin-left: 2.8571%;
            margin-right: 2.8571%;
        }

        .panel-schedule .schedule-days-bar .schedule-day p{
            font-size:16px;
            text-align:center;
            font-weight:bold;
        }

            .panel-schedule .schedule-days-bar .schedule-day p:first-child {
                font-size:11px;
                margin-bottom:0;
            }

            .panel-schedule .schedule-days-bar .schedule-day.active {
                color: #42cb6f;
                border-bottom: 4px solid #42cb6f;
            }

    .panel-schedule .schedule {
        position:relative;
        width:100%;
    }

        .panel-schedule .schedule .schedule-hour {
            background-color: #fff;
            border: 1px solid #eff0f0;
            border-radius: 20px 20px;
            padding: 12px 15px;
            float: left;
            width: 28%;
            margin: 3.7% 2.6666%;
            color: #676869;
            text-align: center;
            box-shadow: 1px 1px 2px #9f9e9f;
        }

            .panel-schedule .schedule .schedule-hour.inactive {
                background-color: #f0f0f0;
                color: #aeaeae;
            }

            .panel-schedule .schedule .schedule-hour.marked {
                background-color: #2196f3;
                border: 1px solid #2196f3;
                color: #fff;
            }

    .panel-schedule .schedule-footer {
        position: fixed;
        width: 100%;
        bottom: 0;
        left:0;
        text-align: center;
        background-color: #e1e0e1;
        padding:20px 0;
    }

.table.table-reporte > thead > tr > td {
    color: #1b1720;
    font-weight:bold;
}

.table.table-reporte > tbody > tr > td {
    color: #868587;
    font-size:12px;
}

.table.table-reporte > tbody > tr:first-child > td {
    border-top: none;
    padding-top: 15px;
}

.enlarge-text {
    font-size:150%;
}

/*.mobile-checkbox {
    padding: 5px 0 4px 24px;
    cursor: pointer;
    background: url(/Content2/img/toggle_off@15x.png) left center no-repeat;
}*/

.mobile-checkbox input[type='radio'],
.mobile-checkbox input[type='checkbox'] {
    opacity: 0;
    float: left;
    width: 18px;
}

    .mobile-checkbox input[type='radio'] + label,
    .mobile-checkbox input[type='checkbox'] + label {
        margin: 0;
        clear: none;
        /* Left padding makes room for image */
        padding: 18px 30px;
        /* Make look clickable because they are */
        cursor: pointer;
        background: url(/Content2/img/toggle_off@15x.png) left center no-repeat;
        -webkit-transition: background-image 0.2s ease-in-out;
        transition: background-image 0.2s ease-in-out;
    }

    /*
    Change from unchecked to checked graphic
*/
    .mobile-checkbox input[type='radio']:checked + label {
        background-image: url(/Content2/img/toggle_on@15x.png);
    }

    .mobile-checkbox input[type='checkbox']:checked + label {
        background-image: url(/Content2/img/toggle_on@15x.png);
    }

.general-form .form-group.mobile-checkbox-row {
    padding-top: 4px;
    padding-bottom: 4px;
}

.plain-control input, .plain-control textarea, .plain-control .dropdown .btn.dropdown-toggle {
    background-color: #eeeeee;
    color: #838d8f;
    border: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    font-size: 13px;
    border-radius: 0;
}

.plain-control .dropdown .btn.dropdown-toggle {
    text-align:left;
    width:100%;
}

.plain-control .dropdown span.caret {
    float:right;
    margin-top:7px;
}

.pop-up .modal-content {
    border-radius:0;
}

.pop-up .modal-content h4 {
    font-weight:bold;
}

    .pop-up .modal-content .modal-header {
        border-bottom:none;
    }

    .pop-up .modal-content .modal-footer {
        border-top: none;
        text-align:center;
    }

    .pop-up .modal-content .btn {
        border: 1px solid #000;
        border-radius: 0;
        background-color: #fff;
        padding: 10px 25px;
        font-weight:bold;
    }

        .pop-up .modal-content .btn.btn-primary {
            background-color: #0dafd8;
            border: 1px solid #0dafd8;
        }

@media (min-width: 350px) {
    /*.panel.general-form .form-group.col-md-6, .panel.general-form .form-group.col-md-4 {*/
    .col-md-2, .col-md-4, .col-md-6 {
        float: left;
        position: relative;
        min-height: 1px;
        padding-right: 15px;
        padding-left: 15px;
    }
    .col-md-2 {
        width:16.66666666%;
    }
    /*.panel.general-form .form-group.col-md-4 {*/
    .col-md-4 {
        width: 33.33333333%;
    }
    /*.panel.general-form .form-group.col-md-6 {*/
    .col-md-6 {
        width: 50%;
    }
    .profile-header {
        background-image: url("/Content2/img/bg_drawer@3x.png");
    }
    .detalles-header {
        background-image: url("/Content2/img/bg_patients@2x.png");
    }
}

@media (min-width: 768px) {
    .navbar-header {
        float:none;
    }
    .navbar-blue .nav-header-center {
        width:56%;
    }

        .navbar-blue .nav-header-center.nav-title {
            width: 56%;
        }
    .detalles-header {
        background-image: url("/Content2/img/bg_patients@3x.png");
    }

    .panel-schedule .schedule .schedule-hour {
        padding-top: 15px;
        padding-bottom: 15px;
        margin-top: 2.4%;
        margin-bottom: 2.4%;
    }
}

@media (min-width: 992px) {
    .profile-header {
        background-image: url("/Content2/img/bg_drawer@4x.png");
    }
    .detalles-header {
        background-image: url("/Content2/img/bg_patients@4x.png");
    }

    .panel-schedule .schedule .schedule-hour {
        padding-top:20px;
        padding-bottom:20px;
        margin-top: 1.2%;
        margin-bottom: 1.2%;
    }
}


/* Start by setting display:none to make this hidden.
   Then we position it in relation to the viewport window
   with position:fixed. Width, height, top and left speak
   speak for themselves. Background we set to 80% white with
   our animation centered, and no-repeating */
.modalloading {
    display:    none;
    position:   fixed;
    z-index:    1000;
    top:        0;
    left:       0;
    height:     100%;
    width:      100%;
    background: rgba( 255, 255, 255, .8 ) 
                url('/Content//Content2/img/load.gif') 
                50% 50% 
                no-repeat;
}

/* When the body has the loading class, we turn
   the scrollbar off with overflow:hidden */
body.loading {
    overflow: hidden;   
}

/* Anytime the body has the loading class, our
   modal element will be visible */
body.loading .modalloading {
    display: block;
}


/**/

/* Add a black background color to the top navigation */
.topnav {
    background-color: #333;
    overflow: hidden;
}

/* Style the links inside the navigation bar */
.topnav a {
    float: left;
    color: #f2f2f2;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
    font-size: 17px;
}

/* Change the color of links on hover */
.topnav a:hover {
    background-color: #ddd;
    color: black;
}

/* Add a color to the active/current link */
.topnav a.active {
    background-color: #4CAF50;
    color: white;
}