/**
Stylesheet: exile-framework.css
Template Version: 1.0
Styles for a lovely and clutter-free framework.
by www.cleio.co
*/

/* == Framework Design =================================================
      Basic display elements for Cleio Framework
  ---------------------------------------------------------------------- */

/*global*/
#cleio-framework p,#cleio-framework ul,#cleio-framework li,#cleio-framework h2,#cleio-framework h3{margin:0;padding:0;}
#cleio-framework h5{margin:20px 0 5px 0;padding:0;}
#cleio-framework{margin:20px;color:#575144;background:#f9f9f9;}
#cleio-header{padding:15px 10px 12px 10px;overflow:hidden;}
#cleio-content{float:right;width:66%;margin:15px 2% 0 2%;}

/*header*/
#cleio-header{position:relative;overflow:hidden;height:27px;}
#cleio-header h2{padding-top:3px;}
#cleio-header .cleio-save-big{position:absolute;bottom:10px;right:10px;}
.message{margin-right:5px;}
.cleio-options-save{border:0;padding:9px 12px;cursor:pointer;}

/*nav*/
#cleio-nav{float:left;width:30%;list-style-type:none;/*padding-top:8px !important;*/}
#cleio-nav li{border-bottom:1px solid #e5eaed;padding:10px 10px 10px 45px;}
#cleio-nav li:last-child{border:0;}
#cleio-nav ul{border-top:1px solid #e5eaed;margin-top:5px;}
#cleio-nav ul li{padding-left:0;}
#cleio-nav ul li:last-child{padding-bottom:0 !important;}

/*content*/
#cleio-content{margin-bottom:20px;}
#cleio-content h3,#cleio-content p{margin-bottom:12px;}
#cleio-content fieldset p{margin-bottom:0;}
#cleio-content input[type="text"]{width:100%;}
#cleio-content input.current-page{width:10%!important;}
/*#cleio-content div{margin-bottom:10px;}*/
#cleio-content h4{padding-top:20px;}
#cleio-content fieldset{padding:5px 10px 5px 10px;margin:0 0 10px 0;}
#cleio-content legend{margin-bottom:5px;}
.sp-replacer,.sp-preview,.sp-preview-inner,.sp-dd{ margin-bottom:0!important; }

/*footer*/
#cleio-footer{clear:both;padding:10px;overflow:hidden;position:relative;height:34px;}
#cleio-footer .cleio-save-big{position:absolute;top:10px;right:10px;}
#cleio-footer li{display:inline-block;}
#cleio-footer ul{margin-top:5px;}
#footer-links{clear:both;padding:8px 0 8px 10px;float:left;line-height:28px;}
#footer-links li{margin-right:16px;}
#footer-social{float:left;}
#footer-social .fb,#footer-social .twitter,#footer-social .news{display:block;width:28px;height:28px;}


/* == UX Elements ======================================================
      Controls & Maps
  ---------------------------------------------------------------------- */

/*slider*/
.cleio-slider{border-width:1px;border-style:solid;border-color:#938c7f;width:200px;position:relative;height:14px;background-color:#e7e5dd;margin-top:4px;margin-left:5px;}
.ui-slider-handle:focus{outline: none!important;}
.ui-slider-handle {position:absolute;z-index:2;width:18px;height:18px;cursor:pointer;background:#938c7f no-repeat 50% 50%;font-weight:bold;outline:none;top:-2px;margin-left:-9px;}

/*calendar*/
.datepicker,#fDate,#fDateTP{background:url(../images/calendar.svg) no-repeat 5px center;background-size:15px 15px;padding-left:30px;}
.ui-datepicker{display:none;background:white;border:1px solid black;padding:5px;widows:200px;}
.ui-datepicker-title{text-align:center;}
.ui-datepicker-prev,.ui-datepicker-next{font-size:0.6rem;}
.ui-datepicker-prev{float:left;}
.ui-datepicker-next{float:right;} 
.ui-datepicker th{width:14.2%;}
.ui-datepicker tbody td{padding:0;border-right: 1px solid #bbb;border-bottom:1px solid #bbb;text-align:center;}
.ui-datepicker tbody td:last-child{border-right:0px;}
.ui-datepicker tbody tr:last-child{border-bottom:0px;}
.ui-datepicker .ui-icon { display:inline!important; cursor:pointer;}

/* Progress bar */
#progressBar{height:22px;border:1px solid #938c7f;background:#e7e5dd;margin-top:25px;}
#progressBar div{height:100%;color:#fff;text-align:right;line-height:22px;width:0;background:#938c7f;}

/*Map Generator*/
div#cleio-mapgenerator, div.cleio-map-preview{width:50%;float:left;margin-right:20px;padding-bottom:40px;padding-top:20px;}
#map-generator-preview, .map-preview{height:250px;margin:0px!important;padding:0px!important;margin-bottom: 0px!important;}
.gen-code{width:100%;margin-top:20px;margin-bottom:20px;}

/*Where Next + Where I've Been*/
#where #map_canvas,#whereTP #map_canvasTP{width:100%;height:250px;margin-top:10px;}

/*Modal Box for precise geolocation*/
.cleio-geoloc-dialog{position:absolute;outline:none;background:white;margin:0 !important;padding:0 !important;border:2px solid black;z-index:300002!important;}
.cleio-geoloc-submit{float:right;margin-bottom:10px;margin-right:9px;margin-top:10px;border: 1px dashed #dfdfdf;padding: 3px 2px 2px 2px;cursor:pointer;}
#div_form_city{padding:0 !important;margin:20px !important;}
#div_form_city div{margin-top:5px !important;}
#div_form_city p{padding-bottom:10px !important;padding-top:0 !important;}
#field_user_city_text{padding:2px 5px !important;}
#closeDialogCity{position:absolute;top:20px;right:10px;}
#submitDialogCity{margin-bottom:0px;margin-top:10px;}

/*?*/
/*#social_settings input{float:left;}*/
#social_settings label{clear:both;display:block;padding-top:10px;}
.cleio-fw-social{float:left;}
.social-icon{vertical-align: middle;margin: 1px;padding: 3px 5px;}

/* Chosen Select */
#cleio-framework ul.chosen-choices {padding:0 5px;}
#cleio-framework li.search-choice {margin:3px 5px 3px 0;padding:3px 20px 3px 5px;}
#cleio-framework ul.chosen-results li {padding: 5px 6px;}
/*#cleio-framework .chosen-container li.search-field {width: 100%;}*/
#cleio-framework .chosen-container li.search-field input.default {width: auto !important;}
.ms-drop ul {padding:5px 8px!important;}

/* == IMG Elements =====================================================
      Backgrounds & Icons
  ---------------------------------------------------------------------- */

/*earth background*/
.cleio-banner,#cleio-header,#cleio-footer{
background: url(../images/bg-cream.gif);
background:
   url(../images/bg-earth.png) center -140px no-repeat, 
   url(../images/bg-cream.gif);
}

/*menu icons*/
.cmaps{background:url(../images/map.svg) no-repeat 10px 8px;background-size:25px 25px;}
/*.cimport{background:url(../images/wrench.svg) no-repeat 10px 6px;background-size:25px 25px;}*/
.cappearance{background:url(../images/paint.png) no-repeat 10px 6px;}
.cgeneral{background:url(../images/wrench.svg) no-repeat 10px 7px;background-size:25px 25px;}
.chome{background:url(../images/house.png) no-repeat 10px 6px;}
.cslides{background:url(../images/photos2.png) no-repeat 10px 6px;}
.csocial{background:url(../images/user-bubble.svg) no-repeat 10px 9px;background-size:25px 25px;}
.creviews{background:url(../images/star.svg) no-repeat 10px 8px;background-size:25px 25px;}
.cplans{background:url(../images/paperplane.svg) no-repeat 10px 9px;background-size:25px 25px;}
.cwhere{background:url(../images/position.svg) no-repeat 10px 9px;background-size:25px 25px;}
.ccountry{background:url(../images/globe.svg) no-repeat 10px 9px;background-size:25px 25px;}
.chelper{background:url(../images/compass.svg) no-repeat 10px 9px;background-size:25px 25px;}
.cbucket{background:url(../images/bucketlist.png) no-repeat 10px 6px;}
.crss{background:url(../images/wifi.svg) no-repeat 10px 9px;background-size:25px 25px;}
.cloop{background:url(../images/home.svg) no-repeat 10px 9px;background-size:25px 25px;}
.carchives{background:url(../images/box.svg) no-repeat 10px 9px;background-size:25px 25px;}
.csitemap{background:url(../images/list.svg) no-repeat 10px 10px;background-size:25px 25px;}

/*footer icons*/
.fb{background:url(../images/facebook.svg) no-repeat right;padding-left:20px;margin-right:6px;}
.twitter{background:url(../images/twitter.svg) no-repeat;}

/*?*/
#icon-exile-guides{background:url(../images/swallow-32.png) no-repeat;}
#icon-featuredphotos{background:url(../images/photos2-32.png) no-repeat;}
#icon-reviewsaddresses{background:url(../images/city-32.png) no-repeat;}
#where .icon32-posts-location{background:url(../images/map-32.png) no-repeat;}
#icon-exile-themeoptions{background:url(../images/country-32.png) no-repeat;}
.icon-importer,.icon-installer-s11{background:url(../images/tools-32.png) no-repeat;}

/*commands*/
.cleio-save,.cleio-skip,.cleio-close{width:20px;height:20px;background-size:20px 20px;}
.cleio-close{background:url(../images/close.svg) no-repeat;display:block;}
	.cleio-banner .cleio-close{width:15px;height:15px;background-size:15px 15px;float:right;}
.cleio-save{background:url(../images/ok.svg) no-repeat;display:block;float:left;}
.cleio-skip{background:url(../images/skip.svg) no-repeat;display:block;margin-left:25px;}


/* == Banners ==========================================================
      For Geolocation Helper + Install Process
  ---------------------------------------------------------------------- */

/*global*/
.cleio-banner{margin:0 15px 10px 0;padding:10px;position:relative;cursor:pointer;}
.cleio-banner p{margin:0;padding:0 20px 0 0;}
.cleio-banner-close{position:absolute;right:10px;top:12px;}
a.cleio-banner-button{position:absolute;}

/*geolocation helper*/
#cleio-banner-geoloc{margin-top:40px;}
#cleio-banner-geoloc a.cleio-banner-button{top:10px;}
#cleio-banner-geoloc .cleio-banner-close{top:18px;}
#cleio-banner-geoloc a.cleio-banner-button{padding:7px 7px 6px 7px;}

/*install pricess*/
#cleio-banner-install{padding-top:25px;padding-bottom:25px;margin-top:40px;}
#cleio-banner-install a.cleio-banner-button{right:10px;top:24px;padding:11px 12px 12px 12px;}
#cleio-banner-api a.cleio-banner-button{right:10px;top:5px;padding:5px;}


/* == Tables ===========================================================
      xx
  ---------------------------------------------------------------------- */

/*.flag{
  display:block;margin:0 auto 2px auto;width:15px;height:15px;
  border:1px solid #888;box-shadow:0 0 2px #888;border-radius:15px;}
.linkAssoc{font-weight:bold;}
.visible{background-color:#3bad54;}
.invisible{background-color:#E16666;}*/

/*whereivebeen*/
#whereihavebeen_settings .column-country{width:15%;vertical-align:middle;}
#whereihavebeen_settings .column-city{width:25%;vertical-align:middle;}
#whereihavebeen_settings .column-assoccontent{width:45%;vertical-align:middle;}
#whereihavebeen_settings .column-lastvisited{width:15%;vertical-align:middle;}

/*wherenext*/
#plans_settings .column-country{width:25%;vertical-align:middle;}
#plans_settings .column-city{width:40%;vertical-align:middle;}
#plans_settings .column-date_create{width:20%;vertical-align:middle;}
#plans_settings .column-actions{width:15%;vertical-align:middle;}

/*geolocation helper*/
#geolocation_settings .column-title{width:35%;vertical-align:middle;}
#geolocation_settings .column-geoloc{width:50%;vertical-align:middle;}
#geolocation_settings .column-actions{width:15%;vertical-align:middle;}


/* == Dashboard Apps ===================================================
   Currently, the Where I am Dashboard application.
   --------------------------------------------------------------------- */
#dashboard-whereiam p{padding:0;margin:0;}
#dashboard-whereiam h4{padding:0;margin:8px 0 3px 0;}
.labelCurrentLocation,.dateLocation{font-family:Arial,sans-serif;font-size:8px;font-size:0.8rem;}
.currentLocation{font-size:10px;font-size:1rem;}
.infoCoord{color:#aaaaaa;}
#dashboard-whereiam p.infoCoord{margin-bottom:8px;}
#dashboard-whereiam #addressTextField{margin-bottom:6px;width:67%;}
#dashboard-whereiam #btFormAddGeoloc{width:32%;}
#dashboard-whereiam h4{font-size:14px;font-size:1.4em;}


/* == Typography & Colors ==============================================
      For Wordpress back-end AND Cleio Framework
  ---------------------------------------------------------------------- */
a,.cleio-banner a{text-decoration:none;}

/*colors===========*/
.cleio-banner,.cleio-banner-button,#cleio-banner-install p.congrats{color:white;}
/*super light sand*/
#cleio-nav,#cleio-content fieldset{background:#f5f5f5;}
/*sand*/
.geolocs th,.toplevel_page_cleio-base th{background:#e3dfd8;}
/*gray*/
#cleio-framework em{color:#b3b3b3;}
/*fuchsia*/
.exile-important,.cleio-banner .exile-important,.message,#cleio-nav a,#cleio-content a,#cleio-footer a{color:#ed3e70;}
#cleio-header{border-top:5px solid #ed3e70;}
#cleio-footer{border-bottom:5px solid #ed3e70;}
/*bright yellow*/
.cleio-options-save:hover,#exile-installer-s1-saveBt:hover,.installer-button:hover,a.cleio-banner-button{color:#eff639;}
.cleio-options-save,#exile-installer-s1-saveBt,.installer-button,a.cleio-banner-button:hover{background:#eff639;}
/*mole brown*/
.cleio-options-save,#exile-installer-s1-saveBt,.installer-button,#cleio-content a:hover,#cleio-framework h2,#cleio-framework h3,#cleio-nav a:hover,#cleio-footer a:hover,.cleio-banner p,a.cleio-banner-button:hover{color:#938c80;}
.cleio-options-save:hover,#exile-installer-s1-saveBt:hover,.installer-button:hover,a.cleio-banner-button{background:#938c80;}

/*fonts=============*/
#cleio-framework,#cleio-header span,#cleio-header li,#cleio-footer li{font-family: 'Lucida Sans Unicode', 'Lucida Grande', Geneva, Arial, Verdana, sans-serif;}
#cleio-header,#cleio-framework h3,#cleio-framework h4,#cleio-framework h5,.cleio-options-save,#cleio-nav,.cleio-banner{font-family: 'Quicksand', Geneva, Arial, Verdana, sans-serif;}
/*font-size*/
#cleio-header{font-size:14px;font-size:1.4rem;}
#cleio-framework h3{font-size:13px;font-size:1.3rem;}
#cleio-nav{font-size:12px;font-size:1.2rem;}
#cleio-framework h4,.cleio-options-save,.cleio-banner{font-size:10px;font-size:1rem;}
#cleio-framework h5{font-size:9px;font-size:0.9rem;}
.message,#cleio-content legend,#cleio-header li,#cleio-footer li{font-size:8px;font-size:0.8rem;}
/*line-height*/
.cleio-banner,.cleio-banner p,#cleio-banner-install p{line-height:13px;line-height:1.3rem;}
#cleio-nav,.gen-code{line-height:15px;line-height:1.5rem;}
/*styles*/
.message,#cleio-content legend,#cleio-header li,#cleio-footer li{font-weight:bold;}
.cleio-options-save,#cleio-nav,.cleio-options-save:hover,#exile-installer-s1-saveBt:hover,.installer-button:hover,a.cleio-banner-button,#cleio-banner-install p.congrats{font-weight:400;}
#cleio-header,#cleio-framework h3,#cleio-framework h4,#cleio-framework h5,.cleio-banner{font-weight:700;}
#cleio-nav,#cleio-header,#cleio-framework h3,#cleio-framework h4,#cleio-framework h5,#cleio-footer,.cleio-options-save,.cleio-banner{text-transform:uppercase;}

/*other===========*/
.cleio-options-save,.cleio-banner,.cleio-banner-button{border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;}
#cleio-content fieldset{border-radius:10px;-moz-border-radius:10px;-webkit-border-radius:10px;}
