body {
    margin: 0;
    font-family: "Lucida Grande","Tahoma","Sans-Serif";
    background: #eee;
    min-width: 325px;
    text-align: center;
    margin: auto;
    padding: 10px;
}

h1 {
    font-size: 1.6em;
    color: midnightblue;
}


h2 {
    font-size: 1.0em;
}

h3 {
    font-size: 0.9em;
    color: royalblue;
    /*color: cadetblue;*/
    margin-bottom: 10px;
    margin-top: 30px;
}

h4 {
    margin-top: 40px;
    margin-bottom: 0px;
    font-size: 0.9em;
    color: darkred;
}

h5 {
    font-size: 0.8em;
}

img {
    border: 0;
}

a {
    color: blue;
    text-decoration: none;
}

    a:hover {
        color: orange;
        text-decoration: underline;
    }

#account-details {
    border: 0px solid #333;
}

#account-entry {
    margin: 20px auto 20px auto;
    width: 300px;
    border: 1px solid #777;
    border-radius: 5px;
    background-color: white;
    padding: 30px 10px;
    text-align: center;
    min-height: 450px;
}

.form-control {
    font-size: 1.1em;
    border: 1px solid #ccc;
    border-radius: 5px;
    max-width: 240px;
    height: auto;
    padding: 10px;
    width: 80%;
}

.aspbutton {
    display: block;
    color: white;
    background-color: #0077c8;
    /*background-image: linear-gradient(to bottom, #949494, #696969);*/
    border: 1px solid #002b49;
    margin: 10px auto;
    border-radius: 4px;
    font-size: 0.9em;
    max-width: 240px;
    width: 80%;
}

.selectedButton {
    background-color: #a5e6a4;
    color: black;
}

.removeButton {
    background-color: #420707;
    color: white;
}

    .aspbutton:hover {
        cursor: pointer;
        background-color: #4797e1;
        color: gold;
        text-decoration: none;
    }

#content {
    margin: 20px auto 20px auto;
    width: 300px;
    border: 1px solid #777;
    border-radius: 5px;
    background-color: white;
    padding: 10px;
    text-align: center;
    min-height: 450px;
}

.panelContent {
    margin: 20px auto 20px auto;
    width: 300px;
    border: 1px solid #777;
    border-radius: 5px;
    background-color: white;
    padding: 10px;
    text-align: center;
    min-height: 450px;
}

#products {
    text-align: center;
    margin: auto;
    padding: 5px;
    min-height: 650px;
    min-width: 366px;
}

.productgrid {
    /*max-width: 850px;*/
    margin: auto;
    overflow: auto;
    /*min-width: 400px;*/
}

.product {
    border: 1px solid #ccc;
    background-color: white;
    padding: 10px;
    float: left;
    width: 150px;
    height: inherit;
    margin: 5px;
    text-align: center;
    height: 300px;
}

.lightgreen {
    background-color: honeydew;
}

.lightpink {
    background-color: mistyrose;
}

.lightyellow {
    background-color: blanchedalmond;
}

.lightblue {
    background-color: lightcyan;
}


    .product img {
        margin: 10px;
        width: 90%;
    }

        .product img:hover {
            margin: 10px 5px 8px 8px;
            border: 1px solid cadetblue;
            cursor: pointer;
        }

    .product a {
        letter-spacing: 2px;
        letter-spacing: 2px;
        font-size: 0.9em;
        padding: 0px;
        display: block;
        margin-bottom: 4px;
    }

    .product p.fine-print {
        letter-spacing: 1px;
        font-size: 0.7em;
        margin: 2px;
        height: 30px;
        display: block;
    }

    .product p.price {
        letter-spacing: 2px;
        color: #777;
        font-size: 1em;
        margin: 5px 0px 0px 0px;
    }

.productInfo {
    border: 1px solid #ccc;
    background-color: white;
    padding: 2px 2px 20px 2px;
    width: 300px;
    height: inherit;
    margin: auto;
    text-align: center;
}

    .productInfo a {
        font-size: 0.7em;
    }

    .productInfo p {
        margin: 0px auto 0px auto;
    }

    .productInfo img {
        margin: 20px;
    }

.country {
    display: block;
    font-size: 0.7em;
    color: royalblue;
    font-weight: bold;
    padding-bottom: 10px;
}

.price {
    display: block;
    font-size: 0.7em;
    color: grey;
    font-weight: bold;
    padding-top: 5px;
}

.productHeader {
    width: auto;
    background-color: #e7f5f7;
    font-size: 0.9em;
    font-weight: bold;
    color: royalblue;
    display: block;
    height: inherit;
    margin: 0px;
    padding: 10px;
}

.productDescription {
    display: block;
    padding: 10px;
    margin: 20px;
    color: #777;
    font-size: 0.6em;
}

.error {
    display: block;
    width: auto;
    background-color: lightpink;
    color: maroon;
    text-align: center;
    padding: 5px;
    display: block;
}

.fineprint {
    font-size: 0.8em;
    color: cornflowerblue;
    text-align: center;
    margin-top: 15px;
}

.tinylink {
    display: block;
    margin-top: 5px;
    font-size: 0.6em;
}

.ddlstyle {
    border: 1px solid #777;
    border-radius: 5px;
    font-size: 1.1em;
    color: black;
    width: 200px;
    height: 40px;
}

.event {
    margin: 20px auto 20px auto;
    width: 300px;
    border: 1px solid #777;
    border-radius: 5px;
    background-color: white;
    padding: 0px 10px 10px 10px;
    text-align: center;
}

    .event ul {
        text-align: center;
        list-style-type: none;
        margin: 5px 50px 5px 0px;
    }

    .event li {
        color: steelblue;
        font-size: 0.8em;
        display: block;
        margin-left: 10px;
        margin-bottom: 0px;
    }

    .event img {
        width: 100px;
        height: 100px;
        margin-top: 20px;
    }

    .event h2 {
        width: auto;
        margin: 0px;
        padding: 10px 0px 10px 0px;
        background-color: #e7f5f7;
        height: inherit;
    }

#ratings {
    width: auto;
    height: inherit;
    text-align: center;
    /*min-height: 300px;*/
    padding-bottom: 20px;
}

    #ratings p {
        display: block;
        height: auto;
        width: 200px;
        font-size: 0.8em;
        padding: 0px;
        margin: auto;
        text-align: center;
    }

.ratingName {
    display: inline-block;
    width: 150px;
    height: inherit;
    text-align: left;
    margin: 0px;
    padding: 0px;
}

.ratingScore {
    display: inline-block;
    width: 40px;
    height: inherit;
    text-align: left;
    margin: 0px;
    padding: 0px;
}


.adminText {
    font-size: 0.8em;
    border: 1px solid #ccc;
    border-radius: 5px;
    height: auto;
    padding: 10px;
    width: 40px;
}

.adminLabel {
    font-size: 0.8em;
    display: inline-block;
    width: 120px;
    margin: 10px;
    text-align: left;
}

.adminLink {
    font-size: 0.8em;
    display: inline-block;
    width: 60px;
    margin: 10px;
    text-align: left;
}


@media only screen and (max-width: 450px) {

    /*#products {
        text-align: center;
        margin: 0px;
        padding: 5px;
    }

    .product {
        margin: 2px;
    }*/

}


/* Popups  */

#cover {
    display: none;
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    /*background: gray;
    filter: alpha(Opacity = 50);
    opacity: 0.5;
    -moz-opacity: 0.5;
    -khtml-opacity: 0.5*/
}

/* 250px wide 300px hight - centered */
#dialog {
    display: none;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 250px; /* adjust as per your needs */
    height: 300px; /* adjust as per your needs */
    margin-left: -128px; /* negative half of width above */
    margin-top: -200px; /* negative half of height above */
    z-index: 100;
    background: white;
    padding: 2px;
    border: 1px solid gray
}