@font-face {
    font-family: 'visby-light';
    src: url('../Demo_Fonts/VisbyRoundCF-Light.otf');
  }
  @font-face {
    font-family: 'visby-med';
    src: url('../Demo_Fonts/VisbyRoundCF-Medium.otf');
  }
  
*
{
    margin: 0;
    padding: 0;
    box-sizing: content-box;
}
body{
    background: #fff;
    width: 100%;
    height: auto;
    font-family: visby-med;
}

.navbar
{
    width: 100%;
    height: 120px;
    background-color:#323570;
    box-shadow: 2px 3px 5px 1px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    z-index: -1;
   
}
.logo
{
    width: 100px;
    height:120px;
    display: flex;
    flex-direction: column;
}
.logo img
{
    width: 128px;
    height: 105px;
    padding-top: 5px;
    padding-left: 15px;
}
.admin-details
{
    display: flex;
    flex-direction: row;
    justify-content: space-evenly;
    margin-left: 71%;
    margin-top: 1%;
    text-align: center;
}
.admin-details img
{
    width:80px;
    height: 80px;
    
}
.admin-details h5
{
    margin-top: 30px;
    margin-left: 20px;
    color: #fff;
    /* font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; */
}
.logout-btn
{
    margin-top: 42px;
    margin-right: 20px;
}
.logout-btn a
{
    text-decoration: none;
    color: #fff;
    /* font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; */
    font-size: 16px;
    background: crimson;
    width: 60px;
    height: 40px;
    padding: 5px;
    text-align: center;
    border-radius: 5px;
}
.content
{
    width: 250px;
    height: 110vh;
    background: rgba(240, 130, 4, 0.982);
    box-shadow: 1px 2px 3px 4px;
}
.dashboard
{
    display: flex;
    flex-direction: row;
}
.content ul{
    display: flex;
    flex-direction: column;
    line-height: 50px;
    text-align: center;
}
.content ul li
{
    list-style: none;
}
.content ul li a
{
    color: #fff;
    text-decoration: none;
    transition: .5s;
    text-transform: capitalize;
}
.content ul li a:hover, .content ul li .active
{
    background: #323570;
    width: 100%;
    padding: 10px 30px;
    border-radius: 5px;
    opacity: 0.9;
}
.boxes
{
    display: flex;
    flex-direction: row;
}
.dash-box
{
    width: 200px;
    height: 200px;
    background: #323570;
    margin: 25px;
    border-radius: 5px;
    text-align: center;
    justify-content: center;
    justify-items: center;
}
.dash-box h2
{
    padding-top: 80px;
}
.dash-box h5
{
    color: #fff;
    font-size: 20px;
}
.dash-box h2 a
{
    text-align: center;
    color: #fff;
    text-decoration: none;
}
#form-edit
{
    width: 100%;
    height: auto;
    background: #ee5246;
}
.form-home
{
    width: 95%;
    height: auto;
    background: rgba(255,255,255,0.4);
    margin: 2%;
    border-radius: 5px;
    
    
   
}
.input-box-index
{
    width: 30%;
    height: 60px;
    margin-left: 35%;
    font-family: visby-med;
    font-size: 16px;
    text-align: end;
    outline: none;
    border: 1.8px solid #323570;
    border-radius: 5px;
    background: transparent;
    margin-top: 15px;
    content: "";

  
}
.input-box
{
    display: flex;
    flex-direction: column;
    position: relative;
}
.form-body
{
    display: inline;
    text-align: center;
    justify-content: center;
}
.form-home h3
{
    text-align: center;
    color: #323570;
    font-size: 22px;
    padding-top: 10px;
    padding-bottom: 10px;
}
.input-box label
{
    font-weight: 600;

   
}
.input-box-img 
{
   display: flex;
   position: relative;
   flex-direction: column;
}
.input-box-img label{
    background: crimson;
    width: 200px;
    color: #fff;
    padding: 10px;
    margin-left: 40%;
    margin-top: 20px;
    border-radius: 5px;
    cursor: pointer;
}   
.input-box-img input{
    display: none;
}
.form-body button
{
    width: 150px;
    height: 30px;
    background: #323570;
    color: #fff;
    border: none;
    margin-top: 20px;
    margin-bottom: 20px;
    border-radius: 5px;
    font-weight: 600;
    cursor: pointer;
}
.form-input-data
{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}
.form-data
{
    display: flex;
    flex-direction: column;
    flex: 1;
    margin: 50px 25px;
    content: "";
    position: relative;
}

.form-data label
{
    text-align: center;
    margin-left: -220px;
    position: absolute;
    left: 0;
    margin-left: 7px;
    margin-top: -20px;
   
    /* color: #323570; */
    pointer-events: none;
    font-weight: 600;
}
.input-box-text
{
    width: 250px;
    height: 60px;
    border: 1.8px solid #323570;
    background: transparent;
    border-radius: 5px;
    outline: none;
    font-family: visby-med;
    font-size: 16px;
}
.input-box-textarea
{
    width: 250px;
    height: 100px;
    border: 1.8px solid #323570;
    background: transparent;
    border-radius: 5px;
    outline: none;
    font-family: visby-med;
    font-size: 16px;
}
.table
{
    width: 95%;
    height: auto;
    padding: 5px;
}
table{
    border: 2px solid #fff;
    border-collapse: collapse;
    margin-left:5%;
    margin-bottom: 20px;
    margin-top: 50px;
    background-color: #323570;
   
}
table th
{
    border: 1px solid #fff;
    border-collapse: collapse;
    color: #fff;
    font-weight: 300;
    padding: 5px;
}
table tr td
{
    border: 1px solid #fff;
    border-collapse: collapse;
    padding: 10px;
    text-align: center;
    color: #fff;
    flex-wrap: wrap
}
tr td a
{
    color: #fff;
    text-decoration: none;
    flex-wrap: wrap;
}
.admit-table
{
    margin-left:-4%;
   
}
.form-home-admit
{ 
    width: 100%;
    height: auto;
    background: rgba(255,255,255,0.4);
    border-radius: 5px;
    padding-bottom: 5px;
    margin-top: 2%;
   text-align: center;
}
.form-home-admit h3
{
    text-align: center;
    color: #323570;
    font-size: 22px;
    padding-top: 10px;
    padding-bottom: 10px;
}
.page-table .red,.table button
{
    background: red;
    color: #fff;
    font-size: 15px;
    border: none;
    border-radius: 5px;
    width: 80px;
    height: 30px;
    font-family: visby-med;
    cursor: pointer;
}
.page-table .green
{
    background: green;
    color: #fff;
    font-size: 15px;
    border: none;
    border-radius: 5px;
    width: 80px;
    height: 30px;
    font-family: visby-med;
}
.page-table table
{
    text-align: center;
    justify-content: center;
    margin-left: 35%;
}
.table img
{
    width: 120px;
    height: 80px;
    background: #fff;
    padding: 2px;
}

/* ============================================================================================================
Login Form 
===============================================================================================================*/
.login-admin
{
  width: 100%;
  height: 100vh;
  background: #999;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  margin-top: -10px;
  margin-left: -10px;
  position: fixed;
}
.admin-login-form
{
  width: 650px;
  height: 300px;
  background: #fff;
  border: 1.2px solid #323570;
  border-radius: 5px;
  position: absolute;
  margin-left: 28%;
  margin-top: 15%; 
  display: flex; 
 
}
.left-img 
{
  width: 280px;
  height: 300px;
  background: #323570;  
}
.left-img img
{
  width: 200px;
  height: auto;
  padding: 25% 8%;
}
.form-contents
{
  width:80%;
  height: 100%;
}
@media(max-width:986px)
{
    .login-admin
    {
        display: flex;
        justify-content: center;
        font-family: visby-med;
    }
    .admin-login-form
    {
        width: 90%;
        height: auto;
        margin: 0;
        margin-top: 25%;
    }
    .left-img img
    {
        width: 90%;
    }
    .form-contents
    {
        width: 90%;
        margin-left: 5%;
        padding-bottom: 5%;
    }
    .left-img
    {
        display: none;
    }
}
.input-box-admin
{
  width: 90%;
  margin-left: 5%;
  margin-right: 5%;
  margin-top: 5%;
  height: 35px;
  border:0;
  border-bottom: 2px solid #323570;
  font-size: 16px;
  font-weight: 300;
  outline: none;
  text-align: center;
}

.form-contents p
{
  margin-left: 5%;
  margin-top: 5%;
  color: #999;

}
.form-contents span
{
  color: red;
}
.form-contents button
{
  margin-left: 35%;
  margin-top: 10%;
  background: red;
  color: #fff;
  font-size: 14px;
  text-transform: uppercase;
  width: 120px;
  height: 38px;
  border: none;
  border-radius: 50px;
  font-weight:400;
  cursor: pointer;
}

.left-img p
{
  color: #fff;
  font-weight: 600;
  font-size: 20px;
  text-align: center;
  text-transform: uppercase;
  margin-top: -25px;
  
}
@media(max-width:986px)
{
    .input-box-admin
    {
        background: transparent;
        width: 90%;
        margin-left: 5%;
    }
    .form-contents button
    {
        width: 90%;
        border-radius: 5px;
        margin: 0;
        margin-left: 5%;
        margin-top: 5%;
    }
}
.page-table .green_btn
{
    background: green;
    width: 100px;
    padding: 5px;
    border-radius: 5px;
    margin-left: 46%;
}
.page-table .green_btn a
{
    text-decoration: none;
    color: #fff;
}
.page-table .red_btn
{
    background: red;
    width: 100px;
    padding: 5px;
    border-radius: 5px;
    margin-left: 46%;
}
.page-table .red_btn a
{
    text-decoration: none;
    color: #fff;
}
.test-images p
{
    background: red;
    padding: 5px;
    border-radius: 5px;
    width: 100px;
    text-align: center;
    margin: 25px;
    margin-left: 100px;
}
.test-images p a
{
    color: #fff;
    text-decoration: none;
}
.test-images 
{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    margin-left: 80px;
}
.img-grp
{
    display: flex;
    flex-direction: column;
    margin: 20px;
}
.img-grp img
{
    width: 300px;
    height: auto;
}


/* register new admin  */
.form-register
{
    background: #fff;
    width: 400px;
    height: 450px;
    border-radius: 5px;
    box-shadow: 1px 1px 12px 1px;
    margin-left: 30%;
    margin-top: 6%;
}
.form-register h2
{
    background: #323570;
    color: #fff;
    padding: 10px;
    text-align: center;
}
.form-register input
{
    margin-left: 5%;
    width: 90%;
    margin-top: 15px;
    height: 28px;
    border: 1.5px solid #000;
    border-radius: 5px;
    text-align: center;
    font-family: visby-med;
    outline: none;
}
.sq
{
    width: 90%;
    height: 28px;
    margin-left: 5%;
    margin-top: 15px;
    font-family: visby-med;
    outline: none;
}
.form-register button
{
    margin-left: 33%;
    margin-top: 30px;
    width: 120px;
    height: 32px;
    color: #fff;
    background: rgb(235, 153, 1);
    border: none;
    border-radius: 5px;
    font-family: visby-med;
    cursor: pointer;
}
#container {
    width: 1000px;
    margin: 20px auto;
}
.ck-editor__editable[role="textbox"] {
    /* editing area */
    min-height: 200px;
}
.ck-content .image {
    /* block images */
    max-width: 80%;
    margin: 20px auto;
}
#container h1
{
    text-align: center;
    color: #323570;
}
table .green-btn
{
    background: green;
    width: 100px;
    padding: 3px;
    border-radius: 5px;
    margin-top: 2px;
}
table .red-btn
{
    background: red;
    width: 100px;
    padding: 2px;
    border-radius: 5px;
    margin-top: 5px;

}
.upload_btn
{
    width: 150px;
    height: 30px;
    background: #323570;
    color: #fff;
    border: none;
    margin-top: 20px;
    margin-bottom: 20px;
    border-radius: 5px;
    font-weight: 600;
    cursor: pointer;
    margin-left: 40%;
}
#editor
{
    width: 700px;
}

/* search blog  */
.search_blog
{
    width: 30%;
    float: right;


}
.search_blog input{
    width: 200px;
    height: 30px;
    background: transparent;
    border: 1px solid crimson;
    color:#000;
    outline: none;
    font-family: visby-med;
    font-size: 16px;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
}
.search_blog button
{
    margin-left: -0px;
    height: 30px;
    margin-top: 0.5px;
    width:80px;
    position:absolute;
    border: none;
    background-color: crimson;
    color: #fff;
    font-family: visby-med;
    font-size: 15px;
    cursor: pointer;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;

}

/* user dashboard changes */
.user_img
{
    width: 120px;
    height: 120px;
    background: #fff;
    border-radius: 5px;
    border-radius: 1.5px solid #323570;
}
.user_img_div
{
    position: absolute;
    margin-top: -100px;
}
.input-box-img small
{
    color: red;
    
}