body {padding:30px 0; background:url("../design/bg.png") 50% 0 no-repeat; font:0.7em/1.5 "tahoma", sans-serif;}
address, blockquote, dl, fieldset, form, h1, h2, h3, h4, h5, h6, ol, p, table, ul {margin:15px 0;}
h2 {font-size:300%; line-height:1; font-weight:normal; text-transform:uppercase;}
h3 {font-size:300%; line-height:1; font-weight:normal;}
h4 {font-size:200%; line-height:1; font-weight:normal;}

#main {
    width:980px;
    margin:0 auto;
    @media screen and (max-width: 600px) {
        width: 90%;
    }
}
#content {padding-bottom:40px;}
#logo {margin:0 0 15px 0; line-height:1; font-size:300%; font-family: "Helvetica Neue", "tahoma", sans-serif;}
#footer {clear:both; padding:0px 0;  line-height:2; text-align:center; margin: auto;}
#footer span {font-weight:normal;}
#footer p {margin:0;}

#device {
    position:relative; 
    width:460px; 
    height:801px; 
    top:50px; 
    background:url("../design/tidealert-device.webp") 17px 0 no-repeat; 
    background-size:430px;

    @media screen and (max-width: 600px) {
        top: 20px; 
        background:url("../design/tidealert-device.webp") 0px 0 no-repeat; 
        background-size:90%;
        width:100%; 
        height:540px;
        margin: auto; 
    }
}

li {
    font-size: small;
    padding-top: 8px;
}
.row:after {
     content: "";
      display: table;
      clear: both;
}

.left {
    float: left;
    width: 36%;

    @media screen and (max-width: 600px) {
        width: 100%;
    }
}
.middle {
    float: left;
    width: 50%;

    @media screen and (max-width: 600px) {
        width: 100%;
    }
}

.right {
    float: left;
    width: 14%;
    padding-top:40px;

    @media screen and (max-width: 600px) {
        margin-top: 40px;
        width: 100%;
    }
}

.row {
    display: -ms-flexbox; /* IE10 */
    display: flex;
    -ms-flex-wrap: wrap; /* IE10 */
    flex-wrap: wrap;
    padding: 0 4px;
  }

.column {
    -ms-flex: 100%; /* IE10 */
    flex: 100%;
    max-width: 100%;
    padding: 0 4px;

    @media screen and (max-width: 600px) {
        -ms-flex: 45%; /* IE10 */
        flex: 45%;
        max-width: 45%;
        padding-right: 4px;
    }
}
  
.column img {
    margin-top: 15px;
    margin-right: 10px;
    vertical-align: middle;
    @media screen and (max-width: 600px) {
        -ms-flex: 80%; /* IE10 */
        flex: 80%;
        max-width: 80%;
    }
}

.appstorebtn {
    width: 200px;
    margin: 0 auto;
    padding-top:20px;
}

.video {
    width:720px;
    height:405px;
    @media screen and (max-width: 600px) {
        -ms-flex: 100%; /* IE10 */
        flex: 100%;
        width: 100%;
    }
}

#review { width: 280px; margin: 15px; }
#reviewTitle { font-size: medium; margin-bottom: 6px;}
#reviewDesc { font-size: small;}
#reviewContainer {  display: flex; flex-wrap: wrap; justify-items: center; justify-content: center; padding-bottom: 40px;}
.appguide { font-size: medium; text-transform: none;}
.testimonial { display: flex; justify-self: center; justify-content: center; flex-wrap: wrap;}