/* Theme Name: mikizzi web site Author: Michele Librizzi This theme was designed and built by Michele Librizzi */ * { background-repeat: no-repeat;} html { overflow-y: scroll; } /* scroll bar forced in FF */ ol,ul { list-style: none;} del {text-decoration: line-through;} blockquote,q { quotes: none;} table { border-collapse: collapse; border-spacing: 0;} caption,th,td { text-align: left; font-weight: normal;} html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del, dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,tt,var,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td {margin: 0; padding: 0; border: 0;outline:0;font-family:inherit;vertical-align: baseline;background:transparent;font-size: 100%;} label,input {vertical-align: middle;} .clearfix:after {content: ".";display: block;clear: both;visibility: hidden;line-height:0;height: 0;} .clearfix {display: inline-block;} html[xmlns] .clearfix {display: block;} * html .clearfix {height: 1%;} .relative { position:relative} .align_r {text-align: right;} .align_c {text-align: center;} .align_l {text-align:left;} .left { float: left;} .right {float: right;} .bold { font-weight: bold} cite { font-style:normal} img, .block { display:block} .clear { clear:both} .hide, #nav li a, #followMe li a, ul#services li h3 {text-indent: -9999px;overflow:hidden; display:block;background-repeat:no-repeat; background-position:top left} a{ color:#c65c61; text-decoration:none} a:hover { color:#c2131a} .marginB { margin-bottom:20px} #content p { margin-bottom:15px} body { background:url(images/light_texture.jpg) top left repeat; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; color:#3E382B} .content_all #head { background:url(images/head_mikizzi_web_design.jpg) top center no-repeat; height:250px;} .content_oneCol { width:910px; margin:0 auto; background:url(images/border_col.gif) 396px 0 repeat-y;} .content_oneCol#blog { background:url(images/border_col.gif) 610px 0 repeat-y; padding-top:15px} .content_oneCol#about { padding-top:15px} #listed.content_oneCol, #contact.content_oneCol { background:url(null); padding-left:30px; padding-top:15px; width:880px; } .content_all { display:block; /*background:url(images/post-bg.gif) top left repeat;*/} #tagline { clear:both; background:transparent url(images/patter_tagline.gif) top left repeat-x; height:79px; margin-top:-40px; padding-top:37px } #tagline h2 { background:url(images/tt_professional_accessible_wd.gif) top right no-repeat; height:37px ; width:910px; margin:0 auto; } #content.content_all { padding-top:15px ; background:url(images/post-bg.gif) top left repeat; } #cntBottomA { background:url(images/bg_zig-zag_bottom_top.gif) top left repeat-x; padding-top:9px} #contentBottom { background:url(images/background_title.jpg) top left repeat; } #contentBottomB {background:url(images/bg_zig-zag_bottom_down.gif) top left repeat-x; } #cntB { background:url(images/bottom_mikizzi_web_design.jpg) 14px 0 no-repeat; height:263px; position:relative; } .thirteen { font-size:10px;} a.more { width:91px; height:22px; background:url(images/link_read_more.gif) top left no-repeat;} a:hover.more { background-position:bottom left} #cntB p { position:absolute; bottom: 0; left:30px; font-size:0.7em; } #cntB p span {background:#E5E3D9; line-height:1.6em;margin-bottom:1px ; padding:0 3px } #logo { background:url(images/logo_mikizzi.png) 0 -150px no-repeat; height:320px; width:264px; padding-top:18px; padding-left:15px; position:absolute; } #logo h1, #logo h1 a { width:202px; height:83px; display:block;} #nav { float:right; display:block; margin-top:23px; height:176px; width:240px; } #nav li, #nav li a { height:37px; display:block; float:right } #nav li a { background-image:url(images/navigation_mikizzi.gif); background-repeat:no-repeat} /* LIVE */ #nav li.page-item-3 a { background-position:right top; width:127px } #nav li.page-item-3 a:hover, #nav li.current_page_item.page-item-3 a { background-position:right -166px;} #nav li.page-item-2 { margin-top:-5px} #nav li.page-item-2 a {background-position:right -32px; width:118px} #nav li.page-item-2 a:hover, #nav li.current_page_item.page-item-2 a {background-position:right -198px; } #nav li.page-item-5 a { background-position:right -64px; width:184px ; } #nav li.page-item-5 a:hover, #nav li.current_page_item.page-item-5 a { background-position:right -230px; } #nav li.page-item-7 { margin-top:-5px} #nav li.page-item-7 a { background-position:right -96px; width:95px } #nav li.page-item-7 a:hover, #nav li.current_page_item.page-item-7 a, li.current_page_parent.page-item-7 a { background-position:right -262px!important; } #nav li.page-item-9 a {background-position:right -128px; width:173px } #nav li.page-item-9 { margin-top:-3px} #nav li.page-item-9 a:hover, #nav li.current_page_item.page-item-9 a {background-position:right -294px; } .topAnchor .scroll { font-size:0.8em; float:left; width:100px} /* DEV #nav li.page-item-4 a { background-position:right top; width:127px } #nav li.page-item-4 a:hover, #nav li.current_page_item.page-item-4 a { background-position:right -166px;} #nav li.page-item-2 { margin-top:-5px} #nav li.page-item-2 a {background-position:right -32px; width:118px} #nav li.page-item-2 a:hover, #nav li.current_page_item.page-item-2 a {background-position:right -198px; } #nav li.page-item-8 a { background-position:right -64px; width:184px ; } #nav li.page-item-8 a:hover, #nav li.current_page_item.page-item-8 a { background-position:right -230px; } #nav li.page-item-10 { margin-top:-5px} #nav li.page-item-10 a { background-position:right -96px; width:95px } #nav li.page-item-10 a:hover, #nav li.current_page_item.page-item-10 a, li.current_page_parent.page-item-10 a { background-position:right -262px!important; } #nav li.page-item-13 a {background-position:right -128px; width:173px } #nav li.page-item-13 { margin-top:-3px} #nav li.page-item-13 a:hover, #nav li.current_page_item.page-item-13 a {background-position:right -294px; } */ #intro_about { background:url(images/about_intro_mikizzi.jpg) top center no-repeat; height:391px; display:block; } .cnt_colSmall, .cnt_colBig { float:left; display:inline} .cnt_colSmall { width:326px; padding-right:40px; margin-left:30px} .cnt_colBig { width:465px; padding-left:40px;} #blog .cnt_colSmall { padding-right:0; width:250px; margin-left:40px} #blog .cnt_colBig { padding-left:30px; width:550px; margin-right:40px } #home_header_services { position:absolute; width:90px ; height:20px; top:8px; left:220px; } #home_header_about { position:absolute; width:120px ; height:20px; top:105px; left:190px;} #home_header_contact { position:absolute; width:90px ; height:20px; top:235px; left:455px;} h2, h3 {color:#5a8f8a;} h2 { font-size:180%; font-weight:bold} #content h2 { border-bottom:1px dashed #BEB181; margin-bottom:15px} #contentBottom h3 { font-size:140%; margin-bottom:24px } .listBlock { background:url(images/beige-trans.png) top left repeat; margin:10px 0 30px 0; padding:6px 6px 0 0 ; width:460px; float:left} .listBlock li { float:left; margin:0 0 6px 6px; } #flickr {background:url(images/beige-trans.png) top left repeat; margin:10px 0 30px 0; padding:6px 6px 0 0 ; width:460px; float:left} .flickr_badge_image { float:left;margin:0 0 6px 6px;} .flickr_badge_image a { display:block; overflow:hidden; width:107px; height:70px;border:1px solid #fff;} .flickr_badge_image a:hover {border:1px solid #5a8f8a} #gallery { background:url(images/beige-trans.png) top left repeat; margin:10px 0 30px 0; padding:6px 6px 0 0 ; width:460px; float:left} #gallery li { float:left; margin:0 0 6px 6px; } #listed #gallery { width:874px; } li img, .entry img { background-color:#fff; border:1px solid #D9D4C1; padding:1px} .entry .padding { margin-right:5px; display:block; float:left } #listed #gallery li img { width:99px; } li a:hover img, #projects li a:hover, .entry a:hover img { border:1px solid #5a8f8a} #projects li a { display:block; width:272px; height:187px; border:1px solid #D9D4C1; overflow:hidden } #projects li a img { border:none; } #projects { margin-bottom:40px} #projects li { background:url(images/bg_polaroid_portfolio.jpg) top left no-repeat; display:block; width:284px; height:245px; float:left; margin-right:14px; margin-bottom:14px} #projects li.lastRow { margin-right:0 } #projects li span, #projects li span img { display:block } #projects li span { padding-top:4px; padding-left:4px; overflow:hidden; width:274px; height:189px} #projects div { font-size:0.8em; padding:8px 0 0 12px; position:relative } #projects div p { font-size:0.9em; color:#666; line-height:12px; } #projects div p.tag { font-size:0.8em} #projects div p.year { font-family:Georgia, "Times New Roman", Times, serif; width:126px; position:absolute; top:18px; right:20px; text-align:right; font-size:1em} #futhers { width:880px; margin:0 auto; padding:38px 0 38px 30px} #futhers li.box { display:block; float:left; width:270px; } #futhers li.middle { padding:0 30px } .listImg { width:280px; float:left; margin-bottom:40px } .listImg li, #followMe li a {float:left;} .listImg li.icons { margin:0 6px 6px 0; width:16px; height:16px; position:relative } .listImg#followMe { margin-bottom:0} .listImg li#oDesk { float:none; clear:both; display:block} #followMe li { margin:0 0 10px 0} #followMe li, #followMe li a { width:60px; height:60px; } #followMe li a { background-image:url(images/icons_social_net.jpg); background-repeat:no-repeat} #followMe li a#net_tw { background-position:bottom left} #followMe li a#net_del { background-position: -60px -75px} #followMe li a#net_sk { background-position: -120px -75px} #followMe li a#net_lID { background-position: -180px -75px} #followMe li a#net_fk { background-position: -242px -75px} #followMe li a#net_rss { background-position: -302px -75px} #followMe li a#net_fb { background-position: -362px -75px} #followMe li a#net_yt {background-position: -426px -75px} #followMe li a#net_tw:hover { background-position: 0 -4px} #followMe li a#net_del:hover { background-position: -60px -2px} #followMe li a#net_sk:hover { background-position: -120px -2px} #followMe li a#net_lID:hover { background-position: -180px -2px} #followMe li a#net_fk:hover { background-position: -242px -2px} #followMe li a#net_rss:hover { background-position: -302px -2px} #followMe li a#net_fb:hover { background-position: -362px -2px} #followMe li a#net_yt:hover {background-position: -426px -2px} .post .entry { border-bottom:1px dashed #D9D4C1; margin:0 0 50px; padding:10px 0 25px 60px; background:url(images/border_row.gif) bottom left repeat-x; } .post .date { float:left; background:url(images/date.jpg) top left no-repeat; width:51px ; height:51px; margin:0 10px 12px 0} .post .date em { color:#4A4331; float:left; font-size:18px; font-weight:bold; letter-spacing:-2px; line-height:19px; padding:10px 0 0; text-align:center; width:50px; font-style:normal} .post .date em.month { clear:both; font-size:12px; font-weight:normal; letter-spacing:normal; line-height:8px; padding:0} .post h3 { border-bottom:1px dashed #BEB181; color:#796D56; font-size:1.5em; line-height:1em} h3#comments{font-size:1.5em; border-bottom:1px dashed #BEB181; margin-bottom:15px} h3#comments span { color:#796D56} .post h3 cite { font-size:14px; font-weight:100} .post h3 cite strong { font-weight:bold!important; } .post h3 cite strong span { font-weight:100} h3.comment-author { line-height:16px; margin-bottom:20px; border-bottom:1px dashed #D9D4C1; padding-bottom:5px } h3.comment-author cite { font-size:1.2em; } h3.comment-author span { font-size:0.8em; font-weight:100; color:#796D56 } .commentlist { margin-bottom:40px} .commentlist img.avatar { float:right; border:4px solid #C8C1AD; margin-top:10px} .comment-body { background:url(images/bg_comments.jpg) top left repeat; border-top:1px dashed #D9D4C1; border-bottom:1px dashed #D9D4C1; width:440px; padding:20px; margin-bottom:20px } p.img { float:right; border:1px solid #ccc7b8; display:block; width:170px; height:247px; background-color:#FFF; margin:0 0 10px 10px } p.img img { display:block; margin:auto; margin-top:8px } ul#services li { margin-bottom:5px} ul#services li h3 { background-image:url(images/services_mikizzi.jpg); width:326px; height:36px} ul#services li h3.clickable { cursor:pointer} ul#services li div { background-color:#eae7db; padding:8px; font-size:0.9em} ul#services li h3#domain {} ul#services li h3#domain:hover { background-position:0 -36px} ul#services li h3#professionalDoc { background-position:0 -108px} ul#services li h3#professionalDoc:hover {background-position:0 -143px} .listDot li { background:url(images/list_point.gif) 0 7px no-repeat; padding-left:20px} ul#services li h3#wireframe { background-position:0 -214px} ul#services li h3#wireframe:hover { background-position:0 -249px} ul#services li h3#logoDesign { background-position:0 -318px} ul#services li h3#logoDesign:hover {background-position:0 -353px} ul#services li h3#seo { background-position:0 -421px} ul#services li h3#seo:hover { background-position:0 -456px} ul#services li h3#interfaceDev {background-position:0 -529px} ul#services li h3#interfaceDev:hover {background-position:0 -564px} ul#services li h3#qualityAssurance {background-position:0 -632px} ul#services li h3#qualityAssurance:hover {background-position:0 -667px} ul#services li h3#support {background-position:0 -740px} ul#services li h3#support:hover {background-position:0 -775px} .categories ul, ul.futhers, ul.blogRoll { background:url(images/beige-trans.png) top left repeat; padding:20px; font-size:0.9em!important;margin-left:-20px; margin-right:-20px; margin-bottom:40px} .categories ul li, ul.futhers li, ul.blogRoll li {border-bottom:1px dashed #BEB8A7; padding:5px 0; } .categories ul li a, ul.futhers li a, ul.blogRoll li a { background:url(images/icons_set.gif); background-repeat:no-repeat; padding-left:23px} ul.futhers li a { background-position:0 3px} .categories ul li a, ul.blogRoll li a { background-position:0 -20px} .entry .postmetadata { background:url(images/beige-trans.png) top left repeat; font-size:0.8em; margin-left:-60px; padding:10px; border-top:1px dashed #D9D4C1; border-bottom:1px dashed #D9D4C1; margin-top:40px } .listReader li { font-size:0.9em; margin-bottom:10px} .listReader li a.list { color:#666} .listReader li a.list:hover { color:#999} .twittList li {font-size:0.9em; color:#666; margin-bottom:15px; border-bottom:1px dashed #333; padding-bottom:10px} .twittList li b { color:#999} .twittList li .right { line-height:1.2em ; float:inherit; } .twittList li img.left { margin-right:8px;} .twittList li .time { color:#999; display:block; padding-top:5px} .JRM {font-size:11px; margin-top:5px} .twittList li img { width:48px} .addthis_container { width:130px; float:right} /* ----------------- Calendar style ---------------*/ #calendar_wrap { background:url(images/beige-trans.png) top left repeat; margin-right:-20px; margin-left:-20px; padding:20px; margin-bottom:40px} #calendar_wrap table { width:100%; font-size:0.9em!important; } #calendar_wrap table caption { text-align:center; padding-bottom:5px; font-weight:bold; font-size:1.2em} #calendar_wrap table thead th { font-weight:bold; text-align:center; padding-bottom:3px; } #calendar_wrap table td { text-align:center;} #calendar_wrap table td a { font-weight:bold} #calendar_wrap table tfoot td { padding-top:5px; font-weight:bold; } #calendar_wrap table tbody td { padding:3px 0; border:1px dashed #beb8a7; background:url(images/bg_comments.jpg) top left repeat; } #calendar_wrap table tbody td.pad { border:0; background:none; } #calendar_wrap table tfoot td#prev { text-align:left; } #calendar_wrap table tfoot td#next { text-align:right;} #calendar_wrap table tfoot td a { text-indent:-99999px; overflow:hidden; background-image:url(images/arrow_calendar.gif); display:block; background-repeat:no-repeat; height:22px; width:22px } #calendar_wrap table tfoot td#prev a { background-position: top left} #calendar_wrap table tfoot td#prev a:hover { background-position: bottom left} #calendar_wrap table tfoot td#next a {text-indent:99999px; background-position:top right; float:right } #calendar_wrap table tfoot td#next a:hover { background-position:bottom right} /* -----------------Form-----------------------------*/ form * { border:none} form#commentform { margin-bottom:40px} form#commentform textarea, form#commentform input { border:2px solid #BEB181; padding:10px} form#commentform fieldset { background:url(images/beige-trans.png) top left repeat; padding:20px; border-top:1px dashed #D9D4C1; border-bottom:1px dashed #D9D4C1;} #respond h3 {border-bottom:1px dashed #BEB181; margin-bottom:15px; font-size:1.5em;} form#commentform label { display:block; font-size:15px; font-weight:bold} form#commentform textarea { width:285px} form#commentform div.left { width:180px} form#commentform p { margin-bottom:10px} form#commentform #submit, .wpcf7-form .submit input, .cnt_colBig #searchform .hide#searchsubmit {border:2px solid #5a8f8a; background-color:#5a8f8a; color:#fff; font-size:1em; font-weight:bold; cursor:pointer; } .wpcf7-form .submit input { float:right} .wpcf7-form { width:880px} .wpcf7-form div.left { width:300px} .wpcf7-form div.right { width:536px} .wpcf7-form .left input { width:280px; height:30px; font-size:18px; font-family:Georgia, "Times New Roman", Times, serif; background:none} .wpcf7-form-control-wrap { background:url(images/bg_input_cnt.jpg) top left no-repeat; display:block; width:288px; height:33px; padding:20px 0 0 10px; margin-bottom:20px} .your-message { background-position: bottom left; width:526px; height:229px} .your-message textarea { width:520px; height:210px; background:none; font-family:Georgia, "Times New Roman", Times, serif; font-size:18px} .wpcf7-form label { font-size:1.2em} .wpcf7 { margin-bottom:40px!important; border-bottom:1px dashed #BEB8A7; padding-bottom:20px!important; float:left; width:880px; } .wpcf7-not-valid-tip { color:#C2131A} .wpcf7-response-output { color:#5A8F8A; font-weight:bold} #contentBottomB #searchform { width:265px; height:101px; padding-top:20px; float:right; margin-right:55px } #contentBottomB #searchsubmit { float:left; background:transparent; border:none; display:block; height:25px; width:35px; cursor:pointer; margin-right:0} #contentBottomB #s { border:2px solid #212121; font-size:12px; height:15px; width:215px; padding:2px ; float:right} .cnt_colBig #searchform { width:420px; background:url(images/bg_comments.jpg) top left repeat; margin-top:10px; padding:20px;border-top:1px dashed #D9D4C1; border-bottom:1px dashed #D9D4C1; width:440px; } .cnt_colBig #searchform input#s { padding:10px; border:1px solid #BEB8A7; width:300px; font-family:Georgia, "Times New Roman", Times, serif; font-size:18px} .cnt_colBig #searchform .hide#searchsubmit {text-indent:inherit;overflow:inherit; display:inherit; float:right; padding:8px } .cnt_colBig #searchform .hide { display:none} /** * jQuery lightBox plugin * This jQuery plugin was inspired and based on Lightbox 2 by Lokesh Dhakar (http://www.huddletogether.com/projects/lightbox2/) * and adapted to me for use like a plugin from jQuery. * @name jquery-lightbox-0.5.css * @author Leandro Vieira Pinho - http://leandrovieira.com * @version 0.5 * @date April 11, 2008 * @category jQuery plugin * @copyright (c) 2008 Leandro Vieira Pinho (leandrovieira.com) * @license CC Attribution-No Derivative Works 2.5 Brazil - http://creativecommons.org/licenses/by-nd/2.5/br/deed.en_US * @example Visit http://leandrovieira.com/projects/jquery/lightbox/ for more informations about this jQuery plugin */ #jquery-overlay { position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; } #jquery-lightbox { position: absolute; top: 0; left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0; } #jquery-lightbox a img { border: none; } #lightbox-container-image-box { position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; } #lightbox-container-image { padding: 10px; } #lightbox-loading { position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; } #lightbox-loading img { display:inherit!important} #lightbox-nav { position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; } #lightbox-container-image-box > #lightbox-nav { left: 0; } #lightbox-nav a { outline: none;} #lightbox-nav-btnPrev, #lightbox-nav-btnNext { width: 49%; height: 100%; zoom: 1; display: block; } #lightbox-nav-btnPrev { left: 0; float: left; } #lightbox-nav-btnNext { right: 0; float: right; } #lightbox-container-image-data-box { font: 10px Verdana, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%; padding: 0 10px 0; } #lightbox-container-image-data { padding: 0 10px; color: #666; } #lightbox-container-image-data #lightbox-image-details { width: 70%; float: left; text-align: left; } #lightbox-image-details-caption { font-weight: bold; } #lightbox-image-details-currentNumber { display: block; clear: left; padding-bottom: 1.0em; } #lightbox-secNav-btnClose { width: 66px; float: right; padding-bottom: 0.7em; } #address { margin-bottom:40px;} #address li h3 { font-size:1.3em; margin-bottom:10px} #address li p { margin-bottom:15px} #address li#add { width:300px } #address li#com { width:531px; padding-left:30px; margin-left:18px;} #address li#com p {background-color:#fff; border:1px solid #D9D4C1; padding:5px; padding-bottom:0} .qtip-contentWrapper { font-size:14px!important;} .navigation { margin-bottom:20px; font-size:0.85em;} .navigation .alignright { text-align:right} /*------ home styles ------*/ .slideShow { background:url(images/bg_slideshow_porfolio_hp.jpg) top left no-repeat; width:416; height:357px; padding-left:23px; padding-top:27px} .imgNavigation { margin-bottom:15px; } .imgNavigation a { background-image:url(images/arrow_images.gif); background-repeat:no-repeat; width:40px; height:40px; display:block} .imgNavigation a:hover { background-position:0 -40px} .imgNavigation .right a { background-position:-40px 0 ; } .imgNavigation .right a:hover {background-position:-40px -40px ;} .imgNavigation a img { display:none} .attachment img.attachment-large { width:486px; height:365px}