body{
    font-family: 'Open Sans', sans-serif;
    margin:0;
    padding:0;
}

.cf:before,.cf:after {content: " ";display: table;}
.cf:after {clear: both;}
.cf {*zoom: 1;}

.sitelink {
    display:block;
    width:300px;
    height:570px;
    margin:10px 0 0 0;
    float:left;
    padding:10px;
    text-decoration: none;
    overflow: hidden;
}

.sitelink h2{
    display:none;
}

.sitelink p{
    margin:0;
    padding:20px 0;
    color:#333;
    text-decoration: none;
    font-size:16px;
}

img.logo {
    padding:20px 0;
}

.photo {
    border-radius: 3px;
    width:300px;
    height:300px;
    display:inline-block;
}

#cafe .photo{
    background: url('images/index_cafe.jpg') no-repeat;
}

#quilting .photo{
    background: url('images/index_quilting.jpg') no-repeat;
}

#retreat .photo{
    background: url('images/index_retreat.jpg') no-repeat;
}

#contentwrap a#cafe:hover{
    padding:8px;
    border:2px solid #373535;
    border-radius: 4px;
}


#contentwrap a#quilting:hover{
    padding:8px;
    border:2px solid #ED383A;
    border-radius: 4px;
}

#contentwrap a#retreat:hover{
    padding:8px;
    border:2px solid #85878A;
    border-radius: 4px;
}

#contentwrap a#cafe{
    /*margin-right:18px;*/
}

#contentwrap a#quilting{
    /*margin-right:18px;*/
}

#contentwrap a#retreat{
    /*margin-right:0;*/
}

hr{
    border: 0;
    height: 1px;
    background-image: -webkit-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.30), rgba(0,0,0,0));
    background-image:    -moz-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.30), rgba(0,0,0,0));
    background-image:     -ms-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.30), rgba(0,0,0,0));
    background-image:      -o-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.30), rgba(0,0,0,0));
}

@media all and (min-width: 960px){
    #contentwrap{
        padding-top:70px;
        width:960px;
        position:relative;
        margin:auto;
    }
    hr {display:none}
}
@media all and (min-width: 631px) and (max-width: 959px){
    /*TABLET ONLY*/
    .sitelink {
        width:610px;
        float:none;
        margin:auto;
        height:300px;
    }
    body{
        margin:10px 0;
    }
    .photo {
        float:left;
        margin-right:10px;
    }
    img.logo {
        padding:0;
    }
    /*hr {display:none}*/

}
@media (max-width: 630px){
    .sitelink {
        float:none;
        margin:auto;
        height:auto;

    }
    .sitelink p{
        display:none;
    }
    img.logo {
        padding:5px 0;
    }

    body{
        margin:10px 0;
    }

    .photo {
        height:185px;
    }

    #cafe .photo{
        background-position: 0 -40px;
    }

    #quilting .photo{
        background-position: 0 -20px;
    }

    #retreat .photo{
        background-position: 0 -100px;
    }


}