/*==============================================
GENERAL SETTINGS
==============================================*/
@media (max-width: 600px){

  #content{
    margin-top: 50px;
  }

}

/*==============================================
TYPOGRAPHY
==============================================*/
@media (max-width: 650px){

  body{
    font-size: .95em;
  }
  /* titles */
  .bg-title{
    font-size: 2em;
    line-height: 1em;
  }

}

/*==============================================
SLIDERS
==============================================*/
@media (max-width: 700px){

  .slick-slider img.arrow{
    height: 18px;
  }

}

/*==============================================
HEADER
==============================================*/
@media (max-width: 600px){

  #site-header{
    height: 50px;
  }
  #site-header .header-content{
    width: 93%;
  }
  #ham{
    height: 50px;
    width: 50px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-left: -12px;
  }
  #ham div{
    width: 25px;
    height: 20px;
  }
  #ham div span{
    height: 2px;
  }
  #logo img{
    height: 30px;
  }
  #cart-icon img{
    height: 20px;
  }
  #cart-icon span{
    top: -8px;
    right: 9px;
  }

}

/*==============================================
MENU
==============================================*/
@media (max-width: 600px){

  #site-menu{
    top: 50px;
    height: -webkit-calc(100% - 50px);
    height: -moz-calc(100% - 50px);
    height: calc(100% - 50px);
    -webkit-transition: -webkit-transform .4s ease-out;
    transition: -webkit-transform .4s ease-out;
    -o-transition: -o-transform .4s ease-out;
    -moz-transition: transform .4s ease-out, -moz-transform .4s ease-out;
    transition: transform .4s ease-out;
    transition: transform .4s ease-out, -webkit-transform .4s ease-out, -moz-transform .4s ease-out, -o-transform .4s ease-out;
  }

}

@media (max-width: 1000px){

  #site-menu div .prev{
    display: none;
  }
  #site-menu div .list{
    width: 100%;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
  }

}

/*==============================================
MINI CART
==============================================*/
@media (max-width: 600px){

  #orbis783_mini_cart{
    top: 50px;
    height: -webkit-calc(100% - 50px);
    height: -moz-calc(100% - 50px);
    height: calc(100% - 50px);
  }

}

@media (max-width: 750px){

  ul.woocommerce-mini-cart, #mini-cart-actions div{
    padding: 0 5%;
  }

}

@media (max-width: 570px){

  ul.woocommerce-mini-cart, #mini-cart-actions div{
    padding: 0 3%;
  }
  ul.woocommerce-mini-cart li,
  #mini-cart-actions{
    font-size: .9em;
  }
  ul.woocommerce-mini-cart li{
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
  }

}


/*==============================================
FOOTER
==============================================*/
/* newsletter */
@media (max-width: 650px){

  #newsletter-form p.name, #newsletter-form p.surname,
  #newsletter-form p.privacy{
    width: 100%;
  }
  #newsletter-form p.submit{
    width: 100%;
  }
  #newsletter-form p.submit button{
    width: auto;
    padding: 8px 55px;
  }

}
/* end of newsletter */

@media (max-width: 1000px){

  .site-footer .footer-content .content{
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }
  .site-footer .footer-content .content .form,
  .site-footer .footer-content .content .info{
    width: 100%;
  }
  .site-footer .footer-content .content .form{
    margin: auto;
    width: 100%;
    max-width: 500px;
  }
  .site-footer .footer-content .content .info{
    text-align: center;
  }
  #contact-form p.submit{
    text-align: center;
  }
  #menu-footer-menu{
    padding: 0;
    margin: 3em 0;
  }
  .site-footer .footer-content .content .info .social-icons{
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
  }

  /* copyright */
  @media (max-width: 750px){

    .site-footer .copyright .content{
      -webkit-box-orient: vertical;
      -webkit-box-direction: reverse;
      -webkit-flex-direction: column-reverse;
      -moz-box-orient: vertical;
      -moz-box-direction: reverse;
      -ms-flex-direction: column-reverse;
      flex-direction: column-reverse;
    }
    .site-footer .copyright .content .payments{
      margin-bottom: 2em;
    }

  }
  @media (max-width: 260px){

    .site-footer .copyright .content .payments{
      -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
    }
    .site-footer .copyright .content .payments img{
      min-width: 36px;
      margin-bottom: .7em;
    }

  }
  /* end of copyright */

}

/*==============================================
HOMEPAGE
==============================================*/
/* home header */
@media (max-width: 600px){

  .home-header{
    height: -webkit-calc(100vh - 50px);
    height: -moz-calc(100vh - 50px);
    height: calc(100vh - 50px);
  }

}

/* end of home header */

/* slogan */
@media screen and (orientation: portrait) and (max-width: 600px){

  .home-header div{
    height: 100%;
    width: 100%;
    bottom: 0;
  }
  .home-header div > div{
    position: absolute;
    top: 10%;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
    width: 100%;
  }
  .home-header div > div img{
    display: block;
  }
  .home-header div a{
    position: absolute;
    bottom: 13%;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
    width: 250px;
    max-width: 95%;
  }

}
/* end of slogan */

/* initial slider */
@media (max-width: 900px){

  .home-intro .content .home-slider{
    padding: 4em 0;
  }
  .home-intro .content .home-slider .slider{
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }
  .home-intro .content .home-slider .slider img.pic{
    width: 80%;
    margin: auto;
  }
  .home-intro .content .home-slider .slider div.description{
    width: 100%;
    text-align: center;
    margin-top: 1em;
  }

}
/* end of initial slider */

/* properties */
@media (max-width: 900px){

  .home-intro .content .features{
    border-top: none;
    padding-top: 0;
  }
  .home-intro .content .features .pre-section p{
    width: 100%;
  }

}
@media (max-width: 1000px){

  .home-intro .content .features .icons .item{
    width: 45%;
    margin-bottom: 3em
  }
  .home-intro .content .features .icons .item:nth-child(1),
  .home-intro .content .features .icons .item:nth-child(3),
  .home-intro .content .features .icons .item:nth-child(5){
    -webkit-transition: opacity .3s linear, -webkit-transform .3s linear;
    transition: opacity .3s linear, -webkit-transform .3s linear;
    -o-transition: opacity .3s linear, -o-transform .3s linear;
    -moz-transition: transform .3s linear, opacity .3s linear, -moz-transform .3s linear;
    transition: transform .3s linear, opacity .3s linear;
    transition: transform .3s linear, opacity .3s linear, -webkit-transform .3s linear, -moz-transform .3s linear, -o-transform .3s linear;
  }
  .home-intro .content .features .icons .item:nth-child(2),
  .home-intro .content .features .icons .item:nth-child(4),
  .home-intro .content .features .icons .item:nth-child(6){
    -webkit-transition: opacity .3s linear .3s, -webkit-transform .3s linear .3s;
    transition: opacity .3s linear .3s, -webkit-transform .3s linear .3s;
    -o-transition: opacity .3s linear .3s, -o-transform .3s linear .3s;
    -moz-transition: transform .3s linear .3s, opacity .3s linear .3s, -moz-transform .3s linear .3s;
    transition: transform .3s linear .3s, opacity .3s linear .3s;
    transition: transform .3s linear .3s, opacity .3s linear .3s, -webkit-transform .3s linear .3s, -moz-transform .3s linear .3s, -o-transform .3s linear .3s;
  }


}
@media (max-width: 500px){

  .home-intro .content .features .icons .item{
    width: 100%;
    margin-bottom: 4em
  }
  .home-intro .content .features .icons .item:nth-child(1),
  .home-intro .content .features .icons .item:nth-child(2),
  .home-intro .content .features .icons .item:nth-child(3),
  .home-intro .content .features .icons .item:nth-child(4),
  .home-intro .content .features .icons .item:nth-child(5),
  .home-intro .content .features .icons .item:nth-child(6){
    -webkit-transition: opacity .3s linear, -webkit-transform .3s linear;
    transition: opacity .3s linear, -webkit-transform .3s linear;
    -o-transition: opacity .3s linear, -o-transform .3s linear;
    -moz-transition: transform .3s linear, opacity .3s linear, -moz-transform .3s linear;
    transition: transform .3s linear, opacity .3s linear;
    transition: transform .3s linear, opacity .3s linear, -webkit-transform .3s linear, -moz-transform .3s linear, -o-transform .3s linear;
  }

}

/* end of properties */

/* handcraft */
@media screen and (orientation: portrait){

  .home-handcraft-section{
    padding: 0 0 100% 0;
    height: 0px;
    min-height: 0px;
    position: relative;
  }
  .home-handcraft-section div{
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 95%;
  }

}
/* end of handcraft */

/* sections */
@media (max-width: 700px){

  .home-sections .content .entry-content p{
    width: 100%;
    max-width: 600px;
  }

}
@media screen and (orientation: portrait){

  .home-sections .content .home-banner{
    padding-bottom: 95vh;
    background-color: black;
  }
  .home-sections .content .home-banner .preview{
    opacity: 1;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    background-color: transparent;
  }
  .home-sections .content .home-banner .preview div{
    margin-top: 0;
    width: 85%;
  }

}
/* end of sections */

/* blog slider */
@media (max-width: 850px){

  .blog-preview .content .pre-content p{
    width: 100%;
  }

}

@media (max-width: 750px){

  .blog-preview .posts .post .post-preview{
    width: 100%;
    padding: 5em 0;
  }
  .blog-preview .content .posts .arrow{
    display: none !important;
  }

}
/* end of blog slider */

/*==============================================
HANDCRAFT
==============================================*/
/* header */
@media screen and (orientation: portrait) and (min-width: 601px){

  .handcraft-banner{
    padding-bottom: 0;
    height: -webkit-calc(100vh - 60px);
    height: -moz-calc(100vh - 60px);
    height: calc(100vh - 60px);
    background-color: black;
  }

}
@media screen and (orientation: portrait) and (max-width: 600px){

  .handcraft-banner{
    padding-bottom: 0;
    height: -webkit-calc(100vh - 50px);
    height: -moz-calc(100vh - 50px);
    height: calc(100vh - 50px);
    background-color: black;
  }

}
/* end of header */

/* banners */
@media screen and (max-width: 1000px){

  .handcraft .handcraft-content .banner.materials,
  .handcraft .handcraft-content .banner.electronic{
    padding-bottom: 0;
    height: auto;
  }
  .handcraft .handcraft-content .banner.materials .content,
  .handcraft .handcraft-content .banner.electronic .content{
    position: relative;
    width: 85%;
    margin: auto;
    padding: 2em 0;
    top: 0;
    left: 0;
    -webkit-transform: translate(0, 0);
    -moz-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    -o-transform: translate(0, 0);
    transform: translate(0, 0);
  }

}
@media screen and (max-width: 650px){

  .handcraft .handcraft-content .banner.materials .content,
  .handcraft .handcraft-content .banner.electronic .content{
    width: 95%;
  }

}
/* end of banners */

/* slider */
@media (max-width: 400px){

  .handcraft .slick-initialized .slick-slide{
    padding: 1.5em;
  }

}
/* end of slider */

/*==============================================
BLOG
==============================================*/
/* header */
@media screen and (orientation: portrait){

  .blog-header{
    padding-bottom: 150%;
  }

}

/* end of header */

/* posts */
@media screen and (max-width: 1050px){

  body.page-template-blog .posts .post{
    padding-bottom: 50%;
  }

}

@media screen and (max-width: 600px){

  body.page-template-blog .posts .post{
    padding-bottom: 150%;
  }
  body.page-template-blog .posts .post .preview{
    width: 85%;
  }

}
/* end of posts */

/*==============================================
SINGLE POST
==============================================*/
/* header */
@media screen and (orientation: portrait){

  .post-header{
    padding-bottom: 150%;
  }

}
@media (max-width: 1000px){

  .post-header div.header-content h1{
    text-align: center;
  }

}
/* end of header */

/*==============================================
SHOP
==============================================*/
/* header */
@media screen and (orientation: portrait) and (min-width: 601px){
  .shop-header{
    padding-bottom: 0;
    height: -webkit-calc(100vh - 60px);
    height: -moz-calc(100vh - 60px);
    height: calc(100vh - 60px);
  }
}
@media screen and (orientation: portrait) and (max-width: 600px){
  .shop-header{
    padding-bottom: 0;
    height: -webkit-calc(100vh - 50px);
    height: -moz-calc(100vh - 50px);
    height: calc(100vh - 50px);
  }
}
/* end of header */

@media (max-width: 800px){
  .shop-slogan{
    text-align: center;
  }
}

/* products */
@media (max-width: 1000px){
  ul.products li{
    width: 45%;
  }
}
@media (max-width: 700px){
  ul.products li{
    width: 48%;
  }
}
@media (max-width: 580px){
  ul.products li{
    width: 100%;
  }
}
/* end of products */


/*==============================================
SINGLE PRODUCT PAGE
==============================================*/
/* images and summary */
@media (max-width: 1050px){

  body.single-product div.product .product-wrapper{
    height: auto;
  }
  body.single-product div.product .product-wrapper .woocommerce-product-gallery,
  body.single-product div.product .product-wrapper .summary{
    width: 100%;
  }
  body.single-product div.product .product-wrapper .summary{
    margin-bottom: 3em;
  }
  /* body.single-product div.product .product-wrapper .woocommerce-product-gallery{
    height: -webkit-calc(100vh - 60px);
    height: -moz-calc(100vh - 60px);
    height: calc(100vh - 60px);
  } */
  #product-render-reel{
    width: 100%;
    max-width: 550px;
    height: auto;
  }

}
/* @media (max-width: 600px){

  body.single-product div.product .product-wrapper .woocommerce-product-gallery{
    height: -webkit-calc(100vh - 50px);
    height: -moz-calc(100vh - 50px);
    height: calc(100vh - 50px);
  }

} */
@media (max-width: 500px){

  body.single-product form.cart .actions{
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
  }
  body.single-product form.cart .actions input[name="quantity"]{
    margin: 0 0 1em 0;
  }
  body.single-product form.cart .actions input[name="quantity"],
  #add_to_cart_button{
    width: 300px;
    max-width: 100%;
  }
  .woocommerce-product-gallery div.guide span{
    font-size: .9em;
  }
  .woocommerce-product-gallery div.guide img{
    width: 35px;
    margin-bottom: .5em;
  }

}

/* end of images and summary */

/* description */

@media (max-width: 1100px){

  body.single-product .product-description .content .titles{
    width: 100%;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-bottom: 2em;
  }
  body.single-product .product-description .content .titles span{
    width: auto;
  }
  body.single-product .product-description .content .contents{
    width: 100%;
  }
  body.single-product .product-description .content .contents span{
    border-left: none;
    padding-left: 0;
    margin: 0;
  }

}

@media (max-width: 850px){

  body.single-product .product-description .content .titles span{
    width: 100%;
  }

}

/* end of description */


/* properties */

@media (max-width: 1000px){

  body.single-product .product-icons .content .item{
    width: 45%;
  }

}

@media (max-width: 500px){

  body.single-product .product-icons .content .item{
    width: 100%;
    margin-bottom: 3em;
  }

}

/* end of properties */

/* related products */

@media (max-width: 950px){

  body.single-product .related ul.products li{
    padding: 3em;
  }

}
@media (max-width: 800px){

  body.single-product .related ul.products li{
    padding: 2em;
  }

}

@media (max-width: 700px){

  body.single-product .related ul.products li{
    padding: 1em;
  }

}

@media (max-width: 600px){

  body.single-product .related ul.products li{
    padding: .5em;
  }

}

/* end of related products */


/*==============================================
CART PAGE
==============================================*/
/* cart slider */

@media (max-width: 650px){

  ul.cart-content li .image{
    width: 35%;
  }
  ul.cart-content li .info{
    width: 65%;
  }

}
@media screen and (max-width: 500px){

  ul.cart-content li .image{
    width: 100%;
  }
  ul.cart-content li .info{
    width: 100%;
    padding-left: 0;
    margin-top: 1.5em;
  }

}

/* end of cart slider */

/* coupon form */

@media (max-width: 500px){

  .cart-page-coupon input, .cart-page-coupon button{
    width: 100%;
  }
  .cart-page-coupon input{
    margin-bottom: 1em;
  }

}

/* end of coupon form */

/* cart review */

@media (max-width: 700px){

  .cart-review{
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }
  .cart-review .total-label, .cart-review .cart-total{
    width: 50%;
  }
  .cart-review .cart-total{
    text-align: right;
  }
  .go-to-checkout{
    width: 100%;
    margin-top: 2em;
  }
  .cart-review a.go-to-checkout{
    text-align: center;
    display: block;
  }

}

/* end of cart review */

/*==============================================
CHECKOUT
==============================================*/
/* coupon form */

@media (max-width: 550px){

  #checkout-coupon-form{
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
  }
  #checkout-coupon-form input{
    width: 100%;
    max-width: 300px;
    margin: 0 0 1em 0;
  }
  #checkout-coupon-form button{
    width: 100%;
    max-width: 300px;
  }

}

/* end of coupon form */

/* checkout fields */

@media (max-width: 1000px){

  form.woocommerce-checkout{
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }
  #customer_details,
  #order_review,
  #checkout-coupon-form,
  .checkout-coupon-section > h3{
    width: 100%;
    margin: auto;
    max-width: 750px;
    padding-right: 0;
  }
  .checkout-coupon-section > h3{
    margin-bottom: 1em;
  }

}

@media screen and (max-width: 600px){

  .woocommerce-billing-fields__field-wrapper p.half,
  .woocommerce-shipping-fields__field-wrapper p.half{
    width: 100%;
  }

}

/* end of checkout fields */

/*==============================================
THANKYOU PAGE
==============================================*/

/*==============================================
WOOCOMMERCE MESSAGES
==============================================*/
@media (max-width: 600px){

  .woocommerce-notices-wrapper,
  .woocommerce-NoticeGroup-checkout{
    top: 50px;
  }

}

/*==============================================
PROGRAMMED POPUP
==============================================*/
@media screen and (max-width: 570px){

  #programmed-popup{
    padding: 1em;
  }
  #programmed-popup p.half{
    width: 100%;
  }

}
