
html, body {
    background-color: #fff;
    color: #444;
    font-family: "Lucida Grande",Helvetica,Arial,"Arial Unicode",sans-serif;
    font-size: 12px;
    height: 100%;
    margin: 0;
    padding: 0;
}
img {
    border: medium none;
}
a {
    color: #333;
    text-decoration: underline;
}
a:hover {
    text-decoration: none;
}
.clear {
    clear: both;
}
.pageErrors {
    background-color: #f7f7f7;
    border: 2px solid red;
    float: left;
    padding: 10px;
    width: 521px;
}
.pageErrors li, .pageSuccess li {
    font-size: 14px;
    list-style: outside none none;
    margin: 0;
    padding: 0;
}
.pageSuccess {
    background-color: #f7f7f7;
    border: 2px solid green;
    float: left;
    padding: 10px;
    width: 521px;
}
td {
    vertical-align: top;
}
.mainPageContainer {
    background-color: #fff;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
}
.pageContainer {
    float: left;
}
.mainPageContent {
    float: left;
    width: 100%;
}
.toolbarContainer {
    background-color: #f7f7f7;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
}
.pageMainContent {
    min-height: 300px;
}
.genericPageTitle h1 {
    font-size: 16px;
}
.genericPageTitle .contentRight {
    float: right;
}
.genericPageTitle .contentLeft {
    float: left;
}
.pageInnerContainer {
    margin: 8px 6px 6px;
}
.fontPreviewHeader {
    background-color: #ddd;
    clear: both;
    font-size: 13px;
    width: 100%;
}
.fontPreviewHeaderInner {
    padding: 6px;
}
.fontPreviewHeader a {
    color: #222;
    font-weight: bold;
    text-decoration: none;
}
.fontPreviewHeader a:hover {
    text-decoration: underline;
}
.fontPreviewImageWrapper {
    clear: both;
    cursor: pointer;
    height: 92px;
    margin-top: 5px;
}
.fontPreviewImageWrapperDefault {
    clear: both;
    height: 92px;
    margin-top: 5px;
}
.fontPreviewImageWrapper .rightSection, .fontPreviewImageWrapperDefault .rightSection {
    cursor: default;
    float: right;
    height: 92px;
    width: 260px;
}
.fontPreviewImageWrapper .rightSection .downloadButton, .fontPreviewImageWrapperDefault .rightSection .downloadButton, .fontPreviewImageWrapper .rightSection .detailsButton, .fontPreviewImageWrapperDefault .rightSection .detailsButton {
    float: right;
}
.fontPreviewImageWrapper .rightSection .downloadButton .downloadButtonElement, .fontPreviewImageWrapperDefault .rightSection .downloadButton .downloadButtonElement {
    background: #2c9f67 none repeat scroll 0 0;
    border: 1px solid #2c9f67;
    border-radius: 5px;
    color: #f7f7f7;
    cursor: pointer;
    font-weight: bold;
    margin-left: 5px;
    margin-top: 60px;
    padding: 5px 10px;
}
.fontPreviewImageWrapper .rightSection .downloadButtonQueueSelected, .fontPreviewImageWrapperDefault .rightSection .downloadButtonQueueSelected {
    background: #ccc none repeat scroll 0 0;
    border: 1px solid #ccc;
    border-radius: 5px;
    color: #f7f7f7;
    cursor: pointer;
    font-weight: bold;
    margin-left: 5px;
    margin-top: 40px;
    padding: 5px 10px;
}
.fontPreviewImageWrapper .rightSection .detailsButton .detailsButtonElement, .fontPreviewImageWrapperDefault .rightSection .detailsButton .detailsButtonElement {
    background: #777 none repeat scroll 0 0;
    border: 1px solid #777;
    border-radius: 5px;
    color: #f7f7f7;
    cursor: pointer;
    font-weight: bold;
    margin-left: 5px;
    margin-top: 60px;
    padding: 5px 10px;
}
.fontPreviewImageWrapper .rightSection .downloadButton .downloadButtonElement:hover, .fontPreviewImageWrapperDefault .rightSection .downloadButton .downloadButtonElement:hover {
    background: #333 none repeat scroll 0 0;
    border: 1px solid #333;
}
.fontPreviewImageWrapper .rightSection .downloadButton .downloadButtonElement a, .fontPreviewImageWrapperDefault .rightSection .downloadButton .downloadButtonElement a {
    color: #f7f7f7;
    text-decoration: none;
}
.fontPreviewImageWrapper .rightSection .downloadButton .downloadButtonQueueSelected:hover, .fontPreviewImageWrapperDefault .rightSection .downloadButton .downloadButtonQueueSelected:hover {
    background: #333 none repeat scroll 0 0;
    border: 1px solid #333;
}
.fontPreviewImageWrapper .rightSection .downloadButton .downloadButtonQueueSelected a, .fontPreviewImageWrapperDefault .rightSection .downloadButton .downloadButtonQueueSelected a {
    color: #f7f7f7;
    text-decoration: none;
}
.fontPreviewImageWrapper .rightSection .detailsButton .detailsButtonElement:hover, .fontPreviewImageWrapperDefault .rightSection .detailsButton .detailsButtonElement:hover {
    background: #333 none repeat scroll 0 0;
    border: 1px solid #333;
}
.fontPreviewImageWrapper .rightSection .detailsButton .detailsButtonElement a, .fontPreviewImageWrapperDefault .rightSection .detailsButton .detailsButtonElement a {
    color: #f7f7f7;
    text-decoration: none;
}
.fontPreviewWrapper {
    margin-bottom: 3px;
}
.fontPreviewWrapper:hover {
}
.fontPreviewTitle {
    float: left;
}
.rateFontBlock {
    float: right;
    margin-right: 3px;
    width: 90px;
}
.rateFontText {
    background: #fff none repeat scroll 0 0;
    display: none;
    float: right;
    font-size: 13px;
    height: 20px;
    margin-right: 102px;
    padding-top: 22px;
    text-align: right;
    width: 60px;
}
.rateFontBlock .starsOn, .rateFontBlock .starsOff {
    height: 17px;
    position: absolute;
    width: 90px;
}
.rateFontBlock .starsOn {
    background: rgba(0, 0, 0, 0) url("../images/stars_on.png") no-repeat scroll left bottom;
    z-index: 11;
}
.rateFontBlock .starsOff {
    background: rgba(0, 0, 0, 0) url("../images/stars_off.png") no-repeat scroll right bottom;
    z-index: 10;
}
.categoryBar {
    background-color: #eee;
    font-size: 12px;
    margin-bottom: 12px;
    margin-top: 15px;
    overflow: hidden;
    width: 100%;
}
.categoryBarInner {
    background: #ccc none repeat scroll 0 0;
    border: 0 solid #777;
    padding: 12px 6px;
}
.letterListing {
    margin-left: auto;
    margin-right: auto;
}
.categoryLink {
    width: 22%;
}
.letterLink {
    text-align: center;
    width: 14px;
}
.categoryLink, .letterLink {
    float: left;
    padding: 2px 5px;
}
.categoryLink:hover, .letterLink:hover {
    background-color: #ccc;
    cursor: pointer;
}
.categoryLink:hover a, .letterLink:hover a {
    color: #f7f7f7;
    font-weight: bold;
    text-decoration: underline;
}
.categoryLink a, .letterLink a {
    text-decoration: none;
}
.categoryLink a:hover, .letterLink a:hover {
    text-decoration: underline;
}
.settingsBar {
    background-color: #eee;
    font-size: 12px;
    margin-bottom: 20px;
    overflow: hidden;
    width: 100%;
}
.mainNavBar {
    background-color: #555;
    color: #aaa;
    font-size: 14px;
    overflow: hidden;
    width: 100%;
}
.mainNavBar a {
    color: #f7f7f7;
    text-decoration: none;
}
.mainNavBar a:hover {
    text-decoration: underline;
}
.mainNavBarInner {
}
.mainNavBarInner .navBarLeftLinks {
    float: left;
    padding: 11px 18px 10px 10px;
}
.toolbarContainerInner {
    margin-bottom: 20px;
}
.pagingWrapper {
    float: right;
    padding-bottom: 10px;
    padding-top: 20px;
}
.pagingWrapper .pagingLink, .pagingWrapper .pagingLinkOff, .pagingWrapper .pagingLinkSelected {
    float: left;
    margin-right: 5px;
    padding: 3px 6px;
}
.pagingWrapper .pagingLink {
    background: #4096ee none repeat scroll 0 0;
    border: 1px solid #4096ee;
    color: #f7f7f7;
    cursor: pointer;
}
.pagingWrapper .pagingLink:hover {
    background: #f7f7f7 none repeat scroll 0 0;
}
.pagingWrapper .pagingLinkOff {
    background: #ddd none repeat scroll 0 0;
    border: 1px solid #ddd;
    color: #f7f7f7;
}
.pagingWrapper .pagingLinkSelected {
    background: #f7f7f7 none repeat scroll 0 0;
    border: 1px solid #f7f7f7;
}
.pagingWrapper .pagingLinkSelected a {
    color: #4096ee;
    font-weight: bold;
    text-decoration: none;
}
.pagingWrapper .pagingLink a {
    color: #f7f7f7;
    font-weight: bold;
    text-decoration: none;
}
.pagingWrapper .pagingLink:hover a {
    color: #000;
}
.pagingLabelWrapper {
    float: left;
    font-size: 13px;
    font-weight: bold;
    padding-right: 12px;
    padding-top: 24px;
}
.footer {
    background-color: #999;
    color: #f7f7f7;
    padding: 16px;
    text-align: center;
}
.footer a {
    color: #f7f7f7;
    text-decoration: underline;
}
.footer a:hover {
    text-decoration: none;
}
.pageDetailsLeft {
    display: block;
    float: left;
    padding-right: 20px;
    width: 550px;
}
.pageDetailsRight {
    display: block;
    float: left;
    width: 550px;
}
.characterMap {
    float: left;
    padding-top: 8px;
}
.fontArchiveContents {
    float: left;
    padding-top: 8px;
    width: 541px;
}
.fontArchiveContents table {
    border-left: 1px solid #ccc;
    border-right: 1px solid #ccc;
    border-top: 1px solid #ccc;
}
.fontArchiveContents th, .fontArchiveContents td {
    border-bottom: 1px solid #ccc;
    padding: 7px;
}
.fontArchiveContents th {
    background: #dddddd none repeat scroll 0 0;
    color: #666;
    text-align: left;
}
.fontArchiveContents tr:hover {
    background: #efefef none repeat scroll 0 0;
}
.fontArchiveContents a {
    text-decoration: none;
}
.fontArchiveContents a:hover {
    text-decoration: underline;
}
.userCommentsForm {
    padding-top: 14px;
}
.userCommentsForm .formLabel {
    float: left;
    width: 100px;
}
.userCommentsForm textarea {
    height: 50px;
    width: 400px;
}
.userCommentsForm label {
    padding-left: 10px;
}
.userCommentsForm input {
    width: 250px;
}
.userCommentsForm .submitButton {
    width: 130px;
}
.userCommentsForm .userCommentsIntro {
    float: left;
    padding-bottom: 20px;
    width: 541px;
}
.userCommentsList {
    padding-top: 8px;
}
.userCommentsList .commentRight {
    display: block;
    float: left;
}
.userCommentsList .commentLeft {
    color: #bbb;
    display: block;
    float: left;
    font-size: 24px;
    font-weight: bold;
    overflow: hidden;
    width: 40px;
}
.userCommentsList .commentHead {
    color: #bbb;
}
.userCommentsList .commentsWrapper {
    border-bottom: 1px solid #bbb;
    padding-bottom: 10px;
    padding-top: 10px;
}
.userCommentsList .commentFirst {
    border-top: 1px solid #bbb;
}
.userCommentsList .commentBody {
    width: 500px;
}
.mainHeaderAds {
    float: right;
    margin-top: 5px;
    text-align: right;
}
.headerBar {
    height: 102px;
}
.leftPageAds {
    float: left;
    padding-right: 20px;
}
.rightPageAds {
    float: left;
    padding-left: 20px;
}
.footerPageAds {
    margin-left: auto;
    margin-right: auto;
    padding: 14px;
    text-align: center;
}
.customPreviewSettings {
    font-size: 14px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}
.customPreviewSettings .customPreviewTextLabel, .customPreviewSettings .customPreviewTextColourLabel, .customPreviewSettings .customPreviewTextInput, .customPreviewSettings .customPreviewTextColourPicker, .customPreviewSettings .customPreviewTextSubmit {
    float: left;
}
.customPreviewSettings .customPreviewTextLabel, .customPreviewSettings .customPreviewTextColourLabel {
    padding-right: 5px;
    padding-top: 2px;
}
.customPreviewSettings .customPreviewTextInput {
    margin-bottom: 8px;
    padding-right: 16px;
}
.customPreviewSettings .colourPickerBox {
    margin-right: 14px;
}
.customPreviewSettings .customPreviewTextInput input {
    width: 240px;
}
.submitFontForm {
    padding-left: 30px;
    padding-top: 20px;
}
.submitFontForm label {
    float: left;
    padding: 5px;
    width: 200px;
}
.submitFontForm div {
    clear: right;
    padding: 5px;
}
.submitFontForm input, .submitFontForm select, .submitFontForm textarea {
    width: 400px;
}
.submitFontForm textarea {
    height: 100px;
}
.submitFontForm .submitButton {
    width: 120px;
}
.yui-overlay, .yui-panel-container {
    position: absolute;
    visibility: hidden;
    z-index: 2;
}
.yui-panel {
    position: relative;
}
.yui-panel-container form {
    margin: 0;
}
.mask {
    bottom: 0;
    display: none;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 1;
}
.mask.block-scrollbars {
    overflow: auto;
}
.masked select, .drag select, .hide-select select {
}
.yui-panel-container select {
}
.hide-scrollbars, .hide-scrollbars * {
    overflow: hidden;
}
.hide-scrollbars select {
    display: none;
}
.show-scrollbars {
    overflow: auto;
}
.yui-panel-container.show-scrollbars, .yui-tt.show-scrollbars {
    overflow: visible;
}
.yui-panel-container.show-scrollbars .underlay, .yui-tt.show-scrollbars .yui-tt-shadow {
    overflow: auto;
}
.yui-panel-container.shadow .underlay.yui-force-redraw {
    padding-bottom: 1px;
}
.yui-effect-fade .underlay, .yui-effect-fade .yui-tt-shadow {
    display: none;
}
.yui-tt-shadow {
    position: absolute;
}
.yui-override-padding {
    padding: 0 !important;
}
.yui-panel-container .container-close {
    overflow: hidden;
    text-decoration: none;
    text-indent: -10000em;
}
.yui-overlay.yui-force-redraw, .yui-panel-container.yui-force-redraw {
    margin-bottom: 1px;
}
.mask {
    background-color: #000;
    opacity: 0.35;
}
.popupContainer .yui-panel-container {
    padding: 0 1px;
}
.popupContainer .yui-panel {
    border-color: #808080;
    border-style: solid;
    border-width: 1px 0;
    left: 0;
    position: relative;
    top: 0;
    z-index: 1;
}
.popupContainer .yui-panel .hd, .popupContainer .yui-panel .bd, .popupContainer .yui-panel .ft {
    border-color: #808080;
    border-style: solid;
    border-width: 0 1px;
    margin: 0 -1px;
}
.popupContainer .yui-panel .hd {
    border-bottom: 1px solid #ccc;
}
.popupContainer .yui-panel .bd, .popupContainer .yui-panel .ft {
    background-color: #f2f2f2;
}
.popupContainer .yui-panel .hd {
    background: rgba(0, 0, 0, 0) url("http://yui.yahooapis.com/2.8.0r4/build/assets/skins/sam/sprite.png") repeat-x scroll 0 -200px;
    color: #000;
    font-size: 93%;
    font-weight: bold;
    line-height: 2;
    padding: 0 10px;
}
.popupContainer .yui-panel .bd {
    padding: 10px;
}
.popupContainer .yui-panel .ft {
    border-top: 1px solid #808080;
    font-size: 77%;
    padding: 5px 10px;
}
.popupContainer .container-close {
    background: rgba(0, 0, 0, 0) url("http://yui.yahooapis.com/2.8.0r4/build/assets/skins/sam/sprite.png") no-repeat scroll 0 -300px;
    cursor: pointer;
    height: 15px;
    position: absolute;
    right: 6px;
    top: 5px;
    width: 25px;
}
.popupContainer .yui-panel-container .underlay {
    left: -1px;
    right: -1px;
}
.popupContainer .yui-panel-container.matte {
    background-color: #f7f7f7;
    padding: 9px 10px;
}
.popupContainer .yui-panel-container.shadow {
}
.popupContainer .yui-panel-container.shadow .underlay {
    background-color: #000;
    bottom: -3px;
    left: -3px;
    opacity: 0.12;
    position: absolute;
    right: -3px;
    top: 2px;
}
.popupContainer .yui-dialog .ft {
    border-top: medium none;
    font-size: 100%;
    padding: 0 10px 10px;
}
.popupContainer .yui-dialog .ft .button-group {
    display: block;
    text-align: right;
}
.popupContainer .yui-dialog .ft button.default {
    font-weight: bold;
}
.popupContainer .yui-dialog .ft span.default {
    background-position: 0 -1400px;
    border-color: #304369;
}
.popupContainer .yui-dialog .ft span.default .first-child {
    border-color: #304369;
}
.popupContainer .yui-dialog .ft span.default button {
    color: #f7f7f7;
}
.popupContainer .yui-dialog .ft span.yui-button-disabled {
    background-position: 0 -1500px;
    border-color: #ccc;
}
.popupContainer .yui-dialog .ft span.yui-button-disabled .first-child {
    border-color: #ccc;
}
.popupContainer .yui-dialog .ft span.yui-button-disabled button {
    color: #a6a6a6;
}
.popupContainer .yui-simple-dialog .bd .yui-icon {
    background: rgba(0, 0, 0, 0) url("http://yui.yahooapis.com/2.8.0r4/build/assets/skins/sam/sprite.png") no-repeat scroll 0 0;
    float: left;
    height: 16px;
    margin-right: 10px;
    width: 16px;
}
.popupContainer .yui-simple-dialog .bd span.blckicon {
    background-position: 0 -1100px;
}
.popupContainer .yui-simple-dialog .bd span.alrticon {
    background-position: 0 -1050px;
}
.popupContainer .yui-simple-dialog .bd span.hlpicon {
    background-position: 0 -1150px;
}
.popupContainer .yui-simple-dialog .bd span.infoicon {
    background-position: 0 -1200px;
}
.popupContainer .yui-simple-dialog .bd span.warnicon {
    background-position: 0 -1900px;
}
.popupContainer .yui-simple-dialog .bd span.tipicon {
    background-position: 0 -1250px;
}
.popupContainer .yui-tt .bd {
    background-color: #ffee69;
    border-color: #d4c237 #a6982b #a6982b;
    border-style: solid;
    border-width: 1px;
    color: #000;
    left: 0;
    padding: 2px 5px;
    position: relative;
    top: 0;
    z-index: 1;
}
.popupContainer .yui-tt.show-scrollbars .bd {
    overflow: auto;
}
.popupContainer .yui-tt-shadow {
    background-color: #000;
    bottom: -3px;
    left: -3px;
    right: -3px;
    top: 2px;
}
.popupContainer .yui-tt-shadow-visible {
    opacity: 0.12;
}
.popupContainer .yui-panel .bd li {
    padding-bottom: 10px;
}
.popupContainer {
    display: none;
}
.fontTopCategories {
    color: #888;
    float: right;
    padding-right: 14px;
    text-align: right;
}
.fontTopCategories a {
    color: #888;
    text-decoration: none;
}
.fontTopCategories a:hover {
    color: #888;
    text-decoration: underline;
}
.fontTotalDownloads {
    display: none;
    float: right;
    text-align: right;
}
.inlinePageAds {
    margin-left: auto;
    margin-right: auto;
    padding: 14px;
    text-align: center;
}
div#demoBanner {
    background-color: #333333;
    font-weight: bold;
    opacity: 0.5;
    padding: 7px;
    text-align: center;
    width: 100%;
}
div#demoBanner span {
    cursor: pointer;
}
div#demoBanner a {
}
div#demoBanner:hover {
    opacity: 1;
}
.fontDesigner {
    padding-bottom: 14px;
}
.fontDesigner table {
    border-left: 1px solid #cccccc;
    border-top: 1px solid #cccccc;
}
.fontDesigner td {
    border-bottom: 1px solid #cccccc;
    border-right: 1px solid #cccccc;
    padding: 7px;
}
.fontDesigner td:first-child {
    background-color: #dddddd;
}
.pageDetailsRight {
    color: #222222;
    padding-top: 8px;
}
.sortFilterForm {
    float: right;
    padding-top: 8px;
}
.navBarRightSearch form {
    display: inline;
    width: 160px;
}
.navBarRightSearch input {
    width: 120px;
}
body {
    margin: 0 auto;
    max-width: 1100px;
}
.mainNavBarInner .navBarRightSearch {
    float: left;
    padding: 10px 18px 10px 0;
}
.mainNavBarInner .navBarRightSearch form {
    color: #f7f7f7;
}
.footerSocial {
    clear: both;
    padding-bottom: 12px;
    text-align: center;
}
