﻿
@font-face {
    font-family: 'ostrich_sans_roundedmedium';
    src: url('/Areas/Rovin/Content/font/ostrichsansrounded-medium-webfont.woff2') format('woff2'),
         url('/Areas/Rovin/Content/font/ostrichsansrounded-medium-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}
body {
        background-color:#009ddc;
        background-image:url('/Areas/Rovin/Content/img/bck.jpg');
        background-repeat:no-repeat;
        background-size:cover;
        font-family:Arial, Verdana, sans-serif;
        font-size:12px;
}

.nolist {
    list-style:none;
    padding:0;
    margin:0;
}
li {
    list-style-position:inside;
}
.bck {
    background-image:url('/Areas/Rovin/Content/img/icon.png');
    background-repeat:no-repeat;
}
.clear {
    clear:both;
}
a {
    text-decoration:none;
    color:#1b75bc;
}
a:hover {
    text-decoration:none;
    color:white;
}

.title 
{
    font-family:'ostrich_sans_roundedmedium',Arial,sans-serif;
    font-size:22px;
    margin-bottom:5px;
}

.subtitle
{
    font-size:12px;
}
#logo {
    display:block;
    width:135px;
    height:65px;
    background-position:-8px -8px;
}

#menu a {
    text-decoration:none;
    font-family:'ostrich_sans_roundedmedium',Arial,sans-serif;
    color:black;
}
#menu a:hover, #menu a.current {
    color:white;
}


#news, #content {
    line-height:16px;
}
#news li {
    margin-bottom:15px;

}
#slideshow {
    margin-bottom:20px;
}
#slideshow img {
    border-radius:5px;
}
.nav-tabs {
    border:none;
}
.nav-tabs > li a {
    font-family:'ostrich_sans_roundedmedium',Arial,sans-serif;
    font-size:22px;
    color:black;
}
.nav-tabs > li.active a,.nav-tabs > li.active a:focus {
    background-color:white;
    background-color:rgba(255,255,255,0.5);
    border-top-left-radius:5px;
    border-top-right-radius:5px;
    color:white;
}
.tab-pane {
    background-color:white;
    background-color:rgba(255,255,255,0.5);
    border-radius:5px;
    min-height:100px;
    padding:20px;
}
#featured #slideshow img {
    width:100%;
    border-radius:5px;
}
#products .product a {
    color:black;
}
#products a:hover {
    color:white;
}

footer {
    font-family: 'Advent Pro', sans-serif;
    font-size:14px;
    color:#1B75BC;
    text-align:center;
    background-color:#B2D6F1;
}
.readmore {
    display:block;
    height:6px;
    width:25px;
    background-position:-120px -110px;
    float:right;
    margin-top:5px;
}
.readmore:hover {
    background-position:-120px -200px;
}
@media only screen and (max-width:816px) {
    .maxwidth {
        margin-left:20px;
        margin-right:20px;
    }
    header {
        margin-top:5px;
    }
    #logo {
        margin-bottom:10px;
    }
    #menu li {
        display:inline-block;
        margin-right:10px;
        font-size:22px;
    }
    #bd_home aside {
        padding:20px;
        background-color:rgba(255,255,255,0.3);
        border-radius:5px;
        margin-bottom:5px;
    }
    #slideshow img {
        width:100%;
    }
    #content {
        padding:20px 5px;
        border-top:1px solid white;
        border-bottom:1px solid white;
    }
    #bd_home .nav-tabs > li a {
        font-size:16px;
    }

    #featured {
        display:none;
    }
    #products .product {
        margin-bottom:20px;
    }
    #products .product img {
        width:100%;
        margin-bottom:10px;
        border-radius:5px;
    }
    #product img {
        width:100%;
        border-radius:5px;
        margin-bottom:20px;
    }
    #preview .small {
        display:none;
    }
    #alignment img, #repair img {
        width:100%;
    }
    footer {
        margin-bottom:20px;
    }
    footer>div{
        padding:20px;
        text-align:center;
    }
}
@media only screen and (min-width:816px) {
    .maxwidth {
        margin-left: auto;
        margin-right: auto;
        max-width: 800px;
    }
    header {
        margin-top:15px;
        height:65px;
    }
    #logo {
        float:left;
    }
    #menu {
        margin-top:35px;
        float:right;
    }
    #menu li {
        display:inline-block;
        margin-left:20px;
        font-size:22px;
    }
    aside {
        width:135px;
        margin-top:22px;
        float:left;
        text-align:right;
    }
    #bread {
        width:80px;
        height:80px;
        float:right;
    }
    #bd_home #bread {
        background-position:-10px -100px;
        margin-bottom:10px;
    }
    #bd_products #bread {
        background-position:-10px -185px;
    }
    #bd_product #bread {
        background-position:-10px -270px;
    }
    #bd_services #bread {
        background-position:-10px -360px;
    }
    #bd_support #bread {
        background-position:-10px -460px;
    }
    #bd_about #bread {
        background-position:-10px -560px;
    }
    #content {
        margin-left:145px;
        padding-top:20px;
        padding-bottom:20px;
        border-top:1px solid white;
        border-bottom:1px solid white;
        min-height:500px;
    }
    #featured {
        border-bottom:1px solid white;
        margin-bottom:10px;
    }
    #featured #slideshow {
        max-width:380px;
        float:left;
        margin-right:20px;
    }
    #products .product {
        width:145px;
        height:162px;
        overflow:hidden;
        margin-right:25px;
        margin-bottom:30px;
        float:left;
    }
    #products .product:nth-child(4n) {
        margin-right:0;
    }
    #products .product img{
        width:100%;
        margin-bottom:10px;
        border-radius:5px;
    }
    #product {
        border-bottom:solid 1px white;
        margin-bottom:10px;
    }
    #product #preview {
        float:left;
        margin-right:30px;
        max-width:380px;
    }
    #preview .large {
        width:380px;
        margin-bottom:10px;
    }
    #preview .large img {
        width:100%;
    }
    #preview .small {
        width:85px;
        height:55px;
        margin-right:5px;
        margin-bottom:5px;
        overflow:hidden;
        float:left;
        background-color:white;
    }
    #preview .small img {
        width:100%;
    }
    #services {
        display:table;
        width:100%;
    }
    #alignment, #repair {
        display:table-cell;
        max-width:296px;
    }
    #spacer {
        width:60px;
    }
    footer {
        margin-left:145px;
        display:table;
    }
    footer>div {
        width:33%;
        display:table-cell;
        padding:20px;
    }
}
