/*
Theme Name: Medium Format Theme 2020
Author: Armadillo Creative
Version: 1.0
Description: Custom theme for Medium Format
Text Domain: medium
*/

/* ======================= */
/* Misc Generics           */
/* ======================= */

[data-responsive-background-image] img { display: none; }
img {max-width: 100%; height: auto;}
:focus {border-radius: 0px; outline: none;}
.nav-padding {padding-top: 100px;}

.red {color: #aa3827;}
.shadow {-webkit-box-shadow: -6px 6px 10px 0px  #797979; -moz-box-shadow: -6px 6px 10px 0px #797979; box-shadow: -6px 6px 10px 0px #797979;}

input, textarea {border-radius: 0px; padding: 7px 10px; border: 1px solid black;}
select {width: 100%; padding: 7px 10px; border-radius: 0px;}

.contact-form p {font-weight: 700; }

.padding-top{padding-top: 90px;}
.padding-bottom {padding-bottom: 90px;}

.contact-form input, .contact-form textarea {width: 100%;}
.contact-form {position: relative; display: flex; width: 90%; margin: 0px auto 40px; justify-content: center;}
.screen-reader-response {display: none;}
.contact-form .wpcf7-submit {display: flex; justify-content: center; align-items: center; border: 1px solid black; padding: 5px 15px; margin-bottom: 15px; width: 100%; max-width: 100px; margin: 0px 0px 15px; background: black; border-radius: 0px; margin-left: 10px; height: 40px; color: white;}
.wpcf7-submit:focus {border-radius: 0px; outline: none;}
.contact-form .wpcf7-email {border-radius: 0px; width: 100%; padding: 7px 10px; border: 1px solid black; }
.wpcf7-response-output {text-align: center;}

@media (min-width: 992px) {
  .nav-padding {padding-top: 45px;}
  .contact-form {margin: 70px auto;}
  select {}
}

/*index.php*/

.blog-index .image {width: 100%; height: auto; padding-top: 75%; background-size: cover; background-position: center center; background-repeat: no-repeat;  margin-bottom: 20px;}
.blog-index a h2 { color: black; font-weight: 400; font-size: 18px;}
.blog-index h4 {font-weight: 300; font-size: 15px; margin-bottom: 10px; }
.blog-index a {color: black; opacity: 1.0; transition-duration: 500ms; }
a.post-item {display: block; margin-bottom: 65px;}
.blog-index a:hover {opacity: 1.0; text-decoration: none;}
.blog-index a.button {display: flex; justify-content: center; align-items: center; border: 1px solid black; padding: 5px 15px; margin-bottom: 15px; width: 100%; max-width: 350px; margin: 40px auto; color: white; background: black; opacity: 1.0 !important;}

@media (min-width: 1200px) {
  .blog-index a {opacity:0.7;}
}
/*archive-issue.php*/
ul#menu-member-menu {display: flex; justify-content: space-between; max-width: 450px; margin: 0 auto; margin-bottom: 60px; list-style: none; padding: 0px;}
ul#menu-member-menu li a{ color: black; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; opacity: 1.0; cursor: pointer; }
ul#menu-member-menu li.current-menu-item a{color: #aa3827;}
.issue {margin-bottom: 75px; text-align: center;} 
.issue img {width: 90%; -webkit-box-shadow: -6px 6px 10px 0px #797979; -moz-box-shadow: -6px 6px 10px 0px #797979; box-shadow: -6px 6px 10px 0px #797979}



@media (min-width: 575px) {
  .issue img {width: 100%;}
}



/*button animation*/
  a.animated-button  {
  padding: 5px 15px;
	color: black;
	cursor: pointer;
	display: flex; justify-content: center; align-items: center; 
	position: relative;
	border: 1px solid black;
  background: white;
	transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1); width: 100%; max-width: 250px; margin: 40px auto; margin-bottom: 15px;
}
 a.animated-button:hover {
	color: #fff !important;
	background-color: transparent;
  text-decoration: none;
}
 a.animated-button:hover:before {
	left: auto;
	right: 0%;
	width: 100%;
}
 a.animated-button:before {
	display: block;
	position: absolute;
	top: 0px;
	left: 0px;
	height: 100%;
	width: 0px;
	z-index: -1;
	content: '';
	color: #fff !important;
	background: black;
	transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1);
}