/* Hide Elements * * Add the corresponding class to the * tag in template.html to activate. * * Usage Examples: * * * * You can apply multiple changes to the theme * by using multiple classes at once. * * IMPORTANT: Make sure they're spaced apart like the example below. * * --------------------------------------------- */ /* Hide Site Name * * Class: hide_sitename ------------------------------ */ body.hide_gradbar .grad-bar { display:none; } /* Hide Header Social Navigation * * Class: hide_socialnav ------------------------------ */ body.hide_socialnav .first-area .social-nav { display:none; } /* Hide Search Form * & Center Social Navigation text * * Class: hide_searchbox ------------------------------ */ body.hide_searchform .header-content .social-nav-wrap #searchform { display:none; } body.hide_searchform .social-nav { margin:0 auto!important; display:block; float:none; text-align:center; overflow:hidden; ul li { float:none; display:inline; } } /* Hide Master Header * * Class: hide_masthead ------------------------------ */ body.hide_masthead .mast-head { display:none; } body.hide_masthead .mast-head-txt { display:block; margin:0 auto 35px; height:110px; } body.hide_masthead .header-content { margin:0 auto 15px; } @media screen and (max-width:980px) { body.hide_masthead .mast-head-txt { display:none; } } /* Hide Site Disclaimer * * Class: hide_disclaim ------------------------------ */ body.hide_disclaim .disclaimer { display:none; } body.hide_disclaim .site-footer .social-nav { margin:0 auto -10px; } /* Change Body Font Size * * Default font size is 15px * --------------------------------------------- */ body, .listbox, .textinput, textarea, select, .statlink h2, td .tableh1:last-child, .thumb_title_title, .tableb { font-size:; } .catlink { font-size:; } .catrow span.cat-desc { font-size:; } /* HOW TO CHANGE YOUR THEME COLORS: * * Place your color HEX code in the empty selector * between the : and ; symbols. * * Usage examples: * * background-color: #ffffff; * color: #ffffff; * * If nothing changes after refreshing your * browser, clear your browser cache. --------------------------------------------- */ /* Gradient Bar & Text Colors * * Color: #7EBA99, #d7b399, #6f6462 --------------------------------------------- */ .grad-bar, .grad-bar-mobile { background: linear-gradient(to right, #c3561b 0%, #c3561b 28%, #c3561b 28%, #d89b6e 28%, #d89b6e 68%, #6f6462 68%); background-size:450px; background-repeat:repeat-x; } .mast-head-txt .site-title h1 span, .tableh1 span { background: linear-gradient(to right, #c3561b 0%, #c3561b 30%, #d89b6e 65%, #d89b6e 100%); -webkit-background-clip: text; } /* Theme Accent Color #1 * * Color: #7EBA99 --------------------------------------------- */ /* Elements that use the Accent color for a background color. --------------------------------------------- */ *::-webkit-scrollbar-thumb, *::-webkit-scrollbar-thumb:active, .header-content .social-nav-wrap, .mobile-name .mobile-overlay, .site-footer:after, .site-footer .credit:hover, .button:hover, .buttonlist ul li a:hover, .button:focus, .buttonlist ul li a:focus, button:hover, button:focus { background-color:#c3561b; } .header-content .social-nav-wrap { background: #c3561b; } /* Elements that use the Accent color for a text color. --------------------------------------------- */ .first-area .site-title span, .site-footer .site-footer-name span, a:hover, a:focus, i, em, .catlink a:hover, .tableh1 a:hover, .tableh1 a:focus, .tableh1-alt a:hover, .tableh1 .statlink a:hover, .tableh1 .statlink a:focus, .thumb_caption_ctime:after { color:#c3561b; } /* Accent Text Color * * This is the color of the text for all elements * using the Accent color for a background color. * * Choose your color wisely so text is readable. --------------------------------------------- */ .social-nav ul li a:visited:hover, .social-nav ul li a:hover, .social-nav ul li a:focus, button:hover, button:focus, .tableh1-alt, .navmenu-active { color:HEX_CODE; } /* Theme Accent Color #2 * * Color: #D7B399 --------------------------------------------- */ /* Elements that use the Accent color for a background color. --------------------------------------------- */ .main-nav ul li a:before, .cpg-nav a:hover, .cpg-nav a:focus, .button:hover, .buttonlist ul li a:hover, .button:focus, .buttonlist ul li a:focus, .image:hover, .catlink b:before, .navmenu-active { background-color:#d89b6e; border-color:#d89b6e; } /* Elements that use the Accent color for a text color. --------------------------------------------- */ .main-nav ul li a:after, .main-nav ul li a:hover { color:#d89b6e; } .cpg-nav a:hover, .cpg-nav a:focus, .catlink b:before, .tableh1 span a { color:HEX_CODE; } .tableh1 a:hover, .tableh1 a:focus, .tableh1 .statlink a:hover, .tableh1 .statlink a:focus, .tableh1-alt a:hover { color:HEX_CODE; box-shadow:inset 0 -1px 0 HEX_CODE; } /* Header Image * * You can change the height and width of the * header if your header is smaller or bigger. * --------------------------------------------- */ /* Here you can input a different filename * for your new header, otherwise leave it as * it is if your file name is the same as the * one already being used. * * You can also adjust the height and width * to accomdate your custom header if yours * is wider or shorter than the default one. * * Default height: 600px * Default Width: 1300px --------------------------------------------- */ .mast-head { height: 450px; max-width: 2000px; background-image:url('./images/header.png'); background-image:url('./images/header.jpg'); } /* Mobile Layout Options --------------------------------------------- */ .mobile-name .overlay { background-color:#d89b6e; } @media screen and (max-width:980px) { .mobile-name h1, .site-navigation, .main-nav ul li, .main-nav ul li a, .show-menu { color:HEX_CODE!important; } } /* Pic Title and Caption --------------------------------------------- */ .pic_title { color: #666666; } .pic_caption { color: #747474; }