/*----------------------------- Howdy peeping tom! This code was made on Coda Software! You are watching the stylesheet from www.wedesignit.org, that was hand crafed by me, CŽélia leoc‡ádio -----------------------------*/ /* 960 Grid System ~ Text CSS. Learn more ~ http://960.gs/ Licensed under GPL and MIT. */ /* @group Basic Text Styles */ /* `Basic HTML ----------------------------------------------------------------------------------------------------*/ body { background-color: #f6f0f3; font:15px/1.6 'Helvetica Neue', Arial, 'Liberation Sans', FreeSans, sans-serif; background:#F9F7F0 url(../images/bg_all.png); color:#777; } a,a:visited { color:#dc782c; } a:focus { outline:1px dotted invert; } hr { border:0 #ccc solid; border-top-width:1px; clear:both; height:0; } div { border:0px solid #ddd; } /* `Headings ----------------------------------------------------------------------------------------------------*/ h1 { color:#7aaebe; font-size:30px; } h2 { color: #e16017; font-size:28px; } h3 { color: #79aebe; font-size:21px; } h4 { font-size:19px; } h5 { font-size:17px; } h6 { font-size:15px; } /* `Spacing ----------------------------------------------------------------------------------------------------*/ ol { list-style:decimal; } ul { list-style:disc; } li { margin-left:30px; } p,dl,hr,h1,h2,h3,h4,h5,h6,ol,ul,pre,table,address,fieldset { margin-bottom:10px; } .orange { color:#dc782d; font-size: 1.1em; font-weight: bold} /* @end */ /* @group Top */ /* TOP CONTENT*/ #top { overflow:hidden; background:url(../images/bg_top.png) repeat-x; padding-top:10px; } #header { } #header .name { margin-top:60px; } #header .logo { background:url(../images/vertical_hr.png) no-repeat 90% 60px; } #header .menu { background:url(../images/lookatmenu.png) no-repeat 100% 10px; /* position absolute so that z-index can be defined */ } ul.nav { width:436px; list-style:none; margin-top:90px; margin-left:30px; } ul.nav li { margin:0; display: inline;} #header .menu ul.nav li a { display:block; float:left; height:56px; background-image:url(../images/menu_sprite.png); background-repeat:no-repeat; text-indent:-5000px; margin-right:20px; } #header .menu ul.nav li a.home { width:70px; background-position:5px 0; } #header .menu ul.nav li a.about { width:60px; background-position:-85px 0; } #header .menu ul.nav li a.portfolio { width:70px; background-position:-170px 0; } #header .menu ul.nav li a.contacts { width:70px; background-position:-262px 0; } #header .menu ul.nav li a.home:hover { width:70px; background-position:5px -55px; } #header .menu ul.nav li a.about:hover { width:60px; background-position:-85px -55px; } #header .menu ul.nav li a.portfolio:hover { width:70px; background-position:-170px -55px; } #header .menu ul.nav li a.contacts:hover { width:70px; background-position:-262px -55px; } #header .phrase { padding-top:30px; text-align:center; } /* @end */ /* @group Middle */ /* MIDDLE CONTENT*/ #middle { overflow:hidden; } #content { background:url(../images/main_shadow.png) no-repeat top center; overflow:hidden; padding-top: 30px; } #content div { overflow:hidden; } #content hr { margin:17px 0 18px; height:0; clear:both; border-top:1px solid #E6E1DE; border-bottom:1px solid #f9f9f9; } #content .home { margin: 30px 0; } #content .home .one { background:url(../images/bluebubble1.png) no-repeat center; height:270px; } #content .home .two { background:url(../images/creambubble1.png) no-repeat center; height:270px; } #content .home .three { background:url(../images/lightbluebubble1.png) no-repeat center; height:270px; } .home p { padding:0 40px 0 45px; color: #5c8998; } .home p:hover { padding:0 40px 0 45px; color:#3a656d; } .home h2 { text-align:center; font-size:30px; padding-top:35px; font-weight:bold; color:#5c9ca8; } #content #about h2,#contacts h2 { text-align:left; font-weight:bold; } #content p { text-align:left; padding-right:50px; } #content #about { background:url(../images/creambubble2.png) no-repeat 90% 10%; margin:30px 0; } #content #about .socialplaces { background:url(../images/meatcomputer.png) no-repeat 90% 10%; } #content #about .socialplaces ul { list-style:none; padding-bottom:30px; } #content #about .socialplaces li { color: #767e89; background: url(../images/tag.png) no-repeat left center; margin: 0; padding: 2px 30px; } #content #about .socialplaces img { padding:5px; } #content .services h3 { border-bottom:1px dotted #ccc; cursor:pointer; } #content .services div { margin:10px; } #content .services div p { padding: 0px; } #content .services img { margin:10px; float: left } #right{margin-top: 40px;} #right p{font-size: 0.9em; color: #79aebe; padding: 0px;} #right h2 {color: #72c4df} #content .portfolio { margin:40px 0; } #content #contacts { margin:40px 0; } #content form { font-size:1.3em; line-height:2em; padding:20px; } #content form label { color:#000000; display:inline; font-variant:normal; letter-spacing:normal; } #content form label.error{ color: #ff6633; font-size: 0.8em} form input { background-color: transparent; border-width: 0; border-style: solid; border-bottom-color: #555; border-bottom-style:dashed; border-bottom-width:.0714em; margin:0 10px; padding:2px; color:#6d9ca9; font-size:.9em; } form textarea { border:0 solid; background-color: transparent; border-bottom-color:#555; border-bottom-style:dotted; border-bottom-width:.0714em; width:95%; padding:3px; color:#6d9ca9; font-size:1em; background-image: url(../images/lines.png); } #content form input:focus,#content form textarea:focus { background-repeat:repeat-x; border: 1px dashed #555 } #content form button { margin-top:20px; } span.name{font-weight: bold; text-transform: uppercase; color: #71c3df} .css3button { border:1px solid #72c4df; background-color: #a3d0ce; padding:10px 20px; text-align:center; font-weight:bold; color:#fff; text-decoration:none; border-style:solid; text-shadow:rgba(0,0,0,.5) 0 -1px 0; font-size:1em; } a.css3button { color:#fff; margin-top: 20px;} .css3button:hover { border-color: #e16017; background:#dc782d; text-shadow:rgba(0,0,0,.5) 0 1px 0; } #content .phone { background:url(../images/phone_icon.png) no-repeat right bottom; } #content .skype { background:url(../images/skype_icon.png) no-repeat right bottom; } #content .mail { background:url(../images/mail_icon.png) no-repeat right bottom; } #right div {margin: 30px 0px} #message {margin-top: 30px;} #message h3 { padding: 20px 80px } img#checkmark{float: left; padding: 10px;} #content #latestwork { background:url(../images/recentwork.png) no-repeat left top; padding-top:50px; margin-bottom:10px; } #content #latestwork img { float:right; } #maildata table td {padding:5px 10px; border-bottom: 1px dotted #ccc; color: #555} /* @end */ /* @group Bottom */ /* BOTTOM CONTENT*/ #bottom { background-image:url(../images/bg_bottom.png); border-top:1px solid #fff; overflow:hidden; padding-bottom: 20px;} #footer { background:url(../images/footer_light.png) no-repeat top center; overflow:hidden; } #footer hr { margin:17px 0 18px; height:0; clear:both; border-top:1px solid #000; border-bottom:1px solid #222; } #footer .moto { padding-top:40px; padding-bottom:30px; } #footer .moto hr { } #footer .copy { color:#666; } #footer .copy img { padding-right:10px; } #footer .menu ul li { display:inline; margin-left:0; color:#555; } #footer .menu ul li a { color:#ff6c00; border-right:1px solid #222; padding:0 15px; text-decoration:none; } #footer .menu ul li a:hover { color:#9dd6ff; } #footer.hidden { } /* @end */ .qtip-content { font-size:13px; font-weight:bold; color:#f57d20; } /* Galeria Latest */ ul.latest { /*--Adjust width according to your scenario--*/ list-style:none; margin:0; padding:0; float:left; } ul.latest li { float:left; margin:5px; padding:0; text-align:center; border:5px solid #e2dddb; -moz-border-radius:3px; /*--CSS3 Rounded Corners--*/ -khtml-border-radius:3px; /*--CSS3 Rounded Corners--*/ -webkit-border-radius:3px; /*--CSS3 Rounded Corners--*/ display:inline; /*--Gimp Fix aka IE6 Fix - Fixes double margin bug--*/ } ul.latest li a.thumb { width:300px; /*--Width of image--*/ height:150px; /*--Height of image--*/ padding:0; border-bottom:1px solid #eee; cursor:pointer; } ul.latest li span { /*--Used to crop image--*/ width:300px; height:150px; overflow:hidden; display:block; } ul.latest li a.thumb:hover { background:#333; /*--Hover effect for browser with js turned off--*/ } ul.latest li h3 { font-size:1em; font-weight:normal; text-transform:uppercase; margin:0; padding:5px; background:#f6f2eb; border-top:1px solid #fff; /*--Subtle bevel effect--*/ } ul.latest li a { text-decoration:none; color:#5c9ca8; display:block; } /* Caroussel*/ .portfolioitem { width:395px; } #mycarousel img { border:5px solid #a3d0ce; } #mycarousel img:hover { border:5px solid #dc782c; } .jcarousel-skin-tango .jcarousel-container { -moz-border-radius:10px; } /* * This
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