/* across all pages*/
body {
  margin: 0;
  font-family: arial;
  background-color: white;
}

iframe {
  display: block;
  /* iframes are inline by default */
  background: #000;
  border: none;
  /* Reset default border */
  height: 162px;
  width: 288px;
}

img {
  display: block;
  height: 100%;
  width: 100%;
}

h1 {
  margin: 0;
}

audio {
  width: 100%;
}

/* unvisited link */
a:link {
  text-decoration: none;
}

/* visited link */
a:visited {
  color: green;
}

/* mouse over link */
a:hover {
  color: hotpink;
  filter: blur(0.5px);
}

/* selected link */
a:active {
  color: blue;
}
.email{
  filter: blur(-5px);
}
/* elemets */
.star {
  background-color: #f6f7d5;
  text-decoration: none;
  display: block;
  text-align: center;
  text-align: justify;
  -webkit-text-align: justify;
  text-align: -webkit-justify;
  text-transform: uppercase;
  -moz-text-align-last: justify;
  /* For Firefox */
  text-align-last: justify;
  height: 1em;
  width: 100%;
  font-size: 1rem;
  filter: blur(0.5px);
  position: fixed;
  top: 0;
  box-shadow: 0 3px 20px 15px #f6f7d5;

  /*-webkit-filter: blur(2.5px);*/
}
.star:after {
  content: " ";
  display: inline-block;
  width: 100%;
}

/*#star {
  padding: 10px;
}*/

.textInBox {
  padding: 1% 5%;
}
.construction {
  justify-content: center;
  margin: auto;

}
.CVbody {
  padding: 2% 3%;
  background-color: white;
  color: black;
  /*text-shadow: 2px 2px 10px black;*/
}

.CV {
  text-align: center;
  font-size: 2rem;
  margin: -5% 10% 10% 75%;
}

.commisionlist {
  list-style-type: "🜚";
  padding-bottom: 5%;
}

.textInBox h1 {
  padding: 7%;
  text-decoration: underline;
  filter: blur(0.7px);
}


.big-page {
  display: flex;
  max-height: 80%;
  justify-content: space-around;
  align-items: center;
  margin-top: 17vh;
  flex-wrap: wrap;
  flex-basis: 33.333333%
}
.box {
  min-height: 330px;
  min-width: 330px;
  max-height: 330px;
  max-width: 330px;


  flex:1;
  margin: 3em;

}
.left {
  flex: 1;
  background-color: #cbc7f0;
  box-shadow: 5px 5px 40px 45px #fbdefc;
  /*box-shadow:
   0 0 30px 15px #4c4d54,  /* inner white */
   /*0 0 60px 30px #fff,  /* inner white */
   /*0 0 100px 60px #f0f, /* middle magenta */
   /*0 0 140px 90px #0ff; /* outer cyan */
  background-image: url(images/phonefarm.png);
  background-position: center;
}

.center {
  flex: 1;
  background-color: #ebfcef;
  box-shadow: 5px 5px 40px 45px #ebfcef;
}

.right {
  flex: 1;
  background-color: #f6fabb;
  box-shadow: 5px 5px 40px 45px #f6fabb;
}

/* What A Cold Take */
.whatAColdTake {
  margin: 0;
  width: 97.5vw;
  height: 50%;
  display: flex;
}

.whatAColdTakeVideo {
  height: 180px;
  width: 320px;
  margin: 330px 552px 235px 500px;
  background-color: blue;
  opacity: 0.6;
  position: absolute;
  box-shadow: 5px 5px 40px 20px black;
  transform: skewY(-5deg);
}

.AlieenWasPisces {
  height: 600px;
  width: 100px;
  margin: 30px 800px 0 140px;
  position: absolute;
  background-color: green;
  opacity: 0.15;
  transform: skewY(10deg);
  box-shadow: 5px 5px 40px 20px green;
}

.AlieenBottom {
  -webkit-max-logical-height: 100%;
-webkit-max-logical-width: 100%;
  position: absolute;
  margin: 580px 500px 40px 70px;
}
.horizon {
  -webkit-max-logical-height: 100%;
-webkit-max-logical-width: 100%;
  position: absolute;
  margin-top: 450px;
}

.glass {
  height: fit-content;
  width: fit-content;
}

.fallingSmudge {
  height: 445px;
  width: 235px;
  margin: 140px 100px 150px 915px;
  background-color: #a4cdb5;
  box-shadow: 5px 5px 40px 20px #a4cdb5;
  position: absolute;
  opacity: 0.9;
}
.smudgeBottom {
  -webkit-max-logical-height: 100%;
-webkit-max-logical-width: 100%;
  position: absolute;
  margin: 550px 10px 10px 870px;
}
#glassDescription {
  padding: 0 7%;
  color: blue;
  font-family: arial;
  font-size: 0.80rem;
}

#glassText {
  opacity: 0;
}

#glassText:hover {
  opacity: 100;
}

/* I Changed My Mind */

.LeftChanged {
  /*max-height: 350px;
  max-width: 350px;
  top: 0;
  bottom: 0;
  right: 65%;
  left: 5%;
  margin: auto;*/
  box-shadow: 5px 5px 40px 20px #bcd1cd;
}

.CenterChanged {
  /*max-height: 350px;
  max-width: 350px;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;*/
  box-shadow: 5px 5px 40px 20px #808a88;
}

.RightChanged {
  /*max-height: 350px;
  max-width: 350px;*/
  background-color: #7dbdcd;
  /*position: absolute;
  top: 0;
  bottom: 0;
  right: 5%;
  left: 65%;
  margin: auto;*/
  box-shadow: 5px 5px 40px 20px #7dbdcd;
}

.bottomBoxChnaged {
  height: 5vh;
  width: 90vw;
  /*top: 80%;
  bottom: 0;
  right: 5%;
  left: 5%;*/
  /*background-color: pink;
  box-shadow: 5px 5px 40px 20px pink;*/
}

.box img {
  height: 100%;
  width: 100%;
  object-fit: cover;
}

.eraserewind {
box-shadow: 5px 5px 40px 20px pink;

}
#glassDescription {
  padding: 0 7%;
  color: blue;
  font-family: arial;
  font-size: 0.80rem;
}

#glassText {
  opacity: 0;
}

#glassText:hover {
  opacity: 100;
}

/* phone */

@media screen and (max-width: 767px) {
body {
    padding: 0;

}
.big-page {
  flex-direction: column;
  align-items: center;
}
.box{
  margin:auto;
}
.whatAColdTake {
  display: flex;
  justify-content: space-around;
  align-items: center;
}

.whatAColdTakeVideo {
  display: none;
}

.AlieenWasPisces {
  display: none;
}

.AlieenBottom {
  display: none;
}
.horizon {
  display: none;
}

.sunGlass {
  display: none;
}

.fallingSmudge {
  margin: 700px auto 20px auto;
  background-color: #a4cdb5;
  box-shadow: 5px 5px 40px 20px #a4cdb5;
  display: block;
  opacity: 0.9;
  min-height: 28em;
}
.smudgeBottom {
  margin: 1150px 20px 20px 20px;
  -webkit-max-logical-height: 100%;
-webkit-max-logical-width: 100%;
  margin-bottom: 0;
  display: block;
}
#glassText {
  opacity: 100%;
}