/* CSS "My Blog" File*/

body {
  background-color:transparent;
}
.flexdiv1 {
  display:flex;
  flex-direction:row;
  height:auto;
}
.side1 {
  flex:1;
  padding:2.5px;
  height:auto;
  margin-right:5px;
  background-color:transparent
}
.side2 {
  flex:5;
  background-color:pink;
  padding:2.5px;
  height:auto;
  font-size:20px;
  border-right:3px solid black;
  border-left:3px solid black;
}
.side3 {
  flex:1;
  padding:2.5px;
  height:auto;
  margin-left:5px;
  background-color:transparent
}
.flexdiv2 {
  display:flex;
  flex-direction:column;
  height:auto;
}
.head {
  flex-direction:column;
  flex:1;
  background-color:gray;
  margin:0;
  padding:5px;
  font-size:50px;
  color:white;
  text-align:center;
}
@media (max-width:900px) {
  .side3 {display:none}               /*CHECK*/
  .side1 {display:none}
  p {font-size:16px}
  iframe {display:none}
  .link {display:inline}
  .img1 {float:none;display:block;margin-left:auto;margin-right:auto;}
}
.img1 {
  width:30%;
  height:auto;
}
.ad1 {
  background-color:white;
  position:relative;
  top:45%;
}
@media (min-width:1599px) {
  p {font-size:25px}
  .link {display:none}
}
.bold {
  text-align:center;
  font-weight:bold;
  font-size:30px;
}
@media print {
  .side3 {display:none}
  .side1 {display:none}
  p {font-size:16px}
  .side2 {background-color:transparent;border-right:none;border-left:none;}
  .flexdiv2 {background-color:transparent}
  #hide {display:none}
  iframe {display:none}
}
#hide {
  color:blue;
}
.link {
  font-weight:bold;
}
@keyframes animation {
  from {opacity:0;}
  to {opacity:1;}
}
.animation1 {
  animation-name:animation;
  animation-duration:10s;
}
@media (min-width:901px) {              /*FIX MARGIN BELOW*/
  .img1 {float:left;margin:10px;}
}