/*--------------------------------------------------------------
Responsive Style
--------------------------------------------------------------*/

/* Media queries ----------- */
/* Does the same thing as <meta name="viewport" content="width=device-width">,
 * but in the future W3C standard way. -ms- prefix is required for IE10+ to
 * render responsive styling in Windows 8 "snapped" views; IE10+ does not honor
 * the meta tag. See http://core.trac.wordpress.org/ticket/25888.
 */
@-ms-viewport {
	width: device-width;
}

@viewport {
	width: device-width;
}


/* Smaller than standard 1024px (devices and browsers) ----------- */
@media screen and (max-width: 1024px) {
	.site {
		width: 960px;
  	}
	#nav-slider .nav-previous, 
  	#nav-slider .nav-next {
    	top: 94px;
  	}
  	#primary {
	    width: 565px;
	}
	#site-generator .copyright, 
	#site-generator .powered {
	    width: 445px;
	}
	#respond input#submit {
		left: 25px;
	}
	.commentlist .avatar,
	.commentlist .children .avatar {
		left: 25px;
		top: 25px;
	}	
	.one-column .site {
		width: 730px;
	}

	/* =Padding and Margins
	----------------------------------------------- */
	.site {
		margin: 25px auto;
	}
	#main,
	#supplementary {
		padding: 25px 25px 0;
	}
	#header-content,
	#access div, 
	#access-secondary div,
	#access-footer div {
		margin: 0 25px;	
	}
	#header-content {
		padding: 25px 0;	
	}
	.page-header,
	.commentlist > li.comment,
	.commentlist .pingback,
	#respond,
	.commentlist .children li.comment {
		padding: 25px;
	}
	#slider,
	.hentry, 
	.no-results,
	#author-info,
	#disqus_thread,
	#content .error404,
	.page-header,
	p,
	ul, 
	ol,
	.home #content nav,
	.archive #content nav,
	.widget,
	.commentlist > li.comment,
	.commentlist .pingback,
	#respond,
	#supplementary .widget {
		margin-bottom: 25px;
	}
	.commentlist #respond,
	.commentlist .children li.comment {
		margin-top: 25px;
	}
	.hentry,
	.no-sidebar.full-width .hentry,
	.one-column.no-sidebar .hentry,
	.no-results,
	#author-info,
	#disqus_thread,
	#content .error404 {
	    padding: 10px 25px 25px;
	}
	.entry-title {
		padding: 10px 0 5px;
	}
	#site-generator {
		padding: 20px 25px;	
	}
	#comments-title {
	    padding-bottom: 20px;
	}
	.entry-content,
	.entry-summary {
		padding-top: 20px;
	}
}

@media screen and (max-width: 990px) {
	.site {
		width: 910px;
  	}
  	#primary {
  		width: 515px;
  	}
	#site-generator .copyright, 
	#site-generator .powered {
	    width: 420px;
	}	  	
}

/* iPad Portrait and other Smaller then standard 960 (devices and browsers) ----------- */
@media screen and (max-width: 960px) {
	.site {
		width: 720px;
	}
	#primary,
	#secondary,
	#site-generator .copyright, 
	#site-generator .powered {
		display: block;
		float: none;
		width: 100%;
	}
	#site-generator .copyright, 
	#site-generator .powered {
		text-align: center;
	}		
	/* Simplify the basic layout */
	#nav-slider .nav-previous,
	#nav-slider .nav-next {
		top: 140px;
	}
	.no-sidebar.full-width #nav-slider .nav-previous,
	.no-sidebar.full-width #nav-slider .nav-next,
	#slider.slider-fullwidth  #nav-slider .nav-previous,
	#slider.slider-fullwidth  #nav-slider .nav-next {
		top: 25%;
	}
	#nav-slider .nav-previous {
		left: 20px;
	}
	#nav-slider .nav-next {
		right: 20px;
	}
	#nav-below {
		border-bottom: 1px solid #ccc;
	}
	#branding ul.menu a, 
	#colophon #access-footer ul.menu a {
   		padding: 0 0.83em;
	}
	/* Remove the margin on singular articles */
	.no-sidebar .entry-header,
	.no-sidebar .entry-content,
	.no-sidebar .entry-summary,
	.no-sidebar footer.entry-meta,
	.error404 .entry-header,
	.error404 .entry-content,
	.no-sidebar #comments-title  {
	    width: 100%;
	}	
	/* Simplify the pullquotes and pull styles */
	.no-sidebar blockquote.pull {
		margin: 0 0 2em;
	}
	.no-sidebar .pull.alignleft {
		margin: 0 2em 0 0;
	}
	.no-sidebar .pull.alignright {
		margin: 0 0 0 2em;
	}
	.no-sidebar #author-info {
		margin: 2.2em -8.8% 0;
		padding: 20px 8.8%;
	}
	.widget_search #s {
		width: 93.8%;
	}
	/* Make sure we have room for our comment avatars */
	.commentlist {
		width: 100%;
	}
	.commentlist > li.comment,
	.commentlist .pingback {
		width: auto;
	}
	/* And a full-width comment form */
	#respond {
		width: auto;
	}
	/* No need to float footer widgets at this size */
	#colophon #supplementary .widget-area {
		float: none;
		margin-right: 0;
		width: auto;
	}
	/* No need to float 404 widgets at this size */
	.error404 #main .widget {
		float: none;
		margin-right: 0;
		width: auto;
	}	
	.format-gallery .gallery-thumb {
		max-width: 100%
	}
	/* Menu */
	#access .menu-header-container,
	#access-secondary .menu-secondary-container,
	#access-footer .menu-footer-container {
		padding: 14px 0;
	}	
	#branding ul.menu, 
	#access-secondary.mobile-disable,
	#access-footer ul.menu,
	#colophon #access-footer.mobile-disable {
		display: none;
	}
	#branding ul.menu li,
	#access-footer ul.menu li {
		border: none;
	    float: none;
	    text-align: center;
    }
	#colophon #access-footer ul.menu a {
		display: block;
		float: none;
	}	
	.tinynav {
		background: url("../images/menu.png") right 1px no-repeat;
		border: none;
		color: #fff;
		display: block;
		margin-bottom: 0;
		margin-left: auto;
		margin-top: 0;
		overflow: hidden;
		width: 100%;
	}	
	.tinynav2 {
		color: #373737;
	}	
	.tinynav option {
		color: #000;
	}
	#respond input#submit {
		left: 20px;
	}
	.commentlist .avatar,
	.commentlist .children .avatar {
		left: 20px;
		top: 20px;
	}	
	.one-column .site {
		width: 720px;
	}
	/* =Padding and Margins
	----------------------------------------------- */
	.site {
		margin: 20px auto;
	}
	#main,
	#supplementary {
		padding: 20px 20px 0;
	}
	#header-content,
	#access div, 
	#access-secondary div,
	#access-footer div {
		margin: 0 20px;	
	}
	#header-content {
		padding: 20px 0;	
	}
	#slider-wrap a, 
	#slider-wrap .featured-img span
	.page-header,
	.commentlist > li.comment,
	.commentlist .pingback,
	#respond,
	.commentlist .children li.comment {
		padding: 20px;
	}
	#slider,	
	.hentry, 
	.no-results,
	#author-info,
	#disqus_thread,
	#content .error404,
	.page-header,
	p,
	ul, 
	ol,
	.home #content nav,
	.archive #content nav,
	.widget,
	.commentlist > li.comment,
	.commentlist .pingback,
	#respond,
	#supplementary .widget {
		margin-bottom: 20px;
	}
	.commentlist #respond,
	.commentlist .children li.comment {
		margin-top: 20px;
	}
	.hentry, 
	.no-sidebar .hentry,
	.no-sidebar.full-width .hentry,
	.one-column.no-sidebar .hentry,
	.no-results,
	#author-info,
	#disqus_thread,
	#content .error404 {
	    padding: 10px 20px 20px;
	}
	#site-generator {
		padding: 20px;	
	}
	#comments-title,
	#nav-below {
	    padding-bottom: 20px;
	}
	.entry-content,
	.entry-summary {
		padding-top: 20px;
	}
	#slider-wrap .featured-text {
		padding: 0 20px 20px;
	}
}

/* Smaller then standard 767 (devices and browsers) ----------- */
@media screen and (max-width: 767px) {	
	.site, 
	.one-column .site {
		width: 600px;
	}
	.logo-wrap {
		float: none;
		text-align: center;
	}
	#sidebar-header-right, 
	#sidebar-header-right .widget,
	#branding #s {
		float: none;
	}
	#sidebar-header-top,
	#sidebar-header-right {
		text-align: center;
		width: 100%;
	}	
	input#s {
		font-size: 16px;
	}
	#header-content {
		text-align: center;
	}
	.no-sidebar.full-width #nav-slider .nav-previous,
	.no-sidebar.full-width #nav-slider .nav-next,
	#slider.slider-fullwidth #nav-slider .nav-previous,
	#slider.slider-fullwidth #nav-slider .nav-next {
		top: 20%;
	}	
	/* Reposition the site title and description slightly */
	#site-title {
		padding: 0;
	}
	#site-title,
	#site-description {
		margin-right: 0;
	}
	/* Floated content doesn't work well at this size */
	.alignleft,
	.alignright {
		float: none;
		margin-left: 0;
		margin-right: 0;
	}
	/* Make sure the post-post navigation doesn't collide with anything */
	#nav-single {
		display: block;
	}
	.no-sidebar.page .hentry {
		padding: 2em 5%;
	}
	.widget_search #s {
		width: 89%;
	}
	/* Talking avatars take up too much room at this size */
	.commentlist .children li.comment .comment-meta {
		margin-left: 16%;
	}
	.commentlist > li.comment,
	.commentlist > li.pingback {
		margin-left: 0 !important;
	}
	/* Pagination */
	#content #infinite-handle {
		padding-bottom: 1em;
	}
	#nav-below .wp-pagenavi a, 
	#nav-below .wp-pagenavi span, 
	#nav-below #wp_page_numbers ul li a,
	.page-link span,
	.page-link a span {
		height: 25px;
		font-size: 12px;
		line-height: 24px;
		padding: 0 10px;
	}	
	#nav-below .wp-pagenavi a, 
	#nav-below .wp-pagenavi span,
	.page-link span {
		margin: 0 0 0 5px;
	}	
	#respond input[type="text"],
	#respond textarea {
	    -moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
	    width: 100%;
	}
	#respond input[type="text"] {
		height: 45px;
	}
	#respond .comment-form-author .required,
	#respond .comment-form-email .required {
		left: 90%;
	}
	#site-generator .social-profile {
		float: none;
		margin-right: 0;
		padding-bottom: 0;
		text-align: center;
	}
	.social-profile ul li {
		display: inline-block;
		float: none;
		margin: 0 0 5px 10px;
	}
	#site-generator {
		padding: 1em 0.5em;	
	}
	.woocommerce #content ul.products li {
		margin-right: 0;
		width: 100%;
	}
	.woocommerce #content .product a.added_to_cart {
		clear: both;
		display: block;
	}
	#main .woocommerce .col-1,
	#main .woocommerce .col-2 {
		width: 100%;
	}
	/* Font Size */
	body,
	button,
	input,
	select,
	textarea {
		font-size: 14px;
	}	
	#site-title {
		font-size: 28px;
		line-height: 38px;
	}
	#access ul {
		font-size: 12px;
	}
	blockquote {
		margin: 0;
	}
	article.intro .entry-content,
	article.intro .entry-summary {
		font-size: 12px;
	}
	.entry-title,
	.entry-content h1 {
	    font-size: 22px;
	}
	.entry-content h2 {
	    font-size: 20px;
	}
	.entry-content h3 {
	    font-size: 18px;
	}
	.entry-content h4 {
	    font-size: 16px;
	}
	.entry-content h5,
	.featured-post .entry-title,
	blockquote.pull {
	    font-size: 14px;
	}
	.entry-content h6 {
	    font-size: 13px;
	}
	.entry-meta {
		font-size: 12px;
	}	
	#site-generator {
		font-size: 11px;
	}		
	#slider-wrap a, 
	#slider-wrap .featured-img span {
		padding: 10px;
	}
	#sidebar-header-right {
		margin-top: 20px;	
	}
	#slider-wrap .featured-text {
		padding: 0 10px 10px;
	}
	.one-column #nav-slider .nav-previous,
	.one-column #nav-slider .nav-next,
	#nav-slider .nav-previous,
	#nav-slider .nav-next {
		top: 110px;
	}
	.one-column #nav-slider .nav-previous,
	#nav-slider .nav-previous {
		left: 10px;
	}
	.one-column #nav-slider .nav-next,
	#nav-slider .nav-next {
		right: 10px;
	}
}

@media screen and (max-width: 640px) {
	.site, 
	.one-column .site {
		width: 460px;
	}
}

/* Smaller then standard 479px (devices and browsers) ----------- */
@media screen and (max-width: 479px) {
	.site,
	.one-column .site {
		width: 100%;
	}
	#branding,
	#site-generator  {
	    border-radius: 0;
	}
	#content .gallery-columns-2 .gallery-item {
		width: 45%;
		padding-right: 4%;
	}
	#content .gallery-columns-2 .gallery-item img {
		width: 100%;
		height: auto;
	}
	#nav-slider .nav-previous,
	#nav-slider .nav-next {
		display: none;
	}
	/* Controllers */
	#controllers {
		display: block;
	}
	#controllers {
		text-align:center;
		padding: 5px 0 15px;
		line-height:0;
	}
	#controllers a {
		width: 12px;
		height: 12px;
		margin: 0 3px;
		overflow: hidden;
		display: inline-block;
		background-color: #b7b7b7;	
		-webkit-border-radius: 6px;
		-moz-border-radius: 6px;
		border-radius: 6px;
		text-indent: -9999px;
	}
	#controllers a:hover, #controllers a.active {
		background-color:#000;
	}	
	.widget_search #s {
		width: 85%;
	}
	img.size-full,
	img.size-large,
	img.wp-post-image {
		max-width: 94.6%;
	}
	.commentlist .children li.comment .comment-meta {
		margin-left: 22%;
	}
	/* Font Size */
	body,
	button,
	input,
	select,
	textarea {
		font-size: 14px;
	}	
	#site-title {
		font-size: 26px;
		line-height: 36px;
	}
	#site-description {
		font-size: 12px;
	}	
	#site-generator {
		font-size: 10px;
	}
	#respond input#submit {
		left: 15px;
	}
	.commentlist .avatar,
	.commentlist .children .avatar {
		left: 15px;
		top: 15px;
	}

	/* =Padding and Margins
	----------------------------------------------- */
	.site {
		margin: 0 auto;
	}
	#main,
	#supplementary {
		padding: 15px 15px 0;
	}
	#header-content,
	#access div, 
	#access-secondary div,
	#access-footer div {
		margin: 0 15px;	
	}
	#header-content {
		padding: 15px 0;	
	}
	.page-header,
	.commentlist > li.comment,
	.commentlist .pingback,
	#respond,
	.commentlist .children li.comment,
	#site-generator {
		padding: 15px;
	}
	#slider,	
	.hentry, 
	.no-results,
	#author-info,
	#disqus_thread,
	#content .error404,
	.page-header,
	p,
	ul, 
	ol,
	.home #content nav,
	.archive #content nav,
	.widget,
	.commentlist > li.comment,
	.commentlist .pingback,
	#respond,
	#supplementary .widget {
		margin-bottom: 15px;
	}
	.commentlist #respond,
	.commentlist .children li.comment {
		margin-top: 15px;
	}
	.hentry, 
	.no-sidebar .hentry,
	.no-sidebar.full-width .hentry,
	.one-column.no-sidebar .hentry,
	.no-results,
	#author-info,
	#disqus_thread,
	#content .error404 {
	    padding: 10px 15px 15px;
	}
	.entry-title {
		padding: 10px 0 5px;
	}
	#comments-title,
	#nav-below {
	    padding-bottom: 15px;
	}
	.entry-content,
	.entry-summary {
		padding-top: 15px;
	}
}

/* Smaller then standard 320 (devices and browsers) ----------- */
@media screen and (max-width: 320px) {
	#branding #s:focus {
		width: 150px;
	}
	input[type="text"] {
		width: 98%;
	}
	.widget_search #s {
		width: 80%;
	}
	.entry-content img, 
	.comment-content img,
	img.size-full,
	img.size-large,
	img.wp-post-image {
		max-width: 92%;
   	 	padding: 3%;
	}	
	#slider,
	.hentry, 
	.no-results, 
	#author-info, 
	#disqus_thread, 
	#content .error404,
	.widget {
	    border-radius: 0;
	}
	#main,
	#supplementary {
		padding: 10px 0 0;
	}
	#header-content,
	#access div, 
	#access-secondary div,
	#access-footer div {
		margin: 0 10px;	
	}
	#header-content {
		padding: 10px 0;	
	}
	.page-header,
	.commentlist > li.comment,
	.commentlist .pingback,
	#respond,
	#site-generator {
		padding: 10px;
	}
	#slider,	
	.hentry, 
	.no-results,
	#author-info,
	#disqus_thread,
	#content .error404,
	.page-header,
	p,
	ul, 
	ol,
	.home #content nav,
	.archive #content nav,
	.widget,
	.commentlist > li.comment,
	.commentlist .pingback,
	#respond,
	#supplementary .widget {
		margin-bottom: 10px;
	}
	.hentry, 
	.no-sidebar .hentry,
	.no-sidebar.full-width .hentry,
	.one-column.no-sidebar .hentry,
	.no-results,
	#author-info,
	#disqus_thread,
	#content .error404 {
	    padding: 5px 10px 10px;
	}
	.entry-title {
		padding: 8px 0 4px;
	}
	#comments-title,
	#nav-below {
	    padding-bottom: 10px;
	}	
}