/*

To change this license header, choose License Headers in Project Properties.

To change this template file, choose Tools | Templates

and open the template in the editor.

*/

/* 

    Created on : Jul 12, 2016, 3:27:48 AM

    Author     : USER

*/



@font-face {

    font-family: 'robotolight';

    src: url('/../media/fonts/Roboto-Light-webfont.eot');

    src: url('/../media/fonts/Roboto-Light-webfont.eot?#iefix') format('embedded-opentype'),

         url('/../media/fonts/Roboto-Light-webfont.woff') format('woff'),

         url('/../media/fonts/Roboto-Light-webfont.ttf') format('truetype'),

         url('/../media/fonts/Roboto-Light-webfont.svg#robotolight') format('svg');

    font-weight: normal;

    font-style: normal;



}



@font-face {

    font-family: 'robotothin';

    src: url('/../media/fonts/Roboto-Thin-webfont.eot');

    src: url('/../media/fonts/Roboto-Thin-webfont.eot?#iefix') format('embedded-opentype'),

         url('/../media/fonts/Roboto-Thin-webfont.woff') format('woff'),

         url('/../media/fonts/Roboto-Thin-webfont.ttf') format('truetype'),

         url('/../media/fonts/Roboto-Thin-webfont.svg#robotothin') format('svg');

    font-weight: normal;

    font-style: normal;



}



/* ---- Laravel css ----- */

.full-height {

    height: 100vh;

}



.flex-center {

    align-items: center;

    display: flex;

    justify-content: center;

}



.position-ref {

    position: relative;

}



.top-right {

    position: absolute;

    right: 10px;

    top: 18px;

}



.content {

    text-align: center;

}



.title {

    font-size: 84px;

}



.links > a {

    color: #636b6f;

    padding: 0 25px;

    font-size: 13px;

    font-weight: 600;

    letter-spacing: .1rem;

    text-decoration: none;

    text-transform: uppercase;

}



.m-b-md {

    margin-bottom: 30px;

}

/* ---- end of Laravel css ----- */



html, body {

    background-color: white;

}

.row {

    margin-left: 0px;

    margin-right: 0px;

}

#wrapper {

    min-height:100%;

    position:relative;

    padding-left: 0px;

    padding-right: 0px;

}



.clear-both {

    clear: both;

    margin-bottom: 0;

}


.hidden {

    display: none;

}



.btn {

    border-radius: 0;

}



.form-control {

    border-radius: 0;

}



/*

//----HEADER------

*/

#header {

    color: white;

    font-family: 'robotolight';

    font-weight: 500;

    border-radius: 0;

    background-color: #ffffff;

    border-color: #2e6da4;

    padding-bottom: 10px;

    padding-top: 10px;

}



.navbar .navbar-brand {

    padding: 0 0;

    height: 70px;

    color: #1897d3;

}



.navbar .navbar-brand img {

    max-height: 100%;

}



.navbar-nav .nav-item .dropdown-menu {

    top: 80% !important;

}



.navbar-nav .dropdown:hover .dropdown-menu {

    display: block;

}



.navbar-nav .dropdown-menu:hover {

    display: block;

}



/*

//----CONTENT -- COMMON IN MANY PAGES------

*/

#content {

    padding-top: 50px;

    margin-bottom: 50px;

    font-family: 'Roboto', sans-serif;

    min-height: calc(100vh - 240px);

}

.datepicker .datepicker-days {

    display: block;

}



#pagination-per-page-label {

    float: right;

}



#pagination-per-page {

    display:inline-block;

    width:35%;

}



.glyphicon-asterisk {

    font-size: 8px;

    color: red;

    vertical-align: super;

}


fieldset {

    margin: 10px 0 20px 0;
    background-color: whitesmoke;
    padding: 10px;

}



h3 {

    padding-left: 10px;

}



input[readonly] {

	background-color: #eee;

}



.alert {

    margin-top: 10px;

}



.main-content .empty-page {

    text-align:center; 

    padding:50px 5px;

    background-color: lightgray;

}



.main-content .page-title {

    float: left;

}



.main-content .pager-wrap {

    float: right;

}



.main-content .doublet {

    width: 48%;

}



.main-content .triplet {

    width: 30%;

}



.main-content .float-left {

    float: left;

}



.main-content .float-right {

    float: right;

    padding-left: 10px;

}



.main-content .red {

    color: red;

    font-weight: 900;

}



.main-content .green {

    color: green;

    font-weight: 900;

}



.main-content .gray {

    color: gray;

}

.card {

    margin-bottom: 30px;
}



/*

//-----CONTENT -- SPECIFIC PAGES---------

*/

#welcome-page #app-name {

    font-size: 96px;

    font-weight: 100;

    padding-left: 15px;

    color: #1897d3;

}



#welcome-page  #app-version {

    padding-left: 25px;

    color: #b7dfd2;

}



#welcome-page  #sub-title {

    clear: both;

    padding-left: 25px;

    color: #b7dfd2;

    font-weight: 100;

}



#search-disease .form-group label, #search-drugs .form-group label {

    width: 100%;

}



#search-disease .form-group input, #search-drugs .form-group input {

    width: calc(100% - 42px);

    float: left;

}

.patient-card-row label {

    font-weight: 800;

}

#human-chart-modal .modal-body .canvas {

    height: calc(100vh - 40px); 
    margin: 0 auto;
    max-width: 100%;
    width: 100%;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

#human-chart-modal .modal-body .canvas.male {

    background-image: url("../media/images/man.jpg"); 

}

#human-chart-modal .modal-body .canvas.female {

    background-image: url("../media/images/woman.jpg"); 

}

#lab_test_div {
    padding: 10px;
    border: solid 1px gray;
    margin-top: 20px;
    margin-bottom: 20px;
}
#lab_test_div .section-title {
    font-weight: 600;
    text-align: right;
}










/*

//-------RESPONSIVE BREAK POINTS-------

*/



@media all and (max-width: 991px) {

    .search-form {

        display: none;

    }

    .col-sm-2 h4 {

        padding-left: 0;

    }

}



@media all and (max-width: 550px) and (min-width: 351px){

    .welcome-page #app-name {

        font-size: 56px;

    }

    

}



@media all and (max-width: 360px) {

    .col-sm-10, col-sm-2, .col-sm-12 {

        padding-right: 3px;

        padding-left: 3px;

    }

    

    .welcome-page #app-name {

        font-size: 46px;

    }

    .navbar .navbar-brand {

        font-size: 46px;

    }

    .footer .footer-col-content {

        font-size: 14px;

    }

}





    



