.epmain {
    width: 70%;
    margin: 20px auto;
	margin-top: 50px;
}

/* Video grid layout */
.epsub {
    margin: 15px 0;
    padding: 2px;
    max-width: 100%;
}

.adminmsg {
	top: 40px;
	z-index: 6;
	position: absolute;
}


div.cmbar {
	overflow: hidden;
    background-color: #4682B4;
	top: 500;
	width: 100%;
}
.ft {
	background-color: #999;
    position: fixed;
	bottom: 0;
	padding: 10px;
	width: 100%;
	z-index: 1;
}
.hdr {
	background-color: #333;
    position: fixed;
	top: 0;
	padding: 10px;
	width: 100%;
	z-index: 1;
}
a {
	color: blue;
}
a:hover {
	color: #008B8B;
	text-decoration: none;
}
h2 {
	color: blue;
}
.cmimg {
	border-radius: 30px;
	height: 35%;
	width: 100%;
	overflow: hidden;
    box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.34);
    border: 2px solid #ffffff;
    background: #fff;
	
}
.divtimeline {
	background-color: #E0FFFF;
	border-radius: 20px;
	padding: 10px;
    position: relative;
	width: 99%;
}
.communityname {
	text-align: left;
	position: relative;
}
.communityname h2{
	font-family: "Verdana", serif;
  font-weight: 400;
  font-style: normal;
}
.communityname a{
	font-family: "Trebuchet MS", Tahoma, sans-serif;
}
.discrdiv {
	font-family: "Trebuchet MS", Tahoma, sans-serif;
}
.open-button {
  background-color: #555;
  color: white;
  padding: 5px;
  border: none;
  border-radius: 30px;
  cursor: pointer;
  opacity: 0.8;
  position: fixed;
  bottom: 8px;
  right: 8px;
  width: 120px;
  z-index: 9;
  display: block;
}
@media all and (max-width: 499px) {
.epmain {
    width: 100%;
	margin-top: 45px;
}

/* Video grid layout */
.epsub {
    padding: 2px;
    max-width: 100%;
}

.cmimg {
    border-radius: 30px;
	height: 180px;
	width: 98%;
	overflow: hidden;
    box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.34);
    border: 2px solid #ffffff;
	text-align: center;
    background: #fff;
    }
.divtimeline {
	background-color: #E0FFFF;
	border-radius: 20px;
	padding: 2px;
    position: relative;
	width: 100%;
}
.communityname {
	text-align: left;
	position: relative;
	}
}
.communityname .btn-default	{
float: right;
}

.cmimg label{
display:none;
}
.abcde label{
display:none;
}
.cmimg:hover label{
    display: block;
}
.abcde:hover label{
    display: block;
}
.cmimg img {
	border-radius: 30px;
	border: 10px;
	height: 100%;
	width: 100%;
}

.headnavbar2 {
    position: fixed;
	top: 0;
	left: 0;
	z-index: 1;
	width: 100%; height: 2%;
}
.memberlist	{
	left: 1%;
	width: 100%;
	max-width: 100%;
	z-index: 1;
	position: relative;
}

.divcontent {
    position: absolute;
	top: 70%;
	left: 1%;
	width: 100%;
	max-width: 100%;
	

}
.divitemlist {
    position: absolute;
	top: 10;
	width: 100%;
	
}
.avatar {

  width: 50px;
  height: 50px;
  border-radius: 50%;
}
.avatar2 {
  width: 40px;
  height: 40px;
  border-radius: 80%;
}

.dpimage {
	width: 150px;
	height: 150px;
	border-radius: 80%;
	border: 2px dotted grey;
	float: left;
}

.profilearea	{
	top:30%;
	left:5%;
	position:absolute;
	z-index:1;
	width:100%;
	height:100%;
}

.profname {
	color: red;
	left: 5%;
	clear: both;	
}
.home_profname {
	color: red;
	left: 5%;
	top: 55%;
	left: 10%;
	position: absolute;
}
.postarea {
	top: 20px;
	position: relative;
	max-width: 90%;
}
.postviewarea {
	border: 1px dotted grey;
	margin: 10px;
	padding: 20px;
	text-align: left;
	position: relative;
	max-width: 700px;
	border-radius: 30px;
	
}

.content:hover {
  animation: shake 5s;
  animation-iteration-count: infinite;
}

@keyframes shake {
  0% { transform: translate(1px, 1px) rotate(0deg); }
  10% { transform: translate(-1px, -2px) rotate(-1deg); }
  20% { transform: translate(-3px, 0px) rotate(1deg); }
  30% { transform: translate(3px, 2px) rotate(0deg); }
  40% { transform: translate(1px, -1px) rotate(1deg); }
  50% { transform: translate(-1px, 2px) rotate(-1deg); }
  60% { transform: translate(-3px, 1px) rotate(0deg); }
  70% { transform: translate(3px, 1px) rotate(-1deg); }
  80% { transform: translate(-1px, -1px) rotate(1deg); }
  90% { transform: translate(1px, 2px) rotate(0deg); }
  100% { transform: translate(1px, -2px) rotate(-1deg); }
}
.abcd{
    width: 150px;
    height: 150px;
    border-radius: 80%;
    overflow: hidden;
    box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.34);
    border: 2px solid #ffffff;
    position: absolute;
    left: 120;
    right: 0;
    top: 200;
    margin: 0;
	text-align: center;
    background: #fff;
	z-index: 1;
}
.abcde{
    width: 150px;
    height: 150px;
    border-radius: 80%;
    overflow: hidden;
    box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.34);
    border: 2px solid #ffffff;
    position: absolute;
    left: 5%;
    top: 30%;
    margin: 0;
	text-align: center;
    background: #fff;
	z-index: 1;
}
.abcd label{
display:none;
}
.abcd:hover label{
    display: block;
}
.centered {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.follow_dropdown {
float: left;
padding: 15px;
z-index: 1;
}
.AllPosts_follow {
z-index: 1;

}

.pagination a {
  color: black;
  float: left;
  padding: 8px 16px;
  text-decoration: none;
  transition: background-color .3s;
  border: 1px solid #ddd;
  margin: 0 4px;
}

.pagination a.active {
  background-color: #4CAF50;
  color: white;
  border: 1px solid #4CAF50;
}

.pagination a:hover:not(.active) {background-color: #ddd;}

.imgcrop {
display: block;
max-width: 100%;
}
.preview {
overflow: hidden;
width: 160px; 
height: 160px;
margin: 10px;
border: 1px solid red;
}
.imageinpost	{
	border: 2px dotted grey;
	 width: 100%;
	 height: auto;
}
