/*
Theme Name: Cape Town Daily Photo v2
Theme URI: http://mtomas.com/1/tiny-forge-free-mobile-first-wordpress-theme
Author: Paul Gilowey
Author URI: http://www.capetowndailyphoto.com
Description: Tiny Forge Child theme encompass all the best features of the default WordPress themes in one place, plus more usability and code improvements! It features elegant mobile-first HTML5 ready structure of Twenty Twelve, custom per-post headers and three footer widgets from Twenty Eleven (plus forth footer widget to insert your copyright information), icon webfont support from Twenty Thirteen and Schema.org microdata format support. It's all there, you have everything in one neat package. Also you can upload your custom Header Logo to display it next to Site Title and Description. Tiny Forge can be used as a learning tool or your own little web development "framework". With its unique "Coding Tips system" Tiny Forge helps to understand how to extend parent themes and build your own child themes, hacking them the way you want it. You get the best coding examples from default WordPress themes and the best hacks from the child theme. Please read readme.txt for a quick start guide.
Template: tiny-forge
Version: 1.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: light, gray, white, one-column, two-columns, right-sidebar, flexible-width, custom-background, custom-header, custom-menu, editor-style, featured-image-header, featured-images, flexible-header, full-width-template, microformats, post-formats, rtl-language-support, sticky-post, theme-options, translation-ready
Text Domain: tinyforgechild

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
*/

/* Notes
--------------------------------------------------------------

Sizes in rem units:
 
 1px = 0.071428571rem
 2px = 0.142857143rem
 3px = 0.214285714rem
 4px = 0.285714286rem
 5px = 0.357142857rem
 6px = 0.428571429rem
 7px = 0.5rem
 8px = 0.571428571rem
 9px = 0.642857143rem
10px = 0.714285714rem
12px = 0.857142857rem
13px = 0.928571429rem
14px = 1rem
15px = 1.071428571rem
16px = 1.142857143rem
18px = 1.285714286rem
22px = 1.571428571rem
23px = 1.642857143rem
24px = 1.714285714rem
25px = 1.785714286rem
26px = 1.857142857rem
27px = 1.928571429rem
30px = 2.142857143rem
34px = 2.428571429rem
36px = 2.571428571rem
38px = 2.714285714rem
40px = 2.857142857rem
44px = 3.142857143rem
48px = 3.428571429rem
*/


/* Table of Contents:
 *
 *  1.0 - Reset
 *    1.1 - Clearing floats
 *  2.0 - Repeatable Patterns
 *    2.1 - Small headers
 *    2.2 - Shared Post Format styling
 *    2.3 - Form fields, general styles first
 *    2.4 - Reset non-text input types
 *    2.5 - Buttons
 *    2.6 - Responsive images
 *    2.7 - Images
 *    2.8 - Navigation
 *    2.9 - Author profiles
 *  3.0 - Site Structure
 *    3.1 - Body, links, basics
 *    3.2 - Assistive text
 *    3.3 - Page structure
 *    3.4 - Header
 *      3.4.1 - Site Header
 *      3.4.2 - Navigation
 *      3.4.3 - Banner
 *    3.5 - Sidebar
 *    3.6 - Footer
 *  4.0 - Main content and comment content
 *  5.0 - Archives
 *  6.0 - Single image attachment view
 *  7.0 - Post formats
 *    7.1 - Aside post format
 *    7.2 - Image posts
 *    7.3 - Link posts
 *    7.4 - Quote posts
 *    7.5 - Status posts
 *  8.0 - Comments
 *    8.1 - Comment form
 *    8.2 - Custom styles for Schema.org microdata format support implementation
 *  9.0 - Page templates
 *    9.1 - Front page template
 *    9.2 - Links (blogroll) template
 * 10.0 - Widgets
 * 11.0 - Plugins
 * 12.0 - Media queries
 *   12.1 - Minimum width of 600 pixels
 *   12.2 - Minimum width of 960 pixels
 *   12.3 - Minimum width of 1250 pixels
 *   12.4 - Retina-specific styles. This style cannot be processed by LESS
 * 13.0 - Print
 *   13.1 - Comments
 * 14.0 - Other styles
 *   14.1 - Tip23 - Properly resize videos, inserted with oembed
 *   14.2 - Elusive-icons webfont
 *   14.3 - Other styles
 * ----------------------------------------------------------------------------
 */

/* There must be no other CSS rules above the @import rule. @import adds +2 seconds of load time per CSS file, so I'm linking that file via functions.php instead.
@import url("../tinyforge/style.css");*/


/* 1.0 Reset
-------------------------------------------------------------- */



/* 1.1 Clearing floats */



/* 2.0 Repeatable patterns
-------------------------------------------------------------- */

/* 2.1 Small headers */


/* 2.2 Shared Post Format styling */


/* 2.3 Form fields, general styles first */


/* 2.4 Reset non-text input types */


/* 2.5 Buttons */


/* 2.6 Responsive images */


/* 2.7 Images */


/* 2.8 Navigation */


/* 2.9 Author profiles */


/* 2.10 Elusive-icons webfont */


/* Style social icons in the sidebar */


/* Remaining css for webfont icons is plugged-in via functions.php */



/* 3.0 Site structure
-------------------------------------------------------------- */

/* 3.1 Body, links, basics */


/* 3.2 Assistive text */


/* 3.3 Page structure */


/* 3.4 Header */

/* 3.4.1 Site Header */


/* 3.4.2 Navigation Menu */
/* Tip10 - Add Twenty Thirteen search form to WordPress nav menu - http://diythemes.com/thesis/rtfm/add-search-form-wp-wordpress-nav-menus/ */
.menu-item.menu-item-search {
	float: right;
	margin: 4px 0 0 0;
	margin: 0.285714286rem 0 0 0;
}
.site-header input[type="search"] {
	-webkit-appearance: textfield;
	padding-right: 2px; /* Don't cut off the webkit search cancel button */
	padding-right: 0.142857143rem; /* Don't cut off the webkit search cancel button */
	width: 270px;
	width: 19.285714286rem;
}
.site-header input[type="search"]::-webkit-search-decoration {
	-webkit-appearance: none;
}
.site-header .searchform [type="search"],
.site-header .searchform [type="text"] {
	background-color: transparent;
	background-image: url(images/icon-search.png);
	background-position: 5px center;
	background-repeat: no-repeat;
	background-size: 24px 24px;
	border: none;
	cursor: pointer;
	height: 28px;
	margin: 3px 0;
	margin: 0.214285714rem 0;
	padding: 0 0 0 34px;
	padding: 0 0 0 2.428571429rem;
	position: relative;
	-webkit-transition: width 400ms ease, background 400ms ease;
	transition:         width 400ms ease, background 400ms ease;
	width: 0;
}
.site-header .searchform [type="search"]:focus,
.site-header .searchform [type="text"]:focus {
	background-color: #f5f5f5;
	border: 1px solid #bbb;
	cursor: text;
	outline: 0;
	width: 230px;
	width: 16.428571429rem;
    -webkit-box-shadow: none;
       -moz-box-shadow: none;
            box-shadow: none;
}
.site-header .searchform [type="submit"] {
	display: none;
}

.site-title a {
    font-family: 'Norican', cursive;
}

/* 3.4.3 Banner */


/* 3.5 Sidebar */


/* 3.6 Footer */



/* 4.0 Main content and comment content
-------------------------------------------------------------- */

/* Tip30 - Uncomment next CSS block to hide entry meta section (with author, categories, tags) in the Index page and archive listing. */
/*
.home footer.entry-meta,
.archive footer.entry-meta {
	display: none;
}
*/


.entry-meta {
    line-height:1em;
    position:relative;
    top:-3px;
}

.meta-separator {
	color: #8DC919;
	font-size: 13px;
	font-size: 0.928571429rem;
}



/* 5.0 Archives
-------------------------------------------------------------- */




/* 6.0 Single image attachment view
-------------------------------------------------------------- */




/* 7.0 Post formats
-------------------------------------------------------------- */

/* 7.1 Aside post format */


/* 7.2 Image posts */


/* 7.3 Link posts */


/* 7.4 Quote posts */


/* 7.5 Status posts */



/* 8.0 Comments
-------------------------------------------------------------- */



/* 8.1 Comment form */


/* 8.2 Custom styles for Schema.org microdata format support implementation */



/* 9.0 Page templates
-------------------------------------------------------------- */

/* 9.1 Front page template */


/* 9.2 Links (blogroll) template */



/* 10.0 Widgets
-------------------------------------------------------------- */




/* 11.0 Plugins
----------------------------------------------- */


/* 14.0 Other styles
-------------------------------------------------------------- */

/* 14.1 Tip23 - Properly resize videos, inserted with oembed. Goes together with tinyforge_css_oembed_filter function in functions.php */


/* 14.2 Elusive-icons webfont */


/* 14.3 Other styles */
.menu-item-type-custom a {
    color:darkred!important;
}

#site-info { display: none; }

.nav-previous a:link,
.nav-previous a:visited,
.nav-next a:link,
.nav-next a:visited {
	color: #333;
	text-decoration: none;
	font-weight: bold;
}

body {
    background-color: #ccc7b9;
}
.site-content {
    float: left;
    width: 100%!important;
}

div.entry-content p a {
    margin-right:auto;
    margin-left:auto;
}

/* 14.4 Front page */
.tile-byline {
    background: none repeat scroll 0 0 rgba(118, 118, 118, 0.5);
    bottom: 20px;
    height: 53px;
    left: 0;
    padding: 3px;
    margin-top:250px;
    position: relative;
    right: 0;
}

.title {
    color: white;
    font-size: 15.5px;
    font-weight: 600;
    height: 2.2em;
    line-height: 1.1em;
    overflow: hidden;
    padding: 0px 5px 5px;
    position:relative;
}

.tile-byline .title span a {
    color: white;
    text-decoration: none;
}

.title span {
    position:absolute;
    bottom:9px;
}

.extra {
    bottom: 6px;
    color: #EEEEEE;
    font-size: 10px;
    font-weight: 600;
    height: 1.2em;
    overflow: hidden;
    padding: 5px;
    position: absolute;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 90%;
}

.tile-bg {
    width:100%;
    height:100%;
    overflow-x: hidden;
    overflow-y: hidden;
    background-size: cover;
    background-position: center center;
    background-repeat:no-repeat;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    cursor:pointer;
    
}

.tile-bg:hover {
    opacity: 0.7;
    filter: alpha(opacity=70);
}

.tiled-content article {
    float:left;
    padding-bottom:0px!important;
    width:33.333%;
    height:auto;
}

/*  NB: Overridden in Media Queries below
    Makes the image in the center have a left and right margin, so that we can 
    fit all three images neatly on one row. */
.tiled-content article:nth-child(3n+2) {
    margin-bottom:0px
}

article div.preview {
    width:100%;
    height:100%;
}

div.preview {
    padding:0 10px 0 10px;
}

/* ------------------------------------------- */ 
/* For the popup image preview */
#preview{
	position:absolute;
        box-shadow: 0 1px 2px rgba(34, 25, 25, 0.4);
	border:1px solid rgba(34, 25, 25, 0.4); 
	padding:13px 15px 0 15px;
	display:none;
        z-index:3000;
        background-color:white;
}
.previewTitle {
    font-size:0.8em;
}

.preview img {
	max-width:100%;
	height:133px;
        z-index:3000;
}

/* 14.5 Headers and Titles */
.archive-title,
.search-results .page-title {
	color: #333;
}

/* Hide the comment form's URL input field.' */
.comment-form-url {
    display:none;
}


/* 14.5 Archive Page Style */

.archive_month {
     float:left;
     background-color:#CCC7B9;
     -moz-border-radius: 5px;
     -webkit-border-radius: 5px;
     border-radius: 5px;
     cursor:pointer;
     width:80px;
     height:80px;
     margin:8px;
     text-align:center;
     line-height:2.3em;

 }
 .archive_month:hover {
     opacity: 0.7;
     filter: alpha(opacity=70);
 }

 .archive_year {
     cursor:default;
     background-color: rgb(130,225,211);        
 }

 .archive_year:hover {
     opacity: 1;
     filter: alpha(opacity=100);
 }


 a:link .archive_month div {
     outline: none;
     color: #333;
     text-decoration:underline;
 }

 .archive_month div {
     margin-top:5px;
     font-size:0.95em;
     font-weight:bolder;        
 }
 .archive_month span {
     color:#333;        
     font-size:1.8em;
     font-weight:550;
     font-weight:100;
     position:relative;
 }

img.header-image, .site-header img.wp-post-image {
    margin-top: 1.01429rem;
}

.site-header h1 {
    font-family: 'Open Sans';
    font-size: 26px;
    xfont-size:2.2rem;
}

#welcome-strap {
   xheight:50px;
   margin-top:1rem;
   width:100%;   
}

.main-navigation {
    margin-top: 1.4rem;
}

.main-navigation li {
    margin: 0 1.85714rem 0 0;
}
 
/* 12.0 Media queries
-------------------------------------------------------------- */


/* http://stephen.io/mediaqueries/ */
/* iPads (portrait and landscape) ----------- */




/* 12.4 Retina-specific styles. This style cannot be processed by LESS */
@media print,
	(-o-min-device-pixel-ratio: 5/4),
	(-webkit-min-device-pixel-ratio: 1.25),
	(min-resolution: 120dpi) {
	
	/* Tip10 - Add Twenty Thirteen search form to WordPress nav menu - http://diythemes.com/thesis/rtfm/add-search-form-wp-wordpress-nav-menus/ */
	.site-header .searchform [type="search"],
	.site-header .searchform [type="text"] {
		background-image: url(images/icon-search-2x.png);
	}
}


/* 13.0 Print
----------------------------------------------- */
@media print {
/* Here you can add specific styles for the printing */
}

/* 13.1 Comments */





.btn-close {
 background-color: hsl(0, 58%, 41%) !important;
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#cc4141", endColorstr="#a52b2b");
  background-image: -khtml-gradient(linear, left top, left bottom, from(#cc4141), to(#a52b2b));
  background-image: -moz-linear-gradient(top, #cc4141, #a52b2b);
  background-image: -ms-linear-gradient(top, #cc4141, #a52b2b);
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #cc4141), color-stop(100%, #a52b2b));
  background-image: -webkit-linear-gradient(top, #cc4141, #a52b2b);
  background-image: -o-linear-gradient(top, #cc4141, #a52b2b);
  background-image: linear-gradient(#cc4141, #a52b2b);
  border-color: #a52b2b #a52b2b hsl(0, 58%, 38%);
  color: #fff !important;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.19);
  -webkit-font-smoothing: antialiased;
}

.btn-go {
background-color: hsl(110, 52%, 41%) !important;
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#5dc548", endColorstr="#449e32");
  background-image: -khtml-gradient(linear, left top, left bottom, from(#5dc548), to(#449e32));
  background-image: -moz-linear-gradient(top, #5dc548, #449e32);
  background-image: -ms-linear-gradient(top, #5dc548, #449e32);
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #5dc548), color-stop(100%, #449e32));
  background-image: -webkit-linear-gradient(top, #5dc548, #449e32);
  background-image: -o-linear-gradient(top, #5dc548, #449e32);
  background-image: linear-gradient(#5dc548, #449e32);
  border-color: #449e32 #449e32 hsl(110, 52%, 38%);
  color: #fff !important;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.19);
  -webkit-font-smoothing: antialiased;
}
.btn-nav {
  background-color: hsl(195, 79%, 44%) !important;
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#23b4e5", endColorstr="#179cc8");
  background-image: -khtml-gradient(linear, left top, left bottom, from(#23b4e5), to(#179cc8));
  background-image: -moz-linear-gradient(top, #23b4e5, #179cc8);
  background-image: -ms-linear-gradient(top, #23b4e5, #179cc8);
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #23b4e5), color-stop(100%, #179cc8));
  background-image: -webkit-linear-gradient(top, #23b4e5, #179cc8);
  background-image: -o-linear-gradient(top, #23b4e5, #179cc8);
  background-image: linear-gradient(#23b4e5, #179cc8);
  border-color: #179cc8 #179cc8 hsl(195, 79%, 42%);
  color: #fff !important;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.13);
  -webkit-font-smoothing: antialiased;
}


ins {
	background: transparent;
	text-decoration: none;
}

img.aligncenter, .wp-caption.aligncenter {
    margin-bottom:0em;
    padding: 0px;
}



.al2fb_like_button {
    xmargin-left:4px;
    height:20px;
}

.nav_center {
    display:inline-block;
    margin:0;
    line-height:20px;
    text-indent:0;
    
}

.nav_center div {
    margin: 0 auto;
}

figure {
    margin-bottom:10px;
}

.meta-nav {
    font-size:1.4em;
}


footer[role="contentinfo"] {
	border-top: 1px solid #ededed;
	clear: both;
	font-size: 12px;
	font-size: 0.857142857rem;
	line-height: 2;
	
	max-width: 5000px;
	margin-top: 5px;
	margin-top: 0.357142857rem;
        margin-bottom:36px;
	margin-left: 0px;
	margin-right: 0px;
	padding: 12px;
	padding: 0.857142857rem;
}

.entry-header {
    width:100%;
    margin-bottom:0px;
    padding-left:5px;
}

.content-fblike {
    xfloat:right;
    height:20px;
    position:relative;
    margin:0 4px 5px 5px;
    top:4px;
}

.entry-title {
    margin-top:20px;
}

article.page{
    max-width:1000px;
}

.size-medium {
    width:100%;
}

.entry-post {
    width: 200px;
    margin-bottom:20px;
    line-height:1.3em;
    float: left;
}

.innercontainer {
    min-height:315px;
}
.post-masonry .entry-post .entry-title a:hover {
    color: #00b7c2;
    text-decoration: none;
}
.post-masonry .entry-post .entry-title a {
    color: gray;
    text-decoration: none;
    text-transform: uppercase;
    font-family: "Fjalla One", sans-serif;
    -webkit-font-smoothing: antialiased;
}

.post-masonry .entry-post .entry-content {
  font-size: 0.9em;
  line-height:1.2em;
  margin-top:10px;
}

.post-masonry .entry-post .entry-top a{
	display:block;
	background:#000;
	border-radius:5px 5px 0px 0px;
	-webkit-border-radius:5px 5px 0px 0px;
	-moz-border-radius:5px 5px 0px 0px;
}
.post-masonry .entry-post .entry-top img{
	border-radius:5px 5px 0px 0px;
	-webkit-border-radius:5px 5px 0px 0px;
	-moz-border-radius:5px 5px 0px 0px;
}

.post-masonry .entry-top a:hover img{
	opacity:0.4;
}

.post-masonry .entry-top img{
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

.post-masonry .entry-post .innercontainer {
    padding: 10px 10px 0;
    overflow: hidden;
    border: 1px solid #cecece;
    border-top: none;
    padding-bottom:10px;
    background-color:white;
}

.post-masonry .entry-post .innercontainer {
    -webkit-border-radius: 5px 5px 0 0;
    -moz-border-radius: 5px 5px 0 0;
    -ms-border-radius: 5px 5px 0 0;
    border-radius: 5px 5px 0 0;
}

#page {
  background-color:#F5F4F1;
  -webkit-border-radius: 8px 8px 0 0;
  -moz-border-radius: 8px 8px 0 0;
  -ms-border-radius: 8px 8px 0 0;
  border-radius: 8px 8px 0 0;  
  background: #F5F4F1;    
}

.archive .site-content article,
.category .site-content article,
.single .site-content article,
.blog .site-content article,
.search-results .site-content article {
  padding:10px;
  -webkit-border-radius: 8px 8px 0 0;
  -moz-border-radius: 8px 8px 0 0;
  -ms-border-radius: 8px 8px 0 0;
  border-radius: 8px 8px 0 0;  
  background: #F5F4F1;
  /* Old browsers */

  /* IE10 Consumer Preview */
  background-image: -ms-radial-gradient(center bottom, circle closest-corner, #fbfbfb 0%, #ffffff 100%);
  /* Mozilla Firefox */
  background-image: -moz-radial-gradient(center bottom, circle closest-corner, #fbfbfb 0%, #ffffff 100%);
  /* Opera */
  background-image: -o-radial-gradient(center bottom, circle closest-corner, #fbfbfb 0%, #ffffff 100%);
  /* Webkit (Safari/Chrome 10) */
  background-image: -webkit-gradient(radial, center bottom, 0, center bottom, 487, color-stop(0, #fbfbfb), color-stop(1, #ffffff));
  /* Webkit (Chrome 11+) */
  background-image: -webkit-radial-gradient(center bottom, circle closest-corner, #fbfbfb 0%, #ffffff 100%);
  /* W3C Markup, IE10 Release Preview */
  background-image: radial-gradient(circle closest-corner at center bottom, #fbfbfb 0%, #ffffff 100%);
}

div#content {
    margin: 10px auto;
}


@media screen and (max-width: 2000px) {
    .innercontainer {min-height:315px;}
    .site-title a {font-size: 38px}
    .entry-post { width: 400px; }
    .site { width:90%; margin: 0 auto; max-width: 90%;}
    .xsite-title:after {content:"2000"}
}

@media screen and (max-width: 1500px) {
    .innercontainer {min-height:300px;}
    .entry-post { width: 350px; }
    .site { width:90%; margin: 0 auto; max-width: 90%;}
    .xsite-title:after {content:"1500"}
}

@media screen and (max-width: 1100px) {
    .innercontainer {min-height:250px;}
    .site-title a {font-size: 32px}
    .entry-post { width: 300px; }
    .btn-nav { width:6em; }
    .site { width:90%; margin: 0 auto; max-width: 90%;}
    .xsite-title:after {content:"1100"}
}

@media screen and (max-width: 1000px) {
    .site-title a {font-size: 30px}
    .entry-post { width: 300px; }
    .btn-nav { width:6em; } 
    .site { width:90%; margin: 0 auto; max-width: 90%;}
    .xsite-title:after {content:"1000"}

}

@media screen and (max-width: 880px) {
    .site-title a {font-size: 28px}
    .entry-post { width: 300px; }
    .tiled-content article { float:left; margin:0px 10px 20px 10px!important; width:210px; height:205px;}
    .btn-nav { width:6em; } 
    .site { width:90%; margin: 0 auto; max-width: 90%;}
    .xsite-title:after {content:"880"}    
}

@media screen and (max-width: 780px) {
    .site-title a {font-size: 26px; margin-bottom:10px;}
    .main-navigation li { margin:4px}
    .entry-post { width: 325px; }
    .btn-nav { width:6em; }
    .site { width:90%; margin: 0 auto; max-width: 90%;}
    .xsite-title:after {content:"780"}    
}

@media screen and (max-width: 750px) {
    .entry-post { width: 100%; }
    .title {font-size:13px; height:2.5em; }
    .btn-nav { width:6em; } 
    .site { width:90%; margin: 0 auto; max-width: 90%;}
    .xsite-title:after {content:"750"}    
}

@media screen and (max-width: 580px) {
    .site-title a {font-size: 22px; margin-bottom:10px;}
    .menu-toggle { display:block;}
    .entry-post { width: 100%; }
    .site-header h1 { font-weight: normal; font-size: 20px; font-size: 1.4rem; line-height: 1.446153846; margin-bottom: 0; }
    .btn-nav { width:6em; }
    .site { width:80%; margin: 0 auto; max-width: 80%;}
    .xsite-title:after {content:"580"}    
}

@media screen and (max-width: 480px) {
    .entry-post { width: 100%; }
    .site-header h1 { font-weight: normal; font-size: 20px; font-size: 1.4rem; line-height: 1.446153846; margin-bottom: 0; }
    .btn-nav { width:6em; }
    .site { width:80%; margin: 0 auto; max-width: 80%;}
    .xsite-title:after {content:"480"}

}

@media screen and (max-width: 400px) {
    .entry-post { width: 100%; }
    .site-header h1 { font-weight: normal; font-size: 20px; font-size: 1.4rem; line-height: 1.446153846; margin-bottom: 0; }
    .btn-nav { width:6em; }
    .site { width:80%; margin: 0 auto; max-width: 80%;}
    .xsite-title:after {content:"400"}
}

@media screen and (max-width: 370px) {
    .entry-post { width: 100%; }
    .site-header h1 { font-weight: normal; font-size: 20px; font-size: 1.4rem; line-height: 1.446153846; margin-bottom: 0; }
    .btn-nav { width:6em; }
    .site { width:80%; margin: 0 auto; max-width: 80%;}
    .xsite-title:after {content:"370"}
}

.insta-image {
 width:100%;
 height:100%;
}