Skip to content

Instantly share code, notes, and snippets.

@dodeja

dodeja/gist:44369

Created January 7, 2009 19:05
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save dodeja/44369 to your computer and use it in GitHub Desktop.
Save dodeja/44369 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
gistfile1.css
/*
Mugasha.com - MAIN CSS (main.css)
COPYRIGHT 2008 Mugasha. All Rights Reserved.
*/
/* COLOR PALLETTE
============================================================================
Blue - #46afc5
Light Blue - #cadee5 #e0f7ff
Dark Gray - #2d3133
Medium Gray - #999, #7b888c
Light Gray - #e9e9e9
Orange - #e64804
Text - #555
Links - #e64804
===========================================================================*/
/* GLOBAL RESET
---------------------------------------------------------------------------*/
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, sub, sup, tt, var, b, u, i, center, 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-size: 100%; vertical-align: baseline; background: transparent;}
body {line-height: 1;}
ol, ul {list-style: none;}
blockquote, q {quotes: none;}
/* remember to define focus styles! */
:focus {outline: 0;}
/* remember to highlight inserts somehow! */
ins {text-decoration: none;}
del {text-decoration: line-through;}
/* tables still need 'cellspacing="0"' in the markup */
table {
border:1px solid #000;
border-collapse:collapse;
font-family:arial,sans-serif;
}
td,th{
border:1px solid #000;
border-collapse:collapse;
padding:5px;
}
/* ADMIN
---------------------------------------------------------------------------*/
#adminNav { margin: 0 0 10px 0; padding: 5px 5px 10px 5px; border-bottom: 1px solid #000; background: #879499; }
#adminNav ul, #adminNav li { margin: 0; padding: 0 5px 0 5px; display: inline; list-style-type: none; border-right: 2px solid #333; }
#adminNav a:link, #adminNav a:visited { font-weight: bold; color: #000; }
#adminNav a:hover { color: #fff; }
/* GENERAL SELCTORS
---------------------------------------------------------------------------*/
body {font: 14px arial, helvetica, sans-serif; color: #555; background-color: #7b888c}
p {margin: 0 0 10px 0; line-height: 1.5em;}
/* HEADINGS */
h1 {clear: both; padding: 15px 0 0 20px; width: 960px; height: 55px; background: url(../images/page_heading_bg.png) bottom left no-repeat; font-size: 26px; font-weight: normal; color: #fff;}
h2 {margin: 0 0 20px 0; padding: 0 0 5px 0; border-bottom: 1px solid #ccc; font-size: 18px; font-weight: bold; color: #e64804;}
h3 {margin: 0 0 5px 0; padding: 0 0 5px 0; font-size: 14px; font-weight: bold; color: #2d3133;}
h4 {font-size: 14px; font-weight: bold; color: #e64804;}
/* LINKS */
a:link {color: #e64804; text-decoration: none;}
a:visited {color: #e64804; text-decoration: none;}
a:hover {text-decoration: underline;}
a:active {color: #e64804; text-decoration: none;}
/* LAYOUT
---------------------------------------------------------------------------*/
/* MAIN WRAP */
#mainWrap {margin: 0 auto; width: 100%;}
/* UTILITY NAV */
#utilNav {margin: 0 auto; width: 980px; height: 30px;}
#utilNav ul {float: right; padding: 0 0 0 20px; font-size: 12px; background: url(../images/utilnav_left.png) bottom left no-repeat;}
#utilNav li {display: inline; padding: 0 10px; color: #fff; border-right: 1px solid #fff;}
#utilNav li.first {padding: 0 10px 0 0;}
#utilNav li.last {padding: 0 0 0 9px; border: none;}
/* BETA SIGN UP FORM */
.lightboxForm {width: 460px;}
.lightboxForm legend {display: none;}
.lightboxForm label {font-size: 12px; font-weight: bold; color: #000;}
.lightboxForm input {clear: both; width: 446px; margin: 5px 0 10px 0; padding: 6px; height: 16px; border: 1px solid #bbb; font-family: arial, helvetica, sans-serif; font-size: 14px; color: #46afc5; background-color: #fff; -webkit-border-bottom-left-radius: 3px; -moz-border-radius-topleft: 3px; -moz-border-radius-bottomleft: 3px;}
.lightboxForm input:hover {border: 1px solid #888;}
.lightboxForm input.submit {float: left; margin: 5px 0 0 0; width: 74px; height: 30px; border: none; background: url(../images/submit_btn_inline.png) 0 0 no-repeat; cursor: pointer; -webkit-border-radius: 0; -moz-border-radius: 0;}
.lightboxForm input.submit:hover {background-position: 0 -30px;}
.cancelLnk {display: block; float: left; margin: 12px 0 0 10px;}
#utilNav a {font-size: 12px; color: #46afc5; text-decoration: none;}
#utilNav a:hover {color: #fff;}
#utilNavRight {display: block; padding: 9px 20px 7px 0; background: url(../images/utilnav_right.png) bottom right no-repeat;}
/* HEADER */
#setPg #headerWrap {width: 100%; background: #4f575a url(../images/setpg_header_bg.png) top left repeat-x;}
#headerWrap {width: 100%; background: #4f575a url(../images/header_bg.png) top left repeat-x;}
#header {position: relative; margin: 0 auto; width: 980px;}
/* LOGO */
#logo {float: left; margin: 0 0 30px 14px; width: 300px; height: 120px;}
#logo a {display: block; width: 300px; height: 120px; background: url(../images/logo.png) top left no-repeat;}
/* MAIN NAV */
#mainNav {position: absolute; top: 45px; right: 0;}
#mainNav ul {float: left; color: #fff;}
#mainNav li {float: left; display: inline; margin: 0 0 0 10px;}
#mainNav a {float: left; padding: 0 0 0 20px; height: 40px; text-decoration: none; background: url(../images/mainnav_left.png) top left no-repeat;}
#mainNav a span {float: left; display: block; padding: 10px 20px 12px 0; height: 18px; font-size: 18px; color: #46afc5; text-decoration: none; background: url(../images/mainnav_right.png) top right no-repeat; cursor: pointer;}
#mainNav a.selected, #mainNav a:hover {background-position: 0 -40px;}
#mainNav a.selected span, #mainNav a:hover span {color: #fff; background-position: 100% -40px;}
/* PLAYER */
#player {clear: both; margin: 0 auto; padding: 20px 20px; width: 940px; height: 150px; background: url(../images/player/player_bg.png) top left no-repeat;}
/* PLAYER PHOTO */
#playerPhoto {float: left; margin: 10px 30px 10px 10px;border: 1px solid #000; width: 118px; height: 118px; overflow: hidden;}
/* PLAYER CONTROLS WRAP */
#playerControlWrap {float: left; width: 160px; height: 130px;}
/* TRACK CONTROL WRAP */
#trackControlWrap {margin: 0 0 37px 0; width: 160px; height: 61px;}
/* TRACK BACK BUTTON */
#trackBackBtn {float: left; margin: 10px 0 0 0; width: 40px; height: 41px;}
#trackBackBtn span {display: block; width: 40px; height: 41px; background: url(../images/player/track_back_btn.png) 0 0 no-repeat;}
#trackBackBtn span:hover {background-position: 0 -41px;}
/* PLAY BUTTON */
.playBtn {float: left; margin: 0 10px; width: 60px; height: 61px;}
.playBtn span {display: block; width: 60px; height: 61px; background: url(../images/player/track_play_btn.png) 0 0 no-repeat;}
.playBtn span:hover {background-position: 0 -61px;}
/* PAUSE BUTTON */
.pauseBtn {float: left; margin: 0 10px; width: 60px; height: 61px;}
.pauseBtn span {display: block; width: 60px; height: 61px; background: url(../images/player/track_pause_btn.png) 0 0 no-repeat;}
.pauseBtn span:hover {background-position: 0 -61px;}
/* TRACK FORWARD BUTTON */
#trackForwardBtn {float: left; margin: 10px 0 0 0; width: 40px; height: 41px;}
#trackForwardBtn span {display: block; width: 40px; height: 41px; background: url(../images/player/track_forward_btn.png) 0 0 no-repeat;}
#trackForwardBtn span:hover {background-position: 0 -41px;}
/* VOLUME CONTROL WRAP */
#volumeControlWrap {margin: 0 0 0 20px; width: 110px; height: 14px;}
#volumeSlider {position: relative; width: 110px; height: 14px; background: url(../images/player/volume_control_bg.png) top left no-repeat;}
/* VOLUME CONTROL HANDLE */
#volumeHandle {position: absolute; width: 14px; height: 14px; cursor: move; background: url(../images/player/volume_control_handle.png) top left no-repeat;}
/* PLAYER DISPLAY */
#playerDisplay {float: right; padding: 20px; width: 560px; height: 90px; background: url(../images/player/player_display_bg.png) 0 0 no-repeat;}
#playerDisplay h3 {float: left; border: none; color: #3b808f;}
#playerDisplay .playerArtistsName {margin: 0 0 0 10px; padding: 0 0 0 10px; border-left: 1px solid #46afc5; color: #46afc5;}
#playerDisplay #playerRating {float: left; margin: 3px 0 0 10px; width: 69px; height: 13px; background: url(../images/player/player_rating.png) 0 0 no-repeat;}
#playerDisplay h4 {color: #3b808f;}
#playerDisplay .ratemsg {font-size: 10px; color: #333; float: left; margin: 0 0 0 10px; padding: 4px; -webkit-border-radius: 3px; -moz-border-radius: 3px; background-color: #46afc5;}
#playerDisplay h5 {font-weight: normal; color: #3b808f;}
/* TIME SLIDER WRAP */
#timeSliderWrap {position: relative; margin: 13px 0 0 0; padding: 1px 0 0 0; height: 14px;}
#timeSliderWrap .timeStart {position: absolute; top: 0; left: 0; font-size: 12px; font-weight: bold; color: #3b808f;}
#timeSlider {position: relative; margin: 0 56px; width: 446px; height: 12px; background: url(../images/player/time_slider_bg.png) 0 0 no-repeat;}
#timeSlider .trackMark {position: absolute; width: 2px; height: 12px; background-color: #55b8cd;}
#timeSliderWrap .timeEnd {position: absolute; top: 0; right: 0; font-size: 12px; font-weight: bold; color: #3b808f;}
/* TIME SLIDER HANDLE */
#timeHandle {position: absolute; width: 14px; height: 14px; cursor: move; background: url(../images/player/volume_control_handle.png) top left no-repeat;}
/* CONTENT */
#contentWrap {margin: 0 auto 30px auto; padding: 20px 0 0 0; width: 980px; background: url(../images/content_bg.png) top left repeat-y;}
#content {margin: 0 20px; width: 940px; background-color: #fff;}
#contentWrapBtm {width: 980px; height: 30px; background: url(../images/content_wrap_btm.png) bottom left no-repeat;}
/* BETA SIGN UP FORM */
.betaSignUpForm {margin: 0 0 20px 0; padding: 20px; width: 660px; background-color: #e0f7ff; -webkit-border-radius: 5px; -moz-border-radius: 5px;}
.betaSignUpForm legend {display: none;}
.betaSignUpForm label {font-size: 18px; font-weight: bold; color: #000;}
.betaSignUpForm input {float: left; width: 572px; margin: 5px 0 0 0; padding: 6px; height: 16px; border: 1px solid #bbb; font-family: arial, helvetica, sans-serif; font-size: 14px; color: #46afc5; background-color: #fff; -webkit-border-bottom-left-radius: 3px; -moz-border-radius-topleft: 3px; -moz-border-radius-bottomleft: 3px;}
.betaSignUpForm input:hover {border: 1px solid #888;}
.betaSignUpForm input.submit {float: left; margin: 5px 0 0 0; width: 74px; height: 30px; border: none; background: url(../images/submit_btn_inline.png) 0 0 no-repeat; cursor: pointer; -webkit-border-radius: 0; -moz-border-radius: 0;}
.betaSignUpForm input.submit:hover {background-position: 0 -30px;}
/* LEFT COLUMN */
#leftColumn {float: left; margin: 0 20px 0 0; width: 700px;}
#leftColumn h2 {margin: 0; border: none;}
/* SET LIST */
.setList {float left; margin: 20px 0 30px 0; width: 700px;}
/* SET LIST HEADING */
.setListHeading {width: 700px; height: 40px; background: url(../images/leftcol_heading_bg.png) top left no-repeat; font-size: 18px; color: #fff; font-weight: bold;}
.setListHeading .favorite {float: left; margin: 13px 0 0 50px; width: 16px; height: 16px; background: url(../images/tracklist_heading_heart.png) 0 0 no-repeat;}
.setListHeading p {float: left; margin: 8px 0 0 20px;}
.setListHeading .trackNumber {float: left;}
.setListHeading .trackName {float: left; margin: 0 0 0 20px;}
.setListHeading .title {float: left;}
.setListHeading .artistName {float: left; margin: 0 0 0 230px;}
.setListHeading .date {float: left; margin: 0 0 0 346px;}
.setListHeading .buyTrack {float: left; margin: 0 0 0 80px;}
.setListHeading .runTime {float: left; margin: 0 0 0 24px;}
.setListHeading .rating {float: left; margin: 0 0 0 22px;}
/* TRACK ODD */
.setList .trackOdd {width: 700px; height: 30px; font-size: 14px; color: #2d3133;}
.setList .trackOdd:hover {-webkit-border-radius: 5px; -moz-border-radius: 5px; background-color: #46afc5; color: #fff; cursor: pointer;}
.setList .trackOdd p {float: left; margin: 6px 0 0 20px;}
.setList .trackOdd .trackNumber {float: left; width: 20px;}
.setList .trackOdd .trackName {float: left; width: 310px; margin: 0 0 0 25px;}
.setList .trackOdd .title {float: left; width: 355px;}
.setList .trackOdd .date {float: left; margin: 0 0 0 45px;}
.setList .trackOdd .runTime {float: left; margin: 0 0 0 55px;}
.setList .trackOdd .rating {float: left; margin: 0 0 0 35px;}
/* TRACK EVEN */
.setList .trackEven {width: 700px; height: 30px; -webkit-border-radius: 5px; -moz-border-radius: 5px; background-color: #e0f7ff; font-size: 14px; color: #2d3133;}
.setList .trackEven:hover {-webkit-border-radius: 5px; -moz-border-radius: 5px; background-color: #46afc5; color: #fff; cursor: pointer;}
.setList .trackEven p {float: left; margin: 6px 0 0 20px;}
.setList .trackEven .trackNumber {float: left; width: 20px;}
.setList .trackEven .trackName {float: left; width: 310px; margin: 0 0 0 25px;}
.setList .trackEven .title {float: left; width: 355px;}
.setList .trackEven .date {float: left; margin: 0 0 0 45px;}
.setList .trackEven .runTime {float: left; margin: 0 0 0 55px;}
.setList .trackEven .rating {float: left; margin: 0 0 0 35px;}
/* TRACK LIST */
.trackList {margin: 0 0 30px 0; width: 700px;}
/* TRACK LIST HEADING */
.trackListHeading {width: 700px; height: 40px; background: url(../images/leftcol_heading_bg.png) top left no-repeat; font-size: 18px; color: #fff; font-weight: bold;}
.trackListHeading .favorite {float: left; margin: 13px 0 0 20px; width: 16px; height: 16px; background: url(../images/tracklist_heading_heart.png) 0 0 no-repeat;}
.trackListHeading p {float: left; margin: 8px 0 0 20px;}
.trackListHeading .trackNumber {float: left;}
.trackListHeading .trackName {float: left; margin: 0 0 0 20px;}
.trackListHeading .artistName {float: left; margin: 0 0 0 230px;}
.trackListHeading .buyTrack {float: left; margin: 0 0 0 105px;}
/* TRACK ODD */
.trackOdd {width: 700px; height: 30px; font-size: 14px; color: #2d3133;}
.trackOdd:hover {-webkit-border-radius: 5px; -moz-border-radius: 5px; background-color: #46afc5; color: #fff; cursor: pointer;}
.trackOdd .favorite {float: left; margin: 7px 0 0 20px; width: 16px; height: 16px;}
.trackOdd .favorite a {display: block; width: 16px; height: 16px; background: url(../images/favorite_icon_whitebg.png) 0 0 no-repeat;}
.trackOdd .favorite a:hover {background-position: 0 -16px;}
.trackOdd .notfavorite {float: left; margin: 7px 0 0 20px; width: 16px; height: 16px;}
.trackOdd .notfavorite a {display: block; width: 16px; height: 16px; background: url(../images/favorite_icon_whitebg.png) 0 -16px no-repeat;}
.trackOdd .notfavorite a:hover {background-position: 0 0;}
.trackOdd p {float: left; margin: 6px 0 0 28px;}
.trackOdd .trackNumber {float: left; width: 20px;}
.trackOdd .trackName {float: left; width: 310px; margin: 0 0 0 25px;}
.trackOdd .artistName {float: left; margin: 0 0 0 20px; width: 180px;}
.trackOdd .buyTrack {float: right; margin: 7px 20px 0 30px; width: 30px; height: 15px;}
.trackOdd .buyTrack a {display: block; width: 30px; height: 15px; background: url(../images/buy_btn.png) 0 0 no-repeat;}
.trackOdd .buyTrack a:hover {background-position: 0 -15px;}
/* TRACK EVEN */
.trackEven {width: 700px; height: 30px; -webkit-border-radius: 5px; -moz-border-radius: 5px; background-color: #e0f7ff; font-size: 14px; color: #2d3133;}
.trackEven:hover {-webkit-border-radius: 5px; -moz-border-radius: 5px; background-color: #46afc5; color: #fff; cursor: pointer;}
.trackEven .favorite {float: left; margin: 7px 0 0 20px; width: 16px; height: 16px;}
.trackEven .favorite a {display: block; width: 16px; height: 16px; background: url(../images/favorite_icon_whitebg.png) 0 0 no-repeat;}
.trackEven .favorite a:hover {background-position: 0 -16px;}
.trackEven .notfavorite {float: left; margin: 7px 0 0 20px; width: 16px; height: 16px;}
.trackEven .notfavorite a {display: block; width: 16px; height: 16px; background: url(../images/favorite_icon_whitebg.png) 0 -16px no-repeat;}
.trackEven .notfavorite a:hover {background-position: 0 0;}
.trackEven p {float: left; margin: 6px 0 0 28px;}
.trackEven .trackNumber {float: left; width: 20px;}
.trackEven .trackName {float: left; width: 310px; margin: 0 0 0 25px;}
.trackEven .artistName {float: left; margin: 0 0 0 20px; width: 180px;}
.trackEven .buyTrack {float: right; margin: 7px 20px 0 30px; width: 30px; height: 15px;}
.trackEven .buyTrack a {display: block; width: 30px; height: 15px; background: url(../images/buy_btn.png) 0 0 no-repeat;}
.trackEven .buyTrack a:hover {background-position: 0 -15px;}
/* TRACK CURRENTLY PLAYING TRACK */
.trackCurrent {width: 700px; height: 30px; background-color: #e64804; font-size: 14px; color: #fff; -webkit-border-radius: 5px; -moz-border-radius: 5px;}
.trackCurrent .favorite {float: left; margin: 7px 0 0 20px; width: 16px; height: 16px;}
.trackCurrent .favorite a {display: block; width: 16px; height: 16px; background: url(../images/favorite_icon_whitebg.png) 0 0 no-repeat;}
.trackCurrent .favorite a:hover {background-position: 0 -16px;}
.trackCurrent .notfavorite {float: left; margin: 7px 0 0 20px; width: 16px; height: 16px;}
.trackCurrent .notfavorite a {display: block; width: 16px; height: 16px; background: url(../images/favorite_icon_whitebg.png) 0 -16px no-repeat;}
.trackCurrent .notfavorite a:hover {background-position: 0 0;}
.trackCurrent p {float: left; margin: 6px 0 0 28px;}
.trackCurrent .trackNumber {float: left; width: 20px;}
.trackCurrent .trackName {float: left; width: 310px; margin: 0 0 0 25px;}
.trackCurrent .artistName {float: left; margin: 0 0 0 20px; width: 120px;}
.trackCurrent .buyTrack {float: right; margin: 7px 20px 0 30px; width: 30px; height: 15px;}
.trackCurrent .buyTrack a {display: block; width: 30px; height: 15px; background: url(../images/buy_btn.png) 0 0 no-repeat;}
.trackCurrent .buyTrack a:hover {background-position: 0 -15px;}
/* SEARCH FORM */
.searchForm {margin: 0 0 20px 0; padding: 20px 20px 10px 20px; width: 660px; background-color: #e0f7ff; -webkit-border-radius: 5px; -moz-border-radius: 5px;}
.searchForm legend {display: none;}
.searchForm input {float: left; width: 572px; padding: 6px; height: 16px; border: 1px solid #bbb; font-family: arial, helvetica, sans-serif; font-size: 14px; color: #46afc5; background-color: #fff; -webkit-border-top-left-radius: 3px; -webkit-border-bottom-left-radius: 3px; -moz-border-radius-topleft: 3px; -moz-border-radius-bottomleft: 3px;}
.searchForm input:hover {border: 1px solid #888;}
.searchForm input.submit {float: left; width: 74px; height: 30px; border: none; background: url(../images/submit_btn_inline.png) 0 0 no-repeat; cursor: pointer; -webkit-border-radius: 0; -moz-border-radius: 0;}
.searchForm input.submit:hover {background-position: 0 -30px;}
/* SEARCH TABS */
#searchTabs {margin: 10px 0 0 0;}
#searchTabs .title {float: left; margin: 5px 10px 0 0; font-weight: bold; font-size: 14px; color: #000;}
#searchTabs ul {float: left;}
#searchTabs li {display: inline; height: 50px;}
#searchTabs a {float: left; margin: 0 5px 0 0; padding: 5px 10px; color: #2d3133; font-size: 14px; font-weight: bold; text-decoration: none; -webkit-border-radius: 3px; -moz-border-radius: 3px;}
#searchTabs a:hover, #searchTabs a.selected {color: #fff; text-decoration: none; background-color: #e64804; -webkit-border-radius: 3px; -moz-border-radius: 3px;}
/* SEARCH RESULTS */
.searchResults {width: 700px; margin: 0 0 20px 0;}
.searchResults .img {border: none;}
/* SET TABS */
.setTabs {float: left; text-align: center; margin: 5px; padding: 20px 10px 0 10px; width: 203px; -webkit-border-radius: 5px; -moz-border-radius: 5px; background-color: #e0f7ff;}
.setTabs:hover {color: #fff; -webkit-border-radius: 5px; -moz-border-radius: 5px; background-color: #2d3133;}
.setTabs .thumb {margin: 0 auto 5px auto; padding: 5px; border: 1px solid #bbb; width: 120px; height: 120px; background-color: #fff; overflow: hidden;}
.setTabs a:hover .thumb {border: 1px solid #bbb; background-color: #fff;}
.setTabs .blurb {text-align: center; margin: 0 auto;}
/* SEARCH RESULTS ITEM EVEN */
.searchResultsItemEven {clear: both; padding: 10px; width: 680px; height: 38px; overflow: auto; cursor: pointer;}
.searchResultsItemEven:hover {-webkit-border-radius: 5px; -moz-border-radius: 5px; background-color: #2d3133; color: #fff;}
.searchResultsItemEven .thumbWrap {float: left; margin: 0 10px 0 0; padding: 2px; border: 1px solid #bbb; background-color: #fff;}
.searchResultsItemEven .thumb {width: 32px; height: 32px; background-color: #fff; overflow: hidden;}
.searchResultsItemEven .thumbWrap:hover {background-color: #46afc5; border: 1px solid #46afc5;}
.searchResultsItemEven .blurb {float: left;}
/* SEARCH RESULTS ITEM ODD */
.searchResultsItemOdd {clear: both; padding: 10px; width: 680px; height: 38px; -webkit-border-radius: 5px; -moz-border-radius: 5px; background-color: #e0f7ff; overflow: auto; cursor: pointer;}
.searchResultsItemOdd:hover {-webkit-border-radius: 5px; -moz-border-radius: 5px; background-color: #2d3133; color: #fff;}
.searchResultsItemOdd .thumbWrap {float: left; margin: 0 10px 0 0; padding: 2px; border: 1px solid #bbb; background-color: #fff;}
.searchResultsItemOdd .thumb {width: 32px; height: 32px; background-color: #fff; overflow: hidden;}
.searchResultsItemOdd .thumbWrap:hover {background-color: #46afc5; border: 1px solid #46afc5;}
.searchResultsItemOdd .blurb {float: left;}
/* COMMENTS */
.comments {width: 700px;}
/* INDIVIDUAL COMMENTS */
.commentWrap {margin: 10px 0 0 0; width: 700px;}
.commentWrap .user {clear: left; float: left; width: 140px; text-align: center;}
.commentWrap .thumb {width: 60px; height: 60px; overflow: hidden;}
.commentWrap a.thumb {border: 1px solid #cadee5;}
.commentWrap a:hover .thumb {border: 1px solid #46afc5;}
.commentWrap a {font-weight: bold; color: #e64804;}
.commentBubble {float: left; padding: 0 0 0 20px; width: 460px; background: url(../images/comment_arrow.png) top left no-repeat;}
.commentBubble .boxTopBlue {float: left; width: 540px; height: 10px; background: url(../images/box_top_blue_540.png) top left no-repeat;}
.commentBubble p {margin: 10px 0 0 0; padding: 10px 20px; width: 500px; background-color: #e0f7ff;}
.commentBubble .boxBtmBlue {width: 540px; height: 10px; background: url(../images/box_btm_blue_540.png) bottom left no-repeat;}
/* PAGINATION */
.pagination {margin: 20px 0; width: 700px; text-align: center;}
.pagination ul {margin: 8px 0 0 0;}
.pagination li {display: inline;}
.pagination a {padding: 5px 10px; color: #2d3133; font-size: 14px; font-weight: bold; text-decoration: none; background-color: #e0f7ff; -webkit-border-radius: 3px; -moz-border-radius: 3px;}
.pagination a:hover{color: #fff; background-color: #e64804;}
.pagination .current {padding: 5px 10px; color: #fff; font-size: 14px; font-weight: bold; text-decoration: none; background-color: #e64804; -webkit-border-radius: 3px; -moz-border-radius: 3px;}
.next_page, a.next_page {padding: 5px 10px; color: #fff; font-size: 14px; font-weight: bold; text-decoration: none; background-color: #000; -webkit-border-radius: 3px; -moz-border-radius: 3px;}
.next_page, a.prev_page {padding: 5px 10px; color: #fff; font-size: 14px; font-weight: bold; text-decoration: none; background-color: #000; -webkit-border-radius: 3px; -moz-border-radius: 3px;}
.disabled { display: none;}
/* PAGINATION */
.pagination {margin: 20px 0; width: 700px; text-align: center;}
.pagination ul {margin: 8px 0 0 0;}
.pagination li {display: inline;}
.pagination a {padding: 5px 10px; color: #2d3133; font-size: 14px; font-weight: bold; text-decoration: none; background-color: #e0f7ff; -webkit-border-radius: 3px; -moz-border-radius: 3px;}
.pagination a:hover, .pagination a.selected {color: #fff; background-color: #e64804;}
.pagination a.btn {margin: 10px; background-color: #000; color: #fff;}
.pagination a.btn:hover {background-color: #e64804; color: #fff;}
/* BASIC FORM */
.basicForm {padding: 20px; width: 660px; -webkit-border-radius: 5px; -moz-border-radius: 5px; background-color: #e0f7ff;}
.basicForm legend {display: none;}
.basicForm label {margin: 0; padding: 0; font-size: 12px; font-weight: bold; color: #000;}
.basicForm .caption {float: right; margin: 0 0 0 5px; font-size: 12px; font-weight: normal; color: #999;}
.basicForm a.caption {float: right; margin: 0 0 0 5px; font-size: 12px; font-weight: normal; color: #e64804;}
.basicForm input {margin: 2px 0 10px 0; padding: 6px; width: 648px; height: 16px; font-family: arial, helvetica, sans-serif; font-size: 14px; color: #46afc5; border: 1px solid #bbb; background-color: #fff; -webkit-border-radius: 3px; -moz-border-radius: 3px;}
.basicForm input:hover {border: 1px solid #888;}
.basicForm input.help:hover {border: 1px solid #46afc5;}
.basicForm input.nonField {margin: 4px 0 20px 0; padding: 0; border: none; background: none; color: #000;}
.basicForm label.error {color: #e41e26;}
.basicForm select {clear: both; margin: 3px 0 5px 0; width: 220px;}
.basicForm input.checkBox {float: left; margin: 0 10px 0 0; padding: 0; width: 14px; height: 14px;}
.basicForm label.checkBoxLabel {float: left; margin: 0 0 15px 0;}
.basicForm textarea {padding: 6px; width: 610px; font-family: arial, helvetica, sans-serif; font-size: 14px; color: #fff; border: none; background-color: #1e2426; -webkit-border-radius: 3px; -moz-border-radius: 3px;}
.basicForm input.submit {display: block; clear: both; margin: 5px 5px 0 0; width: 74px; height: 30px; border: none; background: url(../images/submit_btn.png) 0 0 no-repeat; cursor: pointer; -webkit-border-radius: 0; -moz-border-radius: 0}
.basicForm input.submit:hover {background-position: 0 -30px;}
/* COMMENT FORM */
#commentForm {padding: 20px; width: 660px; -webkit-border-radius: 5px; -moz-border-radius: 5px; background-color: #e0f7ff;}
#commentForm legend {margin: 0 0 20px 0; border-bottom: 1px solid #ccc; font-size: 18px; font-weight: bold; color: #e64804;}
#commentForm label {font-size: 14px; font-weight: bold; color: #000;}
#commentForm textarea {padding: 6px; width: 650px; font-family: arial, helvetica, sans-serif; font-size: 14px; color: #2d3133; border: 1px solid #bbb; background-color: #fff; -webkit-border-radius: 3px; -moz-border-radius: 3px;}
#commentForm textarea:hover {border: 1px solid #888;}
#commentForm input.submit {float: left; margin: 5px 0 0 0; width: 74px; height: 30px; border: none; background: url(../images/submit_btn.png) 0 0 no-repeat; cursor: pointer;}
#commentForm input.submit:hover {background-position: 0 -30px;}
/* BLOG POST SUMMARY */
.postSummary {margin: 0 0 20px 0; padding: 0 0 10px 0; border-bottom: 1px solid #cadee5;}
#leftColumn .postSummary h2 {margin: 0 0 15px 0; padding: 0; font-size: 26px; font-weight: bold; text-transform: capitalize; color: #46afc5; background: none;}
.postSummary .byLine {font-weight: bold;}
.postSummary .commentCount {float: right; padding: 0 0 0 22px; font-weight: normal; background: url(../images/comment_icon.png) 0 3px no-repeat;}
/* SCREENSHOTS */
#leftColumn .center {width: 940px; text-align: center;}
#leftColumn .center .thumb {float: left; margin: 0 20px 0 0; padding: 10px; width: 200px; height: 200px; -webkit-border-radius: 5px; -moz-border-radius: 5px; background-color: #e0f7ff;}
#leftColumn .center .thumb:hover {background-color: #2d3133;}
#leftColumn .center .thumb .last {margin: 0;}
#leftColumn .center .thumb a {display: block;}
/* RIGHT COLUMN */
#rightColumn {float: left; width: 220px;}
#rightColumn .box {margin: 0 0 20px 0; width: 220px;}
#rightColumn h2.noBg {margin: 0 0 5px 0; padding: 0; font-size: 18px; font-weight: bold; text-transform: uppercase; color: #46afc5; background: none;}
/* BLOG TAG LIST */
#rightColumn .box .tags {margin: 0 0 0 10px;}
#rightColumn .box .tags li {margin: 0 0 10px 0; padding: 0 0 10px 0; border-bottom: 1px solid #cadee5;}
#rightColumn .box .tags li.last {margin: 0; padding: 0; border: none;}
#rightColumn .box .tags a {font-weight: bold;}
/*SIGNUP NOW BUTTON */
.signupBtn {width: 160px; height: 30px;}
.signupBtn a {display: block; width: 119px; height: 30px; background: url(../images/signup_btn.png) 0 0 no-repeat;}
.signupBtn a:hover {background-position: 0 -30px;}
/* BASIC FORM */
#rightColumn .basicForm {padding: 20px; width: 180px; -webkit-border-radius: 5px; -moz-border-radius: 5px; background-color: #e0f7ff;}
#rightColumn .basicForm legend {display: none;}
#rightColumn .basicForm label {margin: 0; padding: 0; font-size: 12px; font-weight: bold; color: #000;}
#rightColumn .basicForm .caption {float: right; margin: 0 0 0 5px; font-size: 12px; font-weight: normal;}
#rightColumn .basicForm input {margin: 2px 0 10px 0; padding: 6px; width: 168px; height: 16px; font-family: arial, helvetica, sans-serif; font-size: 14px; color: #000; border: 1px solid #bbb; background-color: #fff; -webkit-border-radius: 3px; -moz-border-radius: 3px;}
#rightColumn .basicForm input:hover {border: 1px solid #888;}
#rightColumn .basicForm input.nonField {margin: 2px 0 20px 0; padding: 0; border: none; background: none; color: #000;}
#rightColumn .basicForm label.error {color: #e41e26;}
#rightColumn .basicForm select {clear: both; margin: 3px 0 5px 0; width: 220px;}
#rightColumn .basicForm input.checkBox {float: left; margin: 0 10px 0 0; padding: 0; width: 14px; height: 14px;}
#rightColumn .basicForm label.checkBoxLabel {float: left; margin: 0 0 15px 0;}
#rightColumn .basicForm textarea {padding: 6px; width: 610px; font-family: arial, helvetica, sans-serif; font-size: 14px; color: #fff; border: none; background-color: #1e2426; -webkit-border-radius: 3px; -moz-border-radius: 3px;}
#rightColumn .basicForm input.submit {clear: both; margin: 5px 5px 0 0; width: 74px; height: 30px; border: none; background: url(../images/submit_btn.png) 0 0 no-repeat; cursor: pointer; -webkit-border-radius: 0; -moz-border-radius: 0}
#rightColumn .basicForm input.submit:hover {background-position: 0 -30px;}
/* SPONSORS */
#rightColumn .sponsorBox {margin: 0 0 10px 0; width: 220px; height: 140px;}
#rightColumn .sponsorBoxLast {margin: 0;}
/* RELATED CONTENT */
#rightColumn .relatedBox {margin: 0 0 10px 0; padding: 0 10px 10px 10px; width: 200px; border-bottom: 1px solid #cadee5;}
#rightColumn .relatedBox h3 {margin: 0; padding: 0; border: none; color: #e64804;}
#rightColumn .relatedBox h3 a {color: #e64804;}
/* FOOTER */
#footer {margin: 0 auto; width: 940px;}
#footer .linkBox {float: left; margin: 0 20px 0 0; width: 140px;}
#footer .linkBox h4 {margin: 0 0 5px 0; color: #2d3133;}
#footer .linkBox li {margin: 0 0 5px 0; font-weight: bold;}
#footer p {margin: 40px 0 30px 0; font-weight: bold; color: #2d3133;}
#footer a {font-size: 14px; font-weight: normal; color: #bfd3d9; text-decoration: none;}
#footer a:hover {color: #fff; text-decoration: underline;}
/* GENERIC CLASSES
---------------------------------------------------------------------------*/
.hide {display: none;}
.clear {clear: both;}
.light {font-weight: normal;}
.small {font-size: 12px;}
.white {color: #fff;}
/* IMAGE SHADOWS */
.shadowed-image-container {position: relative; float: left; clear: both; margin: -5px 0 0 -5px;}
.shadowed-image {position: relative; margin: 0 10px 0 0; padding: 11px 8px 10px 9px;}
.shadowed-image img {position: relative; z-index: 10; border: 5px solid #fff;}
.shadow {position: absolute !important; top: 0; left: 0; border: 0 !important; z-index: 1 !important; behavior: url("/images/iepngfix.htc");}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment