/*----------------Core---------------------------*/ body{ margin: 0px; background: #016cce; font: 18px 'Poppins', Arial, sans-serif; line-height: 1.5em; color: #fff; } img, input[type=image] { border: 0px; vertical-align: middle; } a:link, a:visited, a:active { color: #016cce; } a:focus {outline: 0; } a:hover { color: #016cce; opacity: 0.7; text-decoration: none; } form { margin: 0px; padding: 0px; } h1,h2,h3,h4,h5,h6 { font-family: 'Poppins', Arial, sans-serif; } /*------------ Utilities ----------------------*/ .clear{ clear: both; height: 0px; margin: 0px; overflow: hidden; } .form-control { border-radius: 0; font-size: 16px; padding: 8px 12px; height: 40px; border: 1px solid #ddd; border-bottom: 1px solid #aaa; box-shadow: unset !important; background: #fcfcfc; color: #000;} .form-fighter { position: absolute; top: -99999px; height: 0; overflow: hidden; } label { font-weight: bold; font-size: 14px; } .small-padding { margin-left: -5px; margin-right: -5px; } .small-padding .col-sm-1, .small-padding .col-sm-2, .small-padding .col-sm-3, .small-padding .col-sm-4, .small-padding .col-sm-5, .small-padding .col-sm-6, .small-padding .col-sm-7, .small-padding .col-sm-8, .small-padding .col-sm-9, .small-padding .col-sm-10, .small-padding .col-sm-11, .small-padding .col-sm-12, .small-padding .col-xs-1, .small-padding .col-xs-2, .small-padding .col-xs-3, .small-padding .col-xs-4, .small-padding .col-xs-5, .small-padding .col-xs-6, .small-padding .col-xs-7, .small-padding .col-xs-8, .small-padding .col-xs-9, .small-padding .col-xs-10, .small-padding .col-xs-11, .small-padding .col-xs-12 { padding: 0 5px; } .btn-primary, a.btn-primary { text-transform: uppercase; background-color: #2c76ff; font-weight: 700; border: 0; padding: 10px 45px; color: #fff; border: 0px solid #1B1464; border-radius: 4px; } .btn-primary:hover, .btn-primary:active .btn-primary:focus, a.btn-primary:hover, a.btn-primary:active a.btn-primary:focus { border-color: #2c76ff; background: #1fa700; color: #fff; } .btn-white, a.btn-white { text-transform: uppercase; font-weight: bold; background-color: transparent; border: 0; padding: 10px 45px; border: 2px solid #fff; color: #fff; border-radius: 4px; } .btn-white:hover, .btn-white:active .btn-white:focus, a.btn-white:hover, a.btn-white:active a.btn-white:focus { background: rgba(255,255,255,0.1); color: #fff; } .flex-row { display: flex; flex-flow: row nowrap; align-items: center; } .img-frame { border-radius: 4px; box-shadow: 0 0 8px rgba(0,0,0,0.1); } /*------------ Header & Menu ----------------------*/ #header { padding: 20px 0; } #header .flex-row { align-items: center; justify-content: space-between; } #header .logo { max-width: 380px; } #header .menu { flex-grow: 1; margin-left: 30px; } .sf-menu { text-align: right; text-transform: uppercase; } .sf-menu ul li { display: inline-block; vertical-align: middle; padding: 22px 0; line-height: 1em; margin: 0; float: none; } .sf-menu li a { width: 100%; display: block; font-weight: normal; line-height: 1em; padding: 0 20px; text-decoration: none; font-weight: bold; font-size: 18px; color: #fff; border-right: 1px solid rgba(255,255,255,0.2); text-align: center; } .sf-menu li:hover a, .sf-menu li.selected a { opacity: 0.8; } .sf-menu li.last a { border: 0px; padding-right: 0; } .sf-menu li ul { transition: all 0s ease-in-out 0s; border: 1px solid rgba(0,0,0,0.2); border-top: 0; border-bottom-right-radius: 6px; border-bottom-left-radius: 6px; overflow: hidden; box-shadow: 2px 2px 8px rgba(0,0,0,0.2); } .sf-menu li li, .sf-menu li.selected li { border-radius: 0; transition: all 0.1s ease-in-out 0s; background: #fff; padding: 0px 0px; display: block; text-align: left; border-bottom: 1px solid rgba(0,0,0,0.2); } .sf-menu li li a, .sf-menu li:hover li a, .sf-menu li.selected li a { display: block; color: #000; background: transparent; text-align: left; transition: all 0.1s ease-in-out 0s; border: 0; font-size: 14px; line-height: 1em; padding: 8px 12px; } .sf-menu li li:hover { background: #ddd; border-radius: 0; } .sf-menu li li:hover a{ color: #000; text-decoration: none; } .sf-menu li li.last { border: 0px; } .sf-menu ul li:hover ul, .sf-menu ul li.sfHover ul { top: 62px; } .search-trigger { flex-basis: 1.5em; margin-left: 15px; padding-left: 15px; border-left: 2px solid rgba(255,255,255,0.2); } .search-trigger a { display: block; color: #fff; } .mobile-trigger{ } .mobile-text { font-size: 16px; color: #ffffff; font-weight: normal; display: inline-block; padding: 15px 20px; } .mobile-text:hover { color:#fff; } #mobile-menu-btn { cursor: pointer; width: 45px; padding: 5px 0px; margin-left: auto; overflow: hidden; text-decoration: none; } #mobile-menu-btn .icon-bar { height: 3px; background: #ffffff; display: block; margin: 6px 5px; border-radius: 0px; } #mobile-menu-btn:hover .icon-bar { background: #fff; opacity: 0.8; color:#ffffff } #mobile-menu { display: none; text-align: left; padding: 15px 0px; margin: 15px -15px; background: rgba(0,0,0,0.3); overflow: hidden; overflow-y: auto; z-index: 900; text-transform: uppercase; font-size:16px; } #mobile-menu a { text-decoration: none; } #mobile-menu ul { margin: 0px; padding: 0px; list-style: none; width: auto; } #mobile-menu li { display: block; margin: 0px; padding: 0px 20px; background: none; list-style: none; font-weight: normal; } #mobile-menu li a{ display: block; padding: 6px 15px 6px 0; font-size: 16px; color: #ffffff; border: 2px solid rgba(255,255,255,0.5); text-align: center; border-radius: 4px; } #mobile-menu li.last a { } #mobile-menu li a:hover { opacity: 0.8; background: none; } #mobile-menu li li { margin: 0px 5px; padding: 0px; border-bottom: 0px solid #000; background: rgba(255,255,255,0.1); font-weight: normal; } #mobile-menu li li a { border:0; border-radius: 0; border: 2px solid rgba(255,255,255,0.2); border-top: 0; display: block; padding: 4px 0 6px 0; padding-left: 15px; font-size: 16px; color: #fff; } #mobile-menu li li a:hover { background: none; opacity: 0.8; } #back-to-top { cursor: pointer; box-shadow: 0 0 18px rgba(0,0,0,0.5); position: fixed; z-index: 998; bottom: 1em; right: 1em; width: 2em; height: 2em; line-height: 2em; border-radius: 100%; text-align: center; background: #016cce; color: #fff; } #search-popup { visibility: hidden; background: rgba(0,0,0,0.95); color: #fff; position: fixed; z-index: 999; top: 0; left: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; } #search-popup.active { visibility: visible; } #search-popup .search-box { margin: 0; text-align: center; } #search-popup .search-box .flex-row { align-items: stretch; justify-content: space-between; } #search-popup .search-box h3 { font-size: 24px; text-transform: uppercase; font-weight: bold; margin: 0 auto 15px; } #search-popup .search-box .form-group { min-width: 500px; margin: 0; margin-right: 15px; background: #fff; color: #000; border-radius: 15px; padding: 15px; } #search-popup .search-box .form-group label { display: none; } #search-popup .search-box .form-group .form-control { border: 0; background: transparent; } #search-popup .search-box .btn { border-radius: 15px; font-size: 1.5em; line-height: 1.5em; padding: 10px 25px; } #search-popup .search-box .cancel { display: block; margin-top: 15px; font-size: 0.8em; } /*------------ FOOTER ----------------------*/ #mailing-list { background: #ddd; padding: 30px 0; color: #000; } #mailing-list .mailing-list { margin: 30px auto; width: fit-content; text-align: center; } #mailing-list .mailing-list h3 { font-size: 24px; text-transform: uppercase; font-weight: bold; margin: 0 auto 15px; } #mailing-list .mailing-list .flex-row { align-items: stretch; justify-content: space-between; } #mailing-list .mailing-list .form-group { min-width: 500px; margin: 0; margin-right: 15px; background: #fff; color: #000; border-radius: 15px; padding: 15px; } #mailing-list .mailing-list .form-group label { display: none; } #mailing-list .mailing-list .form-group .form-control { border: 0; background: transparent; } #mailing-list .mailing-list .btn { border-radius: 15px; font-size: 1.5em; line-height: 1.5em; padding: 10px 25px; } #footer { background: #016cce; color: #fff; padding: 30px 0; } #footer a { color: #fff; } #footer h6 { display: block; border: 2px solid #fff; color: #fff; font-size: 18px; line-height: 1; padding: 15px; border-radius: 15px; margin: 0 0 15px; font-weight: bold; } #footer ul { list-style: none; padding: 0; margin: 0 15px; } #footer li { display: block; } #footer li a { display: block; color: #fff; margin: 4px 0; } #footer .flex-row { align-items: center; justify-content: space-between; } #footer .topic-menu { flex-basis: 50%; } #footer .topic-menu ul { list-style-position: inside; column-count: 2; break-inside: avoid; } #footer .topic-menu li { page-break-inside: avoid; break-inside: avoid-column; } #footer .about-menu { flex-basis: 20%; } #footer .social { flex-basis: 20%; text-align: center; } #footer .social-icons { font-size: 2.5em; } #copyright { text-align: center; padding: 15px 0; font-size: 0.7em; line-height: 1.1em; color: #fff; opacity: 0.7; text-transform: uppercase; } #sponsors {text-align: center; padding: 15px 0; background: #fff; color: #333; text-transform: uppercase; font-size: 14px; line-height: 2em; letter-spacing: 1px; } #sponsors .flex-row { display: flex; align-items: center; flex-wrap: wrap; flex-direction: row; justify-content: center; } #sponsors a.col { text-indent: -999em; overflow: hidden; flex-basis: calc(20% - 30px); height: 150px; margin: 15px; background-size: contain; background-position: 50% 50%; background-repeat: no-repeat; } #sponsors .title { margin-bottom: 10px; } #sponsors-embed { margin-top: 60px; text-align: center; padding: 15px 0; background: #fff; color: #333; text-transform: uppercase; font-size: 14px; line-height: 2em; letter-spacing: 1px; } #sponsors-embed .flex-row { display: flex; align-items: center; flex-wrap: wrap; flex-direction: row; justify-content: center; } #sponsors-embed a.col { text-indent: -999em; overflow: hidden; flex-basis: calc(20% - 30px); height: 150px; margin: 15px; background-size: contain; background-position: 50% 50%; background-repeat: no-repeat; } #sponsors-embed .title { margin-bottom: 10px; } /*------------ CONTENT ----------------------*/ .content { padding: 45px 0; background: #fff; color: #111; } .content h1 { font-weight: bold; font-size: 36px; margin: 0px 0px 8px; color: #111; } .content h2 { font-weight: bold; font-size: 28px; margin: 0px 0px 8px; color: #111; } .container.shortened { width: 800px; max-width: 100%; } #page-home #home-header { position:relative; } #page-home #home-header .backgrounds { display: flex; flex-wrap: wrap; align-items: stretch; justify-content: center; } #page-home #home-header .backgrounds .bg { flex-basis: calc(100% / 3); height: calc(100vw / 4); background-color: #eee; background-size: cover; background-position: 50% 50%; background-repeat: no-repeat; } #bg-1 { background-image: url('../images/jb-dt.jpg'); } #bg-2 { background-image: url('../images/bg_0005_AdobeStock_251241392.jpg'); } #bg-3 { background-image: url('../images/bg_0003_AdobeStock_508832298.jpg'); } #bg-4 { background-image: url('../images/bg_0000_drew-darby-teHMGygdJKs-unsplash.jpg'); } #bg-5 { background-image: url('../images/bg_0004_AdobeStock_285267046.jpg'); } #bg-6 { background-image: url('../images/bg_0002_City of Stuart Water Tower.jpg'); } #page-home #home-header .overlay { background: rgba(0,0,0,0.3); display: flex; align-items: center; justify-content: center; position: absolute; z-index: 99; top: 0; left: 0; width: 100%; height: 100%; } #page-home #home-header .overlay .container { text-align: center; width: 100%; } #page-home #home-header .text-container { display: block; box-shadow: 0 0 18px rgba(0,0,0,0.3); width: fit-content; max-width: 990px; text-transform: uppercase; margin: 0 auto; background: #1f62af; color: #fff; padding: 30px; border-radius: 15px; } #page-home #home-header h1 { display: block; font-size: 8vw; text-transform: uppercase; font-weight: 900; line-height: 1em; border: 3px solid #fff; border-radius: 15px; padding: 15px; margin: 15px; } #page-home #home-header .toptext { font-weight: bold; letter-spacing: 2px; } #page-home #home-header .subtext { font-style: italic; letter-spacing: 2px; } #home-header .mailing-list { margin: 30px auto -25px; width: fit-content; text-align: center; } #home-header .mailing-list h3 { font-size: 24px; text-transform: uppercase; font-weight: bold; margin: 0 auto 15px; } #home-header .mailing-list .flex-row { align-items: stretch; justify-content: space-between; } #home-header .mailing-list .form-group { min-width: 500px; margin: 0; margin-right: 15px; background: #fff; color: #000; border-radius: 15px; padding: 15px; } #home-header .mailing-list .form-group label { display: none; } #home-header .mailing-list .form-group .form-control { border: 0; background: transparent; } #home-header .mailing-list .btn { border-radius: 15px; font-size: 1.5em; line-height: 1.5em; padding: 10px 25px; } .home-icons { margin: 0 auto 45px; } .home-icons .flex-row { align-items: stretch; justify-content: center; flex-wrap: wrap; } .home-icons .home-icon { flex-basis: calc(100% / 3 - 15px); margin: 0 7.5px 15px; padding: 5px; border: 1px solid #ddd; background: #ddd; border-radius: 8px; text-align: center; overflow:hidden; } .home-icons .home-icon .img-bg { display: block; padding-top: 75%; background-color: #fff; background-size: contain; border: 15px solid #fff; margin: -5px -5px 15px; background-position: 50% 50%; background-repeat: no-repeat; } .home-icons .home-icon .title { display: block; padding: 0px 15px 5px; font-size: 1.2em; line-height: 1em; color: #000; font-weight: bold; } .home-icons .home-icon .readmore { opacity: 0.7; color: #000; text-transform: uppercase; font-size: 0.7em; line-height: 1em; letter-spacing: 1px; padding-bottom: 15px; } #page-home h3 { font-size: 36px; line-height: 1.2em; margin: 0 0 15px; text-transform: uppercase; font-weight:bold; text-align: center; } #about-blurb { margin: 30px auto; } #about-blurb h4 { font-size: 20px; line-height: 1.2em; margin: 0px 0 15px; text-transform: uppercase; font-weight:bold; } #page-home .profile { flex-basis: calc(100% / 3 - 15px); flex-shrink: 0; } #page-home .bio { flex-grow: 1; margin-left: 30px; } #page-home .bio p { margin-bottom: 30px; } #page-about { } .page-heading { padding: 8vw 15px; text-align:center; background: linear-gradient(rgba(255,255,255,0.2), rgba(255,255,255,0.7)); } .page-heading h1 { font-weight: 900; font-size: 72px; margin: 0px 0px 8px; color: #fff; } .page-heading .subtext { text-transform: uppercase; letter-spacing: 2px; font-weight: bold; } .table-contents { border: 1px solid #ddd; background: #f6f6f6; padding: 9px 0; border-radius: 4px; margin: 15px auto 45px; overflow: hidden; } .table-contents h4 { font-size: 20px; line-height: 1.2em; margin: 6px 15px 6px; text-transform: uppercase; font-weight:bold; } .table-contents ul { list-style:none; padding: 0; margin: 0; } .table-contents li { display: block; padding: 0 15px; } .table-contents li.active { background: rgba(0,0,0,0.2); font-weight:bold; } .table-contents li a { display: block; padding: 8px 15px; margin: 0; color: #000; } .table-contents li a:before { content: '\f02e'; opacity: 0.7; font-family: "Font Awesome 6 Free"; font-weight: 900; display: inline-block; width: 0.6em; height: 0.6em; margin-right: 0.6em; margin-left: -1.2em; } .table-contents li a:hover { opacity: 0.7; } .columnists { display: flex; align-items: stretch; justify-content: center; flex-wrap: wrap; } a.columnist-box { align-items: center; flex-basis: calc(100% / 3 - 15px); padding: 15px; text-align: center; background: #eee; color: #000; border-radius: 4px; margin: 7.5px; } a.columnist-box .img-cover { padding-top: 100%; width: 100%; color: #016cce; display: block; background-color: #fff; background-size: cover; background-position: 50% 50%; background-repeat: no-repeat; } a.columnist-box .name { display: block; padding: 10px 0 0; font-weight: bold; text-transform: uppercase; } a.columnist-box .title { display: block; padding: 2px 0 0; opacity: 0.8; font-size: 0.7em; line-height: 1.1em; font-weight: normal; text-transform: uppercase; } a.columnist-box .read-more { display: block; padding: 4px 0 0; font-size: 0.7em; text-transform: uppercase; } #page-columndir .content .flex-row { align-items: flex-start; justify-content: space-between; } #page-columndir .author-bio-cover { padding-top: 200px; width: 200px; border-radius: 100%; margin: -15px auto 15px; color: #016cce; display: block; background-color: #fff; background-size: cover; background-position: 50% 50%; background-repeat: no-repeat; } #page-columndir .author-bio { flex-basis: 30%; margin-right: 30px; padding: 15px; background: #f6f6f6; border-radius: 4px; } #page-columndir .author-bio .bio { font-size: 0.8em; line-height: 1.4em; margin-top: 15px; } #page-columndir .column-directory { flex-grow: 1; } a.news-list { display: flex; align-items: center; padding: 0; color: #000; border-radius: 4px; margin: 15px 0; } a.news-list .img-cover { flex-basis: 17%; flex-shrink: 0; margin-right: 15px; color: #016cce; display: block; padding: 8px; font-size: 1.5em; font-weight: 700; border-radius: 4px; line-height: 1em; background: #eee; text-align: center; } a.news-list .fa-solid {display: block; } a.news-list .year { display: block; font-size: 0.7em; margin-top: 0px; font-weight: 400; color: #000; } a.news-list .news-title { font-size: 1.2em; font-weight: normal; text-transform: uppercase; } #page-events .content h3 { display: block; font-size: 18px; font-weight: bold; text-transform: uppercase; background: #016cce; color: #fff; text-align: center; border-radius: 8px; padding: 8px; margin: 0 0 15px; } #page-events .content .flex-row { display: flex; align-items: center; flex-wrap: nowrap; flex-direction: row; justify-content: space-between; } #page-events .content .graphic { flex-basis: 20%; width: 20%; padding-top: 20%; border-radius: 4px; background-color: #ccc; background-image: url('../images/default-thumbnail.png'); background-position: 50% 50%; background-repeat: no-repeat; background-size: cover; } #page-events .content .graphic a { display: block; height: 100%; text-decoration: none; } #page-events .content .col { flex-basis: 80%; width: 80%; padding-left: 15px; } #page-events .content .event-row { margin-bottom: 15px; border: 0px solid #ddd; border-radius: 4px; overflow: hidden; padding: 0px; margin: 15px 0; padding: 15px; } #page-events .content .event-row:nth-child(even) { background: #f6f6f6; } #page-events .content .event-row:hover { background: #eee; } #page-events .content .calendar-icon { background: #eee; color: #28355a; border-radius: 0px; overflow: hidden; border-radius: 4px; } #page-events .content .calendar-icon span { display: block; text-align: center; } #page-events .content .calendar-icon span.month { padding: 8px 2px; font-size: 14px; font-weight: bold; line-height: 1.2em; background: #f2a322; } #page-events .content .calendar-icon span.day { font-size: 30px; line-height: 2.3em; font-weight: bold; } #page-events .content .event { transition: all 0.2s ease-in-out 0s; display: block; text-decoration: none; } #page-events .content .event a { color: #254b87; text-decoration: none; } #page-events .content .event .fa-fw { color: #888; } #page-events .content .event .title { display: block; font-weight: bold; color: #016cce; font-size: 24px; line-height: 1.3em; } #page-events .content .event .subtitle { display: block; font-size: 18px; color: #333; line-height: 1.4em; margin-bottom: 15px; text-transform: uppercase; } #page-events .content .event .date { display: block; font-size: 18px; line-height: 1.4em; opacity: 0.8; } #page-events .content .event .location { display: block; font-size: 18px; line-height: 1.4em; opacity: 0.8; margin-bottom: 20px; } #page-events .content .event .website { display: block; font-size: 18px; line-height: 1.4em; opacity: 0.8; } #page-events .content .event .website a { color: #22a9e5; } #page-events .content .icons span { display: inline-block; font-size: 12px; text-transform: uppercase; line-height: 1em; padding: 4px 15px; background: #f2a322; color: #28355a; letter-spacing: 1px; border-radius: 8px; } #page-article .page-heading { padding-bottom: 2vw; } #article-overview { padding: 30px 0; text-align: left; color: #000; } #article-overview .flex-row { align-items: stretch; justify-content: space-between; } #article-overview .section-col { flex-basis: 30%; } #article-overview .column-col { flex-grow: 1; margin-left: 15px !important; } #article-overview h3 { display: block; background: #eee; color: #000; font-size: 24px; line-height: 1.2em; margin: -15px -15px 15px; padding: 15px; text-align: center; text-transform: uppercase; font-weight:bold; } #article-overview .table-contents { padding: 15px; margin: 30px auto 0; border: 0; background: #fff; } #article-overview .section-col.table-contents { background: #016cce; color: #fff; } #article-overview .section-col.table-contents a { color: #fff; } #page-article h2 { font-size: 36px; line-height: 1.2em; margin: 0 0 15px; text-transform: uppercase; font-weight:bold; text-align: center; } #page-article .section { margin: 30px auto 80px; } #page-article .section .title h3 { font-size: 36px; line-height: 1.2em; margin: 0 0 15px; text-transform: uppercase; font-weight:bold; text-align: center; } #page-article .section .title h3 a { display: block; color: #CCC; margin-bottom: 8px; } #page-article .author { margin: 15px auto 30px; text-align: center; font-weight: bold; } #page-article .author-img { box-shadow: 0 0 10px rgba(0,0,0,0.3); width: 200px; height: 200px; margin: 0 auto 15px; border-radius: 100%; background-color: #ddd; background-size: cover; background-position: 50% 50%; background-repeat: no-repeat; } #page-article .author .title { font-style: italic; font-weight:normal; } #page-about .flex-row { align-items: flex-start; justify-content: space-between; } #page-about .content .biopic { flex-basis: 30%; min-width: 30%; margin-left: 15px; } #page-about .content .col { flex-grow: 1; } #page-news h3 { font-size: 36px; line-height: 1.2em; margin: 0 0 15px; text-transform: uppercase; font-weight:bold; text-align: center; } #page-news .flex-row { display: flex; align-items: stretch; justify-content: center; flex-wrap: wrap; } a.news-box { display: flex; align-items: center; flex-basis: calc(25% - 30px); padding: 15px; flex-direction: column; text-align: center; background: #eee; color: #000; border-radius: 4px; margin: 15px; } a.news-box .img-cover { flex-basis: 100%; width: 100%; color: #016cce; display: block; padding: 45px 0; font-size: 2em; font-weight: 700; line-height: 1em; background: rgba(255,255,255,0.4); } a.news-box .year { display: block; font-size: 0.7em; margin-top: 0px; font-weight: 400; color: #000; } a.news-box .news-title { padding: 15px 0 0; font-size: 0.9em; font-weight: normal; text-transform: uppercase; } a.news-box .readmore { padding: 4px 0 0; font-size: 0.8em; text-transform: uppercase; } a.news-box .fa-solid { display: block; margin: 0 auto 15px; opacity: 0.7; } #first-edition { margin: 0 auto; padding: 45px 0; background: linear-gradient(#f6f6f6, #ddd); color: #000; text-align:center; } #first-edition .flex-row { align-items: stretch; justify-content: space-between; flex-wrap: nowrap; margin-bottom: 30px; /* max-height: 90vh; */ } #first-edition .left-col { position: relative; flex-basis: calc(100% / 3 - 15px); flex-shrink: 0; text-align: left; padding: 15px; margin: 15px 7.5px; background: #016cce; color: #fff; border-radius: 8px; overflow: hidden; } #first-edition .left-col h4 { text-align: center; font-size: 1.2em; font-weight: bold; margin: 0 auto 15px; } #first-edition .right-col { position: relative; flex-grow: 1; margin: 15px 7.5px; padding: 30px; background: #fff; color: #000; text-align: left; border: 0px solid #ddd; border-radius: 8px; overflow: hidden; } #first-edition .right-col h4 { font-size: 1.6em; font-weight: bold; margin: 0 auto 15px; } #first-edition .left-col .hidden-fade { display: none; position: absolute; bottom: 0; left: 0; width: 100%; height: 5em; padding: 10em 0 0; text-align: center; background: linear-gradient(transparent, #016cce 80%); } #first-edition .right-col .readmore { position: absolute; bottom: 0; left: 0; width: 100%; height: 15em; padding: 10em 0 0; text-align: center; background: linear-gradient(rgba(255,255,255,0), rgba(255,255,255,1) 75%); } #first-edition .table-contents { background: transparent; border: 0; } #first-edition .table-contents a { color: #fff; } .datebox { margin: 0 auto 15px; padding: 45px 15px; background: #fff; border-radius: 8px; color: #000; text-align:center; } .datebox .month { display: block; font-size: 3em; font-weight: bold; line-height: 1em; } .datebox .year { display: block; font-size: 1.5em; font-weight: bold; line-height: 1em; } #page-glossary .radio, #page-glossary .checkbox { line-height: 1.1em; margin-bottom: 20px; } .search-result { margin: 15px 0; } .search-result a { display: block; color: #000; text-decoration: none; } .search-result .title { display:block; color: #016cce; font-size: 1.2em; font-weight: bold; } .search-result .subtitle { display:block; } .search-result .url { display:block; color: #AAA; font-size: 0.8em; } @media only screen and (min-width: 768px) and (max-width: 1199px) { .sf-menu li a { padding: 0 12px; } #header .logo { max-width: 260px; } } @media only screen and (max-width: 767px) { .content { padding: 15px 0; overflow-x: hidden; } #footer .flex-row, #sponsors .flex-row, #about-blurb { flex-wrap: wrap; } #footer .topic-menu, #footer .about-menu, #footer .social { flex-basis: 100%; margin: 10px auto; text-align: center; } #footer .topic-menu ul { columns: 1; } #sponsors a.col { flex-basis: calc(50% - 30px); } #home-header .mailing-list .form-group, #mailing-list .mailing-list .form-group { min-width: 0; } #page-home #home-header .backgrounds .bg { display: none; } #page-home #home-header .backgrounds #bg-5 { display: block; flex-basis: 100%; height: auto; padding-top: 100%; } .page-heading h1 { font-size: 42px; line-height: 1.2em; } a.news-box { flex-basis: calc(50% - 30px); } a.news-box .img-cover { font-size: 1.5em; } #first-edition .flex-row, #article-overview .flex-row { flex-wrap: wrap; align-items: flex-start; } #first-edition .left-col, #article-overview .section-col { flex-basis: 100%; } #first-edition .right-col, #article-overview .column-col { flex-basis: 100%; margin: 15px auto !important; } #back-to-top { right: 15px; bottom: 15px; } .home-icons .home-icon { flex-basis: calc(50% - 15px); } .home-icons .home-icon .title { font-size: 0.9em; } #page-home .profile { flex-basis: 100%; margin-bottom: 30px; } #page-home .bio { margin: 0; } #page-events .content .flex-row { align-items: flex-start; } #page-events .content .event .title { font-size: 18px; } #page-events .content .event .location, #page-events .content .event .date { font-size: 0.8em; } a.columnist-box { flex-basis: calc(50% - 15px); } a.columnist-box .name { font-size: 0.8em; line-height: 1.1em; } #page-columndir .content .flex-row { flex-wrap: wrap; } #page-columndir .content .author-bio { flex-basis: 100%; margin: 0; } #page-columndir .content .column-directory { flex-basis: 100%; margin: 15px auto !important; } a.news-list .img-cover { font-size: 1em; } a.news-list .news-title { font-size: 1em; } }