body {
        margin: 0;
        padding: 0;
      }
	  
	  .topbar {
background-image: url(images/topbar.jpg);
	font-size: 18px;
	font-family : Tahoma;
	color : #002a61;
	text-align: center;
	vertical-align:center;
	height: 50px;

}

A:link {
	color: #002a61;
	text-decoration: none;
}

A:visited {
	color: #002a61;
	text-decoration: none;
}

A:active {
	color: #002a61;
	text-decoration: none;
}

A:hover {
	color: #9b844e;
	text-decoration: none;
}
	  
.waitoki {
      height: 125px;
      background-image: url(images/waitoki-logo.png);
      background-repeat: no-repeat;
      background-size: contain;
      background-position-x: center;
    }

    @media (min-width: 500px) {
     
      .waitoki {
        background-image: url(images/engineering.jpg);
		align-items:left;
		height: 250px;
		
      }
    }
	
	.underfloor {
      height: 250px;
      background-image: url(images/waitoki-logo.png);
      background-repeat: no-repeat;
      background-size: contain;
      background-position-x: center;
    }

    @media (min-width: 500px) {
     
      .underfloor {
        background-image: url(images/hydronic1.jpg);
      }
    }

	.radiator {
      height: 250px;
      background-image: url(images/waitoki-logo.png);
      background-repeat: no-repeat;
      background-size: contain;
      background-position-x: center;
    }

    @media (min-width: 500px) {
     
      .radiator {
        background-image: url(images/radiator1.jpg);
      }
    }
	
		.testimonial {
      height: 250px;
      background-image: url(images/waitoki-logo.png);
      background-repeat: no-repeat;
      background-size: contain;
      background-position-x: center;
    }

    @media (min-width: 500px) {
     
      .testimonial {
        background-image: url(images/testimonial1.jpg);
      }
    }
	
			.contact {
      height: 250px;
      background-image: url(images/waitoki-logo.png);
      background-repeat: no-repeat;
      background-size: contain;
      background-position-x: center;
    }

    @media (min-width: 500px) {
     
      .contact {
        background-image: url(images/Contact1.jpg);
      }
    }

      #headline {
        padding: 0.8em;
        color: white;
        font-family: Roboto, helvetica, arial, sans-serif;
       
        background-image: url();
        background-size: cover;
      }

      #headline h1 {
        font-weight: 200;
        font-size: 60px;
        line-height: 1em;
        margin-bottom: 0;
      }
        
       #headline h2 {
        font-size: 34px;
	font-family : Verdana;
	color: #002a61;
	font-style:italic;
      }
      #headline #blurb {
        font-weight: 200;
        font-size: 18px;
      }

      #headline #register {
        background-color: #39b1a4;
        background-color: rgba(57,177, 164, 0.7);
        padding: 1em;
      }

      #headline #register h2 {
        font-weight: 100;
        padding: 0;
        margin: 0;
      }

      #headline #register label {
        font-size: 1.2em;
        font-weight: 200;
        padding-top: 12px;
        display: block;
      }

      #headline #register input {
        width: 100%;
        font-size: 18px;
        font-weight: 200;
        padding: 10px;
        box-sizing: border-box;
      }

      #headline #register input[type=submit] {
        background-color: hsl(8, 70%, 54%);
        color: white;
        margin-top: 20px;
        padding: 10px;
        border: none;
        box-sizing: border-box;
        font-size: 18px;
      }

      #section1, #section2, #section3 {
        box-sizing: border-box;
        padding: 20px;
      }

      #section1 h2, #section2 h2, #section3 h2  {
        margin-top: 0;
        font-size: 24px
      }

      #section1 {
        
        font-family: Roboto, sans-serif;
        font-weight: 100;
        font-size: 18px;
      }

      #section1 h2 {
        font-weight: 300;
        text-align: center;
        margin-bottom: 0px;
        margin-top: 20px;
      }

      #section1 h2 + p {
      }

      #section1 video {
        width: 100%;
      }

      #section2 {
       
        font-family: Roboto, sans-serif;
        font-weight: 100;
        font-size: 18px;
		 text-align: left;
      }

      #section2 h2 {
        font-weight: 300;
        text-align: center;
        margin-bottom: 0px;
        margin-top: 20px;
      }

      #section2 h2 + p {
      }

      #section2 div {
      }

      #section2 div img {
         width: 45%;
            margin: 1%;
            box-sizing: border-box;
            border-radius: 50% 50%;
            box-shadow: black 0px 0px 5px;
      }

      #section3 {
        
        font-family: Roboto, sans-serif;
        font-weight: 100;
        text-align: center;
        margin: auto;
      }

      #section3 h2 {
        font-weight: 300;
        text-align: center;
        margin-bottom: 0px;
        margin-top: 20px;
      }

      #section3 h2 + p {
        text-align: center;
      }

      footer {
        font-family: Roboto, sans-serif;
        font-weight: 300;
        text-align: center;
       
        color: black;
        padding-bottom: 20px;
        padding-top: 20px;
      }

      thead {
        font-weight: bold;
      }

      tbody {
        text-align: center;
      }

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

          
.container {
            margin: auto;
            max-width: 1000px;
          }
          

#headline {
            padding: 0px 0%;
          }
          

#headline #blurb {
            float: left; 
            font-weight: 200;
            width: 50%;
            font-size: 18px;
            box-sizing: border-box;
            padding-right: 10px;
          }

          #headline #register {
            float:right;
            padding: 20px;
            width: 50%;
            box-sizing: border-box;
            font-weight: 300;
          }

          #headline br {
            clear: both;
          }
          
#section1 #section2, #section3 {
            box-sizing: border-box;
            padding: 10px 20% 80px 20%;
          }
          
          #section1 h2, #section2 h2, #section3 h2  {
            margin-top: 0;
            font-size: 60px
          }
          
          
#section1 ul {
            box-sizing: border-box;
            float: left;
            width: 50%;
            padding-right: 1em;
          }
          
          #section1 video {
            width: 50%;
            float: right;
          }
          
#section1 #bullet {
            float: left; 
            font-weight: 200;
            width: 45%;
            font-size: 18px;
            box-sizing: border-box;
			color: #978348;
			text-align:left

          }
		  
#section1 #blurb {
            float: right; 
            font-weight: 200;
            width: 45%;
            font-size: 18px;
            box-sizing: border-box;
            padding-right: 10px;
			text-align:left
          }
		  
#section1 video {
            box-sizing: border-box;
            width: 50%;
            float: right;
          }

          #section1 br {
            clear: both;
          }
          
          
#section2 div img {
            width: 45%;
            margin: 1%;
            box-sizing: border-box;
            border-radius: 50% 50%;
            box-shadow: black 0px 0px 5px;
          }
          
}