/*
Theme Name: Rich 2024
Theme URI: https://richardmatthews.com/
Description: Photography template for Richard Matthews because the last one was shit
Version: 0.1
Author: Ted V
Tags: photography, black, portfolio, uncluttered

*/
object, embed, a { outline:none; }
body { margin: 0px; }

/*///// layers /////*/
#box { max-width: 1200px; margin:0 auto; }
#wrapper { width:100%; background:#fff; display: inline-block; min-height: 800px; }
#header { height:100px; position:relative; background-color:#888; }
#header-box { max-width: 1200px; margin: 0 auto; position: relative; }
#title-block { left:0px; top:38px; position:absolute; }
#sidebar { display:none; /*width:185px; height:350px; margin:140px 0 0 15px; float:left;*/ }
#centreblock { width:100%; height:auto; margin:60px 0; background:#fff; }
#menubar { position:absolute; top:38px; right:0px; }
#footer { background-color:#888; min-height:300px; }
#foot { margin:0 auto; max-width:1200px; height:50px; text-align:center; padding:50px 0; }
#social { margin: 10px auto; display: inline-block; }
#social a { text-decoration: none; }
#social .dashicons { color:#fff; font-size:36px; }
#content { overflow:hidden; display: none; }
#heel { width: 100%; text-align: center; }

/*//\\ //\\*/
.navbar ul { margin:0; padding:0; }
.navbar ul li { display:inline; text-align:left; list-style-type:none; margin:0 0 0 35px; }
#gallery-block { margin:30px 0; background:#fff; display: flex; width: 100%; justify-content: space-between; flex-wrap:wrap; align-items: center;
  min-height: 500px; column-gap: 10%; row-gap: 30px; }
#gallery-block .category-gallery { margin:auto; }
.gallery-title { font-size: 18px; }
#prev { position:absolute; left:0px; }
#next { position:absolute; right:0px; }
.wpcf7 { text-align:left; max-width: 350px; }
.wpcf7-form-control.wpcf7-textarea { width: 100%; }
.wpcf7-form-control { background:#fff; border:1px solid #666; color:#999; width:100%; }
.wpcf7-submit { cursor:pointer; width: 60px; }

#menubtn { display:none; }
#menubtn .dashicons { color: #fff; font-size: 36px; }
.home { text-align: center; }
/*///// type /////*/
.title a { font-family:Arial, Helvetica, sans serif; font-size:20px; color:#8ee4ff; text-decoration:none; font-weight:100; }
.nextpage a { font-family:Arial, Helvetica, sans serif; font-size:20px; color:#888; text-decoration:none; font-weight:100; }
.small { font-family:Arial, Helvetica, sans serif; font-size:0.75em; color:#b1b1b1; text-decoration:none; font-weight:100; }
.navbar ul li a { color:#fff; text-decoration:none; }
.small a, .storycontent a { color:#51abc7; text-decoration:none; }
.small a:hover, .storycontent a:hover, .navbar ul li a:hover, .nextpage a:hover { color:#666; } 
.storycontent { font-family:Arial, Helvetica, sans serif; color:#666; text-decoration:none; font-weight:100; }
.navbar .current-menu-item a, .navbar .current-post-ancestor a { color:#8ee4ff; }
.navbar { font-size:20px; font-family:Arial, Helvetica, sans serif; }
#prev a::before { content:'< '; }
#next a::after { content:' >'; }

/*///// pagination /////*/
.wp-pagenavi, .wp-pagenavi a { font-family:Arial, Helvetica, sans serif; font-size:12px; color:#666; text-decoration:none; font-weight:100; }
.wp-pagenavi a, .wp-pagenavi span {
    border: 1px solid #c2c2c2 !important;
    margin: 2px;
    padding: 3px 5px;
    text-decoration: none;
}

.wp-pagenavi span.current {
    font-weight: normal !important;
    color: #ff6600;
}
.type-post { display: inline-block; margin-bottom:60px; }
#navpost { display: inline-block; position: relative; width: 100%; margin:120px auto 30px auto; }

/*///// gallery /////*/
#gallery { margin-top:50px; height:210px; }
.gallery-item { margin:0; }
.gallery-icon { width:100px; height:100px; float:left; margin:0 4px 4px 0; }
#swipebox-overlay { background-color:#999!important; }
.storycontent .wp-block-gallery.has-nested-images figure.wp-block-image { flex-grow:0; }
.wp-block-gallery.has-nested-images figure.wp-block-image img {
    aspect-ratio: 1; /* squared size thumbnails */ 
    object-fit: cover;
  }
  .wp-block-gallery.has-nested-images figure.wp-block-image {
    flex-grow: 0; /* width fix */ 
  }

#horizontal { display: flex; width: auto; flex-direction: row; flex-wrap: nowrap; column-gap: 10%; }
#horizontal .wp-block-image { max-width: none; overflow:hidden; display: flex; flex-direction: unset; width: auto !important; height:60vh !important; justify-content: center; max-width: 100%; position: relative; align-items: center; flex-shrink:0; }
#horizontal .wp-block-image a { display: block; width: auto !important; overflow:hidden; }
#horizontal img { width:100%; height:auto; aspect-ratio: unset; max-height: 60vh; overflow:hidden; }
.scrollbox { overflow-x: auto; }

#slides { display:inline-block; max-width: 800px; margin: 0 auto; overflow: hidden; visibility:hidden; z-index:1; }
#slides figure.wp-block-image img { aspect-ratio: unset; }
.enter { display: inline-block; width: 100%; }

/*///// responsive /////*/

@media screen and (max-width:1200px) {
    #title-block { left:10px; }
    #menubar { right:10px; }
    #box { padding-left:10px; padding-right: 10px; }
}

@media screen and (max-width:860px) {
  .navbar ul li { margin: 0 0 0 20px; }

}

@media screen and (max-width:768px) {
  #slides { width:100%; }
  .navbar.open {visibility:visible; opacity:1; overflow: auto; }
  .navbar { position: fixed; width:100%; height:100%; visibility:hidden; background:#888; z-index: 10; left: 0; top: 0; opacity:0; transition: all 0.5s; }
  .frozen { overflow: hidden; }
  #menu-sidemenu { margin:100px auto; max-width: 80%; }
  .navbar ul li { display: block; margin:30px; }
  #menubtn { display:block; position: absolute; right: 30px; top: -8px; cursor: pointer; z-index: 20; }
  #menubtn.active .dashicons { color:#8ee4ff; }
}

@media screen and (max-width:640px) {

}