
/*=====ITEMS=====*/

.ps-body {
	width:auto;
	font-family: Verdana, Arial, sans-serif;
}

.ps-header{
	height:60px;
	width:auto;
	z-index:1;

}

.ps-footer{
	position:fixed;
	bottom:0px;
	height:42px;
	width:99%;
	z-index:2;
  background-color:#fff;
	border-top: 2px solid var(--ps-main-color);
}

.ps-stiky-top-120{
	position:-webkit-sticky;/*Safari*/
	position:sticky;
	top:120px;
	z-index:0;
}

.ps-stiky-top-105{
	position:-webkit-sticky;/*Safari*/
	position:sticky;
	top:105px;
	z-index:0;
}

.ps-stiky-top-50{
	position:-webkit-sticky;/*Safari*/
	position:sticky;
	top:51px;
	z-index:0;
}

.ps-stiky-top-0{
	position:-webkit-sticky;/*Safari*/
	position:sticky;
	top:0px;
	z-index:0;
}


.ps-page{
	
	width:94%;
	min-height:100%;
	margin:10px auto;
	display:block;
	padding:20px 15px 50px 15px;
	background-color:#eaeaea;

}
.ps-usr-info-container{
	width:360px;
	background-color:#fff;
	padding:10px;
	box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
	border-radius:5px;
}

.ps-container{
	width:auto;
	background-color:#fff;
	padding:10px;
	box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);	
}

.ps-small-container{

	width:360px!important;

}
.ps-button-container{
	min-height:45px;
	width:94%;
	margin:0px auto;
	display:block;
	padding:5px 15px 5px 15px;
  background-color:#fff;
	border-bottom: 1px solid var(--light-gray);
	z-index:1;

}

.ps-header-container{
	min-height:50px;
	width:auto;
  margin:0px auto;
  background-color:#fff;
	border-bottom: 2px solid var(--ps-main-color);
	z-index:1;

}
.ps-input{
    	width: 100%;
	font-size:16px;
    	padding: 5px 0px 5px 5px;
    	background-color:transparent;
    	border-bottom: 1px solid var(--ps-light-color);
    	color:#333; 	
}

.ps-usr-info-input{
    	width:100%;
	    font-size:18px;
    	padding: 3px 5px 3px 5px;
    	border:none;
    	background-color:transparent;
    	border: 1px solid var(--ps-light-color);
    	color:#333;
}

.ps-time-input{
	border: none;
	width: auto;
	font-size:16px;
	background-color:transparent!important;
	color:#000;
}

input[type=radio]{
    height:18px;
    width:18px;
}
input[type=radio]:checked{
    height:25px!important;
    width:25px!important;

}

.ps-input-radio{

    width:3%!important;
    text-align:center;
    border-right:1px solid #ccc;

}

.ps-width-15pc{

	width:15%!important;
}

.ps-width-10pc{

	width:10%!important;
}

.ps-thin-line{
	height:1px;
	border:none;
	background-color:gray;
	margin-bottom:0;
}

.ps-border-1{

	border: 1px solid var(--ps-light-color)!important;

}

.ps-border-none{

	border:none!important;

}

.ps-border-bottom{
	border:none;
	border-bottom: 1px solid var(--ps-light-color)!important;

}

.ps-button{
    	text-align:center;
    	cursor: pointer;
	font-size:16px;
	color:#fff;
	height:40px;
	margin-top:5px;
	padding:0 15px 0 15px;
	border: 2px solid var(--ps-main-color);
	background-color:var(--ps-main-color);
	border-radius:4px;

}

.ps-large-button{

	padding-left:15%!important;
	padding-right:15%!important;
}

.ps-button:hover,.ps-button:focus{

	background-color:#ddd;
	color:#000;
}


.ps-button:disabled{

	background-color:#ccc;
	border: 2px solid #ccc;
	color:#999;
}

.ps-dim-220x60{

	width:180px;
	height:50px!important;
}

.ps-dim-40x40{

	width:40px;
	height:40px!important;
}

.ps-dim-80x40{

	width:80px;
	height:40px!important;
}

.ps-label{
	color:#444;
	padding:12px;
	float:left;
}


.ps-icon{
	color:var(--ps-light-color);
	font-size:20px;
}

.ps-mnu-container{

	text-align:center;
	color:#000;
	font-size:16px;
	margin-top:15px;
	width:300;
	min-height:100px;
	padding:0 5px 15px 10px;
	background-color:#fff;
	border: 1px solid #ccc;
	box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
	border-radius:5px;
		
}

.ps-mnu-icon{
	width:50px;
	color:var(--ps-main-color);
	font-size:24px;
	text-align:center;
}

.ps-nav-icon{
    	cursor: pointer;
	color:#fff;
	font-size:24px;
	text-align:center;

}

.ps-mnu-item{
	font-size:20px;
	width:150px;
	text-align:center;
	color:#fff;
	background-color:var(--ps-main-color);
	border: 2px solid var(--ps-main-color);
	border-radius:4px;
	padding:5px 0px 5px 0px;

}
.ps-mnu-item:hover,.ps-mnu-item:focus{
	color:#000!important;
	background-color:#ddd;
}

.ps-time{
	width:385px;
	margin-top:30px;
	font-size:80px;
	text-align:center;
	color:#000;
	background-color:transparent;
}

.ps-date{

	width:350px;
	font-size:30px;
	text-align:center;
	padding-top:5px;
	padding-bottom:5px;
	color:#000;
	background-color:#transparent;
}

.ps-tooltip{

	text-align:center;
	background-color:#afd147;
	margin-top:50px;
 	color:#000;
 	padding-top:10px;
 	padding-bottom:15px;
 	word-wrap:break-word;
 	border-radius:10px;display:none;
 	
 }

/*=====NAVIGATION BARE=====*/

.ps-nav-bar{

	position:-webkit-sticky;/*Safari*/
	position:sticky;
	top:0px;
	width:100%;
	margin-top:0px;
	z-index:2;
}

.ps-nav-bar > ul {

  list-style-type: none;
  margin:0;
  width:100%;
  padding: 0;
  overflow: hidden;
  background-color: var(--ps-main-color);

}

a {
	text-decoration:none;

}

li {
	float:left;
}

li > i, a, .ps-dropbtn{

	display: block;
	color:#fff;
	text-align:center;
	padding: 14px;
	text-decoration:none;
	
}

li > i:focus,i:hover, a:focus,a:hover, .ps-dropdown:hover, .ps-dropbtn:hover,.ps-dropbtn:focus{
	
	background-color:#eaeaea!important;
	color:#000;
	cursor: pointer;
}

li.ps-dropdown {
  display: inline-block;
}


.ps-dropdwn-button{
  text-align:center;
  cursor: pointer;
	font-size:16px;
	color:#fff;
	height:40px;
	margin-top:5px;
	padding:0 15px 0 15px;
	border: none;
	background-color:transparent;

}


.ps-dropdown-content {

  display: none;
  position: absolute;
  background-color: #f9f9f9;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.8);
  z-index:0;
}


.ps-dropdown-content a {
  color: #333;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  text-align: left;
}


.ps-dropdown:hover .ps-dropdown-content {
  display:block;
}


/*=====KEYPAD=====*/

.ps-keypad-container-old{

	width:100%;
	height:auto;
	background-color:#ddd;
	padding:5px auto;
}

.ps-grid-keypad{

  display: grid;
  grid-template-columns: auto auto auto;
	grid-row-gap:0px;
	grid-column-gap:0px;
	width:300px;
	box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);

}

.ps-grid-key{
	background-color:#fff;
	border:none;
	padding:0px;
	font-size:20px;
	text-align:center;

}

.ps-key{

	padding:0px;
	font-size:35px;
	color:#000;
	text-align:center;
	border:none;
	width:100px;
	height:77px;
	background-color:#fff;
}

.ps-grid-display{

	display: grid;
	grid-template-columns: auto auto auto auto auto;
	width:300px;
	background-color:transparent!important;
}

.ps-grid-digit{
	background-color:transparent!important;
	border:none;
	padding:0px;
	font-size:20px;
	text-align:center;
}

.ps-digit{

	padding:0px;
	font-size:50px;
	color:#000;
	text-align:center;
	border:none;
	width:50px;
	height:50px;
	background-color:#fff;
	box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.1);
}

.ps-keypad-display-old{

	width:100%;
	background-color:#ddd;
	font-size:45px;
	padding:10px;
	border:none;
}

.ps-key:hover {
        border:2px solid var(--ps-main-color);
	color:var(--ps-main-color);
}

/*=====TABLE=====*/

table {
  font-family: arial, sans-serif;
  border-collapse: collapse;
  width: 100%;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  border: 1px solid #ccc;
}
.ps-table-header{
	height:40px;
	background-color:var(--ps-main-color);
	color:#fff!important;
	border: 1px solid #ccc;
  text-align:left;
  padding-left:10px
}

.ps-table-header2{

  height:35px;
  text-align:center;
  width:15%;
  font-size:16px;
  border-top:1px solid  #ccc;//none;
}

.ps-table-data2{
  height:40px;
  text-align:center;
  font-size:25px;
  border:none;
}

.ps-table-data{
  height:45px;
  text-align:left;
  padding-left:10px;
  border:none;
  border-right:1px solid #ccc;
}

tr:nth-child(odd) {
  background-color: #fff;
  color:#000;
}

.ps-tdt{
  border: none;
  width: auto!importante;
  background-color: #000;

}

.ps-tbl-input{
    	width: 100%;
	font-size:16px;
    	background-color:transparent;
    	color:#000;
	border:1px solid #d5d5d5;
}

.ps-tbl-time-input{
  width: 80px;
  font-size:16px;
  background-color:transparent!important;
	border:1px solid #d5d5d5;
  float:left;
}

.ps-tbl-date-input{
width: 150px;
  font-size:16px;
  background-color:transparent!important;
	border:1px solid #d5d5d5;
  float:left;
}

/*=====MODAL=====*/
.ps-modal{
	z-index:3;
	display:none;
	position:fixed;
	left:0;top:0;
	width:100%;
	height:100%;
	overflow:auto;
	background-color:rgba(0,0,0,0.5);
	padding-top:20px;
	
}

.ps-modal-window{
	margin:auto;
	position:relative;
	padding:10px;
	outline:0;
	width:300px;
	height:auto;
	background-color:#fff;
	border:1px solid var(--ps-main-color);
	border-radius:4px;
	box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
	word-wrap:break-word;
}

.ps-modal-container:after{
	content:"";
	display:table;
	clear:both
}

.ps-modal-container:before{
	content:"";
	display:table;
	clear:both
}

.ps-modal-container{
	padding: 5px;
	word-wrap:break-word;
}


.ps-modal-error{

	background-color:#f08080!important;//LightCoral
	border:1px solid #f08080!important;//LightCoral

}

.ps-modal-success{

	background-color:#afd147!important;//Aquamarine
	border:1px solid #afd147!important;//Aquamarine

}

.ps-modal-close-btn{
   	padding: 0px 10px ;
    	text-decoration: none;
    	font-size:28px;
    	display:inline;
    	color:#333!important;
    	position:absolute!important;
	right:0!important;
	top:0!important;
}

.ps-modal-close-btn:hover{

	background-color:#f00!important;
	color:#000!important;
	cursor:pointer;
	border:1px solid #f00!important;

}


.ps-modal-icon{
	font-size:60px;
	margin:10px auto;
	text-align:center;
}


.ps-modal-text-msg{
	font-size:16px;
	margin:15px auto;
	text-align:center;
	line-height:1.2;


}

.ps-modal-text-footer{
	font-size:12px;
	color:#000;
	margin:15px auto;
	text-align:center;
}

.ps-fixed-up-left{
	position:relative;
	top:200px;
}

.ps-animate-top{
	position:relative;
	top:60px;
	animation:animatetop 0.7s
}

@keyframes animatetop{
	from{top:-350px;opacity:0} to{top:60px;opacity:1}
}
	
.ps-animate-bottom{
	position:relative;
	animation:animatebottom 0.7s
}

@keyframes animatebottom{
	from{bottom:-300px;opacity:0} to{bottom:0;opacity:1}
}

.ps-animate-zoom {
	animation:animatezoom 0.7s;
	margin-top:200px;
}

@keyframes animatezoom{
	from{transform:scale(0)} to{transform:scale(1)}}


/*====TEXT=====*/
.ps-text-head{
	font-size:30px;
	color:var(--ps-main-color);
	margin-top:0px;
	background-color:#fff;
	padding-left:15px;
	padding-bottom:5px;
	border-bottom:2px solid var(--ps-main-color);

}

.ps-text-header{
	width:150px;
	display:inline-block;
	font-size:30px;
	color:var(--ps-main-color);
	margin:5px 0 0 15px;
	background-color:#fff;

}

.ps-text-footer{
	font-size:12px;
	color:var(--ps-main-color);
	float:left;
	margin-left:15px;
	background-color:transparant;
}

.ps-text-title{
	font-size:24px;
	color:black;
	margin-top:0;
}

.ps-text-info{
	font-size:18px;
}

.ps-text-center{

	text-align:center!important;

}

.ps-text-size-35{

	font-size:35px!important;

}

.ps-text-size-20{

	font-size:20px!important;

}

/*=====GEOMETRIC====*/

.ps-round{
	font-size:25px;
    	background-color: var(--ps-main-color);
    	border: 3px solid #fff;
    	border-radius: 50%;
	height:130px;
	width: 130px;
}

.ps-round-small{
	font-size:35px;
    	background-color: #f00;
    	border: 3px solid #fff;
    	border-radius: 50%;
	height:60px;
	width: 60px;
}
/*=====POSITION=====*/

.ps-margin-top-12{
	
	margin-top:12px!important;
}

.ps-margin-top-25{
	
	margin-top:25px!important;
}
.ps-margin-top-50{

	margin-top:50px!important;
}

.ps-margin-top-75{

	margin-top:75px!important;
}


.ps-margin-top-100{

	margin-top:100px!important;
}

.ps-margin-top-125{

	margin-top:125px!important;
}

.ps-margin-top-150{

	margin-top:150px!important;
}

.ps-margin-top-200{

	margin-top:200px!important;
}

.ps-margin-top-175{

	margin-top:175!important;
}

.ps-margin-top-40pc{

	margin-top:40%!important;
}

.ps-margin-left-40pc{

	margin-left:40%!important;
}

.ps-position-middle{

	position:relative;
	top:0%;
	left:50%;
	transform:translate(-50%,0%);
	display:block;

}

.ps-position-left{

	float:left;
	margin-left:50px;
	
}

.ps-position-right{

	float:right;
	margin-right:50px;

}

.ps-grid-container {
  display: grid;
  grid-template-columns:  50% 150px;
  background-color: transparent;
  margin-bottom:25px;
  grid-row-gap:20px;
}


.ps-grid-item {

  background-color: transparent;
  padding-left: 20px;

}
/*=====COLORS=====*/
:root {
	--light-gray: #ddd;
  --white:#fff;
	--dark-gray: #555;
	--light-blue: #9ec8ff;
	--dark-blue: #174077;
	--medium-blue: #174077;
	
	--purple-blue: #7282cb;
	--light-cyan: #87CEEB;
	--amber: #ffc107;
	--aqua: #00ffff;
	--light-green: #8bc34a;
	--indigo: #3f51b5;
	--khaki: #f0e68c;
	--purple: #9c27b0;
	--deep-purple:#673ab7;
	--sand:#fdf5e6;
	--teal:#009688;
	--teal-inv:#ff6977;
	--orange:#ff9800;
	
	--ps-light-color: #aaa;
	--ps-medium-color: #666;
	--ps-dark-color:#333;
  --ps-main-color:var(--teal);
}

.ps-light{

	background-color:#f9f9f9!important;

}

.ps-gray{

	background-color:#bbb!important;

}

.ps-border-all-white{

	border: 1px solid #fff!important;
}

.ps-gradient-color{

	//background-image:linear-gradient(var(--ps-medium-color),var(--ps-light-color))!important;

	background-color:#white;
}

.ps-background-white{

	background-color:#fff!important;
}


::placeholder{

	color:#444!important;
	//opacity:0.6;
	z-index:0!important;
}


:-ms-input-placeholder{/*IE 10, 11*/

	color:#000!important;
	//opacity:0.6;
}

::-ms-input-placeholder{/*Microsoft, Edge*/

	color:#000!important;
	//opacity:0.6;
}



