/*El layout de www.autosconarte.com basado en un trabajo de Mik Morote http://www.araudi.net
Layout modificado y adaptado por Kseso? así como el css y maquetación sobre
un diseño original de Paola Magariños
Bajo licencia CC: reconocimiento, no comercial, compartir igual a igual.
Reconocimiento y agradecimiento por el pack de iconos sociales a Jan Cavan http://www.dawghousedesignstudio.com/
Fontin y 'Museo 300' are fonts by Jos Buivenga (exljbris) -> www.exljbris.com
Sería buena señal sobre tí que mantuvieses estos créditos en tu trabajo derivado.
*/
 
@font-face {
    font-family: 'Museo 300';
    src: url('museo.eot');
    src: local('Museo 300'), local('Museo-300'), url('museo.ttf') format('truetype');
}

@font-face {
	font-family: 'FontinRegular';
	src: url('Fontin-Regular.eot');
	src: local('Fontin Regular'), local('Fontin-Regular'), url('Fontin-Regular.ttf') format('truetype');
}

@font-face {
	font-family: 'FontinItalic';
	src: url('Fontin-Italic.eot');
	src: local('Fontin Italic'), local('Fontin-Italic'), url('Fontin-Italic.ttf') format('truetype');
}

  * { margin: 0px;
    padding: 0px;
    outline: none;
    position: relative;
    }

  html, body {
    height: 100%;
    }

  body { margin: 0px auto;
    background: url(fond-pag.jpg) repeat;
    font-family: Verdana, Arial, sans-serif;
    font-size: 1em;
    }

#motivo {
    width: 100%;
    height: 249px;
    position: absolute;
    left: 0;
    background: url(patt.png) repeat-x;
    z-index: -1;
}
  #motivo h1 {text-indent:-9999px;
  }

  #contenedorgral {
    margin: 0 auto;
    width: 90%;
    max-width: 1024px;
    min-width: 790px;
    background: url(cuerpo-izq.png) repeat-y;
  }
  #contenedorpag {
    background: url(cuerpo-drch.png) repeat-y top right;
    margin-left: 6px;
  }
#top { 
    height:42px;
    width:100%;
    line-height:3em;
    z-index:1500;
  }
  
#top img {
  position:absolute;
  top:1px;
  /*z-index: 1500;*/
  }
#top_1 {
  color:#fff;
  font-family: "times New Roman";
  letter-spacing: 0.05em;
  font-size: 2em;
  margin: 0 auto;
  position: relative;
  text-align: center;
  width: 100%;
  }
  #top_1 span {color:#333333;}

  #top_2 {
  color:#554425;
  left:-1px;
  position:absolute;
  text-align:center;
  top:-1px;
  width:100%;
}
 #top_2 span {color: #E8A032;}
 
  #header {
    height: 150px;
    margin-right: 6px;
    overflow:hidden;
    }
  #header #logo {max-width: 1018px; margin: 0 auto; z-index: 1000;}
  #header imag {margin: 0 auto;}
  #header p {position: absolute; z-index:999;}

 
 #menu {
    background: #e8a032;
    margin: 0 6px 0 0px;
    overflow:hidden;
    } 

 #menu ul {
    float: right;
    }

 #menu ul li {
    list-style-type: none;
    display: inline;
    float: left;
    }
	
 #menu ul li a {
  display: block;
  padding: 4px 10px;
  color: #DDE9FF;
  text-decoration: none;
  font-family: 'museo 300';
  font-size: 1.4em;
  text-shadow:1px 1px 1px #444444;
}
   
  #menu a:hover {
    background-color: #CCB9A6;
    color: #444;
    margin: 2px;
    text-shadow: 1px 1px 1px #fff;
    padding: 2px 8px;
    -moz-box-shadow:0 0 1px #000;
    -webkit-box-shadow:0 0 1px #000;
    -o-box-shadow:0 0 1px #000;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -o-border-radius: 10px;
} 	

  #lateral_derecho {
    background: transparent url(sidebar.jpg) no-repeat bottom right;
    float:right;
    font-family: verdana;
    margin:22px 7px 0 0;
    width:300px;
    }

  #lateral_derecho h2 {
  background: transparent url(sidebar-top.jpg) no-repeat top right;
  color:#702606;
  display:block;
  font-family:'museo 300';
  font-size:1.3em;
  letter-spacing:2px;
  padding:2px 0 0;
  text-align:center;
  text-shadow:1px 1px 1px #FFF;
    }
  #noticias {
    margin:1px 9px 20px 0;
    padding: 1px 9px 0 15px;
/*    height:420px;
    overflow: auto;*/
  }
  
  #noticias img {
  display: inline;
  float:left;
  margin: 0 5px 5px -6px;
  clear: left;
  border:1px inset #e3e1d5;
  }

  #noticias dl {
    display: block;
   }

  #noticias dt {
    font-family: 'museo 300';
    font-size: 1em;
    font-weight: 600;
    text-align: center;
    color: #d07000;
    text-shadow: 1px 1px 1px #fff;
    letter-spacing:0.1em;
    line-height: 1.4em;
    margin-top: 5px;
    clear:both;
    }

#noticias dd {
    color:#6F6F6F;
    font-size:.8em;
    text-align:justify;
    }

#noticias dd a {
    background:transparent url(go.png) no-repeat scroll right bottom;
    color:#6f6f6f;
    text-decoration:none;
    display: block;
    padding-bottom:3px;
    }
    
#noticias dd a:hover, #noticias dd a:focus {
    background:transparent url(go2.png) no-repeat scroll right bottom;
    color:#801000;
    text-decoration:none;
    }

  #contenido {
    margin:22px 320px 0 8px;
    }

  #intro, #mootool {
    text-align: justify;
    color: #333;
    margin: 0;
    padding: 0 14px 14px 14px;
    }

  #intro h2 {
    color:#201C28;
    display:inline;
    font-size: 1em;
    line-height:2em;
    padding-left:10px;
    padding-right:10px;
    position:relative;
    top:-23px;
    }

  #intro p { text-indent: 3em;
    margin-top: -20px;
    font-size: 1em;
    }

  #contenido h3 {
    color:#702606;
    font-family:'museo 300';
    font-size:1.3em;
    letter-spacing:0.1em;
    }

  .opcion {
    text-align: justify;
    padding: 0 14px;
    }
.opcion p {
  color:#32665D;
  font-family: FontinRegular;
  font-size:1em;
  margin:5px 0;
  }
.opcion p + p {text-indent:3em;}

.opcion p a {
  color: #E8A032!important;
  text-decoration: none!important;
  border-bottom: 1px dotted;
  }
 
.opcion p a:hover, .opcion p a:focus {
  color: #801000!important;
  border-bottom: 1px solid;
  }
  
.opcion p span {
  font-family: FontinItalic;
  color:#AA9664;
  }
  
.opcion p img {
    clear:left;
    display: inline-block;
    float: left;
    margin: 5px 15px 5px -10px;
    -moz-box-shadow: 0 0 10px #999;
    -moz-transform:rotate(-5deg);
    -webkit-box-shadow: 0 0 10px #999;
    -webkit-transform:rotate(-5deg);
    -o-box-shadow:0 0 10px #999;
    -o-transform:rotate(-5deg);
  }
.opcion p img.right {
    clear: right;
    display: inline-block;
    float: right;
    margin: 0 -20px 5px 20px;
    -moz-box-shadow: 0 0 10px #999;
    -moz-transform:rotate(-5deg);
    -webkit-box-shadow: 0 0 10px #999;
    -webkit-transform:rotate(-5deg);
    -o-box-shadow: 0 0 10px #999;
    -o-transform:rotate(-5deg);
    }
     
  .opcion img {
    clear:right;
    display:inline-block;
    float:right;
    margin:10px 0 5px 10px;
  }
  
.opcion p span img {
  display: block!important;
  clear: both;
  float: none;
  margin: 0 auto;
  }
  
  .opcion dl {
    display: inline;
    clear:left;
   }

  .opcion dt {
    font-family: 'museo 300';
    font-size: 1em;
    font-weight: 600;
    color: #32665D;
    line-height: 1em;
    text-shadow:1px 1px 1px #FFFFFF;
    }

  .opcion dd {
    color:#32665D;
    font-family: FontinRegular;
    font-size:1em;
    text-align:justify;
    margin-bottom:3px;
    }
    
  .opcion dd span {
    color: #e8a032;
  }
  
  .opcion dd a {
    color:#E8A032;
    text-decoration:none;
    display: inline;
    border-bottom:1px dotted;
    }
    
  .opcion dd a:hover, .opcion dd a:focus {
    color:#801000;
    border-bottom:1px solid;
    }

/*  #texto1 img, #texto3 img { margin: 6px 0px 0px 14px;
    float: left;
    padding-left: 10px;
    }

  #texto2 img,  #texto4 img { margin: 6px 20px 0px -6px;
    float: left;
    padding-left: 10px;
    }
*/
  #texto2, #texto2 h3, #texto3, #texto3 h3, #texto4, #texto4 h3  { 
    color: #554425;
    }

#texto1 {
  margin-top: 20px;
}

#texto2, #texto3, #texto4 {
  margin-top: 0px;
}
  .galeria {
    height:100%;
    margin: 0 auto;
    width: 100%;
    margin-bottom: 10px;
  }
  .galeria img{
  display: inline;
  float: left;
  border: 0;
  margin: 5px;
  outline: none;
  clear: none;
  }
/********************* Pie **************/
  #pie {
    background: transparent url(menu1px.jpg) repeat;
    margin:0 6px 0 0;
    height:3em;
    border-bottom: 1px solid #554425;
    }
    
  #pie p { color: #554425;
     font-size:0.9em;
     padding:9px 0;
     text-align:center;
    }

  #pie p a { color: #444; text-decoration: none; border-bottom:1px dotted;}
  
  #pie p a:visited, #pie p a:hover { color: #801000; border-bottom:1px solid;}
    
/*  #pie ul { text-align: center;
    color: rgb(255, 255, 255);
    position: relative;
    bottom: 2px;
    }

  #pie ul li { padding: 0px;
    list-style-type: none;
    font-size: 0.8em;
    display: inline;
    }

  #pie ul li a { padding: 4px 16px 0px;
    text-decoration: none;
    color: rgb(255, 255, 255);
    font-size: 0.85em;
    }
*/
  #pie ul li a:hover, #pie ul li a:focus { padding: 4px 16px 0px;
    text-decoration: underline;
    }

  .corte { clear: both;
    }
/********************* Formulario de contacto **************/
form {
  margin: 5px 0 0 0;
}

fieldset {
  width: 450px;
  letter-spacing: .1em;
  margin: 0;
  border: none;
  }


label {
  clear:both;
  color:#333;
  margin: 15px 0 5px 10px;
  display: block;
  font-size: 1em;
  }
 
input {
  background-color: #c8c8af;
  display:block;
  width:20em;
  font-size:1em;
  clear:both;
  color:#1f1f1f;
  margin: 0 0 -5px 10px;
  padding: 0 5px;
  border: 1px outset #010000;
  }
  
textarea {
  font-family: Verdana, Arial, sans-serif;
  background-color: #c8c8af;
  display:block;
  color:#1f1f1f;
  font-size:.9em;
  clear:both;
  margin-left: 10px;
  border: 1px outset #A68368;
  }

textarea:hover, textarea:focus, textarea:visited, input:hover, input:focus, input:visited {
  color: #801000;
  background-color: #C8B39E;
  border: 1px inset #A68368;
}
  
.submit {
  background-color: #c8c8af;
  color: #1f1f1f;
  text-decoration: none;
  float:left;
  width: 6em;
  padding: 2px 10px;
  margin: -20px 0 0 70px ;
  border: 1px inset #A68368;
  }

.submit:hover {
  background-color: #c8c8af;
  color: #801000;
  border: 1px outset #A68368;
  cursor: pointer;
  }
.oculto { display:none; }
/* ***** Errores en formulario, coloca el color que creas mas conveniente ***** */
.frmerr {
	color:#800;
}
  /* fin del formulario */
/**************************** galería ******************************/
.photo {width:100%; height:600px; text-align:left; position:relative;}

.photo dl {font-size:1em; position:absolute; width:90%; top:50px; left:25px;}
.photo dl dt {margin-bottom:1em;}
.photo dl dd {
  color:#32665D;
  font-family:'FontinRegular';
  font-size:1em;
  margin: 5px 0 0.5em 0;
}
.photo dl dd a img {float: left; display: inline;  margin: 15px; padding: 10px;}
.photo dl dd a:hover img {border: 0px outset #e9e9df;} 

.photo dl dd.iconos a img {
  border: 0!important;
  background: transparent!important;
}
.photo dl dd.iconos a:hover img {margin-top: -2px; -moz-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); -o-transform: rotate(-45deg);}

.photo ul.topic {padding:0; margin:0; list-style:none; width:99%; height:auto; position:relative; z-index:10;}

.photo ul.topic li {display:block; width:33%; height:31px; float:left;}
.photo ul.topic li a.set {display:block; font-size:1.4em; width:100%; height:23px; text-align:center; line-height:23px; color:#702606; text-decoration:none; border:1px solid #fff; border-width:1px 1px 0 0; background:#C8B39E; font-family: 'museo 300'; font-weight:600; text-shadow: 1px 1px 1px #fff;}

.photo ul.topic li a ul, 
.photo ul.topic li ul 
{display:none;}

.photo ul.topic li a:hover,
.photo ul.topic li:hover a
{color:#DDE9FF; background:#E8A032; text-shadow: 1px 1px 1px #444;}

.photo ul.topic li a:hover ul, 
.photo ul.topic li:hover ul 
{display:block; position:absolute; top:31px; list-style:none; height:auto; background:#e9e9df; width:300%; padding:20px 0 0 50px;}

.photo ul.topic li a:hover ul#asfalto, .photo ul.topic li:hover ul#asfalto {left:0;}
.photo ul li a:hover ul#bocetos, .photo ul.topic li:hover ul#bocetos {left:-100%;}
.photo ul.topic li a:hover ul#oleos, .photo ul.topic li:hover ul#oleos {left:-200%;}

.photo ul.topic li a:hover ul li, 
.photo ul.topic li:hover ul li 
{display:inline; width:auto; height:auto; float:left; border:1px solid #fff; margin:1px;}

.photo ul.topic li a:hover ul li a, 
.photo ul.topic li:hover ul li a 
{display:block; width:165px; height:145px; cursor:default; float:left; text-decoration:none; background:#444; border:1px solid #888; text-decoration:none;}

.photo ul.topic li a:hover ul li a img, 
.photo ul.topic li:hover ul li a img
{display:block; margin: 10px; width:auto; height:auto; text-decoration: none;cursor: pointer; cursor: hand;}


/********************************* tooltip *****************************
.tooltip {
  position: relative;
  z-index: 100;
  color: #E8A032;
}
  
.tooltip:hover {
  background-color: transparent;
  z-index: 1000;
}
.tooltip span {
  border: 1px solid #C8B39E;
  padding: 5px;
  position: absolute;
  text-decoration: none;
  background-color: #D3D198;
  color: #6f6f6f!important;
  text-align: left;
  visibility: hidden;
}
.tooltip:hover span {
  visibility: visible;
  top: -50px;
  left: -200px;
  z-index: 1000;
}
*/