Tudor Clone
/* Remove Standard Styles */ header.header-wrap, nav .top-bar .navbar-collapse { background: none; } header.header-wrap { position: unset; height: unset; } header.header-wrap .site-title { min-height: unset; } header.header-wrap h2 { font-size: 14px; text-transform: lowercase; letter-spacing: unset; padding-left: 0; margin-top: 0; margin-bottom: 0; } main > .content { background: none; box-shadow: none; position: unset; top: unset; border-radius: 0; padding-bottom: 0; } .breadcrumbs { background: none; padding: 0; color: unset; } /* Custom Styles */ body { background-color:#f8f8f8; line-height:1.5em; color:#444; font-family: 'Quattrocento', serif; font-size: 18px; } header, h1, h2, h3, h4, h5, h6, main > .content .page-title span, .blog-date, .blog-content-date, footer { font-family: 'Quicksand', sans-serif; } p { display: block; margin-block-start: 1em; margin-block-end: 1em; margin-inline-start: 0px; margin-inline-end: 0px; } a { color:#429cf5; } a.newpage { color:#c90000; } header { padding-top: 1.5%; padding-bottom: 0; } header.header-wrap .site-title { text-align:center; color: #333; } header.header-wrap h1 a, header.header-wrap h1 a:hover, header.header-wrap h1 a:focus, header.header-wrap h1 a:active { color: #333; } header.header-wrap h1 a { font-weight: 700; font-size: 25px; } header.header-wrap .site-title h1 { display: inline-block; border-bottom: solid 3px #333; padding: 0 0 0.15em; } header.header-wrap .site-title h2 { color: #ccc; padding-top: 0.25em; font-size: 1em; } nav { font-size: 0.8em; text-align: center; } nav .top-bar .navbar-nav { float: unset; display: inline-block; margin-left: auto; margin-right: auto; } .nav>li>a { padding: 0.5em; } @media (min-width: 576px) { .container{ width: 100%; }} @media (min-width: 768px) { .container{ width: 83.3333%; }} @media (min-width: 992px) { .container{ width: 66.6667%; }} @media (min-width: 1200px) { .container { width: 49.99%; }} main > .content .page-title { margin: 0px 0 0.5em 0; border-bottom:0px; } main > .content .page-title span { background: none; display: block; height: auto; padding-right: 0px; border-bottom: 0px; padding: 0 0 0 0; margin: 0 0 0 0; margin-block-start: 0; margin-block-end: 0; margin-inline-start: 0; margin-inline-end: 0; font-size: 25px; font-weight: 700; text-decoration: none; text-transform: none; color: #333; } main > .content .page-title span { text-align:center; font-size:1.1em; } .breadcrumbs { font-size: 0.8em; } .breadcrumbs, .breadcrumbs a { color: #ccc; } main .content .page-options-container { background-color: #f0f0f0; border-top: 1px solid #ccc; margin-top:3em; } main .main-content-wrap.col-md-12 .main-content h1 { background:unset; } .page-options-container { clear:both; } footer { padding-top: 3%; font-size: 0.75em; } /* Main Content */ .page-note { border:1px solid #ccc; background-color: #f0f0f0; color:#333; font-size:0.8em; padding:0 1em; margin-bottom:2em; } .table-of-contents { margin-bottom: 1.5em; margin-left:1em; } @media (min-width: 550px) { .table-of-contents { float:right; width: 45%; }} @media (min-width: 825px) { .table-of-contents { margin-right:-5%; width:50%; }} @media (min-width: 1100px) { .table-of-contents { margin-right:-12% width:60%; }} #toc-action-bar a { float:right; position:unset; left:unset; } /* Blog */ div.blog-date, .masonryGrid .blog-content-date { font-size:0.8em; text-transform: uppercase; font-weight:bold; } div.blog-date { margin-top:-0.8em; text-align:center; } .masonryGrid:after { content: ''; display: block; clear: both; } .masonryGrid .grid-sizer, .masonryGrid .list-pages-item { width: 100%; } .masonryGrid .blog-post { padding-right:0.5em; padding-bottom:2em; } main.content-wrap div.main-content-wrap { padding-left:0.5em; } @media (min-width: 550px) { .masonryGrid .grid-sizer, .masonryGrid .list-pages-item { width: 49%; } .masonryGrid .blog-post { padding-right:1em; padding-bottom:2em; } main.content-wrap div.main-content-wrap { padding-left:1em; } } @media screen and (min-width: 825px) { .masonryGrid .grid-sizer, .masonryGrid .list-pages-item { width: 32%; } .masonryGrid .blog-post { padding-right: 2em; padding-bottom:2.5em; } main.content-wrap div.main-content-wrap { padding-left:2em; } } @media screen and (min-width: 1100px) { .masonryGrid .grid-sizer, .masonryGrid .list-pages-item { width: 24%; } .masonryGrid .blog-post { padding-right:3em; padding-bottom:3em; } main.content-wrap div.main-content-wrap { padding-left:3em; } } .masonryGrid .list-pages-item { float: left; height:33.8em; } .masonryGrid .list-pages-item, .masonryGrid .blog-post, .masonryGrid .blog-content, .masonryGrid .blog-content-text { overflow: hidden; text-overflow: clip; } .blog-thumbnail img { width:100% !important; } .masonryGrid .blog-content-date { margin-top:0.3em; } .masonryGrid .blog-content-date p { margin:0; padding:0; } .masonryGrid .blog-post h2 { margin-top:0; font-size:23px; } .masonryGrid .blog-content-text p { margin-block-start: 0em; margin-block-end: 1em; margin-inline-start: 0px; margin-inline-end: 0px; } /* Forms */ input, textarea, #edit-page-textarea { font-family: 'Cousine', monospace; } input, textarea, #edit-page-textarea, input[type=text]:not(.form-control), textarea:not(.form-control) { font-size:1em; } .alert.alert-info { font-size: 0.75em; line-height: normal; padding: 0.5em; } .edit-help-34, .edit-page-bottomtable, .checkbox.do-not-notify { font-size:0.75em; }