@charset "utf-8";
/* CSS Document 

For mconnect.co.ke
By Silas Kirui (silas@sicdesigns.info)
Date: October 18, 2012.
-------------------------
COLORS
Body Fonts color: #5a5959;
green: #799305;
*/
body
{
	font-family: 'Open Sans', sans-serif;
	margin:0;
	color:#5a5959;
	font-size:13px;
	line-height:22px;
	background-color:#ececec;
}
a
{
	color:#799305;
	text-decoration:none;
}
a:hover
{
	text-decoration:underline;
}
img
{
	border:0;
}
h1, h2, h3
{
	color:#262626;
}
.topHeader
{
	min-width:1000px;
	height:152px;
	background:url(../img/top_back_pattern.png) repeat-x;
	background-color:#262626;
	border-bottom:solid 1px #000;
}
.inTopHeader
{
	width:940px;
	margin:auto;
}
.logo
{
	position:relative;
	top:20px;
	float:left;
}
.greenbutton a
{
	position:relative;
	float:right;
	height:25px;
	background:url(../img/button_grad.png) top repeat-x;
	background-color:#94b601;
	padding: 9px 20px;
	color:#fff;
	font-size:14px;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border-radius:3px 3px 3px 3px;
	border:solid 1px #00000;
	-moz-box-shadow:0 2px 3px #000;
	-webkit-box-shadow:0 2px 3px #000;
	box-shadow:0 2px 3px #000;
	text-decoration:none;
	text-shadow:0 1px 2px #262e01;
}
.greenbutton a:hover, .greenbutton2 a:hover, .submit:hover
{
	background:#95b700;
}
.sign
{
	position:relative;
	right:20px;
}
.greenButtonSignout
{
	margin-right:none;
}
ul.nav
{
	margin:0;
	padding:0;
	list-style:none;
}
ul.nav li 
{
	display:inline;
}
.navigation
{
 	float:right;
	height:48px;
	position:relative;
	bottom:30px;
	padding-top:20px;
	text-shadow:0 1px 1px #000;
	background:url(../img/dark_line.png) top repeat-x;

}
.clear
{
	clear:both;
}
ul.nav li a 
{
	font-size:14px;
	font-weight:900;
	color:#d3d3d3;
	margin-left:20px;
	text-decoration:none;
}
ul.nav li.current a, ul.nav li a:hover
{
	color:#94b600;
}
.pageIntro
{
	min-width:1000px;
	height:98px;
	background: url(../img/white_dot.png) top repeat-x;
	background-color:#dcdbdb;
	border-bottom:solid 1px #c1c0c0;
	box-shadow: 0 1px 0 #fff;
	-webkit-box-shadow: 0 1px 0 #fff;
	-moz-box-shadow: 0 1px 0 #fff;
}
.inPageIntro
{
	width:940px;
	margin:auto;
}
.welcome
{
	color:#262626;
	font-weight:900;
	font-size:18px;
	position:relative;
	top:10px;
	margin-bottom:10px;
	text-shadow:0 1px 0 #fff;
}
.welcomepages
{
	position:relative;
	top:20px;
	margin-bottom: 10px;
	font-size: 22px;
}
.welcome span
{
	color:#799305;
}
.welcomeIntro
{
	width:620px;
	text-shadow:0 1px 0 #fff;
	position:relative;
	top:8px;
	float:left;
}
.welcomeIntroPages
{
	position: relative;
	top:20px;
}
.search
{
	float:right;
	position:relative;

}
.textFieldSearch
{
	width:250px;
	height:29px;
	border:solid 1px #cccccc;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border-radius:3px 3px 3px 3px;
	position:relative;
	bottom:5px;
	padding:5px 10px;
	color:#a3a1a1;
	font-style:italic;
	padding-right:40px;
}
.submitSearch
{
	position:absolute;
	top:3px;
	right:10px;
	background:url(../img/search_icon.png) no-repeat;
	border:none;
	width:24px;
	height:24px;
}
.textFieldSearch:focus
{
	border:solid 1px #94b700;
	background:#fff;
	color:#262626;
	font-style:normal;
}
.mainContent
{
	min-width:1000px;
}
.inMainContent
{
	width:940px;
	margin:auto;
}
.leftContent
{
	float:left;
	width:620px;
	min-height: 300px;
	padding-top: 20px;
	margin-bottom:20px;
}
.leftContentWide
{
	width:940px;
}
.prodList
{
	width:596px;
	min-height:170px;
	background:url(../img/white_dot.png) repeat-x top;
	background-color:#f4f2f2;
	border:solid 1px #d5d3d3;
	padding:12px;
	position:relative;
	margin-bottom:20px;
	box-shadow: 0 0 2px #fff inset;
	-webkit-box-shadow: 0 0 2px #fff inset;
	-moz-box-shadow: 0 0 2px #fff inset;
}
.prodImg
{
	float:left;
	position: relative;
	left:3px;
	border:solid 1px #d5d3d3;
	max-width:150px;
	padding:5px;
	background:#fff;
	height:155px;
}
.prodImg img
{
	height:135px;
	width: auto;
}
.imgSpan
{
	max-width:150px;
	height:135px;
	overflow: hidden;
	display: block;
}
.caption
{
	max-width:150px;
	font-size: 12px;
	color:#9d9d9d;
}
.prodAmmount
{
	position:absolute;
	bottom:0;
	left:0;
	width:160px;
}
.prodText
{
	width:265px;
	float:left;
	margin-left:20px;
}
.prodTitle
{
	color:#262626;
	font-weight:900;
	font-size:16px;
	margin-bottom:8px;
	
}
.prodInfo
{
	color:#9d9d9d;
	margin-right:10px;
	font-size: 12px;
}
.prodDesc
{
	position:relative;
	top:5px;
}
.prodPrice
{
	width:125px;
	background:url(../img/white_dot.png) repeat-x;
	background-color:#e3e2e2;
	border:solid 1px #cfcdcd;
	color:#525151;
	font-weight:900;
	font-size:13px;
	line-height:22px;
	text-shadow:0 1px 0 #fff;
	padding:5px;
}
.prodRight span
{
	font-size:14px;
	color:#799305;
}
.prodRight
{
	width:135px;
	float:right;
	position:relative;
	right:3px;
}

.greenbutton2 a
{
	position:relative;
	float:right;
	height:25px;
	background:url(../img/button_grad.png) top repeat-x;
	background-color:#94b601;
	padding: 9px 0;
	width:135px;
	text-align:center;
	color:#fff;
	font-size:14px;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border-radius:3px 3px 3px 3px;
	border:solid 1px #627900;
	-moz-box-shadow:0 2px 3px #acabab;
	-webkit-box-shadow:0 2px 3px #acabab;
	box-shadow:0 2px 3px #acabab;
	text-decoration:none;
	text-shadow:0 1px 2px #262e01;
	margin-bottom:10px;
}
.order
{
	position:relative;
	left:2px;
	margin-top:10px;
}
.greybutton a
{
	background:url(../img/button_grad_grey.png) top repeat-x;
	border:solid 1px #656464;
	text-shadow:0 1px 2px #363636;
}
.greybutton a:hover 
{
	background:#989898;
}
.sideContent
{
	float:right;
	width:300px;
	padding-bottom: 20px;
}
.adspace
{
	width:298px;
	height:250px;
	background:url(../img/white_dot.png) repeat-x top;
	background-color:#f4f2f2;
	border:solid 1px #d5d3d3;
	color:#bbbaba;
	position:relative;
}
.bottom
{
	min-width:1000px;
	background:url(../img/white_dot.png) top repeat-x;
	background-color:#dcdbdb;
	border-top:solid 1px #c1c0c0;
	
}
.inBottom
{
	width:940px;
	margin:auto;
	min-height:240px;

}
.about
{
	width:300px;
	float:left;
	text-align: justify;
	position:relative;
}
.vertLine
{
	position:absolute;
	right:-15px;
	height: 100%;
	top:0;
	width:2px;
	background: url(../img/line_vertical.png) right repeat-y;
}
.category
{
	float:left;
	width:300;
	margin-left:20px;
	position: relative;
}
ul.cat
{
	margin:0;
	padding:0;
	margin-left:30px;
}
ul.cat li 
{
	margin-bottom:4px;
	list-style-image: url(../img/tick.png);
}

ul.cat li a
{
	color:#5a5959;
}
ul.cat li a:hover
{
	color:#799305;
	
}
.contactus
{
	width:220px;
	float:right;
}
/*Form Style*/
.forms
{
	width:580px;
	padding:20px;
	background:url(../img/white_dot.png) repeat-x top;
	background-color:#f4f2f2;
	border:solid 1px #d5d3d3;
	margin-bottom: 20px;
	box-shadow: 0 0 2px #fff inset;
	-webkit-box-shadow: 0 0 2px #fff inset;
	-moz-box-shadow: 0 0 2px #fff inset;
}
.checkBox
{
	position:relative;
	top:2px;
}
.fieldName
{
	width:170px;
	display:inline-block;
	position: relative;
	left:20px;
}
.textField
{
	width:310px;
	height:29px;
	border:solid 1px #cccccc;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border-radius:3px 3px 3px 3px;
	position:relative;
	bottom:5px;
	padding:5px 10px;
	color:#a3a1a1;
	font-style:italic;
	padding-right:40px;
	left:20px;
	margin-bottom: 20px;
}
.imgField
{

	position:relative;
	bottom:5px;
	padding:5px 10px;
	color:#a3a1a1;
	font-style:italic;
	padding-right:40px;
	left:20px;
	margin-bottom: 20px;
}
.selectField
{
	padding:10px 5px;
	width:362px;
	height:39px;
}
.msgField
{
	width:350px;
	height:200px;
	border:solid 1px #cccccc;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border-radius:3px 3px 3px 3px;
	position:relative;
	bottom:5px;
	padding:5px;
	color:#a3a1a1;
	font-style:italic;
	padding-right:5px;
	left:23px;
	margin-bottom: 20px;
	resize:none;
	font-family: 'Open Sans', sans-serif;
	font-size: 13px;
	text-align: left;
}
.msgDelivery
{
	height:100px;
}
.msgFieldOrder
{
	height:100px;
	text-align: left;
}
.msgFieldProd
{
	height:100px;
}
.textField:focus, .msgField:focus
{
	border:solid 1px #94b700;
	background:#fff;
	color:#262626;
	font-style:normal;
	font-size: 13px;
}
.submit
{
	position:relative;
	float:right;
	height:40px;
	background:url(../img/button_grad.png) top repeat-x;
	background-color:#94b601;
	padding: 0px 15px;
	text-align:center;
	color:#fff;
	font-size:16px;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border-radius:3px 3px 3px 3px;
	border:solid 1px #627900;
	-moz-box-shadow:0 2px 3px #acabab;
	-webkit-box-shadow:0 2px 3px #acabab;
	box-shadow:0 2px 3px #acabab;
	text-decoration:none;
	text-shadow:0 1px 2px #262e01;
	margin-bottom:10px;
	right:24px;
}
.radio
{
	position:relative;
}
.radio span
{
	position:relative;
	margin-left:20px;
}
.radio input
{
	position:relative;
	top:2px;
}
.asterisk
{
	font-size:16px;
	color:#799305;
	position:relative;
	left:5px;
	top:2px;
}
/*End of Form Style*/
.ftprod
{
	position:relative;
	margin-bottom: 20px;
	box-shadow: 0 0 2px #fff inset;
	-webkit-box-shadow: 0 0 px #fff inset;
	-moz-box-shadow: 0 0 2px #fff inset;

}
.ftImg
{
	width:85px;
	height:80px;
	overflow: hidden;
	float:left;
}
.ftImg2
{
	height:80px;
	width:auto;
}
.ftprod:hover
{
	opacity: 0.9;
}
.ftprod1
{
	float:left;
}
.ftprod2
{
	float:right;
}
/*Alert*/
.alert
{
	width:536px;
	min-height:20px; 
	background:#fac1c1;
	border:solid 1px #da8b8b;
	margin-bottom:10px;
	padding:20px;
	color:#8d4444;
	position:relative;
	display:none;
}
.alertWide
{
	width:580px;
}
.alertIcon
{
	float:left;
}
.alertIcon2
{
	float:none;
	position:relative;
	top:10px;
}
.alertText
{
	float:left;
	margin-left:10px;
}
.alertSus
{
	width:510px;
	display: block;
	position:relative;
	left:40px;
	bottom:30px;
}
.close
{
	position:absolute;
	top:5px;
	right:5px;
	opacity:0.6;
}
.close:hover
{
	opacity:1;
}
.alertGreen
{
	background:#cbf5a5;
	border:solid 1px #8fc65d;
	color:#507330;
}
.alertYellow
{
	background:#f0f5a5;
	border:solid 1px #c6c55d;
	color:#827429;
}
/*End of Alert*/
.ftProd
{
	width:284px;
	min-height: 50px;
	background:url(../img/white_dot.png) repeat-x top;
	background-color:#f4f2f2;
	border:solid 1px #d5d3d3;
	padding:8px;
	margin-bottom: 10px;
}
.ftText
{
	float:right;
	width:190px;
}
.ftText h3
{
	line-height: 32px;
	margin:0;
	line-height: 20px;
}
.ftProd:hover
{
	background:#fff;
}
.dash
{
	width:290px;
	height:32px;
	background:url(../img/black_line.png) bottom repeat-x;
	background-color:#262626;
	padding:8px 5px 0;
	
}
.dash a
{
	color:#dcdbdb;
	font-weight: 900;
	text-shadow:0 1px 2px #000;
	width:290px;
	display: inline-block;
}
.dash a:hover, .dashCurrent a
{
	color:#93b503;
	text-decoration: none;
}
.dashIcon
{
	position:relative;
	margin-left:10px;
	margin-right:20px;
	top:1px;
	float:left;
}
.dash:hover, .dashCurrent
{
	background-color:#303030;
}
.welcomeUser
{
	float:right;
	color:#dcdbdb;
	margin-right:30px;
	position:relative;
	top:10px;
}
.orderIcon
{
	float:left;
	margin-right:6px;
	position:relative;
	top:2px;
}
.delIcon img
{
	width:30px;
	height:16px;
	float:right;
	position:relative;
	top:4px;
}
.delIcon2 
{
	position:relative;
	left:2px;
}
.back a 
{
	color:#fff;
	font-weight: 900;
	font-size:15px;
	background:url(../img/button_grad.png) top repeat-x;
	background-color:#94b601;
	padding: 9px 15px;
	color:#fff;
	font-size:14px;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border-radius:3px 3px 3px 3px;
	border:solid 1px #627900;
	-moz-box-shadow:0 2px 3px #abaaaa;
	-webkit-box-shadow:0 2px 3px #abaaaa;
	box-shadow:0 2px 3px #abaaaa;
	text-decoration:none;
	text-shadow:0 1px 2px #262e01;
	float:right;
	position: relative;
	right:25px;
}
.back a:hover
{
	background:#93b500;
}
.bckIcon
{
	position:relative;
	top:3px;
	right:2px;
}
.orderTitle
{
	font-size: 18px;
}
.trTitle
{
	background-color:#262626;
	color:#dcdbdb;
	font-weight: 900;
	text-shadow:0 1px 2px #000;
	font-size:15px;
}
.tables td 
{
	padding-left:15px;
}
.trDark
{
	background:#dcdbdb;
}
.trExp
{
	background: #fdd6c1;
}
.tables
{
	border:solid 1px #262626;
}
.trUnread
{
	font-weight: 900;
	color:#262626;
}
.orderDetails
{
	width:580px;
	padding:20px;
	background:url(../img/white_dot.png) repeat-x top;
	background-color:#f4f2f2;
	border:solid 1px #d5d3d3;
	margin-bottom: 20px;
}
.orderDetails strong 
{
	width:150px;
	margin-bottom: 10px;
	display: inline-block;
}
.msgOrder
{
	width:390px;
	display: inline-block;
}
.close2
{
	float:right;
	opacity:0.7;
	position:relative;
	top:-10px;
	left:10px;
	cursor:pointer;
}
.close2:hover 
{
	opacity:0.9;
}
.prodThumb
{
	width:60px;
	height:auto;
	border:solid 1px #c1c0c0;
	padding:1px;
	background:#fff;
}

.adThumb
{
	border:solid 1px #c1c0c0;
	padding:2px;
	background:#fff;
	float:left;
}
.adThumbImg
{
	width:60px;
	height: auto;
}
.editIcon
{
	position:relative;
	top:4px;
	margin-right:3px;
	float:left;
}
.delIcon
{
	position:relative;
	opacity:0.8;
	top:2px;
	right:2px;
}
.delIcon:hover 
{
	opacity:1;
}
/*Social Network*/
.socialContainer
{
	width:250px;
	height:30px;
	position:relative;
	float:left;
	top:35px;
	left:50px;
}
.socIcon a
{
	width:30px;
	height:30px;
	float:right;
	margin-left:20px;
}
.google a
{
	background:url(../img/google+.png) top center no-repeat;
}
.google a:hover
{
	background:url(../img/google+.png) bottom center no-repeat;
}
.twitter a
{
	background:url(../img/twiter_icon.png) top center no-repeat;
}
.twitter a:hover
{
	background:url(../img/twiter_icon.png) bottom center no-repeat;
}
.fb a 
{
	background:url(../img/facebook.png) top center no-repeat;
}
.fb a:hover 
{
	background:url(../img/facebook.png) bottom center no-repeat;
}
.in a 
{
	background:url(../img/in_icon.png) top center no-repeat;
}
.in a:hover 
{
	background:url(../img/in_icon.png) bottom center no-repeat;
}
.joinus
{
	position:absolute;
	top:-20px;
	left:30px;	
}
/*Social Network Ends*/
/*Drop Down Products*/
a.account
{
	width:135px;
	height:30px;
	border:solid 1px #b1b0b0;
	background: url(../img/grey_button_grad.png) top repeat-x;
	background-color:#e2e1e1;
	display: block;
	margin-bottom: 15px;
	border-radius:3px 3px 3px 3px;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	color:#7a7979;
	text-shadow:0 1px 0 #fff;
	font-weight: 900;
	font-size:14px;
	padding-top:6px;
	padding-left:10px;
	position: relative;
	cursor: pointer;
	text-decoration: none;
	box-shadow: 0 1px 2px #d0d0d0;
	-moz-box-shadow: 0 1px 2px #d0d0d0;
	-webkit-box-shadow: 0 1px 2px #d0d0d0;
}
.dropdown
{
	width:145px;
	height:36px;
	margin-bottom: 0px;
	float:left;
	position: relative;
	bottom:10px;

}

.sideButton
{
	position: absolute;
	right:0;
	top:0;
}
ul.root
{
	width:145px;
	background: url(../img/drop_down_line.png) top repeat-x;
	background-color:#dedddd;
	margin:0;
	padding:0;
	list-style: none;
	position: absolute;
	top:36px;
	z-index: 100;
	border:solid 1px #b1b0b0;
	border-top:none;
	border-radius:0 0 3px 3px;
	-moz-border-radius:0 0 3px 3px;
	-webkit-border-radius:0 0 3px 3px;
	padding-bottom: 2px;
}
li.dropLi
{
	position:relative;
	top:2px;
}
li.dropLi a
{
	color:#7a7979;
	font-weight: 900;
	font-size: 14px;
	text-shadow:0 1px 0 #fff;
	width:130px;
	background: url(../img/drop_down_line.png) bottom repeat-x;
	display: block;
	padding:5px 5px 8px 10px;
	text-decoration: none;
}
li.dropLiLast a 
{
	background-image: none;
}
li.dropLi a:hover 
{
	color:#799305;
	background-color:#ebeaea;
}
/*Drop Down Products Ends*/
/*Footer*/
.footer
{
	width:100%;
	min-height:50px;
	border-top:solid 1px #c1c0c0;
	background: url(../img/white_dot.png) top repeat-x;
	background-color:#ececec;

}
.inFooter
{
	width:940px;
	height:40px;
	margin:0 auto;
	font-size:10px;
	line-height: 14px;
	padding-top:10px;
	color:#7b7b7b;
}

/*Footer Ends*/
.agree
{
	position:relative;
	left:20px;
}
.lorry
{
	float:right;
	margin-left:40px;
	background:#fff;
	padding:5px;
	border:solid 1px #d5d3d3;

}
.lorry img 
{
	width:140px;
	height:auto;
}
.ad a
{
	position:relative;
	top:6px;
	font-weight: 900;
	
}
.ad a:hover 
{
	background:#94b600;
}
.terms
{
	text-indent: -10px;
	font-size: 12px;
	line-height: 20px;
	width:600px;
	float:right;
	text-align: justify;
}
.terms li 
{
	margin-right:10px;
	padding-left:10px;
	text-indent: 0;
}
/*Help*/
.help
{
	width:270px;
	min-height:55px;
	padding:15px;
	background: url(../img/top_back_pattern.png) repeat;
	background-color:#262626;
}
.helpIcon
{
	position:relative;
	float:left;
}
.helpText
{
	width:200px;
	float:right;
	color: #a2a2a2;
	line-height: 16px;
	font-size: 12px;
	position:relative;
	top:5px;
	
}
.helpTextTitle
{
	font-weight: 900;
	font-size:18px;
	color:#9abd00;
	text-shadow:0 1px 2px #000;
	position:relative;
	bottom:5px;
}
/*End of Help*/