/* Windows */
.collection-menu{
	z-index: 1001; 
	position: absolute; 
	top: 47px; 
	left: -400px; 
	bottom: 0px; 
	overflow-y: auto; 
	overflow-x: hidden;
	padding:5px;
}
.full-page{
	background-color: #73B5E5; 
	z-index: 1001; 
	display: none; 
	position: absolute; 
	top: 47px; 
	left: 0px; 
	right: 0px; 
	bottom: 0px; 
	overflow-y: auto; 
	overflow-x: hidden
}
.bar-bottom{
	z-index: 1; 
	position: absolute;
	height: 47px; 
	left: 0px;
	right: 0px; 
	bottom: 0px; 
	text-align: center
}

/* Youtube */
.youtube.large{
	width:100%;
	max-width: 640px;
	height:100%;
	max-height:360px;
	text-align:center;
	background: rgba(255,255,255,0.5);
	   
}

.youtube .video-frame{
	width:310px;
	height:175px;
	z-index:3003;
}
.youtube.large .video-frame{
	width:470px;
	height:355px;
}

.surfResult{
	position:absolute;
	top:40px;
	right:50px;
	max-width:700px;
	max-height:100%;
	bottom:45px;
	overflow-y:auto;overflow-x:hidden;
	border-radius:10px;
}

.instagram-surf, .foursquare-surf, .youtube-surf{
	position:absolute;
	top:40px;
	right:0px;
	max-width:700px;
	max-height:100%;
	bottom:45px;
	overflow-y:auto;overflow-x:hidden;
	border-radius:10px;
}


.options .btn{
	width: 90%;
	margin-top:5px;
	font-size:13px;
	color:#666;
}

.media{
	min-height: 70px;
}
.visible-mobile-only{
  	display: none;
  }

 #side-menu{
	 width:300px;
 }

.wide{
	
	  padding-right: 0px;
	  padding-left:  0px;
	  margin-left:-10px;
	  margin-right:-10px;
	  border-radius: 0;
}
 
.desktop-collection{
	height:100%;
	overflow-y:auto;
	overflow-x:hidden;
	padding:10px;
	border-radius:10px;
	background-color:#054052;
}

.explorer{
	max-width: 500px;
    background-color:#054052;
    color: white;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}

.desktop,.input-group-addon
{
    color:white;
    background-color:rgba(0,53,69,1);
    background-color:#054052;
    border-radius: 10px;
}
  
.input-group-addon{
  border:none;
}

.comment
{
  color:white;
  background-color:rgba(0,53,69,1);
  background-color:#054052;
  max-width:500px;
  padding-top:10px;
  padding-left:10px;
  padding-right:10px;
  padding-bottom:0;
  border-radius: 10px;
}

.comment, .lightblue{
	background-color:#0D699E;
}

.media.articlelink{
   position:relative;
   margin-top:5px;
   height:150px;
   width:250px;
   border-radius:2px;
   float:left;
   cursor: pointer;
 }
 .note-video.large, .note-video.large iframe{
   height:305px;
   width:500px;
 }
 
 .media.instagram{
   position:relative;
   margin-top:5px;
   border-radius:2px;
   float:right;
 }
.project-summary
{
  color:white;
  background-color:rgba(0,53,69,1);
  max-width:500px;
  padding:10px;
  margin-bottom:10px;
}

.create-first-note-desktop{
	padding: 5px; 
	max-width: 500px; 
	margin-left:15px;
}
.create-first-note-mobile, .create-first-collection{
	padding: 5px; 
	max-width: 500px; 
	text-align:center;
}

.leaflet-popup-content-wrapper, .leaflet-popup-content .leaflet-container img{
	max-width: 150px !important;
    max-height: 150px !important;
}   
.popup-image{
	max-width: 110px !important;
    max-height: 110px !important;
} 

@media (max-width: 683px) {
	
  .visible-md-only {
  	display: none;
  }
  .visible-mobile-only{
  	display: initial;
  }
  
  .posts
  {
    color:white;
    max-width:500px;
    padding:10px;
    margin-bottom:10px;
  }
  #videos-result .media.articlelink{
    float:none;
  }
   .instagram{
      width:120px;
      float: initial !important;
      display: inline-block;
  }
   .image-zoom{
       display:none;
   }
   .image-link{
       top:10px;
   }
   .video-title{
   		font-size:10px;
   }
   
   .youtube{
	   float:initial !important;
	   display:inline-block;
   }
   .instagram-surf {
   		max-width:150px;
   }
   .foursquare-surf, .youtube-surf
   {
   	top:50%;
   	width:100%;
   	text-align:center;
   	float:initial;
   }
}

@media (max-width: 300px) {
	 #side-menu{
		max-width:300px;
	 }
}

.summernote,.summernote label, #summernote label{
	color: #333 !important;
}



