@import url('https://fonts.icrypt.co.ke/fonts.css');
@import url('fontawesome-all.css');
/*@import url('animate.css');
@import url('loader.css');*/
html{box-sizing:border-box}*,*:before,*:after{box-sizing:inherit}
html,body{width:100%; margin:0; font-weight:400;}
button,input,textarea{ font-weight:400; font-family:inherit;line-height:120%;}
textarea{resize:none; font-family:inherit;}
progress::-webkit-progress-bar { background:#fff;}
progress::-moz-progress-bar { background:#fff;}
p{margin:0;}
.router{width:100%; float:left;}
.pz-tall{height:100vh;}
.pz-input{border:1px solid #377d7a; height:45px; text-indent:10px;}
.pz-a{text-decoration:none; color:inherit;}.pz-b{font-weight:bold;}.pz-i{font-style:italic;}.pz-u,.pz-hover-u:hover{text-decoration:underline;}.pz-n{font-weight:normal;}.pz-point{cursor:pointer;}
.pz-btn{border:none;display:inline-block;outline:0;padding:6px 16px;vertical-align:middle;overflow:hidden;color:#fff;background-color:#000;text-align:center;cursor:pointer;white-space:nowrap;}
.pz-btn-full{border:none; width:100%; display:inline-block;outline:0;padding:6px 0;vertical-align:middle;overflow:hidden;color:#fff;background-color:#000;text-align:center;cursor:pointer;white-space:nowrap;}
.pz-btn-big{border:none; display:inline-block;outline:0;padding:10px 0;vertical-align:middle;overflow:hidden;color:#fff;background-color:#000;text-align:center;cursor:pointer;white-space:nowrap;}
.pz-btn-big-full{border:none; width:100%; display:inline-block;outline:0;padding:10px 0;vertical-align:middle;overflow:hidden;color:#fff;background-color:#000;text-align:center;cursor:pointer;white-space:nowrap;}
.pz-btn-gg{color:#fff; background:#1a73e8;}
.pz-btn-pz{color:#fff; background:#377d7a;}
.pz-btn:disabled{cursor:not-allowed;opacity:0.3}
:disabled *{pointer-events:none; cursor:not-allowed; opacity:0.3}
.pz-fixed{position:fixed;} .pz-absolute{position:absolute;}
.pz-top,.pz-bottom{position:fixed;width:100%;z-index:5;}.pz-top{top:0}.pz-bottom{bottom:0}.pz-block{display:block;}.pz-inline{display:inline-block;}.pz-flex{display:flex;}
.pz-overlay{position:fixed;display:none;width:100%;height:100%;top:0;left:0;right:0;bottom:0;background-color:rgba(0,0,0,0.5);z-index:2}
.pz-text-left{text-align:left;} .pz-text-right{text-align:right;} .pz-text-center{text-align:center;}
.pz-circle{border-radius:50%}
.pz-radius{border-radius:4px;}
.pz-radius-8{border-radius:8px;}
.pz-radius-10{border-radius:10px;}
.pz-radius-12{border-radius:12px;}
.pz-radius-16{border-radius:16px;}
.pz-radius-24{border-radius:24px;}
.pz-radius-32{border-radius:32px;}
.pz-radius-round{border-radius:30px;}
.pz-hide-scrollbar{-ms-overflow-style:none; scrollbar-width:none;} .pz-hide-scrollbar::-webkit-scrollbar{display:none;}
.pz-bd-0{border:0}.pz-border{border:1px solid #ccc}.pz-border-pz{border:1px solid #377d7a;}
.pz-bd-top{border-top:1px solid #ccc}.pz-bd-bottom{border-bottom:1px solid #ccc}
.pz-bd-left{border-left:1px solid #ccc}.pz-bd-right{border-right:1px solid #ccc}
.pz-tiny{font-size:10px}.pz-small{font-size:12px}
.pz-medium{font-size:15px}.pz-large{font-size:18px}
.pz-xlarge{font-size:24px}.pz-xxlarge{font-size:36px}
.pz-xxxlarge{font-size:48px}.pz-jumbo{font-size:64px}
.pz-parallax{background-attachment: fixed;background-position:top; background-repeat: no-repeat; background-size:contain;}
.pz-hide{display:none;}
.pz-icon{width:40px; height:40px; margin:5px 10px 5px 0; float:left;overflow:hidden;} .pz-iconized{width:calc(100% - 50px); float:left;}
.pz-icon-large{width:140px; height:140px; margin:0 auto; overflow:hidden;} .pz-fit-cover{width:100%; height:100%; object-fit:cover;}
.pz-margin{margin:8px}.pz-mg-0{margin:0}
.pz-margin-small{margin:4px}
.pz-mg-top{margin-top:8px}.pz-mg-bottom{margin-bottom:8px}
.pz-mg-left{margin-left:8px}.pz-mg-right{margin-right:8px}
.pz-box-shadow-silver{box-shadow:0px 0px 9px 1px silver;}
.pz-box-shadow-bottom{box-shadow:0px 0px 3px silver; border-bottom:1px solid silver;}
.pz-center{text-align:center;}
.pz-ellipsis{overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}
.pz-hover-show{display:none;}
.pz-hovered:hover > .pz-hover-show{display:block;}
.pz-pd-4{padding:4px;}
.pz-pd-8{padding:8px;}
.pz-pd-10{padding:10px;}
.pz-pd-12{padding:12px;}
.pz-pd-16{padding:16px;}
.pz-pd-24{padding:24px;}
.pz-pd-32{padding:32px;}
.pz-pd-48{padding:48px;}
.pz-pd-64{padding:64px;}
.pz-pd-128{padding:128px;}
.pz-pd-0{padding:0}
.pz-pd-top-bottom{padding-right:0; padding-left:0;}
.pz-pd-left-right{padding-top:0; padding-bottom:0;}
.pz-fading{-webkit-animation:fading 10s infinite;animation:fading 10s infinite}
@-webkit-keyframes fading{0%{opacity:0}50%{opacity:1}100%{opacity:0}}
@keyframes fading{0%{opacity:0}50%{opacity:1}100%{opacity:0}}
.pz-animate-zoom {-webkit-animation:animatezoom 0.6s;animation:animatezoom 0.6s}
@-webkit-keyframes animatezoom{from{-webkit-transform:scale(0)} to{-webkit-transform:scale(1)}}
@keyframes animatezoom{from{transform:scale(0)} to{transform:scale(1)}}
.pz-pull-left{float:left;}.pz-pull-right{float:right;}
.pz-half{width:50%;} .pz-oneThird{width:calc(100% / 3);}.pz-twoThird{width:calc(200% / 3);}
.pz-col{width:100%; float:left;}
.pz-col.auto{width: auto;} 
.pz-col.p1{width:calc(100% );} .pz-col.b1{width:calc(100% / 12);}
.pz-col.p2{width:calc(100% / 2);} .pz-col.b2{width:calc(2 * (100% / 12));}
.pz-col.p3{width:calc(100% / 3);} .pz-col.b3{width:calc(3 * (100% / 12));}
.pz-col.p4{width:calc(100% / 4);} .pz-col.b4{width:calc(4 * (100% / 12));}
.pz-col.p5{width:calc(100% / 5);} .pz-col.b5{width:calc(5 * (100% / 12));}
.pz-col.p6{width:calc(100% / 6);} .pz-col.b6{width:calc(6 * (100% / 12));}
.pz-col.p7{width:calc(100% / 7);} .pz-col.b7{width:calc(7 * (100% / 12));}
.pz-col.p8{width:calc(100% / 8);} .pz-col.b8{width:calc(8 * (100% / 12));}
.pz-col.p9{width:calc(100% / 9);} .pz-col.b9{width:calc(9 * (100% / 12));}
.pz-col.p10{width:calc(100% / 10);} .pz-col.b10{width:calc(10 * (100% / 12));}
.pz-col.p11{width:calc(100% / 11);} .pz-col.b11{width:calc(11 * (100% / 12));}
.pz-col.p12{width:calc(100% / 12);} .pz-col.b12{width:calc(12 * (100% / 12));}
.pz-w95{width:95%; margin:0 auto;}.pz-m95{width:95%; margin:0 2.5%;}.pz-p5{width:calc(100% - 10px); padding:0 5px;}
.pz-w90{width:90%; margin:0 auto;}.pz-m90{width:90%; margin:0 5%;}.pz-p10{width:calc(100% - 20px); padding:0 10px;}
.pz-w85{width:85%; margin:0 auto;}.pz-m85{width:85%; margin:0 7.5%;}.pz-p15{width:calc(100% - 30px); padding:0 15px;}
.pz-w80{width:80%; margin:0 auto;}.pz-m80{width:80%; margin:0 10%;}.pz-p20{width:calc(100% - 40px); padding:0 20px;}
.pz-w70{width:70%; margin:0 auto;}.pz-m70{width:70%; margin:0 15%;}
.pz-w50{width:50%; margin:0 auto;}.pz-m50{width:50%; margin:0 25%;}
.pz-left{float:left}.pz-right{float:right}
.pz-modal{z-index:30;display:none;padding-top:100px;position:fixed;left:0;top:0;width:100%;height:100%;overflow:auto;background-color:rgb(0,0,0);background-color:rgba(0,0,0,0.7)}
.pz-modal-content{margin:0 auto;background-color:#fff;position:relative;outline:0;width:600px}
.pz-alert{position:fixed; padding:0; overflow-y:auto; max-height:90%; top:50%; left:50%; transform: translate3d(-50%,-50%, 0);}
.pz-alert, .pz-popup {position:fixed; border-radius:5px; overflow-y:auto; max-height:90%; top:45%; left:50%; transform: translate3d(-50%,-50%, 0);}
.pz-popup{width:340px; padding:0;}
.pz-loader{position:fixed; top:0; left:0;width:100%; height:100%;display:none; }
.pz-loader-back{position:absolute; top:0; left:0;width:100%; height:100%; background:#000; opacity:.5;}
.pz-loader-content{text-align: center; position: absolute; margin: auto; top: 0; right: 0; bottom: 0; left: 0; z-index:10; opacity:1;}


.E404Message{width: 600px; margin: 0 auto;}
.E404Message div div{ margin-top: 10px;}
.E404Image img{margin-top: 25%; background:#fff; border-radius: 12px;}
.EMain{float: left; width:50%;}
.ERobot{margin-top: 15%; float: left; background: #fff; border-radius: 12px; padding: 5px;}
/**Background colors**/
.pz-bg-none{background:none;}
.pz-amber,.pz-hover-amber:hover{color:#000 ;background-color:#ffc107 }
.pz-aqua,.pz-hover-aqua:hover{color:#000 ;background-color:#00ffff }
.pz-blue,.pz-hover-blue:hover{color:#fff ;background-color:#2196F3 }
.pz-light-blue,.pz-hover-light-blue:hover{color:#000 ;background-color:#87CEEB }
.pz-brown,.pz-hover-brown:hover{color:#fff ;background-color:#795548 }
.pz-cyan,.pz-hover-cyan:hover{color:#000 ;background-color:#00bcd4 }
.pz-blue-grey,.pz-hover-blue-grey:hover{color:#fff ;background-color:#607d8b }
.pz-green,.pz-hover-green:hover{color:#fff ;background-color:#4CAF50 }
.pz-light-green,.pz-hover-light-green:hover{color:#000 ;background-color:#8bc34a }
.pz-indigo,.pz-hover-indigo:hover{color:#fff ;background-color:#3f51b5 }
.pz-khaki,.pz-hover-khaki:hover{color:#000 ;background-color:#f0e68c }
.pz-lime,.pz-hover-lime:hover{color:#000 ;background-color:#cddc39 }
.pz-orange,.pz-hover-orange:hover{color:#000 ;background-color:#ff9800 }
.pz-deep-orange,.pz-hover-deep-orange:hover{color:#fff ;background-color:#ff5722 }
.pz-pink,.pz-hover-pink:hover{color:#fff ;background-color:#e91e63 }
.pz-purple,.pz-hover-purple:hover{color:#fff ;background-color:#9c27b0 }
.pz-deep-purple,.pz-hover-deep-purple:hover{color:#fff ;background-color:#673ab7 }
.pz-red,.pz-hover-red:hover{color:#fff ;background-color:#f44336 }
.pz-sand,.pz-hover-sand:hover{color:#000 ;background-color:#fdf5e6 }
.pz-teal,.pz-hover-teal:hover{color:#fff ;background-color:#009688 }
.pz-yellow,.pz-hover-yellow:hover{color:#000 ;background-color:#ffeb3b }
.pz-white,.pz-hover-white:hover{color:#000 ;background-color:#fff }
.pz-black,.pz-hover-black:hover{color:#fff ;background-color:#000 }
.pz-grey,.pz-hover-grey:hover,.pz-gray,.pz-hover-gray:hover{color:#000 ;background-color:#9e9e9e }
.pz-light-grey,.pz-hover-light-grey:hover,.pz-light-gray,.pz-hover-light-gray:hover{color:#000 ;background-color:#f1f1f1 }
.pz-dark-grey,.pz-hover-dark-grey:hover,.pz-dark-gray,.pz-hover-dark-gray:hover{color:#fff ;background-color:#616161 }
.pz-pale-red,.pz-hover-pale-red:hover{color:#000 ;background-color:#ffdddd }
.pz-pale-green,.pz-hover-pale-green:hover{color:#000 ;background-color:#ddffdd }
.pz-pale-yellow,.pz-hover-pale-yellow:hover{color:#000 ;background-color:#ffffcc }
.pz-pale-blue,.pz-hover-pale-blue:hover{color:#000 ;background-color:#ddffff }
.pz-pz,.pz-hover-pz:hover{color:#fff ;background-color:#377d7a;}
.pz-cyber,.pz-hover-cyber:hover{color:#fff;background:linear-gradient(to right, #8714d7 0%, #d23bd7 100%);}

/**Text colors**/
.pz-text-amber,.pz-hover-text-amber:hover{color:#ffc107}
.pz-text-aqua,.pz-hover-text-aqua:hover{color:#00ffff}
.pz-text-blue,.pz-hover-text-blue:hover{color:#2196F3}
.pz-text-light-blue,.pz-hover-text-light-blue:hover{color:#87CEEB}
.pz-text-brown,.pz-hover-text-brown:hover{color:#795548}
.pz-text-cyan,.pz-hover-text-cyan:hover{color:#00bcd4}
.pz-text-blue-grey,.pz-hover-text-blue-grey:hover{color:#607d8b}
.pz-text-green,.pz-hover-text-green:hover{color:#4CAF50}
.pz-text-light-green,.pz-hover-text-light-green:hover{color:#8bc34a}
.pz-text-indigo,.pz-hover-text-indigo:hover{color:#3f51b5}
.pz-text-khaki,.pz-hover-text-khaki:hover{color:#b4aa50}
.pz-text-lime,.pz-hover-text-lime:hover{color:#cddc39}
.pz-text-orange,.pz-hover-text-orange:hover{color:#ff9800}
.pz-text-deep-orange,.pz-hover-text-deep-orange:hover{color:#ff5722}
.pz-text-pink,.pz-hover-text-pink:hover{color:#e91e63}
.pz-text-purple,.pz-hover-text-purple:hover{color:#9c27b0}
.pz-text-deep-purple,.pz-hover-text-deep-purple:hover{color:#673ab7}
.pz-text-red,.pz-hover-text-red:hover{color:#f44336}
.pz-text-sand,.pz-hover-text-sand:hover{color:#fdf5e6}
.pz-text-teal,.pz-hover-text-teal:hover{color:#009688}
.pz-text-yellow,.pz-hover-text-yellow:hover{color:#d2be0e}
.pz-text-white,.pz-hover-text-white:hover{color:#fff}
.pz-text-black,.pz-hover-text-black:hover{color:#000}
.pz-text-grey,.pz-hover-text-grey:hover,.pz-text-gray,.pz-hover-text-gray:hover{color:#757575}
.pz-text-light-grey,.pz-hover-text-light-grey:hover,.pz-text-light-gray,.pz-hover-text-light-gray:hover{color:#f1f1f1}
.pz-text-dark-grey,.pz-hover-text-dark-grey:hover,.pz-text-dark-gray,.pz-hover-text-dark-gray:hover{color:#3a3a3a}
.pz-bd-pz{border-color:#377d7a;}

.pz-animate {display: flex; flex-flow: column-reverse; margin-bottom: 0.5em;}
.pz-animate label, .pz-animate input {transition: all 0.2s; touch-action: manipulation;}
.pz-animate input {font-size: 1.2em; margin-top:5px; text-indent:10px; border: 0; border-bottom: 1px solid #ccc; font-family: inherit; appearance: none;  border-radius:0; padding: 4px 0 ; cursor: text;}
.pz-animate input:focus {outline: 0; border-bottom: 1px solid #666;}
.pz-animate label {font-size:15px; margin-left:10px;}
.pz-animate input:placeholder-shown + label {cursor: text; max-width: 66.66%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; transform-origin: left bottom; transform: translate(0, 2.125rem) scale(1.3);}
.pz-animate ::-webkit-input-placeholder{opacity: 0; transition: inherit;}
.pz-animate :-moz-placeholder{opacity: 0; transition: inherit;}
.pz-animate ::-moz-placeholder{opacity: 0; transition: inherit;}
/*.pz-animate :-ms-input-placeholder{opacity: 0; transition: inherit;}*/
.pz-animate input:focus::-webkit-input-placeholder {opacity: .4;}
.pz-animate input:focus:-moz-placeholder {opacity: .4;}
.pz-animate input:focus::-moz-placeholder {opacity: .4;}
/*.pz-animate input:focus:-ms-input-placeholder{opacity: 1;}*/
.pz-animate input:not(:placeholder-shown), .pz-animate input:focus{border:1px solid silver; border-radius:3px; box-shadow:0px 0px 1px 1px silver;}
.pz-animate input:not(:placeholder-shown) + label,
.pz-animate input:focus + label {transform: translate(0, 0) scale(1); cursor: pointer;}
.pz-or {display:flex; justify-content:center; align-items: center; color:grey;}
.pz-or:after,.pz-or:before {content: ""; display: block;  background: grey; width: 50%; height:1px; margin: 0 10px;}

.pz-adaptive{margin-top:40px; min-width:170px;}
.pz-adaptive input {width: 100%;height: calc(3em + 2px); margin: 0 0 1em; padding: 6px; border: 1px solid #bababa; border-radius: 3px; background: #fff; font-size: 16px; resize: none; outline: none}
.pz-adaptive input:focus {border:2px solid #007bfe;}
.pz-adaptive input:focus + label[placeholder]:before {color: #007bfe;}
.pz-adaptive input:focus + label[placeholder]:before,
.pz-adaptive input:valid + label[placeholder]:before {font-weight:normal; transition-duration: .2s; transform: translate(0, -1.6em) scale(1,1);}
.pz-adaptive input:valid {border-color: #007bfe;}
.pz-adaptive input:invalid{box-shadow:none;}
.pz-adaptive input:valid + label[placeholder]:before {color: #007bfe;}
.pz-adaptive input:invalid + label[placeholder][alt]:before {content: attr(alt);}
.pz-adaptive input + label[placeholder] {display: block; pointer-events: none; line-height: 1.25em; margin-top: calc(-3em - 2px);}
.pz-adaptive input + label[placeholder]:before {content: attr(placeholder); display: inline-block; margin: 0 calc(0.5em + 2px); padding: 0 2px; color: #7d7d7d; white-space: nowrap; transition: 0.3s ease-in-out; background-image: linear-gradient(to bottom, #ffffff, #ffffff); background-size: 100% 5px; background-repeat: no-repeat; background-position: center;}

/*pages bar*/
.pz-bar{height:65px; box-shadow: 0 3px 1px -3px gray;}
.pz-bar-logo{width:auto; margin-left:20px; height:54px; margin-top:3px; float:left;}
.pz-bar-logo img{height:100%; float:left;}
.pz-bar-appName{float:left; font-size:30px; margin-left:6px; margin-top: 12px;}
.pz-bar-menu{float: right; height:36px; margin-top:15px; margin-right:20px;}
.pz-bar-icon{float:left; font-size: 22px; font-family: roboto;  cursor:pointer; height:36px; margin-left:12px; color:#5f6368; border-radius:36px; text-align:center; width:36px; padding:7px;}
.pz-bar-user{color:white;}
.barModal{width:250px; background:white; right:0; margin-right:5px; margin-top: 68px; border-radius: 10px; position: absolute;}
.barModalIcon{width:70px; height:70px; margin-top: 20px; color:white; margin-left: 90px; text-align:center; line-height:70px; border-radius:50%; background: pink; font-size:50px; }
.barModalName{text-align:center; margin:15px 0 0 0;}
.barModalEmail{text-align:center; margin-bottom: 20px;}
.barModalButton{text-align: center; margin: 32px 0;}
.barModalButton span{cursor:pointer; width:auto; padding:8px 20px; border:1px solid #ddd; border-radius:20px; }
.barModalButton span:hover{background:#eee;}

.barModalExtra{border-top:1px solid #ccc; padding:15px 0 15px 30px;}


@media(max-width:768px){
	.m-hide{display:none;}.pz-col.p2,.pz-col.p3,.pz-col.p4,.pz-col.p5{width:100%;} 
	.pz-modal-content{width:90%;}
	.pz-popup{width:100%; position:fixed; height:100%; max-height:100%;top:0;left:0;border-radius:0; transform: translate3d(0%,0%, 0);}
	.m-hide-scrollbar{-ms-overflow-style:none; scrollbar-width:none;} .pz-hide-scrollbar::-webkit-scrollbar{display:none;}
	.EMain{width:100%; padding: 0 20px;}
	.EMain img{margin-top: 5%;}
	.ERobot{display: none; margin:0;}
}