:root {
  --club-color: #D30009;  
}       



body {
            color:#404040;
            font:400 15px/22px 'Source Sans Pro', 'Helvetica Neue', Sans-serif;
            margin:0;
            padding:0;
            width: 100%;
            -webkit-font-smoothing:antialiased;
          }
  
          * {
            -webkit-box-sizing:border-box;
            -moz-box-sizing:border-box;
            box-sizing:border-box;
          }
  
          .sidebar {
            position:absolute;
            width:20%;
            height:100%;
            top:0;
			left:0;
			padding-bottom: 5px;
            overflow:hidden;
            border-right:1px solid rgba(0,0,0,0.25);
          }
          .pad2 {
            padding:20px;
          }
  
          .map {
            position:absolute;
            left:20%;
            width:80%;
            top:0;bottom:0;
          }
  
          h1 {
            font-size:22px;
            margin:0;
            font-weight:400;
            line-height: 20px;
            padding: 20px 2px;
          }
  
          a {
            color:#404040;
            text-decoration:none;
          }
  
          a:hover {
            color:#101010;
          }
  
          .heading {
            background:#fff;
            border-bottom:1px solid #eee;
            min-height:60px;
            line-height:60px;
            padding:0 10px;
            background-color: var(--club-color);
            color: #fff;
          }
		  
		  .heading h1{			
			line-height: 24px;
		  }
		  
  
          .listings {
            height:100%;
            overflow:auto;
            padding-bottom:60px;
          }
		  
		  
		  
  
          .listings .item {
            display:block;
            border-bottom:1px solid #eee;
            padding:10px;
            text-decoration:none;
          }
  
          .listings .item:last-child { border-bottom:none; }
          .listings .item .title {
            display:block;
            color:var(--club-color);
            font-weight:700;
          }
  
          .listings .item .title small { font-weight:400; }
          .listings .item.active .title,
          .listings .item .title:hover { color:var(--club-color); }
          .listings .item.active {
            background-color:#ededed;
			border-top: 1px solid var(--club-color);
			border-bottom : 1px solid var(--club-color);
          }
          ::-webkit-scrollbar {
            width:3px;
            height:3px;
            border-left:0;
            background:rgba(0,0,0,0.1);
          }
          ::-webkit-scrollbar-track {
            background:none;
          }
          ::-webkit-scrollbar-thumb {
            background:var(--club-color);
            border-radius:0;
          }
  
          .marker {
            border: none;
            cursor: pointer;
            height: 56px;
            width: 56px;
            background-image: url(logos/arsenal.svg);
            background-size: 56px;
            background-color: rgba(0, 0, 0, 0);
          }
  
          .clearfix { display:block; }
          .clearfix:after {
            content:'.';
            display:block;
            height:0;
            clear:both;
            visibility:hidden;
          }
  
          /* Marker tweaks */
          .mapboxgl-popup {
            padding-bottom: 50px;
          }


  
          .mapboxgl-popup-close-button {
            display:none;
          }
          .mapboxgl-popup-content {

font:20px/22px 'League Gothic', 'Source Sans Pro',Helvetica, Arial;
            padding:0;
            width:350px;
			border: 1px solid red;
          }
          .mapboxgl-popup-content-wrapper {
            padding:1%;
          }

		
          .mapboxgl-popup-content img {
		width: 125%;
}



          .mapboxgl-popup-content div.logo {
		float: left;
    position: relative;
width: 25%;
top: 5px;
}

.mapboxgl-popup-content div.description {
		float: left;
    position: relative;
top: 10px;
width: 73%;
height: 100%
}




          .mapboxgl-popup-content h3 {
            color:#bcbcb5;
text-transform: uppercase;
            margin:0;
            display:block;
            padding:2px;
            border-radius:3px 3px 0 0;
            font-weight:700;
            margin-top:-15px;
font-size: 100%;
          }

  
          .mapboxgl-popup-content h4 {
            margin:0;
            display:block;
            padding: 1px 1px 1px 1px;
            font-weight:400;
          }

.mapboxgl-popup-content a{
	color:#656565;
}
  
          .mapboxgl-popup-content div {
            padding:10px;
          }
  
          .mapboxgl-container .leaflet-marker-icon {
            cursor:pointer;
          }
  
          .mapboxgl-popup-anchor-top > .mapboxgl-popup-content {
            margin-top: 15px;
          }
  
          .mapboxgl-popup-anchor-top > .mapboxgl-popup-tip {
            border-bottom-color: #91c949;
          }

          .sportmapz-link{
            font-size: 10px;
            text-align: right;
          }
		  
		  .btn-control {
font:bold 12px/20px 'Helvetica Neue', Arial, Helvetica, sans-serif;
background-color: var(--club-color);
color: #fff;
position: absolute;
top: 20px;
right: 1%;
z-index: 1;
border: none;
width: 150px;
margin-left:-100px;
display: block;
cursor: pointer;
padding: 10px 20px;
font-size: 16px;
border: 1px solid #fff;
}
 
.btn-control:hover {
background-color: #fff;
color: var(--club-color);
border: 1px solid var(--club-color);
}

@media only screen and (max-width: 495px) {
  .mapboxgl-popup-content {
    max-width: 190px;
  }
  
  .sidebar{
	position:absolute;
	width: 30%;
  }
  
  .map{
	position:absolute;
	left:30%;
	width:70%;
  }
  
  .mapboxgl-popup-content h4 {
            
            font-size:75%;
          }
		  
  .mapboxgl-popup-content h3 {
            font-size: 75%;
          }
		  
		  .mapboxgl-popup-content h4.geocadder a {
            font-size: 65%;
          }
		  
		  button#zoomto{
			display: none;
		  }
		  
		  button.fa-home{
			position: absolute;
			bottom: 1%;
			width: 44px;
			height: 44px;
			padding: 4px;
			right: 29%;
			background-color: white;
			color: #8f8f8f;
			border-radius: 50%;
			border: 1px solid #8f8f8f;
			font-size: 23px;
		  }
		  
		  
		  .heading h1{			  
			font-size: 90%;
			font-weight: 700;
			line-height: 20px;
		  }
		  
		  .listings .item {			  
			font-size: 78%;
		  }
		  
}

.sportmapz-logo-small img{
  width: 80px;
}