@font-face{
    font-family: "Graphik";
    src: url("/static/fonts/GraphikRegular.ttf");
}
@font-face{
    font-family: "GraphikBold";
    src: url("/static/fonts/GraphikBold.ttf");
}

html, body {height: 100%; margin: 0; padding: 0; font-family: Graphik; }
h1, h2, h3, h4, h5 { font-family: Graphik; }
p{ font-size: medium; font-family: Graphik; }
footer{ position: absolute; width: 50%; left:0 ;bottom: 0; height: 140px }
a h3 {position: relative; font-family: Graphik; left: 35%;}
.navbar-inverse { height: 5%; background-color: #0d3ecc;}
.books {padding: 25px; position: relative; left: 5%; width: 80%}
.publisher {padding: 25px; position: relative; left: 40px }
.ftr {padding: 25px}
.wrapper {position: relative; min-height: 120%;}
.title { color: #ffffff; font-family: Graphik; left: 60%;}
.form { height: 50%; width:70%; padding: 10px; position: relative; left: 48px}
.form-group {width: 40%}
.login-msg{left: 48px}
.bs-example{margin: 20px;}
.breadcrumb {text-align: center; position: relative; top: -18px;}
.btn-primary {background-color: #0d3ecc;}
#toplist {position: relative; left: 273px; top: -35px; color: #ffffff;}
hr {border-style: solid grey;}
.active { border-bottom: 4px solid #0d3ecc; font-weight: bold;}
.nav-link {color: black;}
.navbar {border-bottom: 2px solid lightgrey;}


.login-wrap{
    width: 100%;

}

.login-msg{
    width: 600px;
    /* margin-left:31%; */
    margin-top: 20px;
    padding: 24px 24px 24px 21px;
    border-radius: 4px;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.2), 0 2px 1px -1px rgba(0, 0, 0, 0.12), 0 1px 1px 0 rgba(0, 0, 0, 0.14);
    background-color: #ffffff;
    min-width: 600px;
}

.alert-msg{
    width: 600px;
    margin-top: 20px;
    padding: 24px 24px 24px 21px;
    border-radius: 4px;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.2), 0 2px 1px -1px rgba(0, 0, 0, 0.12), 0 1px 1px 0 rgba(0, 0, 0, 0.14);
    min-width: 600px;
}

.mwb_center_logo{
    /* width: 100%; */
    /* height: 48px; */
    /* margin-left: auto; */
    margin-top: 10%;
    /* object-fit: contain; */
}

b { font-family: GraphikBold;}

.back-btn{
    color: #515565;
}
.back-btn:hover{
    color: #0d3ecc;
}
.back-btn:hover{
    text-decoration: none;
}
.form-control{
    /* min-width: 120%; */
    min-width: 450px;

}
.form-control-login{
    min-width: 450px;

}
#back_btn{
    /* margin-top: 8px;
    font-size: 28px; */
}
.need-to-register-btn{
    color: #0d3ecd;
    font-family: Graphik;
    font-size: 16px;
    margin-top: 8px;
    width: 114%;
}

.flash-msg{
    font-family: Graphik;
    font-size: 16px;
    margin-top: 8px;
    width: 114%;
}

.login-here{
    /* margin-left: 7%; */
}

.login-reg-label{
    font-size: 14px;
    color: #6a707b;
}


.submit-change-btn{
    border-radius: 4px;
    background-color: #0d3ecc;
    color: white;
}
.submit-change-btn:disabled{
    border-radius: 4px;
    background-color: #d7d8df;
    color: #ffffff;
}
.paragraph{
    /* margin-left: 25%; */
    width: 140%;
    
}
.widther-label{
    min-width: 400px;
}

html *
{
   font-family: Graphik !important;
}

.control-label
{
    display: block;
    text-align: left;
    width: 300%;
}
.alert-login{
    padding-left: 50px;
    padding-top: 20px;
}
.forgot-password-btn{
    color: #0d3ecd;
    font-family: Graphik;
    font-size: 16px;
    margin-top: -8px;
    /* margin-left: 20%; */
    /* width: 114%; */
}
.login-mid-row{
    min-width: 132%;
}

li::marker {
    content: '';
}

.mgselectpicker{
    min-height: 50px;
    min-width: 200px;
}

.modal-backdrop {
    visibility: hidden !important;
}
.modal.in {
    background-color: rgba(0,0,0,0.5);
}