/*
Theme Name: Natalia Light
Theme URI: http://underscores.me/
Author: Underscores.me
Author URI: http://underscores.me/
Description: Description
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: natalia-light
Tags:

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.

Natalia Light is based on Underscores http://underscores.me/, (C) 2012-2016 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal http://necolas.github.com/normalize.css/
*/

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Normalize
# Typography
# Elements
# Forms
# Navigation
	## Links
	## Menus
# Accessibility
# Alignments
# Clearings
# Widgets
# Content
	## Posts and pages
	## Comments
# Infinite scroll
# Media
	## Captions
	## Galleries
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Normalize
--------------------------------------------------------------*/

/* === GLOBAL === */

html {
	overflow-x: hidden;
}

body{
	font-family: 'Lora', serif;
    color: #333;
    font-size: 15px;
	line-height: 1.6;
	letter-spacing:0.05em;
    word-break: break-word;
	-webkit-font-smoothing: antialiased;
	
}
a {
	color: #333;
	-o-transition: color  0.2s ease-in;
	-webkit-transition: color  0.2s ease-in;
	-moz-transition: color  0.2s ease-in;
	transition: color  0.2s ease-in;
}
a:hover {
    text-decoration:none;
    color: #B30A00;
}
a:focus {
    outline: none;
    outline-offset: 0;
    text-decoration:none;
    color: inherit;
}

img {
	max-width: 100%;
	height: auto;
}
iframe {
	max-width: 100%;
	border: none;
}
p {
	margin-bottom: 1.5em;
	line-height: 1.5em;
}
h1{
	font-size:2.2em;
	letter-spacing:0.08em;
	font-weight:600;
}
h2 {
	font-size:2em;
}
h3 {
	font-size:1.8em;
	font-weight:500;
}
h4 {
	font-size:1.7em;
	font-weight:500;
}
h5 {
	font-size:1.6em;
	font-weight:500;
}
h3.page-title{
	color:#B30A00;
}

.screen-reader-text{
	display:none;
}

/* ==== LAYOUT ==== */
.site-content {
    padding:50px 0 0 30px;
}
.navbar-wrapper{
	margin:10px;
}
.col-md-3, .col-sm-4{
	padding-top:30px;
}

.col-md-9, .col-sm-8{
	padding-left:45px;
}

/* ==== Header styles ==== */
/*=== BRANDING === */

.logo{
	position:relative;
	margin:auto;
}
.logo img{
	position:absolute;
	left:60px;
	width:140px;
	height:140px;
	opacity:1;
	-webkit-transition: opacity .6s ease-in-out;
	-moz-transition: opacity .6s ease-in-out;
	-o-transition: opacity .6s ease-in-out;
	transition: opacity .6s ease-in-out;
}
.logo img.top-logo:hover{
	opacity:0;
}
.logo-text{
	margin-top:140px;
	border-bottom:1px dotted #ddd;
	padding:10px;
	text-align:center;
}
.logo-text p{
	font-family: 'Podkova', serif;
	font-size:1.8em;
	font-weight:700;
	line-height:0.8em;
	margin:0;
}
.logo-text span{
	font-size:0.6em;
	font-weight:400;
	text-align:center;
}
.space{
	min-height:1px;
}


/* === Main NAVIGATION ===*/

.navbar-default {
    background-color: #fff;
    border-color: #fff;
	margin-top:30px;
}
.main-nav .nav li {
	width:100%;
}
.main-nav .nav li:hover {
	background:#ededed;
}
.main-nav .nav li a{
	font-family: 'Podkova', serif;
	line-height:1.3em;
	font-size:1.1em;
	color:inherit;
	transition:all .3s ease;
	padding:10px;
	font-weight:500;
}
.main-nav .nav li a:hover{
	color:#B30A00;
}
.main-nav .nav li.search-form:hover{
	background:#fff;
}

.social-nav{
	text-align:center;
}
.current-menu-item{
	background:#ededed;
	color:#B30A00;
}

/* ==== Content ==== */
.post-meta{
	color: #666;
    font-size: 12px;
	padding-bottom:20px;
}
.post-meta span{
	padding-right:10px;
}
h1.entry-title{
	font-weight:550;
	margin-top:25px;
}
.more-link{
	color:#4f5b66;
	margin-top:20px;
	background:transparent;
	height: 38px;
    padding: 0 22px;
    line-height: 38px;
    display: inline-block;
    border-radius: 30px;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    border: 1px solid #B30A00;
    color: inherit;
    -o-transition: all 0.1s ease-in;
    -webkit-transition: all 0.1s ease-in;
    -moz-transition: all 0.1s ease-in;
    transition: all 0.1s ease-in;
}
.more-link:hover{
	background:#B30A00;
	color:#fff;
}
.post-media{
	max-height:350px;
	overflow:hidden;
	width:100%;
	border-radius:10px;
}
article.post{
	margin-bottom: 30px;
	padding-bottom: 40px;
	border-bottom: 1px dotted #ddd;
}
.pagination{
	margin-top:60px;
	padding-left:10px;
	margin-bottom:90px;
}
.pagination a, .pagination .current{
	width: 36px;
    height: 36px;
    line-height: 36px;
    border: 1px solid #ddd;
    border-radius: 50%;
    text-align: center;
    display: inline-block;
    color: #333;
	 -o-transition: all 0.1s ease-in;
    -webkit-transition: all 0.1s ease-in;
    -moz-transition: all 0.1s ease-in;
    transition: all 0.1s ease-in;
}
.pagination .current{
	border: 1px solid #B30A00;
}

.pagination a:hover{
	cursor:pointer;
    	border: 1px solid #B30A00;
}
.social-links button.share{
	border:0;
	padding:8px 18px;
}
.social-links button.share a{
	color:#fff;
}
.social-links button.share i{
	padding-right:6px;
}
.social-links button.share-fb{
	background:#3b5998;
}
.social-links button.share-google{
	background:#dd4b39;
}
.social-links button.share-twitter{
	background:#55acee;
}

/* ==== SEARCH BAR ==== */

.search{
	width:100%;
	margin-top:30px;
	margin-bottom:30px;
	padding-left:5px;
}
#search-form input[type="search"]{
	width:80%;
	font-size:0.9em;
	padding:6px;
	border:1px dotted #ddd;
	border-radius:3px;
}


/* Comments
--------------------------------------------- */
#comments, #leave-comment{
	background:#fff;
	padding:30px;
	margin-bottom:20px;
}
#comments h4{
	color:#3e3e3e;
	border-bottom: solid 1px #f2f2f2;
	padding:10px;
}
#comments ul li{
	list-style:none;
}
.comment{
	padding-top:15px;
	padding-bottom:15px;
}
.comment-author{
	position:relative;
    float: left;
    width: 60px;
    height: 60px;
    overflow: hidden;
    margin-right: 20px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    border-radius: 50%;
}
.comment-author img.avatar{
    max-width: 100%;
    height: auto;
    display: block;
    margin-left: auto;
    margin-right: auto;
    border-radius: 50%;
    border: 1px solid #95a5a6;
    padding: 2px;
}
.comment-body{
	border-bottom: solid 1px #ddd;
	padding-bottom:20px;
	position:relative;
}
#commentform textarea, #commentform input{
	width:100%;
	margin-bottom:20px;
	padding:10px;
	border:1px solid #ddd;
}
.btn.submit, input#submit{
	background:#f47500;
	color:#fff;
}
.btn.submit:hover, input#submit:hover{
	background:#ddd;
	color:#B30A00;
}
.comment-reply{
	position: absolute;
    display: inline-block;
    font-size: 0;
    bottom: 20px;
    right: 0;
}
.comment-reply a, .comment-meta{
	display: inline-block;
    font-family: 'Oswald', "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 11px !important;
    color: #848484;
    padding: 5px;
    letter-spacing: 0.03em;
}
.comment-body .author-name{
	font-weight:600;
}
.comment-form-author{
	width:49%;
	float:left;
}
.comment-form-email{
	width:49%;
	float:right;
}
.comment-notes{
	font-size:0.8em;
	color:#484848;
}
#btn-submit{
	margin-left:16px;
	padding:10px 40px;
}

/* ==== FOOTER==== */
 .site-footer {
    border-top: 2px solid #efefef;
    margin: 0 auto;
}
.footer-widgets {
	margin:0 auto;
}
h3.widget-title{
	font-size:1.4em;
	border-bottom:1px solid #ddd;
}
 
.footer-widgets .widget{
	padding:10px;
}
.widget-container{
	background:inherit;
}
.footer-copyright{
	border-top: 1px dotted #ddd;
	font-size:0.8em;
	font-weight:400;
}

.gallery .gallery-item {
    display: inline-block;
    margin: 0;
}

/* === WP Calendar widget === */
#wp-calendar {width: 97%; margin: 15px;}
#wp-calendar caption { text-align: right; color: #333; font-size: 12px; margin: 10px; }
#wp-calendar thead { font-size: 10px; }
#wp-calendar thead th { padding-bottom: 10px; }
#wp-calendar tbody { color: #aaa; font-size:10px; }
#wp-calendar tbody td { background: #f5f5f5; border: 1px solid #fff; text-align: center; padding:8px;}
#wp-calendar tbody td:hover { background: #fff; }
#wp-calendar tbody .pad { background: none; }
#wp-calendar tfoot #next { font-size: 10px; text-transform: uppercase; text-align: right; }
#wp-calendar tfoot #prev { font-size: 10px; text-transform: uppercase; padding-top: 10px; }
#wp-calendar a{ color:#B30A00; font-weight:600;}





/* === MEDIA QUERIES ===*/

 /* Large Devices, Wide Screens */
    @media only screen and (max-width : 1200px) {
		.main-nav .nav li a{
		line-height:1.3em;
		font-size:1em;
		}
		.logo img{
		position:absolute;
		left:45px;
		}
		.search button{
		right:-115px;
		}
		.container{
			margin:0;
			padding:0;
		}
		.navbar-default .navbar-collapse{
			border:0;
		}
    }
	

    /* Medium Devices, Desktops */
    @media only screen and (max-width : 992px) {
		.container{
			margin:0;
			padding:0;
		}
		.search button{
			position:relative;
			right:-122px;
			top:-41px;
			}
    }

    /* Small Devices, Tablets */
    @media only screen and (max-width : 768px) {
		.site-content {
			padding:0 10px 0 0;
		}
		.logo-text{
			margin-top:15px;
			border:none;
		}
		
		.social-nav{
			border-bottom:1px dotted #ddd;
			margin-top:-7px;
			
		}
		.navbar-toggle{
			margin-top:-110px;
			margin-right:30px;
		}
		
		.logo-text p{
			font-family: 'Podkova', serif;
			font-size:1.4em;
		}
		.logo img{
			left:20px;
			width:100px;
			height:100px;
		}
		.search{
			position:relative;
			right:5px;
			top:1px;
			}
    }

    /* Extra Small Devices, Phones */ 
    @media only screen and (max-width : 480px) {
		.logo-text{
			margin-top:110px;
		}
		.social-nav{
			border-bottom:1px dotted #ddd;
			margin-top:-10px;
		}
		.logo img{
			left:140px;
			width:100px;
			height:100px;
		}
		.navbar-toggle{
			margin-top:-10px;
			margin-right:10px;
		}
		.search button{
			position:relative;
			left:232px;
			top:-41px;
			}
		h1.entry-title{
			font-weight:500;
			margin-top:25px;
			font-size:2em;
		}
    }

    /* Custom, iPhone Retina */ 
    @media only screen and (max-width : 320px) {
        .logo img{
			left:100px;
			width:100px;
			height:100px;
		}
    }