body{
    font-family:arial, sans, verdana, helvetica;
    font-size:0.7em;
    background:none;
    padding:1% 0 0 0;
    margin:0; 
    letter-spacing:0px;   
    } 
    /**{bordeR:1px solid #aaa;}*/
div{
    vertical-align:top;
}
select{
font-size:11px;
}
a{
    color:#22b;
}
form{
    padding:0 0 0 0;
    margin:0;
}
/*body * {border:1px solid red}*/
#super-container{
    width:100%;
    padding:0 0 0 0;
    margin:0;
    }
#container{
    margin-top:0;
    text-align:left;	
    width:800px; 
    padding:0 0 0 0; 
}
#header{
    width:800px;
    background:#fff;
    padding:0 0 0 0 ;
    margin:0;
} 
#header .wrap{
    background-color:#fff;
}
#header img{
    padding:0 0 0 0;
    margin:0;
}
#header a{
    color:#fff;
    text-decoration:none;
}
#footer{ 
    padding:0 0 0 0;
    color:#000 ;
    width:800px;
    background:url(../../images/footer-bg.png);
} 
#footer a{
    color:#888;
    text-decoration:none;
    }  
#footer #safaricom-logo{

}

#mpl-logo {
    
}
.wrap{
    width:100%;
    clear:both;
    height:1px;
}
#content{
    width:800px;

    border-top:none;
    min-height:380px; 
    }
#left{
    width:20%;
    float:left;
    padding:0.4% 0.2em 0.2em 4%;
    font-size:110%;
    font-weight:bolder;
    color:#aaa;
}

#right{
    width:75%;
    float:left;
}
input, select, textarea{
    padding:2% 2% 2% 2%;
    padding: 0.2em 0.2em 0.2em 0.2em;
    margin:0;
}

ul li{
    list-style:none;
}

form {
    padding:1em 1em 1em 1em;
}
#login * input{
    font-size:1.2em;
    margin:0;
}
#login * input[type='text'], input[type='password']{
    margin:0;
    font-size:1.2em;
    width:8em;
    position:relative;
    top:-1px;
}
#login * input[type=image]{
    position:relative;
    top:1px;
}
#login-form{
    margin:0;
    padding:0 0 0 0;
    
}
#login table *{
    letter-spacing:0px;
}
#login{
    width:70%;
    padding:0 1.8% 0 0;
    margin:0;
}
#login form{
    padding:0 0 0 0;
    margin:0;
}
#login * a{
   text-decoration:none;
}
#login a:hover{
    text-decoration:underline;
}
#banner{
width:28%;
    text-align:left;
    background:url(../../images/banner1-bg.jpg) repeat-x;
}
#login{
    color:#fff;
    height:80px;
    text-align:right;
    background:url(../../images/banner1-bg.jpg) repeat-x;
}
#search_field{
    background-color:#dcf2db;
}
.small-font{
    font-size:0.7em;
}
.input{
    width:150px;
}

.input{
    margin:0.5em;
    margin-left:0;
}
.title{
    font-size:1.4em;
    color:#888;
}
.form-title{
    font-weight:bolder;
    font-size:1.2em;
}
input{
    font-size:110%;
    padding:2% 2% 2% 2%;
    padding: 0.2em 0.2em 0.2em 0.2em;
    border:1px solid #76b375;
}
input[type=submit],input[type=button]{
    border:2px solid #bbd;
    -moz-border-radius:3px;-webkit-border-radius:3px;
    border-radius:3px;  
}
input[type=image]{
    border:none;  
    margin:0;
    padding:0 0 0 0;
}
label {

}
#notice{
    -moz-border-radius-topright:3px;-webkit-border-radius-topright:3px;
    -moz-border-radius-topleft:3px;-webkit-border-radius-topleft:3px;
    border-radius-topright:3px; 
    border-radius-topleft:3px;  
    margin:0 ;
    padding:0.1em 0.1em 0.1em 1em ;
    border-top:1px solid #aaa;
    border-left:1px solid #aaa;
    border-right:1px solid #aaa;
}
#notice ul,ul li {
    text-align:left;
}
.notice {
    background-color:#ffea01;
    border-bottom:4px solid #161;

}
.error {
    background:#ffea01;
    border-bottom:4px solid #a11;
    
}

 .centered-dialog{
    padding:1em 1em 1em 1em ;
    margin:1em;
    text-align:center;
    
 }
.huge-font{
    font-size:1.4em;
}

#desc {
    -moz-border-radius:2px;-webkit-border-radius:2px;
    border-radius:2px;  
    margin:0.4em ;
    padding:0.8em 0.8em 0.8em 0.8em ;
    border:1px solid #bbb;
    color:#866823;
}

#desc_1 {
    -moz-border-radius:2px;-webkit-border-radius:2px;
    border-radius:2px;  
    margin:0;
    padding:0.8em 0.8em 0.8em 0.8em ;
    border:1px solid #bbb;
    color:#866823;
}

#desc ul,ul li {
    text-align:left;
}
.desc {
    background-color:#fff2dd;
    border-bottom:4px solid #ffde99;

}

.sms-code{
    font-size:1.4em;
    padding:0.2em 0.2em 0.2em 0.2em ;
    border:2px solid #282;
    color:#611;
    -moz-border-radius:3px;-webkit-border-radius:3px;
    border-radius:3px;     
}
.invite{
    width:31%;
    height:3em;
    float:left;
    padding:1% 1% 1% 1% ;
}
.invite input{
    width:80%;
}
#invites{
    width:84%;
    padding:1% 1% 1% 8% ;
}
#home *{
    
}
#index-desc{
    width:33.4%;
    padding:2% 3.6% 4% 4%;
    float:left;
    
}
#index-desc a{
    color:#33762d;
    font-weight:bolder;
    font-size:1.1em;
    text-decoration:none;
}
#index-desc * {
    color:#808080;
}
#index-signup{
    background:url(../../images/create_group_bg.png) no-repeat;
    width:50.3%;
    float:left;
    padding:6% 0 0 4%; 
}
#home-group-reg{
    padding:0 0.6em 0.6em 0 ; 
    margin:0;  
    color:#888;
}

#home-group-reg table{
    margin:0;
}
#home-group-reg * td{
    width:50% ;
    
}

#home-group-reg * input[type=text],input[type=password]{
    width:150px;
    border:1px solid #76b375;
    margin:0;
}
#home-group-reg * select{
    width:150px;
    margin:0.6%;
}
#home-group-reg * #notification{
    width:150px;
}
#group-reg{
    margin:0;      
}

#group-reg * table{

}
#group-reg * td{
    width:50% ;
}

#group-reg * input[type=text], input[type=password]{
    width:150px;
    border:1px solid #76b375;
    margin-left:0;
}
#group-reg * select{
    width:150px;
    margin-left:0;
}
#group-reg * #notification{
    width:150px;
}

#profile{
    padding:0 0 0 0 ;
}

#profile .sect{
    width:48%;
    float:left;
}
#current-photo{
    
    width:80px;
    height:80px;
    padding:0 0 0 0;
}
.notification{
    color:#b22;
    margin-left:0;
    margin-right:0;
}
#current-photo img{
    border:2px solid #888;
    margin:0;
}
#choose-photos img{
    float:left;
    margin-left:0;
}
#choose-photos a img{
    border:1px solid #eee;
}
#choose-photos a:hover img{
    border:1px solid #aaa;
}

#choose-photos{
    height:200px;
    width:300px;
    border:1px solid #eee;
    overflow:auto;
}

.photo {
    float:left;
    border:1px solid #aaa;
    margin:4px;
}
.photo .actions{
    background-color:#bbb;
}
.photo .actions a{
    font-size:0.8em;
}
#upload-photo-form input{
    font-size:1.2em;
}
.topnav{
    padding:0.4em 0.1em 0.4em 2% ;
    margin:0;
    font-size:0.9em;
    font-weight:normal;
    color:#bbb;
}
.topnav li{
    padding:0.2em 0.1em 0.2em 2em ;
}
.topnav a{
    text-decoration:underline;
}

.topnav li.active a{
    color:#999;
    font-weight:bolder;
    text-decoration:none;
}

.topnav li.active {
    color:#999;
    font-weight:bolder;
    text-decoration:none;
}

ul#mygroups{

}
ul#mygroups  tr td a{

}
#header #group-search {
    color:#fff;
}
#group-selector{
   background:url(../../images/group-selector-bg.png);
   width:100%;
   height:1.8em;
}
#group-mgt {
    font-size:90%;
    padding:0 0 0 0;
    margin:0;
    font-weight:normal;
}

.remove_replace a{
    color:#ccc;
    text-decoration:none;
    font-weight:bolder;
    font-size:0.9em;
}

#group-mgt ul{
margin:0;
padding:0 0 0 0;
}

#system-error {
    padding:2em 2em 2em 2em ;
    font-size:1.8em;
}
.error-alert{
color:#e11;
font-size:0.8em;
}

.grayed-out {
    font-size:1.2em;
    background-color:#ddd;
    padding:0.4em 0.4em 0.4em 0.4em ;
}
.text-message{
    width:83.5%;
    min-height:65px;
    float:left;
    padding:12px 0.4em 0 0.4em ;
    border-left:1px solid #ccc;
    background:#eee;
}
.sender-img{
    width:80px;
    float:left;
    padding-right:5px;
}

#select-month input{
    border:none;
    background:none;
    color:#11a;
    padding:0.2em 0.8em 0.2em 0.8em;
    font-size:0.9em;
    cursor:pointer;
}
.select-month{
    width:30%;
    text-align:left;
}
#select-year{
    background:#aaa;
    text-align:center;
    padding:0.3em 0.3em 0.3em 0.3em ;
    color:#fff;
    font-weight:bolder;
}
#select-year a{
    color:#fff;
    font-weight:bolder;
}
#month_of_interest{
    background:#ddd;
    text-decoration:underline;
}

#year-options{
    padding:0.2em 0.8em 0.2em 1.4em;;
}

.more-msg-info{
    color:#bbb;
}

.enclosure{
    width:100%;
    padding:0 0 0.6em 0 ; 
    margin-top:1%;
    margin-bottom:4%;
    border:2px solid #eee;
    -moz-border-radius:3px;-webkit-border-radius:3px;
    border-radius:3px;     
    text-align:center;
}

.enclosure table{

}
#passwd {
    margin-left:38%;
    width:14em;
}
#passwd * input{
    margin-top:0.5em;
    margin-bottom:0.5em;
}
.huge-font{
    color:#888;
}
=======
/* imwangi's additions */

.solid_box{
    width:99%;
    padding:3px;
    border:2px solid #aaa;
}
.left_side{
    float:left;
}

#container_1{
    margin:;
    height:80px;
    padding:0.2em 0.2em 0.2em 0.2em ;
    
}

#activity{
    width:40%;
}
#activity-stats {
/*
    border-bottom: 1px solid #aaa;
    background:#f4f4f4;
    margin-bottom:0.4em;
*/
    color:#aaa;
    padding:1% 1% 1% 1% ;
    font-size:1.2em;
}

#activity-stats .value {
    color:#000;
    font-size:1.0em;
}

#activity-stats .emphasis {
    color:#000;
    font-size:1.4em;
}

.a_third{
    width:30%;
    padding:0.4em 0.4em 0.4em 1em ;
    height:100%;
    float:left;
    margin:0.2em;
    font-weight:bold;
    color:#aaa;
}

.a_fourth{
    width:22%;
    padding:0.4em 0.4em 0.4em 1em ;
    height:100%;
    float:left;
    margin:0.2em;
    font-weight:bold;
    color:#aaa;
}

#manage_groups{
    width:26%;
    border-right:none;
}
#container_2{
    height:25px;
}
#container_3{
    padding:0.6em 0.6em 0.6em 0.6em ;
    margin:0.4em;
}
#ranking{
    border-right:none;
}
#year_options{
    width:16%;
}

#year_of_interest{
    float:right;
}

#container_4{
    padding:0.6em 0.6em 0.6em 0.6em ;
}
#container_5{
    height:25px;
}
#out_of{
    float:right;
}

.photo_1{
    width:75px;
    margin:2px;
    float:left;
}

.extra_text{
    width:88%;
    padding:3px;
    float:left;
}

.wrap_messages{
    width:100%;
    clear:both;
    height:8px;
}

#image_1{
    height:45px;
    width:50px;
}

#no_solid_box{
    border-style:none;
}

#my_groups {
    padding:0;
}

#first_spacing{
    width:10%;
    float:left;
}

#extra_details{
    width:50%;
}

#delete{
    margin-top:-2px;
}

#spacing_1{
    width:8%;
    float:left;
}

#spacing_2{
    width:2%;
    float:left;
    
}

#member_details, #member_stats{
    width:22%;
    height:70px;
    background:#f4f4f4;
    padding:0.6em 0.6em 0.6em 0.6em ;
}

#group_details{
    width:45%;
    height:70px;
    background:#f4f4f4;
    padding:0.6em 0.6em 0.6em 0.6em ;
}

#member_stats{
    border-left:2px solid #ccc;
    background:#eee;
    }
.member {
    background:#eee;
}
.remove_replace{
    width:15%;
    float:left;
}

#spacing_3{
    width:2%;
    float:left;
}

#group-mgnt-status{
    padding: 0 0 0 0;
    width:25%;
}
#popup_notice{
    -moz-border-radius-topright:3px;-webkit-border-radius-topright:3px;
    -moz-border-radius-topleft:3px;-webkit-border-radius-topleft:3px;
    border-radius-topright:3px; 
    border-radius-topleft:3px;  
    margin:0 ;
    padding:0.1em 0.1em 0.1em 1em;
    border-bottom:1px solid #aaa;
    border-left:1px solid #aaa;
    border-right:1px solid #aaa;
}

.popup_notice {
    background-color:#ffea01;
    border-top:4px solid #161;

}
.popup_error {
    background-color:#ffea01;
    border-top:4px solid #a11;
}

#feedback{
    width:60%;
}

#feedback * textarea{
    font-size:122%;
    margin:0.8em;
    margin-right:0;
    height:60px;
    width:96%;
    border:1px solid #76b375;
    font-family:verdana;
}

#feedback * input[type='text']{
    margin:0.8em;
    margin-right:0;
    margin-bottom:0;
    width:150px;
    border:1px solid #76b375;
}
.larger-faint{
    font-size:122%;
    font-weight:bold;
    color:#aaa;
}
.faint{
    color:#aaa;
}
.faint-bold{
    color:#aaa;
    font-weight:bold;
}
.filling{
    color:#000;
}
/**/
/*jQuery drop down
==================
*/
#jsddm
{	
margin: 0;
margin-left: 5.1%;
padding: 0;
    
}

#jsddm li
{	float: left;
    list-style: none;
    
    }

#jsddm li a
{	display: block;
    background:#aaa;
    padding: 0.4em 3.1em;
    white-space: nowrap;
    width:8em;
    text-decoration:none;
    border:none;

    }
#jsddm li a#my-groups-title{
    color:#fff;
    font-weight:bolder;
}
#jsddm li a:hover
{
}

#jsddm li ul
{	margin: 0;
    padding: 0;
    position: absolute;
    visibility: hidden;
    border:1px solid #bbb;
    border-top:none;
}

#jsddm li ul li
{	float: none;
    display: inline;
}

#jsddm li ul li a
{	width: auto;
    background: #fff;
    width:8.1em;
    text-decoration:none;
    font-weight:normal;
    bordeR:none;
    }

#jsddm li ul li a:hover
{	
background: #f2f2ff;
border-bottom:none;
}

#home{
    background:url(../../images/home-bg.png) no-repeat;
    min-height:390px;
}

/*jQuery validation styles*/

	input.submit { float: none; }
	input.error {border-bottom:4px solid #811; background:#fff;  }
	label.error {
		background: none;
		padding-left: 1px;
        clear:both;
        display:block;
        border:none;
        color:#a11;
        font-size:11px;
	}
	label.valid {
		background: url('<?=url::site()?>application/views/images/checked.gif') no-repeat;
		display: block;
		width: 16px;
		height: 16px;
        clear:both;
	}

#accordion {
    font-size:1.1em;
}
    
#accordion div ul li{
    list-style:disc ;
    padding:1% 2% 2% 0;
}

#accordion div ul {
    padding:0 0 0 0;
    margin:0;
}
#accordion div ol li{
    list-style-position:;
    padding:1% 2% 2% 0;
    font-weight:bolder;
}

#accordion div ol {
    padding:0 0 0 0;
}

#accordion a{
    border:none;
}

.big-faded{
    font-size:1.8em;
    color:#eee;
}

#mid-nav{
    color:#777;
    padding:0.2% 11% 0 0;
}

#current-group{
    color:#777;
    font-weight:bold;
    font-size:1.2em;
}

#mid-nav-right a{
    color:#77f;
    text-decoration:underline;
}

ul#activity-tabs {
    padding:0.4em 0.4em 0.3em 0.4em;
    border-bottom:1px solid #aaa;
    margin-bottom:0;
}

ul#activity-tabs li{
    list-style:none;
    display:inline;
    -moz-border-radius-topright:3px;-webkit-border-radius-topright:3px;
    -moz-border-radius-topleft:3px;-webkit-border-radius-topleft:3px;
    border-radius-topright:3px; 
    border-radius-topleft:3px; 
    border:1px solid #aaa;
    border-bottom:none;
    background:#eee;
    padding:0.4em 0.4em 0.4em 0.4em ;    
}

ul#activity-tabs li a{ 
    color:#777;
    font-weight:bolder;
    text-decoration:none;
}

ul#activity-tabs li.active{
    background:#fff;
    border-bottom:none;
}

#the-rest-of-contents{
    -moz-border-radius:3px;-webkit-border-radius:3px;
    border-radius:3px; 
    border:1px solid #aaa;
    border-top:none;
    margin-top:0;
    position:relative;
    top:-1px;
}

#sms-from-web{
    border-bottom:2px solid #eee;
}
#sms-from-web form table tr td{
    padding:0 0 0 0;
    height:40px;
    }
#sms-from-web form table tr td textarea{
    padding:5px 5px 5px 5px;
    font-size:1.8em;
    margin:0;
    height:2.2em;
    width:98%;
    bordeR:1px solid #eee;
}
#sms-from-web * input{
    -moz-border-radius:1px;-webkit-border-radius:1px;
    border-radius:1px; 
    }
#sms-from-web * input[type=submit]{
    bordeR:1px solid #aaa;
    background:#eee;
    color:#888;
    padding:0 1em 0 1em;
    margin:0;
}
#xters-remaining{
    width:2.4em;
    bordeR:1px solid #aaa;
    padding:0.3em 0.1em 0.3em 0.3em ;
    color:#777;
}
#frontpage-wording{
    font-size:2.2em;
    color:#33b62d;
    text-align:right;
}

#frontpage-wording b{
    color:#33b62d;
}

#frontpage-wording-learn-more{
    text-align:right;
}

#frontpage-wording-learn-more a{
    color:#ed1a3d;
}

#features{
font-size:12px;
    background:url(../../images/features-bg.png) no-repeat;
    width:800px;
    padding:4% 8% 4% 8.6% ;
    color:#555;
}

#features .item{
    height:240px;
    width:214px;
    float:left;
    
}
#features .item.row-2{
    height:220px;
}
#features .item .header{
    height:57px;
}
#features .item .desc{
    background:none;
    border:none;
}
#features .item .desc ul{
    margin:0;
    padding: 0 0 0 16%;
}
#features .item .desc ul li{
    list-style:disc ;
    padding:0.1em 0 0.2em 0;
    margin-bottom:0.6em;
}
#features .item .desc i{
    font-size:9px;
}
#features .item .desc b{
    color:#444;
    font-size:109%;
}
#what-is-semeni{
    background:url(../../images/what-is-semeni.png) no-repeat top right;
}
#what-does-it-cost{
    background:url(../../images/what-does-it-cost.png) no-repeat top right;
}
#why-use-it{
    background:url(../../images/why-use-it.png) no-repeat top right;
}
#how-does-it-work{
    height:400px;
    background:url(../../images/how-does-it-work.png) no-repeat top right;
}
#how-many-groups{
    background:url(../../images/how-many-groups.png) no-repeat top right;
}
/*
#features .item .desc ul.how-many-groups li{
    margin-bottom:0.6em;
}

#features .item .desc ul.what-does-it-cost li{
    margin-bottom:0.6em;
}*/

#join-now-now {
    position:relative;
    top:-16px;
    left:12px;
}


