/*
* HTML5 Boilerplate
*
* What follows is the result of much research on cross-browser styling.
* Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
* Kroc Camen, and the H5BP dev community and team.
*/
/* ==========================================================================
Base styles: opinionated defaults
========================================================================== */
html,
button,
input,
select,
textarea {
color: #222;
}
body {
font-size: 1em;
line-height: 1.4;
}
/*
* Remove text-shadow in selection highlight: h5bp.com/i
* These selection declarations have to be separate.
* Customize the background color to match your design.
*/
::-moz-selection {
background: #b3d4fc;
text-shadow: none;
}
::selection {
background: #b3d4fc;
text-shadow: none;
}
/*
* A better looking default horizontal rule
*/
hr {
display: block;
height: 1px;
border: 0;
border-top: 1px solid #ccc;
margin: 1em 0;
padding: 0;
}
/*
* Remove the gap between images and the bottom of their containers: h5bp.com/i/440
*/
img {
vertical-align: middle;
}
/*
* Remove default fieldset styles.
*/
fieldset {
border: 0;
margin: 0;
padding: 0;
}
/*
* Allow only vertical resizing of textareas.
*/
textarea {
resize: vertical;
}
/* ==========================================================================
Chrome Frame prompt
========================================================================== */
.chromeframe {
margin: 0.2em 0;
background: #ccc;
color: #000;
padding: 0.2em 0;
}
/* ==========================================================================
Author's custom styles Author: JOAN BELTRAN wwweah.com
========================================================================== */
/*---------------------------------------------------------------------------
TRANSITIONS AND SHADOWS
---------------------------------------------------------------------------*/
a, #content a img, form.contact button, #comments form button {
-webkit-transition: all .2s ease;
-moz-transition: all .2s ease;
-o-transition: all .2s ease;
-ms-transition: all .2s ease;
transition: all .2s ease;
behavior: url(/htc/pie.htc);
}
#column-left, #content, #top-info, #expo-content, #text-content, .page-footer, #comments, .dropdown-menu ul {
-moz-box-shadow: 0 0 10px rgba(0,0,0,0.5);
-webkit-box-shadow: 0 0 10px rgba(0,0,0,0.5);
box-shadow: 0 0 10px rgba(0,0,0,0.5);
behavior: url(/htc/pie.htc);
}
#content a img {opacity:0.86; filter:alpha(opacity=86);}
#content a img:hover {opacity:1; filter:alpha(opacity=100); behavior: url(/htc/pie.htc);}
form.contact button, #comments form input[type=submit], .nav3-button {
-webkit-box-shadow: 0 1px 5px #666;
-moz-box-shadow: 0 1px 5px #666;
box-shadow: 0 1px 5px #666;
behavior: url(/htc/pie.htc);
}
form.contact button:hover, #comments form input[type=submit]:hover, .nav3-button:hover {
-webkit-box-shadow: 0 1px 8px #222;
-moz-box-shadow: 0 1px 8px #222;
box-shadow: 0 1px 8px #222;
behavior: url(/htc/pie.htc);
}
form.contact button:active, #comments form input[type=submit]:active, .nav3-button:active {
-webkit-box-shadow:inset 0 1px 5px #333;
-moz-box-shadow:inset 0 1px 5px #333;
box-shadow:inset 0 1px 5px #333;
-webkit-transition:none;
-moz-transition:none;
-o-transition:none;
-ms-transition:none;
transition:none;
behavior: url(/htc/pie.htc);
}
/*末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末
END OF TRANSITIONS AND SHADOWS
末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末*/
/*---------------------------------------------------------------------------
EJES TEMﾁTICOS
---------------------------------------------------------------------------*/
/*------- STYLE 1 -------*/
body.style1 {background:url(/images/page-elements/style1-background.jpg);}
.style1 #number-date,
.style1 #expo-pager span.actived,
.style1 .text a {color:#963;}
.style1 a:hover,
.style1 a.active,
.style1 .cycle-pager span.cycle-pager-active,
.style1 #organic-tabs li a.current:hover,
.style1 #organic-tabs .nav li a:hover,
.style1 #organic-tabs .nav li a:focus,
.style1 .dropdown-open {color:#963;}
.style1 .dropdown-menu li > a:hover {background-color:#963;}
.style1 .dropdown-open,
.style1 .nav3-button:hover {background:url(/images/page-elements/smart-menu1.png) 6px 7px no-repeat;}
/*------- STYLE 2 -------*/
body.style2 {background:url(/images/page-elements/style2-background.jpg);}
.style2 #number-date,
.style2 #expo-pager span.actived,
.style2 .text a {color:#933;}
.style2 a:hover,
.style2 a.active,
.style2 .cycle-pager span.cycle-pager-active,
.style2 #organic-tabs li a.current:hover,
.style2 #organic-tabs .nav li a:hover,
.style2 #organic-tabs .nav li a:focus,
.style2 .dropdown-open {color:#933;}
.style2 .dropdown-menu li > a:hover {background-color:#933;}
.style2 .dropdown-open,
.style2 .nav3-button:hover {background:url(/images/page-elements/smart-menu2.png) 6px 7px no-repeat;}
/*------- STYLE 3 -------*/
body.style3 {background:url(/images/page-elements/style3-background.jpg);}
.style3 #number-date,
.style3 #expo-pager span.actived,
.style3 .text a {color:#369;}
.style3 a:hover,
.style3 a.active,
.style3 .cycle-pager span.cycle-pager-active,
.style3 #organic-tabs li a.current:hover,
.style3 #organic-tabs .nav li a:hover,
.style3 #organic-tabs .nav li a:focus,
.style3 .dropdown-open {color:#369;}
.style3 .dropdown-menu li > a:hover {background-color:#369;}
.style3 .dropdown-open,
.style3 .nav3-button:hover {background:url(/images/page-elements/smart-menu3.png) 6px 7px no-repeat;}
/*------- STYLE 4 -------*/
body.style4 {background:url(/images/page-elements/style4-background.jpg);}
.style4 #number-date,
.style4 #expo-pager span.actived,
.style4 .text a {color:#366;}
.style4 a:hover,
.style4 a.active,
.style4 .cycle-pager span.cycle-pager-active,
.style4 #organic-tabs li a.current:hover,
.style4 #organic-tabs .nav li a:hover,
.style4 #organic-tabs .nav li a:focus,
.style4 .dropdown-open {color:#366;}
.style4 .dropdown-menu li > a:hover {background-color:#366;}
.style4 .dropdown-open,
.style4 .nav3-button:hover {background:url(/images/page-elements/smart-menu4.png) 6px 7px no-repeat;}
/*末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末
END OF EJES TEMﾁTICOS
末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末*/
/*---------------------------------------------------------------------------
TYPOGRAPHY
---------------------------------------------------------------------------*/
h1, h2, h3, h4, h5, h6 {font-weight:normal;}
/*------- FONT FACE -------*/
@font-face {
font-family: 'GandhiSerifRegular';
src: url('../fonts/GandhiSerif-Regular-webfont.eot');
src: url('../fonts/GandhiSerif-Regular-webfont.eot?#iefix') format('embedded-opentype'),
url('../fonts/GandhiSerif-Regular-webfont.woff') format('woff'),
url('../fonts/GandhiSerif-Regular-webfont.ttf') format('truetype'),
url('../fonts/GandhiSerif-Regular-webfont.svg#GandhiSerifRegular') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'GandhiSerifBold';
src: url('../fonts/GandhiSerif-Bold-webfont.eot');
src: url('../fonts/GandhiSerif-Bold-webfont.eot?#iefix') format('embedded-opentype'),
url('../fonts/GandhiSerif-Bold-webfont.woff') format('woff'),
url('../fonts/GandhiSerif-Bold-webfont.ttf') format('truetype'),
url('../fonts/GandhiSerif-Bold-webfont.svg#GandhiSerifBold') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'AsapRegular';
src: url('../fonts/Asap-Regular-webfont.eot');
src: url('../fonts/Asap-Regular-webfont.eot?#iefix') format('embedded-opentype'),
url('../fonts/Asap-Regular-webfont.woff') format('woff'),
url('../fonts/Asap-Regular-webfont.ttf') format('truetype'),
url('../fonts/Asap-Regular-webfont.svg#AsapRegular') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'AsapBold';
src: url('../fonts/Asap-Bold-webfont.eot');
src: url('../fonts/Asap-Bold-webfont.eot?#iefix') format('embedded-opentype'),
url('../fonts/Asap-Bold-webfont.woff') format('woff'),
url('../fonts/Asap-Bold-webfont.ttf') format('truetype'),
url('../fonts/Asap-Bold-webfont.svg#AsapBold') format('svg');
font-weight: normal;
font-style: normal;
}
/*------- GENERAL -------*/
body {font-family:'GandhiSerifRegular', Georgia, Times New Roman, Times, serif; color:#000;}
form fieldset {border:none; margin:0; padding:0;}
/*------- TITLES -------*/
.title1 {font-family:'AsapBold', Helvetica, Arial, sans-serif; font-weight:normal; text-transform:uppercase; font-size:2.4em; line-height:1em; margin:6px 20px 0 20px;}
.title-cover {font-family:'AsapBold', Helvetica, Arial, sans-serif; font-weight:normal; text-transform:uppercase; font-size:2.4em; line-height:1em; margin:6px 10px 0 10px;}
/*------- SUBTITLES -------*/
.subtitle1 {font-family:'AsapRegular', Helvetica, Arial, sans-serif; font-weight:normal; text-transform:uppercase; font-size:1.1em; line-height:1.2em; margin:0 20px;}
.subtitle2 {font-family:'AsapRegular', Helvetica, Arial, sans-serif; font-weight:normal; text-transform:uppercase; font-size:0.9em; line-height:1em; margin:4px 20px 0 20px;}
.subtitle-cover {font-family:'AsapRegular', Helvetica, Arial, sans-serif; font-weight:normal; text-transform:uppercase; font-size:1.1em; line-height:1.2em; margin:0 10px;}
/*------- TEXT -------*/
.text1, .text11 {margin:0 0 10px 0;}
.text1 p {font-size:1em; line-height:1.5em; margin:0 20px 10px 20px; text-indent:20px;}
.text1 ul li {font-size:1em; line-height:1.5em; margin:10px 20px;}
.text1 p:first-child {margin:10px 20px; text-indent:0;}
.text11 p {font-size:1em; line-height:1.4em; margin:0 20px 10px 10px;}
.text1 a, .text11 a, .thanks1 li a, .left p a {text-decoration:underline;}
/*末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末
END OF TYPOGRAPHY
末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末*/
/*---------------------------------------------------------------------------
PAGE ELEMENTS, MARGINS AND PADDINGS
---------------------------------------------------------------------------*/
/*------- WRAP -------*/
#wrap {margin:0; padding:0; min-width:1010px;}
/*------- COLUMN LEFT -------*/
#column-left {width:220px; margin:0 0 0 20px; float:left; background-color:#fff; position:fixed; z-index:10000}
#logo {padding:10px;}
#logo img {width:200px;}
/*------- NAV 1 / NAV2 -------*/
.nav1, .nav2 {margin:0; padding:0;}
.nav1 ul, .nav2 ul {margin:10px 10px 20px 10px; padding:0;}
.nav1 ul li {font-size:0.8em; line-height:1.3em; margin:5px 0 0 0; font-family:'AsapBold', Helvetica, Arial, sans-serif; text-transform:uppercase;}
.nav2 ul li {font-size:0.8em; line-height:1.3em; margin:10px 0 5px 0; font-family:'AsapBold', Helvetica, Arial, sans-serif; text-transform:uppercase;}
.nav1 ul li ul {padding:0; margin:0 0 10px 0;}
.nav1 ul li ul li {font-size:0.9em; line-height:1.3em; margin:5px 0; padding:0 0 0 6px; font-family:'AsapRegular', Helvetica, Arial, sans-serif; text-transform:uppercase;}
.nav1 ul li a, .nav2 nu li a {color:#000; display:block;}
.nav1 ul li a span, .nav2 ul li a span {font-size:0.9em; font-family:'AsapRegular', Helvetica, Arial, sans-serif;}
/*------- DROPDOWN TABLET AND SMARTPHONE -------*/
.nav3-button {display: none !important; visibility: hidden;}
/*------- COLUMN RIGHT -------*/
#content-wrap {margin:0 20px 0 260px; min-width:730px;}
/*------- TOP INFO -------*/
#top-info {margin:0 auto; padding:0 10px; width:710px; min-height:56px; background-color:#fff;}
#number-date {float:left; margin:8px 0 0 0; font-family:'GandhiSerifBold', Georgia, Times New Roman, Times, serif; font-size:1em; clear:right; width:710px; height:20px; overflow:hidden;}
#number-date .span1 {font-family:'GandhiSerifBold', Georgia, Times New Roman, Times, serif; font-size:0.9em; text-transform:uppercase;}
#number-date .span2 {font-family:'GandhiSerifRegular', Georgia, Times New Roman, Times, serif;font-size:0.9em;}
#top-info ul {list-style:none; float:right; padding:0; margin:11px 0 0 20px;}
#top-info ul li {font-size:0.7em; line-height:1.1em; text-transform:uppercase; float:left; margin:0 4px;}
#top-info ul li a {display:block;}
/*------- CONTENT -------*/
#content {margin:20px auto; padding:10px 0; width:730px; min-height:76px; background-color:#fff;}
#content header a.back {float:right; margin:0 20px 0 10px; text-transform:uppercase; font-size:0.8em;}
/*------- FOOTER -------*/
.page-footer {margin:0 auto; width:730px; height:172px; background-color:#fff;}
.page-footer div {margin:10px;}
.page-footer div.left {float:left;}
.page-footer div.right {float:right; width:465px;}
.page-footer p {margin:4px 0; font-size:0.8em;}
.page-footer div.right ul {list-style:none; margin:0; padding:0; clear:both;}
.page-footer div.right ul li {margin:0; padding:0; float:left;}
.page-footer div.right ul li a {display:block;}
.page-footer div.right ul li a img {margin:0; width:155px; float:left;}
/*------- COVER -------*/
#cover {margin:10px;}
#cover a {display:block; width:710px;}
#cover img {width:710px; margin:0 0 10px 0;}
#cover a.subtitles {display:block; margin:0 0 10px 0;}
#cover a.subtitles h2, #cover a.subtitles h3 {font-weight:normal; line-height:1.1em;}
#cover a.subtitles h2 {font-size:1.8em; margin:0 0 5px 0;}
#cover a.subtitles h3 {font-size:0.9em; margin:2px 0 1px 2px; text-transform:uppercase;}
/*------- COLLABORATORS / PREVIOUS NUMBERS -------*/
.collaborators,
.previous-numbers {margin:20px 0 0 0;}
.collaborators a,
.previous-numbers a {display:block; width:230px; margin:0 0 10px 10px; height:265px; float:left;}
.collaborators a h2,
.previous-numbers a h2 {font-size:1em; line-height:1em; margin:4px 0 0 0; font-family:'AsapBold', Helvetica, Arial, sans-serif; text-transform:uppercase;}
.collaborators a div,
.previous-numbers a div {width:230px; height:230px;}
.collaborators a div img,
.previous-numbers a div img {min-width:230px; min-height:230px;}
/*------- COLLABORATOR -------*/
.collaborator-left {float:left; width:230px; margin:10px 0 10px 10px;}
.collaborator-left img {width:230px; margin:5px 0 10px 0;}
.collaborator-left h2 {font-size:0.9em; font-family:'AsapBold', Helvetica, Arial, sans-serif; text-transform:uppercase; font-weight:normal; margin:0;}
.collaborator-left ul {list-style:none; margin:5px 0 5px 0; padding:0;}
.collaborator-left ul li {font-size:0.8em; line-height:1.3em; margin:5px 0; font-family:'AsapBold', Helvetica, Arial, sans-serif; text-transform:uppercase;}
.collaborator-left ul li a {color:#000; display:block}
.collaborator-left ul li a span {font-size:0.9em; font-family:'AsapRegular', Helvetica, Arial, sans-serif;}
.collaborator-right {float:right; width:480px; margin:10px 0 10px 0;}
/*------- THANKS -------*/
.thanks1 {margin:20px 20px 20px 35px; padding:0; list-style:none;}
.thanks1 li {font-size:1.1em; margin:4px; display:inline-block;}
/*------- SOCIAL SHARE -------*/
#social-share {margin:10px 0;}
/*------- CONTACT -------*/
form.contact {width:540px; margin:20px auto;}
form.contact fieldset { margin:10px 0 10px 0;}
form.contact div {clear:both; margin:10px 0; padding:0;}
form.contact legend {font-family:'AsapBold', Helvetica, Arial, sans-serif; text-transform:uppercase; font-size:1em;}
form.contact label {font-family:'AsapRegular', Helvetica, Arial, sans-serif; text-align:right; margin:5px 5px 0 20px; font-size:0.8em;}
form.contact label.info {float:right; margin:0; font-style:oblique; color:#666;}
form.contact input[type=text], form.contact input[type=email] {border:1px solid #999; width:380px; height:24px;}
form.contact textarea {border:1px solid #999; width:540px; height:120px;}
form.contact input[type=text]:focus, form.contact textarea:focus, form.contact input[type=email]:focus {border: 1px solid #555; outline: none;
-moz-box-shadow: 0 1px 4px rgba(51, 51, 51, 0.4) inset;
-webkit-box-shadow: 0 1px 4px rgba(51, 51, 51, 0.4) inset;
box-shadow: 0 1px 4px rgba(51, 51, 51, 0.4) inset;
behavior: url(/htc/pie.htc);
}
form.contact button {font-family:'AsapRegular', Helvetica, Arial, sans-serif; text-align:center; padding:6px 12px; border:none; text-transform:uppercase; font-size:0.8em; margin:10px 0 0 0; color:#000; background-color:#fff;}
form.contact button:hover {outline:none;}
form.contact button:active {text-shadow:0 1px 1px #222;}
/*------- THEMES -------*/
.themes {margin:20px;}
.themes a.subtitles {display:block; margin:0 0 10px 0;}
.themes a.subtitles h2, .themes a.subtitles h3 {font-weight:normal; line-height:1.1em;}
.themes a.subtitles h2 {font-size:1.8em; margin:0 0 5px 0;}
.themes a.subtitles h3 {font-size:0.9em; margin:2px 0 1px 2px; text-transform:uppercase;}
/*========== NUMBERS ==========*/
#social-share2 {float:right; clear:right; margin:0 10px 0 0;}
/*------- ORGANIC TABS -------*/
.hide {position:absolute; top:-9999px; left:-9999px;}
#organic-tabs .list-wrap {padding:0; margin:0 0 20px 0;}
#organic-tabs .nav {margin:0; padding:0 6px; width:216px; height:26px; background:url(/images/page-elements/tabs-background.jpg) 0 0 no-repeat;}
#organic-tabs .nav li {list-style:none; width:104px; float:left; margin:0;}
#organic-tabs .nav li.nav-two {font-family:'AsapBold', Helvetica, Arial, sans-serif;}
#organic-tabs .nav li a {display: block; height:26px; color:#000; text-align:center; text-transform:uppercase; font-size:0.7em; line-height:33px; background:url(/images/page-elements/tabs-unactive.jpg) 0 0 no-repeat;}
#organic-tabs li a.current, #organic-tabs li a.current:hover {background:url(/images/page-elements/tabs-active.jpg) 0 0 no-repeat;}
/*------- SUMMARY EDITORIAL LINKS -------*/
#editorial-links {margin:20px;}
#editorial-links a.subtitles {display:block; margin:0 0 10px 0;}
#editorial-links a.subtitles h2, #editorial-links a.subtitles h3 {font-weight:normal; line-height:1.1em;}
#editorial-links a.subtitles h2 {font-size:1.8em; margin:0 0 5px 0;}
#editorial-links a.subtitles h3 {font-size:0.9em; margin:2px 0 1px 2px; text-transform:uppercase;}
/*------- EXPO -------*/
#expo-content {width:730px; margin:0 auto 20px auto; background-color:#fff;}
#expo-scroll {width:620px; overflow:hidden; float:left; margin:0 auto;}
.slide {float:left; width:600px; padding:0 10px;}
.slide header {width:600px; text-align:center;}
.slide header h2 {margin:10px 0 0 0; line-height:1em;}
.slide header p {margin:0;}
.slide .input {text-align:center;}
.slide .input img {max-width:600px; max-height:450px;}
.slide .input iframe {width:600px; height:343px;}
.slide .input .text1 {width:500px; text-align:left; height:500px; overflow:auto; margin:0 auto 20px auto;}
.slide .secondary-text {width:600px; margin:0 auto 20px auto; text-align:left; font-size:1em;}
#expo-forward, #expo-backward {width:55px; float:left; cursor:pointer; opacity: .3; filter:alpha(opacity=30);}
#expo-backward {left:0; background:url(/images/page-elements/arrow-left.png) 5px 250px no-repeat;}
#expo-forward {right:0; background:url(/images/page-elements/arrow-right.png) 15px 250px no-repeat;}
#expo-forward:hover, #expo-backward:hover {background-color:#eee; opacity: .7; filter:alpha(opacity=70);}
#expo-pager {width:730px; text-align:center;}
#expo-pager span {font-size:40px; margin:0; padding:0; line-height:20px; display:inline-block; color:#ccc; cursor:pointer;}
.big-link {display:block; margin:10px 10px 0 20px; font-size:0.8em; line-height:1em; text-decoration:underline; text-transform:uppercase;}
/*------- TEXTO -------*/
#text-content {width:730px; margin: 0 auto 20px auto; background-color:#fff;}
.text-scroll {width:600px; height:705px; margin:10px 10px 0 10px; overflow-x:scroll; overflow-y:hidden; float:left; overflow:hidden;}
.columns {
-moz-column-gap: 10px;
-webkit-column-gap: 10px;
column-gap: 10px;
-moz-column-width: 600px;
-webkit-column-width: 600px;
column-width: 600px;
height:650px;
}
.columns, .text-pager {clear:both;}
.column *{padding:0 10px 0 0;}
.text-pager {text-align:center;
-moz-column-gap: 10px;
-webkit-column-gap: 10px;
column-gap: 10px;
-moz-column-width: 600px;
-webkit-column-width: 600px;
column-width: 600px;
height:25px;
}
.text-pager p {margin:0; font-size:0.9em;}
.text-pager p span {color:#ccc;}
body.no-csscolumns .text-pager p span {display:none;}
#text-forward, #text-backward {width:55px; height:705px; float:left; cursor:pointer;opacity: .3; filter:alpha(opacity=30);}
#text-backward {left:0; background:url(/images/page-elements/arrow-left.png) 5px 315px no-repeat;}
#text-forward {right:0; background:url(/images/page-elements/arrow-right.png) 15px 315px no-repeat;}
#text-forward:hover, #text-backward:hover {opacity: .7; filter:alpha(opacity=70); background-color:#eee;}
.text p {text-indent:1.5em; font-size:1.1em;}
.text p:first-child {text-indent:0; margin-top:0;}
.text h2 + p, .text h3 + p, .text h4 + p, .text h5 + p {text-indent:0;}
.text h2, .text h3, .text h4, .text h5 {margin:30px 0 0 0; font-family:'GandhiSerifBold', Georgia, Times New Roman, Times, serif;}
.text a {text-decoration:underline;}
/*------- COMMENTS -------*/
#comments {width:670px; margin:0 auto 20px auto; padding:20px 30px; background-color:#fff;}
#comments h3 {font-family:'AsapBold', Helvetica, Arial, sans-serif; font-size:1.4em; text-transform:uppercase; margin:0 0 10px 0;}
.comment, #paging div {margin:0 0 20px 0;}
.comment h6, #paging div h6 {font-family:'AsapBold', Helvetica, Arial, sans-serif; font-size:0.9em; margin:0 0 5px 0; font-weight:normal;}
.comment h6 span, #paging div h6 span {font-family:'AsapRegular', Helvetica, Arial, sans-serif; font-size:0.9em; color:#000;}
.comment span, #paging div span {font-family:'AsapRegular', Helvetica, Arial, sans-serif; font-size:0.8em; color:#666; margin:0;}
.comment p, #paging div p {font-size:0.9em; margin:0; padding:0;}
#comments ul {list-style:none; margin:0 auto; padding:0; width:670px;}
#comments ul li {margin:0 10px 0 0; padding:0; display:inline-block; font-family:'AsapRegular', Helvetica, Arial, sans-serif; font-size:0.8em;}
#comments form {width:670px; margin:30px auto 20px auto;}
#comments form fieldset {margin:0 0 20px 0;}
#comments form div {clear:both; margin:10px 0; padding:0;}
#comments form legend {font-family:'AsapBold', Helvetica, Arial, sans-serif; text-transform:uppercase; font-size:1em; margin:0 0 10px 0;}
#comments form label {font-family:'AsapRegular', Helvetica, Arial, sans-serif; display:inline-block; width:80px; text-align:right; margin:0; font-size:0.8em;}
#comments form input[type=text] {border:1px solid #999; width:540px; height:22px; font-size:0.8em;}
#comments form textarea {border:1px solid #999; width:540px; height:120px; font-size:0.8em;}
#comments form input[type=text]:focus, #comments form textarea:focus {border: 1px solid #555; outline: none;
-moz-box-shadow: 0 1px 4px rgba(51, 51, 51, 0.4) inset;
-webkit-box-shadow: 0 1px 4px rgba(51, 51, 51, 0.4) inset;
box-shadow: 0 1px 4px rgba(51, 51, 51, 0.4) inset;
behavior: url(/htc/pie.htc);
}
#comments form input[type=submit] {font-family:'AsapRegular', Helvetica, Arial, sans-serif; text-align:center; padding:6px 12px; border:none; text-transform:uppercase; font-size:0.8em; margin:0 0 0 85px; color:#000; background-color:#fff; cursor:pointer;}
#comments form input[type=submit]:hover {outline:none;}
#comments form input[type=submit]:active {text-shadow:0 1px 1px #222;}
#comments form input[disabled=disabled], #comments form input[disabled=disabled]:hover, #comments form input[disabled=disabled]:active {color:#ccc; cursor:auto;
-moz-box-shadow:none;
-webkit-box-shadow:none;
box-shadow:none
}
/*末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末
END OF PAGE ELEMENTS, MARGINS AND PADDINGS
末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末*/
/*---------------------------------------------------------------------------
PLUGINS
---------------------------------------------------------------------------*/
/*------- NAILTHUMB -------*/
.nailthumb-container {width:auto; height:auto; margin:0; padding:0px; overflow:hidden; position:relative;text-align:left;}
.nailthumb-container img.nailthumb-image {margin:0px; padding:0px; max-width:none; text-align:left; float:left;}
.nailthumb-container span.nailthumb-title {background: none repeat scroll 0 0 rgba(0, 0, 0, 0.5); bottom:0; color:White; display:block; font-size:9px; height:20px; left:0; margin-top:2px; line-height:20px; position:relative; text-align:center; width:100%; overflow:hidden; float:left;}
.nailthumb-container span.nailthumb-title .nailthumb-title-scroller {padding-left:2px;}
.nailthumb-container img {max-width:none; text-align:left;}
/*------- REVEAL POP UP -------*/
.reveal-modal-bg {position:fixed; height:100%; width:100%; background:#000; background:rgba(0,0,0,.8); z-index:100001; display:none; top:0; left:0;}
.reveal-modal {display:none; top:40px; left:50%; margin-left:-300px; width:520px; background:#eee; position:absolute; z-index:110000; padding:30px 40px 34px;
-moz-box-shadow:0 0 10px rgba(0,0,0,.4);
-webkit-box-shadow:0 0 10px rgba(0,0,0,.4);
box-shadow:0 0 10px rgba(0,0,0,.4);
}
.reveal-modal .close-reveal-modal {font-size:22px; line-height: .5;position: absolute; top:8px; right:11px; color:#aaa; text-shadow:0 -1px 1px rbga(0,0,0,.6); font-weight:bold; cursor:pointer;}
/*------- DROPDOWN -------*/
.dropdown-menu {position:absolute; z-index:9999999; display:none; width:300px; top:56px; right:20px;}
.dropdown-menu ul {min-width:160px; max-width:300px; list-style:none; background:#fff; border:solid 1px #ddd; border:solid 1px rgba(0, 0, 0, .2); overflow:visible; padding:4px 0; margin:0;
border-radius: 6px;
-webkit-border-radius: 6px;
-moz-border-radius: 6px;
behavior: url(/htc/pie.htc);
}
.dropdown-menu.has-tip {margin-top:8px;}
.dropdown-menu.has-tip:before {position:absolute; top:-6px; left:9px; content:''; border-left:7px solid transparent; border-right:7px solid transparent; border-bottom:7px solid #CCC; border-bottom-color:rgba(0, 0, 0, 0.2); display:block;}
.dropdown-menu.has-tip.anchor-right:before {left:auto; right:9px;}
.dropdown-menu.has-tip:after {position:absolute; top:-5px; left:10px; content:''; border-left:6px solid transparent; border-right:6px solid transparent; border-bottom:6px solid #FFF; display:block;}
.dropdown-menu.has-tip.anchor-right:after {left:auto; right:10px;}
.dropdown-menu.has-scroll ul {max-height:700px; overflow:auto;}
.dropdown-menu li {font-size:0.8em; line-height:1.3em; list-style:none; padding:0; margin:0; font-family:'AsapBold', Helvetica, Arial, sans-serif; text-transform:uppercase; max-width:300px;}
.dropdown-menu li.indent {margin:0 0 0 5px; font-size:0.8em; font-family:'AsapRegular', Helvetica, Arial, sans-serif;}
.dropdown-menu li span {font-size:0.9em; font-family:'AsapRegular', Helvetica, Arial, sans-serif;}
.dropdown-menu li > a, .dropdown-menu label {display:block; color:#000; text-decoration:none; line-height:18px; padding:3px 15px;}
.dropdown-menu li > a:hover, .dropdown-menu label:hover {color:#fff; cursor:pointer;}
.dropdown-menu .divider {height:1px; background:#E5E5E5; margin:5px 1px; overflow:hidden;}
/*------- MOTION CAPCHA -------*/
#mc p {margin:5px 0 5px 10px;font-family:'AsapRegular', Helvetica, Arial, sans-serif; font-size:0.8em;}
#mc-canvas {
margin:0 0 0 84px;
width:220px; /* For best results, set width to between 210px and 240px */
height:154px; /* For best results, set height to between 140px and 170px */
background:#fff -9999px -9999px no-repeat;
background-image: url(/images/page-elements/motionCaptcha-shapes.jpg) !important;
border:1px solid #999;
}
#mc-canvas.mc-valid {border:1px solid #0f0;}
/* The shapes: */
#mc-canvas.triangle { background-position: 10px 10px }
#mc-canvas.x { background-position:-200px 10px }
#mc-canvas.rectangle { background-position:-400px 10px }
#mc-canvas.circle { background-position:-600px 10px }
#mc-canvas.check { background-position: 10px -150px }
#mc-canvas.caret { background-position:-200px -150px }
#mc-canvas.zigzag { background-position:-400px -150px }
#mc-canvas.arrow { background-position:-600px -150px }
#mc-canvas.leftbracket { background-position: 10px -300px }
#mc-canvas.rightbracket { background-position:-200px -300px }
#mc-canvas.v { background-position:-400px -300px }
#mc-canvas.delete { background-position:-600px -300px }
#mc-canvas.leftbrace { background-position: 10px -450px }
#mc-canvas.rightbrace { background-position:-200px -450px }
#mc-canvas.star { background-position:-400px -450px }
#mc-canvas.pigtail { background-position:-600px -450px }
/* Disable mouse-selection on the page (only while user is actively drawing on the canvas): */
.mc-noselect {
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
/*末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末
END OF PLUGINS
末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末末*/
/* ==========================================================================
Helper classes
========================================================================== */
/*
* Image replacement
*/
.ir {
background-color: transparent;
border: 0;
overflow: hidden;
/* IE 6/7 fallback */
*text-indent: -9999px;
}
.ir:before {
content: "";
display: block;
width: 0;
height: 100%;
}
/*
* Hide from both screenreaders and browsers: h5bp.com/u
*/
.hidden {
display: none !important;
visibility: hidden;
}
/*
* Hide only visually, but have it available for screenreaders: h5bp.com/v
*/
.visuallyhidden {
border: 0;
clip: rect(0 0 0 0);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute;
width: 1px;
}
/*
* Extends the .visuallyhidden class to allow the element to be focusable
* when navigated to via the keyboard: h5bp.com/p
*/
.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
clip: auto;
height: auto;
margin: 0;
overflow: visible;
position: static;
width: auto;
}
/*
* Hide visually and from screenreaders, but maintain layout
*/
.invisible {
visibility: hidden;
}
/*
* Clearfix: contain floats
*
* For modern browsers
* 1. The space content is one way to avoid an Opera bug when the
* `contenteditable` attribute is included anywhere else in the document.
* Otherwise it causes space to appear at the top and bottom of elements
* that receive the `clearfix` class.
* 2. The use of `table` rather than `block` is only necessary if using
* `:before` to contain the top-margins of child elements.
*/
.clearfix:before,
.clearfix:after {
content: " "; /* 1 */
display: table; /* 2 */
}
.clearfix:after {
clear: both;
}
/*
* For IE 6/7 only
* Include this rule to trigger hasLayout and contain floats.
*/
.clearfix {
*zoom: 1;
}
/* ==========================================================================
Media Queries for Responsive Design.
========================================================================== */
@media only screen and (min-width: 1201px) and (max-width : 1400px) {
/*------- TOP INFO -------*/
.expo #top-info {width:910px;}
.expo #number-date {width:910px;}
/*------- CONTENT -------*/
.expo #content {width:930px;}
/*------- EXPO -------*/
#expo-content, #expo-pager {width:930px;}
#expo-scroll {width:820px;}
.slide {width:800px;}
.slide header {width:800px;}
.slide .input .text1 {height:650px;}
.slide .input img {max-width:800px; max-height:600px;}
.slide .input iframe {width:800px; height:457px;}
/*------- COMMENTS -------*/
.expo #comments {width:870px;}
.expo .comment, .expo #paging div {width:670px; margin:0 auto 20px auto;}
/*------- FOOTER -------*/
.expo .page-footer {width:930px;}
}
@media only screen and (min-width: 1401px) {
/*------- TOP INFO -------*/
.expo #top-info {width:1110px;}
.expo #number-date {width:1110px;}
/*------- CONTENT -------*/
.expo #content {width:1130px;}
/*------- EXPO -------*/
#expo-content, #expo-pager {width:1130px;}
#expo-scroll {width:1020px;}
.slide {width:1000px;}
.slide header {width:1000px;}
.slide .input .text1 {height:800px;}
.slide .input img {max-width:1000px; max-height:750px;}
.slide .input iframe {width:1000px; height:571px;}
/*------- COMMENTS -------*/
.expo #comments {width:1070px;}
.expo .comment, .expo #paging div {width:670px; margin:0 auto 20px auto;}
/*------- FOOTER -------*/
.expo .page-footer {width:1130px;}
}
/*--------------------------------------------------------
TABLET PORTRAIT
--------------------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 991px) {
/*------- HIDDENS -------*/
#organic-tabs, .nav1 {display: none !important; visibility: hidden;}
/*------- TEXT -------*/
.text1, .text11 {margin:0 0 10px 0;}
.text1 p {font-size:1em; line-height:1.5em; margin:0 20px 10px 20px; text-indent:20px;}
.text1 ul li {font-size:1em; line-height:1.5em; margin:10px 20px;}
.text1 p:first-child {margin:10px 20px; text-indent:0;}
.text11 p {font-size:1em; line-height:1.4em; margin:0 20px 10px 10px;}
.text1 a, .text11 a {text-decoration:underline;}
/*------- WRAP -------*/
#wrap {min-width:768px;}
/*------- COLUMN LEFT > SMART STRIP -------*/
#column-left {display:block; margin:0; float:none; width:100%; height:56px; position:fixed; top:0;}
#column-left #logo {float:left; padding:0; margin:0 0 0 25px;}
#column-left #logo a img {height:50px; width:auto; margin:3px 0 0 0;}
.nav3-button {display:block !important; visibility:visible; float:right; margin:14px 25px 0 0; font-family:'AsapBold', Helvetica, Arial, sans-serif; text-transform:uppercase; width:100px; height:28px; line-height:30px; font-size:0.8em; text-indent:36px; background:url(/images/page-elements/smart-menu.png) 6px 7px no-repeat;
border-radius:3px;
-webkit-border-radius:3px;
-moz-border-radius:3px;
behavior: url(/htc/pie.htc);
}
/*------- COLUMN RIGHT -------*/
#content-wrap {margin:76px auto 0 auto; min-width:730px;}
}
/*--------------------------------------------------------
SMARTPHONE LANDSCAPE
--------------------------------------------------------*/
@media only screen and (min-width: 481px) and (max-width: 768px) {
/*------- HIDDENS -------*/
#organic-tabs, .nav1, #social-share, #social-share2, #social-links {display: none !important; visibility: hidden;}
/*------- TITLES -------*/
.title1 {font-size:1.4em;}
.title-cover {font-size:1.4em;}
/*------- SUBTITLES -------*/
.subtitle1 {font-size:0.9em; line-height:1.2em;}
.subtitle2 {font-size:0.8em; line-height:1em;}
.subtitle-cover {font-size:0.9em; line-height:1.1em;}
/*------- TEXT -------*/
.text1 p {font-size:0.9em; line-height:1.5em; text-indent:15px;}
.text1 ul {padding:0; margin:0 10px 10px 31px;}
.text1 ul li {font-size:0.9em; line-height:1.5em; margin:10px;}
.text11 p {font-size:0.9em; line-height:1.5em; margin:0 10px 10px 10px;}
/*------- WRAP -------*/
#wrap {min-width:480px;}
/*------- COLUMN LEFT > SMART STRIP -------*/
#column-left {display:block; margin:0; float:none; width:100%; height:40px; position:fixed; top:0;}
#column-left #logo {float:left; padding:0; margin:0 0 0 10px;}
#column-left #logo a img {height:auto; width:100px; margin:4px 0 0 0;}
.nav3-button {display:block !important; visibility:visible; float:right; margin:10px 10px 0 0; font-family:'AsapBold', Helvetica, Arial, sans-serif; text-transform:uppercase; width:80px; height:20px; line-height:24px; font-size:0.7em; text-indent:24px; background:url(/images/page-elements/smartphone-menu.png) 4px 6px no-repeat;
border-radius:3px;
-webkit-border-radius:3px;
-moz-border-radius:3px;
behavior: url(/htc/pie.htc);
}
.style1 .dropdown-open,
.style1 .nav3-button:hover {background:url(/images/page-elements/smartphone-menu1.png) 4px 6px no-repeat;}
.style2 .dropdown-open,
.style2 .nav3-button:hover {background:url(/images/page-elements/smartphone-menu2.png) 4px 6px no-repeat;}
.style3 .dropdown-open,
.style3 .nav3-button:hover {background:url(/images/page-elements/smartphone-menu3.png) 4px 6px no-repeat;}
.style4 .dropdown-open,
.style4 .nav3-button:hover {background:url(/images/page-elements/smartphone-menu4.png) 4px 6px no-repeat;}
.dropdown-menu {width:300px; top:40px; right:10px;} /*potser s'ha de fer m駸 ample*/
/*------- COLUMN RIGHT -------*/
#content-wrap {margin:60px auto 0 auto; min-width:480px;}
/*------- TOP INFO -------*/
#top-info {width:440px;}
#number-date {font-size:0.7em; width:460px; height:auto; margin:5px 0 10px 0; line-height:1em;}
#top-info ul {margin:8px 0 3px 15px;}
#top-info ul li {font-size:0.6em;margin:0 2px;}
/*------- CONTENT -------*/
#content {width:460px;}
#content header a.back {margin:0 20px 0 10px; font-size:0.7em; display:block; width:440px; float:none; text-align:right;}
/*------- FOOTER -------*/
.page-footer {margin:0 auto; width:460px; height:294px;}
.page-footer div.right {float:left; width:440px;}
.page-footer div.right ul li a img {width:140px;}
/*------- COVER -------*/
#cover a {width:440px;}
#cover img {width:440px;}
#cover a.subtitles {margin:0 0 15px 0;}
#cover a.subtitles h2 {font-size:1.2em;}
#cover a.subtitles h3 {font-size:0.8em;}
/*------- COLLABORATORS / PREVIOUS NUMBERS -------*/
.collaborators a,
.previous-numbers a {width:215px; margin:0 0 10px 10px; height:265px; float:left;}
.collaborators a div,
.previous-numbers a div {width:215px; height:215px;}
.collaborators a div img,
.previous-numbers a div img {min-width:215px; min-height:215px;}
/*------- COLLABORATOR -------*/
.collaborator-left {width:215px;}
.collaborator-left img {width:215px;}
.collaborator-right {width:215px; margin:12px 15px 10px 0;}
/*------- CONTACT -------*/
form.contact {width:420px;}
form.contact input[type=text], form.contact input[type=email] {width:410px; height:22px; font-size:0.8em;}
form.contact textarea {width:410px; height:200px; font-size:0.8em;}
/*------- THEMES -------*/
.themes a.subtitles {margin:0 0 15px 0;}
.themes a.subtitles h2 {font-size:1.2em;}
.themes a.subtitles h3 {font-size:0.8em;}
/*========== NUMBERS ==========*/
/*------- SUMMARY EDITORIAL LINKS -------*/
#editorial-links a.subtitles {margin:0 0 15px 0;}
#editorial-links a.subtitles h2 {font-size:1.2em;}
#editorial-links a.subtitles h3 {font-size:0.8em;}
/*------- EXPO -------*/
#expo-content, #expo-pager {width:460px;}
#expo-pager span {font-size:20px; line-height:10px;}
#expo-scroll {width:420px;}
.slide {width:400px;}
.slide header {width:400px;}
.slide header h2 {margin:10px 0 0 0; font-size:1em; line-height:1em;}
.slide header p {font-size:0.8em;}
.slide .input img {max-width:400px; max-height:300px;}
.slide .input iframe {width:400px; height:228px;}
.slide .input .text1 {width:400px; font-size:0.9em; line-height:1.5em;}
.slide .secondary-text {width:400px; font-size:0.9em; line-height:1.5em;}
#expo-forward, #expo-backward {width:20px;}
#expo-backward {left:0; background:url(/images/page-elements/arrow-left-20.png) 0 20px no-repeat;}
#expo-forward {right:0; background:url(/images/page-elements/arrow-right-20.png) 0 20px no-repeat;}
.big-link {float:none; display:block; margin:0 10px 0 10px; font-size:0.7em; line-height:1em; width:440px; text-align:right;}
/*------- TEXTO -------*/
#text-forward, #text-backward, .text-pager {display:none; visibility:hidden;}
#text-content {width:460px;}
.text-scroll {width:420px; height:auto; margin:20px; overflow-x:auto; overflow-y:auto; float:none;}
.columns {margin:0; padding:0;
-moz-column-count:1;
-webkit-column-count:1;
column-count:1;
-moz-column-gap:0;
-webkit-column-gap:0;
column-gap:0;
-moz-column-width:none;
-webkit-column-width:none;
column-width:none;
height:auto;
}
.column *{padding:0;}
.text p {text-indent:1.2em; font-size:0.9em; line-height:1.5em;}
.text h2 {font-size:1.2em;}
.text h3 {font-size:1.15em;}
.text h4 {font-size:1.1em;}
.text h5 {font-size:1em;}
/*------- COMMENTS -------*/
#comments {width:420px; padding:20px;}
#comments h3 {font-size:1.3em;}
#comments ul {width:420px;}
#comments form {width:420px;}
#comments form input[type=text] {width:415px; height:22px; font-size:0.8em;}
#comments form textarea {width:415px; height:120px; font-size:0.8em;}
#comments form input[type=submit] {font-size:0.8em;}
/*------- TEXTO DE SALA -------*/
.reveal-modal {top:40px; left:50%; margin-left:-180px; width:320px; padding:20px;}
.reveal-modal p {font-size:0.8em; line-height:1.5em;}
}
/*--------------------------------------------------------
SMARTPHONE PORTRAIT
--------------------------------------------------------*/
@media only screen and (max-width: 480px) {
/*------- HIDDENS -------*/
#organic-tabs, .nav1, #social-share, #social-share2, #social-links {display: none !important; visibility: hidden;}
/*------- TITLES -------*/
.title1 {font-size:1.4em;}
.title-cover {font-size:1.4em;}
/*------- SUBTITLES -------*/
.subtitle1 {font-size:0.9em; line-height:1.2em;}
.subtitle2 {font-size:0.8em; line-height:1em;}
.subtitle-cover {font-size:0.9em; line-height:1.1em;}
/*------- TEXT -------*/
.text1 p {font-size:0.9em; line-height:1.5em; text-indent:15px;}
.text1 ul {padding:0; margin:0 10px 10px 31px;}
.text1 ul li {font-size:0.9em; line-height:1.5em; margin:10px;}
.text11 p {font-size:0.9em; line-height:1.5em; margin:0 10px 10px 10px;}
/*------- WRAP -------*/
#wrap {min-width:320px;}
/*------- COLUMN LEFT > SMART STRIP -------*/
#column-left {display:block; margin:0; float:none; width:100%; height:40px; position:fixed; top:0;}
#column-left #logo {float:left; padding:0; margin:0 0 0 10px;}
#column-left #logo a img {height:auto; width:100px; margin:4px 0 0 0;}
.nav3-button {display:block !important; visibility:visible; float:right; margin:10px 10px 0 0; font-family:'AsapBold', Helvetica, Arial, sans-serif; text-transform:uppercase; width:80px; height:20px; line-height:24px; font-size:0.7em; text-indent:24px; background:url(/images/page-elements/smartphone-menu.png) 4px 6px no-repeat;
border-radius:3px;
-webkit-border-radius:3px;
-moz-border-radius:3px;
behavior: url(/htc/pie.htc);
}
.style1 .dropdown-open,
.style1 .nav3-button:hover {background:url(/images/page-elements/smartphone-menu1.png) 4px 6px no-repeat;}
.style2 .dropdown-open,
.style2 .nav3-button:hover {background:url(/images/page-elements/smartphone-menu2.png) 4px 6px no-repeat;}
.style3 .dropdown-open,
.style3 .nav3-button:hover {background:url(/images/page-elements/smartphone-menu3.png) 4px 6px no-repeat;}
.style4 .dropdown-open,
.style4 .nav3-button:hover {background:url(/images/page-elements/smartphone-menu4.png) 4px 6px no-repeat;}
.dropdown-menu {width:300px; top:40px; right:10px;}
/*------- COLUMN RIGHT -------*/
#content-wrap {margin:60px auto 0 auto; min-width:320px;}
/*------- TOP INFO -------*/
#top-info {width:280px;}
#number-date {font-size:0.7em; width:280px; height:auto; margin:5px 0 10px 0; line-height:1em;}
#top-info ul {margin:8px 0 3px 15px;}
#top-info ul li {font-size:0.6em; margin:0 2px;}
/*------- CONTENT -------*/
#content {width:300px;}
#content header a.back {margin:0 20px 0 10px; font-size:0.7em; display:block; width:280px; float:none; text-align:right;}
/*------- FOOTER ------- */
.page-footer {margin:0 auto; width:300px; height:270px;}
.page-footer div.right {float:left; width:280px;}
.page-footer div.right ul li a img {width:90px;}
/*------- COVER -------*/
#cover a {width:280px;}
#cover img {width:280px;}
#cover a.subtitles {margin:0 0 15px 0;}
#cover a.subtitles h2 {font-size:1.2em;}
#cover a.subtitles h3 {font-size:0.8em;}
/*------- COLLABORATORS / PREVIOUS NUMBERS -------*/
.collaborators a,
.previous-numbers a {width:260px; margin:0 0 10px 20px; height:295px; float:none;}
.collaborators a div,
.previous-numbers a div {width:260px; height:260px;}
.collaborators a div img,
.previous-numbers a div img {min-width:260px; min-height:260px;}
/*------- COLLABORATOR -------*/
.collaborator-left {width:280px;}
.collaborator-left img {width:280px;}
.collaborator-right {width:280px; float:none;}
/*------- CONTACT -------*/
form.contact {width:280px;}
form.contact input[type=text], form.contact input[type=email] {width:270px; height:22px; font-size:0.8em;}
form.contact textarea {width:270px; font-size:0.8em;}
/*------- THEMES -------*/
.themes a.subtitles {margin:0 0 15px 0;}
.themes a.subtitles h2 {font-size:1.2em;}
.themes a.subtitles h3 {font-size:0.8em;}
/*========== NUMBERS ==========*/
/*------- SUMMARY EDITORIAL LINKS -------*/
#editorial-links a.subtitles {margin:0 0 15px 0;}
#editorial-links a.subtitles h2 {font-size:1.2em;}
#editorial-links a.subtitles h3 {font-size:0.8em;}
/*------- EXPO -------*/
#expo-content, #expo-pager {width:300px;}
#expo-pager span {font-size:20px; line-height:10px;}
#expo-scroll {width:260px;}
.slide {width:240px;}
.slide header {width:240px;}
.slide header h2 {margin:5px 0 0 0; font-size:1em; line-height:1em;}
.slide header p {font-size:0.8em;}
.slide .input img {max-width:240px; max-height:180px;}
.slide .input iframe {width:240px; height:137px;}
.slide .input .text1 {width:240px; font-size:0.9em; line-height:1.5em;}
.slide .secondary-text {width:240px; font-size:0.9em; line-height:1.5em;}
#expo-forward, #expo-backward {width:20px;}
#expo-backward {left:0; background:url(/images/page-elements/arrow-left-20.png) 0 20px no-repeat;}
#expo-forward {right:0; background:url(/images/page-elements/arrow-right-20.png) 0 20px no-repeat;}
.big-link {float:none; display:block; margin:0 10px 0 10px; font-size:0.7em; line-height:1em; width:280px; text-align:right;}
/*------- TEXTO -------*/
#text-forward, #text-backward, .text-pager {display:none; visibility:hidden;}
#text-content {width:300px;}
.text-scroll {width:260px; height:auto; margin:20px; overflow-x:auto; overflow-y:auto; float:none;}
.columns {margin:0; padding:0;
-moz-column-count:1;
-webkit-column-count:1;
column-count:1;
-moz-column-gap:0;
-webkit-column-gap:0;
column-gap:0;
-moz-column-width:none;
-webkit-column-width:none;
column-width:none;
height:auto;
}
.column *{padding:0;}
.text p {text-indent:1.2em; font-size:0.9em; line-height:1.5em;}
.text h2 {font-size:1.2em;}
.text h3 {font-size:1.15em;}
.text h4 {font-size:1.1em;}
.text h5 {font-size:1em;}
/*------- COMMENTS -------*/
#comments {width:260px; padding:20px;}
#comments h3 {font-size:1.3em;}
#comments ul {width:260px;}
#comments form {width:260px;}
#comments form input[type=text] {width:260px; height:22px; font-size:0.8em;}
#comments form textarea {width:258px; height:120px; font-size:0.8em;}
#comments form input[type=submit] {font-size:0.8em;}
#mc p {margin:5px 0 5px 0;}
#mc-canvas {margin:0;}
/*------- TEXTO DE SALA -------*/
.reveal-modal {top:40px; left:50%; margin-left:-140px; width:240px; padding:20px;}
.reveal-modal p {font-size:0.8em; line-height:1.5em;}
}
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 144dpi) {
/* Style adjustments for high resolution devices */
}
/* ==========================================================================
Print styles.
Inlined to avoid required HTTP connection: h5bp.com/r
========================================================================== */
@media print {
* {
background: transparent !important;
color: #000 !important; /* Black prints faster: h5bp.com/s */
box-shadow:none !important;
text-shadow: none !important;
}
a,
a:visited {
text-decoration: underline;
}
a[href]:after {
content: " (" attr(href) ")";
}
abbr[title]:after {
content: " (" attr(title) ")";
}
/*
* Don't show links for images, or javascript/internal links
*/
.ir a:after,
a[href^="javascript:"]:after,
a[href^="#"]:after {
content: "";
}
pre,
blockquote {
border: 1px solid #999;
page-break-inside: avoid;
}
thead {
display: table-header-group; /* h5bp.com/t */
}
tr,
img {
page-break-inside: avoid;
}
img {
max-width: 100% !important;
}
@page {
margin: 0.5cm;
}
p,
h2,
h3 {
orphans: 3;
widows: 3;
}
h2,
h3 {
page-break-after: avoid;
}
}