/*

Theme Name: Grid Portfolio Responsive

Theme URI: http://www.dessign.net/gridportfolio

Description: Grid Portfolio Theme for WordPress is stylish, customizable, simple, and readable. Perfect for any illustrator or graphic designer. 

Version: 3.0

Author: Marios Lublinski

Author URI: http://www.dessign.net

Tags: 2 column theme, white, clean



*/



/* Global */



* { margin: 0; padding: 0; }

body { background-color: #edeeee; font-size: 12px; font-family: arial, georgia, verdana; }

#main_container { width: 968px; background-color: #fff; margin: 0 auto; }

.clear { clear: both; }

h1,h2,h3,p { margin: 10px 0; }

h3 { font-size: 11px; color:#525252; }

.left { float: left; }

.right { float: right; }

a { color: #525252; text-decoration: none; }

a:hover { text-decoration:underline; }

img { border: none; }



/* Header */



#menu_container { width: 938px; padding: 20px 15px; border-bottom: 1px solid #eee; }

#menu_container ul { list-style-type: none; }

#menu_container ul li { float: left; margin: 0 10px; font-size: 11px; }

#menu_container .left_list { float: left; }

#menu_container .right_list { float: right; }

#menu_container .right_list li { margin: 0 5px; }



#header_container { width: 953px; padding: 20px 0px 20px 15px; border-bottom: 1px solid #eee; }

.logo { float: left; margin: 0 10px; }

#header_container .right_text { float: right; background-color:#afafaf; font-size: 15px; color: #fff; padding: 5px; font-weight: normal; }



#header_category_container { width: 910px; background-color: #fff; padding: 1px 29px; color: #fff; margin-top: 5px; margin-bottom: 5px; }

#header_category_container ul { list-style-type: none; }

#header_category_container ul li { float: left; margin-right: 20px; font-size: 15px; font-weight: normal; }

#header_category_container ul li a { color: #fff; }





#featured_home_top { width: 910px; padding: 1px 29px;}

#featured_home_top .home_top_box { width: 284px; float: left; margin-right: 25px; }

#featured_home_top .home_top_box img { width: 284px; height: 176px; }

#featured_home_top .last { margin-right: 0px; }



/** Content **/



#content { width: 968px; float: left; margin-top: 15px; }



#content .featured_box { width: 250px; float: left; margin-right: 50px; color:#afafaf; }

#content .featured_box img { width: 240px; height: 250px; }

#content .featured_box p { font-size: 11px; color:#afafaf; }

#content .last { margin-right: 0px; }

#content .first { margin-left: 61px; }



#content .single { padding-left: 29px; width: 920px; }

#content .single h1 { font-size: 13px; }



#content .post_divider { width: 100%; height: 2px; border-bottom: 1px solid #eee; margin: 30px 0; }

.nav_container { width: 880px; margin: 15px 0; padding: 0 10px; }





/** Footer **/



#footer { width: 958px; padding: 5px 5px; text-align: right; border-top: 1px solid #eee; margin-top: 5px; color:#afafaf; }



/* for tablet */



@media only screen and (min-width: 768px) and (max-width: 959px) {



#main_container { width: 728px; }

#menu_container { width: 698px; padding: 20px 15px; border-bottom: 1px solid #eee; }



#header_container { width: 713px; padding: 20px 0px 20px 15px; border-bottom: 1px solid #eee; }

#header_category_container { width: 670px; padding: 1px 29px; }



#featured_home_top { width: 670px; padding: 1px 29px;}

#content { width: 728px; float: left; margin-top: 15px; }

.tablet_clear { clear: both; }

.home_posts .clear { clear: none; }

.post_divider { display: none; }

.tablet_post_divider { width: 100%; height: 2px; border-bottom: 1px solid #eee; margin: 30px 0; }



.nav_container { width: auto; margin: 15px 0; padding: 0 10px; }



#content .featured_box { margin-left: 61px; }

#content .tab_right { float: right; margin-right: 45px; margin-left: 0; }



#content .single { padding-left: 29px; width: 670px; }

#content .single .single_content img { max-width: 670px; height: inherit; }



#sidebar { display: none; }



#footer { width: 718px; padding: 5px 5px; }



}







/* for mobile */



@media screen and (max-width: 480px) {



#main_container { width: 320px; }

#menu_container { width: 290px; padding: 20px 15px; border-bottom: 1px solid #eee; }



#header_container { width: 300px; padding: 20px 10px 20px 10px; border-bottom: 1px solid #eee; }

.logo { max-width: 300px; height: inherit; }

#header_category_container { width: 300px; padding: 1px 10px; }



#featured_home_top { width: 300px; padding: 1px 10px;}

#content { width: 320px; float: none; margin-top: 15px; margin: 0 auto; }

.right_list { display: none; }



#featured_home_top .home_top_box { width: 284px; float: none; margin: 0 auto; }

#featured_home_top .home_top_box img { width: 284px; height: 176px; }



#content .featured_box { width: 250px; float: none; margin: 0 auto 25px; }

#content .featured_box img { width: 240px; height: 250px; }

#content .first { margin-left: auto; }



#content .post_divider { display: none; }



#content .single { padding: 0; width: 300px; margin: 0 auto; float: none; }

#content .single .single_content img { max-width: 300px; height: inherit; }

#commentform textarea { width: 280px; }



.nav_container { width: auto; margin: 15px 0; padding: 0 10px; }



#footer { display: none; }



}