@font-face {
  font-family: BGFlame;
  src: url(../fonts/BGFlame/BGFlame-Regular.ttf);
}
@font-face {
  font-family: 'BGFlame';
  src: url(../fonts/BGFlame/BGFlame-Bold.ttf);
  font-weight:bold;
}

*{margin:0;padding:0;}


html,body {
  text-size-adjust: none;
  -webkit-text-size-adjust: none;
  -moz-text-size-adjust: none;
  -ms-text-size-adjust: none;
}

body{font-family: 'BGflame',sans-serif;background: #fff;overflow-y: scroll;color:#708090;}
main{max-width: 1440px;margin: auto;background-color: white;}

a{text-decoration: none;}
a:link{color:inherit;}
a img{border:none}
img.pin{height:37px;width:32px;}

blockquote{
  background: #fff;
  margin: 1em;
  padding: 0.5em 10px;
  quotes: "\201C""\201D";
  font-size:1.3em;
  font-family:monospace;color:black;
  border-radius:8px;
}
blockquote:before {
  color: #797979;
  content: open-quote;
  font-size: 2em;
  line-height: 0;
  margin-right: 0;
  vertical-align: -9px;
}
blockquote:after {
  color: #797979;
  content: close-quote;
  font-size: 2em;
  line-height: 0;
  margin-left: 0;
  vertical-align: -9px;

}
blockquote p {display: inline;}

button {font-family:inherit; margin: 3px;background: #2a96f3;color: white;border: none;padding: 6px;border-radius: 3px;font-size:small;cursor:pointer;}
button:disabled {background-color: #bdbdbd;color: gray;}
button i{margin-right:3px;}
button.delete{background:red;color:white;}
/*
button.add{background: forestgreen;color: white;}
button.cancel{background: grey;color: white;}
*/
button:hover{opacity: 0.8;}


input[type="checkbox"]{display: none}
input[type="checkbox"].ios8-switch {position: absolute;margin: 8px 0 0 16px;}
input[type="checkbox"].ios8-switch + label {position: relative;padding: 5px 0 0 50px;line-height: 21px;color:#9E9E9E;}
input[type="checkbox"].ios8-switch:checked +label{color:black;}
input[type="checkbox"].ios8-switch + label:before {
    content: "";
    position: absolute;
    display: block;
    left: 0;
    top: 0;
    width: 40px; /* x*5 */
    height: 24px; /* x*3 */
    border-radius: 16px; /* x*2 */
    background: #fff;
    border: 1px solid #d9d9d9;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
}
input[type="checkbox"].ios8-switch:disabled + label:before {background: #efefef}

input[type="checkbox"].ios8-switch + label:after {
    content: "";
    position: absolute;
    display: block;
    left: 0px;
    top: 0px;
    width: 24px; /* x*3 */
    height: 24px; /* x*3 */
    border-radius: 16px; /* x*2 */
    background: #fff;
    border: 1px solid #d9d9d9;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
}
input[type="checkbox"].ios8-switch + label:hover:after {box-shadow: 0 0 5px rgba(0,0,0,0.3);}
input[type="checkbox"].ios8-switch:checked + label:after {margin-left: 16px;}
input[type="checkbox"].ios8-switch:checked + label:before {background: #55D069;}
input[type="checkbox"].ios8-switch.blue:checked + label:before {background: #00adf5;}

/* SMALL */
input[type="checkbox"].ios8-switch-sm {margin: 5px 0 0 10px;}
input[type="checkbox"].ios8-switch-sm + label {position: relative;padding: 0 0 0 32px;line-height: 1.3em;color:#9E9E9E;}
input[type="checkbox"].ios8-switch-sm:checked +label{color:black;}
input[type="checkbox"].ios8-switch-sm + label:before {width: 25px;height: 15px;border-radius: 10px;}
input[type="checkbox"].ios8-switch-sm + label:after {width: 15px;height: 15px;border-radius: 10px; }
input[type="checkbox"].ios8-switch-sm + label:hover:after {box-shadow: 0 0 3px rgba(0,0,0,0.3);}
input[type="checkbox"].ios8-switch-sm:checked + label:after {margin-left: 10px;}

.form-field {display: flex;align-items: center;flex-wrap: wrap;margin-bottom: .5em;}
.form-field > section {border: 1px solid #aaa;border-radius: 3px;display: flex;align-items: center;flex: 1;}
.form-field section i {padding: .5em .5em;display: flex;align-items: center;justify-content: center;width: 1em;height: 1em;color: #2196f3;cursor:pointer;}
.form-field section i:first-child {border-right: 1px solid #aaaaaa;}
.form-field section i:last-child {border-left: 1px solid #aaaaaa;}
.form-field label{margin-right:3px;}
.form-field input[type='text'], 
.form-field input[type='password'], 
.form-field input[type='email'],
.form-field select, .form-field textarea {flex:1; padding:2px;font-size:85%;box-sizing: border-box;-webkit-appearance: none;border:none;margin:0 0.35em}
.form-field select {background-color:white}


/*--tabbed content--*/
.tabs {display: flex; flex-flow: row wrap}
.tab{display: flex;flex-grow: 1; border-top-left-radius: 6px;border-top-right-radius: 6px;background: #eee;justify-content: center; padding: 3px;margin-right: 1px;
  border: 1px solid #ccc;font-size:smaller;align-items: center}
.tab.active{background: rgb(0, 150, 255);color: #FFF;border: none;}
.tab-container{display: none;}
.tab-container.active{display:block;margin-top:3px;}

/*--FLEX BOX--*/
.flex{display: flex}
/*--left/right--*/
.space-around{justify-content: space-around;}
.space-between{justify-content: space-between;}
.space-evenly{justify-content: space-evenly;}
.justify-center{justify-content: center;}
/*--Up/down--*/
.align-center{align-items: center;}
/*--use for streched images--*/
.align-self{align-self: center;}

.align-top{vertical-align:top;}
.center{display:block;margin-left:auto;margin-right:auto;}
.flex-wrap{flex-wrap: wrap}

.card{
	background: white;
	padding: 8px;
	border-bottom-left-radius: 8px;
	border-top-right-radius: 8px;
	border: 1px solid #3faeeb;
	margin: 0.3em;
}

.errors{
	background-color:rgba(255, 221, 221, 0.34);
	padding: 3px 8px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
	color:red;
	margin:0.5em;
}
.success{
	background-color: rgb(221, 252, 221);
	padding: 3px 8px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
	color:green;
	margin:0.5em;
}
.caution{color: red}

/*--- Info window ---*/
.autocomplete{position: absolute;z-index: 900;background: white;box-sizing: border-box;display: none;font-size: 100%;box-shadow: 0 2px 6px rgba(0,0,0,0.3);}
.autocomplete.active{display: block;max-height: 50%;overflow: scroll;z-index: 10000;}
.autocomplete li{list-style-type: none; margin:4px 0;cursor: pointer;display:flex;align-items: center;font-size: 14px;color: black;}
.autocomplete li.res {padding: 0px 6px;}
.autocomplete li.res i{color:#3faeeb}
.autocomplete li.section {background-color: #3c5d96;color: white;padding: 3px 6px;}
.autocomplete li p{flex:auto;}
.autocomplete li.error{color: red;}
.autocomplete span.icon{width: 21px;display: flex;justify-content: center;}
.autocomplete span.icon img{height: 21px;}
.autocomplete .flag{flex-basis:20px;margin-left:3px;}
.autocomplete .highlight{color: #8f6c3f;background-color: #FFEF7B;border: 1px solid #F19435;border-radius: 3px;}

/*-- a row result record--*/
.result{cursor: pointer}
.result:hover {background-color: whitesmoke}
.result h1{font-size: 85%;color: black}
.result .address{font-size: 85%;color:#333F48;}
.result .sd{font-size: 75%;color:#333F48;}
.result .detail{margin-top:3px;display: inline-flex;}
.result .type-icon{display: inline-block;text-align: -webkit-center;}
.result .type-icon p{font-size:60%;}
.result .type-icon img{vertical-align: middle;padding:0.2em;}
.result .thumb{display: inline-block;}
.result .thumb img{padding-right: 3px;width: 175px;border-radius: 8px;}
.result .smallIcons{display: inline-block;}
.result .open{color:green; font-size: 80%}
.result .closed{color:red;font-size: 80%}
.result .price{font-size: 80%;}

/*-- a popup window result record --*/
.popup-result{cursor: pointer}
.popup-result h1{font-size: initial;color: black}
.popup-result button{ color: white;padding: 5px 10px;border-radius: 3px;margin-right: 3px;cursor: pointer;font-size: 12px;-webkit-appearance: none;border:none;}


/*---Icons--*/
.previewIcons img {height: 18px;margin-right: 1px;border: 1px solid #00adef;padding: 4px;border-radius: 4px;background-color: #fff;}


.mapControls{position: absolute;top: 0;z-index: 1000;}
.mapControls .control{
	width: 30px;height: 30px;
	color: black;
	display: flex;
	align-items: center;
	margin: 0.5em 0 0 0.5em;
	flex-direction: column;
	justify-content: center;
	background: rgb(255, 255, 255);
	border: 2px solid rgba(0,0,0,0.2);
	border-radius: 5px;
}

.mapControls .control:hover{background:whitesmoke;}


.zoom{float:left; width:60px;height:24px; padding-left:24px;}
.zoomTo{background: url(../images/site/zoom_in.png) no-repeat; }
.zoomOut{background: url(../images/site/zoom_out.png) no-repeat;}

.rating-sprite {background: url(../images/site/star-rating-sprite-s.png) repeat-x;font-size: 0;height: 16px;line-height: 0;overflow: hidden;text-indent: -999em;width: 80px;display: inline-block;}
.rating {background: url(../images/site/star-rating-sprite-s.png) repeat-x;background-position: 0 100%;float: left;height: 16px;display:block;}
.thumb {display: block;text-align: center;}
	

	
.to-top-btn {position: fixed;bottom: 20px;right: 30px;text-decoration:none;background: #FFFFFF;display: none;margin:0;width: 16px;height: 16px;border-radius: 50%;}

.closed{color:red;}
.open{color:#4CAF50;}

.numberCircle:before {
    content: '\200B';
    display: inline-block;
    line-height: 0px;
    padding-top: 50%;
    padding-bottom: 50%;
    padding-left: 5px;
}
.numberCircle {
    display: inline-block;
    border-radius: 50%;
    font-size: 10px;
    background: red;
    color: white;
    text-shadow: none;
    position:absolute;
}

.numberCircle:after {
    content: '\200B';
    display: inline-block;
    line-height: 0px;
    padding-top: 50%;
    padding-bottom: 50%;
    padding-right: 5px;
}

#what3words slashes{color: #e11f26;font-weight: bold;font-size: x-large;}
.noCopy{-webkit-user-select: none;-webkit-touch-callout: none;-moz-user-select: none;-ms-user-select: none;user-select: none;cursor:not-allowed;}

	/*---ipad2/3---*/
	@media screen and (max-width: 980px) {
		.content-side{width:30%;float:left}
		.content-center{width:40%;float:left}
		.small-font{font-size:0.7em}
	}

	@media all and (max-width : 375px){
    	.content{width:375px}
      .modal input[type="checkbox"].ios8-switch + label {font-size: smaller}
      .modal .user_unit_icon {height: 26px;}
      .modal .unit_row .icon {width: 80px;}
  }
	@media all and (max-width : 360px){
    	.content{width:360px}

  }
  /*---iPhone 5---*/
  @media all and (max-width : 320px){
      
  }


