/*
Author: Jose Luis de la Cámara
Author URI: http://blogartz.com
*/

/*	##################################
   	GENERAL
	################################## */
	
body {
	margin: 0px;
	padding: 0px;
	font: 13px/18px "Helvetica Neue", Helvetica, Verdana, Arial, sans-serif;
	font-weight:100;	
        background:#000;
	color: #bdbdbd;
}

a {
	color: #9b8c16;
	outline: none;
        text-decoration:none;
}

ul, ol {
	margin: 0px 0px 20px 0;
	padding:0px;
}

/*	##################################
   	BASIC LAYOUT
	################################## */
	
#page {
	width: 950px;
	margin: 0 auto;
        position: relative;
}
	
#header {
	position: relative;
	height: 100px;

width: 950px;
border-bottom:1px solid #1c1c1c;
}

#content {
	padding: 0px 0 0 0;
	background: transparent;
min-height: 800px;

}

#content-left {
	float: left;
	width: 950px;
}

.dev #content-left {
margin-bottom:30px;
}

#content-right {
	float: right;
	width: 320px;
}

body.oops #content-right {
	width: 400px;
        margin-top:20px;
        float:none;
}

#footer {

}

/*	##################################
   	HEADINGS
	################################## */
	
h1 {
	margin:30px 0;
	color:#9b8c16;
	font-size:21px/24px;
	font-weight:100;
}

h3, h4, h6, h7 {
	margin: 0 0 10px 0;
}

h2 {
	margin:15px 0 5px;
	color:#9b8c16;
	font-size:17px/21px;
	font-weight:100;
}

h3, #workpanel_menu h1 {
    border-bottom: 1px dotted lightGrey;
    max-width: 890px;
	margin-top:0;
	margin-bottom:20px;
	padding-bottom:10px;
	color:#9b8c16;
	font-weight:100;
	font-size:16px;
	border-bottom:1px solid #1c1c1c;
	letter-spacing:1px;
}


h3.white {
     border-bottom: 1px none lightGrey;
     max-width: 950px;
     color: #ffffff
}

h5 {
   margin:10px 0 15px 10px;
}
	
h4.sidebar-title {
	font-size: 12px;
}

h6 {
margin-bottom:0;
}

h6.terms {
margin:20px 0 0 0;
}

/*	##################################
   	HEADER
	################################## */
	
#top-nav {
	position: absolute;
	top: 10px;
	right: 0px;
	margin: 0px;
	padding: 0px;
	list-style: none;
}

#top-nav li {
	float: left;
	margin: 0 0 0 10px;
}


/*	##################################
   	CONTENT
	################################## */
	
/** CONTENTN LEFT */

.box-left, .page {
	margin: 0;
}


/*	##################################
   	FOOTER
	################################## */

#footer {
	position: relative;
	height: 200px;
        margin-top:30px;
        background:transparent url(../img/jpg/bg_footer.jpg) repeat scroll center top;
}

#footer_content {
        margin: 0 auto;
        width: 950px;
}

#footer p {
	margin: 20px 0 50px 0;
}

#legal {
	float: left;
	width: 400px;
}

#webdemar {
	float: right;
	width: 400px;
	text-align: right;
}

/*	##################################
   	USEFUL
	################################## */
	
.clear {
	clear: both;
}

.clearfix:after {
    content: " ";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}

.clearfix {
    display: inline-block;
}

html[xmlns] .clearfix {
    display: block;
}

* html .clearfix {
    height: 1%;
}

/** CSS BASIC ELEMENTS */

hr {
	clear: both;
	height: 1px;
	margin: 20px 0;
	background: #dedede;
	border: none;
}

blockquote {
	margin: 0 0 0 10px;
	padding: 0 0 0 10px;
	border-left: 5px solid #f7f7f7;
}

fieldset {
	margin: 0 0 20px 0;
	padding: 0 20px 20px 20px;
	background: #f7f7f7;
	border: none;
}

legend {
	font-size: 14px;
	font-weight: bold;
}

input, textarea, .fileupload {
	height: 16px;
	clear:both;
	margin: 0 0 20px 0;
	padding: 3px 0 3px 5px;
	border: 1px solid #dadada;
	color: #5e5e5e;
	font-size: 11px;
}

.fileupload {
height: 22px;
margin: 0 0 10px 0;
}

textarea {
	width: 90%;
	height: 150px;
        margin: 0 0 15px 0;
}

select {
	width: auto;
	margin: 0 0 20px 0;
	padding: 6px;
	background: #fff;
	border: 1px solid #dadada;
	color: #5e5e5e;
	font-size: 11px;
}

input.radio, input.checkbox {
	width: auto;
	height: auto;
	margin: 0px;
	background: #fff;
}

input.password {
	width: auto;
}

input.button {
	width: auto;
	height: 25px;
	margin: 0px;
	padding: 0;
	background: #6e7073;
	border: none;
	color: #fff;
}

table {
	margin: 0 0 20px 0;
	border: 1px none #333;
	border-bottom: none;
	border-right: none;
}

table.maq {
	font-size:10px;
	font-style:italic;
	margin:20px 0;
}

table.maq img {
	border:1px solid #333;
}

th, td {
	padding: 2px 5px;
	border-bottom: 1px none #333;
	border-right: 1px none #333;
}

th {
	background: #6e7073;
	color: #fff;
	border: none;
}

pre {
	font-family: Courier, serif;
}


#smallbox {
background:#000 none repeat scroll 0 0;
display:inline;
float:left;
margin-bottom:20px;
margin-right:15px;
width:220px;
height:165px;
position:relative;
border-bottom:1px solid #1c1c1c;
}

.home #smallbox {
margin-bottom:0;
}

#smallbox h4 {
margin: 0px 0px 0px 10px;
font-weight:100;
}

#projectrow {
display:block;
float:right;
left:20px;
position:relative;
width:470px;
}

#projectrow_subpage {
display:block;
float:right;
left:20px;
position:relative;
width:700px;
text-align:justify;
}

#projectrow_subpage ul, #projectrow_subpage ol  {
	padding-left:30px;
}

#projectrow_subpage img.grf {
border:1px solid #333;
padding:1px;
}

img {
      border: none;
}

#listbox img {
border:medium none;
padding-right:5px;
padding-top:5px;
}

#projectpreview {
float:right;
width:890px;
display:block;
position: relative;
top:-44px;
}

.contact #projectpreview {
float:left;
width:890px;
display:block;
position: relative;
}

#projectpreview img{
padding:0px 0px 10px 0px;
}

#projectpreview img.contact{
padding:0px 0px 0px 0px;
margin: 0 0 0 0;
}

#projectcontent {
margin: 30px 0 0 0;
display:block;
float:left;
position:relative;
width:890px;
padding:20px;
background:black none repeat scroll 0 0;
letter-spacing:1px;
}

.home #projectcontent {
margin: 30px 0 0 0;
}

#backbar {
display:block;
float:left;
position:relative;
width:51px;
margin-top:20px;
}


#bottombar {
margin: 30px 0 0 0;
display:block;
float:left;
position:relative;
width:890px;
padding:20px 30px;
background:black none repeat scroll 0 0;
}


#projectcontent h2{
margin: 0 0 5px 0;
}

#projectcontent h3.post-title{
border-bottom:3px none #C2C2C2;
margin:0 0 5px 0;
}

#projectcontent.billing {
margin: 40px 0px 0px 0px;
}


#projectcontentbox {
width: 350px;
margin-bottom:20px;
display:block;
float:left;
position:relative;
}


#projectcontentbox p {
margin:0px 0 0 0;
}

#projectcontentbox p {
margin-bottom:10px;
}

#projectcontentbox.contact {
margin-top:45px;
}

#projectcontentbox h3 {
margin-bottom:15px;
}

#servicecontentbox {
width: 520px;
margin-bottom:30px;
margin:30px 0 0 20px;
display:inline;
float:left;
position:relative;
}


#servicecontentbox h3 {
margin-bottom:15px;
}

#projectactionbox {
width: 350px;
margin-top: 30px;
}

#magazines-th {
	background:#FFF;
	border:1px solid #333;
	float:left;
	margin-bottom:10px;
	margin-right:10px;
	padding:3px;
	text-align:left;
	width:120px;
}

#magazines-th a img {
	border:none;
	display:block;
	margin-bottom:5px;
}

/*	##################################
   	BUTTONS ---------------------------------------------------------------------------------------------
	################################## */


#btn_more, #btn_moreen {
display:inline-block;
float:left;
width: 101px;
height: 25px;
margin: 10px 10px 10px 0;
background:url(../img/gif/btn_vermas.gif) no-repeat scroll;
cursor:pointer;
}

#btn_moreen {
background:url(../img/gif/btn_more.gif) no-repeat scroll;
}


#btn_viewall, #btn_viewallen {
display:inline-block;
height:25px;
left:369px;
position:absolute;
top:-10px;
width:101px;
background:url(../img/gif/btn_vertodas.gif) no-repeat scroll;
cursor:pointer;
}

#btn_viewallen {
background:url(../img/gif/btn_viewall.gif) no-repeat scroll;
}


#bttn_all p{
margin: 0 0 0 0;
padding: 3px 6px 0 0;
color:#FFFFFF;
font-size:14px;
text-align:right;
}

#btn_send, #btn_senden {
display:inline-block;
float:left;
height:25px;
left:609px;
width:101px;
background:url(../img/gif/btn_enviar.gif) no-repeat scroll;
margin-right:5px;
}

#btn_senden {
background:url(../img/gif/btn_send.gif) no-repeat scroll;
}

.frm_field {
width: 200px;
margin: 0 0 0 0;
color: #31C4D8;
}

.form_msg {
font-size: 11px;
color: darkGray;
margin: 0 5px 0 0;
}

#lmform {
margin: 20px 0 0 0;
}

#lmform p{
margin: 0 0 0 0;
}

#terms {
margin: 0 5px 20px 0;
height: 13px;
float:left;
}

#menuholder {
width: 950px;
height: 70px;
float: left;
}

#logo {
float:left;
width:190px;
}

#logoswf {
float:left;
width:190px;
margin-top:10px;
}

#menunav {
float:left;
width:760px;
text-align:right;
}

#menunav a.en {
	background:transparent url(../img/png/uk.png) center left no-repeat;
	padding-left:25px;
}

#menunav a.es {
	background:transparent url(../img/png/es.png) center left no-repeat;
	padding-left:25px;
}

#top_menunav {
width:auto;
margin-top:10px;
}

#top_menunav a.selected {
color:#dedddd;
}

#top_menunav strong {
font-weight:bold;
}

#top_menunav a {
color:#a18e17;
margin-left:8px;
}

#top_menunav a:hover {
color:#fff;
}

#booton_menunav {
clear:left;
margin-top:40px;
}

#featurerow {
width: 950px;
margin: 0 auto;
}

#featureBox {
display:block;
height:390px;
margin:0 0 0 0;
position:relative;
width:950px;
background: #fbfbfb;
}


.home #featurerow {
margin: 20px 0 0 0;
}

#featuretext {
width: 460px;
float: left;
}

#featuretext h3{
margin-top: 35px;
width: 435px;
}


#featuretext img{
margin: 0 0 30px 0;
}

#featureimg {
float: left;
height: 440px;
width: 490px;
margin-top: 35px;
background-color: #222222;
}

#featureimg h3{
margin: 15px 0 5px 0;
}

#fboxtext {
margin: 0 15px 0 15px;
color: #FFFFFF;
}

#linkbox {
width: 110px;
height: 26px;
background-color: #31c4d8;
}

#linkbox p{
margin: 3px 0 3px 5px;
}

#clientrow {
color:#888888;
display:block;
line-height:15px;
position:relative;
width:950px;
}

#clientrow h3{
margin-bottom:10px;
width:auto;
}

#clientbox {
display:block;
float:left;
margin:0 20px 0 0;
width:500px;
position:relative;
}

#contactbox {
display:block;
float:left;
margin-bottom:0;
position:relative;
width:490px;
left:70px;
}

#careerbox {
display:block;
float:right;
margin-right:60px;
position:relative;
width:350px;
}

#careerbox img {
float:left;
margin:0 7px 7px 0;
}

#contactbox p {
margin-bottom:20px;
}

#contactbox, .home #contactbox, .ourwork #contactbox, .dev #contactbox {
width:490px;
margin-right:0px;
}

#contactbox h3, .home #contactbox h3, .ourwork #contactbox h3, .dev #contactbox h3 {
width:340px;
}


#listbox {
margin:0 10px 0px 0;
display:inline-block;
float:left;
width:115px;
}

#listbox h6{
margin:0 0 0 0;
}

#lm_callout {
display:block;
margin:35px 0 0 0;
min-height:105px;
position:relative;
width:700px;
}

#lm_callout.lodjix_serv {
margin: 0 0 30px 0;
}

.navigation {
background-color:#FBFBFB;
display:block;
height:32px;
margin:0 0 20px 0;
width:950px;
}

#navigation {
background-color:#FBFBFB;
display:block;
height:32px;
width:711px;
}

.page-navi {
width:950px;
}

.pFade {
position:absolute;
}

#load {
	display: none;
	position: absolute;
	left:343px;
	top:265px;
	background: transparent url(../img/gif/ajax-loa.gif) no-repeat scroll 0 0; 
	width: 32px;
	height: 32px;
        opacity:0.3;
        filter: alpha(opacity = 30);
}

.home #featureLabel, .home #featureLabeltv, .home #featureLabelen {
position: relative;
display:block;
background: transparent url(../img/gif/cab_tittle_sls.gif) no-repeat scroll 0 0;
width:120px;
height:32px;
float:left;
margin-top:-80px;
z-index:100;
}

.home #featureLabeltv {
background: transparent url(../img/gif/cab_tittle_sls_toursvirtuales.gif) no-repeat scroll 0 0;
}

.home #featureLabelen {
background: transparent url(../img/gif/cab_tittle_slsen.gif) no-repeat scroll 0 0;
}

.home #featureTitle {
background: transparent url(../img/png/bg_tittle_sls.png) repeat-x scroll 0 0;
display:block;
height:32px;
left:120px;
position:absolute;
min-width:120px;
top:330px;
z-index:100;
*width:16%;
}

.ourwork #featureTitle {
background: transparent url(../img/png/bg_tittle_sls.png) repeat-x scroll 0 0;
display:block;
height:32px;
left:120px;
position:absolute;
top:330px;
z-index:100;
[if IE]>
width:17%;
<![endif]
}


#featureTitle img {
display:block;
height:32px;
margin-top:1px;
margin-right:5px;
position:relative;
width:14px;
float:right;
}

#featureTitle a {
color:#ffffff;
}

#featureTitle a:hover {
color:#9b8c16;
}

.dev #featureSquares {
position: relative;
float:right;
display:block;
width:80px;
height:32px;
margin-top:-80px;
z-index:100;
}

.dev #featureSquares ul {
list-style-type: none;
}

.dev #featureSquares img {
z-index:20;
position:relative;
height:12px;
}

.home #featureSquares {
position: relative;
float:right;
display:block;
width:80px;
height:32px;
margin-top:-60px;
z-index:100;
}

.home #featureSquares ul {
list-style-type: none;
}

.home #featureSquares img {
z-index:20;
position:relative;
height:12px;
}

.ourwork #featureSquares {
position: relative;
float:right;
display:block;
width:80px;
height:32px;
margin-top:-80px;
z-index:100;
}

.ourwork #featureSquares ul {
list-style-type: none;
}

.ourwork #featureSquares img {
z-index:20;
position:relative;
height:12px;
}

.title-text {
color:#FFFFFF;
margin-right:20px;
position:relative;
top:7px;
left:10px;
}

#featureSquares a {
background: #9b8c16;
cursor:pointer;
display:block;
float:left;
height:12px;
margin-right:5px;
margin-top:10px;
overflow:hidden;
text-indent:-9999px;
width:10px;
}

#featureSquares a.activeSlide {
background: #ffffff;
}

#featureSquares a.activeSlide:hover {
background: #ffffff;
}

#featureSquares a:hover {
background: #252525;
}

#main_slides {
background-color:#fbfbfb;
height:390px;
overflow:hidden;
}

#divbar {
margin: 13px 0 0 0;
}

#relatedPosts {
display:block;
position:relative;
width:350px;
}

#workpanel, #workpanel_menu {
display:block;
float:left;
/*height:400px;*/
position:relative;
}

#workpanel {
width:420px;
}

#workpanel_menu {
width:180px;
}

#workpanel_menu a.selected {
color:#CCC;
}

.home #workpanel {
min-height:250px;
height:auto;
text-align:justify;
}

.home #workpanel p {
display:block;
line-height:18px;
position:relative;
top:8px;
}

#projectrow h3 {
width:470px;
}

/* Styles for the entire LavaLamp menu */
#lava {
		/* you must set it to relative, so that you can use absolute position for children elements */
		position:relative;
		float:right;
		text-align:right; 
		width:680px; 
		height:40px;
		font-size:13px;
		}
	
	#lava ul {
		/* remove the list style and spaces*/
		margin:0; 
		padding:0;
		list-style:none; 
		display:inline;
				
		/* position absolute so that z-index can be defined */
		position:absolute;
		
		/* center the menu, depend on the width of you menu*/
		left:0px;
		right:0px;
		top:0; 
		
		/* should be higher than #box */
		z-index:100;

	}
	
	#lava ul li {
		
		/* give some spaces between the list items */
		margin:0 10px; 
		
		/* display the list item in single row */
		float:right;
	}
	
	#lava ul li.selected a {
	color:#a18e17;
	}
	
	#lava ul li a {
		color:#d3d3d3;
	}
	
	#lava #box {
		
		/* position absolute so that z-index can be defined and able to move this item using javascript */
		position:absolute; 
		left:0; 
		top:0; 
		
		/* should be lower than the list menu */
		z-index:50; 

		/* image of the right rounded corner */
		background:url(../img/gif/tail.gif) no-repeat right center; 
		height:20px;
		
		/* add padding 8px so that the tail would appear */
		padding-right:8px;
		
		/* self-adjust negative margin to make sure the box display in the center of the item */
		margin-left:-10px;
	}
	
	#lava #box .head {
		/* image of the left rounded corner */
		background:url(../img/gif/head.gif) no-repeat 0 0; 
		height:20px;

		/* self-adjust left padding to make sure the box display in the center of the item */
		padding-left:10px;
	}

/* Represents the background of the highlighted menu-item. */
        #lava li.back {
            background: url("../image/lava.gif") no-repeat right -30px;
            width: 9px; height: 30px;
            z-index: 8;
            position: absolute;
        }
            #lava li.back .left {
                background: url("../image/lava.gif") no-repeat top left;
                height: 30px;
                margin-right: 9px;
            }

/***********/
.greent {
	color: #9b8c16;
}
.im_right {
	float:right;
	padding:2px;
	border:1px #333 solid;
	margin:0 0 10px 10px;
}
.im_left {
	float:left;
	padding:2px;
	border:1px #333 solid;
	margin:0 10px 10px 0;
}

.right {float:right;}