:root {
--bs-link-color: white;

--bs-link-hover-color: black;
}


.logo{
    padding-top: 4px;
}

#title h4{
    margin-top: .5rem;
}

.miniature {
  max-width: 150px;
  max-height: 150px;
}
.nav-up {
    margin-bottom: 10px;
    margin-top: 10px;
    background-color: blue;
}

.icon {
 
    padding-bottom: 4px;
}

.nav-down {
    padding-top: 20px;
}

.img-right {
    padding-top: 10px;
    padding-bottom: 10px;  
}

.desc-short{
    padding-right: 8px;
}

.icon-mobile {
    padding-top: 10px;
    margin-top: 5px;
}

#img-right img{
    max-width: 100%;
    height: auto;
}

#description-short p{
    font-size: 18px;
    font-weight: 600;
}

#description p{
    font-size: 18px;
    font-weight: 450;
}

 #menu {
    display: none;
}


  #icon-mobile {
    display: block;
}

#icon-desktop {
    display: none;
}
  
#remove-col{
    display: none;
}

@media screen and (min-width: 768px) {
    #menu {
        display: block;
    }
}

@media screen and (min-width: 700px) {
    .logo{
        padding-top: 8px;
        padding-bottom: 8px;
    }
   
    .miniature {
      max-width: 150px;
      max-height: 150px;
    }

    /*.nav-up {
        padding-top: 0px;
        padding-bottom: 20px;
    }*/

    .icon {
        padding-top: 8px;
        padding-bottom: 8px;
    }


    .nav-down {
        padding-top: 20px;
        padding-bottom: 8px;
    }

    .img-right {
        padding-top: 10px;
        padding-bottom: 10px;  
    }

    .desc-short{
        padding-right: 8px;
    }

    #img-right img{
        max-width: 100%;
        height: auto;
    }
    
    #description-short p{
        font-size: 18px;
        font-weight: 600;
    }

    #description p{
        font-size: 18px;
        font-weight: 450;
    }
 
    
      #icon-mobile {
        display: none;
    }

      #icon-desktop {
        display: block;
    }

}

@media screen and (min-width: 1200px) {
        .miniature {
          max-width: 250px;
          max-height: 250px;
        }

       
}
    
@media screen and (min-width: 576px) {
      #remove-col{
        display: block;
      }
}

@media screen and (max-width: 576px) {
        .img-right {
            padding-left: 25px;
            padding-right: 25px;
        }

        #img-right img{
            max-width: 100%;
            height: auto;
        }
        
        #description-short p{
            font-size: 18px;
            font-weight: 600;
        }

        #description p{
            font-size: 18px;
            font-weight: 450;
        }
}

   