/************************************************ Template: Expanding Portfolio Author: Luka Cvrk (www.solucija.com) *************************************************/ /* GENERAL DEFINITIONS */ *{ margin: 0; padding: 0; outline: 0; } body { font: .74em Arial, Sans-Serif; background: #f4f4f4 url(../images/bg.gif) repeat-x; color: #777; text-align: center; } a { color: #333; text-decoration: none; } p { line-height: 1.6em; margin: 0 0 10px; } img { border: 0; } .x { clear: both; } /* LOGO */ h1 { float: left; margin: 40px 0 64px; font-size: 1.4em; letter-spacing: 6px; } h1 a { color: #999; text-transform: uppercase; padding: 0 0 4px; } h1 span { color: #B5DFD7; padding: 0 0 4px; } h1 a:hover{ border-bottom: 1px dotted #444; } h2 { font-size: 1.3em; color: #222; margin: 0 0 15px; line-height: 1.5em; } h2 a { color: #222; } /* CONTENT WRAPPER */ #content { clear: both; width: 960px; margin: 0 auto; text-align: left; } /* MENU */ #menu { float: right; margin: 38px 10px 0 0; text-transform: uppercase; } #menu li { display: inline; list-style: none; } #menu li a { float: left; color: #777; padding: 5px; margin: 0 0 0 20px; font-weight: bold; } #menu li a:hover { color: #fff; } #menu li a.current { color: #B5DFD7; } /* PITCH */ #pitch { clear: both; height: 290px; margin: 0 0 35px; } #pitch-left { clear: both; width: 670px; float: left; margin: 0 0 30px; color: #777; font-weight: bold; } #pitch-left img { border-bottom: 2px solid #111; } #caption { clear: both; float: left; position: relative; margin: -67px 0 0 -11px !important; margin: -67px 0 0 -5px; height: 55px; background: url(../images/caption.gif) repeat-x; } #caption span { float: left; background: url(../images/featured-span.gif) no-repeat; height: 52px; width: 11px; } #caption h2 { padding: 21px 30px 0 15px; float: left; color: #222; text-transform: uppercase; font-size: 1.2em; letter-spacing: 3px; } #pitch-right { height: 309px; width: 290px !important; width: 287px; float: right; } .templ, .tempr { float: left; margin: 0 0 30px 0; width: 135px; height: 100px; border-bottom: 2px solid #111; } .tempr { float: right; } .zoom { position: relative; float: left; width: 35px; height: 37px; margin: -44px 0 0 -6px; background: url(../images/zoom.gif) no-repeat; } #expl { clear: both; text-align: justify; color: #fff; padding: 0 5px 0 0; font-weight: normal; font-style: italic; color: #999; font-size: 1.2em; height: 97px !important; height: 92px; } #browse { padding: 9px 17px 9px 26px; background: #fff url(../images/browse.gif) no-repeat 8px 13px; font-size: 1.2em; font-weight: bold; color: #444; border-bottom: 2px solid #111; } #browse:hover { background: #eee url(../images/browse.gif) no-repeat 8px 13px; color: #000; } /* COLUMNS (1/3) */ .col { float: left; width: 270px; background: #fff; padding: 15px !important; padding: 15px 15px 2px; margin: 0 30px 35px 0; text-align: justify; border-top: 1px dotted #ddd; } .col.last { margin-right: 0; } .col p { margin: 0 0 15px; } .more { float: left; position: relative; margin: 0 0 0 -21px; background: url(../images/more.gif) no-repeat; padding: 11px 21px 6px; color: #fff; font-size: .9em; font-weight: bold; } .line { clear: both; margin: 0 0 10px; border-bottom: 1px dotted #ccc; } /* LISTS */ #lists { float: left; width: 630px; margin: 0 0 22px; padding: 18px 0 0 10px; } #lists ul { float: left; margin: 0 50px 0 0; } #lists ul.last { margin: 0; } #lists li { background: url(../images/bullet.gif) no-repeat 0 10px; list-style: none; padding: 5px 0 0 12px; color: #555; } #lists li.title { color: #222; font-size: 1.2em; font-weight: bold; font-weight: bold; padding-bottom: 9px; text-transform: uppercase; } /* QUOTE */ #quote { float: right; width: 270px; padding: 20px 15px; background: #ddd url(../images/quote.gif) no-repeat 7px 7px; height: 115px; color: #444; font-style: italic; } #author { font-weight: bold; padding: 10px 0 0; } /* FOOTER */ #footer { clear: both; color: #999; font-size: .94em; border-top: 1px dotted #ccc; padding: 25px 10px; } #flinks { float: right; }