/*-------------------------------------------------------------- # BODY --------------------------------------------------------------*/ html { font-size: 17px; } body { background: #efefef; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility !important; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; font-smoothing: antialiased; font-family: 'Barlow', sans-serif; font-weight: 400; line-height: 1.618; color: #646464; word-wrap: break-word; } #box-container.container { background: #fff; box-shadow: 0px 4px 8px rgba(30, 30, 30, 0.1); } h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { font-family: 'Barlow Semi Condensed', sans-serif; font-weight: 500; line-height: 1.25; color: #363636; } .container { max-width: 1240px; } a, button, input { transition: all .4s ease; } a { color: #363636; &:hover, &:focus, &:active { color: #141414; text-decoration: none; } &:focus { outline: #c2c2c2 dashed 1px; } &:hover, &:active { outline: 0; } } blockquote { font-size: 1.2rem; padding: 0.25rem 1.5rem; font-style: italic; border-left: 4px solid #dfdfdf; color: #363636; p:last-child { margin-bottom: 0; } } /*-------------------------------------------------------------- # HEADER --------------------------------------------------------------*/ .main-nav-bg { background: #002e5b; box-shadow: inset 0 2px 4px rgba(30, 30, 30, 0.15); } .site-header { margin-left: -15px; margin-right: -15px; .h1 { margin-bottom: 0px; text-transform: uppercase; } .site-description { text-transform: uppercase; font-size: 90%; margin-bottom: 5px; } .site-branding { padding: 25px 0; } } /*-------------------------------------------------------------- # SIDEBAR & WIDGETS --------------------------------------------------------------*/ .widget { margin-top: 40px; padding: 0 1rem; .widget-title { text-align: center; text-transform: uppercase; position: relative; letter-spacing: 0.5px; margin-bottom: 15px; &:before, &:after { content: "--"; padding: 0 10px; } } ul { margin-left: 0; list-style: none; padding-left: 0; li { padding: 12px 0; border-top: 1px dashed #dfdfdf; line-height: 1.5; } } a { color: #002e5b; &:hover { color: #646464; text-decoration: underline; } } } .be-sidebar-width { flex: 0 0 30%; max-width: 30%; } .be-content-width { flex: 0 0 70%; max-width: 70%; } /*-------------------------------------------------------------- # CONTENT --------------------------------------------------------------*/ .be-one-post, .be-one-page { margin-top: 40px; border-bottom: 1px dashed #dfdfdf; padding: 0 2rem; padding-bottom: 40px; .entry-title { text-transform: uppercase; margin-bottom: 5px; } .attachment-post-thumbnail { margin-top: 1rem; } } .entry-meta, .entry-footer { font-size: 90%; font-style: italic; a { color: #002e5b; &:hover { color: #646464; text-decoration: underline; } } } .be-single-header { padding: 30px 2rem; border-bottom: 1px dashed #dfdfdf; .entry-title, .page-title { text-transform: uppercase; margin-bottom: 5px; } .breadcrumb-trail.breadcrumbs { margin-bottom: 0px; .entry-subtitle { display: none; } } .archive-description { font-size: 90%; font-style: italic; } } .be-single-page { .post-thumbnail img { margin-top: 0; } .entry-footer { margin-top: 2rem; } } .cat-links, .tags-links, .comments-link { margin-right: 10px; } .wp-caption .wp-caption-text { font-size: 90%; font-style: italic; margin-top: 2px; } .error-404 { .page-content { padding: 0 2rem; } } .comments-area { padding: 0 2rem; margin-bottom: 2rem; .comment-list { list-style: none; margin-left: 0; padding-left: 0; li.comment { padding: 2rem 0; border-bottom: 1px dashed #dfdfdf; p:last-child { margin-bottom: 0; } .children { list-style: none; li.comment { border-bottom: 0px; padding-bottom: 0; } } } .comment-metadata { font-size: 90%; font-style: italic; margin-bottom: 10px; .edit-link { margin-left: 10px; } } .reply { font-size: 90%; font-style: italic; margin-top: 10px; } .comment-author.vcard { img { margin-right: 5px; margin-bottom: 5px; } } } .comment-reply-title { font-size: 1.25rem; text-transform: uppercase; margin-top: 2rem; small { font-size: 70%; margin-left: 15px; a { color: #646464; } } } .comment-form { p { label { display: block; color: #363636; margin-bottom: 0.25rem; } } .form-submit { padding-top: 10px; } } } #box-container.container .elementor { margin-right: -15px; margin-left: -15px; } .be-main-featured-post { height: 400px; background: #f2f2f2; margin: 2rem 0 0 2rem; } .bg-secondary-featured-post-1 { background: #f2f2f2; margin: 2rem 1rem 0 10px; height: 180px; } .bg-secondary-featured-post-2 { background: #f2f2f2; margin: 40px 1rem 0 10px; height: 180px; } /*-------------------------------------------------------------- # BUTTONS & INPUTS --------------------------------------------------------------*/ .btn-primary { border-color: #002e5b; background-color: #002e5b; &:hover, &:active, &:focus { color: #002e5b; background-color: #fff; border-color: #002e5b; box-shadow: none; } } .btn-sm { padding: 0.5rem 1.25rem; } .btn-outline-primary { padding: 0.5rem 1.25rem; border-color: #002e5b; color: #002e5b; text-transform: capitalize; &:hover, &:active, &:focus { color: #ffffff; background-color: #002e5b; border-color: #002e5b; box-shadow: none; } } input[type="submit"] { border-color: #002e5b; background-color: #002e5b; padding: 0.5rem 1.25rem; color: #fff; font-size: 0.875rem; line-height: 1.5; border-radius: 0.2rem; display: inline-block; font-weight: 400; text-align: center; white-space: nowrap; vertical-align: middle; user-select: none; cursor: pointer; transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; &:hover, &:active, &:focus { color: #002e5b; background-color: #fff; border-color: #002e5b; } } input[type="text"], input[type="email"], input[type="url"], input[type="password"], input[type="search"], input[type="number"], input[type="tel"], input[type="range"], input[type="date"], input[type="month"], input[type="week"], input[type="time"], input[type="datetime"], input[type="datetime-local"], input[type="color"], textarea { display: block; padding: 0.375rem 0.75rem; font-size: 1rem; line-height: 1.5; color: #363636; background-color: #fff; background-clip: padding-box; border: 1px solid #dfdfdf; border-radius: 0.25rem; transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; &:focus { color: #363636; background-color: #fff; border-color: #80bdff; outline: 0; box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25); } &:-webkit-input-placeholder, &:-moz-placeholder, &:-ms-input-placeholder { color: #6c757d; opacity: 1; } } select { height: calc(2.25rem + 2px); display: block; width: 100%; padding: .375rem .75rem; font-size: 1rem; line-height: 1.5; color: #363636; background-color: #fff; background-clip: padding-box; border: 1px solid #dfdfdf; border-radius: .25rem; transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out; } .be-open-comment-form { &:active, &:focus { border-color: #002e5b; background-color: #fff; color: #fff; } } /*-------------------------------------------------------------- # FOOTER --------------------------------------------------------------*/ .site-footer { background: #363636; color: rgba(255, 255, 255, 0.6); padding: 1.5rem 0; text-transform: uppercase; font-size: 80%; letter-spacing: 0.5px; border-top: 2px solid rgba(0, 0, 0, 0.15); a { color: #fff; &:hover { color: rgba(255, 255, 255, 0.6); text-decoration: underline; } } }