cagettepei/www/css/_map.scss

/*
  Group map on /group/map
*/
.group-map {
	height: 100vh;
	width: 100%;

  	.groups {
		width: 100%;
		height: calc(100vh - 130px);
    	overflow-y: scroll;
    
    	.groupBlock {
      		cursor: pointer;
      
			&.focused {
				//background-color: #AAA;
				//.clickable has already a hover state
			}

			img{
				width:92px;
				float:left;
				margin-right:12px;
			}
    	}
  	}

  //reset padding in containers
  #mapContainer{padding:0;}

  .form-group-container{
    padding-top: 35px;
    //the autocomplete field
    .form-group {
      display: inline-block;
      width: 50%;
      /*margin-left: auto;
      margin-right: auto;
      margin-top: 5rem;
      */
    }
  }
  
  #logo{
    background-image: url(/img/logo3.png);
    background-repeat: no-repeat;
    background-position: center;
    height: 130px;
  }

  .leaflet-container{
    //compute map height
    height: calc(100vh - 130px);
  }

.leaflet-popup-content{
	.groupName{
		text-align: center;
		font-weight: bold;
		font-size: 1.2em;
		font-family:Cabin,Helvetica,Arial,sans-serif;
		margin-top: 8px;
	}
	.groupImage{
		max-width: 120px;
		max-height: 120px;
		display:block;
		margin:auto;
	}
	a{
		color:#3c763d;
	}

}
  /*
 		AUTOCOMPLETE 
  */
  .autocomplete-input,
  .autocomplete-input:focus,
  .autocomplete-input:active {
    box-shadow: 0 2px 2px 0 rgba(0,0,0,0.16), 0 0 0 1px rgba(0,0,0,0.08);
    border: honeydew;
    display: block;
    width: 100%;
    padding: 16px;
    font-size: 16px;
    border-radius: 2px;
    outline: none;
  }

  .autocomplete-results {
    position: fixed;
    width: 50%;
    border-bottom: honeydew;
    border-left: honeydew;
    border-right: honeydew;
    border-top: 1px solid #e6e6e6;
    box-shadow: 0 2px 4px rgba(0,0,0,0.2);
    border-radius: 0 0 2px 2px;
    z-index: 1001;
  }

  .autocomplete-item {
    padding: 4px;
    text-align: left;
  }

  .autocomplete-icon {
    margin-right: 8px;
  }

  .fa.fa-map-marker.header {
    color: #e53935;
  }


  .icon {
    cursor: pointer;    
  }

  .popup {
    cursor: pointer;
  }
}