@media only screen and (min-width:300px) and (max-width:600px)
{
    .logo1{width:48px;}  

    .bg {
           height: 166px!important;
        }
  
    .navbar-toggler {
                       margin-right: 25%;
                    }
    .h1 {
            font-size: 25px!important;
            padding-top: 25%!important;
        }    

     .if {
            font-size: 18px!important;
        }

     .form-control {
                      width: 90% !important;
                   }

       .element {
                    width: 91%!important;
                    height: 127px!important;
                }

      .btn6 {
                margin-left: 15%!important;
                width: 57%!important;
            }

      .addcolor {
                  font-size: 45px!important;
                  margin-top: 95%!important;
                  margin-left: -128%!important;
                }   
                
      .addcolor1 {
                    margin-left: -129%!important;
                 }
        .addcolor2 {
                      margin-left: -129%!important;
                   }

        .text6 {
                  margin-top: 8%!important;
               }

        .background {
                      height: 224px!important;
                    }

        .text12 {
                   font-size: 16px!important;
                }

        .text13 {
                    font-size: 6px!important;
                }
        .logo {
                 width: 31%!important;
              }

        .text17 {
                   font-size: 40px!important;
                }

        .text20 {
                    font-size: 14px!important;
                }

         .text19 {
                    padding-left: 19%!important;
                 }
}