@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Roboto+Flex:opsz,wght@8..144,100..1000&family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');
*{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;margin:0;padding:0;transition:all .3s ease 0s;outline:0!important;text-decoration:none!important}
.header-bar-text a {text-transform: capitalize;font-size: 17px;font-family: "Poppins",serif;color: #000;font-weight: 500;letter-spacing: 0;display: flex;align-items: center;text-decoration: none;padding: 10px 12px 10px 18px;}
.header-bar-text a .material-symbols-outlined {color: #bdbdbd;padding-left: 3px;position: relative;top: 2px;}
.header-bar-text .btn {color: #fff;text-align: center;justify-content: center;padding: 10px 12px !important;border-radius: 50px;font-weight: 500;min-width: 120px;margin-left: 15px;}
.header-bar-text .btn:hover {}
.header-bar-text {display: flex !important;}

.explore-dropdown, .explore-dropdown-2 {padding: 8px;background-color: #fff;border: 1px solid #ededed;border-radius: 16px;box-shadow: 0 8px 8px 0 rgba(25,25,25,.04);position: absolute;top: 60px;display: none;z-index: 999;width: 220px;}
.explore-dropdown ul, .explore-dropdown-2 ul {list-style: none;padding: 0;margin: 0;}
.explore-dropdown ul li, .explore-dropdown-2 ul li {}
.explore-dropdown ul li a, .explore-dropdown-2 ul li a {display: flex;align-items:center;font-size: 17px;text-decoration: none;padding: 10px 16px 10px 10px;font-family: "Poppins",serif;}
.explore-dropdown ul li a:hover, .explore-dropdown-2 ul li a:hover {background: #f7f7f7;border-radius: 12px;}
.header-bar-text a.active {background: #f7f7f7;border-radius: 50px;}
.header-bar-text a.active .material-symbols-outlined {transform: rotate(180deg);top: 1px;}
.explore-dropdown ul li a .material-symbols-outlined, .explore-dropdown-2 ul li a .material-symbols-outlined {color: #bdbdbd;padding-right: 8px;position: relative;top: 0;padding-left: 0;}
.header-link {position:relative;margin-right: 15px;}
.upload-btn {margin-right: 15px;}
.explore-link-2 img {height: 28px;margin-right: 10px;} 


.site-branding {/*margin-top: 40px;*/}
.site-branding h1 {font-family: "Roboto Flex",serif;font-size: 70px;font-weight: 700;}
.site-branding h2 {font-family: "Roboto Flex",serif;font-size: 40px;font-weight: 400;}

.search-bar {margin: 30px 0;position: relative;}
.search-bar input[type="text"] {background-color: #f7f7f7;border: #f5f5f5 1px solid;padding: 16px 16px 16px 24px;border-radius: 12px;min-width: 900px;font-size: 18px;height: 80px;}
.search-bar input[type="image"], .search-bar input[type="button"], .search-bar input[type="submit"], .search-bar button {position: absolute;right: 12px;top: 50%;transform: translateY(-50%);width: 44px;padding: 11px;border-radius:8px;}
.search-bar button {border: 0;cursor: pointer;}
.search-bar button img {height: 20px;width: 20px;display: inline-block;position: relative;top: 2px;}

.search-bar input[type="image"]:hover, .search-bar input[type="button"]:hover, .search-bar input[type="submit"]:hover {background: #eee;}
.footer-bar .outer-container {margin-bottom:0}
.footer-copyright a {color:#fff}
.content-area {}
.content-area .top-toolbar {display: flex;justify-content: space-between;align-items: center;margin-bottom: 20px;}
.content-area .top-toolbar .heading {font-size: 22px;}
.content-area .top-toolbar .filter-drp {position: relative;}
.content-area .top-toolbar .filter-drp > a {display: flex;align-items: center;border: #ededed 1px solid;padding: 10px 12px 10px 20px;border-radius: 12px;color: #000;font-family: "Poppins",serif;font-weight: 500;}
.content-area .top-toolbar .filter-drp a .material-symbols-outlined {margin-left: 4px;color: #bdbdbd;}
.content-area .top-toolbar .filter-drp .filter-options {border: #ededed 1px solid;border-radius: 12px;color: #000;position: absolute;z-index: 999;background: #fff;top: 50px;width: 100%;display:none}
.content-area .top-toolbar .filter-drp .filter-options ul {list-style: none;margin: 0;padding: 0;}
.content-area .top-toolbar .filter-drp .filter-options ul li {}
.content-area .top-toolbar .filter-drp .filter-options ul li a {padding: 10px 20px;display: block;border-radius: 12px;color:#000;font-family: "Poppins",serif;font-weight: 500;}
.content-area .top-toolbar .filter-drp .filter-options ul li a:hover {background: #f7f7f7;color:#000}

.masonry__container {column-count: 4;column-gap: 0.5rem;}
.masonry__container img {max-width: 100%;display: block;}
.homegallery {}
.homegallery .item {position: relative;overflow: hidden;cursor: pointer;margin-bottom: 0.5rem;}
.homegallery .item .icons {position: absolute;top: -40px;right: 14px;opacity: 0}
.homegallery .item .icons a {background: rgba(0,0,0,0.5);height: 36px;width: 36px;display: flex;align-items: center;justify-content: center;border-radius: 8px;}
.homegallery .item .icons a:hover {background: rgba(0,0,0,1);}
.homegallery .item:hover .icons {top: 20px;opacity: 1}
.homegallery .item:hover .otherinfo {bottom: 0;opacity: 1}
.homegallery .item .icons .material-symbols-outlined {color: #fff;}
.homegallery .item .author-info {display: flex;align-items: center;}
.homegallery .item .author-info .thumb {margin-right: 10px;}
.homegallery .item .author-info .thumb img {height: 40px;width: 40px;border: #fff 1px solid;border-radius: 50%;display: block;margin-bottom: 0;}
.homegallery .item .author-info .user {color: #fff;font-size: 18px;}
.otherinfo {display: flex;align-items: center;justify-content: space-between;padding: 20px;position: absolute;bottom: -100px;width: 100%;opacity: 0}
.otherinfo .download {}
.otherinfo .download a {border: #fff 1px solid;padding: 10px 20px;border-radius: 50px;display: flex;align-items: center;color: #fff;background: rgba(0,0,0,0.5);}
.otherinfo .download a:hover {background:#fff;color:#000}
.otherinfo .download a .down-text {margin-right: 6px;}

.join-page {align-items: flex-start !important;}
.join-page h1 {font-size: 60px;}
.join-page h2 {font-size: 34px;line-height: 46px;}
.join-page ul {margin: 15px;padding: 0;}
.join-page ul li {font-family: "Poppins",serif;font-size: 18px;line-height: 34px;}

.form-join {margin-top: 100px;}
.form-join .form-row {display: grid;margin: 15px 0;}
.form-join .form-row input, .form-join .form-row textarea, .fake-textbox, .form-join .form-row select {border: 1px solid #dfdfe0;padding: 15px;border-radius: 8px;font-size: 16px;width: 100%;background: #fff;}
.form-join .form-row label {}
.form-join .form-row label span {color:#f00}
.form-join .form-row-half {grid-template-columns: 49% 49%;justify-content: space-between;}
.form-join .form-row-full {grid-template-columns: 100%;}
.form-join .form-row-button {margin: 15px 0;}
.form-join .form-row-button input {color: #fff;text-align: center;padding: 15px !important;border-radius: 8px;font-weight: 500;width: 100%;border: 0;font-size: 18px;cursor: pointer;background: #343a40;}
.form-join .terms {text-align: center;}
.form-join .terms p {}
.form-join .terms p a {color: #5178ec;}
.form-join h2 {text-align: center;margin-bottom: 25px;font-size: 30px;font-weight: 600;font-family: "Roboto Flex",serif;}
.form-join .form-row-otp {justify-content: center;grid-template-columns: auto auto auto auto;grid-gap: 10px;}
.form-join .form-row-otp input {width: 120px;text-align: center;font-size: 40px;}
.button-width-auto {justify-content: center;}
.button-width-auto input {width: auto !important;min-width: 160px;}
.upload-sec {padding: 0 25%;text-align: center;}
.upload-sec h1 {font-size: 40px;}
.upload-sec p {}

.upload-area {border: #eee 2px dashed;border-radius: 12px;padding: 30px;margin: 30px;}
.upload-area .icon {text-align: center;margin: 20px 0;}
.upload-area .icon img {height: 150px;}
.upload-area .text {text-align: center;font-size: 30px;font-family: "Roboto Flex",serif;font-weight: 600;}
.upload-area .button {text-align: center;margin: 15px;}
.upload-area .button button {padding: 10px 30px;border-radius: 8px;cursor: pointer}

.profile-sec {}
.profile-sec h1 {font-size: 60px;}
.profile-sec p {}
.profile-sec h2 {}
.profile-form {padding: 0 30%;margin-top: 40px;}
.profile-form h2 {margin: 50px 0 30px;text-align: left;}
.fake-textbox {cursor:not-allowed;color: #A6A6A6;}

.profile-photo {display: flex;align-items: center;margin-bottom: 30px;}
.profile-photo .thumb {margin-right: 30px;}
.profile-photo .thumb img {border-radius: 50%;height: 120px;width: 120px;}
.profile-photo .button {}
.profile-photo .button a {border-radius: 8px;padding: 10px 20px;color: #fff;font-family: "Roboto Flex",serif;}

.myaccount {}
.myaccount .profile-header {display: flex;justify-content: center;align-items: center;}
.myaccount .profile-img {margin-right: 30px;}
.myaccount .profile-img img {border-radius: 50%;height: 200px;width: 200px;}
.myaccount  h2 {font-size: 50px;font-family: "Roboto Flex",serif;font-weight: 700;margin: 10px 0 15px;}
.myaccount .btn {border-radius: 8px;padding: 10px 20px;color: #fff;font-family: "Roboto Flex",serif;}
.myaccount .stats {margin: 20px 0;display: flex;justify-content: center;}
.myaccount .stats > div {border: #eaeaea 1px solid;padding: 10px;border-radius: 8px;}
.myaccount .stats .heading {color: #969696;padding-bottom: 5px;}
.myaccount .stats .count {}
.myaccount .acc-tabs {margin-top: 50px;}
.myaccount .acc-tabs .tabs-link {display: flex;justify-content: center;}
.myaccount .acc-tabs .tabs-link a {padding: 10px;color: #000;font-size: 18px;font-family: "Roboto Flex",serif;font-weight: 600;margin: 10px;width: 140px;text-align: center;border-radius: 8px;}
.myaccount .acc-tabs .tabs-link a.active {color: #fff;background-color: #343a40;border-color: #343a40;}
.myaccount .acc-tabs .tabs-link a:hover {color: #000;background-color: #f7f7f7;}
.myaccount .acc-tabs .tabs-data {}
.myaccount .acc-tabs .tabs-data .tabs-d {}
.myaccount .acc-tabs .tabs-data .tabs-d p {}
.notfound {text-align: center;font-size: 20px;padding: 20px;}
.logo {position: relative;top: 8px;text-align: center;}
.logo img {height: 40px;}
.top-header-col {display: grid;justify-content: space-between;align-items: center;grid-template-columns: 35% 30% 35%;}
.header-bar-social ul {justify-content: flex-end;}

.upload-area {border: 2px dashed #ccc;padding: 20px;text-align: center;cursor: pointer;transition: border-color 0.3s ease;}
.upload-area.drag-over {border-color: #007bff;}
.icon {margin-bottom: 10px;}
.uploaded-files {margin-top: 20px;display: flex;flex-wrap: wrap;gap: 20px;padding: 0 30px;}
.file-item {position: relative;width: 150px;border: 1px solid #ddd;padding: 10px;text-align: center;border-radius: 8px;margin: 0 6px;}
.file-item img {max-width: 100%;height: auto;display: block;margin-bottom: 10px;border-radius: 6px;height: 88px;object-fit: cover;width: 100%;}
.file-item .progress-bar-container {height: 5px;background-color: #f3f3f3;border-radius: 5px;overflow: hidden;margin-top: 5px;}
.file-item .progress-bar {height: 100%;width: 0;background-color: #007bff;transition: width 0.3s ease;}
.remove-btn {position: absolute;top: 5px;right: 5px;background: #fff;border: none;cursor: pointer;color: #dc3545;font-size: 20px;line-height: 1;padding: 5px;}
.file-item .form-control {font-size: 14px;}
#uploadedFilesContainer {display: flex;justify-content: center;}
.upload-area p {font-size: 20px;}
#saveCaptionsBtn {width: 200px;margin: 0 auto;padding: 12px;cursor: pointer;display: none;}

#uploadArea.drag-over {border: 2px dashed #28a745;background-color: #f8fff8;}
.button-container {text-align:center}

.custom-modal {
  position: fixed;
  z-index: 9999;
  left: 0; top: 0;
  width: 100%; height: 100%;
  background: rgba(0,0,0,0.6);
  display: flex; align-items: center; justify-content: center;
}

/* Modal Content */
.custom-modal-content {
  background: #fff;
  padding: 25px;
  border-radius: 12px;
  width: 400px;
  text-align: center;
  box-shadow: 0px 6px 20px rgba(0,0,0,0.3);
  position: relative;
  animation: fadeIn 0.3s ease-in-out;
}

.custom-modal-close {
  position: absolute;
  top: 12px; right: 16px;
  font-size: 22px;
  cursor: pointer;
}

.modal-actions {
  margin-top: 20px;
  display: flex;
  justify-content: center;
  gap: 10px;
}

.btn {
  padding: 8px 18px;
  border-radius: 6px;
  border: none;
  cursor: pointer;
  font-weight: 600;
}

.btn-danger { background: #dc3545; color: #fff; }
.btn-primary { background: #007bff; color: #fff; }
.btn-secondary { background: #6c757d; color: #fff; }


/* Crop Modal Styling */
#cropModal {
    display: none;
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(0,0,0,0.7);
    justify-content: center;
    align-items: center;
    z-index: 9999;
}

#cropModal .modal-content {
    background: #fff;
    padding: 15px;
    border-radius: 8px;
    max-width: 600px;  /* limit modal size */
    width: 90%;        /* responsive */
    box-sizing: border-box;
}

#cropModal img {
    max-width: 100%;
    display: block;
    margin: auto;
}

#cropModal .actions {
    text-align: center;
    margin-top: 15px;
}

#cropModal .actions button {
    margin: 0 5px;
}


@keyframes fadeIn {
  from { opacity: 0; transform: scale(0.9); }
  to { opacity: 1; transform: scale(1); }
}
.form-join p {text-align:center}
.mobile-menu-icon {display:none}
.mobile-menu {display: none;}
.overlay {position: fixed;top: 0;left: 0;width: 100%;height: 100%;background: rgba(0,0,0,0.6);display: none;z-index: 1000;}
.overlay.active {display: block;}


.myupload-grid {display: grid;grid-template-columns: 24% 24% 24% 24%;justify-content: space-between;grid-gap: 12px;margin-top: 20px;margin-bottom: 25px;}
.myupload-grid .myupload-item {border: #eee 1px solid;padding: 12px;border-radius: 8px;position: relative;}
.myupload-grid .myupload-item .date {position: absolute;background: #fff;padding: 2px 6px;border-radius: 4px;font-size: 13px;right: 25px;top: 25px;}
.myupload-grid .myupload-item a {display: block;cursor: pointer;}
.myupload-grid .myupload-item img {border-radius: 8px;width: 100%;height: 250px;object-fit: cover;}
.myupload-grid .myupload-item .title {}


.myupload-grid {
	/*display: flex;
	flex-wrap: wrap;
	gap: 15px;*/
}
.myupload-item {
	/*width: calc(25% - 15px);*/
	position: relative;
	box-shadow: 0 2px 8px rgba(0,0,0,0.1);
	padding: 10px;
	border-radius: 8px;
	text-align: center;
	background: #fff;
	transition: transform 0.2s ease;
}
.myupload-item:hover {
	transform: translateY(-4px);
}
.myupload-item img {
	width: 100%;
	border-radius: 6px;
}
.myupload-item .date {
	display: block;
	font-size: 12px;
	color: #999;
	margin-bottom: 5px;
}
.myupload-item .title {
	margin-top: 5px;
	font-size: 16px;
	/*white-space: nowrap;*/
	/*overflow: hidden;*/
	text-overflow: ellipsis;
	position: relative;
	cursor: pointer;
	display: inline-block;width: 100%;
  text-align: left;
}

/* ✅ Custom Tooltip */
.tooltip {
	position: absolute;
	bottom: 130%;
	left: 50%;
	transform: translateX(-50%) translateY(10px);
	background: rgba(0, 0, 0, 0.85);
	color: #fff;
	padding: 6px 10px;
	font-size: 13px;
	border-radius: 6px;
	
	opacity: 0;
	visibility: hidden;
	transition: all 0.25s ease;
	z-index: 10;width: 250px;
}
.tooltip::after {
	content: "";
	position: absolute;
	top: 100%;
	left: 50%;
	transform: translateX(-50%);
	border-width: 6px;
	border-style: solid;
	border-color: rgba(0, 0, 0, 0.85) transparent transparent transparent;
}

/* ✅ Show tooltip on hover */
.title:hover .tooltip {
	opacity: 1;
	visibility: visible;
	transform: translateX(-50%) translateY(0);width: 250px;
}

.loader {
	text-align: center;
	padding: 20px;
	display: none;
}
.loader img {
	width: 40px;
}
.end-message {
	text-align: center;
	padding: 15px;
	font-size: 15px;
	color: #777;
	display: none;
}

.icons.active span {
    color: red; /* or your preferred color for active state */
}
.icons.active {
	top: 20px !important;
	opacity: 1 !important;
}
.icons.active .favorite-btn {background: #f00 !important;}
.myupload-grid .myupload-item .remove-like {background: #fff;border: 0;position: absolute;right: 22px;top: 22px;font-size: 14px;padding: 4px 10px;border-radius: 4px;cursor: pointer;}

.dash-data {margin-top: 30px;}
.dash-data .dash-stats-grid {display: grid;grid-template-columns: 24% 24% 24% 24%;justify-content: space-between;}
.dash-data .dash-stats-grid .dash-stats-col {border: #eee 1px solid;padding: 12px 20px;border-radius: 8px;box-shadow: 0 2px 8px rgba(0,0,0,0.1);}
.dash-data .dash-stats-grid .dash-stats-col .heading {font-size: 15px;font-weight: 500;font-family: "Roboto",serif;color: #323e4f;}
.dash-data .dash-stats-grid .dash-stats-col .heading span {padding: 4px 12px;font-size: 13px;border-radius: 50px;display: inline-block;margin-left: 6px;}
.dash-data .dash-stats-grid .dash-stats-col .heading span.minus {color: #b92b45;background-color: #fddbe1;}
.dash-data .dash-stats-grid .dash-stats-col .heading span.plus {color: #01844d;background-color: #dafbed;}
.dash-data .dash-stats-grid .dash-stats-col .content {font-family: "Roboto Flex",serif;font-size: 30px;font-weight: 600;}
.dash-data .dash-stats-grid .dash-stats-col .sub-content {font-family: "Roboto Flex",serif;font-size: 16px;font-weight: 600;}

.dash-chart {margin-top: 20px;display: grid;grid-template-columns: 49.4% 49.4%;justify-content: space-between;}
.dash-chart .dash-chart-box {border: #eee 1px solid;padding: 12px 20px;border-radius: 8px;box-shadow: 0 2px 8px rgba(0,0,0,0.1);}
.dash-chart .dash-chart-box h2 {font-family: "Roboto Flex",serif;font-size: 20px;font-weight: 700;}
.dash-chart .dash-chart-box .content {}
.dash-chart .dash-chart-box .content img {width: 100%;object-fit: cover; height: 450px;border-radius: 8px;}
/* Basic styling for the dashboard boxes (if you don't have it) */
.dash-chart-box {
    background-color: #fff;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    padding: 20px;
    margin-bottom: 20px; /* Space between boxes */
}

.dash-chart-box h2 {
    font-size: 1.5em;
    color: #333;
    margin-bottom: 15px;
    border-bottom: 1px solid #eee;
    padding-bottom: 10px;
}

/* New CSS for the chart container to control height */
.chart-container {
    position: relative; /* Needed for Chart.js responsiveness */
    height: 460px; /* Adjust this value as desired */
    width: 100%;
}

/* Optional: Add some padding to the canvas itself if the chart appears too close to edges */
#uploadActivityChart {
    padding: 10px;
}
.category-page h1 {font-size: 50px;}
.category-page .site-branding {padding-top: 0;}

@media(max-width:1366px){
	.site-branding h1 {font-size: 52px;}
	.site-branding h2 {font-size: 34px;}
	.search-bar input[type="text"] {min-width: 800px;height: 70px;}
	.content-area .top-toolbar .heading {font-size: 18px;}
	.content-area .top-toolbar .filter-drp > a {font-size: 15px;}
	.header-bar-text a, .explore-dropdown ul li a, .explore-dropdown-2 ul li a {font-size: 15px;}
	.join-page h2 {font-size: 26px;line-height: 38px;margin-top: 15px;}
	.join-page ul li {font-size: 16px;line-height: 30px;}
	.form-join .terms p {font-size: 15px;}
	.upload-sec h1 {}
	.upload-sec {padding: 0 10%;}
	.upload-sec p {font-size: 20px;padding-top: 10px;}
	.myupload-grid .myupload-item img {height: 200px;}
	.footer-post-wrap {flex-direction: column;}
	.footer-post-cont {width: 100%;}
	.footer-post-wrap figure {width: 100%;}
	.footer-post-cont .posted-date {font-size: 13px;}
	.footer-post-cont h3 {font-size: 20px;}
	.footer-post-cont .tags-links a {font-size: 14px;}
	.footer-post-wrap .entry-footer {margin-top: 6px;}
	
	.myaccount .profile-img img {height: 160px;width: 160px;}
	.myaccount h2 {font-size: 40px;}
	.myaccount .acc-tabs .tabs-link a {font-size: 16px;}
	.profile-sec h1 {font-size: 40px;}
	.profile-form {padding: 0 20%;margin-top: 20px;}
	.logo img {height: 32px;}
	.down-text {display:none}
	.homegallery .item .author-info .user {font-size: 16px;}
	.homegallery .item .author-info .thumb img {height: 32px;width: 32px;}
	.otherinfo .download a {padding: 6px 14px;}
	.download-btn .material-symbols-outlined {font-size: 20px;}
	.myupload-item .title {font-size: 14px;}
	.dash-chart .dash-chart-box .content img, .chart-container {height: 380px;}
	
}

@media(max-width:1024px){
	.site-branding h1 {font-size: 40px;text-align: center;}
	.site-branding h2 {font-size: 24px;}
	.search-bar input[type="text"] {min-width: 700px;}
	.content-area .top-toolbar .heading {font-size: 16px;}
	.content-area .top-toolbar .filter-drp > a {font-size: 14px;}
	.footer-post-wrap {margin-bottom: 20px;}
	.upload-sec h1 {font-size: 34px;}
	.upload-sec p {font-size: 18px !important;}
	.upload-sec {padding: 0;}
	.upload-area h2 {font-size: 26px;}
	.upload-area .icon img {height: 100px;}
	.myaccount .profile-img img {height: 120px;width: 120px;}
	.myaccount h2 {font-size: 30px;}
	.profile-form {padding: 0 4%;margin-top: 0;}
	.form-join {margin-top: 0;padding: 0 4%;}
	.corder-2 {order:2}
	.corder-1 {order:1}
	.join-page h1 {font-size: 40px !important;text-align: left !important;}
	.join-page h2 {font-size: 22px !important;line-height: 30px;margin-top: 10px;}
	.join-page {padding: 4%;background: #f4f8f9;padding: 25px;margin: 10px 0 20px;}
	.form-join .form-row-otp input {width: 110px;font-size: 34px;}
	
	.mobile-menu-icon {margin-right: 10px;display: flex;align-items: center;}
	.mobile-menu-icon img {height: 28px;cursor: pointer}
	.hideinmobile {display:none}
	.mobile-menu {/*position: fixed;left: 0;top: 0;width: 50%;z-index: 999;background: #fff;display: block;height: 100vh;display: none;*/}
	.overlay {display:none}
	.mobile-menu-header {padding: 20px;display: flex;align-items: center;border-bottom: #e7e7e7 1px solid;}
	.mobile-menu-header .thumb {margin-right: 15px;}
	.mobile-menu-header .thumb img {border-radius: 50%;height: 60px;width: 60px;display: block;}
	.mobile-menu-header .text {}
	.mobile-menu-header .text .heading {display: flex;align-items: center;font-family: "Roboto Flex",serif;text-transform: capitalize;font-size: 20px;font-weight: 700;color: #000;}
	.mobile-menu-header .text .heading .btn {padding: 6px 18px !important;font-size: 14px;min-width: auto;}
	.mobile-menu-header .text .sub-heading {}
	.mobile-menu-header .text .sub-heading a {padding: 0;position: relative;top: -1px;font-size: 14px;color: #5C2EDE;}
	.mobile-menu-body {padding-top: 10px;}
	.mobile-menu-body ul {}
	.mobile-menu-body ul li {}
	.mobile-menu-body ul li a {display: flex;align-items: center;}
	.mobile-menu-body ul li a .material-symbols-outlined {margin-right: 12px;color: #5C2EDE;}
	.mobile-menu-body ul li a:hover {background:#5C2EDE;color:#fff}
	.mobile-menu-body ul li a:hover .material-symbols-outlined {color:#fff}
	body.menu-open {overflow: hidden;}
	.mobile-menu.active {left: 0;}
	.mobile-menu {position: fixed;top: 0;left: -60%;width: 50%;height: 100%;background: #fff;box-shadow: 2px 0 5px rgba(0,0,0,0.3);transition: left 0.3s ease;z-index: 1001;display:block}
	.header-bar-social li {margin: 0 2px;}
	.myupload-grid {grid-template-columns: 32% 32% 32%;}
	.myupload-grid .myupload-item img {height: 140px;}
	.down-text {display:none}
	.otherinfo {padding: 14px;}
	.icons.active {top: 14px !important;right: 14px !important;}
	.homegallery .item .icons .material-symbols-outlined {font-size: 20px;}
	.homegallery .item .icons a {height: 32px;width: 32px;}
	.homegallery .item:hover .icons {top: 14px;right: 14px;}
	.dash-data .dash-stats-grid {grid-template-columns: 49% 49%;grid-gap: 12px;}
	.dash-chart {grid-template-columns: 100%;}
	.otherinfo {opacity: 1 !important;bottom: 0 !important;}
	.homegallery .item .icons {top: 14px !important;right: 14px !important;opacity: 1 !important;}
}

@media(max-width:1024px) and (orientation:landscape){
	.upload-sec {padding: 0 6%;}
	.myupload-grid .myupload-item img {height: 200px;}
	.dash-chart {grid-template-columns: 49% 49%;}
	.dash-chart .dash-chart-box .content img, .chart-container {height: 300px;}
	
}

@media(max-width:767px) {
	.mobile-menu {width: 90%;}
	.mobile-menu-icon {margin-right: 10px;display: flex;align-items: center;}
	.mobile-menu-icon img {height: 28px;cursor: pointer}
	.hideinmobile {display:none}
	.mobile-menu {/*position: fixed;left: 0;top: 0;width: 50%;z-index: 999;background: #fff;display: block;height: 100vh;display: none;*/}
	.overlay {display:none}
	.mobile-menu-header {padding: 20px;display: flex;align-items: center;border-bottom: #e7e7e7 1px solid;}
	.mobile-menu-header .thumb {margin-right: 15px;}
	.mobile-menu-header .thumb img {border-radius: 50%;height: 60px;width: 60px;display: block;}
	.mobile-menu-header .text {}
	.mobile-menu-header .text .heading {display: flex;align-items: center;font-family: "Roboto Flex",serif;text-transform: capitalize;font-size: 20px;font-weight: 700;color: #000;}
	.mobile-menu-header .text .heading .btn {padding: 6px 18px !important;font-size: 14px;min-width: auto;}
	.mobile-menu-header .text .sub-heading {}
	.mobile-menu-header .text .sub-heading a {padding: 0;position: relative;top: -1px;font-size: 14px;color: #5C2EDE;}
	.mobile-menu-body {padding-top: 10px;}
	.mobile-menu-body ul {}
	.mobile-menu-body ul li {}
	.mobile-menu-body ul li a {display: flex;align-items: center;}
	.mobile-menu-body ul li a .material-symbols-outlined {margin-right: 12px;color: #5C2EDE;}
	.mobile-menu-body ul li a:hover {background:#5C2EDE;color:#fff}
	.mobile-menu-body ul li a:hover .material-symbols-outlined {color:#fff}
	body.menu-open {overflow: hidden;}
	.mobile-menu.active {left: 0;}
	.mobile-menu {position: fixed;top: 0;left: -100%;width: 85%;height: 100%;background: #fff;box-shadow: 2px 0 5px rgba(0,0,0,0.3);transition: left 0.3s ease;z-index: 1001;display:block}
	.header-bar-social li {margin: 0 2px;}
	
	.site-branding h1 {font-size: 30px;}
	.site-branding h2 {font-size: 18px;text-align: center;}
	.search-bar input[type="text"] {min-width: 100%;width: 100%;height: 64px;}
	.search-bar {width: 100%;margin: 20px 0;}
	.top-header-bar {position: relative;padding: 13px 0;}
	.upload-btn {position: absolute;right: 0;}
	.logo img {height: 24px;display: inline-block;}
	.header-bar-text {width: 30px;margin-right: 0;align-items: center;}
	.header-bar-text .btn {min-width: 80px;margin-left: 0;font-size: 13px;padding: 7px 10px !important;}
	.logo {top: 5px;text-align: center;}
	.site-header {border-bottom: #eee 1px solid;}
	.myaccount {/*margin-top: 30px;*/}
	.myaccount .profile-img img, .profile-photo .thumb img {height: 90px;width: 90px;}
	.myaccount h2 {font-size: 26px;margin-bottom: 8px;}
	.myaccount .btn, .profile-photo .button a {padding: 8px 18px;font-size: 14px;}
	.myaccount .profile-img {margin-right: 20px;}
	.form-join .form-row-half {grid-template-columns: 100%;}
	.form-join .form-row input, .form-join .form-row textarea, .fake-textbox {padding: 12px;}
	.form-join .form-row label {font-size: 15px;}
	.form-join .form-row div {margin-bottom: 12px;}
	.form-join .form-row {margin: 0;}
	.profile-form h2 {margin: 20px 0;font-size: 24px;}
	.upload-sec {/*margin-top: 30px;*/}
	.site-branding h1 {font-size: 30px;}
	.upload-sec p {font-size: 15px !important;}
	.upload-area {margin: 10px 10px 30px;}
	.upload-area p {font-size: 18px;}
	.upload-area h2 {font-size: 20px;}
	.outer-container {margin-top: 30px;}
	.form-join h2 {font-size: 26px;}
	.join-page h1 {font-size: 30px !important;}
	.join-page h2 {font-size: 17px !important;line-height: 26px;text-align: left !important;}
	.join-page ul li {font-size: 14px;line-height: 22px;margin-bottom: 10px;}
	.form-join .form-row-button input {font-size: 16px;}
	.form-join .form-row input, .form-join .form-row textarea, .fake-textbox {font-size: 15px;}
	.alert {font-size: 14px;}
	.form-join .form-row-otp input {width: 65px;font-size: 20px;}
	.form-join .form-row-otp {margin-bottom: 15px !important;}
	.form-join p {font-size: 15px;}
	.site-branding {padding: 10px 0;}
	.myaccount .acc-tabs {margin-top: 30px;}
	.notfound {font-size: 15px;}
	.myaccount .acc-tabs .tabs-link a {font-size: 15px;}
	.top-header-col {grid-template-columns: 20% 50% 20%;}
	.join-page {padding: 20px !important;}
	.myupload-grid .myupload-item {width: 100%;}
	.myupload-grid {grid-template-columns: 100%;}
	.myupload-grid .myupload-item img {height: 200px;}
	.down-text {display:none}
	.homegallery .item .author-info .user {display: none;}
	
	.dash-data .dash-stats-grid {grid-template-columns: 100%;}
	.dash-data {margin-top: 12px;}
	.dash-chart .dash-chart-box .content img, .chart-container {height: 200px;}
	.dash-chart .dash-chart-box h2 {font-size: 18px;}
	#uploadActivityChart {padding: 10px 0;}
	.otherinfo {opacity: 1 !important;bottom: 0 !important;}
	.homegallery .item .icons {top: 10px !important;right: 10px !important;opacity: 1 !important;}
	.download-btn .material-symbols-outlined, .homegallery .item .icons .material-symbols-outlined {font-size: 18px;}
	.otherinfo .download a {padding: 4px 8px;}
	.homegallery .item .author-info .thumb img {height: 28px;width: 28px;}
	.otherinfo {padding: 10px;}
	.homegallery .item .icons a {height: 28px;width: 28px;}
	
}

@media screen and (max-width: 768px) {
.masonry__container {column-count: 3;}
}

@media screen and (max-width: 576px) {
.masonry__container {column-count: 2;}
}