/*-------------------------------------------------------------- >>> TABLE OF CONTENTS: ---------------------------------------------------------------- # Fonts # General Style # Header ## Navigation Menu ## Banner # Content ## Posts and Pages # Forms # Sidebar # Footer --------------------------------------------------------------*/ /*-------------------------------------------------------------- # Fonts --------------------------------------------------------------*/ @font-face { font-family: 'OpenSansRegular'; src: url('../fonts/OpenSans-Regular-webfont.eot'); src: url('../fonts/OpenSans-Regular-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/OpenSans-Regular-webfont.woff') format('woff'), url('../fonts/OpenSans-Regular-webfont.ttf') format('truetype'), url('../fonts/OpenSans-Regular-webfont.svg#OpenSansRegular') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'RobotoRegular'; src: url('../fonts/Roboto-Regular-webfont.eot'); src: url('../fonts/Roboto-Regular-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/Roboto-Regular-webfont.woff') format('woff'), url('../fonts/Roboto-Regular-webfont.ttf') format('truetype'), url('../fonts/Roboto-Regular-webfont.svg#RobotoRegular') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'RobotoCondensed'; src: url('../fonts/Roboto-Condensed-webfont.eot'); src: url('../fonts/Roboto-Condensed-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/Roboto-Condensed-webfont.woff') format('woff'), url('../fonts/Roboto-Condensed-webfont.ttf') format('truetype'), url('../fonts/Roboto-Condensed-webfont.svg#RobotoCondensed') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'socialicoregular'; src: url('../fonts/socialico.eot'); src: url('../fonts/socialico.eot?#iefix') format('embedded-opentype'), url('../fonts/socialico.woff') format('woff'), url('../fonts/socialico.ttf') format('truetype'), url('../fonts/socialico.svg#socialicoregular') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: "dripicons"; src:url("../fonts/dripicons.eot"); src:url("../fonts/dripicons.eot?#iefix") format("embedded-opentype"), url("../fonts/dripicons.ttf") format("truetype"), url("../fonts/dripicons.svg#dripicons") format("svg"), url("../fonts/dripicons.woff") format("woff"); font-weight: normal; font-style: normal; } @font-face { font-family: 'FontAwesome'; src: url('../fonts/fontawesome-webfont.eot?v=4.4.0'); src: url('../fonts/fontawesome-webfont.eot?#iefix&v=4.4.0') format('embedded-opentype'), url('../fonts/fontawesome-webfont.woff2?v=4.4.0') format('woff2'), url('../fonts/fontawesome-webfont.woff?v=4.4.0') format('woff'), url('../fonts/fontawesome-webfont.ttf?v=4.4.0') format('truetype'), url('../fonts/fontawesome-webfont.svg?v=4.4.0#fontawesomeregular') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'capsuularegular'; src: url('../fonts/Capsuula-webfont.eot'); src: url('../fonts/Capsuula-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/Capsuula-webfont.woff') format('woff'), url('../fonts/Capsuula-webfont.ttf') format('truetype'), url('../fonts/Capsuula-webfont.svg#capsuularegular') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'england_hand_dbregular'; src: url('../fonts/england-webfont.eot'); src: url('../fonts/england-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/england-webfont.woff') format('woff'), url('../fonts/england-webfont.ttf') format('truetype'), url('../fonts/england-webfont.svg#england_hand_dbregular') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'quicksandlight'; src: url('../fonts/quicksand-light-webfont.eot'); src: url('../fonts/quicksand-light-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/quicksand-light-webfont.woff2') format('woff2'), url('../fonts/quicksand-light-webfont.woff') format('woff'), url('../fonts/quicksand-light-webfont.ttf') format('truetype'), url('../fonts/quicksand-light-webfont.svg#quicksandlight') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'ostrich_sanscondensed_light'; src: url('../fonts/ostrich-light-webfont.eot'); src: url('../fonts/ostrich-light-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/ostrich-light-webfont.woff2') format('woff2'), url('../fonts/ostrich-light-webfont.woff') format('woff'), url('../fonts/ostrich-light-webfont.ttf') format('truetype'), url('../fonts/ostrich-light-webfont.svg#ostrich_sanscondensed_light') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'BebasRegular'; src: url('../fonts/BEBAS___-webfont.eot'); src: url('../fonts/BEBAS___-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/BEBAS___-webfont.woff') format('woff'), url('../fonts/BEBAS___-webfont.ttf') format('truetype'), url('../fonts/BEBAS___-webfont.svg#BebasRegular') format('svg'); font-weight: normal; font-style: normal; } /*-------------------------------------------------------------- # General Style body, pre, code, kbd, tt, var, button, input[type] { font-size: 12px; } --------------------------------------------------------------*/ input { width: 100%; height: 30px; line-height: 30px; } button, input[type="button"], input[type="reset"], input[type="submit"] { font-family: 'RobotoCondensed', Arial, Helvetica, sans-serif; font-size: 14px; color: #222; width: auto; padding: 6px 9px; } blockquote { font-family: 'quicksandlight', Arial, Helvetica, sans-serif; } cite a { color: #222; text-decoration: underline; font-weight: bold; } a:hover, a:focus, a:active { text-decoration: none; } .clearboth { clear: both; } /*-------------------------------------------------------------- # Header --------------------------------------------------------------*/ .logo { text-align: center; padding-top: 20px; } .logo a { font-family: 'quicksandlight', Arial, Helvetica, sans-serif; font-size: 36px; color: #222222; margin: 0; } .logo p { font-family: 'RobotoCondensed', Arial, Helvetica, sans-serif; font-size: 14px; color: #999; } /*-------------------------------------------------------------- ## Navigation Menu --------------------------------------------------------------*/ .menu-toggle, .main-navigation.toggled #primary-menu { display: block; } .menu-toggle { line-height: 24px; padding: 0 8px; margin-top: -35px; float: right; font-size: 14px; background: none; border-color: #ccc; } .main-navigation ul { display: none; list-style: none; margin: 0; padding-left: 0; } #primary-menu { } #primary-menu > li { float: left; } #primary-menu > li > a { font-family: 'quicksandlight', Arial, Helvetica, sans-serif; font-size: 14px; color: #222222; padding: 0 12px; } #primary-menu > li:hover > a { background-color: #3397dc; color: #ffffff; } #primary-menu li { position: relative; } #primary-menu li.menu-item-has-children > a, #primary-menu li.page_item_has_children > a { padding-right: 30px; } .ncaret { position: absolute; top: 0; right: 0; font-family: 'FontAwesome'; font-size: 10px; width: 30px; height: 50px; line-height: 50px; text-align: center; color: #646464; display: inline-block; cursor: pointer; background: none; } .ncaret:before { content: '\f078'; } #primary-menu li li > .ncaret, #primary-menu .mobile > .ncaret { height: 40px; line-height: 40px; } #primary-menu .mobile > .ncaret { width: 30px; background-color: #efefef; } #primary-menu .mobile > .ncaret:hover { background-color: #dfdfdf; } #primary-menu li li > .ncaret:before { content: '\f054'; } #primary-menu ul { background-color: #fff; z-index: 9999; display: none; } #primary-menu ul li a { line-height: 40px; font-family: 'quicksandlight', Arial, Helvetica, sans-serif; font-size: 14px; color: #222222; padding: 0 12px; white-space: nowrap; display: block; } #primary-menu ul li:hover > a { background: #efefef; color: #3397dc; } @media screen and (min-width: 768px) { .menu-toggle { display: none; } .main-navigation ul { display: block; } .nav-wrap { text-align: center; } #primary-menu { display: inline-block !important; } #primary-menu li li { text-align: left; } #primary-menu > li > a { display: inline-block; line-height: 50px; } #primary-menu > li ul { min-width: 180px; } #primary-menu li ul { position: absolute; } #primary-menu ul { border: 1px solid #ccc; border-radius: 2px; -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .175); box-shadow: 0 6px 12px rgba(0, 0, 0, .175); border-top: 3px solid #3397dc; } #primary-menu ul ul { top: -3px; /* border-top: 3px solid #3397dc; */ left: 100%; } #primary-menu > li > ul { top: 100%; } #primary-menu li:hover > ul { display: block; } #primary-menu > li:hover > .ncaret:before { color: #fff; } } @media screen and (max-width: 767px) { #primary-menu, #primary-menu > li { float: none; clear: both; } #primary-menu li a { display: block; line-height: 40px; } #primary-menu .mobile { display: block; } #primary-menu .mobile > .ncaret:before { content: '\f078' !important; } #primary-menu li.mobile ul.toggled-on { display: block; } #primary-menu ul { -webkit-box-shadow: none; box-shadow: none; border: none; } } /*-------------------------------------------------------------- ## Banner --------------------------------------------------------------*/ #banner { margin-bottom: 30px; overflow: hidden; } .banner img { width: 100%; } /*-------------------------------------------------------------- # Content --------------------------------------------------------------*/ #content h2 { margin: 0; } #content ul, #content ol { padding: 0; } /*-------------------------------------------------------------- ## Posts and Pages --------------------------------------------------------------*/ .nath-post article { padding: 10px 15px 20px 15px; } .post-cat a { font-family: 'RobotoCondensed', Arial, Helvetica, sans-serif; font-size: 14px; color: #949494; display: inline-block; margin-bottom: 15px; } .post-cat a:hover, .nath-post .post-meta a:hover { text-decoration: underline; } .nath-post .post-title a { font-family: 'RobotoCondensed', Arial, Helvetica, sans-serif; font-size: 24px; color: #646464; display: inline-block; } .nath-post .post-title a:hover { color: #222; } .nath-post .post-meta { margin-bottom: 25px; } .nath-post .post-meta, .nath-post .post-meta a, .nath-post .post-on { font-family: 'RobotoCondensed', Arial, Helvetica, sans-serif; font-size: 14px; color: #949494; } .nath-post .post-content { font-family: 'OpenSansRegular', Arial, Helvetica, sans-serif; font-size: 14px; color: #222; line-height: 28px; } .nath-post .post-footer { font-family: 'OpenSansRegular', Arial, Helvetica, sans-serif; font-size: 12px; color: #222; } .nath-post .btn-default { font-family: 'RobotoCondensed', Arial, Helvetica, sans-serif; font-size: 16px; color: #949494; margin-top: 30px; } .nath-post .btn-default:hover { color: #646464; } .archive-header { border-bottom: 1px solid #ccc; } .archive-header h3 { font-family: 'RobotoCondensed', Arial, Helvetica, sans-serif; font-size: 20px; } .archive-header p { font-family: 'capsuularegular', Arial, Helvetica, sans-serif; font-size: 16px; color: #646464; } .nav-links { font-family: 'RobotoCondensed', Arial, Helvetica, sans-serif; font-size: 14px; } .nav-links .page-numbers { padding: 4px 7px; margin: 0 3px; border: 1px solid #efefef; color: #848484; } .nav-links a.page-numbers:hover { border-color: #ccc; } .nav-links .page-numbers.current { color: #fff; background-color: #3397dc; } .nav-links .page-numbers.dots, .nav-links .prev, .nav-links .next { border: none; } /*-------------------------------------------------------------- # Forms --------------------------------------------------------------*/ /* Search Form */ .searchform { position: relative; } #s { width: 100%; padding-right: 60px; } #searchsubmit { position: absolute; top: 0; right: 0; } /*-------------------------------------------------------------- # Sidebar --------------------------------------------------------------*/ .widget { padding: 15px; } .nath-sidebar h2.widget-title { text-align: center; font-family: 'RobotoCondensed', Arial, Helvetica, sans-serif; font-size: 14px; color: #888; line-height: 36px; border: 1px solid #ccc; display: block; margin-bottom: 20px !important; } .nath-sidebar ul { padding: 0; margin: 0; list-style: none; } .nath-sidebar ul li a { color: #646464; } .nath-sidebar ul li a:hover { color: #222; } .widget-recent-post li { margin-bottom: 15px; } .widget-recent-post .post-info { font-family: 'RobotoCondensed', Arial, Helvetica, sans-serif; font-size: 15px; color: #646464; padding: 0; } .widget-recent-post .post-date { display: block; font-size: 14px; color: #ccc; margin-top: 8px; } .widget-categories li, .widget-archives li { font-family: 'OpenSansRegular', Arial, Helvetica, sans-serif; font-size: 14px; font-style: italic; color: #aaa; max-height: 36px; line-height: 36px; border-bottom: 1px solid #efefef; white-space: wrap; overflow: hidden; position: relative; padding-left: 16px; padding-right: 5px; display: block; text-align: right; } .widget-categories li:before, .widget-archives li:before { position: absolute; top: 0; left: 0; font-family: 'FontAwesome'; font-size: 8px; color: #646464; content: '\f054'; } .widget-categories li a, .widget-archives li a { float: left; font-style: normal; color: #646464; } #wp-calendar caption { text-align: center; font-family: 'RobotoCondensed', Arial, Helvetica, sans-serif; font-size: 15px; color: #646464; } #wp-calendar tr { border-top: 1px solid #efefef; } #wp-calendar tr:last-child { border-bottom: 1px solid #efefef; } #wp-calendar td, #wp-calendar th { border-left: 1px solid #efefef; font-family: 'RobotoCondensed', Arial, Helvetica, sans-serif; font-size: 14px; color: #646464; text-align: center; height: 28px; line-height: 28px; } #wp-calendar td:last-child, #wp-calendar th:last-child { border-right: 1px solid #efefef; } #wp-calendar tfoot { display: none; } /*-------------------------------------------------------------- # Footer --------------------------------------------------------------*/ .nath-footer { text-align: center; margin-top: 20px; padding: 20px 0; font-size: 15px; color: #efefef; background-color: #222; }