/* Desktop */
@media (min-width: 1030px) {
    div#content, div.content, div.footer-container {
        width:1000px;
	margin:auto;
    }

    .background-item, .background-item img {
	width:240px;
        height:240px;
    }

    #nav-wrapper {
	width:1000px;
        margin:auto;
    }

    div.footer-container div.col {
	width:25%;
    }

    div.copyrights {
	margin-top:-25px;
    }
}

/* Tablet */
@media (max-width: 1030px) {
    div.logo-wrapper {
	float:none;
    }

    div#content, div.content, div.footer-container {
        width:610px;
    }

    div.content.content-bottom, div.content.author-description {
        padding:10px;
    }

    div.content.author-detail {
	padding-left:5px;
        padding-right:5px;
    }

    .background-item .categories, 
    .background-item .authors {
        margin-left:12px;
        margin-bottom:12px;
	margin-right:12px;
        font-size: 15pt;
    }

    .background-item, .background-item img {
	width:193px;
        height:193px;
    }

    #nav-wrapper {
	width:610px;
        margin:auto;
    }

    div.content-bottom div.col {
	width:100%;
    }

    div.content-bottom div.col.right div {
	float:left;
    }

    div.download-box {
	text-align:left;
    }
}


/* All mobile */
@media only screen and (max-width: 610px) {
    div.content.image {
	padding-top:0px;
        padding-bottom:5px;
    }

    div.list-header {
	padding-left:0;
	padding-right:0;
    }

    div.list-header div.wrap {
	padding-left:10px;
	padding-right:10px;
    }


    .background-item .categories, 
    .background-item .authors {
        margin-left:12px;
        margin-bottom:12px;
	margin-right:12px;
        font-size: 15pt;
    }

    div.content.download-share {
        padding-top:15px;
        padding-bottom:15px
    }

    div.content.content-bottom {
        padding:10px;
    }

   .download-button-box {
        margin-top:0px;
	width:232px;
    }

    p#download, p#license {
	margin-top:5px;
        margin-bottom:0px; 
    }

    .background-detail img.content-image {
	width:100%;
        margin:auto;
	display:block;
    }

    .share-box {
	width:176px;
    }

    .share-box .share-button{
	margin-bottom:8px;
    }
}

/* Mobile */
@media only screen and (max-width: 610px) and (min-width: 375px) {
    div#content, div.content, div.footer-container {
        width:375px;
	padding-bottom:10px;
    }

    div#console {
	background-color:skyblue !important;
    }

    .background-item {
	width:187px;
        height:187px;
        margin:0;
	padding:0;
    }

    ul.background-list {
	background-color: #e5e5e5;
    }

    div.content.author-detail {
	padding-left:10px;
        padding-right:10px;
    }

    header nav {
	padding:0;
    }


    header nav > div.nav-title:hover {
	background-color:#021928;
    }

    div.menu-item-wrapper {
        width:100%;
    }

    #nav-wrapper {
	width:375px;
        margin:auto;
    }

    header nav div.nav-title {
	font-size:10pt;
        padding: 0 10px;
    }

    .logo-wrapper {
	padding-left:10px;
    }

    header nav div.nav-title.recent {
	width:89px;
    }
    header nav div.nav-title.popular {
	width:89px;
    }
    header nav div.nav-title.categories {
	width:108px;
    }
    header nav div.nav-title.authors {
	width:89px;
    }

    div.list-header span, div.list-header input {
        font-size:10pt;
    }



    div.content-bottom div.col {
	width:100%;
        padding-left:0;
    }

    div.footer-container div.col {
	width:100%;
    }



    div.terms-policy {
	margin-top:23px;
    }

    div.about-us,
    div.how-to-upload {
	margin-top:45px;
    }
}


@media (max-width: 370px)  {
    div#content, div.content, div.footer-container {
        width:360px;
	padding-bottom:10px;
    }

    div#console {
	background-color:grey !important;
    }

    .logo-wrapper {
	padding-left:8px;
    }

    header nav div.nav-title.recent {
	width:86px;
    }
    header nav div.nav-title.popular {
	width:86px;
    }
    header nav div.nav-title.categories {
	width:102px;
    }
    header nav div.nav-title.authors {
	width:86px;
    }

    header nav div.nav-title {
	font-size:10pt;
        padding: 0 8px;
    }

    div.list-header span, div.list-header input {
        font-size:10pt;
    }

    .background-item, .background-item img {
	width:180px;
        height:180px;
        margin:0;
	padding:0;
    }

    ul.background-list {
	background-color: #e5e5e5;
    }

    div.content.author-detail {
	padding-left:10px;
        padding-right:10px;
    }

    header nav {
	padding:0;
    }

    header nav > div.nav-title:hover {
	background-color:#021928;
    }

    div.menu-item-wrapper {
        width:100%;
    }

    #nav-wrapper {
	width:360px;
        margin:auto;
    }

    div.content-bottom div.col {
	width:100%;
        padding-left:0;
    }

    div.footer-container div.col {
	width:100%;
    }



    div.terms-policy {
	margin-top:23px;
    }

    div.about-us,
    div.how-to-upload {
	margin-top:45px;
    }
}

@media (max-width: 340px) {

    div#content, div.content, div.footer-container {
        width:320px;
	padding-bottom:10px;
    }

    div.content.content-bottom, div.content.author-description {
        padding:5px;
    }

    .background-item, .background-item img {
	width:160px;
        height:160px;
        margin:0;
	padding:0;
    }

    span.icon-sheet img {
	width:15px;
	float:left;
	margin-top:1px;
    }

    header nav div.nav-title {
	font-size:8pt;
        padding: 0 6px;
    }

    .logo-wrapper {
	padding-left:8px;
    }

    header nav div.nav-title.recent {
	width:75px;
    }
    header nav div.nav-title.popular {
	width:75px;
    }
    header nav div.nav-title.categories {
	width:95px;
    }
    header nav div.nav-title.authors {
	width:75px;
    }

    div.list-header span, div.list-header input {
        font-size:8pt;
    }

    #nav-wrapper {
	width:320px;
        margin:auto;
    }

    div.content-bottom div.col {
	width:100%;
        padding-left:0;
    }

    div.footer-container div.col {
	width:100%;
    }
}