/**
 * garrHome.css
 * author: Corey Barnes
 * updated: 8 March, 2023
 */

/*for use on the Home page*/

body {
  background-color: #000000;
  /*background-image: url("art/paintings/Colorform.jpg");*/
  color: #FFFFFF;
  font-family: Arial, serif;
}

.parallax {
  background-image: url("art/paintings/Colorform.jpg");
  height: 100%;
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  color: #43B3AE;
  padding-bottom: 1vw;
}

header {
  height: 7.5vw;
  margin-bottom: 1vw;
}

h1, h2, h3 {
  font-family: "Arial Black", Arial, serif;
}

img {
  max-width: 100%;
  max-height: 100%;
}

/* -soon-
.runner {
  position: -webkit-sticky;
  position: sticky;
  text-align: center;
  top: 0;
}*/

a:link {
  color: #E0E0E0;
}
a:visited {
  color: #E0E0E0;
}
a:hover {
  /*color: #FF6342;*/
  color: #E99708;
}

header > nav {
  height: 100%;
}

nav {
  float: right;
  display: flex;
  margin-right: 5vw;
}

nav > a {
  height: 100%;
}

nav a {
  width: 10vw;
  transition: 0.5s;
  /*font-size: 150%;*/
}

nav a {
  display: block;
  position: relative;
  text-align: center;
  line-height: 7.5vw;
  text-decoration: none;
  color: #FFFFFF;
  transition: 0.5s;
  border: 1px solid white;
}

nav:hover a {
  transform: scaleX(0.5);
  /*opacity: 0.2;*/
  /*filter: blur(5px);*/
  border-left: none;
  border-right: none;
}

nav a:hover {
  transform: scaleX(2);
  /*opacity: 1;*/
  /*filter: blur(0);*/
  text-decoration: none;
  color: #FFFFFF;
  font-style: bold;
  border-left: none;
  border-right: none;
}

nav a:before {
  content: '';
  position: absolute;
  transition: 0.5s;
  transform-origin: right;
  transform: scaleX(0);
}

nav a:hover:before {
  transition: transform 0.5s;
  transform-origin: left;
  transform: scaleX(1);
}

.show {
  display: inline-block;
}

.prose {
  margin-top: 5vw;
  margin-left: 10vw;
  margin-right: 10vw;
}

iframe {
  width: 40vw;
  height: 30vw;
  border: none;
  margin: auto;
  display: block;
}

.gif-cont {
  width: 40vw;
  height: auto;
  border: none;
  margin: auto;
  display: block;
}

table {
  padding-top: 0;
  text-align: center;
  width: 90vw;
}

td {
  /*padding-top: 0;*/
  padding: 2.5vw;
  text-align: center;
}
/* -maybe later-
td > img {
  height: 30vw;
  width: auto;
}

td > a > img {
  height: 30vw;
  width: auto;
}
*/
footer {
  border-top: solid 1px lightgrey;
  text-align: center;
  margin-top: 1vw;
}

footer table {
  padding-left: 0;
  width: 55.5px
}

footer td {
  padding: 12px;
}

/*footer buttons*/
svg {
  color: #D3D3D3;
}

svg.youtube:hover {
  color: #FF0000;
}

svg.instagram:hover {
  color: #C32AA3;
}

svg.facebook:hover {
  color: #3B5998;
}

svg.twitter:hover {
  color: #1DA1F2;
}