@font-face {
	font-family: 'exoregular';
	src: url('fonts/exo-regular-webfont.eot');
	src: url('fonts/exo-regular-webfont.eot?#iefix') format('embedded-opentype'), url('fonts/exo-regular-webfont.woff') format('woff'), url('fonts/exo-regular-webfont.ttf') format('truetype'), url('fonts/exo-regular-webfont.svg#exoregular') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'Conv_OpenSans-Regular';
	src: url('fonts/OpenSans-Regular.eot');
	src: url('fonts/OpenSans-Regular.eot?#iefix') format('embedded-opentype'), url('fonts/OpenSans-Regular.woff') format('woff'), url('fonts/OpenSans-Regular.ttf') format('truetype'), url('fonts/OpenSans-Regular.svg#OpenSans-Regular') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'exoextralight';
	src: url('../fonts/exo-extralight-webfont.eot');
	src: url('../fonts/exo-extralight-webfont.eot?#iefix') format('embedded-opentype'), url('fonts/exo-extralight-webfont.woff') format('woff'), url('fonts/exo-extralight-webfont.ttf') format('truetype'), url('fonts/exo-extralight-webfont.svg#exoextralight') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'exolightitalic';
	src: url('fonts/exo-lightitalic-webfont.eot');
	src: url('fonts/exo-lightitalic-webfont.eot?#iefix') format('embedded-opentype'), url('fonts/exo-lightitalic-webfont.woff') format('woff'), url('fonts/exo-lightitalic-webfont.ttf') format('truetype'), url('fonts/exo-lightitalic-webfont.svg#exolightitalic') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'exobolditalic';
	src: url('fonts/exo-bolditalic-webfont.eot');
	src: url('fonts/exo-bolditalic-webfont.eot?#iefix') format('embedded-opentype'), url('fonts/exo-bolditalic-webfont.woff') format('woff'), url('fonts/exo-bolditalic-webfont.ttf') format('truetype'), url('fonts/exo-bolditalic-webfont.svg#exobolditalic') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'exoextralightitalic';
	src: url('fonts/exo-extralightitalic-webfont.eot');
	src: url('fonts/exo-extralightitalic-webfont.eot?#iefix') format('embedded-opentype'), url('fonts/exo-extralightitalic-webfont.woff') format('woff'), url('fonts/exo-extralightitalic-webfont.ttf') format('truetype'), url('fonts/exo-extralightitalic-webfont.svg#exoextralightitalic') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'exobold';
	src: url('fonts/exo-bold-webfont.eot');
	src: url('fonts/exo-bold-webfont.eot?#iefix') format('embedded-opentype'), url('fonts/exo-bold-webfont.woff') format('woff'), url('fonts/exo-bold-webfont.ttf') format('truetype'), url('fonts/exo-bold-webfont.svg#exobold') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'estrewebfont';
	src: url('fonts/estrewebfont.eot');
	src: local('fonts/estrewebfont'), url('fonts/estrewebfont.woff') format('woff'), url('fonts/estrewebfont.ttf') format('truetype');
}

@font-face {
	font-family: 'DroidSans';
	src: url('fonts/DroidSans.eot');
	src: local('fonts/DroidSans'), url('fonts/DroidSans.woff') format('woff'), url('fonts/DroidSans.ttf') format('truetype');
}

@font-face {
	font-family: 'Roboto-Medium';
	src: url('fonts/Roboto-Medium.eot');
	src: local('../fonts/Roboto-Medium'), url('../fonts/Roboto-Medium.woff') format('Roboto'), url('../fonts/Roboto-Medium.ttf') format('truetype');
}

@font-face {
	font-family: 'Calibri';
	src: url('fonts/Calibri.eot');
	src: local('fonts/Calibri'), url('fonts/Calibri.woff') format('truetype'), url('fonts/Calibri.ttf') format('truetype');
}

@font-face {
	font-family: 'HelveticaNeue-Regular';
	src: url('fonts/HelveticaNeue-Regular.eot');
	src: local('fonts/HelveticaNeue-Regular'), url('fonts/HelveticaNeue-Regular.woff') format('truetype'), url('fonts/HelveticaNeue-Regular.ttf') format('truetype');
}

/* body */

body {
	background-image: url(../img/bubble.png);
	background-repeat: repeat-x;
	margin: auto;
	font-family: Helvetica Neue, Helvetica, arial, sans-serif;
}

/* login part */

.login{
	float: right;
}

#logintext {
	float: right;
	width:60px;
	font-size: 12px;
	font-family: 'Calibri';
	font-weight: bold;
	margin-right: -35px;
	margin-top: -5px;
	opacity: 0.5;
}

#feedback {
	float: right;
	width:115px;
	margin-right: 355px;
	margin-top: -181px;
}

/* barner part. logo + kist name */
.index{
	background-image: url(img/frame3.png);
	width:1074px;
	height:177px;
}

.logo {
	float:left;
	width: 110px;
	margin-left: 23px;
	height: 95px;
	margin-top: 55px;
	overflow: hidden;
} 

.flag {
    float:right;
    margin-right:-70px;
    margin-top: 74px;
}

/* navigation part */
.nav {
	float: right;
	margin-top: -60px; 
	margin-right: 205px;
}

.menu li {
	float: left;
	margin-top: -16px;
}

.menu li a {
	font-family: 'exoregular';
	font-size: 12px;
	display: block;
	color:white;
	text-decoration: none;
	background: #3f3f3f; opacity: 0.99;
    padding: 15px;
} 

ul.menu li:last-child a {
	border-right: none;
}

.menu li a.active, .menu li:hover a.active {
	color: white;
	background-color: #00875d; cursor: default; opacity: 0.99;
}

.menu li a:hover, .menu > li:hover > a {
	color: white;
	background:#555555;
}

/* navigation in dropdown part */
.nested {
	margin-left:-40px;
	z-index: 999;
}

ul.nested {
	float:none;
	width: auto;
	height: auto;
	position: absolute;
	visibility: hidden;
	max-height: 0;
	transition: max-height 0.7s ease-in-out;
    -moz-transition: max-height 0.7s ease-in-out;
	-webkit-transition: max-height 0.7s ease-in-out;
	-o-transition: max-height 0.7s ease-in-out;
	overflow: hidden;
}

ul.nested li {
	float: none;
	padding-top: 15px;
}
 
ul.nested li a {
	background-color: #555555;
	border: 1px solid white; border-left: none; border-right: none;	
}

ul.nested li a:hover {
    background-image: url(img/hover.png);
}  

ul.nested li:last-child a {
	border-bottom: none;
	border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; 
}

.menu li:hover ul {
    max-height:500px;
	visibility: visible;
}

/* another menu on top */
.menutop {
	float: left;
	margin-top: -177px;
	height:35px;
	background: #009f6e; 
	overflow: hidden;
}
.menutop ul {
	margin:0; padding: 0; margin-top: 5px;
}
.menutop li {
   display: inline;
   
}

.menutop li a {
	font-size: 12px;
	display: inline-block;
	color: white;
    padding: 10px; margin-top: -5px;
}

.menutop li:nth-child(1) a {
	padding-left: 10px;
}

.menutop li:last-child a {
	padding-right: 10px;
}

.menutop li a:hover {
    background: url(img/hover.png);
}

/* breaking news part */
.newssider {
	width:99.9%;
	height:29px;
	border: 1px solid #00875d;
}

.updates {
	width:109px;
	height:27px;
	margin-top: 1px;
	margin-left: 1px;
	background: #00875d;
	overflow: hidden;
}

#newp {
	width:115px;
	padding-left:6px; 
	margin-top: 4px;	
	font-family: 'Calibri';
	color: white;

}

#newtimedate {
	font-size: 15px;
	font-family: 'HelveticaNeue-Regular';
	font-weight: bold;
	width: 70px;
	height: 25px;
	color: #0b5520;
	padding-left: 5px;
	margin-top: -23px;
	margin-left: 115px;
	overflow: hidden;
}

#newmaelezo {
	width: 892px;
	height: 27px;
	margin-top: -29px;
	margin-left: 180px;
	background: #3f3f3f;
	overflow: hidden;
	
}

#newmaelezo p {
	font-family:'HelveticaNeue-Regular'; font-size: 15px; color: white; text-indent: 10px; margin-top: 4px;
}

/* footer part */
.footer {
	width: 1074px;
	margin: auto;
	height: 170px;
	padding-top: 5px;
    border-bottom: 1px dashed white;
    border-top: 1px dashed white;
	overflow: hidden;
}

#maelekezo {
	float: left;
	width:220px;
	margin-left: -30px;
}

#maelekezo li a {color: white;}
#maelekezo li a:hover {text-decoration: underline;}

#admission {
	float:left;
	width:220px;
	margin-left: 5px;
}

#admission li a {color: white;}
#admission li a:hover {text-decoration: underline;}

#follow {
	float: left;
	width:200px;
	margin-left: 15px;
}

#follow li a {color: white;}
#follow li a:hover {text-decoration: underline;}

#contact {
	float:right;
	width:220px;
	margin-right: 10px;
}

#fontz {
	font-family: 'exoextralight';
	font-weight: bold;
	letter-spacing: 2px;
	color: white; 
}
#contact li {
    font-family: 'Calibri';
	text-decoration: none;
	color: white;
}

#arrow {
	color: white;
	letter-spacing: 5px;
}

/* left side ya prospectors in index page */
.prospectors {
	border:1px solid #00875d;
	width: 260px;
	min-height:340px;
	max-height: auto;
	overflow: hidden;
	margin-top: 10px;
	margin-bottom: 10px;
	background: #f0f0f0;
}

/* left side ya profile wa head of depertment */
.headprofiles {
	border:1px solid #00875d; 
	width:260px;
	min-height:280px;
	max-height: auto;
	overflow: hidden;
	align:left;
	margin-top: 15px;
	margin-bottom: 10px;
	background: white;
}

.headprofiles img {
	width: 150px;
	padding: 5px;
	margin-left: 50px;
    margin-top: 10px;
	border: 1px solid #00875d;
}

.headprofiles p {
	width: 160px;
	padding: 5px; 
	margin: auto;
	text-align: center;
	background: #fcfcfc;
	margin-top: 10px; margin-bottom: 10px;
	border: 1px solid #00875d;
}

.headofdep {
	border:1px solid #00875d; border-bottom: none;
	width:260px;
	height:35px;
	font-size:15px;
    margin-top: 10px;
	margin-bottom: -15px;
	background: #fcfcfc;
}

.pheadofdep {
	font-family: :'exoextralight';
	text-align: center;
	margin-top: 10px;
	font-weight: bold;
}

/* left side ya matangazo part */
.matangazosider {
	border:1px solid #00875d;
	width: 260px;
	min-height:500px;
	max-height: auto;
	overflow: hidden;
	align:left;
	margin-top: 15px;
	margin-bottom: 30px;
	background: #fcfcfc;
}

.matangazosider:hover {
   overflow: hidden;
}

/* announcement part */
.announcementlogo {
	background: #fcfcfc;
	width: 260px;
	border:1px solid #00875d; border-bottom: none;
	height:35px;
	font-size:15px;
	margin-top: 10px;
	margin-bottom: -15px;
}

.logospika {
	margin-left: 15px;

}

.pannouncement {
	font-family: :'exoextralight';
	margin-left: 80px;
	margin-top: -30px;
	font-weight: bold;
}

.announcedetails {
	margin-top:5px; margin-left: 5px;
	border-bottom:1px solid #00875d;
	background: #fcfcfc;
	height:auto;
	width: 247px;
}

#newicon {
    margin-left:15px;
    margin-top: 15px;
    border: 1px solid gray;
}

/*details of announcement with new icon*/
#h4 {
	width:170px; text-align: right; 
	margin-top: -45px;
    margin-left:65px;
}

/*details of announcement without new icon*/
#h4_2 {
    width: 170px; text-align: right; margin-top: 10px; margin-left: 65px;
}

.seealldetails {
	margin-top:10px; margin-bottom: 10px; margin-left: 5px;
	height:auto;
	width: 247px;
}

.seealldetails:hover {text-decoration: underline}

#seeallmatangazo {
    width: 50px;
    padding: 5px;
    margin:auto; margin-left: 96px;
}

#posted {
	font-size: 12px; font-family: 'exoregular'; text-align: right;
    width:160px;
    margin-left:73px;
    margin-top:-10px;
}

/* follow us sider part */

.followsider {
	border:1px solid #00875d;
	width: 260px;
	height: auto;
	margin-top: 10px;
	margin-bottom: 50px;
	background: #fcfcfc;
    overflow: hidden;
}

/* follow part */
.followlogo {
	width: 260px;
	border-bottom:1px solid #00875d;
	height:25px;
	border-right: none;
	font-size:15px;
}

.pfollow {
	font-family: :'exoextralight';
	margin-left: 80px;
	margin-top: 10px;
	font-weight: bold;
}

.followdetails a, .followdetails img {
	margin-left: 2px;
	padding: 3px;
	margin-top: 5px; margin-bottom: 5px;
	height:auto;
}

/* center of brief details about kist in index page*/
.welcometokist {
	background: #fcfcfc;
	float: right;
	width: 735px;
	min-height: 200px;
	max-height: auto;  
	margin-top: 50px; 
	border: 1px solid #00875d;
	margin-bottom: 20px;
	overflow: hidden;
}

/* center in picture part */
.centersider {
    position: relative;
    border: 1px solid #00875d;
    float: left;
	width:725px;
	min-height:300px;
    max-height: auto;
    padding: 5px; 
    background:  #fcfcfc;
    margin-top: 10px;
    margin-left: -2px;
}

.centersider img {
    position: absolute; 
    top: 5px; 
    left: 5px; 
    right: 5px; 
    bottom: 5px; 
}

/* center in details of college part */
.centersider2 {
    background: #fcfcfc;
    float: right;
    width: 735px;
    min-height: 100px;
    max-height: auto;
    border: 1px solid #00875d;
    margin-top: 10px; 
    margin-bottom: 20px;
    overflow: hidden;

}


#h3kist {
    font-family: sans-serif;
    padding: 3px;
    width:650px;
    text-align: center;
    margin: auto; margin-top: 8px; margin-bottom: 10px;
    border-bottom: 1px solid #00875d;
}

#maelezoyakist {
    font-family: sans-serif;
    background: #fcfcfc;
    text-indent: 20px;
    color:#303030;
    width:690px;
    margin-left: 15px; margin-top: -10px;
    padding: 5px;
}

/*div of center of right and left*/
.centerleft{
    background: #fcfcfc;
    border: 1px solid #00875d;
    margin-left: -2px;
    margin-bottom: 20px;
    float: left;
    width: 285px;
    height: 400px;
    overflow: scroll;
}

.centerright {
    background: #fcfcfc;
    border: 1px solid #00875d;
    padding:10px;
    margin-bottom: 10px;
    float: right;
    width: 410px;
    height: auto;
    overflow: hidden;
}


/*video and calendar and other properties*/
#index_video {
    width:410px;
}

#video_title {
    margin: auto;
    margin-bottom: 15px;
    width:350px;
    text-align: center;
    border-bottom: 1px solid #00875d;
}

#calendar_title {
    margin: auto;
    margin-top: 10px;
    width: 200px;
    text-align: center;
    border-bottom: 1px solid #00875d;  
}

#resultboxes { 
    float: left;
    width:160px;
    height: 100px;
    margin-left: 40px;
    margin-bottom: 20px;
    padding: 15px;
    padding-top: 60px;
    text-align: center;
    border: 1px solid #00875d;
    font-family: sans-serif;
    font-size: 22px;
    font-weight: bolder;
}

#resultboxes:hover {
    background:#009f6e;
    color: white;
}

/*Gallery properties*/
.gallerysider {
    background: #fcfcfc;
    width: 96%; 
    min-height: 100px; 
    max-height: auto; 
    border: 1px solid #00875d; 
    margin: auto;
    margin-top: 10px;
    margin-bottom: 20px;
    padding-bottom: 15px;
    overflow: hidden;
}

.gslide{
    width: 45%;
    float: left;
    min-height: 250px;
    margin-top: 20px;
    margin-bottom: 20px;
    margin-left: 33px;
    border: 1px solid #00875d;
}

.gslide img {
    padding: 5px;
    width: 300px;
    height: 250px;
    margin-right: 15px; margin-left: 5px;
    margin-top: 5px;
}

.gslide p {
    float: right;
    width: 115px;
    margin-right: 15px;
    font-family: 'HelveticaNeue-Regular';
    text-align: right;
}

.gslide date {
    float: right;
    width: 115px;
    margin-right: 15px;
    margin-top: -30px;
    font-family: 'HelveticaNeue-Regular';
    font-weight: bolder;
    text-align: right;
}

/*table properties*/
table {
    width: 90%;
    margin: auto;
    margin-bottom: 20px;
}

table td, th {
    border-bottom: 1px dashed #00875d; 
    border-collapse: collapse;
    font-family: sans-serif;
    padding: 5px;
}

/*page ya kuona matangazo yote*/

.mdetails {
	margin:auto;
    margin-bottom: 20px;
	border-bottom:1px solid #00875d;
	background: #fcfcfc;
	height:auto;
	width: 90%;
}
/*details of announcement with new icon*/
#h4m {
    font-family: sans-serif;
	text-align: right; 
	margin-top: -45px;
    margin-left:20%;
}

/*details of announcement without new icon*/
#h4_2m {
    font-family: sans-serif; text-align: right; margin-top: 10px; margin-left: 20%;
}

#postedm {
	font-size: 14px; font-family: 'exoregular'; text-align: right;
    margin-left:30%;
    margin-top:-10px;
}
/* ordered list */
ol{
    font-family: sans-serif;
    background: #fcfcfc;
    color:#303030;
    width: 674px;
    margin-left: 15px; margin-top: -15px;
}

ol li {
    list-style: lower-alpha;
    padding: 5px;
}

/* exam regulations */
.examreg {
    width: 94%;
    margin-left: 35px;
}

#h3examreg {
    font-family: sans-serif;
    float: right;
    padding: 3px;
    width:590px;
    text-align: left;
    margin-top: 6px; margin-right: 30px;
    border-bottom: 1px solid #00875d;
}

#maelezoyaexamreg {
    float: right;
    font-family: sans-serif;
    background: #fcfcfc;
    text-indent: 20px;
    color:#303030;
    width:590px;
    margin-right: 30px; margin-top: -10px;
    padding: 5px;
}

/* general things in page */
li { list-style-type:none; }

a { font-family:'Calibri'; text-decoration: none; color:black; }

a:hover { color:#00875d; }

blockquote {
    width: 90%;
    font-family: sans-serif;
    font-style: italic;
}
/*director message part*/
.directormsg {
	float:left;
	width:410px;
	height:auto;
	overflow: hidden;
	margin-bottom: 10px; margin-left: 15px;
    border-right: 1px dashed white;
} 

.directormsg img {
	margin-left: 5px; margin-top: 10px;
	border: 1px solid #00875d;
}

.directormsg h4 {
	width: 185px;
	float: right;
	text-align: center;
	border-bottom: 1px solid white;
	padding: 5px;
	color: white;
	text-transform: uppercase;
	margin-right: 30px;
	margin-top: 5px;
}

#directormsgdetails {
    width: 200px;
    text-align: left;
    font-family: 'Calibri';
    margin-top: -200px;
    margin-left: 190px;
    color: white;
 }
  
.kistlinks {
    width: 220px;
    height:225px;
    float: left;
    border-right: 1px dashed white;
} 

.kistlinks li a {color:white;}
.kistlinks li a:hover {text-decoration: underline;}

#stakeholders {
	padding: 0; margin-left: 20px; margin-top: 6px; width: 180px;
}

.kistmap {
   background: #fcfcfc; margin-right: 15px;
   float: right;
   width: 370px;
   height:225px; 
   overflow: hidden;
   background: #ddece7;
}

/* map for director page */ 
.kistmap2 {
   background: #fcfcfc;
   float: right;
   margin-right: 85px;
   margin-bottom: 20px;
   width: 700px;
   height:225px; 
   overflow: hidden;
   background: #ddece7;
}

/* mwisho part */
.kistmwisho {
	width:1074px;
	height: 30px;
	margin:auto;
	margin-top: 20px; margin-bottom: 20px; 
}

.kistmwisho p {
	text-align: center;
	margin-top:5px; 
    font-family: 'Calibri';
    font-size: 15px;
    color: white;
}

.kistmwisho img {
	float: left;
	margin-top: -37px;
}

.headerbg {
	border:none; 
	width: 1074px;
	margin: auto;
	height: auto;
	background-image: url(img/bubble.png);
	overflow: hidden;
}
.newsbg { 
	width: 1074px;
	margin: auto;
	min-height:35px;
	max-height: auto;
	background: #ebf2f0;
	overflow: hidden;
}

.mainbg {
	width: 1074px;
	margin:auto;
	border-bottom: 2px solid #00875d;
	border-top: 2px solid #00875d;
	padding-top: 10px;
	background:#ddece7;
	margin-top: 10px;
	height: auto;
	overflow: hidden;
}

.rightsider {
	float: left;
	width: 735px;
	margin-left: 25px;
	margin-right: 10px;
}

.leftsider {
	float: right;
	width: 265px;
	margin-right: 20px;
}

.footer2 {
	width: 1074px;
	margin:auto;
	overflow: hidden;
}


.coder {
    text-align: center;
    margin-top: -35px;
    font-family: 'playball', sans-serif;
	font-size: 15px;
	color: black;
}

.footerbg {
	border-top: 5px solid #007a54;
	min-width: 1100px;
	max-width: 100%;
	margin: auto;
	margin-top:20px;
	min-height:450px;
	max-height: auto;
	padding-top: 25px;
	background:#009f6e;
	overflow: hidden;
}

/* footer manipulation on some php tabs like login, signup
   and online admission system */
.mainbg2 {
	min-width: 1074px;
	max-width: 100%;
	margin:auto;
	border-bottom: 2px solid #00875d;
	border-top: 2px solid #00875d;
	padding-top: 10px;
	background:#ddece7;
	margin-top: 20px;
	height: auto;
	overflow: hidden;
}

.footerbg2 {
	border-top: 5px solid #007a54;
	min-width: 1100px;
	max-width: 100%;
	margin: auto;
	margin-top:-5px;
	min-height:100px;
	max-height: auto;
	padding-top: 25px;
	background:#009f6e;
	overflow: hidden;
}

.footerbg3 {
	border-top: 5px solid #007a54;
	min-width: 1100px;
	max-width: 100%;
	margin: auto;
	margin-top:-12px;
	min-height:100px;
	max-height: auto;
	padding-top: 5px;
	background:#009f6e;
	overflow: hidden;
}

.kistmwisho2 {
	width:1074px;
	height: 10px;
	margin:auto;
	margin-top: 20px; 
	margin-bottom: 20px; 
}

.kistmwisho2 p {
	float: left;
	margin-top:-17px; 
    font-family: 'Calibri';
    font-size: 15px;
    color: white;
}


.coder2 {
    float: right;
    margin-top: -17px;
    font-family: 'playball', sans-serif;
	font-size: 15px;
	color: white;
}

/* kist login page */

.loginpage {
	background-image: url(../img/bubble.png);
	width: 600px;
	border: 2px solid #007a54;
	margin: auto;
	margin-top: 30px;
	margin-bottom: 40px;
}

.loginpage img {
	margin-left: 235px; 
	margin-top: 10px;
}

.logintable {
	width: 490px;
	margin-left:50px;
	margin-bottom: 30px; 
}

.logintable input {
	background: white;
	border: 2px solid #007a54;
	padding: 10px;
	width: 280px;
}

.logintable input:hover {
	border: 2px solid green;
}

.logintable td:first-child {
	text-align: left;
	text-decoration: bold;
	font-size: 15px;
	border-bottom: none;
}

.logintable td:nth-child(2) {
	border: none;
}

#h3login {
    font-family: sans-serif;
    padding: 3px;
    width:600px;
    text-align: center;
    margin: auto; margin-top: 8px; margin-bottom: 10px;
}

.logintable button {
	padding: 10px;
	width:305px;
	margin-left: 135px;
	margin-top: -45px;
	border: 2px solid #007a54;
	background: #009f6e;
	color: white;
}

.logintable button:hover {
	background: green;
	cursor: pointer;
}

.loginpage p {
	font-family: Arial;
	margin-left: 295px; 
	margin-right: 120px;
	margin-top: -50px; 
	font-size: 15px; 
	font-weight: bold; padding-bottom:2px;
	border-bottom: 2px solid #007a54;}
 
#signup {float:right; 
	padding: 10px;
	margin-right: 110px;
	margin-top: -54px;
	border: 2px solid #007a54;
	background: #009f6e;
	color: white;}

#signup:hover {background: green; cursor: pointer;}

.loginmessage {  
		width: 200px;  
		margin-top: 20px; margin-left: 200px; 
		margin-bottom: 15px;
		text-align: center; 
		text-decoration: bold; 
		font-size:12px;
	    color: red;}

/* kist signup page */

.signuppage {
	background-image: url(../img/bubble.png);
	width: 1024px;
	border: 2px solid #007a54;
	border-radius: 0;
	margin: auto;
	margin-top: 15px;
	margin-bottom: 30px;
}

.sunavbar {
	border-bottom: 2px solid #007a54;
	width: 100%;
}

.sunavbar img {
    margin-left: 40px;
	padding:  10px;
    padding-right: 50px;
    padding-top:  5px;
    padding-bottom: 10px;
    margin-bottom: 22px;
    border-right: 2px dashed #007a54;
}

.sunavbar h3 {
	font-family: sans-serif;
    padding-left: 70px;
    padding-right: 70px;
    width:650px;
    text-align: center;
    margin-top:-93px; margin-left: 205px; 
    margin-bottom: 23px;
}

.signuptable {
	width: 950px;
    margin: auto;
	margin-bottom: 20px; 
	margin-top: 8px;
}

.signuptable input {
	background: white;
	border: 2px solid #00a79d;
	padding: 10px;
	margin-top: 5px;
	width: 260px;
}

.signuptable input:hover {
	border: 2px solid green;
}

.signuptable textarea {
	width: 278px;
	height: 100px;
	resize: none;
	margin-left: -2px;
	margin-top: 15px;
	border:2px solid #00a79d;
}

.signuptable textarea:hover {
	border: 2px solid green;
}

.signuppage select {
	width: 283px;
	padding: 10px;
	border: 2px solid #00a79d;
	margin-top: 5px;
}

.signuptable select:hover {
	border: 2px solid green;
}

#repass input {
	width: 710px;
}

.signuptable td:first-child {
	text-align: left;
	text-decoration: bold;
	padding-top: 15px;
	border-bottom: none;
}

.signuptable td:nth-child(2) {border: none;}

.signuptable td:nth-child(4) {border: none;}

.signuptable td:nth-child(3) {border: none;
	padding-left: 20px; padding-top: 15px;
	padding-right: 5px;}

#h3signup {
    font-family: sans-serif;
    padding: 3px;
    width:700px;
    text-align: center;
    margin: auto; margin-top: -65px; 
    margin-bottom: 30px;
}

.signuptable button {
	padding: 10px;
	margin-left: 160px;
	margin-top: -10px;
	border: 2px solid #007a54;
	background: #009f6e;
	color: white;
}

.signuptable button:hover {
	background: green;
	cursor: pointer;
}

#loginlink { 
	float: right;
	padding: 10px;
	margin-right: 91px;
	margin-top: -55px;
	border: 2px solid #007a54;
	border-bottom-left-radius: 0;
	background: #009f6e;
	color: white; }

#loginlink:hover { background: green; cursor: pointer;}

.signuppage pre {
	font-family: Arial;
	margin-left: 650px; 
	margin-right: 100px;
	margin-top: -44px; 
	font-size: 16px; 
	font-weight: bold; 
	padding-bottom:2px;
	border-bottom: 2px solid #007a54;}

#errorcolor {
	font-color: red;
}

#regmessage {
	color:black;
	text-align:center;
	font-size: 15px;
	font-family: 'Roboto-Medium';
	padding-bottom: 15px;
	padding-top: 5px;
}

#regmessage a {
	color:black;
	text-align:center;
	font-size: 15px;
	font-family: 'Roboto-Medium';
}

.newkoastyle {
	width: 98%;
	padding: 15px;
	margin-left: -8px;
	margin-bottom: 25px;
	margin-top: 30px;
	border: 2px solid;
	border-radius: 5px; 
	background: white;
}

.newkoastyle pre {
	border:2px solid white;
	margin-top: 0;
	float: left;
	margin-left: 50px;
	margin-top: -25px;
	margin-bottom: 20px;
	padding: 5px;
	background: green;
	color: white;
}

.koasprofile img {
	border:2px solid green;
	width: 130px;
	height: 150px;
	float: right;
}

#uploadbutton {
	width: 100px;
	height: 50px;
	float: left;
	margin-left: -101px;
	margin-top: 60px;
	font-size: 12px;
}

.koasprofile label {
	border: 2px solid green;
	background: #009f6e;
	color: white;
	width: 100px;
	height: 30px;
	float: left;
	font-size: 12px;
	text-align: center;
}

.koasprofile label:hover {
	background: green;
	cursor: pointer;
}

.koasregbody {
	width: 95%;
	margin: auto;
}

.koasregbody h3 {
	text-align: center;
}

.koasregbody li {
	list-style: disc;
	margin-bottom: 5px;
}

.koasregmenu {
	margin-top: 20px;
}

.koasregmenu td {
	border: none;
	text-align: center;
	width: 100px;
}

.koasregmenu button {
	width: 100%;
	padding: 10px;
	border: 2px solid black;
	background: #009f6e;
	color: white;
}

.koasregmenu button:hover {
	background: #ffce6d;
	cursor: pointer;
	color: black;
}

.koasregmenu h5 {
	text-align: center;
	font-family: 'Calibri';
	font-size: 14px;
	padding: 15px;
	border: none;
	border-left: none;
	border-right:none;
	background: white;

}

#activekoasmenu {
	border: 2px solid black;
	background: #ffce6d;
	color: black;
}

#activekoasmenu:hover {
	cursor: default;
}

#resetpasslink {
	font-family: 'Calibri';
	font-size: 14px;
	text-align: center;
	margin-bottom: 0;
	text-align: left;
	margin-left: 2px;
}

#koasloginfail {
	font-family: 'Calibri';
	font-size: 12px;
	text-align: center;
	margin-bottom: 0;
	color: red;
}

.koaslogintable {
	width: 500px;
	padding: 20px;
	margin-left: 25px;
	border:2px solid;
	background: white;
}

.koaslogintable button {
	width: 304px;
	margin-left: 164px;
}

.koasregdetails {
	font-family: 'Calibri';
	font-size: 13px;
	border: 1px solid;
	padding: 10px;
	border-bottom: 2px solid green;
	background: #adffdd;
}

.koaslogout {
	float: right;
	width: 200px;
	height: 95px;
	border-left: 2px dashed #007a54;
	margin-top: -95px;
	text-align: center;
}

.koaslogout p{
	font-size: 12px;
	font-weight: bold;
	margin-top: 15px;
}

.koaslogout button {
	width: 100px;
	padding: 10px;
	border: 2px solid black;
	background: #009f6e;
	color: white;
}

.koaslogout button:hover {
	background: #ffce6d;
	cursor: pointer;
	color: black;
}

.koasinsidemenu {
	width: 160px;
	margin-left: -5px;
	padding: 10px;
	border: 2px solid black;
	background: #009f6e;
	color: white;
	height: 60px;
}

.koasinsidemenu:hover {
	background: #ffce6d;
	cursor: pointer;
	color: black;
}

.koaspartofmenu {
	width: 120px;
	height: 65px;
	float: right;
}

.koasloadimg {
	width: 30px;
	margin-top: 20px;
	float: left;
}

/* The Modal (background) */
.modal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content/Box */
.modal-content {
    background-color: #fefefe;
    margin: 15% auto; /* 15% from the top and centered */
    padding: 20px;
    border: 2px solid green;
    width: 60%; /* Could be more or less, depending on screen size */
}

/*styles button and maelezo*/
.modal-content p {
	text-align: center;
	color:red;
	font-weight: bold;
}

.modal-content button {
	width: 20%;
	margin-left: 40%;
}

/* The Close Button */
 .close {
    color: #aaa;
    float: right;
    font-size: 28px;
    font-weight: bold;
}

 .close:hover,
 .close:focus {
    color: black;
    text-decoration: none;
    cursor: pointer;
}

.messagebox {
	background: white;
	width: 95%;
	min-height: 50px;
	max-height: auto;
	border: 1px solid green;
	margin: auto;
	margin-top: 20px;
	margin-bottom: 20px;
	padding: 15px; 
}

.infoblocks {
	margin: 20px; 
	width: 890px;
	height: 100px;
	border: 2px solid lightblue;
}

.infoblocks p {
	margin: 0;
	width: 870px;
	font-size:13px;
	padding: 10px;
	background: lightblue;
	text-align: center;
}

.infoblocks h2 {
	text-align: center;
}

.infoblocks2 {
	float: left;
	margin: 20px; 
	margin-top: 0;
	width: 430px;
	height: 100px;
	border: 2px solid lightblue;
}

.infoblocks2 p {
	margin: 0;
	margin-left: -2px;
	width: 412px;
	font-size:13px;
	padding: 10px;
	background: lightblue;
	text-align: center;
}

.infoblocks2 h2 {
	text-align: center;
}

.infoblocks3 {
	margin: 20px; 
	margin-left: 480px;
	width: 430px;
	height: 100px;
	border: 2px solid lightblue;
}

.infoblocks3 p {
	margin: 0;
	margin-left: -2px;
	width: 412px;
	font-size:13px;
	padding: 10px;
	background: lightblue;
	text-align: center;
}

.infoblocks3 h2 {
	text-align: center;
}