div.gallery {
  margin: 5px;
  border: 1px solid #ccc;
  float: left;
  width: 180px;
}

div.gallery:hover {
  border: 1px solid #777;
}

div.gallery img {
  width: 100%;
  height: auto;
}

div.desc {
  padding: 10px;
  text-align: center;
  font-size:.8em;
}
     body {
         margin:0;
         font-family: Arial, Helvetica, sans-serif; 
         }
      .toprow{
         background-image: url('https://buckcreekcoffee.com/waitr/02830MMQ.jpeg');
         background-repeat: no-repeat;
         background-attachment: fixed;  
         background-size: cover;
         background-position: 0px 99px;
      }
      .logo{
         margin-right:10px;
         width:365px;
         clear:all;
      }
      .row{
         margin:5px;
         color:white;
         background-color:rgba(0, 0, 0, 0.3);
         border-radius: 12px;
      }
      p.extrabold{
         font-weight: bold;
      }
      .weatherwidget-io{
         background-color:rgba(0, 0, 0, 0.4);
         width:200px;
         margin:5px;
         border-radius: 12px;
         float:right;
      }
      .btn {
         -webkit-border-radius: 4px;
         -moz-border-radius: 4px;
         border-radius: 4px;
         border: solid 1px #20538D;
         text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.4);
         -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2);
         -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2);
         box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2);
         background: #883300;
         color: #FFF;
         padding: 8px 12px;
         text-decoration: none;
        }
        .btn:hover {
            color: #cccccc;
        }
        .blue {
            background: #347fd0;
        }
        .news {
            width: 890px;
            overflow: hidden;
            border-radius: 4px;
            padding: 1px;
            -webkit-user-select: none;
        }
        .news span {
            float: left;
            color: #fff;
            padding: 9px;
            position: relative;
            top: 0;
            box-shadow: inset 0 -15px 30px rgba(0,0,0,0.4);
            font: 16px 'Raleway', Helvetica, Arial, sans-serif;
            -webkit-font-smoothing: antialiased;
            -webkit-user-select: none;
            cursor: pointer;
        }
        .text1{
            box-shadow:none !important;
            width: 750px;
        }
        .topnav {
          width:100%;
          float:left;
          overflow: hidden;
          background-color: #333;
        }
        /* Clear floats before the menu */
        .topnav:before {
          content: "";
          display: table;
          clear: both;
        }
        .topnav a {
          float: left;
          display: block;
          color: #f2f2f2;
          text-align: center;
          padding: 14px 16px 0px 16px;
          padding-top:0;
          text-decoration: none;
          font-size: 17px;
        }
        .topnav a:hover {
          background-color: #ddd;
          color: black;
        }

        .topnav a.active {
          background-color:red;
          color: white;
        }
        .topnav .icon {
          display: none;
        }
        * {
          box-sizing: border-box;
        }
        .header{
          text-align: center;
          width:100%;
          color:white;
          background-color:black;
          font-size:.8em;
          position: fixed;
          z-index: 100;
          top: 0;
          width: 100%;
          height:100px;
        }
        .toplogo {
          float: left;
          text-align:left
        }
        .social {
          float: right;
        }
         @media only screen and (max-width: 768px) {
              /* For tablets some cell phones: */
              .weatherwidget-io{
                 width:100%;
                background-color:rgba(0, 0, 0, 0);
              }  
              .hours{
                 visibility:hidden;
                 width:0px;
                 height:0px;
              }
          }
          @media only screen and (max-width: 500px) {
              .social {
                 width: 0%;    
                 height:0px;
              }
          }
          @media only screen and (max-width: 400px) {
              /* For some cell phones: */
              .weatherwidget-io{
                 position: absolute;
                 top: 10px;
                 right: 0;

             }
              .toplogo {
                 width: 100%;  
                 text-align:center;
              }
              .contact{
                 visibility:hidden;
                 width:0px;
                 height:0px;
              }
              .topnav a:not(:first-child) {display: none;}
              .topnav a.icon {
                 float: right;
                 display: block;
              }
              .topnav.responsive {position: relative;}
              .topnav.responsive .icon {
                 position: absolute;
                 right: 0;
                 top: 0;
              }
              .topnav.responsive a {
                 float: none;
                 display: block;
                 text-align: left;
              }

          }