@charset "utf-8";
/* CSS by Ahmed Hassan */

/* NO FONT HACK */

.nofont {
font-size:0px;
}

.bold {
font-weight:bold;
color:#404040;
}

.white {
color:#a0a0a0;
}

/* BACKGROUND AND MARGINS HACK */

body {
background:#161616;
background-image:url(images/bg2.png);
background-repeat:no-repeat;
background-position:center center;
margin:0px;
height:800px;
}

/* TABLE MARGINS HACK */

table {
margin-top:-2px;
}

/* MAINFRAME CONTROLS */

#main {
width:799px;
float:left;
border: 1px solid #262626;
margin-bottom:30px;
}

/* HEADER & LOGO CONTROLS */

#header-section {
width:799px;
height:188px;
float:left;
}

#header-img {
width:799px;
height:188px;
background-image:url(images/images/header_bg.jpg);
float:left;
}

/* NAVIGATION CONTROLS */

#nav-section {
width:799px;
height:27px;
float:left;
}

#nav-bg {
float:left;
height:27px;
width:799px;
background-image:url(images/images/nav_bg_big.gif);
}

/* BUTTON CONTROLS */

#home_btn {
background-image:url(images/images/home_btn_off.jpg);
float:left;
width:150px;
height:26px;
margin-left:120px;
margin-top:1px;
}

#home_btn:hover {
background-image:url(images/images/home_btn_on.jpg);
float:left;
width:150px;
height:26px;
}

#portfolio_btn {
background-image:url(images/images/portfolio_btn_off.jpg);
float:left;
width:79px;
height:27px;
margin-left:-2px;
}

#portfolio_btn:hover {
background-image:url(images/images/portfolio_btn_on.jpg);
float:left;
width:79px;
height:27px;
}

#aboutus_btn {
background-image:url(images/images/aboutus_btn_off.jpg);
float:left;
width:73px;
height:27px;
margin-left:0px;
}

#aboutus_btn:hover {
background-image:url(images/images/aboutus_btn_on.jpg);
float:left;
width:73px;
height:27px;
}

#services_btn {
background-image:url(images/images/services_btn_off.jpg);
float:left;
width:69px;
height:27px;
margin-left:0px;
}

#services_btn:hover {
background-image:url(images/images/services_btn_on.jpg);
float:left;
width:69px;
height:27px;
}


#contactus_btn {
background-image:url(images/images/contactus_btn_off.jpg);
float:left;
width:122px;
height:27px;
margin-left:0px;
}

#contactus_btn:hover {
background-image:url(images/images/contactus_btn_on.jpg);
float:left;
width:122px;
height:27px;
}

/* BODY CONTROLS */

#body-section {
float:left;
width:799px;
background: #161616;
background-image:url(images/images/body_bg.jpg);
background-repeat:no-repeat;
background-position:bottom;
}

/* NEWS BOX CONTROLS */

.box {
float:left;
margin:;
margin-left:10px;
margin-right:10px;
margin-bottom:10px;
width:775px;
border:1px solid #202020;
background-image:url(images/images/trans.png);
}

.box-title {
font-family:tahoma;
font-size:11px;
padding:4px;
padding-right:10px;
padding-left:10px;
width:755px;
float:left;
background-image:url(images/images/trans_title.png);
border-top:1px solid #404040;
border-bottom:1px solid #252525;
border-left:1px solid #353535;
}

.title {
float:left;
color:#f67a00;
}

.date {
float:right;
color:#707070;
}

.box-content {
float:left;
padding:10px;
font-family:tahoma;
font-size:11px;
color:#707070;
width:755px;
}

.box-content2 {
float:left;
padding:18px;
padding-bottom:6px;
font-family:tahoma;
font-size:11px;
color:#707070;
width:755px;
}

.box-content2 img {
border: 1px solid #606060;
margin-right:13px;
margin-bottom:13px;
float:left;

}

.box-content2 img:hover {
border: 1px solid #f67a00;
}

.box-content a {
color:#f67a00;
}

.box-content a:hover {
color:#909090;
}

/* ABOUT US SECTION */
.artist-picture {
float:left;
margin-right:10px;
margin-top:4px;
border:1px solid #606060;
}

#ahmedpic {
background-image:url(images/images/ahmed.jpg);
background-repeat:no-repeat;
float:left;
width:100px;
height:170px;
}

#danpic {
background-image:url(images/images/dmiller.jpg);
background-repeat:no-repeat;
float:left;
width:100px;
height:170px;
}

/* SERVICES SECTION */

.hlb-title {
float:left;
height:20px;
width:600px;
color:#f67a00;
font-family:tahoma;
font-size:18px;
margin-top:10px;
}

.hlb-info {
float:left;
height:60px;
width:600px;
font-family:tahoma;
font-size:11px;
margin-top:5px;
}

.highlightbox {
padding:10px;
float:left;
border:1px solid #303030;
width:710px;
margin:10px;
background-image:url(images/images/trans.png);
color:#606060;
}

.highlightbox:hover {
border:1px solid #303030;
background: #212121;
color:#909090;
}

#business-icon {
float:left;
background-image:url(images/images/business.png);;
width:103px;
height:97px;
}

#businessplus-icon {
float:left;
background-image:url(images/images/businessplus.png);;
width:103px;
height:97px;
}

#premium-icon {
float:left;
background-image:url(images/images/premium.png);;
width:103px;
height:97px;
}

#premiumflash-icon {
float:left;
background-image:url(images/images/premiumflash.png);;
width:103px;
height:97px;
}

.hr-seperator {
float:left;
background:#353535;
width:710px;
height:1px;
margin-bottom:5px;
}

.left-side {
float:left;
}

.right-size {
float:right;
}

.cost {
color:#f67a00
}

/* DESIGN STEPS CONTROLS */

#box-brainstorm {
float:left;
border:1px solid #303030;
width:775px;
margin:10px;
margin-bottom:0px;
height:100px;
background-image:url(images/images/trans.png);
color:#606060;
}

#box-brainstorm:hover {
border:1px solid #303030;
background: #212121;
color:#909090;
}

#box-design {
float:left;
border:1px solid #303030;


width:775px;
margin:10px;
margin-bottom:0px;
height:100px;
background-image:url(images/images/trans.png);
color:#606060;
}

#box-design:hover {
border:1px solid #303030;
background: #212121;
color:#909090;
}

#box-implement {
float:left;
border:1px solid #303030;
width:775px;
margin:10px;
margin-bottom:10px;
height:100px;
background-image:url(images/images/trans.png);
color:#606060;
}

#box-implement:hover {
border:1px solid #303030;
background: #212121;
color:#909090;
}

/* DESIGN STEPS ICONS */

#brainstorm-pic {
margin:3px;
height:90px;
width:90px;
float:left;
background-image:url(images/images/brainstorm.png);
}

#design-pic {
margin:3px;
height:90px;
width:90px;
float:left;
background-image:url(images/images/design.png);
}

#implement-pic {
margin:3px;
height:90px;
width:90px;
float:left;
background-image:url(images/images/implement.png);
}

.box-divider {
float:left;
background:#303030;
margin-top:5px;
margin-left:5px;
height:90px;
width:3px;
}

.steptitle {
float:left;
height:20px;
width:650px;
color:#f67a00;
font-family:tahoma;
font-size:18px;
margin-top:10px;
margin-left:20px;
}


.stepinfo {
float:left;
height:60px;
width:640px;
font-family:tahoma;
font-size:11px;
margin-top:5px;
margin-left:20px;
}

/* FOOTER */

#footer {
font-family:tahoma;
color:#404040;
text-align:right;
padding:4px;
font-size:10px;
float:left;
width:791px;
background-image:url(images/images/footer_bg.png);
}
