@import url('https://fonts.googleapis.com/css?family=Source+Sans+Pro');
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video
{border:0;font-size:100%;font:inherit;vertical-align:baseline;margin:0;padding:0}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:none}table{border-collapse:collapse;border-spacing:0}
/*
lightgray      : #819090;
gray           : #708284;
mediumgray     : #536870;
darkgray       : #475B62;
darkblue       : #0A2933;
darkerblue     : #042029;
paleryellow    : #FCF4DC;
paleyellow     : #EAE3CB;
yellow         : #A57706;
orange         : #BD3613;
red            : #D11C24;
pink           : #C61C6F;
purple         : #595AB7;
blue           : #2176C7;
cyan           : #259286;
green          : #738A05; */
body {
font-family: 'Source Sans Pro', sans-serif;
font-weight: 300;
font-size: 18px;
line-height: 1.2;
background: #e9ecf1;
color: #475B62;
}
strong {
font-weight: 600;
}
h1, h2, h3, h4, h5, h6 {
font-family: 'Source Sans Pro', sans-serif;
font-weight: 700;
color: #5c6169;
font-size: 18px;
margin-bottom: 0;
}
p {
margin-bottom: 0;
}
/*img{
width: 100%;
}*/
a{text-decoration: none;}
.container {
width: 80%;
max-width: 1600px;
margin: 0 auto;
}
.header{
padding: 10px 0px;
box-shadow: 0 4px 5px rgba(57, 63, 72, 0.3);
position: relative;
}
.logo{
display: inline-block;;
}
.menu{
float: right;
display: flex;
align-items: center;
justify-content: center;
position: relative;
}
.menu h2{
display: inline-block;
font-weight: 100;
font-size: 15px;
}
.banner{
line-height: 0;
position: relative;
}
.section2, .section3 {
padding: 25px 0px;
display: flex;
/*align-items: center;*/
justify-content: center;
min-height: 83vh;
}
.report-table{
/*float: left;*/
width: 100%;
background: #fff;
margin: 25px 0px;
border-radius: 8px;
box-shadow: 0 2px 5px rgba(57, 63, 72, 0.3);
font-size: 16px;
}
.report-table td, .admin-report-table td{
text-align: center !important;
padding: 15px 0px !important;
}
.heading{
font-weight: bold;
border-bottom: 2.5px solid #e9ecf1;
}
.add-plus{
width: 55px;
background: #e44f6f;
border-radius: 50px;
float: left;
box-shadow: 0 4px 5px rgba(57, 63, 72, 0.3);
text-align: center;
line-height: 55px;
font-size: 20px;
color: #fff;
cursor: pointer;
}
.addons{    display: flex;
    align-items: center;
    justify-content: space-between;}

tr:nth-child(even) {background-color: #f9f9f9 !important;}
.addnew{
background-color: rgba(0, 0, 0, 0.4);
position: fixed;
width: 100%;
height: 100%;
top: 0;
left: 0;
display: none;
z-index: 9999999;
}
.add{
color: #000;
border-radius: 7px;
background: #fff;
padding: 30px;
margin: 0 auto;
margin-top: 20%;
}
.sun_rise{
background: #f0875a;
width: 15%;
position: absolute;
right: 15%;
top: 0;
/*opacity: 0.8;*/
height: 100%;
text-align: center;
}
.sun_rise img{
position: absolute;
top: 0;
left: 0;
width: 100%;
}
.sun_rise p{
padding-top: 78%;
color: #ffffff;
font-size: 30px;
}
.sun_set{
background: #a266d8;
width: 15%;
position: absolute;
right: 0;
top: 0;
/*opacity: 0.8;*/
height: 100%;
text-align: center;
}
.sun_set  img{
position: absolute;
top: 0%;
left: 0%;
width: 100%;
}
.sun_set p{
padding-top: 78%;
color: #ffffff;
font-size: 30px;
}
input[type="email"], input[type="password"], input[type="date"], input[type="text"], input[type="time"], input[type="submit"], option, select {
font-family: 'Source Sans Pro', sans-serif;
padding: 10px;
margin: 10px;
outline: 0;
border-radius: 3px;
border: 1px solid #bdb7b7;
font-size: 15px;
}
#add_new .form_sec .form_inputs {
font-family: 'Source Sans Pro', sans-serif;
padding: 10px 0px 0px;
margin: 0px;
outline: 0;
border-radius: 0px;
border: 0px;
border-bottom: 1px solid #bdb7b7;
font-size: 15px;
width: 500px;
}
.form_sec{display: flex;align-items: center;margin-bottom: 30px;}
.form_head{min-width: 150px;}
.btn{
padding: 10px 40px;
margin: 10px;
outline: 0;
border-radius: 50px;
border: none;
font-size: 16px;
background: linear-gradient(45deg, #B388EB, #8093F1);
color: #ffffff;
cursor: pointer;
background: linear-gradient(45deg, #e02dea, #13c3c3, #de75e4);
background-size: 400% 400%;
transition: all 0.3s ease;
}
.btn:hover {
animation: gradient 5s ease infinite;
}
@keyframes gradient {50% {background-position: 100% 0;}}

#new_data_length{padding: 0 30px;}
#new_data_filter{padding: 20px 30px;}
#new_data_paginate{padding: 10px 25px;}
#new_data_info{padding: 20px 45px;}

.dataTables_wrapper .dataTables_paginate .paginate_button.current, .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover{
    padding: 8px 15px;
    /*background: #a2a2a;  /* fallback for old browsers */
  /*  background: -webkit-linear-gradient(to right, #fbc2eb 0%, #a6c1ee 0, #fbc2eb 90%);  /* Chrome 10-25, Safari 5.1-6 */
  /*  background: linear-gradient(to right, #fbc2eb 0%, #a6c1ee 0, #fbc2eb 90%); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
    border: 1px solid #a6c1ee;
    color: #8e8a8a !important;
    border-radius: 50px;
    outline: 0;
    background: #eef4ff;}
.dataTables_wrapper .dataTables_paginate .paginate_button{padding: 8px 15px;border-radius: 50px;border:0;}
.dataTables_wrapper .dataTables_paginate .paginate_button:active{box-shadow: none;}
.dataTables_wrapper .dataTables_paginate .paginate_button:hover{
      padding: 8px 15px;
    /*  background: #5C258D;  /* fallback for old browsers */
    /*  background: -webkit-linear-gradient(to right, #fbc2eb 0%, #a6c1ee 0, #fbc2eb 90%);  /* Chrome 10-25, Safari 5.1-6 */
    /*  background: linear-gradient(to right, #fbc2eb 0%, #a6c1ee 0, #fbc2eb 90%); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
    border: 1px solid #a6c1ee;
    color: #8e8a8a !important;
    border-radius: 50px;
    outline: 0;
    background: #eef4ff;}
input[type="search" i] {
      box-shadow: none;
      border-style: none;
      border-bottom: 1px solid #ccc;
       padding: 0px;
      -webkit-transition: width 0.4s ease-in-out;
    transition: width 0.4s ease-in-out;
    width: auto;
        outline: 0;
        font-size:14px;
    }
  /* input[type="search" i]:focus{outline: 0;
      width: 65%;
  } */
label:hover{
    cursor: pointer;
  }


#new_data_filter input[type="search"] {
      /* position: relative; */
  }

  input { font-family: 'FontAwesome'; } /* This is for the placeholder */

#new_data_filter .s_icon:before {
      font-family: 'FontAwesome';
      color:#ccc;
       position: relative;
      left: -5px;
      content: "\f002";
  }
.info, .point{
  padding: 0 10px;
}
.point{max-height: 20px;cursor: pointer;float: left;}

.dot{
  height: 5px;
  width: 5px;
  background-color: #bbb;
  border-radius: 50%;
  display: block;
  margin-bottom:5px;
}
.drop-down{
  position: absolute;
  top: 130%;
  z-index: 99999;
  background: #db2b64;
  right: -11%;
  border-radius: 5px;
  display: none;
}
.drop li a{
  padding: 10px;
  color: #ffffff;
  display: block;
  width: 160px;
  text-align: right;
}
.drop-down::before{
  content: '';
  position: absolute;
  right: 16px;
  top: -4%;
  width: 0;
  height: 0;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-bottom: 10px solid #db2b64;
  clear: both;
}
/*Login Page*/
.container-fluid{
  width: 100%;
  min-height: 80vh;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  position: relative;
  z-index: 1;
}
.center-box{
  background: #ffffff;
  padding: 20px;
  border-radius: 0px;
  width: 500px;
  box-sizing: border-box;
  float: left;
}
.submit{
  background: #2dde98;
  margin: 10px 0px;
  width: 100%;
  border-radius: 0px;
  color: #ffffff;
  border: 1px solid #2dde98;
  cursor: pointer;
  padding: 12px;
  font-size: 15px;
}
.submit i{    padding: 0 10px;}
.submit:hover{background: #4ec194;border: 1px solid #4ec194;}
input[type="submit"].btn{
  border: none;
  padding: 10px 60px;
  cursor: pointer;
}

.center-box input[type="email"], input[type="password"], input[type="text"].u_name {
padding: 10px;
margin: 10px 0;
outline: 0;
border: 1px solid #bdb7b7;
font-size: 15px;
display: block;
width: 100%;
box-sizing: border-box;
float: left;
border-radius: 0px;
}
#min, #max{width: auto;}
.add .add-plus{float: right;}
.error-box{min-height: 20px; color: #f00; font-size: 14px;}
div.dt-buttons{margin: 12px 0; display: inline-block;}
button.dt-button, div.dt-button, a.dt-button{padding: 3px 10px;}
.footer{display: flex;align-items: center;justify-content: center;text-align: center;
  background: #f28a54;
  padding: 20px 0;
  color: #ffffff;
  /* background-image: linear-gradient(to right, #DD5E89 0%, #F7BB97 51%, #DD5E89 100%)    */
   background: url(../images/footer-background.jpg);
    background-repeat: repeat-x;
    background-repeat-y: no-repeat;
    background-position: center;
    border-color: transparent !important;
}
.update, .delete{
  border: 0;
  border-radius: 0;
  padding: 10px;
  background: url(../images/edit.svg);
  background-repeat: no-repeat;
  background-repeat-y: no-repeat;
  background-position: center;
  border-color: transparent !important;
  background-size: 100%;
  cursor: pointer;
  outline: 0;
	margin: 0 10px;
}
.delete{
  background: url(../images/delete.svg);
  background-repeat: no-repeat;
  background-repeat-y: no-repeat;
  background-position: center;
  border-color: transparent !important;
  background-size: 100%;
}





/*Error*/
@import url("https://fonts.googleapis.com/css?family=Dosis:300,400,700,800");

/** Styles for the 403 Page **/

.particle-error,
.permission_denied,
#particles-js {
  width: 100%;
  height: 100%;
  margin: 0px !important;
}

#particles-js {
  position: fixed !important;
  opacity: 0.23;
}

.permission_denied {
  background: #24344c !important;
}

.permission_denied a {
  text-decoration: none;
}

.denied__wrapper {
  max-width: 390px;
  /* width: 100%;
  height: 390px; */
  display: block;
  margin: 0 auto;
  position: relative;
  /* margin-top: 8vh; */
  min-height: 96vh;
}

.permission_denied h1 {
  text-align: center;
  color: #fff;
  font-family: "Dosis", sans-serif;
  font-size: 100px;
  margin-bottom: 0px;
  font-weight: 800;
}

.permission_denied h3 {
  text-align: center;
  color: #fff;
  font-size: 19px;
  line-height: 23px;
  max-width: 330px;
  margin: 0px auto 30px auto;
  font-family: "Dosis", sans-serif;
  font-weight: 400;
}

.permission_denied h3 span {
  position: relative;
  width: 65px;
  display: inline-block;
}

.permission_denied h3 span:after {
  content: "";
  border-bottom: 3px solid #ffbb39;
  position: absolute;
  left: 0;
  top: 43%;
  width: 100%;
}

.denied__link {
  background: none;
  color: #fff;
  padding: 12px 0px 10px 0px;
  border: 1px solid #fff;
  outline: none;
  border-radius: 7px;
  width: 150px;
  font-size: 15px;
  text-align: center;
  margin: 0 auto;
  vertical-align: middle;
  display: block;
  margin-bottom: 40px;
  margin-top: 25px;
  font-family: "Dosis", sans-serif;
  font-weight: 400;
}

.denied__link:hover {
  color: #ffbb39;
  border-color: #ffbb39;
  cursor: pointer;
  opacity: 1;
}

.permission_denied .stars {
  animation: sparkle 1.6s infinite ease-in-out alternate;
}

@keyframes sparkle {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0.3;
  }
}

#astronaut {
  width: 43px;
  position: absolute;
  right: 20px;
  top: 210px;
  animation: spin 4.5s infinite linear;
}

@keyframes spin {
  0% {
    transform: rotateZ(0deg);
  }
  100% {
    transform: rotateZ(360deg);
  }
}

@media (max-width: 600px) {
  .permission_denied h1 {
    font-size: 75px;
  }
  .permission_denied h3 {
    font-size: 16px;
    width: 200px;
    margin: 0 auto;
    line-height: 23px;
  }
  .permission_denied h3 span {
    width: 60px;
  }
  #astronaut {
    width: 35px;
    right: 40px;
    top: 170px;
  }
}

.saturn,
.saturn-2,
.hover {
  animation: hover 2s infinite ease-in-out alternate;
}

@keyframes hover {
  0% {
    transform: translateY(3px);
  }
  100% {
    transform: translateY(-3px);
  }
}

/*Error*/

/*New concept*/
#section3{display: none;}
/*New Concept*/

.addnew .container{max-width: 900px;}



#new_data .heading.name_header, #admin_data .heading.name_header{width:170px !important;}


/*Loader*/
#loader{
    background: #FFFFFF;
    text-align: center;
    width: 100%;
    position: absolute;
    top: 0;
    height: 100%;
}

#container-loader {
  color:#999;
  text-transform: uppercase;
  font-size:36px;
  font-weight:bold;
  padding-top:200px;
  position:fixed;
  width:100%;
  bottom:45%;
  display:block;
}

#flip {
  height:50px;
  overflow:hidden;
}

#flip > div > div {
  color:#fff;
  padding:4px 12px;
  height:45px;
  margin-bottom:45px;
  display:inline-block;
}

#flip div:first-child {
  animation: show 5s linear infinite;
}

#flip div div {
  background:#42c58a;
}
#flip div:first-child div {
  background:#4ec7f3;
}
#flip div:last-child div {
  background:#DC143C;
}

@keyframes show {
  0% {margin-top:-270px;}
  5% {margin-top:-180px;}
  33% {margin-top:-180px;}
  38% {margin-top:-90px;}
  66% {margin-top:-90px;}
  71% {margin-top:0px;}
  99.99% {margin-top:0px;}
  100% {margin-top:-270px;}
}

.anote-text {
  position:fixed;
  width:100%;
  bottom:30px;
  font-size:12px;
  color:#999;
  margin-top:200px;
}
.heart{
  color: #dc143c;
}
/*Loader*/


#change_pwd{
background-color: rgba(0, 0, 0, 0.4);
position: fixed;
width: 100%;
height: 100%;
top: 0;
left: 0;
 display: none; 
z-index: 9999999;
}
#change_pwd .container{
      max-width: 500px;
}
.model_box{
  background: #fff;
padding: 20px 30px;
top: 10%;
position: absolute;
width: 500px;
}
