/*
Theme Name: 	VA War Memorial 2019
Theme URI: 		https://scottins.com
Description: 	A custom theme for Va War Memorial
Version: 		1.0
Author: 		28 Media / L Sterling
Author URI: 	http://28media.com
*/

/** ======================================================================**/
/** Custom styles for Virtual Shrine section of site                      **/
/** ======================================================================**/

/* Splash page title/search row */

.shrine-title-area {display:flex;flex-direction: row; margin-bottom: 18px;}
.shrine-title {width: 60%;}
.shrine-title-search {width: 40%;}
#search-options {position: relative; top: 22px;}
#search-fields {display:flex;flex-direction: row; margin-bottom: 6px;}
#submit-search {width: 34%; background-color: #0955a1; border-color: #0955a1;}
#enter-name-simple-search {padding-left: 8px;}
#advanced-search a {color: #0955a1; font-weight: bold; font-size: 20px; text-decoration: none; padding-left: 8px;}
#enter-name-simple-search {border-right-width: 0;}
/*input#enter-name::placeholder DELETE
    color: #0955a1;
}*/

.shrine-contents {padding-bottom: 20px;}
#shrine-slideshow {
	background-repeat: no-repeat; 
	background-size: cover; 
	background-position: center center; 
	width: 100%;
	height: 100%;
	position: relative;
}
.splash-slide-row {}

.page-id-32230 #wrapper,.page-id-32230 #main {padding-bottom: 0;}

@media (max-width: 1399px) {
  #search-options {
    top: 16px; }}

@media (max-width: 1299px) {
  #search-options {
    top: 12px;; }}

@media (max-width: 1199px) {
  #search-options {
    top: 10px;; }}

@media (max-width: 991px) {
  #search-options {
    top: 4px;; }
  #advanced-search a {font-size: 16px;}
}


/* Advanced Search / Results pages */

body.page-id-32266 #main {padding-top: 0; padding-bottom: 0;}
body.page-id-32270 #main {padding-top: 0; padding-bottom: 0; border-color: #05316a;/*extend sidebar blue downward*/}
body.page-id-32266 #wrapper {padding-top: 0; padding-bottom: 0;}
body.page-id-32270 #wrapper {padding-top: 0; padding-bottom: 0;}


#advanced-search-area {display:flex;flex-direction: row; min-height: 1070px;}
#search-form-area {width:40%; background-color: #0955a1; 
  background-image: linear-gradient(#0955a1, #05316a); padding-top: 50px; padding-right: 45px; }
#search-results-area {
  padding: 50px 60px 40px 40px;
  width:60%; 
  background-image: url(https://staging-vawarmemorial-staging.kinsta.cloud/wp-content/uploads/2023/02/clouds-sky2.jpg); 
  background-size: cover; 
  background-position: left;
}
#search-results-wrap{
  display: flex;
  flex-direction:row;
  flex-wrap: wrap;
}
#enter-name, #enter-locale, #enter-conflict, #enter-branch {
  width:66%; border-color: #0955a1; color: #0955a1; font-weight: bold; padding: 4px 8px;
}

/** TEMP install memory photo on advanced search page...this will not in the end be separate from results **/
body.page-id-32270 #search-results-area {
  background-image: url(https://staging-vawarmemorial-staging.kinsta.cloud/wp-content/uploads/2023/01/memory-for-advanced2.jpg);
  background-size: cover; background-position: right;
}

/* SIDEBAR STYLES */

#sidebar-content {width: 80%; max-width: 432px; float: right;}
.sidebar-headline {color: #fff; font-family: "Libre Baskerville", Times, serif; font-size: 32px; font-weight: bold; letter-spacing: 3px;}
.sidebar-copy {color: #fff;}
#advanced-search-area label {color: #fff; font-weight: bold; margin-bottom: 0.2rem;}

#advanced-search-area input[type=text], #advanced-search-area select {
    width: 100%;
    padding: 10px 15px;
    margin: 5px 0 20px;
    box-sizing: border-box;
    background-color: #a5d0ef;
    background-image: url(../images/down-arrow.png), url(../images/form-input-gradient.jpg);
    background-position: center right, top left;
    background-repeat: no-repeat;
    border-top-style: hidden;
    border-right-style: hidden;
    border-left-style: hidden;
    border-bottom-style: hidden;
    outline: none;
}
/* remove the down arrow from the name input field*/
#enter-name {background-image: url(../images/form-input-gradient.jpg) !important;}
#advanced-search-fields input, #advanced-search-fields select {margin-bottom: 24px !important;}

#advanced-search-area input[type=submit], 
#advanced-search-area input[type=reset] {
  font-weight: normal;
  text-transform: none;
  padding: 10px 30px;
  width: 48%;
  color:white;
}
#sidebar-submit-search {margin-right: 2.5%;}

/* Suppress the display of the default down arrow */
#advanced-search-area select {appearance: none;}


#form-button-group {padding-top: 30px;}
#form-button-group .sidebar-button {background-color: #05316a; border-color: #fff; border-width: 1px;}

#sidebar-submit-search:hover {background-color: #a5d0ef;}
#sidebar-clear-search:hover {background-color: #a5d0ef;}

/* sidebar responsive adjustments */
@media (max-width: 1299px) {
  .sidebar-headline {
    font-size: 29px; }}

@media (max-width: 1199px) {
  .sidebar-headline {
    font-size: 27px; }}

@media (max-width: 1099px) {
  .sidebar-headline {
    font-size: 24px; }}

/* RESULTS AREA STYLES */

#search-results-area h3 + h4 {margin-bottom: 0.5rem}
.search-results-col {width: 50%; }
.soldier-data {background: url(../images/gold-star.png) left top no-repeat transparent; padding: 4px 35px;}
.soldier-data h3 {font-size: 18px; font-weight: bold; color: #000; text-transform: uppercase; margin-bottom: 20px !important;}
.soldier-data h4, .soldier-data h5 {font-size: 16px; font-weight: bold; color: #074487;}
.required-field {color: red; font-size: 115%;}
#search-results-area .nav-links .btn {background-color: #05316a; border-color: #fff !important;}
#search-results-area .nav-links .nav-next {border: 0px; border-left-width: 1px;}
#search-results-area .nav-links .nav-previous {border: 0px;}
#search-results-area .nav-links a {background-color: #05316a; color: #fff}
.paging-navigation {width: 100%;}


/* MOBILE LAYOUT */

@media only screen and (max-width: 991px) {
  #search-form-area {padding-right: 5px; padding-left: 5px;}
  #sidebar-content {width: 90%; float: none; margin: auto;}
  #search-results-area{ min-height:600px; }
  .sidebar-headline {font-size: 21px;}
}

@media only screen and (max-width: 768px) {
.shrine-title {width: 50%;}
.shrine-title-search {width: 50%;}
#advanced-search-area {flex-direction: column;}
#search-form-area {width: 100%; min-height: 750px;}
#search-results-area {width: 100%}
.sidebar-headline {font-size: 21px;}
}

@media only screen and (max-width: 576px) {
  .shrine-title-area {display:flex;flex-direction: column; margin-bottom: 18px;}
  .shrine-title h1 {margin-bottom: 14px;}
}