html {
    scroll-behavior: smooth;
}

body {
	margin: 0;
	font-size:16px;
}

.no-outline {
	outline:0 !important;
}

.loader_size{
	font-size:20px;
}

.centerLoading{
	width:20px; 
	height:20px; 
	margin:10px auto;
	text-align:center;
}

img{
	border:none;
	outline:none;
}

.col-md-4{
	 border:0px solid #06C;
}

.col-md-5{
	 border:0px solid #06C;
}

.col-md-3{
	 border:0px solid #06C;
}

.img-responsive{
	border:none;
	outline:none;
}

#headerf{
	background-image:url(forumTopBarBG4.jpg); 
	background-repeat:repeat-x; 
	min-height:135px;
	/*height:125px;*/
	background-color:#78C1D0;
}

.signUpForm{
	width:50%;
	margin-bottom:10px;
}

.signinForm{
	width:50%;
	margin-bottom:10px;
}

.w3-container-round{
	background-color:#F9F9F9;
	border-bottom:1px solid #D4D4D4;
	border-top-left-radius:10px;
	border-top-right-radius:10px;
}

.modal-footer-round{
	border-bottom-right-radius:10px;
	border-bottom-left-radius:10px;
}

.success{
	text-align:center;
	padding:10px;
	color:#009700;
	font-weight:bold;
}

.newTopic{
	width:70%;
	margin-bottom:10px;
}

.notFoundImage{
	margin:30px auto; 
	width:275px; 
	text-align:center;
}

.textarea_size {
	min-width:100%;
	max-width:100%;
	min-height:200px;
	/*resize:none;*/
}

.replyDispBox{
	border-radius:20px;
	width:100%;
	min-height:70px;
	border:1px solid #5BC0DE;
	padding:10px;
	background-color:#DAF1F8;
}

.postThumbnail{
	width:100px;
	float:left;
	margin-right:10px;
	border-radius:5px;
}

/*-------------- START ZOOMING IMAGE-------------------*/	
.pic{
	background:#FFF;
	border-radius:5px;
	cursor:pointer;
}

.picbig{
	position:absolute;
	width:0px;
	-webkit-transition:width 0.3s linear 0s;
	-moz-transition:width 0.3s linear 0s;
	-o-transition:width 0.3s linear 0s;
	transition:width 0.3s linear 0s;
	z-index:10;
	border-radius:5px;
	border:1px solid #E0E0E0;
}

.pic:hover + .picbig {
	width: auto;
}

/* another zooming effect*/
.zoom-img{
	background-color: transparent;
	border-radius: 5px;
	cursor: pointer;
}

.zoom-img:hover{
	-ms-transform: scale(3.5); /* IE 9 */
	-moz-transform: scale(3.5);
	-o-transform: scale(3.5);
	-webkit-transform: scale(3.5); /* Safari 3-8 */
	transform: scale(3.5);
}

@media screen and (max-width:500px)
{
	.picbig{
		position:relative;
		width:0px;
	}

	.pic:hover + .picbig{
		width:100%;
		margin-top:5px;
	}
}
/*-------------- END ZOOMING IMAGE-------------------*/	

.card {
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
    transition: 0.3s;
	opacity:0.8;
	border:0px solid #999;
}

.card:hover {
    box-shadow: 0 8px 16px 0 rgba(0,0,0,0.8);
	cursor:pointer;
	opacity:1;
}

.card_profile_pic {
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
    transition: 0.3s;
}

.card_profile_pic:hover {
    box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2);
	cursor:pointer;
}


.card_inner_div {
    padding: 2px 16px;
}

.myCursor{
	cursor:pointer;
}

#standardUpload{
	display:none;
}

.standardUpload{
	display:none;
}

.finger{
	cursor:pointer;
}

@media screen and (max-width:1200px)
{
	#headerf{
		background-image:url(forumTopBarBGMobile.jpg); 
		background-repeat:repeat-x; 
		min-height:120px;
		padding-bottom:5px;
	}
	
	.signUpForm{
		width:100%;
		margin-bottom:10px;
	}
	
	.notFoundImage{
		margin:30px auto; 
		width:100%; 
		text-align:center;
	}
	
	.signinForm{
		width:100%;
		margin-bottom:10px;
	}
	
	.newTopic{
		width:100%;
		margin-bottom:10px;
	}

}

/************************************** Begin PaginationLogic styling ***********************************/
.pagNumActive {
    color: #000;
    border:#060 1px solid; 
	background-color: #D2FFD2; 
	padding:5px;
	border-radius:3px;
}

.paginationNumbers a:link {
    color: #000;
    text-decoration: none;
    border:#999 1px solid;
	background-color:#F0F0F0; 
	padding:5px;
	border-radius:3px;
}

.paginationNumbers a:visited {
    color: #000;
    text-decoration: none;
    border:#999 1px solid; 
	background-color:#F0F0F0; 
	padding:5px;
	border-radius:3px;
}

.paginationNumbers a:hover {
    color: #000;
    text-decoration: none;
    border:#060 1px solid;
	background-color: #D2FFD2; 
	padding:5px;
	border-radius:3px;
}

.paginationNumbers a:active {
    color: #000;
    text-decoration: none;
    border:#999 1px solid; 
	background-color:#F0F0F0; 
	padding:5px;
	border-radius:3px;
}

.sp{
	background-color:#FFF; 
	padding:15px 0; 
	text-align:center; 
	/*margin-top:10px;*/
	border-radius:10px;
	margin-bottom:10px;
}

.displ{
	display: block;
}

.d-block {
    display: block;
}

.d-none {
    display: block;
}

.pgtotal{
	color:#999;
}

@media screen and (max-width:600px)
{
	.pagNumActive {
		display:inline;
	}
	
	.paginationNumbers a:link {
		display:inline;
		word-wrap:break-word;
		line-height:30px;
	}

	.pgtotal{
		color:#999;
		display:inline;
	}
}
/************************************** End PaginationLogic styling ***********************************/

/* start styling loader animation*/
.loader {
	border: 8px solid #f3f3f3;
	border-radius: 50%;
	border-top: 8px solid #3498db;
	border-bottom: 8px solid #3498db;
	width: 50px;
	height: 50px;
	-webkit-animation: spin 2s linear infinite;
	-ms-animation: spin 2s linear infinite;
	animation: spin 2s linear infinite;
}

@-webkit-keyframes spin {
    0% { 
        -webkit-transform: rotate(0deg); 
        transform: rotate(0deg);
    }
    100% { 
        -webkit-transform: rotate(360deg); 
        transform: rotate(360deg); 
    }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}
/* end styling loader animation*/

/*
.modal-header{
      background-color: #5cb85c;
      color:white !important;
      text-align: center;
      font-size: 30px;
}

.modal-footer{
      background-color: #f9f9f9;
}
*/

#headerContent{
	width:1000px;
	height:160px;
	margin:0 auto;
}

#content{
	width:998px; 
	margin:0 auto; 
	height:auto; 
	clear:both;
}

#content_center{
	background-color:#F0F0F0;
	border-left:1px solid #ccc;
	border-right:0px solid #ccc;
	/*border-bottom:1px solid #069;*/
	min-height:500px;
	/*padding:12px;*/
}

#content_right{
	width:160px;
	/*min-height:500px; 
	float:left;*/ 
	background-color:#E5E5E5;
	color: #999; 
	padding:12px;
	margin:0 auto;
}

#content_left{
	width:160px;
	/*min-height:600px; 
	float:left; 
	background-color:#E5E5E5;*/
	color: #999; 
	padding:12px;
	margin:0 auto;
}

#sectionLinks a {
	font-size:24px;
	text-decoration:none;
}

#sectionLinksRight a {
	font-size:16px;
	text-decoration:none;
}

#sectionLinksLeft a {
	font-size:16px;
	text-decoration:none;
}

#breadcrumbs {
	font-size: 16px;
	border:#E2E2E2 1px solid;
	background-color:#FFF;
	padding:8px;
}

.breadcrumb {
	font-size: 16px;
	border:#E2E2E2 1px solid;
	background-color:#FFF;
}

.topicTitles {font-size:20px;}
.topicCreationDate {color:#060; font-style:italic;}

a:link {
	color: #06C;
}
a:visited {
	color: #06C;
}
a:hover {
	color: #000;
}
a:active {
	color: #06C;
}

#footer{
	/*background-color:#000;*/
	width:100%;
}

#footer a{
	text-decoration:none;
}

#footer a:hover{
	text-decoration:underline;
	color:#00B700;
}

.footer_inner{
	color:#FFF;
	padding:20px 0px;
	font-size:13px;
	text-align:center;
	clear:both;
}

/* ################################ navigation bar modification begins here ################################# */
.navbar{
	margin-bottom:0;
	border-radius:0;
}

.dropdown-menu{
	padding:0;
}

.navbar-default .dropdown-menu{
	border:0;
	padding:0;
	margin-top:-3px;
}

.dropdown-menu .dropdown-header, .open .dropdown-menu > li > a{
	padding:10px 15px 10px 25px;
}

.dropdown-menu .divider{
	margin:0;
}
/* ################################# navigation bar modification ends here ################################# */


.droppositn{
	margin-left:-102px;
}

@media screen and (max-width:1200px){
	.droppositn{
		margin-left:auto;
	}
}

.pointer{
	cursor:pointer;
}

/*////////////////////// start modal custom classes ///////////////////////////*/
.goddy-modal-x-small {
	width:350px;
}

.w3-modal-xs {
	width:350px;
}

.goddy-modal-medium {
	width:550px;
}

.w3-modal-md {
	width:550px;
}

.goddy-modal-small{
	width:400px;
}

.w3-modal-sm {
	width:400px;
}

.padding-top-30 {
	padding-top:30px;
}

.w3-modal-content-round {
	border-radius:10px;
}

/* //\\ */

.round-25{
	border-radius:25px;
}

.text-bold{
	font-weight:bold;
}

/* custom scrollbar */
/* Webkit browsers, such as Chrome, Safari and Opera, supports the non-standard ::-webkit-scrollbar pseudo element */
.scroll-bar-teal::-webkit-scrollbar{
    width:15px;
}

.scroll-bar-teal::-webkit-scrollbar-track{
    box-shadow: inset 0 0 5px grey; 
    border-radius: 10px;
    background:#fff; 
}

.scroll-bar-teal::-webkit-scrollbar-thumb{
    background:#009688; 
    border-radius:10px;
}

.scroll-bar-teal::-webkit-scrollbar-thumb:hover{
    background:#00AE9D; 
}

/* custom scrollbar general */
::-webkit-scrollbar{
    width:15px;
}

::-webkit-scrollbar-track{
    box-shadow: inset 0 0 5px grey; 
    border-radius: 10px;
    background:#fff; 
}

::-webkit-scrollbar-thumb{
    background:#35A4D9; 
    border-radius: 10px;
}

::-webkit-scrollbar-thumb:hover{
    background:#248ABB; 
}

.text-wrap{
	word-wrap:break-word;
}

/* highest z-index size for w3.css is 3 then you use 4, 5, etc.*/
.w3-z-index-4{
	z-index:4;
}

.w3-z-index-5{
	z-index:5;
}

.no-bottom-border{
	border-bottom:0;
}

.no-top-border{
	border-top:0;
}

.loader-size{
	font-size:20px;
}

.center-loading{
	width:20px; 
	height:20px; 
	margin:10px auto;
	text-align:center;
}

.margin-right-15{
    margin-right:15px;
}

.margin-bottom-10{
    margin-bottom:10px;
}

.margin-lr-15{
    margin-left:15px;
    margin-right:15px;
}

.width-343{
	width:343px;
	height:120px;
	font-size:24px;
}

.ad-margin-b{
    margin-bottom:5px;
}

@media screen and (max-width:343px)
{
	.width-343{
		width:100%;
		height:auto;
		font-size:24px;
	}
	
	.ad-margin-b{
        margin-bottom:20px;
    }
}

@media only screen and (max-width: 992px) {
	.width-343{
		width:343px;
		height:120px;
	}
	
	.ad-margin-b{
        margin-bottom:20px;
    }
}

@media only screen and (min-width: 992px) {
	.width-343{
		width:100%;
		height:120px;
		font-size:22px;
	}
}

@media only screen and (min-width: 1200px) {
	.width-343{
		width:343px;
		height:120px;
	}
}

.pic-small{
	background:#FFF;
	border-radius:5px;
	cursor:pointer;
}

.picbig-small{
	position:absolute;
	width:0px;
	-webkit-transition:width 0.3s linear 0s;
	-moz-transition:width 0.3s linear 0s;
	-o-transition:width 0.3s linear 0s;
	transition:width 0.3s linear 0s;
	z-index:10;
	border-radius:5px;
	border:1px solid #E0E0E0;
}

.pic-small:hover + .picbig-small{
	width:200px;
}

.bg-80{
	background-color:#191A1E;
}

.bg-70{
	background-color:#2C2E33;
}

.no-margin-b-15{
	margin-bottom:0;
}

@media screen and (max-width:600px)
{
	.no-margin-b-15{
		margin-bottom:15px;
	}
}

.text-15{
	font-size:15px;
}

.text-14{
	font-size:14px;
}

.letter-spacing-2{
	letter-spacing:2px;
}

.card-sm{
	box-shadow: 0 1px 2px 0 rgba(0,0,0,0.2);
	transition: 0.3s;
}

.card-sm:hover{
	box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
}

.round-button{
	border-radius:30px;
}

.margin-right-10{
	margin-right:10px;
}

.z-index-10{
	z-index:10;
}

.cursor-zoom-in{
    cursor:zoom-in;
}

.textarea-150{
	min-width:100%;
	max-width:100%;
	min-height:150px;
	max-height:250px;
}

.text-normal{
	font-weight:normal;
}

.textarea-300{
	min-width:100%;
	max-width:100%;
	min-height:300px;
	max-height:400px;
}

.no-bold{
	font-weight:normal !important;
}

.textarea-60{
	min-width:100%;
	max-width:100%;
	min-height:60px;
	max-height:60px;
	resize:none;
}

/* style go to top */
.to-top {
    display: flex;
    position: fixed;
    bottom: 25px;
    right: 40px;
    z-index:1072;
	opacity:0;
	pointer-events:none;
	transition:all .4s;
    font-weight:bold;
	font-size:30px;
    cursor: pointer;
}

.to-top.active {
    bottom:50px;
	opacity:1;
	pointer-events:auto;
}

/* hide pg scrollbar when bootstrap modal is opened 
.modal-open {
    overflow: hidden;
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}*/

/* hide/show pg scrollbar when w3 modal is open/close 
.w3-modal-scroll {
    overflow: hidden;
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}*/

/* hide pg scrollbar when bootstrap modal is opened or
hide/show pg scrollbar when w3 modal is open/close
*/
.modal-open, .w3-modal-scroll {
    overflow: hidden;
    /**/position: fixed;
    padding-right: 0 !important;
    width: 100%;
    height: 100%;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}

/* Accent and background color styling for the modal */
.custom-modal-header {
    background-color: #007bff;
    color: #ffffff;
    border-bottom: 2px solid #0056b3;
}

.custom-modal-body {
    background-color: #f8f9fa;
}

.custom-modal-footer {
    background-color: #e9ecef;
    border-top: 2px solid #dee2e6;
}

.custom-modal-title {
    font-weight: bold;
}
    
.btn-primary-custom {
    background-color: #007bff;
    border-color: #007bff;
}
    
.btn-primary-custom:hover {
    background-color: #0056b3;
    border-color: #0056b3;
}

.rounded-top-16 {
    border-top-left-radius: 16px;
    border-top-right-radius: 16px
}

.rounded-bottom-16 {
    border-bottom-left-radius: 16px;
    border-bottom-right-radius: 16px
}

.txt-white {
    color: #ffffff;
    opacity: 0.6
}

.txt-white:hover {
    color: #ffffff;
    opacity: 1
}