@charset "utf-8";
@import "alertTypography.css";

/**
 * ALERT CSS DOCUMENT
 * 
 * _______@author Neil Azzopardi <neil.azzopardi@alert.com.mt>
 * _______@date august 2009
 * _______@last updated 21st december 2009
 * _______@copyright 2009 Alert Communications Ltd.
 *
 */

/* BROWSER RESET ________________________________________________________________________ */

/* PNG fix */
img, div, a { behavior: url(iepngfix.htc); }

body {
	margin:0;
	padding:0;
	background:url(../imgs/alertBK.jpg) #000 top no-repeat;
	font:12px/17px Arial, Helvetica, sans-serif;
	color:#1c1c1c;
	}
.content a{color:#000000; font-weight:bold; text-decoration:none}
a:hover {color:#333333;}
a img {border:0;}
*:focus{outline:none;}
h1 {font:bold 12px/17px Arial, Helvetica, sans-serif; color:#1c1c1c;}
	
/* LAYOUT STRUCTURE _____________________________________________________________________ */

#alertContainer {
	width:100%;
	height:100%;
	overflow:hidden;
	}
	
#siteContainer {
	width:980px;
	height:auto;
	margin:auto;
	}

#siteHeader { /* inc. navigation */
	width:inherit;
	height:148px;
	}

#siteBillboard { 
	float:left;
	width:100%;
	height:414px;
	margin:10px 0 0 0;
	}
	
#siteInnerBillboard { 
	float:left;
	width:100%;
	height:232px;
	margin:10px 0 0 0;
	}

.contentContainer { 
	float:left;
	width:100%;
	height:auto;
	}

.contentContainer.content { 
	float:left;
	}

#alertFooter {
	width:100%;
	height:auto;
	background:url(../imgs/footer_bk.gif) repeat-x;
	overflow:hidden;
	}
	
/* Header */

.headerLayout {
	float:left;
	width:inherit;
	height:114px;
	background:url(../imgs/header_bklight.png) no-repeat;
	}

.headerNavigation {
	float:left;
	width:inherit;
	height:34px;
	}
	
.searchPop {
	float:left;
	width:inherit;
	height:44px;
	overflow:hidden;
	background:url(../imgs/search_bk.gif) repeat-x;
	margin-top:10px;
	}

.headerLogo {
	float:left;
	}

.headerIcons {
	float:right;
	width:408px;
	height:inherit;
	overflow:hidden; /* fix margins */
	cursor:pointer;
	}

.headerIcons .webdesign {background:url(../imgs/headicon_webdesign.png) 0 -48px}
.headerIcons .webdesign:hover {background:url(../imgs/headicon_webdesign.png) 0 0}
.headerIcons .multimedia {background:url(../imgs/headicon_multimedia.png) 0 -48px}
.headerIcons .multimedia:hover {background:url(../imgs/headicon_multimedia.png) 0 0}
.headerIcons .softwaredev {background:url(../imgs/headicon_softwaredev.png) 0 -48px}
.headerIcons .softwaredev:hover {background:url(../imgs/headicon_softwaredev.png) 0 0}
.headerIcons .datacentre {background:url(../imgs/headicon_datacentre.png) 0 -48px}
.headerIcons .datacentre:hover {background:url(../imgs/headicon_datacentre.png) 0 0}
.headerIcons .seo {background:url(../imgs/headicon_seo.png) 0 -48px}
.headerIcons .seo:hover {background:url(../imgs/headicon_seo.png) 0 0}
.headerIcons .paymentgate {background:url(../imgs/headicon_paymentgateway.png) 0 -48px}
.headerIcons .paymentgate:hover {background:url(../imgs/headicon_paymentgateway.png) 0 0}

.headerIcons ul {
	width:inherit;
	height:inherit;
	margin:0;
	padding:0;
	list-style:none;
	}

.headerIcons ul li {
	float:left;
	width:49px;
	height:48px;
	margin:35px 18px 0 0;
	overflow:hidden;
	}

/* Navigation */

.headerNavigation ul {
	width:inherit;
	height:34px;
	padding:0;
	margin:0;
	list-style:none;
	overflow:hidden;
	background:url(../imgs/nav_bk.gif) repeat-x;
	}

.headerNavigation ul li {
	float:left;
	}

.navHome {width:76px; background:url(../imgs/nav_home.gif) no-repeat 0 0;}
.navHome:hover {background:url(../imgs/nav_home.gif) no-repeat 0 -34px;}
.navAboutUs {width:109px; background:url(../imgs/nav_whoarewe.gif) no-repeat 0 -0;}				
.navAboutUs:hover {background:url(../imgs/nav_whoarewe.gif) no-repeat 0 -34px;}
.navWhatWeDo {width:109px; background:url(../imgs/nav_whatwedo.gif)  no-repeat 0 0;}
.navWhatWeDo:hover {background:url(../imgs/nav_whatwedo.gif)  no-repeat 0 -34px;}
.navWhatWeBelieve {width:152px; background:url(../imgs/nav_whatwebelieve.gif)  no-repeat 0 0;}
.navWhatWeBelieve:hover {background:url(../imgs/nav_whatwebelieve.gif)  no-repeat 0 -34px;}
.navOurClients {width:106px; background:url(../imgs/nav_ourclients.gif)  no-repeat 0 0;}
.navOurClients:hover {background:url(../imgs/nav_ourclients.gif)  no-repeat 0 -34px;}
.navContactInfo {width:103px; background:url(../imgs/nav_contactinfo.gif)  no-repeat 0 0;}
.navContactInfo:hover {background:url(../imgs/nav_contactinfo.gif)  no-repeat 0 -34px;}
.navSearch {width:79px; background:url(../imgs/nav_search.gif)  no-repeat 0 0;}
.navSearch:hover {background:url(../imgs/nav_search.gif)  no-repeat 0 -34px;}
.navExtranet {margin:0px 0px 0px 115px; width:131px; background:url(../imgs/nav_extranet.gif)  no-repeat 0 0;}
.navExtranet:hover {width:131px; background:url(../imgs/nav_extranet.gif)  no-repeat 0 -34px;}

/* Navigation: Selected Item */

.menuSelected {background-position: 0 -68px}

/* Mainpage Billboard */

.mpBillboardContainer {
	float:left;
	width:100%;
	height:314px;
	position:relative;
	}

.mpInnerBillboardContainer {
	float:left;
	width:100%;
	height:185px;
	position:relative;
	}
	
.mpBillboardContainer span{
	position:absolute;
	left:0;
	top:0;
	z-index:10;
}

.mpBillboardContainer span.image-holder{z-index:20;}
.mpBillboardContainer span.image-holder a{display:none; height:314px;}
.mpBillboardContainer span a{float:left; height:314px;}

.mpBillboardContainer img{
	width:980px;
	height:314px;
}

.mpBillboardSub {
	float:left;
	width:100%;
	height:53px;
	overflow:hidden; /* fix height */
	background:white;
	}

.mpBillboardPagination {
	float:left;
	width:143px !important;
	height:53px;
	padding:0;
	margin:0;
	}

.mpBillboardPaginationArrow {
	float:left;
	width:12px;
	height:inherit;
	margin:0px 10px;
	overflow:hidden;
	}

.arrowLeft {background:url(../imgs/bbarrow_left.gif) no-repeat -12px 0px; overflow:hidden; margin:0 5px; padding:0;}
.arrowLeft:hover {background:url(../imgs/bbarrow_left.gif) no-repeat 0px 0px;}
.arrowRight {background:url(../imgs/bbarrow_right.gif) no-repeat 0px 0px; overflow:hidden; margin:0 5px; padding:0;}
.arrowRight:hover {background:url(../imgs/bbarrow_right.gif) no-repeat -12px 0px;}

.mpBillboardPagination ul {
	width:auto;
	margin:0;
	padding:0;
	list-style:none;
	}

.mpBillboardPagination ul li {
	float:left;
	width:23px;
	height:23px !important;
	padding:2px;
	margin:13px 0 0 0;
	cursor:pointer;
	overflow:hidden;
	}

.mpBillboardPagination ul li .active {
	float:left;
	height:23px;
	padding:0;
	margin:0;
	background:url(../imgs/bbnum_bk.gif) no-repeat;
	}

.mpBillboardSubTitle {
	float:left;
	width:145px;
	height:inherit;
	}
	
.mpBillboardSubSummary {
	float:left;
	width:691px;
	background:white;
	overflow:hidden;
	}

.mpBillboardShadow {
	float:left;
	width:100%;
	height:47px;
	background:url(../imgs/mpBillboard_shadow.png);
	overflow:hidden;
	}

/* Coloums */

.columnContainer {
	float:left;
	width:313px;
	height:auto;
	}

.margin20Right {
	margin:0 20px 0 0;
	}

.columnHeader {
	width:inherit;
	height:53px;
	}

#featuredPH {
	position:relative;
	width:inherit;
	height:53px;
	}

#featuredPH .columnHeader {
	position:absolute;
	left:0;
	top:0;
	z-index:0;
	}

#featuredPH #featuredIcons {
	position:absolute;
	left:255px;
	top:17px;
	z-index:5 !important;
	}

.coloumPictureHolder {
	width:inherit;
	height:117px;
	overflow:hidden;
	}

.columnContentHolder {
	width:inherit;
	height:193px;
	overflow:hidden;
	background:white;
	}
	
.columnContentHolder a {
	text-decoration:none;
	color: inherit;
	}

.columnContentHolder .icon {
	float:left;
	width:inherit;
	height:33px;
	cursor:pointer;
	overflow:hidden;
	background:url(../imgs/icon_readmore.gif) no-repeat 0 -33px;
	}
	
.columnContentHolder .buttonLink {
	float:left;
	padding-bottom:3px;
	}

.columnContentHolder .icon:hover {
	background:url(../imgs/icon_readmore.gif) no-repeat 0 0;
	}

.columnContentHolder p {width:260px; float:left; height:100px; margin:auto; overflow:hidden; padding:0 26px;}
.columnContentHolder h1 {width:260px; margin:20px auto 10px; overflow:hidden;}

#featuredProjectsSider{
	position:relative;
	overflow:hidden;
	background:#FFF;
	width:313px;
	height:310px;
	}

#featuredProjectsSider dl{
	padding:0;
	margin:0;
	width:2000px;
	position:absolute;
	top:0;
	left:0;
	}

#featuredProjectsSider dl dd {
	width:313px;
	padding:0;
	margin:0;
	float:left;
	}
	
/* Content Summary */

.contentContainerSummary { 
	float:left;
	width:100%;
	height:190px;
	padding:40px 0 0 0;
	text-align:center;
	}

.mp_dropdown {
	width:200px;
	height:auto;
	font:12px Arial, Helvetica, sans-serif;
	}

/* SERVICES SUMMARY _____________________________________________________________________ */

.servSummary {
	width:100%;
	height:257px;
	margin:0 0 40px 0;
	background:url(../imgs/servBK.png);
	overflow:hidden; /* fix height */
	}
.btn-filter{
	margin:0 0 0 15px;
}
.servContainer {
	float:left;
	width:326px;
	height:100%;
	text-align:center;
	}

.servItemContainer {
	width:286px;
	height:105px;
	margin:16px auto;
	}

.servIcon {float:left; width:59px; height:100%; }

.servDesc {
	float:left;
	width:217px;
	height:100%;
	margin:0px 0px 0px 10px;
	overflow:hidden; /* hide overflow text */
	text-align:left; /* overwrites text-align:center in parent */
	}

.servDesc h1 {margin:0;	padding:0; color:#FFFFFF;}
.servDesc p {font:11px Arial, Helvetica, sans-serif; margin:5px 0 0 0;	padding:0; color:#575757;}
.servDesc p img {margin:10px 0 0 0;}

/* INNER ________________________________________________________________________________ */

.innerContainer {
	width:100%;
	height:auto;
	}
	
/* FOOTER _______________________________________________________________________________ */

.footerContainer {
	width:980px;
	height:auto;
	margin:auto;
	padding:0;
	}

.footerContainer .postal {
	width:100%;
	height:46px;
	text-align:center;
	}

.footerContainer ul {
	float:left;
	padding:0;
	margin:0;
	list-style:none;
	}

.footerContainer ul li {
	float:left;
	list-style:none;
	height:53px;
	padding:0;
	margin:0;
	overflow:hidden;
	}

.footerCredits {
	width:1200px;
	margin:auto;
	}
	
.footerCredits ul {
	padding:20px 0;
	margin:0 150px;
	list-style:none;
	float:left;
	}

.footerCredits ul li {
	float:left;
	padding:0;
	margin:0;
	display:inline-block;
	}

.footerContainer ul li.footerPublisher {width:122px;}
.footerContainer ul li.footerStore {width:124px;}
.footerContainer ul li.footerFacebook {width:40px;}
.footerContainer ul li.footerTwitter {width:40px;}
.footerContainer ul li.footerFlickr {width:43px;}
.footerContainer ul li.footerMailshot {width:85px;}
.footerContainer ul li.footerDataCentre {width:104px;}
.footerContainer ul li.footerPayment {width:138px;}
.footerContainer ul li.footerEBusiness {width:169px; margin:0 0 0 202px;}


.footerCredits ul {font:12px Arial, Helvetica, sans-serif; color:#333333; text-decoration:none;}
.footerCredits ul li a {font:12px Arial, Helvetica, sans-serif; color:#333333; text-decoration:none;}
.footerCredits ul li a:hover {color:#333333; text-decoration:underline;}


.loading-bar{
	background: url(../imgs/spinner.gif) no-repeat center center;
	width:980px;
	height:314px;
	position:absolute;
	top:0;
	left:0;
	z-index:80;
	}

/* LOGIN MODULE BOX ____________________________________________________________________ */

#modale-login-html{display:none;}

#modale-container-box {
	z-index:0;
	background-color:#000;
	display:none;
	position:absolute;
	z-index:849;
	top:0;
	left:0;
	}

#modale-dialogue-box {
	font:12px/17px Arial, Helvetica, sans-serif; color:#1c1c1c;
	position:absolute;
	z-index:851;
	display:none;
	top:0;
	left:0;
	background-color:#FFF;
	}

#modale-btn-close {
	position:absolute;
	z-index:853;
	right:-14px;
	top:-14px;
	background:url(../imgs/btn-close.png) no-repeat;
	width:42px;
	height:42px;
	cursor:pointer;
	}

#login-wrapper {
	padding:20px;
	width:500px;
	overflow:hidden;
	}

#login-wrapper h1 {
	margin:0;
	padding:0;
	}

#login-wrapper .colomns {
	width:250px;
	float:left;
	}

#login-wrapper dl {
	margin:30px 0 0 30px;
	padding: 0;
	}

#login-wrapper dl dt {
	padding:0;
	margin:0 0 5px;
	font-weight:bold;
	}

#login-wrapper dl dt.btn-login {
	margin:15px 0 0;
	}
	
#login-wrapper dl dd {
	padding:0;
	margin:0 0 10px;
	}

#login-wrapper dl dd input {
	padding:3px;
	width:200px;
	background-color:#f8f8f8;
	border:1px solid #cacaca;
	}

#featuredProjectsNext {
	float:left;
	width:21px;
	cursor:pointer;
	}

#featuredProjectsPrevious {
	float:left;
	width:21px;
	cursor:pointer;
	}

/* SITEMAP ______________________________________________________________________________ */

#sitemap ul {
	margin:0;
	padding:0;
	list-style-type:none;
 	}
	
#sitemap ul li {
	background:url(../imgs/sitemap-bg.gif) repeat-x left;
	height:27px;
	float:left;
	width:100%;
	font:bold 13px/25px Arial, Helvetica, sans-serif;
	}
 
#sitemap ul li a {
	color:#333;
	background:url(../imgs/sitemap-arrow.gif) no-repeat 5px 8px;
	display:block;
	padding:0 5px 0 25px;
	text-decoration:none;
	}

#sitemap ul li a:hover {
	color:#ccc;
	background-position:5px -11px;
	}
	
/* Search */

.searchPop { float:left;
            width:980px;
            height:50px;
            overflow:hidden;
            background:url(../imgs/search_bk.gif) repeat-x;
            padding:0px;
            margin:10px 0 0 0;
            }

.searchInput {
            float:left;
            width:160px;
            height:30px;
            padding:10px;
			}
			
.searchInput input {height:22px; width:155px;}

.searchBtn {float:left;
            width:100px;
            font-size:11px; 
            padding:10px 0;
}

.searchTip {float:left; width:600px;}