@import url('https://fonts.googleapis.com/css?family=Playfair+Display:400,400i');

body {
    background-color: #E6E5EA;
}

html { 
    background: url(http://www.jmcgraphics.co.uk/clients/roserflotats.com/images/ROSER-website-landing.jpg) no-repeat center center fixed; 
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

.whitePage {
    background-color:#FFFFFF !important;
}

.top {
    vertical-align: top !important;
}

.sitecontainer {
    max-width:1000px;
    margin-left:auto;
    margin-right:auto;
    position:relative;
}

a, a:hover, a:active, a:visited {
    text-decoration: none; 
    letter-spacing: 1px; 
    color: #a3a2a2; 
    margin-left:18px;
    margin-right:18px;    
}

.rightPadding18 {
    padding-left:18px;
}

.header {
    font-size: 17px; 
    line-height: 18px; 
    color: #a3a2a2; 
    font-weight: normal; 
    font-family: 'Playfair Display', 'serif;';  
    background-color:#161615;
    padding-top:40px;
    padding-bottom:40px;
}

.footer {
    padding: 20px 0px 20px 0px;
    width: 100%;
    font-size: 10px; 
    line-height: 56px; 
    font-family: 'Source Sans Pro'; 
    color: #a3a2a2; 
    font-weight: 300; 
    text-align: center; 
    background-color:#161615;
}

.floatingFooter {
    position: absolute;
    bottom:0px;
}

.divPuller {
    display:block;
    clear:both;
    height:1px;
    border:none;
}

.textleft {
    text-align:left;
}

.textright {
    text-align:right;
}

.textcenter {
    text-align: center;
}

.logo {
    position:absolute; 
    left:38px; 
    top: -24px;
    max-width:190px;
}

.noMargin {
    margin: 0;
}

.sideMargins16 {
    margin-left: 16px;
    margin-right:16px;
}

.sidePadding15 {
    padding-left:15px;
    padding-right:15px;
}

.topBottomPadding20 {
    padding-top:20px;
    padding-bottom:20px;
}

.topBottomPadding50 {
    padding-top:50px;
    padding-bottom:50px;
}

.bottomMargin50 {
    margin-bottom:50px;
}

.topMargin50 {
    margin-top:50px;
}

.bottomBorder {
    border-bottom:1px solid #c7c7c7; 
}

h1 {
    font-size: 38px; 
    line-height: 38px; 
    font-family: 'Palatino Linotype', 'Book Antiqua', Palatino, serif; 
    color: #767470; 
    font-weight: lighter; 
    text-align: center;
}

h2 {
     font-size: 18px; 
     line-height: 22px; 
     font-family: Arial,Tahoma, Helvetica, sans-serif; 
     color:#555555; 
     font-weight:300; 
     text-align:left;
     padding-left: 16px;
     padding-right: 16px;
}
h3 {
     font-size: 16px; 
     line-height: 20px; 
     font-family: Arial,Tahoma, Helvetica, sans-serif; 
     color:#555555; 
     font-weight:300; 
     text-align:left;
     padding-left: 16px;
     padding-right: 16px;
}
.paintingSize {
    font-size: 13px; 
    line-height: 22px; 
    font-family: Arial,Tahoma, Helvetica, sans-serif; 
    color:#a3a2a2; 
    font-weight:normal; 
    text-align:left;
    padding-left: 16px;
    padding-right: 16px;
}

.paraCopy {
    font-size: 15px; 
    line-height: 30px; 
    font-family: 'Palatino Linotype', 'Book Antiqua', Palatino, serif; 
    color: rgb(102,102,102); 
    font-weight: lighter; 
    text-align: justify;
}

#contactUs {
    background-color: #a2a09c;
    border:none;
    font-size: 18px;
    font-family: Verdana, Geneva, sans-serif;
    text-align: center;
    color: #ffffff;
    font-weight: lighter;
    width:200px;
    height:50px;
}

@media (max-width: 569px) {

    a, a:hover, a:active, a:visited {
        font-size:12px;
        margin-left:10px;
        margin-right:10px;    
    }

    #TopHeader {
        text-align:center;
    }

    .header {
        padding-top:10px;
    }

    .homeHeader {
        padding-top:20px !important;
    }

    .logo {
        position:relative; 
        text-align:center;
        max-width:190px;
        left:unset;
        top:unset;
    }

    .rightPadding18 {
        padding-right:0px;
        padding-left:0px;
    }

    .modal-dialog {
        width:90% !important;
        margin-left:auto !important;
        margin-right:auto !important;
    }

    #pictureModal {
        width:95% !important;
    }
}