/* Theme Name: Martin Version: 2.0.1 Author: Martin sarsini Author URI: http://sarsini.it/ */ /* Begin Typography & Colors */ * { margin: 0; padding: 0; } header, nav, footer, section, aside, article, figure { display: block } body { font-size: 100%; font-family: Frutiger, "Frutiger Linotype", Univers, Calibri, "Gill Sans", "Gill Sans MT", "Myriad Pro", Myriad, "DejaVu Sans Condensed", "Liberation Sans", "Nimbus Sans L", Tahoma, Geneva, "Helvetica Neue", Helvetica, Arial, sans-serif; line-height: 1.5em; background-color: #fff; color: #180f1b; text-align: center; } #head-menu { width: 100%; border-top: 5px solid #54d85b; background-color: #fff; position: fixed; top: 0; left: 0; z-index: 1000; padding-bottom: 5px; text-align: center; height: 65px; } #head-menu * { z-index: 1000; } #head-area { width: 960px; margin: 0 auto; } #head-area h1 { padding: 0; margin: 0; margin-top: 15px; font-size: 2em; text-align: center; width: 245px; float: left; } #head-area h1 a { background: #fff url('images/msarsini-h1.png') no-repeat; width: 245px; height: 40px; display: block; text-indent: -9999px; } #head-menu ul { float: right; list-style: none; text-align: right; height: 55px; } #head-menu ul li { font-size: 1.1em; display: block; float: left; height: 55px; margin: 0; margin-left: 30px; padding: 0; } #head-menu ul li a, #head-menu ul li a:link, #head-menu ul li a:visited { color: #180f1b; padding: 25px 5px 12px 5px; line-height: 400%; outline: none; -moz-border-radius-bottomleft: 2px; -webkit-border-bottom-left-radius: 2px; -moz-border-radius-bottomright: 2px; -webkit-border-bottom-right-radius: 2px; } #head-menu ul li.current a { background-color: #54d85b; color: #fff } #bigheader, #about-me, #projects, #blog-preview, #contact, #footer, #wrapper { width: 960px; margin: 0 auto; margin-bottom: 40px; text-align: left; } #wrapper { margin-top: 120px; } #fakediv { top: 119px; position: relative; } #bigheader { margin-top: 119px; border-bottom: 1px solid #f3f0e5; } #bigheader h1 { padding: 0; margin: 0; font-size: 2em; text-align: center; width: 607px; float: left; } #bigheader h1 a { display: block; width: 607px; height: 99px; background: #fff url('images/leerraum-landschaft.jpg') no-repeat; text-indent: -9999px; } #bigheader p { vertical-align: bottom; display: block; text-align: left; margin: 0 0 0 637px; padding: 54px 0 20px 0; } #bigheader p strong { font-weight: normal; text-decoration: italic; } #about-me { margin-top: 80px; } #about-me div, #about-me p.ritratto { height: 183px; } #about-me div { text-align: left; float: right; width: 710px; border-bottom: 1px solid #f3f0e5; overflow: none; } #about-me p.ritratto { width: 217px;; background: url('images/ritratto-bg.png') no-repeat top left; float: left; border-bottom: none; } #about-me p.ritratto img{ margin: 15px 0 0 16px; } #about-me:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } #projects { border-bottom: 1px solid #f3f0e5; margin-top: 80px; } #projects h2 { } #projects h4 { margin: 10px 0 10px 0; } #projects ul { } #projects ul li img { border: 1px solid #f3f0e5; padding: 1px; } #identity-area { margin: 0; width: 629px; text-align: right; /* border-bottom: 1px solid #d1d1d1; */ margin-left: 331px; } #identity-area h1 { padding: 0; margin: 0; font-size: 2em; text-align: center; } #identity-area h1 a { display: block; width: 629px; height: 103px; background: #fff url('images/leerraum-landschaft.jpg') no-repeat; text-indent: -9999px; } #identity-area em { color: #7a7a7a; font-style: normal; font-size: 1.5em; margin: 10px 0; display: block; } #contact { border-bottom: 1px solid #f3f0e5; margin-top: 80px; } #contact-form { width: 465px; float: left; } #contacts-other { width: 465px; margin-left: 495px; } #contact h3 { margin: 0 0 10px 0; } #contact p { margin: 0 0 20px 0; } #contact form { } #contact form, #contact form fieldset { border: none; text-align: left; } #contact form fieldset { background-color: #f3f0e5; padding: 20px 20px 0 20px; } #contact form fieldset div { margin: 0 0 20px 0; } #contact form fieldset label { display: block; color: #180f1b; } #contact form fieldset input, #contact form fieldset select, #contact form fieldset textarea { font-size: 1.1em; border: 1px solid #d1d1d1; color: #180f1b; padding: 3px; width: 98%; } #contact form fieldset input.input-error, #contact form fieldset select.input-error, #contact form fieldset textarea.input-error { border: 1px solid red; } #contact form .submitdiv { text-align: right; } .sent-ok { font-weight: bold; color: #49d550; } #contact form input#submitenquiry { background-color: #49d550; color: #000; padding: 4px; text-align: center !important; border: none; margin: 20px 0; font-size: 1em; text-align: right; -moz-border-radius: 2px; -webkit-border-radius: 2px; cursor: pointer; } h1, h2, h3 { font-weight: normal; text-align: left; } h3 { font-size: 1.3em; padding: 0; margin: 30px 0 0; font-weight: bold; } h4 { text-align: left; font-size: 1.1em; } p { text-align: left; } p.prosegui-lettura { text-align: right; margin-bottom: 20px; } p.consiglia { margin: 20px 0 } a.cottoned, a.cottoned:link, a.cottoned:visited { background-color: #49d550; color: #000; padding: 2px; -moz-border-radius: 2px; -webkit-border-radius: 2px; } #flickrrss { width: 262px; margin-bottom: 28px !important; } #flickrrss img { margin-right: 12px; margin-bottom: 12px; } .entry p { margin-bottom: 10px; } .narrowcolumn .postmetadata { text-align: center; } .thread-alt { background-color: #f8f8f8; } .thread-even { background-color: white; } .depth-1 { border: 1px solid #ddd; } .even, .alt { border-left: 1px solid #ddd; } small { font-size: 0.9em; line-height: 1.5em; } h2 { font-size: 2em; margin-bottom: 20px; } h2.pagetitle { font-size: 1.6em; } #sidebar h2 { font-size: 1.2em; } .widgettitle { margin-bottom: 5px !important; } h2, h2 a, h2 a:visited, h3, h3 a, h3 a:visited { color: #180f1b; } small.post-time { color: #7a7a7a; font-weight: bold; } .entry { margin-top: 15px; } h2, h2 a, h2 a:hover, h2 a:visited, h3, h3 a, h3 a:hover, h3 a:visited, #sidebar h2, #wp-calendar caption, cite { text-decoration: none; } .commentlist li, #commentform input, #commentform textarea { } .commentlist li ul li { font-size: 1em; } .commentlist li { font-weight: bold; } .commentlist li .avatar { float: right; border: 1px solid #eee; padding: 2px; background: #fff; } .commentlist cite, .commentlist cite a { font-weight: bold; font-style: normal; font-size: 1.1em; } .commentlist p { font-weight: normal; line-height: 1.5em; text-transform: none; } #commentform p { } .commentmetadata { font-weight: normal; } #sidebar { } small, #sidebar ul ul li, #sidebar ul ol li, .nocomments, .postmetadata, blockquote, strike { color: #777; } code { font: 1.1em 'Courier New', Courier, Fixed; } acronym, abbr, span.caps { font-size: 0.9em; letter-spacing: .07em; } a, h2 a:hover, h3 a:hover { color: #06c; text-decoration: none; } a:hover { color: #147; text-decoration: underline; } /* End Typography & Colors */ .post { margin: 0 0 40px 0; text-align: left; border-bottom: 1px solid #d1d1d1; padding-bottom: 40px; } #post-2 h2, #post-434 h2 { margin-top: 40px; } #post-2 ul, #post-434 ul { list-style: none; } #post-2 li, #post-434 li { clear: left; margin-left: 0 } #post-2 li em, #post-434 li em { width: 220px; display: block; float: left; margin-right: 20px; } #blog-preview { border-bottom: 1px solid #f3f0e5; margin-top: 80px; color: #393939; } #blog-preview ul { list-style: none; } #blog-preview ul li.post { border: none; margin: 0 20px 20px 0; padding: 0 0 0 0; height: 100px; width: 225px; float: left; } #blog-preview ul li.odd { margin: 0 0 20px 0; } #blog-preview ul li.post small { font-size: .8em } .post h3 { margin: 20px 0; } .post hr { display: block; } .widecolumn .post { margin: 0; } .narrowcolumn .postmetadata { padding-top: 5px; } .widecolumn .postmetadata { margin: 30px 0; } .widecolumn .smallattachment { text-align: center; float: left; width: 128px; margin: 5px 5px 5px 0px; } .widecolumn .attachment { text-align: center; margin: 5px 0px; } .postmetadata { clear: both; } .clear { clear: both; } #footer { clear: left; } #footer p { margin: 0; padding: 20px 0; text-align: left; } /* End Structure */ /* Begin Headers */ h2 { line-height: 1.2em; } h2.pagetitle { margin-top: 30px; } #sidebar h2 { margin: 5px 0 0; padding: 0; } h3.comments { padding: 0; margin: 40px auto 20px ; } /* End Headers */ /* Begin Images */ p img { padding: 0; max-width: 100%; } /* Using 'class="alignright"' on an image will (who would've thought?!) align the image to the right. And using 'class="centered', will of course center the image. This is much better than using align="center", being much more futureproof (and valid) */ img.centered { display: block; margin-left: auto; margin-right: auto; } img.alignright { padding: 4px; margin: 0 0 2px 7px; display: inline; } img.alignleft { padding: 4px; margin: 0 7px 2px 0; display: inline; } .alignright { float: right; } .alignleft { float: left } /* End Images */ /* Begin Lists Special stylized non-IE bullets Do not work in Internet Explorer, which merely default to normal bullets. */ html>body .entry ul { margin-left: 0px; padding: 0 0 0 0px; } html>body .entry li { margin: 7px 0 8px 10px; } .entry ul li:before, #sidebar ul ul li:before { /* content: "\00BB \0020"; */ } .entry ol { padding: 0 0 0 35px; margin: 0; } .entry ol li { margin: 0; padding: 0; } .postmetadata ul, .postmetadata li { display: inline; list-style-type: none; list-style-image: none; } #sidebar ul, #sidebar ul ol { margin: 0; padding: 0; } #sidebar ul li { list-style-type: none; list-style-image: none; margin-bottom: 40px; } #sidebar ul p, #sidebar ul select { margin: 5px 0 8px; } #sidebar ul ul, #sidebar ul ol { margin: 5px 0 0 0; } #sidebar ul ul ul, #sidebar ul ol { margin: 0 0 0 10px; } ol li, #sidebar ul ol li { list-style: decimal outside; } #sidebar ul ul li, #sidebar ul ol li { margin: 3px 0 0; padding: 0; } /* End Entry Lists */ /* Begin Form Elements */ #searchform { text-align: left; } #sidebar #searchform #s { width: 200px; padding: 2px; margin-right: 3px; } #sidebar #searchform #searchsubmit, .wpcf7-form #submit-message input { color: #fff; background-color: #1996d7; border: none; text-transform: uppercase; font-weight: bold; -moz-border-radius: 3px; -webkit-border-radius: 3px; border: 1px solid #fff; } #sidebar #searchform #searchsubmit { width: 35px; } .wpcf7-form #submit-message input { margin-left: 155px; width: 150px; height: 40px; } .wpcf7-form-control-wrap { display: block; } #sidebar #searchsubmit { padding: 1px; } #twitter-1 { } ul.twitter { margin: 0px !important; } ul.twitter li.twitter-item { margin-bottom: 10px !important; border-bottom: 1px solid #d1d1d1; padding-bottom: 10px !important; } .entry form { /* This is mainly for password protected posts, makes them look better. */ text-align:center; } select { width: 130px; } #commentform input { width: 170px; padding: 2px; margin: 5px 5px 1px 0; } #commentform { margin: 5px 10px 0 0; } #commentform textarea { width: 100%; padding: 2px; } #respond:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } #commentform #submit { margin: 0 0 5px auto; float: right; } /* End Form Elements */ /* Begin Comments*/ .alt { margin: 0; padding: 10px; } .commentlist { padding: 0; text-align: left; } .commentlist li { margin: 15px 0 10px; padding: 5px 5px 10px 10px; list-style: none; } .commentlist li ul li { margin-right: -5px; margin-left: 10px; } .commentlist p { margin: 10px 5px 10px 0; } .children { padding: 0; } #commentform p { margin: 5px 0; } .nocomments { text-align: center; margin: 0; padding: 0; } .commentmetadata { margin: 0; display: block; } /* End Comments */ #content { width: 690px; float: left; margin-left: 0px; } .widecolumn { margin-left: 0 !important; } /* Begin Sidebar */ #sidebar { width: 250px; margin-left: 710px; } #sidebar form { margin: 0; } /* End Sidebar */ /* Begin Various Tags & Classes */ acronym, abbr, span.caps { cursor: help; } acronym, abbr { border-bottom: 1px dashed #999; } blockquote { margin: 15px 30px 0 10px; padding-left: 20px; border-left: 5px solid #ddd; } blockquote cite { margin: 5px 0 0; display: block; } .center { text-align: center; } .hidden { display: none; } hr { display: none; } a img { border: none; } .navigation { display: block; text-align: center; margin-top: 10px; margin-bottom: 60px; } /* End Various Tags & Classes*/ /* Captions */ .aligncenter, div.aligncenter { display: block; margin-left: auto; margin-right: auto; } .wp-caption { border: 1px solid #ddd; text-align: center; background-color: #f3f3f3; padding-top: 4px; margin: 10px; -moz-border-radius: 3px; -khtml-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; } .wp-caption img { margin: 0; padding: 0; border: 0 none; } .wp-caption p.wp-caption-text { font-size: 11px; line-height: 17px; padding: 0 4px 5px; margin: 0; } /** * This <div> element is wrapped by jCarousel around the list * and has the classname "jcarousel-container". */ .jcarousel-container { position: relative; } .jcarousel-clip { z-index: 2; padding: 0; margin: 0; overflow: hidden; position: relative; } .jcarousel-list { z-index: 1; overflow: hidden; position: relative; top: 0; left: 0; margin: 0; padding: 0; } .jcarousel-list li, .jcarousel-item { float: left; list-style: none; /* We set the width/height explicitly. No width/height causes infinite loops. */ width: 75px; height: 75px; } /** * The buttons are added dynamically by jCarousel before * the <ul> list (inside the <div> described above) and * have the classnames "jcarousel-next" and "jcarousel-prev". */ .jcarousel-next { z-index: 3; display: none; } .jcarousel-prev { z-index: 3; display: none; } .jcarousel-skin-tango .jcarousel-container { padding: 0 0 0 0; } .jcarousel-skin-tango .jcarousel-container-vertical { width: 960px; height: 355px; } .jcarousel-skin-tango .jcarousel-clip-vertical { width: 960px; height: 355px; } .jcarousel-skin-tango .jcarousel-item { width: 216px; height: 355px; overflow: hidden; } .jcarousel-skin-tango .jcarousel-item-vertical { margin-bottom: 10px; margin-right: 32px; } .jcarousel-skin-tango .first-row { margin-right: 0; } .jcarousel-skin-tango .jcarousel-item-placeholder { background: #fff; color: #000; } /** * Vertical Buttons */ .jcarousel-skin-tango .jcarousel-next-vertical { position: absolute; bottom: 0px; left: 0px; width: 100%; height: 80px; cursor: pointer; background: #49d550 url('./images/freccia-down.png') no-repeat center center; opacity: 0.0; /* Standard CSS3 opacity setting */ -moz-opacity: 0.0; /* Opacity for really old versions of Mozilla Firefox (0.9 or older) */ filter:alpha(opacity=0); } .jcarousel-skin-tango .jcarousel-next-vertical:hover { /* background-position: 0 -32px; */ background: #49d550 url('./images/freccia-down.png') no-repeat center center; opacity: 0.50; /* Standard CSS3 opacity setting */ -moz-opacity: 0.50; /* Opacity for really old versions of Mozilla Firefox (0.9 or older) */ filter:alpha(opacity=50); } .jcarousel-skin-tango .jcarousel-next-vertical:active { /* background-position: 0 -64px; */ } .jcarousel-skin-tango .jcarousel-next-disabled-vertical, .jcarousel-skin-tango .jcarousel-next-disabled-vertical:hover, .jcarousel-skin-tango .jcarousel-next-disabled-vertical:active { cursor: default; background-image: none; background-color: inherit; } .jcarousel-skin-tango .jcarousel-prev-vertical { position: absolute; top: -20px; left: 0px; width: 100%; height: 23px; cursor: pointer; background: #49d550 url('./images/freccia-up.png') no-repeat center center; opacity: 0.0; /* Standard CSS3 opacity setting */ -moz-opacity: 0.0; /* Opacity for really old versions of Mozilla Firefox (0.9 or older) */ filter:alpha(opacity=0); } .jcarousel-skin-tango .jcarousel-prev-vertical:hover { /* background-position: 0 -32px; */ background: #49d550 url('./images/freccia-up.png') no-repeat center center; opacity: 0.50; /* Standard CSS3 opacity setting */ -moz-opacity: 0.50; /* Opacity for really old versions of Mozilla Firefox (0.9 or older) */ filter:alpha(opacity=50); } .jcarousel-skin-tango .jcarousel-prev-vertical:active { /* background-position: 0 -64px; */ } .jcarousel-skin-tango .jcarousel-prev-disabled-vertical, .jcarousel-skin-tango .jcarousel-prev-disabled-vertical:hover, .jcarousel-skin-tango .jcarousel-prev-disabled-vertical:active { cursor: default; background-image: none; background-color: inherit; }