/*
Theme Name:  WorldCitizen for Cleio
Version: 2.0
Theme URI: http://www.cleio.co
Description: A theme for the travel-minded!
Author: Cleio&Co
Author URI: http://www.cleio.co
Tags: two columns, travel, magazine, blog, maps
*/

@import url('css/reset.css');
@import url('css/typography.css'); /*fonts, colors, borders, styles*/
@import url('css/cleiobasic.css');

.clear{clear:both;}
.wrap{padding:5px;width:960px;margin:0 auto;} /*fixes width to this maximum*/


/* == global ===========================================================
      main layout & global classes, before applying media queries
   --------------------------------------------------------------------- */

#sidebar li,footer aside li,section li{padding:4px 0;}

/*img and caption alignments*/
.alignleft{float:left;margin:0 15px 10px 0;}
.alignright{float:right;margin:0 0 10px 15px;}
img.aligncenter{margin:20px auto;display:block;border:none !important;}
div.aligncenter{margin:10px auto 20px auto;width:intrinsic;}
	div.aligncenter img{display:block;margin:0 auto;}
.alignnone{margin:0 0 10px 0;}

.container{width:92%;margin-left:4%;margin-right:4%;}


/* == header ===========================================================
      what's above it all!
   --------------------------------------------------------------------- */

header{margin:10px 0 20px 0;width:98%;margin-left:1%;margin-right:1%;}
h1,header p{padding-left:20px;}

.menu-mobile-container{overflow:hidden;display:none;} /*hide mobile nav*/

nav{margin-top:0;padding:3px 0 8px 0;}
.menu-main,.menu-page ul, .menu-main ul{position:relative;z-index:1000;margin-left:10px;margin-right:10px;}
.menu-main li,.menu-page ul li{float:left;position:relative;}
.menu-main li a,.menu-page ul li a{display:block;padding:5px 7px;}
.menu-main li li a,.menu-page ul li li a{padding:5px 10px;}
.menu-main ul,.menu-page ul ul{display:none;position:absolute;width:180px;width:18rem;left:-20px;}
.menu-main ul li,.menu-page ul ul li{clear:left;width:100%;}
.menu-main li:last-child ul,.menu-page ul li:last-child ul{left:auto;right:0;} /*flip last submenu*/
.menu-main li:hover ul,.menu-main li.hover ul,.menu-page ul li:hover ul{display:block;}​ /*show submenu*/


/* == main =============================================================
      main text/display area, for articles and common tags (p, ul, etc.)
   --------------------------------------------------------------------- */

#content,#highlight,#articles,#addresses{overflow:hidden;}
#content,#sidebar{margin-bottom:20px;}
#content{width:64.667%;/*display:inline;*/float:left;position:relative;margin-left:1%;margin-right:1%;}
	.page-template-fullwidth #content{width:98%;float:none;}
section{padding:0 20px 20px 20px;}
section#single,section#page{padding-top:20px;}

section p,section ul,section ol{margin-bottom:10px;}
section ol{list-style-type:decimal;padding-left:18px;}
section ul li{padding-left:14px; background:url(images/arrow.png) no-repeat 0 8px;}
section li,.error404 h2{margin-bottom:0;}
section ul ul{margin:0 0 0 10px;}
section h2{margin-bottom:10px;position:relative;}
	.single section h2{padding-right:45px;}
section h2 span{display:block;position:absolute;right:0;top:0;padding-top:4px;
	background:url(images/comments.png) no-repeat;width:31px;height:35px;}
section h3{padding:15px 0 10px 0;clear:both;}
section h4{padding-top:10px;clear:both;}
	section #bio h4{clear:none;padding-top:0;}
section h5,section h6{margin-top:20px;}
section blockquote{padding:10px 0 10px 50px;background:url(images/quote.gif) no-repeat 0 14px;}

/*metadata*/
.meta{margin:10px 0;padding:3px 0;}
.meta li{padding:0;background:none;}
p.wp-caption-text{padding:4px 10px;margin:0;}
#tags{background:url(images/tag.png) no-repeat 0 5px;padding-left:22px;}
.form-allowed-tags{margin-bottom:10px;}
.wp-smiley{margin:0!important;padding:0!important;border:none!important;}
.notfound{padding:0 20px 20px 20px;}

/*tables*/
table{width:100%;margin:0 0 20px 0;}
td,th{padding:3px 20px;}
caption{padding:0 0 3px 20px;}

/* == Sticky Video ==================================================== */

#exile-sticky-video{margin-bottom:30px;}

/* == single ===========================================================
      single posts & pages
   --------------------------------------------------------------------- */

/*mini-map*/
/*.single #map-container{height:100px!important;}*/

/*featured photo*/
.single-photo section img{margin:0 0 10px 0;width:100%;}

/*author box*/
#bio{overflow:hidden;padding:0 10px 10px 0;margin:0 0 20px 0;}
#bio img,section#bio .avatar{float:left;width:90px;height:auto;}
#bio h4{margin:12px 0 0 100px;}
#bio p{margin:3px 0 0 100px;}
.single #bio img{margin-left:0;}
.single #bio{margin:20px 0 0 0;}

/*comments*/
.comment-author,.comment-meta,.reply,.comment-body p,#comments .children li{margin-bottom:0;}
#comments h3{margin-top:40px;}
#respond h3{margin-top:0;}
section #comments{list-style-type:none;padding-left:0;}
#comments .avatar{width:50px;float:left;margin:0 0 0 10px;}
.comment-body{margin-left:50px;margin-bottom:5px;}
.comment-body p{margin-left:20px;}
.comment-meta,.reply{margin-left:70px;}
#comments li{padding:10px 10px 10px 0;}
#comments .children li{margin-top:10px;padding:5px 0 0 0;margin-left:20px;}
#comments cite{padding-left:10px;}
.reply a{padding:2px 8px;}
#comments .depth-1{margin-bottom:10px;}

/*404*/
.error404 section{padding:20px;}
.error404 section p{margin:0 20px 10px 20px;}
.error404 section img{margin-left:20px;}

/*archives shortcode*/
section .exile-archives ul{margin:0;padding:0;}
.exile-archives{padding-bottom:20px;}

/*where i've been*/
.page-template-fullwidth .map{height:350px;}


/* == Reviews ==========================================================
   --------------------------------------------------------------------- */
   
#reviewlist .map{height:100px;margin-bottom:20px;}
.reviewlist-footer{padding-top:20px;}
#single-review .map{height:150px!important;}
#single-review .review .ratings{padding-top:0;}

.cleio-review-gallery{padding:10px 0 15px 0;overflow:hidden;margin-left:-10px;}
.cleio-review-gallery a{width:25%;display:block;float:left;margin-bottom:10px;padding-left:10px;}

/* == listings =========================================================
      article listings of all sorts (category, tags, etc.)
   --------------------------------------------------------------------- */

#articles{clear:both;margin:-10px 0 0 -20px;padding-top:0;}
section #articles h3{padding-top:0;/*border-bottom:1px solid #E0DAC9;*/}
section #articles h2{margin-left:20px;}
article{width:100%;float:left;height:auto;padding-left:20px;padding-bottom:20px;position:relative;}
article p,article h3{margin:0;}

.category article h3,.archive article h3,.search-results h3,.blog h3{margin-bottom:5px;}
article .content{float:right;width:56%;}
article .header{position:relative;overflow:hidden;background:aqua;width:41%;float:left;margin-right:3%;}
article .tags{position:absolute;left:10px;top:10px;width:auto;z-index:1000;}
article .bubble,#cleio-sticky .bubble{position:absolute;right:0;top:0;padding-top:3px;margin:9px 11px 0 0;z-index:10;
	background:url(images/comments.png) no-repeat;width:31px;height:35px}
.type-guide .type,.type-photo .type,.type-post .type,.type-article .type,.type-page .type,.type-addresses .type,.type-address .type,article .tags a,article .countrycount{float:left;padding:0 3px;}

.home article h3,.country article h3,.author article h3,.archive article h3,.search article h3{margin-top:6px;padding-bottom:0;}
.category h2,.archive h2,.search h2,.tag h2,.author h2{padding:20px 0;}

/*author archive*/
.author section#bio{margin-bottom:20px;margin-top:0;}

/*country page*/
#cleio-country-content img{width:40%;float:left;margin-right:4%;}
#cleio-country-intro img{width:200px!important;margin-right:20px!important;}
#cleio-country-content{margin-left:-20px;overflow:hidden;}
#cleio-country-content img{width:40%;float:left;margin-right:20px;}
.page #cleio-country-content article h3{padding:0;}
.page #cleio-country-content article p.cleio-meta-data{padding-bottom:10px;}

/*country list*/
section ul#cleio-countrylist-content{margin-left:-20px;}
section ul#cleio-countrylist-content li.cleio-country{background:none;width:30%;padding:0;margin:0 0 15px 3.3%;}

/*featured sticky post*/
#cleio-sticky{position:relative;overflow:hidden;margin-bottom:30px;} /*master div*/
#cleio-sticky h3{margin-right:135px!important;position:absolute;top:15px;left:15px;z-index:10;background:white;padding:5px 8px 5px 8px;}
#cleio-sticky .bubble{top:147px;}
#cleio-sticky .type{padding:1px 6px 1px 6px;}
#cleio-sticky img{float:left;width:100%;}
#cleio-sticky .map{position:absolute;right:0;top:0;width:120px;height:120px;}
#cleio-sticky .excerpt{clear:both;padding:15px;margin:0;line-height:1.6rem;}
#cleio-sticky .tags{position:absolute;right:0;top:125px;width:120px;text-align:right;}

/* == Country List navigation ========================================= */

.cleio-navigation a{display:block;padding:2px 7px;}
.cleio-navigation .left a{padding-left:17px;}
.cleio-navigation .right a{padding-right:17px;}
.cleio-navigation .left,.cleio-navigation .right a,.cleio-navigation .left a,.cleio-loading-right{float:left;}
.cleio-navigation .right,.cleio-loading-left{float:right;}
.cleio-loading-left{padding-left:7px;box-shadow:none;}
.cleio-loading-right{padding-right:7px;box-shadow:none;}

/* == WordPress post navigation ======================================== */

.mininav{overflow:hidden;clear:both;padding:20px 0 0 20px;}
	.archive .mininav,.search .mininav,.single .mininav{margin-left:-20px;}
	.single .mininav{padding-bottom:20px;}
	.category .mininav .left{margin-left:20px;}
.mininav div,.mininav-list div{padding:3px 7px;}
.mininav .left,.mininav-list .left{max-width:40%;padding-left:17px;}
.mininav .right,.mininav-list .right{max-width:40%;padding-right:17px;}


/* == sidebar ==========================================================
      this sidebar disappears on smartphones => see /css/media.css
   --------------------------------------------------------------------- */

#sidebar{float:right;width:31.333%;margin-right:10px;} /*keep out of my grid!*/
#sidebar aside{margin-bottom:10px;padding:20px;overflow:hidden;}
#sidebar h3{margin-bottom:5px;}
#sidebar ul ul,footer ul ul{margin-left:20px;}
#sidebar ul ul li:last-child,footer ul ul li:last-child{padding-bottom:0;}
#sidebar caption{padding-top:10px;}

/*search widget*/
#sidebar aside.widget_search{padding:0;}
#sidebar aside.widget_search h3{display:none;}
/*who i am widget*/
.cleio-bio{overflow:hidden;}
.cleio-bio img{width:75px;height:75px;margin:0 0 5px 0!important;border:4px solid #ffffff;}
.cleio-bio .read-more{margin-top:3px;}
/*featured photo widget*/
#sidebar aside.cleio-featuredphoto, div.cleio-featuredphoto{padding:0;position:relative;outline:0;}
#sidebar .cleio-featuredphoto h3{position:absolute;top:10px;right:10px;padding:3px 6px;}
#sidebar .cleio-featuredphoto p{padding:5px 10px;}
footer .cleio-featuredphoto p{padding:5px 0;}
/*default wordpress calendar widget*/
#calendar_wrap{background:white;}
#calendar_wrap caption{margin-bottom:5px;background:#f6f6f1;}
#wp-calendar th,#wp-calendar td,#calendar_wrap caption{text-align:center;padding:2px 1px;}
#wp-calendar tfoot td{background:#f6f6f1;padding:1px 7px;}
#wp-calendar tfoot td#prev{text-align:left;}
#wp-calendar tfoot td#next{text-align:right;}
#sidebar #calendar_wrap caption{text-align:left;}
#sidebar #calendar_wrap{margin-bottom:-10px;}
/*cleio instagram widget*/
.exile-instagram li{margin-right:10px;}
.exile-instagram ul{margin-right:-10px;}
footer .exile-instagram li{margin:0 10px 10px 0;padding:0;border:0;}


/* == footer ===========================================================
      widgetized footer + copyright information
   --------------------------------------------------------------------- */
   
footer{padding:2px 0 0 0;}
footer aside{padding:10px 0 15px 0;width:23.0%;display:inline;float:left;position:relative;margin-left:1%;margin-right:1%;}
footer aside div{margin-bottom:20px;}
footer aside h3{padding-bottom:5px;padding-top:30px;}
footer aside h3:first-child{padding-top:0;}
footer td,footer th{padding:0;}
footer caption{padding-top:5px;}
#copy{padding-bottom:2px;}
#copy p{padding:15px 0 6px 0;float:left;}
#copy ul{float:right;padding:15px 10px 0 0;}
#copy li{display:inline;margin-left:10px;}
.top{float:right;padding:2px 7px;margin-top:13px;}
/*footer where i am widget*/
footer .coordInfo{margin-top:-15px;}
footer .wim_map{margin-top:-10px;}


/* == FORMS ============================================================
      These are styles for forms all over!
      There's additional styling in typography.css
   --------------------------------------------------------------------- */

input,textarea,select{border:0;width:100%;}
input{height:30px;height:3rem;padding:0 8px;}
textarea{padding:8px 8px 0 8px;}

/*contact form 7*/
.wpcf7-checkbox input,.wpcf7-radio input{height:auto;padding:0;width:auto;}
/*header searchform*/
#searchform-top{float:right;margin-right:10px;margin-bottom:4px;width:20%;}
#searchform-top input,.menu-mobile-container{height:26px;height:2.6rem;}
/*default WP searchform widget*/
#searchform{overflow:hidden;}
#searchform input#s{width:75%;float:left;}
#searchform input#searchsubmit{width:25%;float:right;cursor:pointer;}
/*mobile menu select*/
.menu-mobile-container{padding:0 0 0 7px;}
/*mobile drop down menu (select reset)*/
.menu-mobile-container select{
background:transparent;
-moz-appearance:none;
-webkit-appearance:none;
border:0;
-moz-border-radius:0;
-webkit-border-radius:0;
border-radius:0;
-webkit-padding-end:20px;
-webkit-padding-start:2px;
-webkit-user-select:none;
overflow:hidden;
width:120%;
}



/* == Shortcodes =======================================================
   --------------------------------------------------------------------- */

/* == columns ========================================================== */

.columns2,.columns3,.columns4,.columns5{-moz-column-gap:20px;-webkit-column-gap:20px;column-gap:20px;margin-bottom:10px;}

.columns2{-moz-column-count:2;-webkit-column-count:2;column-count:2;}
.columns3{-moz-column-count:3;-webkit-column-count:3;column-count:3;}
.columns4{-moz-column-count:4;-webkit-column-count:4;column-count:4;}
.columns5{-moz-column-count:5;-webkit-column-count:5;column-count:5;}


/* == alerts ============================================================ */

.alertred,.alertgreen,.alertyellow,.alertgrey,.alertblue{padding:3px 7px;
border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;margin:0 0;}

.alertred{background:#f4e0e0;border:1px solid #e7a1a1;box-shadow: inset 1px 1px 0 #f7efef;color:#a15151;}
.alertgreen{background:#e0f4e3;border:1px solid #b4dcba;box-shadow: inset 1px 1px 0 #f2f9f3;color:#558d5d;}
.alertyellow{background:#f4f4e0;border:1px solid #e1e1b4;box-shadow: inset 1px 1px 0 #f8f8ef;color:#7d7d3c;}
.alertgrey{background:#e9e9e9;border:1px solid #cecece;box-shadow: inset 1px 1px 0 #f6f6f6;color:#737373;}
.alertblue{background:#d8def0;border:1px solid #b9c3dd;box-shadow: inset 1px 1px 0 #edf0f7;color:#546494;}


/* == buttons =========================================================== */

.cleio-button{color:#83815f;display:block;margin:0 0;line-height:2.3rem;padding:8px 13px;border:0;text-shadow:1px 1px 0 #f4f4f0;color:#83815f;border-radius:10px;-moz-border-radius:10px;-webkit-border-radius:10px;font-size:1.7rem;text-align:center;
/*gradient*/
background: #eeeee8; /* Old browsers */
background: -moz-linear-gradient(top,  #eeeee8 24%, #ddddca 100%); /* FF3.6+ */
background: -webkit-linear-gradient(top,  #eeeee8 24%,#ddddca 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #eeeee8 24%,#ddddca 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #eeeee8 24%,#ddddca 100%); /* IE10+ */
background: linear-gradient(to bottom,  #eeeee8 24%,#ddddca 100%); /* W3C */
/*shadow*/
-moz-box-shadow: 1px 1px 1px 0px #e8e8e0;
-webkit-box-shadow: 1px 1px 1px 0px #e8e8e0;
-o-box-shadow: 1px 1px 1px 0px #e8e8e0;
box-shadow: 1px 1px 1px 0px #e8e8e0;
filter:progid:DXImageTransform.Microsoft.Shadow(color=#e8e8e0, Direction=134, Strength=1);
}
.cleio-button:hover{color:#83815f;background:#eeeee8;text-shadow:1px 1px 0 #ffffff;}

.cleio-button-blue{
color:#1b525e;
text-shadow:1px 1px 0 #91cedb;
background:#68b5c6;
background: -moz-linear-gradient(top, #68b5c6 24%, #4c93a3 100%);
background: -webkit-linear-gradient(top, #68b5c6 24%,#4c93a3 100%);
background: -o-linear-gradient(top, #68b5c6 24%,#4c93a3 100%);
background: -ms-linear-gradient(top, #68b5c6 24%,#4c93a3 100%);
background: linear-gradient(to bottom, #68b5c6 24%,#4c93a3 100%);}
.cleio-button-blue:hover{background:#68b5c6;color:#1b525e;text-shadow:1px 1px 0 #91cedb;}

.cleio-button-red{
color:#4a0505;
text-shadow:1px 1px 0 #c57b7b;
background:#a84c4c;
background: -moz-linear-gradient(top, #a84c4c 24%, #8f3737 100%);
background: -webkit-linear-gradient(top, #a84c4c 24%,#8f3737 100%);
background: -o-linear-gradient(top, #a84c4c 24%,#8f3737 100%);
background: -ms-linear-gradient(top, #a84c4c 24%,#8f3737 100%);
background: linear-gradient(to bottom, #a84c4c 24%,#8f3737 100%);}
.cleio-button-red:hover{background:#a84c4c;color:#4a0505;text-shadow:1px 1px 0 #c57b7b;}

.cleio-button-green{
color:#2a4217;
text-shadow:1px 1px 0 #abc198;
background:#95b07e;
background: -moz-linear-gradient(top, #95b07e 24%, #6e8c56 100%);
background: -webkit-linear-gradient(top, #95b07e 24%,#6e8c56 100%);
background: -o-linear-gradient(top, #95b07e 24%,#6e8c56 100%);
background: -ms-linear-gradient(top, #95b07e 24%,#6e8c56 100%);
background: linear-gradient(to bottom, #95b07e 24%,#6e8c56 100%);}
.cleio-button-green:hover{background:#95b07e;color:#2a4217;text-shadow:1px 1px 0 #abc198;}

.cleio-button-grey{
color:#848484;
text-shadow:1px 1px 0 #efefef;
background:#cdcdcd;
background: -moz-linear-gradient(top, #dbdbdb 24%, #cdcdcd 100%);
background: -webkit-linear-gradient(top, #dbdbdb 24%,#cdcdcd 100%);
background: -o-linear-gradient(top, #dbdbdb 24%,#cdcdcd 100%);
background: -ms-linear-gradient(top, #dbdbdb 24%,#cdcdcd 100%);
background: linear-gradient(to bottom, #dbdbdb 24%,#cdcdcd 100%);}
.cleio-button-grey:hover{background:#dbdbdb;color:#848484;text-shadow:1px 1px 0 #efefef;}

.cleio-button-brown{
color:#584c46;
text-shadow:1px 1px 0 #aca49f;
background:#9a928d;
background: -moz-linear-gradient(top, #9a928d 24%, #7d746f 100%);
background: -webkit-linear-gradient(top, #9a928d 24%,#7d746f 100%);
background: -o-linear-gradient(top, #9a928d 24%,#7d746f 100%);
background: -ms-linear-gradient(top, #9a928d 24%,#7d746f 100%);
background: linear-gradient(to bottom, #9a928d 24%,#7d746f 100%);}
.cleio-button-brown:hover{background:#9a928d;color:#584c46;text-shadow:1px 1px 0 #aca49f;}

.cleio-button-pink{
color:#c45e7f;
text-shadow:1px 1px 0 #f7d4e0;
background:#ecc0ce;
background: -moz-linear-gradient(top, #ecc0ce 24%, #e392ad 100%);
background: -webkit-linear-gradient(top, #ecc0ce 24%,#e392ad 100%);
background: -o-linear-gradient(top, #ecc0ce 24%,#e392ad 100%);
background: -ms-linear-gradient(top, #ecc0ce 24%,#e392ad 100%);
background: linear-gradient(to bottom, #ecc0ce 24%,#e392ad 100%);}
.cleio-button-pink:hover{background:#ecc0ce;color:#c45e7f;text-shadow:1px 1px 0 #f7d4e0;}