html, body{ overflow:auto; height: 100%; } /* height 100% sets the background image to be anchored */
body{
margin:0;
padding:0;
background:#F1F1F1 url(../images/bg.jpg) top repeat-x;
font-family:Arial, Helvetica, sans-serif;
font-size: 12px;
height: 100%;
}
/*--------------------------------
customize
---------------------------------*/
* { margin:0; padding: 0; }
a{ text-decoration: none; }
table{ border: none; }
ul { list-style:none; }
.clear_float{ display:block; clear:both; }
.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } /* Controlsthe BR tag, which makes the WRAPPER float stretch for GECKO */
.clearfix {display: inline-block; }
/* Hides from IE-mac \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* End hide from IE-mac */
:focus { -moz-outline-style: none; }
*::-moz-selection { background-color:#FF8400; color:white; }
img{ border:none; }
.flash-replaced .alt { display:block; height:0pt; overflow:hidden; position:absolute; width:0pt; }
img.right_b_rc{ display:block; margin-top:0px; width:603px; }
img.right_t_rc{ display:block; margin-bottom:-1px; width:603px; }
img.left_b_rc{ display:block; margin-top:-1px; width:210px; }
img.left_t_rc{ display:block; margin-bottom:-0px; width:210px; }
/*--------------------------------
main ID's
---------------------------------*/
#wrap{ text-align:center; width:820px; margin:0 auto 10px auto; direction:rtl; text-align:right; }
#wrap #top_links{ height:15px; padding-top:5px; }
#wrap #top_links a{ color:white; text-decoration:underline; }
#wrap #top_links a:hover{ color:white; text-decoration:none; }
/*--------------------------------
Right Column
---------------------------------*/
#wrap #rightcol{ width:603px; float:right; margin-left:5px; }
#wrap #rightcol #nav{ height:55px; padding-top:30px; }
#wrap #rightcol #right_content{ background:white; border-left:1px solid #bbb; border-right:1px solid #bbb; min-height:426px; padding-bottom:10px; } /* -moz-border-radius: 6px; */
* html #wrap #rightcol #right_content{ height:426px; }
#wrap #rightcol #right_content #pathway{ color:#999; margin:0 16px 2px 0; padding:2px 0; cursor:default; }
#wrap #rightcol #right_content #pathway a{ color:#999; text-decoration:underline; }
#wrap #rightcol #right_content #pathway a:hover{ text-decoration:none; }
#wrap #rightcol #right_content #intro{ background:#eee url(../images/intro_b.gif) bottom no-repeat; font-size:140%; color:#ff8400; font-weight:bold; width: 581px; margin:0 auto 18px auto; }
#wrap #rightcol #right_content #intro div.rounded{ height:4px; background:url(../images/intro_t.gif) no-repeat; overflow:hidden; }
#wrap #rightcol #right_content #intro p{ padding:4px 22px 4px 8px; }
#wrap #rightcol #right_content #intro p span{ font-size:115%; }
/*headlines
-------------*/
#wrap #rightcol #right_content .headline{ background:#ddd url(../images/grey_pas.gif) no-repeat; width:580px; margin:0 auto; height:29px; line-height:29px; }
#wrap #rightcol #right_content .headline h1{ color:#777; font-size:140%; padding:0 10px 0 0; }
#wrap #rightcol #right_content .headline a{ color:#333; font-size:14px; text-decoration:underline; }
#wrap #rightcol #right_content .headline a.next_proj{ float:left; background:url(../images/arrow_more.gif) left 7px no-repeat; padding:0 10px 0 15px; margin-left:8px; }
#wrap #rightcol #right_content .headline a.prev_proj{ float:right; background:url(../images/arrow_more_right.gif) right 7px no-repeat; padding:0 15px 0 10px; margin-right:8px; }
#wrap #rightcol #right_content .headline a:hover{ text-decoration:none }
#wrap #rightcol #right_content .short_headline{ background:url(../images/grey_pas_short.gif) no-repeat; width:auto; margin-top:10px; clear:both; }
#wrap #rightcol #right_content .headline p.big_grey{ font-size:1.4em; font-weight:bold; color:#888; padding-right:16px; }
#wrap #rightcol #right_content #main_container{ min-height:235px; margin-top:5px; }
* html #wrap #rightcol #right_content #main_container{ height:235px; } /* IE fix */
#wrap #rightcol #right_content #main_container #right_container{ float:right; width:135px; text-align:center; }
#wrap #rightcol #right_content #main_container #right_container img{ float:left; height:30em; width:9px; }
/* side menu 1*/
#wrap #rightcol #right_content #main_container #right_container ul{ text-align:right; width:82%; padding:6px 12px 0 4px; }
#wrap #rightcol #right_content #main_container #right_container ul li{ line-height:20px; padding:0px 4px 1px 0; background:url(../images/dotted_underline.gif) bottom repeat-x; }
#wrap #rightcol #right_content #main_container #right_container ul li:hover{ background-color:#F7F7F7; }
#wrap #rightcol #right_content #main_container #right_container ul li{ /* hack for IE6 */
_behavior:expression((function(el){
el.runtimeStyle.behavior = 'none';
el.onmouseenter = function(){
this.style.backgroundColor= "#F7F7F7";
};
el.onmouseleave = function(){
this.style.backgroundColor= "white";
};
el = null;
})(this));
}
#wrap #rightcol #right_content #main_container #right_container ul li.toggle_menu:hover{ background-color:white; }
#wrap #rightcol #right_content #main_container #right_container ul li.toggle_menu{ /* hack for IE6 */
_behavior:expression((function(el){
el.runtimeStyle.behavior = 'none';
el.onmouseenter = function(){
this.style.backgroundColor= "white";
};
el = null;
})(this));
}
#wrap #rightcol #right_content #main_container #right_container #side_menu li a{ display:block; color:black; padding:2px 12px 2px 0; background:url(../images/side_arrows.gif) right -281px no-repeat; }
#wrap #rightcol #right_content #main_container #right_container #side_menu li a:hover{ background-position:right -87px; }
#wrap #rightcol #right_content #main_container #right_container #side_menu li a.unselected_open{ background-position:right -184px; } /* for open menues that arn't selected */
#wrap #rightcol #right_content #main_container #right_container #side_menu li.selected a{ color:#ff8400; font-weight:bold; background-position:right -87px; }
#wrap #rightcol #right_content #main_container #right_container #side_menu li a.selected_open{ background-position:right 10px; } /* for sub menues */
#wrap #rightcol #right_content #main_container #right_container #side_menu li a.selected_open:hover{ background-position:right 10px; } /* for sub menues */
#wrap #rightcol #right_content #main_container #right_container #side_menu li.toggle_menu{ padding:0; } /* init via JS to display:none; */
#wrap #rightcol #right_content #main_container #right_container #side_menu dl{ width:100%; }
#wrap #rightcol #right_content #main_container #right_container #side_menu dl dd{ line-height:20px; padding:0px 10px 1px 0; background:url(../images/dotted_underline.gif) bottom repeat-x; }
#wrap #rightcol #right_content #main_container #right_container #side_menu dl dd:hover{ background-color:#F7F7F7; }
#wrap #rightcol #right_content #main_container #right_container #side_menu dl dd{ /* hack for IE6 */
_behavior:expression((function(el){
el.runtimeStyle.behavior = 'none';
el.onmouseenter = function(){
this.style.backgroundColor= "#F7F7F7";
};
el.onmouseleave = function(){
this.style.backgroundColor= "white";
};
el = null;
})(this));
}
#wrap #rightcol #right_content #main_container #right_container #side_menu dl dd a{ background:none; }
#wrap #rightcol #right_content #main_container #right_container #side_menu dl dd a:hover{ background:none; }
#wrap #rightcol #right_content #main_container #right_container #side_menu li dl.active a{ color:#ff8400; }
#wrap #rightcol #right_content #main_container #right_container #side_menu dl dd.selected a{ font-weight:bold; }
/* side menu 2*/
#wrap #rightcol #right_content #main_container #right_container ul.side_menu2 li{ line-height:32px; padding:0; }
#wrap #rightcol #right_content #main_container #right_container ul.side_menu2 li a{ display:block; color:black; height:32px; font-size:14px; padding-right:34px; background-position:top right; background-repeat:no-repeat; overflow:hidden; }
#wrap #rightcol #right_content #main_container #right_container ul.side_menu2 li a:hover{ color:#ff8400; }
#wrap #rightcol #right_content #main_container #right_container ul.side_menu2 li a.active { color:#ff8400; font-weight:bold; background-position:bottom right; }
/* each img */
#wrap #rightcol #right_content #main_container #right_container ul.side_menu2 li a.assesing{ background-image:url(../images/whatwedo_icons/assesing.gif); }
#wrap #rightcol #right_content #main_container #right_container ul.side_menu2 li a.consulting{ background-image:url(../images/whatwedo_icons/consulting.gif); }
#wrap #rightcol #right_content #main_container #right_container ul.side_menu2 li a.design{ background-image:url(../images/whatwedo_icons/design.gif); }
#wrap #rightcol #right_content #main_container #right_container ul.side_menu2 li a.developing{ background-image:url(../images/whatwedo_icons/developing.gif); }
#wrap #rightcol #right_content #main_container #right_container ul.side_menu2 li a.marketing{ background-image:url(../images/whatwedo_icons/marketing.gif); }
#wrap #rightcol #right_content #main_container #right_container ul.side_menu2 li a.usability{ background-image:url(../images/whatwedo_icons/usability.gif); }
#wrap #rightcol #right_content #main_container #left_container{ float:right; padding:6px 5px 6px 0; overflow:hidden; }
#wrap #rightcol #right_content #main_container #left_container table{ margin-bottom:5px; }
#wrap #rightcol #right_content #main_container #left_container table td{ vertical-align:top; line-height: 18px; font-size:14px; color:#333; padding:3px 0; }
#wrap #rightcol #right_content #main_container #left_container table td a{ color:black; text-decoration:underline; font-weight:bold; }
#wrap #rightcol #right_content #main_container #left_container table td a:hover{ text-decoration:none; background:#ddd; -moz-border-radius: 2px; }
#wrap #rightcol #right_content #main_container #left_container table td span{ font-weight:bold; }
#wrap #rightcol #right_content #main_container #left_container table td p a{ color:#FF6600; text-decoration:none; border-bottom:1px dotted #FF6600; font-weight:normal; }
#wrap #rightcol #right_content #main_container #left_container table td p a:hover{ color:white; border:none; background:#FF8400; }
#wrap #rightcol #right_content #main_container #left_container ul{ padding-right: 5px; margin:5px 0; color:#444; }
#wrap #rightcol #right_content #main_container #left_container ul li{ padding-right: 12px; margin:5px 0; background:url(../images/bullet.gif) right 6px no-repeat; }
#wrap #rightcol #right_content #main_container #left_container table .table_right{ width:68px; color:#777; font-weight:bold; }
#wrap #rightcol #right_content #main_container #left_container table a.read_more{ float:left; color:#666; text-decoration:underline; margin-top:5px; font-size:14px; font-weight:normal; }
#wrap #rightcol #right_content #main_container #left_container table a.read_more:hover{ text-decoration:none; font-size:14px; color:black; }
#wrap #rightcol #right_content #main_container #right_container a.proj_img{ display:block; width:103px; height:103px; margin:8px auto 4px auto; }
#wrap #rightcol #right_content #main_container #right_container a.proj_link{ font-size:14px; color: #333; background:url(../images/frido_icon.gif) right no-repeat; padding:3px 12px 2px 0; margin:3px 18px 0 0; display:block; text-decoration:underline; }
* html #wrap #rightcol #right_content #main_container #right_container a.proj_link{ padding:3px 12px 2px 0; margin:3px 8px 0 0; }
#wrap #rightcol #right_content #main_container #right_container a.proj_link:hover { text-decoration:none; }
#wrap #rightcol #right_content #main_container #left_container a.proj_link{ font-size:14px; color: #333; float:left; display:block; background:url(../images/frido_icon.gif) right no-repeat; font-weight:normal; padding:0 25px 0 0; margin:5px 0 8px 3px; text-decoration:underline; }
#wrap #rightcol #right_content #main_container #left_container a.proj_link:hover { text-decoration:none; }
/*--------------------------------
Left Column
---------------------------------*/
#wrap #leftcol{ width:210px; float:right; height: 100%; }
#wrap #leftcol #logo{ display:block; height:85px; background:url(../images/logo.jpg) center no-repeat; }
#wrap #leftcol #left_content{ background:white; padding:20px 0; border-right:1px solid #bbb; border-left:1px solid #bbb; min-height: 100%; } /* -moz-border-radius: 6px; */
* html #wrap #leftcol #left_content { height:426px; } /* min height for IE in left column */
#wrap #leftcol #smart_tags{ background:#ddd; width:190px; margin:0 auto; overflow:hidden; }
#wrap #leftcol #smart_tags h1{ color:#ff8400; display:block; font-size:160%; background:white; width:95%; margin:2px auto; text-align:center; }
#wrap #leftcol #smart_tags p { margin:0 6px; }
#wrap #leftcol #smart_tags p a{ display:block; color:#666; padding:0 4px; float:right; line-height:22px; text-align:center; direction:ltr; unicode-bidi: embed; white-space:nowrap; }
#wrap #leftcol #smart_tags p a:hover{ background:#fff; -moz-border-radius: 4px; }
/*------ Tags sizes ------------*/
#smart_tags a.tags_s1{ font-size:12px; }
#smart_tags a.tags_s2{ font-size:16px; }
#smart_tags a.tags_s3{ font-size:17px; }
#smart_tags a.tags_s4{ font-size:22px; }
#wrap #leftcol #subscribe{ background:#ff8400; width:190px; margin:15px auto 0 auto; text-align:left; }
#wrap #leftcol #subscribe p{ color:white; font-weight:bold; text-align:right; margin-top:4px; padding:0 12px; font-size:115%; }
#wrap #leftcol #subscribe input.textField{ display:block; border:1px solid #999; width:165px; margin:6px auto; padding:2px; direction:ltr; color:#333; font-size:90%; }
#wrap #leftcol #subscribe a{ display:block; border:none; width:46px; background:white; color:#666; font-weight:bold; text-align:center; margin:8px auto 8px 10px; }
#wrap #leftcol #subscribe a:hover{ color:#ff8400;}
/*--------------------------------
FOOTER
---------------------------------*/
#wrap #footer{ margin:15px 0 0 0; font-size:12px; float:right; width:815px; cursor:default; }
#wrap #footer #credits{ text-align:left; direction:ltr; color:#666; font-size:12px; float:left; }
#wrap #footer a{ display:block; float:right; margin:0 0 0 8px; padding:1px 3px; color:#666; text-decoration:underline; font-size:95%; }
#wrap #footer a:hover{ text-decoration:none; background:#cdcdcd; -moz-border-radius: 2px; }
/*--------------------------------
what we do Page
---------------------------------*/
a.proj_pic1{ display:block; width:394px; height:154px; background-repeat:no-repeat; clear:both; }
/*--------------------------------
what we do Page
---------------------------------*/
#wrap #rightcol #right_content #main_container #left_container #proj_examples{ padding:4px 0; }
#wrap #rightcol #right_content #main_container #left_container #proj_examples a{ display:block; float:right; width:26.5%; text-align:center; color:black; font-size:14px; padding:12px 0; width:128px; -moz-border-radius: 6px; border:#fff 1px solid; overflow:hidden; }
#wrap #rightcol #right_content #main_container #left_container #proj_examples img{ padding-bottom:4px; width:103px; height:103px; }
* html #left_container #proj_examples a{ text-decoration:underline; }
#wrap #rightcol #right_content #main_container #left_container #proj_examples a span{ text-decoration:underline; direction:ltr; unicode-bidi: embed; display:block; height:30px; }
#wrap #rightcol #right_content #main_container #left_container #proj_examples a:hover span{ text-decoration:none; }
#wrap #rightcol #right_content #main_container #left_container #proj_examples a:hover{ text-decoration:none; background:#EFEFEF; border:#ccc 1px solid; }
#wrap #rightcol #right_content #main_container #left_container #proj_examples a.no_link{ cursor:default; border:1px solid white; }
#wrap #rightcol #right_content #main_container #left_container #proj_examples a.no_link:hover{ background:none; border:1px solid white; }
#wrap #rightcol #right_content #main_container #left_container #proj_examples a.no_link span{ text-decoration:none; }
#wrap #left_container a.no_link{ cursor:default; }
#wrap #rightcol #right_content #main_container #left_container #block0text{ }
#wrap #rightcol #right_content #main_container #left_container #block0text h1{ font-size:18px; color:#666; margin-bottom:5px; }
#wrap #rightcol #right_content #main_container #left_container #block0text p{ font-size:1.2em; line-height:1.2em; }
#wrap #rightcol #right_content #main_container #left_container #block0text p a{ color:#FF6600; text-decoration:none; border-bottom:1px dotted #FF6600; font-weight:normal; }
#wrap #rightcol #right_content #main_container #left_container #block0text p a:hover{ color:white; border:none; background:#FF8400; }
/*--------------------------------
contacts Page
---------------------------------*/
#wrap #rightcol #right_content #intro.contacts{ padding:0 0 5px 0; line-height:1.2em; }
#wrap #rightcol #right_content #intro.contacts span{ display:block; width:22%; text-align:center; height:55px; float:right; border-left:1px solid #ccc; font-size:1.5em; color:#777; margin:2px 0 0 0; line-height:55px; }
#wrap #rightcol #right_content #intro.contacts p{ display:block; width:69%; float:right; color:#333333; font-size:0.8em; font-weight:normal; color:#666; padding:0 20px 0 0; }
#wrap #rightcol #right_content #intro.contacts p a{ text-decoration:underline; color:#666; }
#wrap #rightcol #right_content #intro.contacts p a:hover{ text-decoration:none; color:white; background:#666; }
#wrap #rightcol #right_content #main_container #left_container.contacts{ padding-right:20px; }
#wrap #rightcol #right_content #main_container #left_container.contacts h3{ font-size:1.4em; color:#999; }
#wrap #rightcol #right_content #main_container #left_container.contacts form{ margin:20px 0 0 0; width:340px; }
#wrap #rightcol #right_content #main_container #left_container.contacts form label,#left_container.contacts input { display: block; float: right; margin-bottom: 10px; font-size:12px; }
#wrap #rightcol #right_content #main_container #left_container.contacts form input { padding:2px; line-height:16px; width:140px; }
#wrap #rightcol #right_content #main_container #left_container.contacts form label{ width: 60px; clear:right; line-height:20px; font-size:1.2em; color:#666; }
#wrap #rightcol #right_content #main_container #left_container.contacts form select { text-align:center; padding:1px; width:60px; }
#wrap #rightcol #right_content #main_container #left_container.contacts form input, select, textarea{ font-family:Arial, Helvetica, sans-serif; font-size:1.1em; border: 1px solid #bbb; background:white url(../images/form_el_bg.gif) repeat-x; float:right; }
#wrap #rightcol #right_content #main_container #left_container.contacts form textarea{ width:250px; overflow:auto; padding:2px; }
#wrap #rightcol #right_content #main_container #left_container.contacts form input:focus, select:focus, textarea:focus{ border: 1px solid #888; outline:1px solid #ff8400; } /* on focus */
#wrap #rightcol #right_content #main_container #left_container.contacts form #phone{ direction:ltr; }
#wrap #rightcol #right_content #main_container #left_container.contacts form .chk_box{ clear:both; width:250px; padding:5px 58px 0 0; }
#wrap #rightcol #right_content #main_container #left_container.contacts form .chk_box input { border:none; width:auto; margin:0 0 0 8px; background:none; float:right; padding:0; }
#wrap #rightcol #right_content #main_container #left_container.contacts form .chk_box label { line-height:10px; font-weight:bold; float:right; border:none; background:none; display:inline; width:250px; }
* html #wrap #rightcol #right_content #main_container #left_container.contacts form .chk_box input { margin-left:0px; }
* html #wrap #rightcol #right_content #main_container #left_container.contacts form .chk_box label { line-height:18px; }
*:first-child+html #wrap #rightcol #right_content #main_container #left_container.contacts form .chk_box label { line-height:18px; }
#wrap #rightcol #right_content #main_container #left_container.contacts form a.send_contact_form{ display:block; background:#ff8400; color:white; font-size:1.2em; line-height:20px; font-weight:bold; text-align:center; width:258px; height:22px; margin-right:58px; padding:0; }
#wrap #rightcol #right_content #main_container #left_container.contacts form a.send_contact_form:hover{ color:#333; }
#wrap #rightcol #right_content #main_container #left_container.contacts #jobs{ background:#E2E2E2 url(../images/jobs_bottom.gif) bottom no-repeat; color:#666; font-size:1.2em; margin:20px 0 0 0; padding-bottom:10px; width:426px; }
* html #wrap #rightcol #right_content #main_container #left_container.contacts #jobs{ padding-bottom:0; }
#wrap #rightcol #right_content #main_container #left_container.contacts #jobs div{ background:url(../images/jobs_top.gif) top no-repeat; height:6px; overflow:hidden; }
#wrap #rightcol #right_content #main_container #left_container.contacts #jobs p{ margin:0 8px 12px 0; line-height:1.4em; }
#wrap #rightcol #right_content #main_container #left_container.contacts #jobs a{ float:left; background:url(../images/arrow_more.gif) left no-repeat; padding:0 10px 0 15px; margin-left:5px; font-size:1em; color:#666; text-decoration:underline; font-weight:bold; }
#wrap #rightcol #right_content #main_container #left_container.contacts #jobs a:hover{ text-decoration:none; }
/*--------------------------------
+ Nifty Corners
---------------------------------*/
.rtop,.artop{display:block}
.rtop *,.artop *{display:block;height:1px;overflow:hidden;font-size:1px}
.artop *{border-style: solid;border-width:0 1px}
.r1,.rl1,.re1,.rel1{margin-left:5px}
.r1,.rr1,.re1,.rer1{margin-right:5px}
.r2,.rl2,.re2,.rel2,.ra1,.ral1{margin-left:3px}
.r2,.rr2,.re2,.rer2,.ra1,.rar1{margin-right:3px}
.r3,.rl3,.re3,.rel3,.ra2,.ral2,.rs1,.rsl1,.res1,.resl1{margin-left:2px}
.r3,.rr3,.re3,.rer3,.ra2,.rar2,.rs1,.rsr1,.res1,.resr1{margin-right:2px}
.r4,.rl4,.rs2,.rsl2,.re4,.rel4,.ra3,.ral3,.ras1,.rasl1,.res2,.resl2{margin-left:1px}
.r4,.rr4,.rs2,.rsr2,.re4,.rer4,.ra3,.rar3,.ras1,.rasr1,.res2,.resr2{margin-right:1px}
.rx1,.rxl1{border-left-width:5px}
.rx1,.rxr1{border-right-width:5px}
.rx2,.rxl2{border-left-width:3px}
.rx2,.rxr2{border-right-width:3px}
.re2,.rel2,.ra1,.ral1,.rx3,.rxl3,.rxs1,.rxsl1{border-left-width:2px}
.re2,.rer2,.ra1,.rar1,.rx3,.rxr3,.rxs1,.rxsr1{border-right-width:2px}
.rxl1,.rxl2,.rxl3,.rxl4,.rxsl1,.rxsl2,.ral1,.ral2,.ral3,.ral4,.rasl1,.rasl2{border-right-width:0}
.rxr1,.rxr2,.rxr3,.rxr4,.rxsr1,.rxsr2,.rar1,.rar2,.rar3,.rar4,.rasr1,.rasr2{border-left-width:0}
.r4,.rl4,.rr4,.re4,.rel4,.rer4,.ra4,.rar4,.ral4,.rx4,.rxl4,.rxr4{height:2px}
.rer1,.rel1,.re1,.res1,.resl1,.resr1{border-width:1px 0 0;height:0px !important;height /**/:1px}