/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) 
{
    #signature
    {
        display: block;
    }

    #logo-container
    {
        display: none;
    }
} 

/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) 
{
    #signature
    {
        display: none;
    }
} 

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) 
{
   
} 

/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) 
{
    header img 
    {
        object-position: 0 55%;
    }

    .gallery
    {
        grid-template-columns: repeat(3,1fr);
    }
    
    .gallery-container
    {
        width: 500px;
    }

    #before-img, #after-img
    {
        position: absolute;
    }

    #before-img img
    {
        width: 250px;
        height: 300px;
        position: relative;
        top: 150px;
        border: 6px solid var(--trinary-color);
        z-index: 2;
    }

    #before-img h3 
    {
        position: relative;
        top: 150px;
        right: 25%;
        color: var(--primary-color);
    }

    #after-img img
    {
        width: 500px;
        height: 550px;
        position: relative;
        top:50%;
        left: 25%;
        z-index: 1;
    }

    .section-content .row 
    {
        margin-top: 30px;
    }

    #section-3 h2
    {
        margin-bottom: 30px;
    }

    #section-3 .about 
    {
        text-align: right;
        margin: 120px 0px;
        font-size: 1.2rem;
    }

    .col-content img 
    {
        width: 100px;
    }
} 

/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1270px) 
{
  /*Section 3*/
  #section-3 .col-content
  {
      display: block;
  }

  #section-3 #before-after-img
  {
      display: none;
  }
}