@import "variables.scss";
@import "mixins.scss";

body{
    background: $body-color;
}

img {
    border:4px solid $img-border-color;
}
.page{
    width:$box-width;
    margin: 0 auto;
    top: 0;
    left: 0;
    right: 0;
    position: relative;
    .img{
        float:left;
        margin: 10px;
    }
    img{
        width: 200px;
        height: 120px;
    }
}
.header{
    background:$header-background;
    @include border-radius(10px);
    .menus li{
        list-style:none;
        padding:10px;
        display:inline-block;
        cursor:pointer;
    }
    .menus li a{
        text-decoration:none;
        font-size:17px;
        font-weight:500;

        &:hover{
            color:#333;
        }
        
    }
    .active {
        background:$menu-hover-color;
        color:#333;
        a{
            color:#333;
        }
    }
    .in-active{
        a{
            color:$menu-hover-color;
        }
    }
}
.container{
    margin: 0 auto;
    padding: 0;
    width: 70%;
    top: 0;
    right: 0;
    left: 0;
    position: relative;
}
.content{
    @include border-radius(10px); 
    border: $box-border-width solid $box-border-color;
    display:inline-block;
    min-height:200px;
    width:100%;
    background:#fff;
}