/*
Theme Name: TAG Template
Text Domain: TAG
Version: 3.1
Description: The template for The Alphen Group Blog
Tags: none
Author: Aiden Roberts
Author URI: thealphengroup.com
*/

/* NORMALIZE ///////////////////////*/
a {
  text-decoration: none;
}

.card {
  padding: 0px;
}


ul {
  /* used to remove the bullets from default unordered lists such
  as those that come in category returns in WP */
  list-style-type: none;
  padding: 0;
  margin: 0;
}
/*////////////////////////////////////*/


/* NAVIGATION/HEADING CSS ////////////////////////*/

.header {
  background-color: #F9F9F9;
  border-bottom: 3px solid #BCDBFF;
  line-height: 1;
}

.menu-item {
  padding: 20px;
  font-size: 20px;
  font-weight: bold;
  text-align: center;
}

.menu-item a {
  color: #2596be;
}

.menu-item:hover {
  cursor: pointer;
}

.head-text {
  font-size: 30px;
  font-weight: bold;
  margin-right: 50px;
  color: black;
}

.subhead-text {
  color: #2596be;
  font-size: 15px;
}

/*/////////////////////////////////////*/

/* /////////////// FRONT PAGE STYLING /////////*/

/* GENERAL /////////////// */
.row-theme-dark {
  background-color: #F9F9F9;
}
.row-theme-light {
  background-color: #2596be;
  color: white;
}
.front-page-section {
  padding: 0px;
  padding-top: 40px;
  padding-bottom: 60px;
}

.front-page-section h2 {
  padding-top: 0px;
  margin-bottom: 20px;
  border-bottom: 2px solid white;
}

.premium-section-title {
  text-align: center;
  padding-top: 0px;
  margin-bottom: 20px;
}

.section-separator {
  text-align: center;
  width: 100%;
  background: #BCDBFF;
  height: 5px;
  z-index: 3;
}
.section-banner {
  background: white;
  border: 3px solid #BCDBFF;
  position: absolute;
  padding: 20px;
  padding-top: 2px;
  padding-bottom: 2px;
  left: 50%;
  transform: translate(-50%, -50%);
  border-radius: 50px;
  color: black;
  z-index: 3;
  margin-bottom: 0;
}
.section-banner h5 {
  margin-bottom: 0;
}

.edge-to-edge {
  padding-left: 0;
  padding-right: 0;
}

.centered {
  text-align: center;
}

/* SECTION 1 -- MAIN INTRO */
.main-background-holder {
  height: 350px;
  width: 100%;
  overflow: hidden;
  position: relative;
}

.main-background-image {
  object-fit: cover;
  height: 100%;
  width: 100%;
  z-index: 0;
}

.main-intro-content {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  position: absolute;
  z-index: 1;
  text-align: left;
}

.intro-header {
  position: relative;
  color: white;
}

.intro-text {
  position: relative;
  color: white;
}

.intro-post-category {
  border: 2px solid white;
  padding: 3px;
  border-radius: 5px;
  padding: 5px;
  padding-left: 10px;
  padding-right: 10px;
  font-size: 15px;
  background-color: white;
  color: #2596be;
}
.intro-post-category:hover {
  background-color: rgba(0,0,0,0);
  padding: 5px;
  padding-left: 10px;
  padding-right: 10px;
  color: white;
}
.intro-post-category a {
  color: #2596be;
}
.intro-post-category a:hover {
  color: white;
}

/* SECTION 2 -- START RECENT POST STYLING */

.recent-post-image {
  object-fit: cover;
  height: 100%;
  width: 100%;
  position: relative;
  z-index: 0;
}

.recent-post-image-holder {
  height: 350px;
  overflow: hidden;
}

.preview-padded-col {
  padding: 10px;
  padding-top: 30px;
}

.recent-post-category {
  border: 2px solid white;
  padding: 3px;
  border-radius: 5px;
  padding: 5px;
  font-size: 15px;
  margin-right: 10px;
  background-color: rgba(0, 0, 0, 0);
  color: white;
}
.recent-post-category:hover {
  background-color: white;
  padding: 5px;
  color: #2596be;
}
.recent-post-category a {
  color: #2596be;
}
.recent-post-category a:hover {
  color: white;
}

.recent-post-date {
  background-color: white;
  border-radius: 5px;
  padding: 7px;
  font-size: 15px;
  color: #2596be;
}

.recent-post-title {
  color: white;
}
.recent-post-title:hover {
  color: #BCDBFF;
}

.recent-post-author {
  font-size: 20px;
}

.recent-post-excerpt {
  font-size: 8px;
}


/* SECTION 3 -- RECENT POSTS (NEXTRECENT) ////// */
.preview-card {
  height: 200px;
  overflow: hidden;
  border-radius: 10px;
  border: 2px solid #F9F9F9;
}

.preview-background {
  display: inline-block;
}

.preview-background-image {
  object-fit: cover;
  height: 100%;
  width: 100%;
  position: absolute;
  vertical-align: middle;
  z-index: 0;
}


.nextrecent-card-body {
  position: absolute;
  width: 100%;
  bottom: 0;
  background: linear-gradient(to top, rgba(0, 0, 0, 0.85), transparent);
}

.nextrecent-post-category {
  background-color: #2596be;
  border-radius: 5px;
  padding: 5px;
  font-size: 12px;
  margin-right: 10px;
  color: white;
}
.nextrecent-post-category:hover {
  background-color: rgba(0,0,0,0);
  border: 2px solid white;
  padding: 3px;
  color: white;
}
.nextrecent-post-category a {
  color: white;
}
.nextrecent-post-category a:hover {
  color: #2596be;
}

.nextrecent-post-date {
  background-color: #2596be;
  border-radius: 5px;
  padding: 5px;
  font-size: 12px;
  margin-right: 10px;
  color: white;
}

.nextrecent-post-title {
  margin-top: 10px;
  margin-bottom: 10px;
  color: white;
}
.nextrecent-post-title:hover {
  text-decoration: underline;
}

.nextrecent-post-author {
  color: white;
}


/* SECTION 4 -- PREMIUM PREVIEW /////////// */

.premiumpreview-post-date {
  color: #2596be;
}

.premiumpreview-card {
  margin-bottom: 5px;
}

.premium-preview-card-main {
}

.premium-card-title {
  color: #2596be;
}

.premium-image {
  height: 300px;
  object-fit: cover;
}

/* ARTICLE SPECIFIC STYLING (SINGLE.PHP) /////////*/
article {
  margin-top: 30px;
  background-color: #F9F9F9;
  border-radius: 10px;
  margin-bottom: 40px;
  padding: 20px;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
  position: relative;
  z-index: 1;
}

.article-background {
  width: 100%;
  background-color: #2596be;
  background-color: white;
}

.article-background-image {
  width: 100%;
  object-fit: cover;
  height: 800px;
  position: absolute;
  z-index: 0;
}

.article-lead {
  margin-top: 60px;
  padding: 10px;
  border-bottom: 0px solid white;
  background-color: rgba(0,0,0,.0);
  z-index: 1;
}

.article-title-light {
  color: white;
  font-size: 70px;
}
.article-title-dark {
  color: black;
  font-size: 70px;
}

.article-header {
  margin-bottom: 20px;
}

.article-author-light {
  color: white;
}
.article-author-dark {
  color: black;
}

.article-content {
  font-size: 1.3rem;
}

.meta-data {
  background-color: white;
  margin-right: 5px;
  padding: 5px;
  color: black;
  border-radius: 3px;
}

.meta-data a {
  color: black;
}

.arrow-buttons {
  padding: 0px;
  border-radius: 5px;
  margin-bottom: 40px;
  border: 0px solid #F1F1F1;
  font-style: italic;
}

.right-arrow-holder {
  text-align: right;
}

.left-arrow-holder {
  text-align: left;
}
/*/////////////////////////////////////*/


/* PAGE SPECIFIC STYLING /////////*/
.page-heading {
  text-align: right;
  color: #2596be;
}
.page-heading a {
  color: #2596be;
}

.archive-background {
  background-color: #2596be;
  padding: 0;
}

.archive-section-title {
  color: white;
  text-align: left;
}

.post-categories {
  margin: 0;
}

.footer-title {
  color: white;
}

.footer-text {

}

.footer {
  padding: 10px;
}
/*/////////////////////////////////////*/


/* ACCESSORY STYLING /////////*/
a:hover {
  color: #3A82D9;
}

.blockquote {
  border-left: 3px solid black;
  padding-left: 20px;
  margin-top: 20px;
  margin-left: 40px;
}

.wp-block-search__input, .wp-block-search__button {
  border-radius: 5px;
}

.metadata {
  white-space: nowrap;
  margin: 2px;
  display: inline-block;
}
/*/////////////////////////////////////*/


/* Member Card CSS */

.member-card {
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
	cursor: pointer;
  padding-bottom: 10px;
  color: black;
  width: 200px;
  line-height: 1;
}
.member-card:hover {
	box-shadow: 0 20px 40px 0 rgba(0, 0, 0, 0.3);
}

.member-info {
  text-align: left;
  position: absolute;
  background-color: #2596be;
  color: white;
  border-radius: 5px;
  margin: 10px;
  padding: 5px;
}
.member-card::-webkit-scrollbar {
  display: none;
}

.member-title {
  text-align: left;
  margin-top: 40px;
  padding: 10px;
  padding-top: 2px;
}


.member-image {
  width: 100%;
  object-fit: cover;
}
/*///////////////////////////////////*/
