/* ---------->>> LAYOUT <<<-----------*/

body {font: 0.7em Tahoma, Arial, Helvetica, sans-serif; margin: 0px auto; padding: 0; text-align: center; color: #666666; background: #2F2F2F url(../images/background-tile.gif);}

#container { width:780px; background: #FFFFFF; margin-right:auto; margin-left:auto; text-align: left; padding: 0; }
#header { width: 780px; background: #FFFFFF; height: 90px; padding: 0; margin: 0; }

/* ---------->>> HEADER <<<-----------*/

.logo { width: 168px; height: 62px; margin:0; padding-top:10px; padding-left:20px;}
html>body .logo { padding-top:2px; }

#header h1 { font: bold 1em Tahoma, Arial, Helvetica, sans-serif; }
#header h1 span { background: url(../images/logo-generographics.gif) left top no-repeat; width:168px; height:62px; position: absolute; }

/* ---------->>> MAIN IMAGE <<<-----------*/

.main_img { float:left; width:780px; height:220px; margin:0; padding:0; background: #008877 url(../images/main-img.jpg);}
.punch_line { font: 2.5em Georgia, Arial, Helvetica, sans-serif; line-height:22px; color:#FFF; margin:35px 0 0 80px; padding:0; }
.white_txt_large { font: 1.2em Tahoma, Arial, Helvetica, sans-serif; line-height:22px; color:#FFF; margin:0 0 0 80px; padding:0; }
.white_txt_large a { font: 1.2em Tahoma, Arial, Helvetica, sans-serif; line-height:22px; color:#FFF; margin:0 0 0 80px; padding:0; }
.white_txt_large a:visited { font: 1.2em Tahoma, Arial, Helvetica, sans-serif; line-height:22px; color:#FFF; margin:0 0 0 80px; padding:0; }
.white_txt_large a:hover { font: 1.2em Tahoma, Arial, Helvetica, sans-serif; line-height:22px; color:#FFF; margin:0 0 0 80px; padding:0; }

/* ---------->>> THREE COLUMNS <<<-----------*/

#three_cols{ float:left; width:780px; padding-top:10px; border-top: 2px solid #CCCCCC; background:#FFFFFF; }
html>body #three_cols{ padding-top:0px;  }

.col1 {float:left; width:230px; margin:0; padding:0 20px 0 20px;}
.col2 {float:left; width:203px; margin:0; padding:0;}
.col3 {float:left; width:267px; margin:0; padding:0 10px 0 10px; }
.col4 {float:left; width:730px; margin:0; padding:0 20px 0 20px;}
.categoria {float:left; width:300px; margin:0; padding:0 10px 0 10px; }
.buscador {float:left; width:400px; margin:0; padding:0 20px 0 20px;}
.categoria_cat {float:left; width:150px; margin:0; padding:0 20px 0 20px;}
.categoria_contenido {float:left; width:500px; margin:0; padding:0 20px 0 20px;}

#left {float:left; width:180px; padding:0 20px 0 20px; background:#FFFFFF;}
#right {float:right; width:540px; padding:0 20px 0 0; background:#FFFFFF;}

.bread_image {width:780px; height:43px; margin:0; padding:0;}
html>body .bread_image {margin:0; padding:0;}

/* ---------->>> FEATURED PROJECTS <<<-----------*/

.featured_projects { display: inline; }
.featured_projects ul { list-style:none; margin:0; padding:0; margin-top:-10px; }
.featured_projects ul li { float:left; text-align: center; width:40px; height:45px; padding:0; margin:10px 10px 0 0; border:1px solid #CCCCCC; }
.featured_projects img { float:left; margin:0; clear:both; cursor:pointer; border:1px solid #ddd; width:40px; height:45px; }
.featured_projects ul li img:hover{ border:1px solid #008877; }

/* ---------->>> SERVICES <<<-----------*/

ul.services { margin:0 0 20px 20px; padding:0; list-style:none; }
ul.services li { width:94%; display:block; background:url(../images/icon-tick.gif) top left no-repeat; margin:3px 0 0 3px; padding:2px 0 5px 22px; border-bottom:1px solid #efefef; }

/* ---------->>> LEFT NAVIGATION <<<-----------*/

#leftnav ul {margin:20px 0 0 0; padding:0; list-style-type:none; }
html>body #leftnav ul {margin:40px 0 0 0;}
#leftnav li { border-bottom:1px solid #D1D1D1; color:#003399; background:#FFFFFF; display:block; text-align:left;}
#leftnav li a {color:#003399; display:block; padding:6px 11px 5px 20px; background:url(../images/bullet.gif) no-repeat 5px 10px #FFFFFF; }
#leftnav li a:hover {color:#003399; display:block; padding:6px 11px 5px 20px; text-decoration:none; background:url(../images/bullet.gif) no-repeat 5px 10px #E8EEFA;}

.google_ad { width: 180px; height:150px; background: #FFFFFF; margin:0; padding:0; text-align: left; }
.google_ad2 { width: 468px; height:60px; text-align:center; margin-top:20px; padding:0;}
html>body .google_ad2 {margin-top:40px;}

/* ---------->>> FOOTER <<<-----------*/

#footer {clear:both; text-align:left; margin:0px auto; width: 750px; background:#FFFFB3 url(../images/logo-watermark.gif) no-repeat 300px 50px; padding:15px; border-top: 2px solid #CCCCCC;}
.footer_leftcol {width:200px; float:left; margin-right: 15px; overflow: hidden;}
.footer_rightcol {width:300px; float:right; margin:0;}

.footer_links { list-style:none; padding:0px; margin:0px 0px 15px; background-color: #FFFFB3; }
.footer_links li{ border-bottom: 1px solid #D1D1D1; line-height: 130%; list-style:none; padding: 0; margin: 0; }
.footer_links li a { color: #003399; text-decoration: none; padding:6px 11px 5px 20px; display:block; background:url(../images/bullet.gif) no-repeat 5px 10px #FFFFB3; }
.footer_links li a:visited { color: #003399; text-decoration: none; padding:6px 11px 5px 20px; background:url(../images/bullet.gif) no-repeat 5px 10px #FFFFB3; }
.footer_links li a:hover { text-decoration: none; padding:6px 11px 5px 20px; color:#003399; background:url(../images/bullet.gif) no-repeat 5px 10px #E8EEFA; }

hr.hidden { clear:both; visibility:hidden; margin:0px; padding:0px;}

.quick_links { font: bold 1.2em Tahoma, Arial, Helvetica, sans-serif; color: #FF6600; margin:0; padding:10px 10px 30px 25px; background:url(../images/link.gif) no-repeat 2px 15px; }
.copyright { height:20px; text-align:left; }

/* ---------->>> GLOBAL <<<-----------*/

h1 {font: bold 1em Tahoma, Arial, Helvetica, sans-serif;}
h2 {font: bold 1.2em Georgia, Tahoma, Arial, Helvetica, sans-serif; color: #FF6600;}
h3 {font: 1.5em Georgia, Tahoma, Arial, Helvetica, sans-serif; color: #105CB6; padding-bottom: 4px; border-bottom: 1px solid #CCCCCC; }
h4 {font: bold 1.2em Tahoma, Arial, Helvetica, sans-serif; color: #FFFFFF;}
h5 {font: 1.5em Georgia, Tahoma, Arial, Helvetica, sans-serif; color: #FFF; border-bottom: 1px solid #FFF; }

a { color: #003399; text-decoration: none; }
a:hover { color: #003399; text-decoration: none; }

.main_txt {font: 1em Tahoma, Arial, Helvetica, sans-serif; line-height:16px; margin:0; padding:0;}
.txt {font: 1em Tahoma, Arial, Helvetica, sans-serif; color:#666666; line-height:16px; margin:0; padding:0;}
.white_txt {font: 1em Tahoma, Arial, Helvetica, sans-serif; color:#FFF; line-height:16px; margin:0; padding:0;}

.date { padding-left:16px; background:url(../images/icon_date.gif) no-repeat 0 50%; font-weight: bold; color: #333333;}
.featured_project {width:254px; height:173px; border: 1px solid #D1D1D1; text-align:center; padding:4px; margin-top:10px;}
.blue_heading {font: bold 1.2em Tahoma, Arial, Helvetica, sans-serif; color: #105CB6; margin:0; padding:0;}

.twocols {float:left; width:540px; height:320px; margin:0; padding:0;}
.colleft {float:left; width:320px; margin:0; padding:0;}
.colright {float:left; width:220px; margin:0; padding:0;}

.services { background: #E8EEFA; padding: 10px; border: 1px solid #CCE0F3; }
.services ul li { list-style-image: url("../images/arrow-black.gif"); margin: 0 0 0 10px; line-height:18px; }

.orange { font: bold 1em Tahoma, Arial, Helvetica, sans-serif; color: #FF6600; }
.blue { font: bold 1.2em Georgia, Tahoma, Arial, Helvetica, sans-serif; color: #105CB6; padding-bottom:4px; border-bottom: 1px solid #CCCCCC; }

/* ---------->>> FORM <<<-----------*/
form { margin-left:30px; padding:0; }
input.field { border:1px solid #CCCCCC; background:#FFFFFF; width: 200px; height: 15px; color: #4D4D4D; }
textarea { border:1px solid #CCCCCC; background:#FFFFFF; width: 200px; height: auto; color: #4D4D4D; }
input { border:1px solid #CCCCCC; background:#FFFFFF; color: #4D4D4D; }
list { border:1px solid #CCCCCC; background:#FFFFFF; color: #4D4D4D; }
select.list { width: 200px; font-size: 100%; color: #4D4D4D; background-color: #FFFFFF; }
input.button { height:20px; background:url(../images/btn-send.jpg) top left no-repeat; width:44px; padding:0; border:none; text-indent:-9999px; letter-spacing: 187px }

/* ---------->>> QUICK CONTACT FORM <<<-----------*/

#frm_contact form { margin:0; padding:0; }	
#frm_contact input { width:150px; background:#FFFFFF; border:1px solid #CCCCCC; padding:0; color:#4D4D4D; }
#frm_contact textarea { width:150px; background:#FFFFFF; border:1px solid #CCCCCC; padding:0; color:#4D4D4D; }
#frm_contact input { height:15px; }
#frm_contact form label { padding:0; }
#frm_contact input.submit { height:20px; background:url(../images/btn-send.jpg) top left no-repeat; width:44px; padding:0; border:none; text-indent:-9999px; letter-spacing: 187px }
#frm_contact form label.submit1 { position:relative; display:block; margin:10px 0; padding-right:50px; }


/* ---------->>> WORKSHOWCASE <<<-----------*/

#showcase { margin-left: 10px; padding: 0; width: 380px; color: #4D4D4D; background-color: #FFFFFF; }
#showcase ul.portfolio { color: #4D4D4D; text-transform: uppercase; padding: 5px; margin: 0; background-color: #FFFFFF; }
#showcase ul.portfolio li { width: 380px; list-style-type: none; margin: 0; padding: 3px; color: #4D4D4D; background-color: #F9F9F9; }
#showcase ul.portfolio li a:link,  
#showcase ul.portfolio li a:visited { display: block; width: 380px; color: #006ec6; text-decoration: none; padding: 5px; background-color: #F9F9F9; margin: 0; padding: 0; }
#showcase ul.portfolio li a:hover { display: block; width: 380px; color: #FFFFFF; background-color: #006ec6; margin: 0; padding: 0; }

/* ---------->>> SITE SHOWCASE AND WEB RESOURCES <<<-----------*/

.site_showcase { display: inline; }
.site_showcase ul { list-style:none; margin:0; padding:0; margin-top:-10px; }
.site_showcase ul li { float:left; text-align: center; width:150px; height:81px; padding:0; margin:10px 10px 0 0; border:1px solid #CCCCCC; }
.site_showcase img { float:left; margin:0; clear:both; cursor:pointer; border:1px solid #ddd; width:150px; height:81px; }
.site_showcase ul li img:hover{ border:1px solid #FF6600; }

/* ---------->>> PAGE NUMBERS <<<-----------*/

.pagenumbers {width:510px; height:30px; text-align:right; padding-top:10px;}
* html .pagenumbers { line-height: 18px;  } 
.pagenavF { margin-bottom: 3px; }
a.pagenavF:link { margin-bottom: 3px; }
a.pagenavF:visited { margin-bottom: 3px; }
a.pagenavF:hover { margin-bottom: 3px; }
.pagenavF { width:21px; color:#FFF; padding:1px 6px; margin:0 3px; border:1px solid #4370C7; background:#006EC6; text-align:center; font-weight: bold; }
a.pagenavF:link, a.pagenavF:visited { color:#006EC6; padding:1px 6px; margin:0 3px; text-decoration:none; border:1px solid #E6E6E6; font-weight:normal; background:none; }
a.pagenavF:hover { color:#FFF; padding:1px 6px; margin:0 3px; border:1px solid #006EC6; font-weight:normal; background:#006EC6; }

/* ---------->>> SITE MAP <<<-----------*/

.sitemap_nav { width: 409px; color: #FFFFFF; background: #006EC6; margin: 0 0 10px 0; padding: 0 0 0 5px; }
html>body .sitemap_nav { padding-top: 5px;}

.sitemap_nav a { color:#FFFFFF; }
.sitemap_nav a:hover { color:#FFFFFF; text-decoration: underline; }

div#site-map div.column { width:310px; margin-left:20px; height:auto; float:left; }
div#site-map ul { margin:0; padding:0; list-style-type:none; }
div#site-map ul ul { margin-left:-20px; }
div#site-map ul.webui { background-image:url("../images/ul-webui.png");background-repeat:repeat-y; }
div#site-map ul.charting { background-image:none; }
div#site-map li { display:block; line-height:6px; padding:5px 0 5px 54px; background-image:url("../images/node-page.png"); background-repeat:no-repeat; }
div#site-map li.last { background-image:url("../images/node-page-last.png"); }

div#site-map li.title-node { margin-top:32px; background-image:url("../images/node-title.png"); }
div#site-map li.first { margin-top:0; }
div#site-map li span.title-node { display:block; padding-bottom:8px; }

div#site-map li.webui { font: 1em Tahoma, Arial, Helvetica, sans-serif; line-height:14px; background-image:url("../images/node-webui.png"); }
div#site-map li.webui ul,div#site-map li.charting ul { font: 1em Tahoma, Arial, Helvetica, sans-serif; margin-left:-20px; }
div#site-map li.charting { font: 1em Tahoma, Arial, Helvetica, sans-serif; line-height:14px; background-image:url("../images/node-charting.png"); }


/* ---------->>> MISC <<<-----------*/

.left_side { width: 180px; }
.left_side p { font: 0.9em Tahoma, Arial, Helvetica, sans-serif; line-height:16px; margin: 0; padding: 0px 5px 0px 10px; }

.right_side { width: 414px; background: #FFFFFF; margin-top: -215px; padding: 0; }
.right_box { width: 180px; background: #F9F9F9; border-bottom: 1px solid #CCCCCC; margin: 0; padding: 0; text-align: left; }
.right_box p { font: 0.9em Tahoma, Arial, Helvetica, sans-serif; line-height:16px; margin: 0; padding: 5px 10px 0 10px; }

.google_right_box { width: 180px; background: #FFFFFF; margin:0; padding: 0; text-align: left; }

.small_img_wrap { clear: both; width: 414px; height: 95px; background: #006EC6; }
.small_img { float: left; width: 180px; height:95px; }
.small_img_caption { float: right; width: 234px; height:95px; background: #FF8434; }