/************************************************
 *
 *  File     :  css/main.css
 *  Medium   :  Screen
 *  Version  :  1.0
 *  Website  :  Plantilla
 *  Author   :  yxconproyectos.com(c) 2011 // 
 *
 ************************************************/

/* global */

    * { margin: 0; padding: 0; }
    
    body { 
        cursor: default;
        background: #fff url(../img/bg_body.jpg) repeat-x;
        font: 14px arial, sans-serif;
        color: #777;
    }

    /* image replacement */
        #header form button 
        	{ display: block; overflow: hidden; text-indent: -1000em; }

    /* sprite */
		h1, #header form input, #header form button, #content h3, #content:before, ul.domains li, a.button, #contact fieldset legend span, #contact button
			{ background: url(../img/sprite.png) no-repeat;	}

    /* anchors */
        a {
            color: #be4326;
            text-decoration: none;
        }
        
        a:hover {
        	color: #000;
        }
            
/* // global */

/* page setup */
    #container {
        width: 960px;
        margin: 0 auto;
    }
        
    #header {
    	height: 232px;
    	position: relative;
    	z-index: 2;
    	padding-top: 28px;
    }
    
    #content {
    	background: #fff;
    	width: 800px;
    	padding: 30px;
    	position: relative;
    	left: 80px;
    	z-index: 1;
    	overflow: hidden;
    }
    
    /* header */
		#header h1 {
            font-size: 32px;
            font-weight: normal;
            line-height: 30px;
            color: #fff;
            background-position: 0 0;
            height: 32px;
            overflow: hidden;
            position: relative;
            margin: 0 0 28px 0;
            text-indent: 40px;
            text-transform: lowercase;
        }
        
        #header h2 {
        	font-weight: normal;
        	font-size: 16px;
        	padding: 32px 250px 0 90px;
        	color: #fff;
        }
        
        #header h2:after {
        	content: " ";
        	width: 205px;
        	height: 253px;
        	position: absolute;
        	background: url(../img/pad.png) no-repeat;
        	top: 70px;
        	right: 20px;
        }        
        
        /* search form */
	   		#header form {
	   			position: absolute;
	   			right: 0;
	   			top: 30px;
	   		}
	   		
			#header form legend {
				display: none;
			}
			
			#header form fieldset {
				border: 0;
			}
	        
	        #header form input {
	        	float: left;
	        	height: 30px;
	        	font: 14px/30px arial, sans-serif;
	        	color: #777;
	        	background-color: #fff;
	        	background-position: 5px -334px;
	        	border: 0;
				-webkit-border-radius: 4px;
	        	-moz-border-radius: 4px;
	        	-o-border-radius: 4px;
	        	border-radius: 4px;
	        	text-indent: .5em;
	        	margin-right: 5px;
	        }
	        
	        #header form input:focus {
	        	background-image: none;
	        }
	        
	        #header form button {
	        	float: left;
	        	border: 0;
	        	width: 36px;
	        	height: 32px;
	        	background-position: 0 -32px;
	        	cursor: pointer;
	        }
    /* // header */

/* // page setup */
   
/* content */
	#content div {
		float: left;
		width: 385px; 
    	min-height: 500px;
	}
	
	#content:before {
		content: "";
		width: 29px;
		height: 29px;
		background-position: -4px -114px;
		position: absolute;
		top: 34px;
		left: 0;
	}
	
	#content div:first-child {
		margin-right: 30px;
	}
	
	#content h3 {
		font-size: 16px;
		font-weight: normal;
		text-transform: uppercase;
		line-height: 34px;
		text-indent: 10px;
		color: #fff;
		height: 44px;
		background-position: 0 -143px;
	}
	
	#content ul + h3 {
		background-position: 0 -187px;
	}
	
	/* domains list */
		ul.domains {
			list-style: none;
			overflow: hidden;
			padding: 1em 0 3em 0;
		}
		
		ul.domains li {
			width: 50%;
			float: left;
			background-position: 0 -301px;
			line-height: 2em;
			font-weight: bold;
			text-indent: 15px;
		}
	
	/* green button */
		a.button {
			display: block;
			width: 198px;
			height: 38px;
			padding: 6px;
			background-position: 0 -64px;
			line-height: 38px;
		}
		
		a.button strong {
			float: left;
			width: 108px;
			text-align: center;
			color: #fff;
			letter-spacing: -1px;
			border-right: 1px solid #9fb863;
			-webkit-text-shadow: 1px 1px 1px #526f20;
			-moz-text-shadow: 1px 1px 1px #526f20;
			-o-text-shadow: 1px 1px 1px #526f20;			
			text-shadow: 1px 1px 1px #526f20;
			cursor: pointer;
		}
		
		a.button em {
			float: left;
			width: 88px;
			text-align: center;
			font-style: normal;
			font-weight: bold;
			color: #89a24b;
			border-left: 1px solid #d5e8ab;
			-webkit-text-shadow: 1px 1px 1px #fff;
			-moz-text-shadow: 1px 1px 1px #fff;
			-o-text-shadow: 1px 1px 1px #fff; 
			text-shadow: 1px 1px 1px #fff;
			cursor: pointer;
		}
		
		a.button.full strong {
			width: 210px;
			border-right: 0;
		}

		a.button.full.noborder strong {
			border:0 none;
		}
			
		a.button:hover {
			background-position: -210px -64px;
		}
		
		a.button:hover em {
			color: #47581c;
		}
		
	/* contact form */
		#contact {
			position: relative;
			padding: 30px 0;
		}
		
		#contact fieldset {
			background: #f5f5f5;
			border: 1px solid #ddd;
			padding: 40px 15px 15px 15px;
		}
		
		#contact fieldset legend span {
			position: absolute;
			top: 25px;
			left: 10px;
			height: 30px;
			background-position: 0 -231px;
			line-height: 30px;
			padding: 0 10px;
			color: #fff;
			text-transform: uppercase;
		}
		
		#contact ol {
			list-style: none;
		}
		
		#contact ol li {
			overflow: auto;
		}
		
		#contact label {
			display: none;
		}
		
		#contact input,
		#contact textarea {
			font: 13px arial, sans-serif;
			background: #d4d4d4;
			padding: 8px;
			color: #555;
			-webkit-text-shadow: 1px 1px 1px #fff;
			-moz-text-shadow: 1px 1px 1px #fff;
			-o-text-shadow: 1px 1px 1px #fff; 
			text-shadow: 1px 1px 1px #fff;
			border: 2px solid #fff;
			border-radius: 4px;
			margin-bottom: 15px;
			width: 333px;
		}
		
		#contact button {
			float: right;
			height: 34px;
			width: 95px;
			border: 0;
			font: 13px/30px arial, sans-serif;
			color: #fff;
			text-align: center;
			background-position: 0 -261px;
			cursor: pointer;
		}
/* // content */

/* footer */
	#footer {
		background: #39414c;
		height: 80px;
		text-align: center;
	}
	
	#footer ul {
		list-style: none;
	}

	#footer ul li {
		display: inline;
		line-height: 80px;
		font-size: 12px;
		padding: 0 3em;
	}
	
	#footer ul li a {
		color: #a6abb3;
	}
	
	#footer ul li a:hover {
		color: #fff;
	}