/* @import url('https://fonts.googleapis.com/css2?family='Indie Flower', Quicksand:wght@500&display=swap'); */
/* @import url('https://fonts.googleapis.com/css2?family='Indie Flower', Quicksand:wght@300&display=swap'); */
/* @import url('https://fonts.googleapis.com/css2?family=Indie+Flower&display=swap'); */

/* @font-face {
  font-family: 'ait';
	font-size: 10px;
  src: url('http://localhost/cp/admin/fonts/IndieFlower-Regular.ttf'),
 } */
 @import url('https://fonts.googleapis.com/css2?family=Nova+Mono&display=swap');

 @import url('https://fonts.googleapis.com/css2?family=Harmattan&display=swap'); /* mrqc  snswers */

 @font-face {
   font-family: 'ait';
   src: local("☺"),
   url("../fonts/IndieFlower-Regular.ttf") format("truetype");
	 unicode-range : 0000−007F;
   font-weight: normal;
   font-style: normal;
 	 font-size: 10px;
 }

 @font-face {
   font-family: 'ait';
   src: local("☺"),
	 url("../fonts/nassim-regular.ttf") format("truetype");
	 unicode-range: 0600−06FF;
   font-weight: normal;
   font-style: normal;
 	 font-size: 20px;
 }


#dg {
	width:95%;
	border:1px;
	border-color:#0000CC;
	border-collapse:separate;
     border-spacing:1px 1px;
	text-align:center;

	margin-left: auto;
	margin-right: auto;
	font-family: ait;
}

.confirmmsg {
	font-family: ait;
	color:#006600;
	font-size:12px;
	height:60px;
	background-color:green;
	padding:10px;
	margin:10px;

	margin-left: auto;
	margin-right: auto;

   -moz-border-radius-topleft:15px;
  -moz-border-radius-topright:15px;
 -moz-border-radius-bottomleft:15px;
 -moz-border-radius-bottomright:15px;
}


.errormsg{
	font-family:'Indie Flower', Quicksand;
	color:#FF0000;
	font-size:12px;
	height:60px;
	background-color:#FFE6E6;
	padding:10px;
	margin:10px;

   -moz-border-radius-topleft:15px;
  -moz-border-radius-topright:15px;
 -moz-border-radius-bottomleft:15px;
 -moz-border-radius-bottomright:15px;
}

#dg tr{
	background-color:#CAE5FF;
	border-bottom: inset 1pt;
	border-bottom-color:#FFFFFF;
	font-family: ait, Quicksand;
	font-size:12px;
	height:25px;
}

#dg tbody tr:hover{
background-color:#F3F3F3;
}

#dg td{
}

#dg th {
	background-color:#004080;
	font-family: ait;
	color:#FFFFFF;
	cursor:auto;
}




field {
background-color:#00CCCC;
}
#addform {

}

#addform lable {
    background-color:#006699;
    font-family: Harmattan, ait;
    font-size:12px;
    font-weight:bold;
    color:#FFFFFF;
}

#addform th {
background-color:#006699;
font-family:'Indie Flower', Quicksand;
font-size:14px;
font-weight:bold;
color:#FFFFFF;
height:25px;
}


#addform #ftd {
background-color:#E8E8FF;
font-family:'Indie Flower', Quicksand;
font-size:12px;
font-weight:bold;
color:#FFFFFF;
width:300px;
}

.main_tbl {
	font-family: 'Indie Flower', Quicksand;
	font-size: 13px;
	background-color: #9FE2FA;
	text-align:left;

  /*-moz-border-radius-topleft:15px;*/
 /*-moz-border-radius-topright:15px;*/
 -moz-border-radius-bottomleft:15px;
 -moz-border-radius-bottomright:15px;
}


#cls_btn{
	float:left;
	cursor:pointer;
}


.admin_lnk_style{
	font-family: 'Indie Flower', Quicksand;
	font-size: 13px;
	color:#666666;
	background-color:#E4FFC8;
	text-align:right;
	font-weight:bold;
	height:30px;
	padding:20px;

   -moz-border-radius-topleft:15px;
  -moz-border-radius-topright:15px;
 -moz-border-radius-bottomleft:15px;
 -moz-border-radius-bottomright:15px;
}

.error_tbl {
	font-family: 'Indie Flower', Quicksand;
	font-size: 13px;
	background-color: #FFBBBB;
	text-align:left;
	height:50px;

  -moz-border-radius-topleft:15px;
  -moz-border-radius-topright:15px;
 -moz-border-radius-bottomleft:15px;
 -moz-border-radius-bottomright:15px;  ;
	color: #FF0000;
}

.ok_tbl {
	font-family: 'Indie Flower', Quicksand;
	font-size: 13px;
	background-color: #C4FFC4;
	text-align:left;
	height:50px;

  -moz-border-radius-topleft:15px;
  -moz-border-radius-topright:15px;
 -moz-border-radius-bottomleft:15px;
 -moz-border-radius-bottomright:15px;  ;
	color: #00CC00;
}


.slv_sml_txt {
	font-family: 'Indie Flower', Quicksand;
	font-size: 9px;
	color: #999999;
}

.footer_tbl {
	font-family: 'Indie Flower', Quicksand;
	font-size: 11px;
	background-color: #7ED6F9;
	text-align:left;

   -moz-border-radius-topleft:15px;
  -moz-border-radius-topright:15px;
 -moz-border-radius-bottomleft:15px;
 -moz-border-radius-bottomright:15px;
	color: #999999;
}



.menu_tbl {
	font-family: 'Indie Flower', Quicksand;
	font-size: 11px;
	background-color: #086F9C;
	text-align:left;

   -moz-border-radius-topleft:15px;
  -moz-border-radius-topright:15px;
 -moz-border-radius-bottomleft:15px;
 -moz-border-radius-bottomright:15px;
	color: #999999;
}



.menu_tlt {
	font-family: 'Indie Flower', Quicksand;
	font-size: 28px;
	color: #086F9C;
}

.menu_link {
	font-family: 'Indie Flower', Quicksand;
	font-size: 14px;
	color: #FFFFFF;
	font-weight: bold;
	text-decoration:none;
	cursor:pointer;
}




 .menu_lnk {
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size: 14px;
	color: #2978A3;
	font-weight: bold;
	text-decoration:none;
}

.footer_txt {
	font-family: tahoma,Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #666666;
}

#lnk {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;

	color: #FFFFFF;
	font-weight: bold;

	cursor:pointer;
	text-shadow:  black  2px 2px 2px;
}


#lnk1 {
	font-family: tahoma, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color:#FF3300;
	font-weight: bold;

	cursor:pointer;

}


#pglnk {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color:#0000CC;
	font-weight: bold;

	cursor:pointer;
}


#title {
	font-family: tahoma, Arial, Helvetica, sans-serif;
	font-size: 14px;

	color:#086f9c;
	font-weight: bold;


}


.button{
background-color:#0099FF;
height:25px;
font-family:Verdana, Arial, Helvetica, sans-serif;
}

.err {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
color:#FF0000;
margin:2px 2px 2px 2px;
}

.vld {

	font-family: 'Indie Flower', Quicksand, tahoma,verdana;
	color:#FF0000;
	font-size:12px;
	display:inline;
    padding-right: 5px;

}





#fieldset select {
    font-family: Harmattan, ait;
    font-size: 22px;
    margin-bottom: 2px;
    padding: 2px;
    border: 1px #CCC solid;
    width: 400px;
     height: 40px;
     border-radius: 4px;
}


#fieldset input[type='checkbox'] {
     font-family: Harmattan, ait;
    font-size: 10px;
    margin-bottom: 2px;
    color: #333;
    padding: 2px;
    border: 1px #999 solid;
    width: 50px;
    height: 40px;
}




#fieldset div{

}



legend span {
          position: absolute;
          width: 40em;
          top: 0.5em; left: 1em;
          color: #000;
          font-weight: bold;
}


#fieldset textarea{
    font-family: Harmattan, ait;
    font-size: 22px;
    margin-bottom: 2px;

    padding: 2px;
    border: 1px #CCC solid;
    width: 400px;
    height: 120px;
    color: #000;
    float: right;
    border-radius: 4px;


}

input.btn {
	font-size: 22px;
	font-family: Harmattan, ait;
}



.btn_div{
margin-left:auto;
margin-right: auto;
margin-top:auto;

}




label {
	/*font-weight:bold; */
    font-family: Harmattan, 'Indie Flower', Quicksand;
    color:#000066;
    float:left;
    text-align:left;
    width:30%;
    margin-right:0.5em;
    font-size:11px;

/*    background-color: #E8E8FF;*/
    height: 35px;
    padding: 5px;
}


.list {
	font-family: Harmattan, 'Indie Flower', Quicksand;
	font-size: 14px;
	color: #ffffff;
	background-color: #086F9C;
}









.info, .success, .warning, .error___, .validation {
border: 1px solid;
margin: 30px;
padding:15px 100px 15px 50px;
background-repeat: no-repeat;
background-position: 10px center;

font-family: Harmattan, 'Indie Flower', Quicksand;
font-size: 12px;
}


/* .info {
color: red;
background-color: #BDE5F8;
background-image: url('../imgs/info.png');

}
.success {
color: blue;
background-color: #f0f8f8;
/* background-image:url('../imgs/success.png'); */
/* } */
/* .warning {
color: #9F6000;
background-color: #FEEFB3;
background-image: url('../imgs/warning.png');
} */
/* .error {
color: #D8000C;
background-color: #FFBABA;
background-image: url('../imgs/error.png');

} */

.inner_warning {

border: 1px solid;
margin: 5px;
padding:15px 60px 15px 50px;
background-repeat: no-repeat;
background-position: 10px center;

font-family: Harmattan, tahoma,verdana,Arial;
font-size: 12px;
color: #9F6000;
background-color: #FEEFB3;
background-image: url('../imgs/warning.png');

}



#amenu{
      padding-left:1em;
      margin-left:1em;
      padding-top: 40px;

     background: url(../imgs/sp.png) no-repeat left;

     height: 120px;
}



#amenu .name{

        Harmattan, font-family:  Tahoma, Arial, Helvetica, sans-serif;
	font-size: 13px;
        font-weight: bold;
	color: #FFFFFF;
	cursor:pointer;
	text-shadow: black  2px 2px 2px;
        margin-top: 20px;

}

#amenu img{
    border: 0px;
    cursor:pointer;
}
#amenu .icon{


}

#menu_box div{
    display: inline-block;

}
#menu_box{
	font-size: 13px;
	background-color: #086f9c;

        width: 100%;

        margin-left: auto ;
        margin-right: auto ;

   -moz-border-radius-topleft:15px;
  -moz-border-radius-topright:15px;
 -moz-border-radius-bottomleft:15px;
 -moz-border-radius-bottomright:15px;
}


#pop_bar{
    font-family: Helvetica, verdana, tahoma;
    font-size: 13px;
    color: #0797eb;
    padding:5px;
}











#sp_form label {
    width: 130px;
 }




#sp_button {

 }


#sp_button li {
    width: 60px;
    height: 30px;
    background-color: #003ea3;
    color: #fff;
    padding: 6px;
    list-style: none;
    margin: auto;
    display: inline-block;
    font-family: 'Indie Flower', Quicksand, 'Indie Flower', Quicksand;
    font-size: 22px;
    text-align: center;

    border-radius: 6px;
    box-shadow: 1px 2px 2px #ccc;

}


#sp_button li a{
    text-decoration: none;
    color: #fff;
}


.canceled, .hight {

    font-size: 15px;
    color: red;
}

.not_started {

    font-size: 15px;
    color: darkslategray;
}


.in_progress {

    font-size: 15px;
    color: blue;
}


.done {

    font-size: 15px;
    color: green;
}


.low {

    font-size: 15px;
    color: #e5b800;
}


.normal {

    font-size: 15px;
    color: green;
}



.pending {
    font-size: 15px;
    color: #e5b800;
}

.approved {
     font-size: 15px;
    color: green;
}

.rejected {
     font-size: 15px;
    color: red;
}


/* Clean style below */

@import url('https://fonts.googleapis.com/css?family='Indie Flower', Quicksand');


/* @font-face {
  font-family: "'Indie Flower', Quicksand";
  src: url("../fonts/nassim-regular.eot");
  src: local("☺"),
    url("../fonts/nassim-regular.woff") format("woff"),
    url("../fonts/nassim-regular.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
} */



/* page */
body{
    margin: 0;
    height: 100%;
    font-family: ait;
    font-size: 16px;
    direction: ltr;
    width: 100%;
    margin: auto;
}
/* --- */

/* Header */


.logo {
    font-size:40px;
    float: left;
    padding-top: 20px;
    width: 60%;
}


#header {
    background: #000000 ; /* 006666;  aedada 33b1be*/ 
    /* background-image:url('../images/orang-bg.png'); */
		background-image:url('../images/console.png');


    background-repeat:no-repeat;
    height: 80px;
    /* border-bottom: orange 0px solid; */
    /* box-shadow: 1px 1px 1px; */

    font-family: 'Indie Flower', Quicksand;
    color: #000;
		/* 006666 */
}

#header ul {
/*    margin-top: 0px;*/
}

#header li {
    width: 100px;
    background-color: rgb(231, 217, 37); /* #49aeff */

    list-style: none;
    margin: 5px;
    padding: 5px;
    border-radius: 6px;
    text-align: center;
/*    box-shadow: 1px 2px 2px #FFF;*/
    font-size: 22px;
    font-family: ''Indie Flower', Quicksand';
     border: 1px solid #000;
    text-decoration: none;
}

#header li:hover {
  border: 1px solid #EEE;
}

#header li a:hover {
    color: #000;
   text-decoration: none;
 }

#header li a {
    color: #000;
    text-decoration: none;
}


.side-menue {
  float: left;
  /* margin: auto; */
  width: 15%;
	background-color: #74bf4b ; /* f0f7f7 |   rgb(51, 177, 190) */ 
	padding-top: 15px;
  height: 100%;
}



.contents {

	float: right;
	margin: auto;
	width: 80%;
  padding-top: 30px;
  padding-bottom: 50px;
	/* display: inline; */
	/* background-color: #f0f7f7; */
/* margin-bottom: 40px; */
}

/* --- */


/* Side Menue */

/* aedada */

#top_menu {
    font-family: Harmattan, 'Indie Flower', Quicksand;
    font-size: 26px;
    /* font-weight: bold; */
    color: #FFF;
    list-style: none;
	  /* margin: 10px; */
	  /* margin-bottom: 20px; */
    cursor: pointer;
}

 


#top_menu li { 

    width: 240px ;
		padding: 4px;
		margin: 2px;
    /* margin-left: -20px; */
    padding-left: 8px;
    
    
    font-size: 22px;
    /* border: 1px solid #FFF; */
    background-color: #393939;  /* aedada */
    color: #ffffff;
		font-family: Harmattan, monospace;    /* Harmattan */
		border-radius: 2px;
		 
     list-style: none;
     cursor: pointer;
     border-radius: 4px;

}


#top_menu li:hover {

  background-color: rgb(52, 52, 52); 
     color: #000000;
     /* border-bottom: 2px solid white; */
     border-left: 5px solid red;
     padding-left: 12px;
     border-radius: 4px;

}

#top_menu  li a {
    text-decoration: none;
    cursor: pointer;
    color: #FFFFFF;   
}

/* #top_menu  li a:hover {
  color: #000000; 
   background-color: rgb(52, 52, 52); 
    
} */

 .mainMenue {
  background-color: #000000;
  margin: 3px;
  padding-left: 10px;
  padding-right: 10px;
  
 }

 .mainMenue:hover {
  background-color: #006699;
 }


/* Fotter */
#footer {

    color: #333;

		text-align: center;
    border-top: #ccc 1px solid;
    font-family: Harmattan, 'Indie Flower', Quicksand;
    font-size: 18px;
		font-weight: bold;
    background-color: #EEE;
		height: 50px;
    clear: both;
    width: 100%;
    bottom: 0;
    margin-top: 20px;
 
 
  }
/* --- */




/* Messages */
.message {
  margin: auto;
  width: 94%;
  direction :ltr;
  text-align: center;
  padding: 20px;
  font-family:  Harmattan, Quicksand;
  font-size : 24px;
  /* font-weight: bold; */
  border-radius: 8px;
  border: 2px solid;
}

.success {
  background-color: #f0f8f8;
  color: #006666;
  border-color: #006666;
	margin-top: 40px;
}

.error {
  background-color: #fff6f4;
  color: #a10000;
  border-color: #ff8367;
	margin-top: 40px;
}

/* --- */


/* Field set */

#fieldset {

	 direction: ltr;
  	font-family: Harmattan,'Indie Flower', Quicksand;

	 border: 1px solid #aedada;
	 border-radius: 10px;
	 background-color: #f0f7f7;
    width: 80%;
 	 /* font-size: 20px; */

}


#fieldset label {
	font-family: Harmattan, 'Indie Flower', Quicksand;
    font-size: 30px;


    color: #000;
     color: #333;
    margin-left: 5px;
    height: 45px;
    padding:1px;
    width: 220px;
}


#fieldset legend {

	font-size:26px;
	font-family: Harmattan,'Indie Flower', Quicksand';

        padding: 10px;
        padding-left: 30px;
   			padding-right: 30px;

        margin: 10px;
        color: #333;

       margin-left: 30px;
       background-color: #aedada;
       /* box-shadow: 1px 1px 2px #888; */
			 border-radius: 10px;


}


#fieldset input {

    font-family: Harmattan, ait;
    font-size: 24px;
    margin-bottom: 2px;

    padding: 4px;
    border: 1px #CCC solid;
    width: 400px;
    height: 50px;
    border-radius: 4px;

}




#fieldset .btn {
    font-family: Harmattan, 'ait';
    padding: 4px;
    width: 120px;
    margin: 5px;
    /* box-shadow: 1px 1px 2px; */

		font-size: 30px;
		background-color: #006666;
		border-radius: 10px;
		color: #FFF;
}

#FormDiv div{
       min-width: 400px;
    margin: auto;  
 }
 
/* --- */



.addAnswer {
	padding-right: 10px;
	padding-left: 10px;
	font-size: 30px;
	background-color: #006666;
	border-radius: 10px;
	color: #FFF;
	cursor: pointer;
	user-select: none;
}

.addAnswer:hover {
	background-color: #CCC;
	color: #000000;
}

.addAnswer:active {
  background-color: #aedada;
	color: #000000;
}

.removeAnswer {
	padding-right: 10px;
	padding-left: 10px;
	font-size: 30px;
	background-color: red;
	border-radius: 10px;
	color: #FFF;
	cursor: pointer;
}


.instruction {
	padding: 4px;
 	font-size: 16px;
	background-color:#f4eec6;
	border-radius: 4px;
	color: black;
}


.image_box img {
	max-width: 400px;
}

.pagination {

}

.pagination_disable {
background-color: #EEE;
cursor: not-allowed;
  opacity: 0.5;
}

.pagination a {
	/* padding-right: 15px;
	padding-right: 15px; */
	margin: 6px;
  padding: 10px;
	display: inline-block;
 	text-align: center;
color #999;
 	font-size: 20px;
	font-weight: bold;

	background-color: #aedada; /* f0f7f7 */
	font-family: Harmattan, 'Indie Flower', Quicksand;
	text-decoration: none;

	border: 1px solid #aedada;

	border-radius: 6px;
}

.pagination a:hover {
	background-color: #f0f7f7;
}



#formMessages {
  display: block;
  margin: auto;
  width: 94%;
  direction :ltr;
  text-align: center;
  padding: 20px;
  font-family: Harmattan, 'Indie Flower', Quicksand;
  font-size : 24px;
  font-weight: bold;
  border-radius: 8px;
  border: 2px solid;
  background: #f9cccc;
}
 

/* Status / Active  */
.active {
  font-size: 18px;
  color: green;
}

.pending {
  font-size: 18px;
  color: orange;
}

.review {
  font-size: 18px;
  color: orangered;
}


.deleted {
  font-size: 18px;
  color: red;
}