/* Font faces */
@font-face {
    font-family: 'trajan';
    src: url('fonts/titles.eot');
    src: url('fonts/titles.eot?#iefix') format('embedded-opentype'),
         url('fonts/titles.woff2') format('woff2'),
         url('fonts/titles.woff') format('woff'),
         url('fonts/titles.ttf') format('truetype'),
         url('fonts/titles.svg#goudy_trajan_regularregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

/* General */
* {margin:0; padding: 0;}
h1, h2, h3, h4, h5, h6 {font-family:trajan;}
.wrapper {width: 960px; margin: 0 auto; }
.clear {clear:both;}

/* Head */
.page-title {border-bottom: 1px solid #000; height: 75px; vertical-align: text-bottom;}
.page-title-h1 a {display:block; width: 400px; height: 75px; background: transparent url("/imgs/roncal-y-janda.jpg") no-repeat scroll 0px 0px;}
.page-title-h1 span {display:none;}
.main-menu {text-align:right; margin: 10px 0 20px 0;}
.main-menu li {display: inline; margin-left: 30px; text-transform: uppercase; font-family: trajan; font-size: 1em;}
.main-menu li .active {color:#f00;}
.main-menu a {color: #000; text-decoration: none;}
.main-menu a:hover {text-decoration: underline;}

/* Portada: proyectos */
.portada .portada-proyecto {position:relative; float:left; width:300px; height: 220px; margin: 10px; overflow: hidden;}
.portada .titulo-proyecto {position:absolute; width:100%; height:100%;}
.portada .titulo-proyecto h3 {position:absolute; bottom: 0; padding:10px; z-index:10; font-size: 1em; font-weight:normal;}
.portada .titulo-proyecto-bg {background:#eee; opacity:0.8; width:100%; height:100%; position: absolute; display: none;}
.portada .portada-proyecto a {color:#000; text-decoration:none;}
.portada .mas-proys {padding-top: 10px; text-align: center; font-family:trajan; font-size: 0.9em;}
.portada .mas-proys a {color: #000; text-decoration: none;}
.portada .mas-proys a:hover {text-decoration: underline;}

.portada .titulo-proyecto.no-js {background: #eee; opacity: 0.8; height:auto; bottom:0;}
.portada .titulo-proyecto.no-js h3 {position:static;}

/* Contenido en general */
.main-content {font-size: 0.9em; text-align: justify; font-family: helvetica,arial; font-weight: lighter; color: #666;}
.main-content ul, .main-content ol {margin: 0 0 0 1.5em;}
.main-content>ul, .main-content>ol {margin: 8px 0 8px 1.5em;}
.main-content p {margin: 0.5em 0 0.5em 0;}
.main-content h3, .pagina .main-content h4, .pagina .main-content h5, .pagina .main-content h6 {color:#000; font-weight: bold;
  font-size:default; margin: 1.5em 0 0 0;}
.main-content img {max-width: 100%;}

/* Páginas normales*/
.pagina .main-content {width: 620px; margin:10px;}
.pagina .menu-page-content {float:right; width: 260px; margin:10px; font-family:trajan; font-size: 0.85em;}
.pagina .menu-page-content ul {list-style-type: none;}
.pagina .menu-page-content li {margin-bottom: 5px;}
.pagina .menu-page-content a {color: #000; text-decoration: none;}
.pagina .menu-page-content a:hover {text-decoration: underline;}

.pagina .menu-page-content.fixed {position:fixed; top: 50px; margin: 0 10px 10px 690px;}

/* Proyectos */
.proyecto .imgs-proyecto {width: 460px; margin: 10px; float:left;}
.proyecto .imgs-proyecto a {cursor: zoom-in;}
.proyecto .imgs-proyecto img {max-width: 100%;}
.proyecto .other-imgs figure {float: left; margin: 10px 20px 10px 0;}
.proyecto .other-imgs figure:nth-child(3n) {margin-right: 0;}

.proyecto .main-content {width: 460px; margin: 10px; float:right;}
.proyecto :first-child {margin-top: 0;}

/* Parte de abajo */
.bottom {margin-top: 40px; padding-top: 10px; border-top: 1px solid #000; text-align:center; height: 75px; font-family: trajan; font-size: 0.85em;}
.bottom a {color: #000; text-decoration: none;}
.bottom a:hover {text-decoration: underline;}


/* Vista movil */
@media (max-device-width: 15cm) {
  .wrapper {width:auto; padding: 0 10px;}

  .page-title {height: 50px;}
  .page-title-h1 a {max-width: 100%; height: 50px; background: transparent url("/imgs/roncal-y-janda-small.jpg") no-repeat scroll 0px 0px;}
  .main-menu li {margin-left: 15px; font-size: 0.8em;}

  .portada .portada-proyecto {margin-left:auto;margin-right:auto; float:none;}

  .pagina .menu-page-content {display: none;}
  .pagina .main-content {width:auto; float: none;}
  .pagina h2 {display: none;}

  .proyecto .imgs-proyecto {width: auto; float: none;}
  .proyecto .main-content {width: auto; float: none;}
  .proyecto .other-imgs figure {max-width: 32%; margin-right: 2%;}
  .proyecto .other-imgs figure:nth-child(3n) {margin-right: 0;}
}