/*
File:			mobile.css
Description:	Mobile/small-screen styles for Art F City
*/

/* iPads (portrait and landscape) ----------- */
@media only screen
and (min-width : 768px)
and (max-width : 1024px) {
    /* Styles */
}

/* iPads (landscape) ----------- */
@media only screen
and (min-width : 768px)
and (max-width : 1024px)
and (orientation : landscape) {
    /* Styles */
}

/* iPads (portrait) ----------- */
@media only screen
and (min-width : 768px)
and (max-width : 1024px)
and (orientation : portrait) {
    /* Styles */
}

/* iPhone 4 ----------- */
@media
only screen and (-webkit-min-pixel-ratio : 1.5),
only screen and (min-pixel-ratio : 1.5) {
    /* Styles */
}

/* Smartphones (portrait and landscape) ----------- */
@media (max-width : 768px) {
    /* Styles */
    body.custom {
        background-color: #000;
        background-image: none;
    }
    body.custom #container {
        width: 100%;
    }
    body.custom .menu {
        position: relative;
    }
    body.custom #container {
        padding-top: 0px;
    }
    #container #content {
        width: 100%;
    }
    #container #sidebars {
        display: none;
    }
    #container #content_box {
        background: none;
        -webkit-box-shadow: none;
        box-shadow: none;

    }
    body.homepage #container #content_box,
    body.singlepost #container #content_box,
    body.category-archive #container #content_box
    {
        background-color: #000;
    }

    body.custom.single-page #content .post_box {
			margin: 0;
			padding: 0;
			box-sizing: border-box;
			-moz-box-sizing: border-box;
			-webkit-box-sizing: border-box;
    }

    body.custom #content .post_box {
        width: 100%;
				margin: 0 0 1em;
        background-color: #fff;
        border-radius: 0px;
				box-sizing: border-box;
				-moz-box-sizing: border-box;
				-webkit-box-sizing: border-box;
    }
    body.custom .headline_area h2.entry-title {
        font-size: 2em;
    }
    body.homepage .headline_area {
        border-bottom: 3px double #ccc;
        padding-bottom: 5px;
        margin-bottom: 5px;
    }

    body.custom #archive_info {
        border: none !important;
    }

    #fun, #credits, #mc_embed_signup, #search {
        display: none;
    }

    #message #mc_embed_signup {
        display: block;
    }
    .custom .headline_area h2.entry-title {
        padding-right: 0px !important;
    }

    body.custom #content span.fancy-category-wrapper {
        position: inherit;
        white-space: nowrap;
    }

    body.custom .headline_area p.to_comments { display: none; }
    body.homepage #container #content div span.comments-link {
        display: inline;
        background-color: #a6b453;
        padding: 1px 5px;
        white-space: nowrap;
    }
    body.homepage #container #content div span.comments-link a {
        color: #fff !important;
        text-decoration: none;
        border-bottom: none;
    }
    #disqus_thread, .hotposts {
        background-color: #fff;
    }
		.custom .hotposts {
			width: 100%;
			padding: 1em;
			margin: 0;
			border-radius: 0;
			border-top: none;
			box-sizing: border-box;
			-moz-box-sizing: border-box;
			-webkit-box-sizing: border-box;
		}
    #content div.post embed {
        width: 100%;
    }
    body.custom #footer { padding: 0; }

    body.singlepost #container .headline_area {
        width: 100%;
    }
    .custom.singlepost #content .headline_area h1 {
        padding-right: 3.3em;
    }
    #container #content img {
        max-width: 100%;
        height: auto;
    }

    #container #content div.wp-caption {
			max-width: 100%;
			margin: 0 auto;
			background-color: #fff;
			border-top: none;
    }

    #pinterest-after-post {
        display: none;
    }

    body .byline-social #social-share-buttons-after-post {
        float: none;
        clear: both;
        display: block;
        width: 70px;
        margin-right: 2.5%;
    }
    body.custom #container .teasers_box {
        width: 90%;
        margin: 0 5%;
        padding: 0;
    }
    body.custom #container .teaser {
        width: 96%;
        clear: both;
        float: none;
        min-height: 5em !important;
        background-color: #fff;
        border-radius: 5px;
        padding: 2%;
        margin: 10px 0;
    }
    body.custom .prev_next {
        border: none !important;
    }
    #footer {
        border: none !important;
    }
    body.custom #container #content .teaser .teaser_link {
        background-color: #EC008C;
        right: 0;
        color: #fff;
        padding: 0 5px 0 5px;
        border-bottom-right-radius: 5px;
    }
    #search {
        z-index: 1;
				display: none !important;
    }
    body.singlepost .byline-social {
        border-left: none;
    }
}
@media (max-width : 480px) {
    body.custom {
        font-size: 40%;
    }
    body.custom ul.menu {
        max-height: 90px;
        font-size: 1.3em;
        padding: 0 2.5%;
    }
    body.custom .headerlogo {
        max-width: 100%;
        float: none;
        display: block;
        clear: both;
        padding-right: 10px;
        background: transparent;
        margin: 0 auto;
    }
		#content .feature-item {
			width: 300px !important;
			max-width: none;
			margin: 0 auto 1em;
			float: none !important;
		}
    .custom.singlepost #content .headline_area h1 {
        padding-right: 5.3em;
    }
    body.singlepost span.comments-link {
        display: none;
    }
    body.custom .menu li.tab#search {
        padding: 0;
        float: none;
    }

    body.custom .menu li.tab form#searchform #nav_search input#s {
        width: 96px;
        margin-top: 12px;
        padding: 2px 3px;
    }

    body.custom #container .teaser {
        font-size: 1.5em;
    }
    body.custom #archive_info {
        font-size: 1.4em;
    }
    ul.menu li {
        position: relative;
        z-index: 90;
    }
		.hotposts .row-fluid .span4 {
			float: none !important;
			width: 180px !important;
			display: block;
			margin: 0 auto 1em !important;
			font-size: 2em;
		}
    .custom .byline-social #facebook-after-post {
        margin-left: -4px;
    }

    .hide-for-mobile {
        display: none !important;
    }
}

@media (max-width : 360px) {
    body.custom .menu #mc_embed_signup {
        display: none;
    }
    body.custom .menu .tab-2 {
        display: none;
    }
    body.custom .menu li.tab form#searchform #nav_search input#s {
        width: 80px;
    }
    .custom #facebook-after-post {
        margin-top: -12px;
    }
}