/**
* Homepage Layout Styles
*/
* {
	overflow-anchor: none;
}

body {
	padding-top: 65px;
	background: var(--dm-grey-light);
 	min-height: 100vh;
    display: flex;
    flex-direction: column;
}

.welcome-msg {
	color:#08457E; 
	font-size:14px; 
	line-height:18px; 
	font-style: italic;
}

.welcome-info-icon {
	color:#08457E;
}

.blue-link-welcome {
	color: #08457E !important;
	border-bottom: 2px solid #08457E;
}

@media screen and (max-width: 800px) {
  	body {
    	padding-top: 125px;
  	}
}

.dm-upper {
	text-transform: uppercase;
}

.dm-card-header {
	font-size:16px;
}

.dm-active-tab {
	border-top: 1px solid var(--dm-grey-border);
	border-left: 1px solid var(--dm-grey-border);
	border-right: 1px solid var(--dm-grey-border);
	background-color: var(--dm-grey-light); 
	color: var(--dm-soft-black) !important;
	font-weight: bold;
}

.dm-active-tab-link { 
	color: #343642;
}

.dm-inactive-tab {
	border-top: 1px solid var(--dm-grey-border);
	border-left: 1px solid var(--dm-grey-border);
	border-right: 1px solid var(--dm-grey-border);
	background-color: #FFFFFF;
	color: var(--dm-red-home) !important;
}

.dm-inactive-tab-link {
	color: var(--dm-red-home);
}

.dm-new-badge {
  position: absolute;
  top: -12px;
  right: -5px;
  padding-top: 3px;
  padding-bottom: 3px;
  padding-left: 10px;
  padding-right: 10px;
  
  background-color: var(--dm-blue);
  font-size: 60%;
  color: white;
}

.dm-new-response {
  
  padding-top: 3px;
  padding-bottom: 3px;
  padding-left: 10px;
  padding-right: 10px;
  border-radius: 30%;
  background-color: var(--dm-blue);
  font-size: 60%;
  color: white;
}


.dm-modal-footer {
	border-top:none;
}

.dm-modal-header {
	font-weight: bold;
	font-size: 24px;
	color: #343641;
	padding-top:15px;
	padding-bottom:5px;
	border-bottom: 1px solid var(--dm-blue);
}

.dm-control-modal-header {
	font-weight: bold;
	padding-top:5px;
	padding-bottom:0px; 
}

.dm-modal {
	background:var(--dm-gray-light3); 
	border:1px solid var(--dm-grey-light);
	border-radius: 0;
	padding-left: 35px;
	padding-right: 35px;
}

.dm-control-modal {
	background:var(--dm-gray-light3); 
	border:1px solid var(--dm-grey-light);
	border-radius: 0;
	padding-left: 5px;
	padding-right: 5px;
}

.dm-modal-body { 
	color: #7B797C; 
}
 
.dm-act-link-active {
	color: var(--dm-blue);
	font-weight: bold;
}
 

.dashboard-count-label {
	color: var(--dm-grey);
}


.dashboard-button-selected {
	background: #e2eaf1;
}


.dm-navbar-border {
	border-bottom: 1px solid var(--dm-grey-border);
}

.bg-light {
	background-color: var(--dm-off-white) !important;
	color: var(--dm-soft-black);
}

.bg-dark {
	background-color: var(--dm-soft-black) !important;
	color: var(--dm-white) !important;
}

.bg-dark a {
	color: var(--dm-white) !important;
}

.blue-link {
	color: var(--dm-blue) !important;
}

.dm-blue {
	color: var(--dm-blue) !important;
}

.btn-danger {
	border: 1px solid var(--dm-red-home);
	background: var(--dm-red-home);
	color: var(--dm-white);
}

.btn-danger:hover {
   	border: 1px solid var(--dm-red-home);
	background: var(--dm-red-home);
	color: var(--dm-white);
    opacity: 80%;
}

.dm-border-blue {
	border: 1px solid var(--dm-blue);
}
.dm-border-gray {
	border: solid 1px var(--dm-grey-border);
}


.dm-btn-rate {
	border: 1px solid var(--dm-grey-light);
	background: var(--dm-white);
	/*color: var(--dm-blue);*/
	color: var(--dm-red-home);
	/*width:80px;*/
	font-size: 10px;
}
/*
border: 1px solid var(--dm-red-home);
	background: var(--dm-white);
	color: var(--dm-red-home);
*/
.dm-btn-rate-selected {
	border: 1px solid var(--dm-grey-light);
	color: var(--dm-white);
	background: var(--dm-blue);
	/*width:80px;*/
	font-size: 10px;
}

.dm-btn-rate-wide {
	border: 1px solid var(--dm-grey-light);
	background: var(--dm-white);
	/*color: var(--dm-blue);*/
	color: var(--dm-red-home);
	/*width:80px;*/
	font-size: 10px;
}

.dm-btn-rate-wide-selected {
	border: 1px solid var(--dm-grey-light);
	color: var(--dm-white);
	background: var(--dm-blue);
	width:80px;
	font-size: 10px;
}

.btn:hover {
	opacity:80% !important;
	text-decoration: none;
}

.btn-danger:hover {
	opacity:80%;
}

.btn-light:hover {
	border: 1px solid var(--dm-grey-border);
	background: var(--dm-white);
	color: var(--dm-red-home);
	opacity: 80%;
}

.btn-danger-inv {
	background: var(--dm-white);
	color: var(--dm-red-home);
	border: 1px solid var(--dm-red-home);
}

.btn-light {
	border: 1px solid var(--dm-grey-border);
	background: var(--dm-white);
	color: var(--dm-red-home);
}

.btn-info {
	background: var(--dm-gray4);
	border: 1px solid var(--dm-gray2);
}

.btn-modal {
	background: var(--dm-white);
	border: 1px solid var(--dm-gray4);
}

.btn-modal:hover {
	background: var(--dm-white);
	border: 1px solid var(--dm-gray4);
	opacity: 80%;
}

.btn:disabled {
	--bs-btn-disabled-color: var(--text-color);
	--bs-btn-disabled-bg: hsl(var(--background-color-hs), var(--background-color-l));
	--bs-btn-disabled-border-color: hsl(var(--border-color-hs), var(--border-color-l));
	--bs-btn-disabled-opacity: 0.6;
	cursor: not-allowed;
}

 

/**
 * specific buttons
 */
.dm-cancel-btn {
	border: 1px solid var(--dm-grey-border);
	background: var(--dm-white);
	color: var(--dm-red-home);
}

.dm-clear-btn {
	border: 1px solid var(--dm-red-home);
	background: var(--dm-white);
	color: var(--dm-red-home);
}
 
.dm-submit-btn {
	border: 1px solid var(--dm-red-home);
	background: var(--dm-red-home);
	color: var(--dm-white);
}

.dm-apply-btn {
	border: 1px solid var(--dm-red-home);
	background: var(--dm-red-home);
	color: var(--dm-white);
}

.dm-load-btn {
	border: 1px solid var(--dm-grey-border);
	background: var(--dm-white);
	color: var(--dm-red-home);
}

.dm-browse-btn {
	border: 1px solid var(--dm-grey-border);
	background: var(--dm-off-white);
	color: var(--dm-red-home);
}


.dm-cancel-btn:hover {
	border: 1px solid var(--dm-grey-border);
	background: var(--dm-white);
	color: var(--dm-red-home);
	opacity:80%;
}

.dm-clear-btn:hover {
	border: 1px solid var(--dm-red-home);
	background: var(--dm-white);
	color: var(--dm-red-home);
	opacity:80%;
}
 
.dm-submit-btn:hover {
	border: 1px solid var(--dm-red-home);
	background: var(--dm-red-home);
	color: var(--dm-white);
	opacity:80%;
}

.dm-apply-btn:hover {
	border: 1px solid var(--dm-red-home);
	background: var(--dm-red-home);
	color: var(--dm-white);
	opacity:80%;
}

.dm-load-btn:hover {
	border: 1px solid var(--dm-grey-border);
	background: var(--dm-white);
	color: var(--dm-red-home);
	opacity:80%;
}

.dm-browse-btn:hover {
	border: 1px solid var(--dm-grey-border);
	background: var(--dm-off-white);
	color: var(--dm-red-home);
	opacity:80%;
}


 
 
.feed-post-clamp {
  	display: -webkit-box;
  	-webkit-line-clamp: 8;
  	-webkit-box-orient: vertical;  
  	
  	overflow: hidden;
}

.profile-photo {
	--photo-height: auto;
	--photo-width: 30px;
}

.profile-photo-sm {
	--photo-width: 30px;
}

.profile-photo-md {
	--photo-width: 50px;
}

.profile-photo-lg {
	--photo-width: 70px;
}

.profile-photo-xl {
	--photo-width: 100px;
}


@media screen and (max-width: 480px) {
	.profile-photo-md {
    	--photo-width: 40px;
  	}
}

.profile-photo {
    align-self: flex-start;
    display: flex;
    align-items: center;
    justify-content: center;
    width: var(--photo-width);
    height: var(--photo-height);
    min-width: var(--photo-width);
    font-size: 0.5rem;
    background: #fff;
}

.profile-photo img {
	width: var(--photo-width);
    height: var(--photo-height);
    object-fit: cover;
}

.comm-logo {
	max-height:50px; 
	width:auto
}


.profile-photo i {
	font-size: 1.5rem;
	color: var(--dm-grey-border);
}

i.profile-photo {
	font-size: 1.5rem;
	color: var(--dm-grey-border);
}

.my-profile-name {
	font-size:16px; 
	font-weight:bold;
	line-height:20px;
}
.my-profile-text{
	color: var(--dm-blue-dark);
}

.author-name-main {
	font-size:16px; 
	font-weight:bold;
	line-height:1.2;
}
.author-info-main {
	font-size:14px; 
	line-height:1.2;
}

.post-text-view {
	font-size: 14px;
	line-height:1.2;
}

.dm-f-8 {
	font-size: 8px; 
}

.dm-f-10 {
	font-size: 10px; 
}

.dm-f-12 {
	font-size: 12px; 
	line-height: 1.2;
}

.dm-f-14 {
	font-size: 14px;
	line-height: 1.2;
}

.dm-f-16 {
	font-size: 16px;
	line-height: 1.2;
}

.dm-f-16-12 {
	font-size: 16px;
	line-height:20px;
}

.dm-f-18 {
	font-size: 18px;
	line-height: 1.2;
}

.dm-f-20 {
	font-size: 20px;
}

.dm-f-21 {
	font-size: 21px;
	line-height: 1.2;
}

.dm-f-24 {
	font-size: 24px;
}

.dm-f-26 {
	font-size: 26px;
	line-height: 1.2;
}

.dm-f-30 {
	font-size: 30px;
	line-height:32px;
}

.dm-f-36 {
	font-size: 36px; 
}

.dm-r-w-180 {
	width:180px;
}

.dm-w-150 {
	width:150px;
}

.dm-w-250 {
	width:250px;
}

.dm-w-400 {
	width:400px;
}

.dm-w-120 {
	width:120px;
}

.dm-input:focus { 
    outline: none !important;
    border: 1px solid var(--dm-blue-light);
    box-shadow: none;
}

.dm-error {
	color:red;
	font-style:italics;
}
 
@media screen and (max-width: 480px) {
	
	.profile-photo img {
		width: 40px;
	    height: 40px;
	    object-fit: cover;
	}
	
	.author-name-main {
		font-size:16px; 
		font-weight:bold;
		line-height:18px;
	}
	
	.author-info-main {
		font-size:14px; 
		line-height:16px;
	}
	
	.comm-logo {
		max-height:40px; 
		width:auto
	}
	
	.dm-f-16 {
		font-size: 14px;
		line-height: 16px;
	} 
	
	.dm-f-16-12 {
		font-size: 12px;
		line-height: 14px;
	} 
	
	.dm-f-18 {
		font-size: 16px;
		line-height:19px
	}
	
	.dm-f-20 {
		font-size: 18px;
		line-height: 21px;
	}
	
	.dm-f-21 {
		font-size: 18px;
		line-height: 21px;
	}
	
	.dm-f-24 {
		font-size: 18px;
	}

	.dm-f-26 {
		font-size: 20px;
		line-height:23px
	}
	.dm-f-30 {
		font-size: 24px;
		line-height:26px
	}
	 
	.dm-r-w-180 {
		width:150px;
	}
	
	.dm-w-150 {
		width:120px;
	}
	
	.dm-w-400 {
		width:300px;
	}
}

/**
 * to show dropdown on mouse over
 */
.dropdown:hover .dropdown-menu {
    display: block;
    margin-top: 0; /* remove the gap so it doesn't close */
}



.dm-form-attachment-box {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	background: var(--dm-off-white);
	border: solid 1px var(--bs-border-color);
	padding: 20px;
}
