Home page 4 – exp FSW Gallery

Unique Cut-Paper Paintings

Cut-paper Paintings

This method does not work

/*

• attempt to make a header
• did not work
  .page-id-4858 {
  @media screen and (max-width: 768px) {
  .storefront-breadcrumb {
  margin: 0;
  padding: 0;
  }
  }
  #page {
  .woocommerce-breadcrumb {
  display: none;
  }
  .site-header {
  display:none;
  }
  header#masthead {
  display: none;
  }
  }
  h1 {
  position: relative;
  top: 0;
  left: 40%;
  font-family: ‘Fondamento’, cursive;
  font-size: 92px;
  margin: 0;
  padding: 0;
  color: #1f8992;

// @media screen and (max-width: 1535px) {
// left: 40%;
// font-size: 80px;
// }
@media screen and (max-width: 1024px) {
top: 2rem;
left: 32%;
font-size: 64px;
}
@media screen and (max-width: 660px) {
font-size: 50px;
top: 2rem;
left: 30%;
margin-left: 3px;
}
// iphone X
@media only screen
and (min-device-width : 375px)
and (max-device-width : 812px)
and (-webkit-device-pixel-ratio : 3)
and (orientation: portrait) {
font-size: 48px;
top: 2rem;
left: 32%;
text-align: center;
margin-left: 0px;
max-width: 80%;
}
// ipad

    // ipad pro 
}
.entry-content {
    position: relative;
    top: 0;
    left: 0;
    display: block;
    &:after {
        clear: both;
    }
    h2 {
        position: absolute;
        top: 0;
        left: 40%;
  font-family: 'Fondamento', cursive;
        font-size: 42px;
    margin: 0;
    padding: 0;
        color: #1f8992;
        margin-left: 3rem;

// @media screen and (max-width: 1535px) {
// left: 40%;
// font-size: 30px;
// }
@media screen and (max-width: 1024px) {
top: 2rem;
left: calc(32% – 2rem);
font-size: 30px;
}
@media screen and (max-width: 660px) {
top: 2rem;
left: 30%;
margin-left: 12px;
font-size: 24px;
}
@media only screen
and (min-device-width : 375px)
and (max-device-width : 812px)
and (-webkit-device-pixel-ratio : 3)
and (orientation: portrait) {
top: 3rem;
left: 0;
}
}
img {

        // position: relative;
        // top: -9rem;
        // left: -2rem;
        position: absolute;
        top: -7rem;
        left: calc(40% - 16rem);
        width: 274px;
        height: 235px;
        @media screen and (max-width: 1024px) {
            top: -5rem;
            left: calc(40% - 18rem);
            width: 219px;
            height: 188px;
        }
        @media screen and (max-width: 660px) {
            top: -4rem;
            left: calc(40% - 14rem);
            width: 175px;
            height: 150px;
        }
        @media only screen 
            and (min-device-width : 375px) 
            and (max-device-width : 812px)
            and (-webkit-device-pixel-ratio : 3)
            and (orientation: portrait) { 
                top: -8rem;
                left: -1rem;
        }
    }
}

}
*/