﻿
/*/// <summary>

/// *************************************************************************************************************

/// MAIN MODULE:              BC Computers

/// SUB MODULE :              css

/// AUTHOR:                   Chandika Jayawardena.

/// CREATED:                  20-July-2009

/// DESCRIPTION:              This module contained all the styles of the user interfaceses

/// MODIFICATION HISTORY:     1.0     15-Auguest-2009      Initial Version

/// COPYRIGHT:                Copyright csolutionsinfo.com. All Rights Reserved

/// *************************************************************************************************************

/// </summary>

*/






body
{
	margin: 0px;
	background-color: #ffffff;
	background-image: url(images/page_bg.jpg);
	background-repeat: repeat-x;
}

/* ============== SAFARI HACK BACKGROUND PROPERTIES =========================================== */
.pagebody
{
	margin: 0px;
	background-color: #ffffff;
	background-image: url(images/page_bg.jpg);
	background-repeat: repeat-x;
}



/* ============== COMMON ELEMENTS STYLES ====================================================== */
.placeholder
{
	float: left;
	height: auto;
	width: 100%;
}

.wrapper
{
	width: 980px;
	height: auto;
	margin: 0 auto;
}

.wrapper .pagetop
{
	width: 980px; /*height: 120px;*/
	float: left;
}

.pagetop .top
{
	width: 980px;
	height: 87px;
	float: left;
}

.pagetop .logo
{
	width: 650px;
	height: 87px;
	float: left;
}

.wrapper .mainnuggets
{
	width: 980px;
	height: 140px;
	float: left;
}

.wrapper .middlecontainer
{
	float: left;
	width: 675px;
	min-height: 500px;
	height: auto;
}

.wrapper .rightcontainer
{
	float: left;
	width: 270px;
/*	min-height: 400px;*/
	height: auto;
	height:444px;
	margin-left: 10px;
}

.required
{
	font-family: Verdana;
	font-size: 10pt;
	font-weight: bold;
	color: #ff0000;
}


.higap
{
	width: 100%;
	height: 4px;
	font-size: 1px;
	float: left;
}

/* ============== MAIN MENU STYLES BEGIN ====================================================== */
.pagetop .navigator
{
	width: 980px;
	height: 33px;
	float: left;
}

.navigator div
{
	float: right;
	width: 836px;
	height: auto;
}

.mainnavigator
{
	float: left;
	width: 100%;
	background: none;
	font-size: 93%;
	line-height: normal;
}

.mainnavigator ul
{
	margin: 0;
	padding: 0;
	list-style: none;
}

.mainnavigator li
{
	float: left;
	background: url( "images/norm_right.jpg" ) no-repeat right top;
	margin: 0;
	padding: 0;
}

.mainnavigator a
{
	display: block;
	background: url( "images/norm_left.jpg" ) no-repeat left top;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	text-decoration: none;
	color: #ffffff;
	font-size: 9pt;
	padding: 10px 15px;
}

.mainnavigator a:hover
{
	display: block;
	background: url( "images/over_left.jpg" ) no-repeat left top;
	color: #000000;
	padding: 10px 15px;
}

.mainnavigator li:hover
{
	float: left;
	background: url( "images/over_right.jpg" ) no-repeat right top;
	margin: 0;
	padding: 0;
}

.mainnavigator .current
{
	float: left;
	background-image: url( "images/current_right.jpg" );
	margin: 0;
	padding: 0;
}

.mainnavigator .current:hover
{
	background-image: url( "images/current_right.jpg" );
}

.mainnavigator .current a
{
	display: block;
	background: url( "images/current_left.jpg" ) no-repeat left top;
	color: #ffffff;
	padding: 10px 15px;
}

.mainnavigator .current a:hover
{
	background: url( "images/current_left.jpg" ) no-repeat left top;
	color: #ffffff;
}

/* ============== MAIN MENU STYLES END ====================================================== */



/* ============== DROP DOWN MENU STYLES BEGIN =============================================== */
#dropmenudiv
{
	position: absolute;
	border-bottom-width: 0;
	font: 12px/25px Verdana, Trebuchet MS;
	z-index: 10;
	margin: 0px;
	margin-top: -1px;
	margin-left: 1px;
	width: 100%;
	background: #0c9dd9;
}

#dropmenudiv a
{
	display: block;
	color: #fff;
	text-indent: 0px;
	border-bottom: 1px solid #86ceec;
	padding: 0px 4px 1px 4px;
	text-decoration: none;
	margin: 0px;
	width: 100%;
	background: #0c9dd9;
	height: 21px;
}

#dropmenudiv a:hover
{
	background: url(images/popup_hoverbg.jpg) repeat-x bottom #0c9dd9;
	color: #000;
	margin: 0px;
	padding-top: 0px;
	width: 100%;
}
/* ============== DROP DOWN MENU STYLES END ================================================ */



/* ============== SEARCH BOX STYLE BEGIN =================================================== */
.pagetop .searchbox
{
	width: 295px;
	height: 23px;
	padding-top: 1px;
	padding-left: 32px;
	float: right;
	background-image: url(images/search_panelbg.jpg);
	background-repeat: no-repeat;
	visibility: visible;
}

.searchtext
{
	color: #333333;
	font-size: 8pt;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	border: 1px solid #bdc2c9;
	background-color: #ffffff;
}

.btnsearch
{
	background-image: url(images/but_search.jpg);
	background-repeat: no-repeat;
	height: 18px;
	width: 120px;
	color: #000000;
	font-size: 8pt;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	border: none;
	cursor: pointer;
}
/* ============== SEARCH BOX STYLE END ===================================================== */



/* ============== TOP MENU STYLE BEGIN ===================================================== */
.pagetop .topmenu
{
	width: 327px;
	height: 30px;
	float: right;
	margin-top: 20px;
	text-align: right;
	vertical-align: top;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: #2c2b2b;
	font-size: 8pt;
}

.pagetop .topmenu a
{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: #2c2b2b;
	font-size: 8pt;
	text-decoration: underline;
}

.pagetop .topmenu a:hover
{
	color: #005da3;
	text-decoration: none;
}
/* ============== TOP MENU STYLE END ====================================================== */



/* ============== BANNER STYLE BEGIN ====================================================== */
.wrapper .banner
{
	width: 980px; /*height: 215px;*/
	float: left;
	background-image: url(images/main_bannerv3.png);
	background-repeat: no-repeat;
}

.wrapper .banner .container
{
	width: 725px; /*height: 220px;*/
	float: left;
	margin-top: 10px;
	margin-left: 100px;
	border: 0px solid #000000;
	cursor: pointer;
}

.container .recomonded
{
	width: 100px;
	height: 30px;
	float: left;
	margin-top: 133px;
	margin-left: 103px;
}

.container .infoarea
{
	width: 250px; /*height: 205px;*/
	float: left;
	margin-top: 5px;
	margin-left: 190px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: #000000;
	font-size: 10pt;
}

.container .infoarea a
{
	margin-left: 26px;
	width: 74px;
	height: 17px;
	background-image: url(images/but_readmore.jpg);
	background-repeat: no-repeat;
	padding-top: 3px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 8pt;
	color: #ffffff;
	text-decoration: none;
	display: block;
	padding-left: 10px;
	font-weight: bold;
}

.container .infoarea a:hover
{
	color: #30bdfc;
}

.container.infoarea ul
{
	margin-left: 30px;
	line-height: 24px;
}

.container .infoarea h1
{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: #ffffff;
	font-size: 16pt;
}
/* ============== BANNER STYLE END ======================================================= */



/* ============== RIGHT COLUMN STYLE BEGIN =============================================== */
.rightcontainer .rightpanel
{
	width: 247px;
	min-height: 300px;
	float: left; /*margin-top: 140px;*/
	background-image: url(images/rightcolumn_bg_top.jpg);
	background-repeat: no-repeat;
	background-color: #000000;
	padding: 8px;
}

.rightpanelbottom
{
	width: 247px;
	height: 50px;
	float: left;
	background-image: url(images/rightcolumn_bg_bottom.jpg);
	background-repeat: no-repeat;
	padding: 8px;
}

.rightpanel h2
{
	color: #ffffff;
	font-size: 16pt;
	font-family: Verdana, Arial, Helvetica, sans-serif;
}

.rightpanel h3
{
	color: #ffffff;
	font-size: 12pt;
	line-height: 12px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
}

.rightpanel p
{
	color: #ffffff;
	font-size: 8pt;
	line-height: 18px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	text-align: justify;
}

.rightpanel a
{
	color: #30a7ff;
	font-size: 8pt;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	text-decoration: underline;
}

.rightpanel a:hover
{
	color: #7a7a7a;
	font-size: 8pt;
	text-decoration: none;
}
/* ============== RIGHT COLUMN STYLE END ================================================ */



/* ============== HOME PAGE 3 BOXES STYLE BEGIN ========================================= */
.infobox1
{
	width: 212px;
	height: 137px;
	background-image: url(images/contact_panelbg.png);
	background-repeat: no-repeat;
	float: left;
	margin-right: 12px;
}

.infobox2
{
	width: 220px;
	height: 137px;
	background-image: url(images/buy_panelbg.png);
	background-repeat: no-repeat;
	float: left;
	margin-right: 12px;
}

.infobox3
{
	width: 219px;
	height: 137px;
	background-image: url(images/whatson_panelbg.png);
	background-repeat: no-repeat;
	float: left;
}

.infoboxtext .headerH2
{
	text-align: center;
	color: #000000;
	font-size: 14pt;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	text-transform: uppercase;
	font-weight: bold;
	height: 35px;
	text-align: center;
	vertical-align: middle;
	width: 190px;
}

.infoboxtext .linkList
{
	color: #ffffff;
	font-size: 8pt;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
	text-align: left;
	vertical-align: top;
	height: 80px;
	line-height: 18px;
}

.infoboxtext ul
{
	display: block;
}

.infoboxtext ul a
{
	color: #ffffff;
	font-size: 8pt;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	text-decoration: underline;
	background-image: url(../images/white_arrow.gif);
	background-position: center;
	background-repeat: no-repeat;
}

.infoboxtext ul a:hover
{
	color: #000000;
	font-size: 8pt;
	text-decoration: none;
}

.infoboxtext .linkGo
{
	height: 25px;
}

.go1
{
	color: #026285;
	text-decoration: none;
	font-weight: bold;
	display: block;
	float: right;
	font-size: 12pt;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	margin-right: 40px;
}

.go2
{
	color: #589700;
	text-decoration: none;
	font-weight: bold;
	display: block;
	float: right;
	margin-right: 30px;
	font-size: 12pt;
	font-family: Verdana, Arial, Helvetica, sans-serif;
}

.go3
{
	color: #dd580a;
	text-decoration: none;
	font-weight: bold;
	display: block;
	float: right;
	margin-right: 30px;
	font-size: 12pt;
	font-family: Verdana, Arial, Helvetica, sans-serif;
}
/* ============== HOME PAGE 3 BOXES STYLE END ========================================== */



/* ============== INNER PAGE INFORMATION AREA STYLE BEGIN =============================== */
.innerpagedata
{
	width: 100%;
	float: left;
	height: auto;
	margin-top: 5px;
	padding-bottom: 25px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #525252;
	text-align: justify;
	line-height: 18px;
}

.commonlist li
{
	list-style-image: url(images/listarrow.gif);
	line-height: 24px;
}

.speciallist li
{
	list-style-image: url(images/speciallist.gif);
	line-height: 24px;
}

.innerpagedata a, .homepagedata a, .copyright a
{
	color: #067eaa;
	text-decoration: underline;
	font-family: Verdana;
	font-size: 8pt;
	font-weight: bold;
}

.innerpagedata a:hover, .homepagedata a:hover, .copyright a:hover
{
	color: #000000;
	text-decoration: none;
}

.textSubheading
{
	color: #333333;
	font-family: Verdana;
	font-size: 10pt;
	font-weight: bold;
}
/* ============== INNER PAGE INFORMATION AREA STYLE END =============================== */



/* ============== HOME PAGE INFORMATION AREA STYLE BEGIN =============================== */
.homepagedata
{
	width: 100%;
	float: left; /*height:220px;*/
	margin-top: 5px;
	border-bottom: 1px solid #d7e6ea;
	padding-bottom: 25px;
}

.homepagedata h1, .ourofferings h1, .innerpagedata h1
{
	text-align: left;
	color: #000000;
	font-size: 16pt;
	line-height: 12px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	padding-top: 8px;
}

.homepagedata span, .ourofferings span, .innerpagedata span
{
	color: #0092ff;
}

.homepagedata .mainimg
{
	float: left;
	height: auto;
	width: 184px;
	height: 139px;
}

.homepagedata .text
{
	float: left;
	height: auto;
	width: 470px; /*height:20px;*/
	margin-left: 20px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 9pt;
	color: #525252;
	text-align: justify;
	line-height: 18px;
}

.homereadmore
{
	/*width: 71px; 	height: 19px; 	background-image: url(images/but_readmore_v2.jpg); 	background-repeat: no-repeat;*/
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 8pt; /*color: #ffffff; 	 	display: block;*/
	text-decoration: none;
	float: right;
	text-align: center;
}

.homereadmore a
{
	text-decoration: none;
}

.ourofferings
{
	width: 100%;
	float: left;
	height: auto;
	margin-top: 5px;
}

.gap
{
	width: 40px;
}

.col
{
	width: 315px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 8pt;
	color: #525252;
	text-align: justify;
	line-height: 18px;
}
/* ============== HOME PAGE INFORMATION AREA STYLE END ================================ */



/* ============== FOOTER PANEL STYLES BEGIN =========================================== */
.footer
{
	height: 193px;
	background-image: url(images/sitemap_bg2.jpg);
	background-repeat: repeat-x;
	margin-top: 8px;
}

.footerpanel
{
	width: 980px;
	margin: 0 auto;
	height: 193px;
}

.footertabarea
{
	float: left;
	width: 100%;
	height: 20px;
}

.footertabarea div
{
	height: 15px;
	margin-left: 69px;
	background-image: url(images/tab_sitemap.jpg);
	background-repeat: no-repeat;
	padding-top: 5px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 8pt;
	color: #333333;
	padding-left: 20px;
	font-weight: bold;
}

.footerlinksarea
{
	float: left;
	width: 100%;
	height: 130px;
	margin-top: 5px;
}

.footerlinksarea ul
{
	float: left;
	height: auto;
	width: auto;
	display: inline;
	list-style-type: none;
	list-style-image: none;
	display: block;
	line-height: 18px;
}

.footerlinksarea a
{
	text-decoration: none;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 8pt;
	color: #787d7f;
}

.footerlinksarea a:hover
{
	text-decoration: underline;
	color: #009aea;
}

.sitemaptop
{
	padding-bottom: 10px;
}

.sitemaptop a
{
	font-size: 8pt;
	color: #000000;
}

.copyright
{
	float: left;
	width: 100%;
	height: 15px;
	margin-top: 12px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 8pt;
	color: #333333;
	text-align: center;
}
/* ============== FOOTER PANEL STYLES END ============================================== */

.hidden
{
	display: none;
}
