yourList.css

@import url(http://fonts.googleapis.com/css?family=Source+Sans+Pro);

*{
    margin: 0;
    padding: 0;
}


body {
   background: url(images/gift_background1.png) 
         no-repeat center center fixed;
         -webkit-background-size: cover;
         -moz-background-size: cover;
         -o-background-size: cover;
         background-size: cover;   
	padding-top: 160px;
	font: normal 18px 'Source Sans Pro';
    color: white; 
    text-align: center;
}



h1 {
    margin: 0 auto;
    text-align: center;
}

thead {
    text-align: left;
}

tbody {
    color: #000;
}


table {
    margin: 20px auto;
    width: 90%;
    table-layout: fixed;
    
}

button {
    width: 85px;
    display: block;
    padding: 5px 15px;
    margin: 10px 10px;
    color: #ccc;
    background-color: #555;
    background: -webkit-linear-gradient(#888, #555);
    border: 0 none;
    border-radius: 3px;
    text-shadow: 0 -1px 0 #000;
    box-shadow: 0 1px 0 #666, 0 5px 0 #444, 0 6px 6px rgba(0,0,0,0.6);
    cursor: pointer;
    -webkit-transition: all 150ms ease;
    transition: all 150ms ease;
}

button:hover{
    background-color: #666;
    background: -webkit-linear-gradient(#999, #666);
}

button:active
{
    box-shadow: 0 1px 0 #666, 0 2px 0 #444, 0 2px 2px rgba(0,0,0,0.9);
    -webkit-transform: translateY(3px);
    transform: translateY(3px);
    -webkit-animation: none;
    animation: none;
}

button:focus {
    outline: 0;
}

.colour {
    background-color: hsla(190, 70%, 90%, 0.7);
}

.addButton {
    margin: 10px auto;
}

.content {
    overflow-x: auto;
}
<!----------------------Media------------------>
 @media screen and (max-width: 800px){
    .wrapper {
        padding: 220px 0 0 0;
    }
}
     
@media screen and (max-width: 565px){
    body{
        padding-top: 220px;
    }
}

@media screen and (max-width: 430px){
    body{
        font-size: 12px;
    }
}