* { 
margin: 0; 
padding: 0; 
border: none; 
border: 0; 
}
.input-image {
border: none;
}
a:link, a:visited {
text-decoration: none;
color: #ff6000;
}
a:link:hover, a:visited:hover {
text-decoration: underline;
}
body {
background: #BBD9F3 url("http://www.webmantica.com/images/bg/body_bg.jpg") repeat-x scroll left top;
text-align: center;
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
font-size: 62.5%;
min-width: 900px;/* stop mozilla sliding off the edge */
}
h1 {
color: #000;
font-size: 1.7em;
font-weight: bold;
}
h2 {
font-size: 2em;
color: #6e320d;
font-weight: normal;
margin-bottom: 1em;
}
h3 {
font-size: 1.4em;
clear: both;
}
h3 a {
font-size: 0.8em;
font-weight: normal;
}
h4 { 
font-size: 1.3em;
}
h5 {
font-size: 1.2em;
}
hr {
height: 0px;
border: 0px;
border-top: 1px solid #9CAEC6;
}
hr.dot {
height: 0px;
border: 0px;
border-top: 1px dotted #9CAEC6;
margin: 2px 0 2px 0;
}
table {
border: 0;
text-align: left;
}
th, td {
vertical-align: top;
text-align: left;
}
li {
list-style: none;
}
/* clear fix hack - to be applied to parents containing floats */
.clearfix:after {
content:"."; 
display:block; 
height:0; 
clear:both; 
visibility:hidden;
}
.clearfix {
display:inline-block;
}
/* mac hide \*/
* html .clearfix {
height: 1%;
}
.clearfix {
display: block;
}
/* End hide */
/**************
  INPUTS
**************/
input, textarea, select { 
border: 1px solid #000;  
background-color: #fff;
font-family: Verdana, sans-serif; 
font-size: 1.1em; 
font-weight: normal; 
color: #000;
}
/**************
  BULLETS
**************/
.bullets {
margin: 0 0 20px 40px;
}
.bullets li {
list-style: disc;
margin: 5px 0 5px 0;
}
.numbers li {
list-style: decimal;
margin: 5px 0 5px 40px;
}
.numbers {
margin-bottom: 20px;
}
/****************************
    MSG
****************************/
#msgcontainer {
text-align : center;
display : table;
height : 250px;
width : 100%;
overflow : hidden;
position : relative;
font-size: 1.4em;
}
#msgcontainer div {
display : table-cell;
vertical-align : middle;
}
* html #msgcontainer div {
position : relative;
top : 50%;
width : 100%;
}
* html #msgcontainer div p {
position : relative;
top : -50%;
}
* + html #msgcontainer div {
position : relative;
top : 50%;
width : 100%;
}
* + html #msgcontainer div p {
position : relative;
top : -50%;
}												
#page-wrapper {
position: relative;
text-align: left;
margin: 0 auto;
width: 900px;
color: #ffffff;
}
#header {
height: 120px;
position: relative;
}
#people	{
position: absolute;
top: 10px;
left: 10px;
width: 417px;
height: 155px;
opacity: 0.2;
filter: alpha(opacity=20);
background:transparent url("http://www.webmantica.com/images/bg/people.gif") no-repeat;
}
#cont {
position: relative;
background-color: white;
color: #ffffff;
min-height: 600px;
padding: 25px 10px 40px 10px;
text-align: center;
color: #000;
}
/* mac hide \*/
* html #cont	{
height: 600px;
}
/* End hide */
#bubble {
margin-top: 15px;
color: #1E3668;
line-height: 1.5em;
font-size: 1.2em;
}
#toplbubble {
left: 30px;
position: relative;
float: left;
width:261px;
height: 39px;

}
#toplbubble a {
text-indent: -9999px;
overflow: hidden;
width:261px;
height: 39px;
display: block;
}
#toprbubble {
right: 130px;
position: relative;
float: right;
width:261px;
height: 39px;

}
#toprbubble a {
text-indent: -9999px;
overflow: hidden;
width:261px;
height: 39px;
display: block;
}

#lbubble {
background: transparent url("http://www.webmantica.com/images/general/bubbles-square.gif") no-repeat;
float: left;
width:349px;
height: 188px;
clear: left;
}

#rbubble {
background: transparent url("http://www.webmantica.com/images/general/bubbles-square-big.gif") no-repeat;
float: right;
width:440px;
height: 188px;
}
#lbubble p, #rbubble p 	{
margin: 30px 0 0 40px;
height: 140px;
}
#lbubble div, #rbubble div {
color: #fff;
font-weight: bold;
}
#lbubble div {
width: 160px; 
text-align: right;
}
#rbubble div {
width: 200px; 
text-align: left;
float: right;
}
#lbubble p	{
width: 280px;
}
#rbubble p	{
width: 370px;
}
#footer {
color: #1E3668;
margin-top: 30px;
text-align: center;
}

#tl, #tr, #bl, #br, #tool-bl, #tool-br {
height: 10px;
width: 10px;
position: absolute;
display: block;
background-repeat: no-repeat;
}
#tl	{
top: 0; 
left: 0;
background-image: url("http://www.webmantica.com/images/bg/tl_corner.png");
background-position: left top;
}
#tr	{
top: 0;
right: 0;
background-image: url("http://www.webmantica.com/images/bg/tr_corner.png");
background-position: right top;
}
#bl	{
bottom: 0;
left: 0;
background-image: url("http://www.webmantica.com/images/bg/bl_corner.png");
background-position: left bottom;
}
#br	{
bottom: 0; 
right: 0;
background-image: url("http://www.webmantica.com/images/bg/br_corner.png");
background-position: right bottom;
}
#tool-bl {
bottom: 0;
left: 0;
background-image: url("http://www.webmantica.com/images/bg/tool-bl_corner.png");
background-position: left bottom;
}
#tool-br {
bottom: 0;
right: 0;
background-image: url("http://www.webmantica.com/images/bg/tool-br_corner.png");
background-position: right bottom;
}
#header h1, #people a {
padding-top: 40px;
text-indent : -9999px;
}
#header h1 a, #people a	{
display: block;
height: 70px;
width: 325px;
overflow:hidden;
}
#header h1 a {
background: url("http://www.webmantica.com/images/logo/logo.gif") no-repeat left center;
}
#toolbox {
font-weight: bold;
background: transparent  url("http://www.webmantica.com/images/bg/toolbox_bg.gif") repeat scroll 0%; 
padding: 5px 15px 5px 15px;
font-size: 10px;
position: absolute;
top: 0;
right: 0;
color: #ffffff;
min-height: 1%;
}
/* mac hide \*/
* html #toolbox {
height: 1%;
}
/* End hide */
#toolbox ul li {
display: inline;
}
#toolbox ul li img {
border: 1px solid white;
vertical-align: middle;
}
#toolbox a:link, #toolbox a:visited {
text-decoration: none;
color: #fff;
}
#toolbox a:link:hover {
text-decoration: underline;
}
/**************
 PRIMARY NAVIGATION 
**************/
#primary-nav {
overflow: hidden; /* contain float */
position: absolute;
bottom: 0;
right: 20px;
font-weight: bold;
font-size: 12px;
}
#primary-nav li { 
float: left; 
margin: 0 5px;
opacity: 0.90;
filter: alpha(opacity=90);
background: url("http://www.webmantica.com/images/bg/primary-nav-tab-right.gif") no-repeat right top;
}
#primary-nav a {	
text-decoration: none;
display: block;
float: left; /* for Mac/IE5.2 */
padding: 10px 35px;
color: #fff; /*#646886;*/
background: url("http://www.webmantica.com/images/bg/primary-nav-tab-left.gif") no-repeat left top;
}
#primary-nav a:hover {
text-decoration: underline;
}
#primary-nav li.selected {
background: url("http://www.webmantica.com/images/bg/primary-nav-tab-right-selected_white.gif") no-repeat right top;
opacity: 1;
filter: alpha(opacity=100);
}
#primary-nav li.selected a {
background: url("http://www.webmantica.com/images/bg/primary-nav-tab-left-selected_white.gif") no-repeat left top;
color: #00A6FF;
}
div#showcase { 
background:transparent url("http://www.webmantica.com/images/general/screenshots.gif") no-repeat scroll 280px 40px;
min-height: 470px;
width:880px;
position: relative;
text-align: left;
}
/* mac hide \*/
* html div#showcase {
height: 470px;
}
/* End hide */
div#showcase h1 { 
height:43px;
margin:0px 0pt 0pt 15px;
text-indent:-9999px;
width:600px;
}
div#showcase h2 { 
height:27px;
margin:0pt 0pt 0pt 15px;
text-indent:-9999px;
width:566px;
}
div#showcase-buttons { 
position: absolute;
top: 400px;
left: 420px;
}
.hq {
margin-top: 30px;
}
.hq h5 {
font-weight: bold;
font-size: 1em;
}
.hq li a {
text-decoration: none;
}
.hq div {
float: left;
width: 250px;
}
.hq .nl {
clear: left;
}
.hq .address {
width: 350px;
margin-bottom: 10px;
}
.button	{
width: 100px;
height: 30px;
text-indent: -9999px;
display: block;
float: left;
overflow: hidden;
margin: 0 10px 0 10px;
}
/*TOUR*/
#tour {
position: relative;
margin-top: 20px;
width: 880px;
min-height: 450px;
text-align: left;
}
/* mac hide \*/
* html #tour	{
height: 450px;
}
/* End hide */
#tour h2 {
text-indent: -9999px;
margin-left: 25px;
width: 400px;
height: 28px;
}
div#tour ol	{	/*#reason-menu*/
width: 240px;
font-size: 1.2em;
float: left;
left: 30px;
position: relative;
background: transparent;
}
div#tour ol li	{	/*#reason-menu*/
list-style: decimal;
margin-top: 10px;
cursor:pointer;
margin-left: 25px;
}
div#tour ol li.current {
color:#FF8200;
font-weight: bold;
}
div#tour p	{
text-align: left;
}
div#tour h3	{
margin-bottom: 20px;
}
.show {
display:block !important;
}
div#tour div { 
display:none;
float:right;
position:relative;
right:50px;
text-align:center;
width:550px;
line-height: 1.5em;
font-size: 1.2em;
}
div#tour div img { 
margin: 10px 10px 10px 0;
}
#tour-box {
clear: left;
float: left;
margin: 30px 0 0 35px;
}
#showcase-menu {
width: 270px;
margin-left: 30px;
line-height:1.5em;
}
#showcase-menu	a {
color:#8AA9D2;
}
#showcase-menu li h3 {
color:#0583C5;
font-weight: bold;
}
#showcase-menu li h4 {
font-size: 1em;
}
#showcase-menu li {
margin-top: 30px;
}
#footer p {
margin-top: 0.6em;
}
#footer ul li {
display: inline;
background:transparent url("http://www.webmantica.com/images/bg/li-separator.gif") no-repeat scroll left center;
padding:0pt 0.6em;
}
#footer ul li a {
color: #18346B;
}
#footer ul li.first {
background:transparent none repeat scroll 0%;
padding-left:0pt;
}
#info-wrapper {
width: 800px;
margin: 0 auto;
text-align: left;
}
#infobar-wrapper {
float: left;
width: 22%;
}
#infonav {
margin: 30px 0 30px 0;
}
#infonav .title {
font-size: 12px;
margin-left: 0px;
color: #666466;
font-weight: bold;
}
#infonav .sel {
color: #FF8200;
font-weight: bold;
border-bottom: 1px dotted #C5C2C2;
}
#infonav li {
margin-left: 15px;
padding: 5px;
font-size: 1.1em;
}
#infonav li a {
color: #605E5E;
display: block;
padding: 3px 0 3px 0;
}
#infonav li .infonav-subsub li {
margin-left: 0px;
font-size: 1em;
padding-left: 0px;
padding-top: 0;
}
#infonav li .infonav-subsub li a.servsel, #infonav li .infonav-subsub li a:hover {
background: url("http://www.webmantica.com/images/general/pin.gif") no-repeat scroll 0pt 7px;
}
#infonav li .infonav-subsub li a {
padding-left: 20px;
}
#info-cont-wrapper {
float: right;
width: 72%;
}
#info-cont {
margin-top: 20px;
font-size: 1.3em;
line-height: 1.5em;
}
#info-cont a {
text-decoration: underline;
}
#info-cont p {
margin: 10px 0 10px 0;
}
#info-tell td {
padding: 5px;
}
#info-tell h3 {
margin: 30px 0 15px; 0;
}
#info-tell table {
width: 100%;
}
#info-tell #info-contract-skills td {
text-align: center;
width: 25%;
}
#login-wrapper {
width: 300px;
margin: 0 auto;
margin-top: 200px;
}
#login-box th {
font-weight: bold;
}
#login-box th, #login-box td {
padding: 5px;
}

#you {
width: 90%;
margin-top: 50px;
background-color: #E4EFF9; /*#EEEAEA;*/

}
#you td {
padding: 12px;
}
#you .button {
text-align: center;
}
.contact-title {
fon-size: 1.5em;
font-weight: bold;
color: #000;
height: 30px;
}
.err {
color: red;
margin-left: 7px;
font-size: 0.9em;
}
.img-right {
float: right;
margin: 0 0 5px 15px;
}
.img-left {
float: left;
margin: 0 15px 5px 0;
}
#bio {
margin-top: 20px;
}
#bio h3 {
margin: 30px 0 20px 0;
}
#bio img {
border: 1px solid #000;
width: 100px;
height: 100px;
float: left;
margin: 0 15px 0 0;
}
#bio h6 {
color: #847973;
font-weight: bold;
font-size: 0.9em;
}
/* this has to be finalized once vector logos are ready
#portfolio-list img {
max-width:250px; 
max-height: 100px;
}
* html #portfolio-list img {
width:250px; 
height: 100px;
}*/
#portfolio-list td {
padding: 10px;
border-bottom: 1px dashed #cccccc;
height: 110px;
vertical-align: middle;
}
#portfolio-list a {
text-decoration: none;
font-weight: bold;
}
/* this has to be finalized once vector logos are ready */
#servrend li {
background: url("http://www.webmantica.com/images/general/servrendbullet.gif") no-repeat scroll 0pt 4px;
}
#servrend li a {
padding-left: 20px;
text-decoration: none;
font-size: 1em;
}
#logo {
text-align: left;
margin-top: 30px;
}
#details {
float: left;
width: 300px;
}
#details h4 {
margin-bottom: 15px;
}
#screenshot {
float: right;
}
#subservice {
width: 100%;
background: url("http://www.webmantica.com/images/general/dotseparator.gif") repeat-x scroll 0 1em;
text-align: center;
margin-bottom: 30px;
}
#subservice li {
display: inline;
margin-left: 2em;
padding: 0 1px 0 1px;
background: #fff;
float: left;
}
#subservice li a {
text-decoration: none;
color: #4A4D4A;
font-size: 0.9em;
border: 1px dotted #B3B0B0;
padding: 2px 5px 2px 5px;
display: block;
}
#subservice li a.selected {
background: #edebed;
font-weight: bold;
border: 1px solid #B3B0B0;
}
#subservice li a:hover {
background: #edebed;
}
#webmantica a {
text-decoration: underline;
}
div.red {
background-color: red;
color: white;
padding: 3px;
display: inline;
}
#mediakit {
margin-top: 40px;
}
#mediakit div {
margin-bottom: 20px;
}
#mediakit div a img {
margin-right: 20px;
float: left;
}
#mediakit div h3 {
clear: none;
}
#mediakit div div {
float: right;
}