#group-page {
	background-color: #e9ecef;
}

#acceptation-list {
	margin-bottom: 55px;
}

body {
	width: 100%;
    overflow-y: scroll !important;

}

.overflow {
	margin-top: 40px;
	overflow-x: hidden;
	position: relative;
}



a {
	color: black;
}

a:hover {
	color: black;
}

h2 {
 margin-bottom: 20px;
}

#contents h2 {
	padding-top : 50px;
}

#logo-teller {
	margin-top: -7px;
	height: 27px;
	width: 27px;
}

#admin-option {
	display: flex;

}

#link-leave {
	min-width: 90px;
}

#list-group a:hover {
	color: black;

}

#link-group-gestion {
	margin-left: 10px;
	padding-left: 10px;
	border-left: black solid 1px;
	min-width: 80px;
}


#friend-list {
	padding-left: 30px;
}

#add-friends-lists {
	padding-left: 30px;
}


#teller {
	border: black solid 1.2px;
	border-radius: 8px;
	height: 35px;
	padding-left: 8px;
	padding-right: 12px;


}


#teller a {
	color: black;
	font-family: 'Pacifico', cursive;
	
}

#teller a:hover {
	color: black;
	text-decoration: none;

}

.navbar-text {
	font-size: 15px;
	font-family: 'Pacifico', cursive;
}






#groupBarSection {
	width: 180px;
	height: 100%;
	overflow: hidden;
	position: fixed;
	background-color: #41e078;
	border-right: solid #cccccc 1px;
}



#groupBar {
	width: 109%;
	height: 100%;
	padding-top: 15px;
	padding-bottom: 100px;
	overflow: auto;
}

#groupBar a {
	color: black;
}

.underline:hover {
	text-decoration: underline !important;

}

#groupBar a:hover {
	text-decoration: none;
}



#groupBar h2 {
	text-align: center;
	font-size: 24px;
	margin-right:20px;

}

#link-newGroup {
	margin-top: 20px;
	padding-top: 15px;
	border-top : solid black 2px;
	text-align: center;

	margin-left: 10px;
}

#memberBar h3 {
	margin-bottom: 20px;
	font-size: 24px;
}

#groupBar div {
	width: 100%;
	min-height: 35px;
	font-size: 16px;
	padding-left: 10px;
	padding-top: 7px;
	padding-bottom: 7px;

}

#groupBar h4 {
	font-size: 20px;
	text-align: center;
	margin-right: 27px;
	margin-left: 10px;
	border-top: solid black 2px;
	margin-top: 20px;
	padding-top:14px;
}

#groupBar p {
		margin-bottom: 0px;
			margin-right: 27px;
  overflow: hidden;
  text-overflow: ellipsis; 
}

#groupBar div:hover {
	background-color: #45c170;
}

#groupBar input {
	border: solid green 1px;
	border-radius: 5px;
	margin-left: 10px;
	width: 80%;
	margin-bottom: 15px;
}

#groupBar label {

	margin-left: 10px;
}

#groupBar #login-title {
	font-size: 21px;
	margin-left: 10px;
	margin-right: 30px;
	padding-bottom: 25px;
	margin-bottom: 25px;
	border-bottom: black solid 2px;
}

header {
	position: fixed;
	top: 0px;
	height: 40px;
	width: 100%;
	background-color: #1C9A3E;
	z-index: 10;
	border-bottom : solid black 1px;
}

.loger {
	display: flex;
}

.loger a {
	height: 40px;
	padding-left: 10px;
	line-height: 40px;
	color: black;
	font-family: 'Pacifico', cursive;
	
}


.loger a:hover {
	color: black;

}


#member-link {
	margin-top: 20px;
	padding-top: 15px;
	border-top : solid black 2px;
	margin-left:10px; 
	margin-right:10px;
}

#memberBar {
	width: 180px;
	height: 100%;
	background-color: #41e078;
	position: fixed;
	right: 0px;
	padding-top: 15px;

}

#memberBar div {

}


#memberBar div h4 {
	font-size: 20px;
}

#memberBar a {

 color:black;
}

.center {
	text-align: center;
}

#navbar {
	margin-left: 180px;
	padding-top : 0px;

}

#navbar a {

}


#contents {
	margin-top: 40px;
}

#nav-option a {
	color: green;
}

#nav-option span {
	color: green;
}

#nav-option span:hover {
	text-decoration: underline;
}

#couv-picture {
	width: 100%;

}

#couv-picture-block {
	max-height: 250px;
	width: 104.5%;
	overflow: hidden;
	margin-left: -25px;
	margin-right: -25px;

}



.groupView .jumbotron {
	background-color: white;
}


.jumbotron {
	padding: 10px;
	
	border : solid #cccccc 0.5px;
}


.edit-post:hover {
	text-decoration: underline;
}




.action-post {
	padding-top: 40px;
	clear: both;
}

.creationDate {
	float: right;
}

.comment-creationDate {
	font-size : 12px;
	float: right;
}






.comment-option {
	margin-top : 3px;
	float: right;
}

.comment-content textarea {
	border-radius: 5px;
	margin-bottom: 5px;
	width: 100%;
}

.add-comment {
	float: right;
}

#newGroup p, #edit-acompte p {
		margin-bottom: 0px;
}

#edit-acompte .btn {
	margin-top: 20px;
}

#edit-acompte h3,  #inscription-form h3, #login-form h3 {
	margin-bottom: 30px;
}

#edit-acompte .jumbotron {
	padding: 20px;
}

#edit-acompte input, #add-member-group select, #inscription-form input, #login-form input, #admin-group-page select, #create-post input  {
	border-radius: 5px;
	border : solid 1px grey;
}


#new-group-form label {
	margin-top: 20px;
}

#new-group-form .btn{
	float: right;
}

#titleGroup {
	width: 45%;
}

#new-group-form p, #add-member-group p {
	margin-bottom: 0px;
}

#new-group-form .jumbotron, #add-member-group .jumbotron, #login-form .jumbotron, #inscription-form .jumbotron, #admin-group-page .jumbotron {
	padding: 20px;
}

#inscription-form .btn, #login-form .btn {
	margin-top: 20px;
}

#addGroup {
	margin-top: 20px;
	float:right;
}

#add-member-group h4 {
	margin-top: 15px;
	margin-bottom: 15px;
}

#add-member-group .btn-success {
	margin-bottom: 10px;
}

#admin-group-page {
	padding-left: 20px;
}

#admin-group-page h4 {
	margin-top : 20px;
}

#valid-status {
	margin-top: 10px;
}

#description-bloc {
	max-width: 1000px;
	margin: auto;
	margin-bottom: 40px;
	padding-left: 20px;
	padding-right: 20px;
	padding-top : 7px;

}

#group-page h2 {
	padding-top: 10px;
	margin-left: 20px;
	margin-bottom: 10px;
}

#nav-option {
	margin-left: 20px;
	margin-bottom: 35px;
}

#valid-status {
	margin-top: 0px;
}

#etat-group {
	position: relative;
	bottom: 4px;
	border : solid black 1px;
	border-radius: 5px;
	margin-left: 10px;

	font-size: 14px;
	padding: 2px;
	padding-left: 12px;
	padding-right: 12px;
}

#status-group {
	text-align: center;
	margin-left : 10px;
	margin-right : 10px;
	font-size:13px;
	padding-bottom : 15px;
	border-bottom : solid black 2px;
}

.green {
	background-color: #1C9A3E;
}

.blue {
	background-color: #93bcff;
}


.comment-content em {
	margin-bottom: 1px;
}

#create-post {
	max-width: 900px;
	margin: auto;

}

#create-post .jumbotron {
	padding: 20px;
	padding-bottom: 70px;
	
}

#create-post h3 {
	margin-bottom: 20px;
}

#create-post .btn {
	float: right;
	margin-top: 15px;
}


.slide {
	height: 100%;
	width: 120px;
	position: absolute;
	left: 86%;
	margin-top: -20px;
	z-index: 1;

}




#group-page {
	
	margin-top: 40px;
	margin-left: 180px;
	margin-right: 180px;
	padding-bottom: 60px;
	 
}

#contents {
			padding-left: 35px;
	padding-right: 35px;
}

.postBox {
	padding-top: 20px;
	padding-left: 30px;
	padding-right: 30px;
	padding-bottom: 20px;
}


.post-content {
	display: flex;
}

.postBox {
	position: relative;
	left: 12.5%;
	z-index: 5;
	transition: left 1s;
}

.comment-content {
	margin-right: 210px;
	margin-left: 3px;
	position: absolute;
	width: 265px;
	right: 10%;
	transition: right 1s;
	z-index: 3;

}

.right {
	left: 0% !important;
}


.left {
	right:-180px;
}



.report-checked {
	color : grey;
}

.comment-content h4 {
	display: inline;
	font-size : 17px;
	clear: both;
}

.comment-content p {
	font-size : 14px;
	margin-top : 5px;
}

#commentBox {
	border-radius: 10px;
	padding-bottom : 0px;
	background-color: #f2f4f3;
	margin-bottom: 9px;
}

.comment-content {
		overflow: hidden;
}


.comment-text {
	overflow-y: scroll;
	width: 112%;
	height: 100%;
	padding-right: 10px;
}

#change-member a {
	margin-right: 10px;
}

#change-member p {
	margin-top: 10px;
}

#edit-group .btn-success {
	margin-top : 15px;
	float : right;
}


#main-page .jumbotron {
	background-color: #73f4b3;
	border : solid #4dcc8c 1px;
	padding: 20px;
}

#lastFivePublic .jumbotron {
	margin-left: 20px;
	margin-top: 20px;
	
	padding-bottom: 15px
}

.postPreView {
	margin-bottom: 55px;
}



.navIcon .fas {
	font-size: 25px;
	margin-right: 10px;
	line-height: 40px;
}

.navIcon .fas:hover {
	color: #27ce80
}

#contents-friend, #admin-group-page, #backOffice-page, #main-page {
	margin-left: 150px;
}



.titleFriend {
	margin-top: 30px;
}

#titleGestionFriend {
	margin-left: 15px;
}

#no-post-marg {
	text-align: center;
	margin-bottom: 40px;
}

#no-post {
	text-align: center;
}


.post p {
	margin: 0px;
}

#nav-option #suscribe {
	color : white;
}

#nav-option #unsuscribe {
	color : red;
}

.table-report {
	padding-bottom: 150px;
}


@media screen and (max-width: 1040px) 

{

#memberBar {
display: none;
}

#group-page {
	margin-right: 0px;
}

.comment-content {
	margin-right: 30px;
}

.postBox {
	left: 10%;
}

.left {
	right: 0px;
}


}



@media screen and (max-width: 880px)

{

#navbar {
margin-left:20px;
}






}

@media screen and (max-width: 770px)

{

#groupBarSection {
	display: none;
}

.off-responsive {
	display: none;
}

#contents-friend, #admin-group-page, #backOffice-page, #main-page, #group-page {
	margin-left: 0px;
}

.postBox {
	left: 0%;
}




}

@media screen and (max-width: 500px)

{

.comment-content {
	right: -300px;
}

.fa-comments {
	float: right;
	font-size: 25px;
	z-index: 7
}

.right {
	left: -265px !important;
}

.left {
	right: 0px;
}

.comment-text {
	padding-right: 25px;
}

#lastFivePublic .jumbotron {
	padding-bottom: 30px;
}


}





@media screen and (max-width: 400px)

{

.mega-off-responsive {
	display: none;
}

#teller {
	display:none;
}

#addGroup {
	width: 100%;
	font-size: 14px;
}

}