/*
Theme Name: ourglobaltrek
Theme URI: http://underscores.me/
Author: Carlos
Author URI: http://underscores.me/
Description: Hi, we are Julie and Carlos, a couple travelling the world. Our Global Trek is where we share all our stories and photos from our journey.
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: ourglobaltrek
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.

ourglobaltrek 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.io/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
--------------------------------------------------------------*/

body {
	margin: 0;
}

article,
aside,
details,
figcaption,
figure,
footer,
main,
section,
summary {
	display: block;
}


audio,
canvas,
progress,
video {
	display: inline-block;
	vertical-align: baseline;
opacity:0.7;
     -webkit-filter: saturate(1.4);
    filter: saturate(1.4);
}

audio:not([controls]) {
	display: none;
	height: 0;
}

[hidden],
template {
	display: none;
}

a {
	background-color: transparent;
}

.entry-footer{
    width:60%;
    margin:auto;
}

.entry-footer a{
    color:white;
    padding:8px;
    background-color:#c4272d;
    border-radius:3px;
    text-decoration:none;
}

.entry-footer a:hover{
    text-decoration:underline;
}

a:focus,
a:hover {
	outline: 0;
}

abbr[title] {
	border-bottom: 1px dotted;
}

b,
strong {
	font-weight: bold;
}

dfn {
	font-style: italic;
}

h1 {
	font-size: 2em;
	margin: 0.67em 0;
}

mark {
	background: #ff0;
	color: #000;
}

small {
	font-size: 80%;
}

sub,
sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}

sup {
	top: -0.5em;
}

sub {
	bottom: -0.25em;
}

img {
	border: 0;
}

svg:not(:root) {
	overflow: hidden;
}

figure {
	margin: 1em 40px;
}

hr {
	box-sizing: content-box;
	height: 0;
}

pre {
	overflow: auto;
}

code,
kbd,
pre,
button,

optgroup,
select,
textarea {
	color: inherit;
	font: inherit;
	margin: 0;
}

button {
	overflow: visible;
}

button,
select {
	text-transform: none;
}

button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
	-webkit-appearance: button;
	cursor: pointer;
}

button[disabled],
html input[disabled] {
	cursor: default;
}

button::-moz-focus-inner{
	border: 0;
	padding: 0;
}


input[type="checkbox"],
input[type="radio"] {
	box-sizing: border-box;
	padding: 0;
}

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
	height: auto;
}


fieldset {
	border: 1px solid #c0c0c0;
	margin: 0 2px;
	padding: 0.35em 0.625em 0.75em;
}

legend {
	border: 0;
	padding: 0;
}

textarea {
	overflow: auto;
}

optgroup {
	font-weight: bold;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

td,
th {
	padding: 0;
}

/*--------------------------------------------------------------
# Typography
--------------------------------------------------------------*/
body,
button,
select,

h1,
h2,
h3,
h4,
h5,
h6 {
	clear: both;
}

p {
	margin-bottom: 1.5em;
}

blockquote {
	margin: 0 1.5em;
}

address {
	margin: 0 0 1.5em;
}


code,
kbd,
tt,


abbr,
acronym {
	border-bottom: 1px dotted #666;
	cursor: help;
}

mark,
ins {
	background: #fff9c0;
	text-decoration: none;
}

big {
	font-size: 125%;
}

/*--------------------------------------------------------------
# Elements
--------------------------------------------------------------*/
html {
	box-sizing: border-box;
}

*,
*:before,
*:after { /* Inherit box-sizing to make it easier to change the property for components that leverage other behavior; see http://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */
	box-sizing: inherit;
}

body {
	background: #fff; /* Fallback for when there is no custom background color defined. */
}

blockquote:before,
blockquote:after,
q:before,
q:after {
	content: "";
}

blockquote,
q {
	quotes: "" "";
}

hr {
	background-color: #ccc;
	border: 0;
	height: 1px;
	margin-bottom: 1.5em;
}

em{
    font-style:normal !important;
}
dt {
	font-weight: bold;
}

dd {
	margin: 0 1.5em 1.5em;
}

img {
	height: auto; /* Make sure images are scaled correctly. */
	max-width: 100%; /* Adhere to container width. */
}

figure {
	margin: 1em 0; /* Extra wide images within figure tags don't overflow the content area. */
}

table {
	margin: 0 0 1.5em;
	width: 100%;
}

/*--------------------------------------------------------------
# Forms
--------------------------------------------------------------*/
button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
	border: 1px solid;
	border-color: #ccc #ccc #bbb;
	border-radius: 3px;
	background: #e6e6e6;
	color: rgba(0, 0, 0, .8);
	font-size: 12px;
	font-size: 0.75rem;
	line-height: 1;
	padding: .6em 1em .4em;
}

button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover {
	border-color: #ccc #bbb #aaa;
}

button:focus,
input[type="button"]:focus,
input[type="reset"]:focus,
input[type="submit"]:focus,
button:active,
input[type="button"]:active,
input[type="reset"]:active,
input[type="submit"]:active {
	border-color: #aaa #bbb #bbb;
}

input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],

input[type="number"],
input[type="tel"],
input[type="range"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="color"],
textarea {
	color: #666;
	border: 1px solid #ccc;
	border-radius: 3px;
	padding: 3px;
}

select {
	border: 1px solid #ccc;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="number"]:focus,
input[type="tel"]:focus,
input[type="range"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="week"]:focus,
input[type="time"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="color"]:focus,
textarea:focus {
	color: #111;
}

textarea {
	width: 100%;
}

/*--------------------------------------------------------------
# Navigation
--------------------------------------------------------------*/
/*--------------------------------------------------------------
## Links
--------------------------------------------------------------*/

/*--------------------------------------------------------------
## Menus
--------------------------------------------------------------*/

.main-navigation ul ul {
	box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
	float: left;
	position: absolute;
	top: 1.5em;
	left: -999em;
	z-index: 99999;
}

.main-navigation ul ul ul {
	left: -999em;
	top: 0;
}

.main-navigation ul ul a {
	width: 200px;
}

.main-navigation ul ul li {

}

.main-navigation ul ul :hover > a,
.main-navigation ul ul .focus > a {
}

.main-navigation ul ul a:hover,
.main-navigation ul ul a.focus {
}


.main-navigation .current_page_item > a,
.main-navigation .current-menu-item > a,
.main-navigation .current_page_ancestor > a,
.main-navigation .current-menu-ancestor > a {
}

/* Small menu. */
.menu-toggle,
.main-navigation.toggled ul {
	display: block;
}

@media screen and (min-width: 37.5em) {
	.menu-toggle {
		display: none;
	}
	.main-navigation ul {
		display: block;
	}
}

.site-main .comment-navigation,
.site-main .posts-navigation,
.site-main .post-navigation {
	margin: 0 0 1.5em;
	overflow: hidden;
}

.comment-navigation .nav-previous,
.posts-navigation .nav-previous,
.post-navigation .nav-previous {
	float: left;
	width: 50%;
}

.comment-navigation .nav-next,
.posts-navigation .nav-next,
.post-navigation .nav-next {
	float: right;
	text-align: right;
	width: 50%;
}

/*--------------------------------------------------------------
# Accessibility
--------------------------------------------------------------*/
/* Text meant only for screen readers. */
.screen-reader-text {
	clip: rect(1px, 1px, 1px, 1px);
	position: absolute !important;
	height: 1px;
	width: 1px;
	overflow: hidden;
	word-wrap: normal !important; /* Many screen reader and browser combinations announce broken words as they would appear visually. */
}

.screen-reader-text:focus {
	background-color: #f1f1f1;
	border-radius: 3px;
	box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	clip: auto !important;
	color: #21759b;
	display: block;
	font-size: 14px;
	font-size: 0.875rem;
	font-weight: bold;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000; /* Above WP toolbar. */
}

/* Do not show the outline on the skip link target. */
#content[tabindex="-1"]:focus {
	outline: 0;
}

/*--------------------------------------------------------------
# Alignments
--------------------------------------------------------------*/
.alignleft {
	display: inline;
	float: left;
	margin-right: 1.5em;
}

.alignright {
	display: inline;
	float: right;
	margin-left: 1.5em;
}

.aligncenter {
	clear: both;
	display: block;
	margin-left: auto;
	margin-right: auto;
}

/*--------------------------------------------------------------
# Clearings
--------------------------------------------------------------*/
.clear:before,
.clear:after,
.comment-content:before,
.comment-content:after,
.site-header:before,
.site-header:after,
.site-content:before,
.site-content:after,
.site-footer:before,
.site-footer:after {
	content: "";
	display: table;
	table-layout: fixed;
}

.clear:after,
.comment-content:after,
.site-header:after,
.site-content:after,
.site-footer:after {
	clear: both;
}

/*--------------------------------------------------------------
# Widgets
--------------------------------------------------------------*/
.widget {
	margin: 0 0 1.5em;
}

/* Make sure select elements fit in widgets. */
.widget select {
	max-width: 100%;
}

/*--------------------------------------------------------------
# Content
--------------------------------------------------------------*/
/*--------------------------------------------------------------
## Posts and pages
--------------------------------------------------------------*/
.sticky {
	display: block;
}

.byline,
.updated:not(.published) {
	display: none;
}

.single .byline,
.group-blog .byline {
	display: inline;
}

.page-links {
	clear: both;
	margin: 0 0 1.5em;
}

/*--------------------------------------------------------------
## Comments
--------------------------------------------------------------*/
.comment-content a {
	word-wrap: break-word;
}

.bypostauthor {
	display: block;
}

/*--------------------------------------------------------------
# Infinite scroll
--------------------------------------------------------------*/
/* Globally hidden elements when Infinite Scroll is supported and in use. */
.infinite-scroll .posts-navigation, /* Older / Newer Posts Navigation (always hidden) */
.infinite-scroll.neverending .site-footer { /* Theme Footer (when set to scrolling) */
	display: none;
}

/* When Infinite Scroll has reached its end we need to re-display elements that were hidden (via .neverending) before. */
.infinity-end.neverending .site-footer {
	display: block;
}

/*--------------------------------------------------------------
# Media
--------------------------------------------------------------*/
.page-content .wp-smiley,
.entry-content .wp-smiley,
.comment-content .wp-smiley {
	border: none;
	margin-bottom: 0;
	margin-top: 0;
	padding: 0;
}

/* Make sure embeds and iframes fit their containers. */
embed,
iframe,
object {
	max-width: 100%;
}

/*--------------------------------------------------------------
## Captions
--------------------------------------------------------------*/
.wp-caption {
	margin-bottom: 1.5em;
	max-width: 100%;
}

.wp-caption img[class*="wp-image-"] {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.wp-caption .wp-caption-text {
	margin: 0.8075em 0;
}

.wp-caption-text {
	text-align: center;
}

/*--------------------------------------------------------------
## Galleries
--------------------------------------------------------------*/

/*----------------------- STATIC TEMPLATE STYLING ----------------*/


@font-face {
    font-family: song-jennifer;
    src: url(song-jennifer.ttf);
}

body{
	font-family: 'Source Sans Pro', sans-serif;
    line-height: 1.5em;
    letter-spacing:0.5px;
	margin:0;
    color:#4d4d4d;
    font-weight:200;
    font-size:20px;
}

.wrapper{
	width:100%;
	max-width: 1180px;
	padding: 0 10px;
	margin: 0 auto;
}

/* ------- Header styling -------- */
@font-face {
    font-family: 'Diogenes';
    src:url('fonts/Diogenes.ttf.woff') format('woff'),
        url('fonts/Diogenes.ttf.svg#Diogenes') format('svg'),
        url('fonts/Diogenes.ttf.eot'),
        url('fonts/Diogenes.ttf.eot?#iefix') format('embedded-opentype'); 
    font-weight: normal;
    font-style: normal;
}

.menu{
display: inline-block;
}

.menu div{
display:inline-block;
}

.header-wrapper{
	background-color: rgba(1,1,1,0.7);
	position:absolute;
	width:100%;
	padding-top:15px;
	height:90px;
    overflow:hidden;
text-align:center;
}

.logo a{
     font-size:46px;
color:white;
    margin-top:0;
    padding-top:0;
    margin-left:60px;
    margin-right:60px;
    height:65px;	
	text-decoration:none;
    font-family: 'Diogenes';
}


header nav h2{
	text-indent: -100000px;
	height: 0;
	margin: 0;
}

header ul{
    margin:0 auto 0 auto;
    display: inline-block;
    top:0;
    height:100%;
    padding:0;
}


header nav li{
    display: inline-block;
    float: none;
    
}

header nav li a{
	background:none;
	text-decoration: none;
    text-align:center;
    font-weight:400;
	padding:20px 15px 20px 15px;
	color: #fff;
	margin:0 15px 0 15px;
	font-size: 22px;
	display:block;
    height:75px;
    font-family: 'Diogenes';
}


header nav .menu a:hover{border-bottom:5px solid white;}
header nav .logo a:hover{border-bottom:none;}
header nav li a:active{border-bottom:5px solid white;}

.search-bar{
    width:10%;
    position:absolute;
    right:190px;
    top:15px;
    height:35px;
}

input[type="search"] {
      -webkit-appearance: textfield;
    }

.search-bar input[type="search"]{
    position:absolute;
    top:0;
    right:0;
    height:35px;
    width:100%;
    padding:0;
    margin:0;
    background-color: rgba(255,255,255,0.3);
    border: none;
    border-radius:5px;
    color: rgba(255,255,255,0.9);
    padding-left: 10px;
    padding-right:10px;
    font-size:14px;
}

.search-bar input[type=submit]{
display:none;
}


.search-bar input:focus{
    background-color: rgba(255,255,255,0.4);
    outline-style: none;
    width:150%;
    transition:0.3s;
}
.search-bar ::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: rgba(255,255,255,0.7);
    font-size:14px;
}

.search-bar ::-moz-placeholder { /* Firefox 19+ */
  color: rgba(255,255,255,0.7);
    font-size:14px;
}

.language{
    position:absolute;
    right:5px;
    top:15px;
    padding:0;
    width:200px;
}

a.glink img{
    margin-right:5px;
}

.language li:hover{
    opacity:1;
}

.language li{
    margin:5px;
    opacity:0.8;
    width:35px;
    height:35px;
}

.language img{
    width:35px;
    height:35px;
}

.language a{
    padding:0;
    margin:0;
    width:35px;
    height:35px;
}


/* ---- slider area ---- */

.overlay{
background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAMAAAADCAYAAABWKLW/AAAAG0lEQVQYV2NkYGD4z8DAwAiiQQQIgAXAIjAZAFpNBQIc/TCiAAAAAElFTkSuQmCC);
	position: absolute;
		top: 65px;
		width: 100%;
		opacity: 0.3;
		bottom: 0;
		z-index: -1 !important;
}

#slider video{
   width:100%;
    height:100%;
    position: fixed;
    top:0;
    left:0;
    z-index:-2 !important;
    overflow:hidden;
object-fit:cover;
}

/* ---- social media bar ---- */
.social-media-bar-wrapper{
    width:440px;
    margin:auto;
    padding:0;
}
#social-media-bar ul{
    list-style-type: none;
    display:inline-block;
    width:100%;
    padding:0;
    margin:2% 0 10% 0;
}

#social-media-bar li{
    display:inline-block;
    font-size:16px;
    float:left;
    width:110px;
    padding:0;
    margin:0;
}

.twitter a{
    color: #34a2f5 !important;
}
.instagram a{
    color:#bd10e0 !important;
}

.pinterest a{
    color:#c41e1e !important;
}
.facebook a{
    color: rgb(60, 89, 154);
}
.icon{
    float:left;
    padding:0;
    margin:0;
}

.social-text{
    float:left;
    line-height:1em;
}

.follow{
    display:inline-block;
    margin:0% 2% 0% 15%;
    padding:0;
    line-height:1em;
    font-size:14px;
}

.counter{
    display:inline-block;
    width:100%;
    font-weight:400;
    line-height:1em;
    margin:0 2% 0 15%;
    padding:0;
}
/* ---- About us area ---- */
#about-us-bar {
    width:55%;
    margin-left:22.5%; 
    padding:0;
    display:inline-block;
    margin-bottom:3%;

}

#about-us-bar img{
    width:35%;
    float:left;
    height:200px;
    object-fit:cover;
}

#about-us-bar .about-us{
    width:62%; 
    float:right;
    margin:2% 0 0 3%;
    padding:0;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    overflow:hidden;
    -webkit-box-orient: vertical;
}

.form{
    display:inline-block;
    padding:0;
    margin-left:3%;
    margin-top:3%;
    width:62%;
}

input[class=name]{

    width:27%;
    background-color: rgba(0,0,0,0.3);
    border:none;
    border-radius:2px;
    height:35px;
    color: white;
    padding-left:3%;
    font-size:14px;
}

input[class=email]{
    margin-left:2%;
    width:37%;
    background-color: rgba(0,0,0,0.3);
    border:none;
    border-radius:2px;
    height:35px;
    padding-left:3%;
    color: white;
    font-size:14px;
}

.form input:focus{
    background-color: rgba(0,0,0,0.4);
    outline-style: none;
}
.form ::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: rgba(255,255,255,1);
    font-size:14px;
}

.form ::-moz-placeholder { /* Firefox 19+ */
  color: rgba(255,255,255,1);
    font-size:14px;
}

.form input[type=submit]{
    border:none;
    padding:0 3% 0 3%;
    background-color:#c4272d;
    font-size:16px;
    color: white;
    border-radius:3px;
    margin-left:2%;
    height:35px;
    font-weight:800;
    opacity:0.85;
}

.form input[type=submit]:hover{
    opacity:1;
    cursor:pointer;
}


/* ---- Destinations ----- */
.featured-destinations-wrapper{
    width:90%;
    margin-top:3%;
    margin-left:5%;
    padding:0;
}

#featured-destinations h2{
    text-align: center;
    font-size:40px;
    font-weight:900;
}

#featured-destinations ul{
    width:100%;
    margin:0;
    padding:0;
    display:inline-block;
}

#featured-destinations li{
    width:33%;
    margin:0;
    padding:1% 1% 0 1%;
    display:inline-block;
}

#featured-destinations li h3{
    list-style-type: none;
    text-align: center;
    margin:0;
    padding:0;
    color: #4d4d4d;
    text-decoration:none;
}

#featured-destinations li img{
    width:100%;
    height:200px;
    object-fit:cover;
}

#featured-destinations h5{
    text-align:center;
    font-size:26px;
    display:inline-block;
    margin:3%;
    color:#c4272d;
}

.explore-more{
    text-align:center;
    margin-bottom:1%;
}

#featured-destinations h5:hover{
    text-decoration:underline;
}

.featured-destination:hover{
    opacity:0.9;
}

.featured-destination:hover h3{
    text-decoration: underline !important;
}

#featured-destinations a{
    text-decoration:none;
}

/* ---- Latest treks ----- */

.posts-wrapper{
    width:90%;
    margin-left:5%;
}
#featured-posts h2{
    text-align:center;
    padding:30px;
    color:#4d4d4d;
    font-size: 40px;
    margin-bottom:20px;
    font-weight:700;
}

#featured-posts ul{
    width:100%;
    margin:0;
    padding:0;
}

#featured-posts li{
    width:100%;
    margin:0;
    max-height:300px;
    padding-bottom:1%;
    list-style:none;
    display:inline-block;
}

#featured-posts li:nth-child(odd) .post-content:before{
    content:'';
    width: 0; 
    height: 0; 
    border-top: 15px solid transparent;
    border-bottom: 15px solid transparent;   
    border-right: 20px solid #fff;
    position:absolute;
    margin-left:calc(-17px - 2%);
}

#featured-posts li:nth-child(even) .post-content h3:after{
    content:'';
    width: 0; 
    height: 0; 
    border-top: 15px solid transparent;
    border-bottom: 15px solid transparent;   
    border-left: 20px solid #fff;
    position:absolute;
    margin-left: 1.7%;
}

#featured-posts a{
    padding:0;
    margin:0;
}

#featured-posts li img{
    width:50%; 
    float:left;
    height:300px;
    max-height: 300px;
    object-fit: cover;
}

#featured-posts li:nth-child(even) img{
    float:right;
    margin-left:2%;
    padding:0;
}


#featured-posts li .post-content{
    width:48%;
    float:right;
    margin-top:4%;
    padding:0%;
    max-height:200px;
}

#featured-posts li:nth-child(even){
    text-align:right;
}


#featured-posts h3{
    text-decoration: none;
    margin:0;
    padding:0;
    display:inline-block;
    color:#4d4d4d;
    font-size:30px;
    width:100%;
}

#featured-posts a{
    text-decoration: none;
}

.featured-post{
    display:inline-block;
}

.featured-post:hover{
    opacity:0.9;
}

.featured-post:hover h3{
    text-decoration: underline !important;
}

#featured-posts p{
    text-decoration: none;
    color:black;
    margin:0;
    float:left;
    padding:3% 3% 0 0;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

#featured-posts li:nth-child(even) p {
    text-decoration: none;
    margin:0;
    float:left;
    text-align:right;
    padding:3% 0 0 0;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

#featured-posts li:nth-child(even) .author {
    text-decoration: none;
    text-align:right;
    padding:3% 0 0 3%;
    float:right;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

p.author{
    font-size:16px;
    font-style:italic;
}

#featured-posts h5{
    text-align:center;
    display:inline-block;
    font-size:26px;
    color:#c4272d;
    margin-top:2%;
}

#featured-posts h5:hover{
    text-decoration: underline;
}

/* ---- footer ---- */
.footer-wrapper{
    width:100%;
    height:80px;
    background-color: #4d4d4d;
    margin-top:5%;
    padding:0;
}

.footer-wrapper ul{
    margin:0;
    padding:0;
}

.footer-wrapper li{
    list-style-type: none;
    text-align:center;
    padding-top:30px;
    font-size:16px;
    font-weight:400;
    color:white;
}


/* ------ POST PAGE STYLING -------*/
#travel-blog-featured-image img{
    height:500px;
    width:100%;
    object-fit: cover;
    overflow: hidden;
	display:block;
}

.travel-blog-header-message{
    position:relative;
    text-align:center;
    margin-top:-250px;
    margin-bottom:140px;
    width:100%;
    display:block;
	font-family:'Diogenes';
	margin-bottom:200px;
}

.travel-blog-header-message h1{
    color: white;
    display:inline-block;
    width:100%;
    font-size:50px;
    text-shadow: 0px 1px 1px #4d4d4d;
}

.travel-blog-header-message p{
    color: white;
    display:inline-block;
    font-size:28px;
    margin:0;
    padding:0;
    font-weight:400;
    text-shadow: 1px 1px 1px rgba(0,0,0, 0.5);

}

/*--- posts area ---*/

.travel-blog-wrapper{
    width:90%;
    margin:auto;
    padding:0;
}
.travel-blog-wrapper ul{
    width:100%;
    margin:auto;
    padding:0;
    display:inline-block;
}

.travel-blog-wrapper li{
    width:23%;
    margin:0 1% 0 1%;
    padding-bottom:10%;
    float:left;
    list-style:none;
    display:inline-block;
    height:350px;
    overflow:hidden;
}

#travel-blog-posts .content{
    margin:0;
}

#travel-blog-posts li{
	list-style-type:none;
	margin-bottom:15px;
}


#travel-blog-posts li img{
    width:20%;
    margin-right:30px;
    padding:0;
    list-style:none;
    display:inline-block;
    object-fit:cover;
	vertical-align:middle;
}

#travel-blog-posts .weekendplan{
	-moz-column-count: 3;
    -moz-column-gap: 50px;
    -webkit-column-count: 3;
    -webkit-column-gap: 50px;
    column-count: 3;
    column-gap: 50px;
}
#travel-blog-posts .weekendplan img{
	width:70px;
	margin-top:20px;
}

#travel-blog-posts .activities{
	-moz-column-count:3;
    -moz-column-gap:50px;
    -webkit-column-count:3;
    -webkit-column-gap:50px;
    column-count:3;
    column-gap:50px;
}

.content h3{
    margin-top:0; 
    padding:0;
    width:100%; 
    display:inline-block;
    color: #4d4d4d;
}

.post:hover{
    opacity:0.9;
}

.post:hover h3{
    text-decoration: underline;
}

#travel-blog-posts iframe{
    width:100% !important;
    height:100% !important;
    min-height:350px;
    
}


#travel-blog-posts li .content:before{
    content:'';
    width: 0; 
    height: 0; 
    border-left: 10px solid transparent;
    border-bottom: 10px solid #fff;    
    border-right: 10px solid transparent;
    position:absolute;
    margin-left: 1.5%;
    margin-top:-17px;
}

.travel-blog-author{
    margin-top:-20px;
    padding:0;
    margin-bottom:0px;
    font-size:14px;
    font-style: italic;
}

.read-more{
    text-decoration:none;
    color: #c4272d;
    font-size:18px;
    font-weight:800;
    padding:0;
    margin:0;
}

.read-more:hover{
    text-decoration:underline;
}

/*--------- POSTS PAGE =---------- */
#post-page-featured-image img{
    height:700px;
    width:100%;
    object-fit: cover;
    overflow: hidden;
}

.post-page-header-message{
    position:absolute;
    top:250px;
    text-align:center;
    width:100%;
}
.post-page-header-message h1{
    color: white;
    display:inline-block;
    width:60%;
    font-size:70px;
    line-height:70px;
    text-shadow: 0px 1px 1px #4d4d4d;
}

.post-page-post-content{
    width:60%;
    margin:auto;
    line-height:1.8em;
    font-size:20px;
    margin-top:1.5%;
    letter-spacing:0.05em;
}



#travel-blog-posts .post-page-post-content ul{
    width:95%;
    margin-left:5%;
    padding:0;
}

.money-saving-tip{
    padding:25px 50px 25px 50px !important;
}

.money-saving-tip h3{
    font-weight:800 !important;
}

#travel-blog-posts .post-page-post-content li{
    width:100% !important;
    padding:0 !important;
    margin:0 !important;
    height:100% !important;
    margin-bottom:15px !important;
    list-style-type:none !important;
    overflow:visible !important;
    display:list-item;
}

#travel-blog-posts .post-page-post-content li p{
    margin:0;
    padding:0;
}
.post-page-post-content h2{
    margin-top:7%;
}

.post-page-post-content img{
    max-width:100%;
    display:block;
    max-height:650px;
    object-fit:cover;
    width:auto;
    margin:0 auto;
}

.post-page-post-content figcaption{
    text-align:center;
    font-size: 18px;
    margin-bottom:5%;
}

.post-page-post-content a{
    text-decoration:none;
    color:#c4272d;
    font-weight:400;
}

.post-page-post-content a:hover{
    text-decoration:underline;
}

.post-page-post-content span{
    font-weight:400;
    font-size:18px;
    display:inline-block;
    margin-bottom:20px;
}

/* --- related posts ---- */
.related-posts-wrapper{
    width:60%;
    padding:0;
    margin:2% auto 5% auto;
}

.related-posts-wrapper hr{
    padding:0;
    margin:0;
}

/*
.related-posts-wrapper h4{
    margin:0;
    font-size:28px;
    color:#c4272d;
    margin-bottom:20px;
    text-align:center;

}


.related-posts-wrapper ul{
    width:100%;
    margin:auto;
    padding:0;
    display:inline-block;
}

.related-posts-wrapper li{
    width:31%;
    margin:0 1% 0 1%;
    padding-bottom:0;
    float:left;
    list-style:none;
    display:inline-block;
    overflow:hidden;
}

.related-posts-wrapper li img{
    width:100%;
    margin:0;
    padding:0;
    list-style:none;
    display:inline-block;
}

.related-posts-wrapper li .content:before{
    content:'';
    width: 0; 
    height: 0; 
    border-left: 10px solid transparent;
    border-bottom: 10px solid #fff;    
    border-right: 10px solid transparent;
    position:absolute;
    margin-left: 1.5%;
    margin-top:-18px;
}
*/


/*---- comments -----*/

.posted-comments{
    width:60%;
    margin:auto;
    padding:0;
    margin-top:-1%;
}

.posted-comments h3{
    color:#c4272d;
    font-size:28px;
    margin-bottom:-10px;
}

.posted-comments ul:nth-child(2){
    padding:0;
    margin:0;
}

.posted-comments li{
    list-style-type: none;
    padding:0;
    margin:6% 0 0 0;
    width:100%;
}

.posted-comments span{
    list-style-type: none;
    font-size:22px;
    font-weight:800;
    display:inline-block;

}

.posted-comments .date{
    list-style-type: none;
    font-size:16px;
    font-weight:200;
    display:inline-block;

}

.posted-comments p{
    list-style-type: none;
    font-size:20px;
    font-weight:200;
    display:inline-block;
    padding:0;
    margin:10px 0 0 0;
}

.reply{
    float:right;
    font-size:18px;
    color: #c4272d;
    display:inline-block;
    font-weight:400;
}

.reply:hover{
    text-decoration: underline;
}

/*------ comment form -----*/
.comments-form{
    width:60%;
    margin:auto;
    margin-top:5%;
}

/*----- our story -----*/
#our-story img{
    width:100%;
    height:600px;
    object-fit: cover;
}

.our-story{
    position:absolute;
    top:250px;
    text-align:center;
    width:100%;
}

.our-story h1{
    color: white;
    display:inline-block;
    width:100%;
    font-size:70px;
    text-shadow: 0px 1px 1px #4d4d4d;
font-family:'Diogenes';
}

.our-story-content{
    width:60%;
    margin:auto;
    line-height:1.8em;
    font-size:20px;
    margin-top:1.5%;
    letter-spacing:0.05em;
}

.our-story-content h1{
    margin-top:70px;
font-family:'Diogenes';
}

.our-story-content figcaption{
    text-align:center;
    font-size: 18px;
    margin-bottom:5%;
}

.our-story-content a{
    text-decoration:none;
    color:#c4272d;
    font-weight:400;
}

.our-story-content a:hover{
    text-decoration:underline;
}

.our-story-content span{
    font-weight:400;
    font-size:22px;
    display:inline-block;
    margin-bottom:20px;
}

.our-story-content .we h2,.he h2,.she h2{
    text-align: center;
}

.our-story-content .he ul, .we ul{

    margin-right:2%;
}

.our-story-content .we li{
    width:70%;
    margin:auto;
}

.our-story-content .she ul{
    padding:0;
    margin-left:2%;
}

.he{
    width:47%;
    display:inline-block;
    margin-right:2%;
    padding:0;
}

.she{
    width:48%;
    margin-left:2%;
    float:right;
    display:inline-block;
}


/*------ photography page ------*/


.galleries-wrapper{
    width:85%;
    margin:auto;
    padding:0;
}
#photography-galleries ul{
    width:100%;
    margin:auto;
    padding:0;
    display:inline-block;
}

#photography-galleries li{
    width:47%;
    margin:0 1% 0 1%;
    padding-bottom:2%;
    float:left;
    list-style:none;
    display:inline-block;
    overflow:hidden;
}

#photography-galleries li img{
    width:100%;
    margin:0;
    padding:0;
    list-style:none;
    height:230px;
    object-fit: cover;
    display:inline-block;
}

#photography-galleries h3{
    text-align:center;
    margin:0;
    font-weight:800;
}


/*-------- gallery photo page ------ */
.photography-wrapper{
    width:100%;
    margin:auto;
}

.photography-wrapper img{
    object-fit: cover;
    width:100%;
    height:100%;
}
.photography-wrapper h1{
    width:60%;
    margin:auto;
    padding-bottom:20px;
    padding-top:30px;
    
}
.photography-wrapper h2{
    width:60%;
    margin: 2% 0 0 0;
    font-size:24px;
    text-align:left;  
}
.photography-wrapper p{
    width:60%;
    margin:auto;
    margin-bottom:90px;
}
.photography-wrapper h3{
    width:60%;
    font-size:16px;
    font-style: italic;
    font-weight:200;
    margin:0;
    text-align:left; 
    line-height:22px;
}

.photography-wrapper figcaption{
    width:60%;
    text-align:left;
    margin-left:20%;
    font-size:20px;
    margin-bottom:90px;
    padding:0;
}


.photography-wrapper span{
    font-weight:400;
    width:60%;
    margin-left:20%;
    font-size:18px;
    display:inline-block;
    margin-bottom:20px;
}

.goodknow li{
	margin-bottom:50px !important;
}

.goodknow p{
	margin-left:140px;
}
.goodknow img{
	max-width:100px;
	float:left;
	clear:both;
	
}

/*---- filter menu ------*/
/* Dropdown Button */
.filterbtn {
    color: #c4272d;
    text-align:left;
    padding: 16px;
    font-size: 16px;
    border: 1px solid #c4272d;
    cursor: pointer;
    width:250px;
    font-weight:800;
    background-color:white;
}

.filterbtn:after{
    content: "+";
    position: absolute;
    font-size:22px;
    left:220px;
    top:14px;
}

.filterbtn:focus::after{ 
transform:rotate(45deg);
    font-size:22px;
}

/* Dropdown button on hover & focus */
.filterbtn:hover, .filterbtn:focus {
    border: 1px solid #c4272d;
    outline:none;
}

/* The container <div> - needed to position the dropdown content */
.filter {
    position: relative;
    display: inline-block;
    width:90%;
    margin-left:6%;
    margin-bottom:50px;
}

/* Dropdown Content (Hidden by Default) */
.region {
    display: none;
    position: absolute;
    background-color: white;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
    margin-top:10px;
}

.region ul{
    padding:0;
    margin:0;
}
/* Links inside the dropdown */
.region li {
    color: #4d4d4d;
    font-size:16px;
    font-weight:400;
    text-decoration: none;
    display: block;
    border-bottom:1px solid #e0e0e0;
    cursor:pointer;
}

.region a{
        color: #4d4d4d;
}

/* Change color of dropdown links on hover */
.region li:hover {color: rgba(0,0,0,0.5); text-decoration:underline;}

/* Show the dropdown menu (use JS to add this class to the .dropdown-content container when the user clicks on the dropdown button) */
.show {display:block;}

.continent{
    padding:0;
}

.continent a{
    text-decoration: none;
    display:block;
        padding: 12px 16px;
}
.continent li > ul{
    display:none;
}

@media only screen and (min-width: 1040px) {
.continent li:hover > ul{
    display:block;
    position:absolute;
    left:100%;
    top:0;
    }}

@media only screen and (min-width: 1040px) {
.continent a:hover::after{
    content: ">";
    font-weight:800;
    float:right;
    color:#c4272d;
    }}

.continent li > ul{
    padding:0;
    margin:0;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    background-color:#f9f9f9;
    width:300px;
    min-height:100%;
}

.continent li > ul > li{
    opacity:1 !important;
    float:left !important;
    width:150px;
    display:inline-block;
}

@media only screen and (min-width: 1040px) {
.continent li > ul:after{
    clear:both;
    display:inline-block;
    }}

@media only screen and (min-width: 1040px) {
.continent li > ul > li a:after{
    content: "" !important;
    }}

@media only screen and (min-width: 1040px) {
.continent li > ul > li a:hover{
    color:#c4272d;
    }}

#search-featured-image img{
    height:400px;
    width:100%;
    object-fit: cover;
    margin-bottom:80px;
    
}

.front-page-header-message{
margin-top:400px;   
list-style-type:none;
    text-decoration: none;
    color:white;
    font-size:4em;
    text-align:center;
    padding:0;
font-family:'Diogenes';
}

.front-page-header-message h1{
    color: white;
    display:inline-block;
    width:60%;
    font-size:70px;
    line-height:75px;
    text-shadow: 2px 2px 2px #4d4d4d;
}

.front-page-header-message a{
    text-align:center;
    font-size:24px;
    font-weight:800;
    margin:auto;
    border-radius:5px;
    width:250px;
    padding:10px;
    display:block;
    text-decoration: none;
    color:white;
    background-color:#c4272d;
}

#demo{
margin-bottom:0;
	text-shadow: 3px 3px 3px rgba(0,0,0, 0.5);
	line-height:1em;
}

#countdown .wreath img{
    bottom:70px;
    width:35%;
	max-width:500px;
}
#countdown ul{
    margin:0;
    padding:0;
}

.front-page-header-message a:hover{
    text-decoration:underline;
}


/*---- RESPONSIVE DESIGN MOBILE-----*/

@media only screen and (max-width: 767px) {
    
    body{
        overflow-x: hidden;
        overflow-y:scroll;
    }
	
		body.home{
		background-image:url("http://bash.ourglobaltrek.com/wp-content/uploads/2018/05/mobile-2.jpg");
		background-repeat: no-repeat;
		background-position: center;
	
	}
	
	#slider video{
		display:none;
	}
	#wprmenu_bar .menu_title{
		font-family:'Diogenes';
	}
	#mg-wprm-wrap ul#wprmenu_menu_ul li.menu-item a{
		font-family:'Diogenes';
	}
	.villadelenia{
		margin-top:10px !important;
	}
		#wprmenu_bar .menu_title a{
			color:white;
			text-decoration:none;
			top:0px;
			margin-left:15px;
		}
	#countdown .wreath img{
		width:90%;
		max-width:320px;
	}
    .front-page-header-message{
        top:100px;
		margin-top:200px;
		font-size:2.7em;
        
    }
    .front-page-header-message h1{
        font-size:24px;
        line-height:26px;
    }
    
    .front-page-header-message a{
        font-size:14px;
        padding:1%;
        width:150px;
    }
    
    .social-media-bar-wrapper{
        display:none;
    }
    
    #about-us-bar{
        width:100%;
        padding:0;
        margin:0;
    }
    
    #slider img{
        min-height:300px;
    }
    
    .about-us-bar img{
        display:none;
    }
  
    #about-us-bar .about-us{
        width:100%;
        padding-left:5%;
        padding-right:5%;
    }
    
    #about-us-bar .about-us {
        margin:0;
    }
    
    .form{
        width:100%;
        padding:2%;
        box-sizing: border-box;
        margin:0;
    }
    
    .form input[class="name"]{
        width:22%;
    }
    

    .featured-destinations-wrapper{
        width:100%;
        padding:0;
        margin:0;
        margin-top:50px;
    }
    #featured-destinations li{
        width:100%;
        padding:0;
    }
    
    #featured-destinations li:nth-child(n+4){
        display:none;
    }
    
    .posts-wrapper{
        margin:0;
        width:100%;
    }
    
    #featured-posts li img{
        width:100%;
        max-height:200px;
        margin:0;
    }
    
    #featured-posts li .post-content{
        width:90%;
        margin-left:5%;
        float:left;
        margin-top:-3%;
    }
    #featured-posts li:nth-child(odd) .post-content:before{
    content:'';
    width: 0; 
    height: 0; 
    border-left: 15px solid transparent;
    border-right: 15px solid transparent;   
    border-bottom: 20px solid white;
    position:relative;
    bottom:30px;
    left:20px;
}
    
        #featured-posts li:nth-child(even) .post-content:before{
    content:'';
    width: 0; 
    height: 0; 
    border-left: 15px solid transparent;
    border-right: 15px solid transparent;   
    border-bottom: 20px solid white;
    position:relative;
    bottom:30px;
    left:0px;
}
    
    #featured-posts li:nth-child(even) img{
        margin:0;

    }
    #featured-posts .post-content{
        margin-bottom:20px;
    }
    #featured-posts li:nth-child(even){
        text-align:left;
        margin:0;
    }
    #featured-posts .author{
        display:none;
    }
    
    #featured-posts li:nth-child(even) p{
        text-align:left;
    }
    
    #featured-posts li:nth-child(even) .author{
        display:none;
        margin-bottom:20px;
    }

    .logo{
        display:none;
    }
    
    .menu{
        display:none;
    }
    
    .header-wrapper{
        display:none;
    }

    .menu-main-container{
        width:100%;
    }
   
    header .menu ul{
        width:100%;
        left:0;
    }
    
    header nav li a{
        padding:20px 0px 20px 0px;
        font-size:15px;
    }
    .search-bar{
        display:none;
    }
    .language{
        display:none;
    }
    #wpadminbar {
    top:-45px;
}

    #our-story img{
        height:250px;
    }
    
    .our-story h1{
        font-size:36px;
    }
    
    .our-story{
        top:120px;
    }
    
    .our-story-content{
        width:100%;
        padding-left:20px;
        padding-right:20px;
        
    }
    
    .he{
        width:100%;
        margin:0;
    }
    
    .she{
        width:100%;
        margin:0;
        float:left;
        display:inline-block;
        padding-left:40px;
    }
    
    .we{
        width:100%;
        margin:0;
    }
    
    .our-story-content .we li{
        margin:0;
        width:100%;
    }
    
    #travel-blog-featured-image img{
        height:250px;
    }
    
    .travel-blog-header-message h1{
        font-size:34px;
        margin-bottom:0;
    }
    
    .travel-blog-header-message p{
        font-size:20px;
    }
    
    .travel-blog-header-message{
        margin-top:-140px;
        margin-bottom:110px;
    }
    
    .travel-blog-wrapper{
        width:100%;
    }
    .travel-blog-wrapper li{
        width:100%;
        margin:0;
        height:100%;
		min-height:150px;
    }
    #travel-blog-posts li img{
        height:160px;
    }
    .filter{
        margin-top:30px;
        
    }
    #travel-blog-posts .content{
        width:90%;
        margin-left:5%;
        margin-right:5%;
    }
    
    #travel-blog-featuerd-image img{
        display:inline-block;
    }
    #photography-galleries{
        display:inline-block;
        margin-top:10%;
    }
    
    .galleries-wrapper{
        width:100%;
    }
    
    #photography-galleries li{
        width:100%;
        margin:0;
    }
    
    #post-page-featured-image img{
        height:390px;
    }
    
    .post-page-header-message{
        top:140px;
    }
    
    .post-page-header-message h1{
            font-size:42px;
        line-height:42px;
    }
    
    .post-page-post-content{
        width:90%;
    }
    .post-page-post-content img{
        max-height:350px;
    }
	
	#travel-blog-posts .weekendplan{	
      -moz-column-count: 1;
    -moz-column-gap: 50px;
    -webkit-column-count: 1;
    -webkit-column-gap: 50px;
    column-count: 1;
    column-gap: 50px;
		padding:0;
	}
	.goodknow{
		padding:0;
	}
	
	.goodknow p{
		margin-left:0;
	}
	#travel-blog-posts .weekendplan img{
		margin-top:0;
	}
	#travel-blog-posts li img{
		height:100%;
	}
    
    .related-posts-wrapper{
        width:100%;
    }
    
	#travel-blog-posts li img{
		width:100%;
	}
	#travel-blog-posts .activities{
		padding:0;
		text-align:center;
		font-size:16px;
	}
    .related_posts li{
        width:100% !important;
        height:100%;
    }
    .posted-comments{
width:90%;
    }
    
    .photography-wrapper span{
        width:90;
        margin-left:5%;
    }
    
    .photography-wrapper h1{
        width:90%
    }
    
    .photography-wrapper p{
        width:90%;
    }
    
    .photography-wrapper figcaption{
        width:90%;
        margin-left:5%;
    }
    
    #wprmenu_menu.top{
        width:40%;
        left:60%;
        position: absolute;
z-index: 100;
    }
    
    #myDropdown{
        width:98%;
    }
    .continent li > ul{
        display:inline-block;
        width:100%;
        box-shadow:none;
}
    .continent li > ul >li{
        width:33%;
    }
    .continent a{
        font-size:16px;
        padding-left:10px;
        padding-right:0px;
    }
    
    .region li{
        border-bottom:none;
    }
    
    .continent > li{
        background-color:black;
    }
    .continent > li > a{
        color:white;
    }
    .photography-wrapper h2{
        width:100%;
    } 
	
    .photography-wrapper h3{
        width:100%;
    }
    
    .photography-wrapper figcaption{
        margin-bottom:0;
    }
}


/*---- tablet design---- */

@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1040px) {
	
	.logo a{
		font-size:36px;
		margin-left:15px;
		margin-right:15px;
	}
   
	header nav li a{
		padding:20px 5px 20px 5px;
		margin:0 5px 0 5px;
	}
	
	.our-story-content{
		width:80%;
	}
	
	.front-page-header-message{
		margin-top:300px;
	}
	#countdown .wreath img{
		width:50%;
	}
	
	#travel-blog-posts .weekendplan{
		padding-left:0;
	}
	
	.goodknow{
		padding-left:0;
	}
	
	.activities{
		padding-left:0;
	}

}
