*{box-sizing:border-box;padding:0;margin:0;}
 body{font-family:'Raleway', sans-serif;background: #F9F1D4;background: linear-gradient(90deg,rgba(249, 241, 212, 1) 0%, rgba(255, 243, 196, 1) 100%);color: #04537b;font-size:14px;}
 body.city-home{position:fixed;width:100%;height: 100%;}
 nav{
  background: #F9F1D4;
  background: linear-gradient(90deg, rgba(249, 241, 212, 1) 0%, rgb(255 250 232) 100%);
  padding:0 1em;
  position:relative;
  width:100%;
  }
 ul{list-style-type:none;}
 a{color: #3d4549;text-decoration:none;}
 h1{font-weight:normal}
 a:hover{color:#333 }

 .top-logo a:hover{text-decoration:none;}
 .top-menu li{font-size:1em;padding:5px 0;white-space:nowrap;}
 .top-logo a{font-size:1em;}
 .top-menu img{height:20px;vertical-align:middle;margin-right:0.5em;}
 .top-menu .top-sponsor img{height: 2em;padding: 0;}
 .item.button button{padding: 0.3em 1em;background:#1dab32;color:white;}
 .button.secondary a{background:#3f5c6f;color:white;}
 .button a:hover{text-decoration:none;}
 .button:not(.secondary) a:hover{background:#c70c34;}
 .button.secondary a:hover{color:#ddd;}
 
 .zoom{transition:transform .3s;}
 a:hover .zoom{transform:scale(1.05);}
 
 #add_point_button_top{z-index:1;display:block;min-width:8em;border:none;font-size:1em;font-family:'Nunito', sans-serif;cursor: pointer;border-radius: 0.5em;}
 #add_point_button_top span{}
 #add_point_button_top:before{content:"";display:inline-block;vertical-align:top;width:1.3em;height:1.3em;margin-right:0.5em;background:url(../img/plus.svg);background-repeat:no-repeat;background-position:center center;}
 #add_point_button_top.active:before{background:url(../img/x.svg);background-repeat:no-repeat;background-position:center center;}
 #add_point_button_top.active{background:#b3b3b3;}
 #add_point_button_top .cancel{display:none}
 #add_point_button_top.active .cancel{display:inline}
 #add_point_button_top .add{display:inline;}
 #add_point_button_top.active .add{display:none}
 
 .top-menu{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;z-index:11;}
 .top-menu li.top-logo{flex:1;padding-left: 0;padding-right: 0;}
 #toggle_menu{order:1;margin-left:1em;}
 .top-menu .item.button{width:auto;order:1;display:block;position:relative;}
 .top-menu .item{width:100%;text-align:center;order:3;display:none;}
 .top-menu .item.active{display:block;}
 
 #mobile_menu{position:absolute;top:100%;right:0;background: #f9f1d4;border:1px solid #ccc;padding:0 4em;z-index:10;overflow:hidden;max-height:0;opacity:0;transition:max-height 0.3s ease-in-out,opacity 0.1s ease-in-out;}
 #mobile_menu.active{max-height:10em;opacity:1;}
 #mobile_menu ul{}
 #mobile_menu li{}
 #mobile_menu li a{display:block;width:100%;font-size:1.5em;padding:0.3em 0;}
 
 .page-content{font-size:1.1em;}
 .page-content p{margin-bottom:1em}
 .page-content ul{list-style-type:disc;margin-left:2em}
 div.page{padding:2em;color:#666;max-width:900px;margin:0 auto;}
 h1.page-title{font-size:2em;font-weight:normal;margin-bottom:1em;}
 
 .cities-list{padding:5px 30px;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-start;margin-top:15vh;}
 .cities-list-item{flex:1 300px;margin:0 5% 10% 5%;text-align:center;}
 .cities-list-item a{display:block}
 .cities-list-item span.image{display:inline-block;width:150px;height:150px;vertical-align:middle;}
 .cities-list-item span.image img{object-fit:cover;width:150px;height:150px;border-radius:50%;}
 .cities-list-item span.name{display:block;margin:1em;}
 .cities-list-item span.name h1{font-size:3em;font-weight:normal;}
 .cities-list-item span.description{display:block;border-top:1px solid #ccc;padding-top:1em;}
 
 #partners{text-align:center;padding:10% 0 10% 0;}
 #partners img{width: 640px;max-width: 90%;}
 .partners-text{font-size:0.5em}
 
 .city-home.container{display:flex;flex-direction: column;height: calc(100% - 80px);}
 .city-home.map-container{flex-basis: 50%;border-top:1px solid #ccc;position:relative;}
 #main-map{height:100%}
 .city-home.list-container{flex-basis: 50%;overflow-y:auto;border-top:1px solid #ccc;position:relative;padding-bottom:10em;}
 .city-home.list-container li{display:flex;min-height:50px;border-bottom: 1px solid #ccc;background: #fffbe6;background: linear-gradient(90deg, rgba(249, 241, 212, 1) 0%, rgb(255 250 232) 100%);padding:0.5em 1em;color: #3d4549;cursor:pointer;}
 .city-home.list-container li.selected{background: #fff;}

 .city-home.partners{text-align:center;border-top: 1px solid #ccc;height: 40px;}
 .city-home.partners img{max-height: 100%;max-width:90%;}
 
 #filters{position:absolute;display:flex;bottom:0;left:0;background:#fff;padding:0 0.5em;font-size: 1.2em;width:100%;}
 #filters .filter-name{font-weight:bold;margin-right:0.5em;}
 #filter_status, #filter_category{background:#fff;height:2em;line-height:2em;overflow:hidden;margin-right:1em;white-space:nowrap;cursor:pointer;}
 #filters ul.select{position:absolute;bottom:2em;background:#fff;color:#333;max-height:30vh;overflow-y:auto;overflow-x:hidden;display:none;}
 #filters li{padding:0 0.5em;}
 #filters li.all{color:#fff;background:#666;}
 #filters li.all:hover{color:#666}
 #filters li.main{font-weight:bold}
 #filters li.status{color:#fff}
 #filters .filter-value{color:white;height:1.4em;line-height:1.4em;min-width:7em;text-align:center;font-size:0.8em;display:inline-block;background-color:#666;padding:0 0.5em;}
 #filters li:hover{background:#eee;cursor:pointer;}
 #filters li .count{display:inline-block;background:#666;color:#fff;text-align:center;vertical-align:middle;height:1.4em;line-height:1.4em;font-size:0.6em;padding:0 0.5em;margin-left:1em;}
 
 #point_list span{display:block;}
 #point_list .side{margin-right:1em;width:64px;}
 #point_list .point_icon {width:64px;height:64px;}
 #point_list .point_icon.user-image{border-radius:50%;border-width: 4px;border-style: solid;}
 #point_list .social{transition: transform 0.5s ease-in-out;transition-delay: 1s;/* opacity:0; */transform: scale(0);transform-origin: top left;/* justify-content: flex-start; */}
 #point_list .date{text-align: right;line-height: 22px;}
 #point_list .selected .social{flex: 1;transform: scale(1);}
 #point_list .social img{width: 20px;height: 20px;margin: 1px;vertical-align: middle;}
 #point_list .social img:hover{ filter: brightness(200%); }
 #point_list .data{flex:1;}
 #point_list .title{font-weight:bold;font-size:1em;}
 #point_list .descr{font-size:0.8em;line-height: 1.2em;max-height: 1.1em;overflow:hidden;transition:max-height 0.3s ease-out;color: #000;}
 #point_list .reply{margin-top: 1.5rem;border: 1px solid #20587c;border-radius: 5px;padding: 1.5rem 0.5rem 0.5rem 1.5rem;position: relative;background-color: #fbfdff;}
 #point_list .reply .reply_badge{position:absolute; top:0; left:0; font-size: 80%;padding: 0 3px;background-color: #20587c;border-bottom-right-radius: 5px;color: white;}
 #point_list .photos{
    /* margin-top: 0.5em; */
}
 #point_list .photos img{margin-right:2%;margin-top: 1.1em;max-width:48%;max-height:128px;border-radius: 9px;}
 #point_list .bottom-meta{font-size:0.8em;margin-top: 2em;padding-top: 0.5em;/* border-top: 1px solid #ccc; */display: flex;}
 #point_list .bottom-meta span{/* flex: 1; */}
 #point_list .bottom-meta a{font-weight:bold;margin-right:1em;/* line-height: 20px; */}

 #point_list li.selected .reply{margin-top: 0.5rem;}
 #point_list li.selected .details{display:block}
 #point_list .meta span.status, #point_list .meta span.category{/* display:inline-block; */font-size:0.6em;padding:0 0.5em;}
 #point_list .meta{margin-bottom:0.5em;display:flex;}
 #point_list .meta .status{color:white;height:1.4em;line-height:1.4em;min-width:7em;text-align:center;border-radius: 0.5em;}
 #point_list .meta .category{font-weight:bold;color:#888;}

 #point_list .meta .votes{margin-left: auto;font-weight: bold;font-size: 12px;background-image: url(/img/thumb-up.svg);background-repeat: no-repeat;background-size: 13px;background-position: top right;padding-right: 20px;}
 #point_list .meta .votes:hover{background-image: url(/img/thumb-up-filled.svg)}
 #point_list .meta .votes.loading{opacity:0.2}
 
 #add_point_form{position:absolute;width:100%;min-height:100%;top:0;left:0;background:#fff;display:none;padding:2em;padding-bottom:60px;}
 #point_list.hide{display:none}
 #add_point_form.show{display:block}
 #add_point_form .header{margin-bottom:1em}
 ::placeholder{color:#ccc;font-family:sans-serif;}
 .form-group{display:flex;flex-direction:column;position:relative;}
 .form-group label{flex:none;display:block;min-width:7em;font-weight:bold;font-size:1.1em;}
 .form-group label span{display:inline-block;font-weight:normal;font-size:0.8em;margin-left:1em;}
 .form-group .input-control{flex:1;display:block;margin-bottom:1em;padding:0.5em;border:1px solid #ccc;font-size:1em;color:#666;}
 .form-group select.input-control{width:100%;padding:0.5em;}
 select:invalid{color:#b51a1a;}
 .form-group .input-control option{min-height:1.5em;}
 .form-group .input-control option:disabled{color:#b9b9b9;}
 .validation-error{background:#c70c34;color:#fff;padding:0.2em 1em;}
 .form-group .validation-error{position:absolute;top:0;right:0;font-size:0.8em;padding:0 1em;}
 #add_point_form button{font-family:'Nunito', sans-serif;padding:0.3em 1em;margin-bottom:1em;min-width:8em;background:#b3b3b3;color:white;border:none;font-size:1em;border-radius: 0.5em;}
 #add_point_form button:before{content:"";display:inline-block;vertical-align:top;width:1.3em;height:1.3em;margin-right:0.5em;background-repeat:no-repeat;background-position:center center;}
 #add_point_save_button:before{background:url(../img/plus.svg);}
 #add_point_cancel_button:before{background:url(../img/x.svg);}
 #add_point_form button.primary{background:#1dab32;}
 #add_point_form button.primary:disabled{background:#bf808d;}

#city_home_photo_overlay{position:fixed;top:0;background:#000000b3;height:100vh;width:100%;color:#fff;padding-top:10vh;display:none;}
#city_home_photo_overlay left, #city_home_photo_overlay right{position:absolute; top 50%;}
#city_home_photo_overlay left{}
#city_home_photo_overlay right{}
#photos_container{height:100%; overflow-x:auto; overflow-y:hidden; white-space:nowrap;padding-left:1em;text-align:center;scroll-behavior:smooth;}
#photos_container img{height:75%;margin-right:1em;}
#city_home_photo_overlay .left, #city_home_photo_overlay .right{position:absolute;top:26vh;font-size:6em;cursor:pointer;line-height:34vh;}
#city_home_photo_overlay .left{left:2%;}
#city_home_photo_overlay .right{right:2%;}
#city_home_photo_overlay .close{position:absolute;top:10vh;right:2%;font-size:6em;cursor:pointer;line-height:0.6em;}

.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } 
.embed-container.mobile{padding-bottom: 178.25%;}
.embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

.desktop{display:none;}
.mobile{display:block;} 

.voting{
  background:#1dab32;
  color:white;
  padding:0.5em 0.5em;
  margin-bottom:0.5em;
}
.voting-result{
    background:#2b7937;
    border:1px solid #fff;
    padding:0.1em 0.5em 0.1em 0.1em;
    margin-bottom:0.5em;
    width: 5em;
   
}
.voting-result.winner{
    background:#ffef2c;
    color:#795700;
    font-weight:bold; 
    font-size:120%
}
 @media all and (min-width:600px){
   body{font-size:16px;}
   .top-menu{}
   .top-logo{}
   .top-logo a{font-size:1.5em;}
   .top-menu img{height:30px;vertical-align:middle;}
   .top-menu .top-sponsor img {height: 5em;padding: 1em;}
   #toggle_menu{text-align:right;order:2;}
   .cities-list-item span.image,.cities-list-item span.image img{width:180px;height:180px;}
   .city-home.map-container{/* height: calc(100vh - 180px); */}
   .city-home.list-container{/* height: calc(94vh - 60px); */}
   .desktop{display:block;}
   .mobile{display:none;} 
 }
 @media all and (min-width:900px){
   .top-menu .item{display:block;width:auto;}
   body{font-size:18px;}
   #toggle_menu{display:none;}
   .top-logo{order:0;}
   .top-logo a{display: inline-block;/*! font-size: em; *//* height: 60px; */font-weight:normal;/* vertical-align: middle; */}
   .top-logo img{height:41px;vertical-align:middle;}
   .top-menu .top-sponsor img {height: 9em;padding: 1em;}
   .top-menu .item{order:1;}
   .button{order:2;}
   .top-menu li{padding: 0.8em;}
   .top-menu li.button{padding-right:0;}
   .cities-list-item span.image,.cities-list-item span.image img{width:200px;height:200px;}
   .form-group{flex-direction:row;}
   .form-group .input-control{}
   .form-group label span{display:block;margin-left:0;}
   #add_point_form{padding-bottom:1em}
   #add_point_form button{margin-right:1em;}
   .desktop{display:block;}
   .mobile{display:none;} 
   .city-home.container{
    flex-direction: row;
    height: calc(94% - 70px);
}
   .city-home.map-container{/* height: calc(100vh - 160px); */height: 100%;}
   .city-home.list-container{height: 100%;}
   
    .city-home.partners{text-align:center;border-top: 1px solid #ccc;height: 6%;}
    .city-home.partners img{max-height: 100%;max-width:90%;}

}
@media all and (max-width:600px){
   #add_point_button_top:before{margin-right:0}
   #add_point_button_top{min-width:2.5em;}
   #add_point_button_top .cancel,#add_point_button_top.active .cancel{display:none}
   #add_point_button_top .add,#add_point_button_top.active .add{display:none}
}
@media (hover:hover){
  .city-home.list-container li:hover{background: #fff;}
}