.search-results {	
	font-family: Montserrat;
	color: #333333;
	position: relative; 
	height: 100vh; 
	box-sizing: border-box;
}

.address-option {
	display: flex;
	color: #2dbe4d;
	font-size: 14px;
    font-weight: 500;
    padding: 10px;
}
.address-option.reserved {
	color: rgb(97, 97, 97);
}
.address-option.selected {
	background: rgba(255, 248, 79, 0.17);
}

.status-tag {
	text-align: left;
    font-family: 'SFProText';
    color: #6bba1c;
    font-weight: 500;
    font-size: 18px;
    width: calc(100% - 24px);
    margin-left: 5px;
    margin-right: 5px;
}
.status-tag.reserved {
	background-color: rgba(97, 97, 97, 0.1);
	color: rgb(97, 97, 97);
}

.star-icon {
	background: url('../assets/star-grey.svg');
	background-size: 100% 100%;
	width: 34px;
	height: 34px;
	margin-right: 5px;
}
.star-icon.yellow {
	background: url('../assets/star-yellow.svg');
}

.info-icon {
	background: url('../assets/info.svg'); 
	width: 22px; 
	height: 22px;
	cursor: pointer;
}

.title {
	font-size: 24px;
	font-weight: 600;
	line-height: 24px;
	font-family: 'Montserrat';
	color: black;
}

.subtitle {
	font-size: 16px;
	font-weight: 600;
	line-height: 16px;
	font-family: 'Montserrat';
	color: black;
}

.label-text {
	font-family: 'SFProText';
	font-size: 14px;
	font-weight: 400;
	color: #757575;
}

.block-details-wrapper {
	display: flex; 
	padding: 16px 16px; 
	box-sizing: border-box; 
	position: relative;
	height: calc(100% - 52px);
}

.block-details-container .search-wrapper {
	display: flex; 
	margin-bottom: 30px; 
	position: relative; 
	z-index: 2;
}

.block-panel {
	width: 396px; 
	background: white; 
	border-radius: 10px; 
	color: black;
	position: relative; 
	z-index: 1;
	overflow: hidden;
}

.block-panel-content {
	overflow: auto; 
	max-height: calc(90vh);
}

.block-panel-header {
	border-bottom: 1px solid #f3f3f3;
}

.close-icon {
	color: rgba(0, 0, 0, 0.54); 
	position: absolute; 
	top: 0; 
	right: 0; 
	font-weight: bold;
	display: none;
}

.block-panel-section {
	padding: 16px; 
	border-bottom: 1px solid #f3f3f3;
}

.scrollable-section {
	overflow: auto; 
	max-height: calc(100vh - 233px);
}

.map-container {
	height: 100%; 
	width: 100%; 
	position: fixed; 
	top: 0; 
	left: 0; 
	z-index: 1;
}

.success-gif-container {	
	background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
	width: 100%; 
	height: 224px;
}
.success-gif-container.img0 {background-image: url('../assets/success-gifs/0.gif'); }
.success-gif-container.img1 {background-image: url('../assets/success-gifs/1.gif'); }
.success-gif-container.img2 {background-image: url('../assets/success-gifs/2.gif'); }
.success-gif-container.img3 {background-image: url('../assets/success-gifs/3.gif'); }
.success-gif-container.img4 {background-image: url('../assets/success-gifs/4.gif'); }
.success-gif-container.img5 {background-image: url('../assets/success-gifs/5.gif'); }
.success-gif-container.img6 {background-image: url('../assets/success-gifs/6.gif'); }
.success-gif-container.img7 {background-image: url('../assets/success-gifs/7.gif'); }
.success-gif-container.img8 {background-image: url('../assets/success-gifs/8.gif'); }
.success-gif-container.img9 {background-image: url('../assets/success-gifs/9.gif'); }
.success-gif-container.img10 {background-image: url('../assets/success-gifs/10.gif'); }
.success-gif-container.img11 {background-image: url('../assets/success-gifs/11.gif'); }
.success-gif-container.img12 {background-image: url('../assets/success-gifs/12.gif'); }
.success-gif-container.img13 {background-image: url('../assets/success-gifs/13.gif'); }
.success-gif-container.img14 {background-image: url('../assets/success-gifs/14.gif'); }
.success-gif-container.img15 {background-image: url('../assets/success-gifs/15.gif'); }
.success-gif-container.img16 {background-image: url('../assets/success-gifs/16.gif'); }
.success-gif-container.img17 {background-image: url('../assets/success-gifs/17.gif'); }

.custom-intercom-launcher {
	position: fixed;
    bottom: 20px;
    right: 65px;
    z-index: 1;
    background: #3047EC;
    cursor: pointer;
    box-shadow: 0 1px 6px 0 rgb(0 0 0 / 6%), 0 2px 32px 0 rgb(0 0 0 / 16%);
    width: 60px;
    height: 60px;
    border-radius: 50%;
    display: flex;
}
.custom-intercom-launcher > div {
	display: flex;
    width: 35px;
    height: 35px;
    margin: auto;
    fill: rgb(255, 255, 255);
}

#transition-overlay {
	background: white; 
	position: absolute; 
	top: 0; 
	left: 0; 
	width: 396px; 
	height: 100%; 
	border-radius: 8px; 
	display: flex; 
	z-index: 2;
}

.fade .block-panel {	
	transition: opacity 0.5s;
	opacity: 1;
}
.fade.out .block-panel {
	transition: none;
	opacity: 0;
}
.fade #transition-overlay {
	transition: opacity 0.5s;	
	opacity: 1;
}
.fade.out #transition-overlay {	
	opacity: 0;
}

#notification-container {
	position: absolute; 
	bottom: 90px; 
	right: 70px; 
	z-index: 5;
}

#owned-blox {
	width: 375px;
    height: 56px;
    background: white;
    position: absolute;
    top: 70px;
    right: 24px;
    z-index: 3;
    border-radius: 8px;    
    box-sizing: border-box;
    max-height: 85%;    
    overflow: hidden;
}
#owned-blox.expanded, #owned-memory.expanded, #mint-cart.expanded {
	height: auto;
}
#owned-blox .blox-list-header, #owned-memory .blox-list-header,  #mint-cart .blox-list-header{
	display: flex; 
	padding: 16px;
}
#owned-blox.expanded .blox-list-header, #mint-cart.expanded .blox-list-header {
	border-bottom: 1px solid #f3f3f3;
}
#owned-blox .expand, #owned-memory .expand, #mint-cart .expand {
	display: flex;
}
#owned-blox .collapse, #owned-memory .collapse, #mint-cart .collapse {
	display: none;
}
#owned-blox.expanded .expand, #owned-memory.expanded .expand, #mint-cart.expanded .expand {
	display: none;
}
#owned-blox.expanded .collapse, #owned-memory.expanded .collapse, #mint-cart.expanded .collapse {
	display: flex;
}
#owned-blox #my-blox-list {
	padding: 16px; 
	max-height: calc(80vh - 108px); 
	box-sizing: border-box; 
	overflow: auto;
}

#owned-memory {
    width: 375px;
    height: auto;
    background: white;
    position: absolute;
    top: 140px;
    right: 24px;
    z-index: 1;
    border-radius: 8px;
    box-sizing: border-box;
    max-height: 85%;
    overflow: hidden;
}

.list-of-bar{
	margin-top: 40%;
}

.memory-step-title {
	margin-block: unset;
    font-weight: 600;
    font-size: 20px;
	font-family: SFProText;
}

.memory-step-detail{
	color: #757575;
	font-family: SFProText;
	font-size: 16px;
	margin-top: 8px;
    margin-bottom: 24px;
}

.gm-style-iw-t {
	display: none;
}

.social-account{
	cursor: pointer;
	margin: 8px 8px 0px 0px;
	width: 24px;
    height: 24px;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
}

#cookie-warning {
	position: absolute;
	bottom: 5%;
	right: 10%;
	z-index: 1;
	background: white;
	border: 1px solid #f3f3f3;
	border-radius: 8px;
	padding: 16px;
	width: 375px;
	font-family: 'SFPROTEXT';
	color: black;
	font-size: 16px;
	line-height: 20px;
	box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.13);
	display: none;
	box-sizing: border-box;
}

.pressed-menu-btn {
	background: #f3f3f3;
    border-radius: 8px;
}

.communtiy-name{
	display: flex;    
	margin-top: 12px;
}

.choose-wallet-title{
    font-family: SFPROTEXT;
    font-weight: 400;
    font-size: 20px;
}

.select-wallet-button, .select-payment-button{
	width: 100%;
    padding: 10px;
    background: #FFFFFF;
    margin: 10px;
    border: 1px solid #DEDEDE;
    cursor: pointer;
}

.select-wallet-button:hover, .select-payment-button:hover{
	background-color: #DEDEDE;
}

.select-wallet-button:disabled{
	background: #DEDEDE;
	cursor: none;
}

.select-payment-button{
	display: flex;
    align-items: center;
    justify-content: center;
}

.checkout{
	display: none;flex-direction: column;align-items: center;
}

.checkout-active {
	display: flex;
}

.success-checkout-modal{
	width: 450px  !important;
	height: auto !important;;
	top: 40px !important;;
    left: calc(50% - 195px) !important;
	padding: 24px;
}
.success-checkout-modal .success-gif-container {
	background-size: cover;    
    height: 197px;
    border-radius: 8px;
}

#contract-address-of-city{
	background: #F3F3F3;
    border: none;
    border-radius: 8px;
    padding: 14px;
    color: #757575;
    font-family: 'SFPROTEXT';
    max-width: 90%;
    width: inherit;
}

.modal.opensea-link-modal {
    width: 554px;
    height: 258px;
    top: calc(50% - 179px);
    left: calc(50% - 277px);
	padding: 24px;
}

#opensea_link::placeholder {
    color: #DEDEDE;
}

.modal.auto-import-blox-modal{
	padding: 1%;
	margin: 0 auto;
	height: 320px;
	top: calc(50% - 160px);
}

.moments-shortcuts {
	display: none;
}
.show-moments-shortcuts .moments-shortcuts {
	display: block;
}
.show-moments-shortcuts #mobile-search-toggle {
	/*margin-top: 70px;*/
}

.search-title{
	color: white;font-size: 42px;font-family: Montserrat;
}

.blox-details-tab {
	color: #757575; 
	font-weight: 400; 
	padding: 16px;
}
.blox-details-tab.selected {
	color: #EA794C; 
	font-weight: 700; 
	border-bottom: 2px solid;
}
.blox-details-content {
	display: none;
	color: #EA794C; 
}
.blox-details-content.selected {
	display: block;
}
.memories-content {
	display: none;
}
.memories-content.selected {
	display: block;
}

.memory-creation-options-overlay {
	position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 4;
	display: none;
}
.memory-creation-options-overlay.show {
	display: flex;
}


.tab-panel {
    display: flex;
    flex-direction: row;
    font-family: 'SFProText';
    font-style: normal;
    font-weight: 600;
    font-size: 18px;
}

.tab-panel div {
    width: 50%;
    text-align: center;
    color: #757575;
}

.tab-active {
    color: #F37442 !important;
}

.collection-stage-header {
	font-family: 'SFProText';
	font-size: 24px;
	font-weight: 600;
	color: #757575;
	margin-bottom: 4px;
	margin-left: 10px;"
}


/* Style for the checkbox container */
.checkbox-container {
    display: block;
    position: relative;
    padding-left: 30px;
    margin-bottom: 15px;
    cursor: pointer;
    user-select: none;
}

/* Hide the default radio button */
.checkbox-container input[type="checkbox"] {
    position: absolute;
    opacity: 0;
}

/* Style for the custom checkbox */
.checkmark {
    position: absolute;
    top: 0;
    left: 0;
    height: 20px;
    width: 20px;
    border: 1px solid #ccc;
    border-radius: 20px;
}

/* Style for the custom checkbox when it's checked */
.checkbox-container input[type="checkbox"]:checked + .checkmark {
    background-color: #EA794C;
    border: 1px solid #EA794C;
}

/* Style for the checkmark inside the custom checkbox */
.checkmark::after {
    content: "";
    position: absolute;
    display: none;
}

/* Style for the checkmark inside the custom checkbox when it's checked */
.checkbox-container input[type="checkbox"]:checked + .checkmark::after {
    display: block;
    content: "\2713";
    font-size: 16px;
    color: white;
    top: 1px;
    left: 5px;
}


.my-tokens {
    display: flex;
    flex-direction: row;
    padding: 16px;
    border: 1px solid #DEDEDE;
    box-sizing: border-box;
    border-radius: 16px;
    align-items: baseline;
}

.my-tokens-header {
    font-family: SFProText;
    color: #757575;
    margin-block: unset;
}

.my-tokens-group {
    display: flex;
    flex-direction: row;
    align-items: center;
    padding-top: 16px;
}


.my-metarent {
    width: 33%;
    border-right: 1px solid #DEDEDE;
    box-sizing: border-box;
}

.my-metacoin {
    width: 33%;
    padding-left: 16px;
    box-sizing: border-box;
    border-right: 1px solid #DEDEDE;
}

.my-credit {
    width: 33%;
    padding-left: 16px;
    box-sizing: border-box;
}

span.my-amount, span.my-address {
    color: #000000;
    font-family: SFProText;
    font-style: normal;
    font-weight: 500;
    font-size: 24px;
    margin-left: 1%;
}

span.my-address {
    font-size: 20px;
    padding-right: 3%;
}

.connect-to-external {
    color: #F37442;
    font-family: 'Montserrat';
    font-weight: 600;
    font-size: 18px;
    padding-right: 2%;
    margin-block: unset;
    cursor: pointer;
}

.blox-gallery-for-user {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}

.blox-card-panel {
    display: flex;
    flex-direction: column;
    width: calc(33% - 13px);
    height: auto;
    background: #FFFFFF;
    border: 1px solid #DEDEDE;
    box-sizing: border-box;
    border-radius: 16px;
    margin-right: 13px;
    margin-bottom: 13px;
}

/*Overwrite the initial css of address_transaction tier-level.css */
.tier-label {
    width: 30px !important;
}

.tier-label .level {
    font-size: 14px !important;
}

.blox-card-header {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    padding: 12px;
}

.blox-info-wrap {
    display: flex;
    flex-direction: row;
    align-items: center;
    width: 100%;
}

.blox-number {
    width: auto;
    color: #000000;
    font-size: 24px;
    font-weight: bold;
    margin: unset;
    font-family: SFProText;
    padding-right: 5%;
    cursor: pointer;
}

.blox-tier-level {
    width: 15%;
}

.metarent-info {
    width: 100%;
}

.blox-received-type-group {
    display: flex;
    flex-direction: row;
    align-items: center;
    width: 100%;
    font-size: 14px;
}

.blox-received-type {
    font-family: SFProText;
    color: #757575;
    padding-left: 3%;
}

.action-items-button {
	font-family: Montserrat;
	font-style: normal;
	font-weight: 600;
	font-size: 18px;
	line-height: 18px;
	color: #F37442;
	text-align: center;
	cursor: pointer;
}

/* Featured memories area*/
.featured-memories-container {
  font-family: Arial, sans-serif;
  padding: 20px 0;
  border-radius: 12px;
  background: #fff;
  max-width: 700px;
  margin: auto;
}

.section-title {
  font-size: 24px;
  font-weight: bold;
  margin-bottom: 16px;
}

.tabs {
  display: flex;
  gap: 12px;
  margin-bottom: 16px;
}

.tab-btn {
  padding: 10px 18px;
  border-radius: 9999px;
  background-color: #f2f2f2;
  border: none;
  color: #666;
  cursor: pointer;
  font-weight: 500;
  transition: background-color 0.3s, color 0.3s;
}

.tab-btn.active {
  background-color: #ffe4e1;
  color: #f97316;
}

.tab-content {
  display: none;
}

.tab-content.active {
  display: block;
}




@media screen and (min-width: 813px) {
	.mobile-only {
		display: none !important;
	}

	.block-details-container.drawer {
		position: absolute;
	    top: 0px;
	    left: 0;
	    height: calc(100vh - 52px);
	}
	.block-details-container.drawer .block-interface {
		height: 100%;
	}
	.block-details-container.drawer .block-panel {
		height: 100%;
		border-radius: 0;
	}

	.footer-ui {
		position: absolute; 
		width: 260px;
		bottom: 2%;
		left: 50%;
		transform: translateX(-50%);
		background: white;
        border-radius: 16px;
	}
	.footer-ui.padded {
		padding: 16px;
	}	

	.block-interface .block-panel .hide-when-contracted {
		height: 100%;
	}
	.block-panel .hide-when-contracted .dynamic-height-section {
		height: calc(100% - 146px);
	}


}
@media screen and (max-width: 812px) {
	body {
		overflow-y: hidden;
    	overscroll-behavior: none;
	}
	
	.desktop-only {
		display: none !important;
	}

	.search-results {	
		padding: 0;
		position: fixed;
	    width: 100%;
	    top: 0;
	    left: 0;
	    height: 100%;
	}

	.block-details-wrapper {
		padding: 0;
		height: calc(100% - 62px);		
	}
	.block-details-wrapper.expanded {
		height: 100%;
		width: 100%;
		position: absolute;
		top: 0;
		left: 0;
		z-index: 3;
	}

	.block-details-container {
		width: 100%;
		min-height: 100%;
    	position: relative;
	}
	.block-details-container .search-wrapper {
		padding: 15px;
	}	

	.block-panel {
	    width: auto;
	    height: auto;
	    max-height: 68px;
	    min-height: 68px;
	    box-sizing: border-box;
	    /*transition: max-height 0.75s;*/
	    border-radius: 10px 10px 0px 0px;
	}
	.block-panel.show-states {
		max-height: 100%;
	}
	.block-interface.expanded .block-panel {		
    	box-shadow: none;
    	border-radius: 0;
    	overflow: hidden;
    	max-height: 100vh;
    	height: 100%;
	}

	.block-interface.expanded .show-more {
		display: none;
	}
	.block-interface .show-less {
		display: flex; 
		font-size: 14px; 
		color: #f37442; 
		font-family: 'SFProText'; 
		margin: auto; 
		margin-right: 0;
	}
	.block-interface:not(.expanded) .show-less {
		display: none;
	}
	.collapse-bar {
		display: none;
	}
	.block-interface.expanded .collapse-bar {
		display: flex;
		padding: 10px;
	}

	.block-panel-content {
		height: auto;
		max-height: 0;
		/*transition: max-height 0.75s;*/
	}
	.block-interface.expanded .block-panel .block-panel-content {		
		max-height: calc(100% - 51px);
	}

	.block-panel-header {
		box-sizing: border-box;
    	height: 65px;
    	padding-top: 3px;
    	border-bottom: none;
	}
	.block-interface.expanded .block-panel .block-panel-header {
		padding-top: 8px;
		border-bottom: 1px solid #f3f3f3;
	}

	.block-interface {
		position: absolute;
    	bottom: 0px;
    	z-index: 2;
    	max-height: 100%;
    	overflow: scroll;
    	width: 100%;
    	border-radius: 0;    	    	
	}
	.block-interface.expanded {
		height: 100%;
	}

	.expand-bar {
		margin-bottom: 2px;
    	margin-top: -8px;
	}
	.expand-bar > div {
		display: flex;
	    color: #f37442;
	    font-family: 'SFPROTEXT';
	    margin: auto;
	    font-size: 14px;
	}			
	
	.block-interface.expanded .block-panel .close-icon {
		display: block;
	}

	.expanded .hide-when-expanded {
		display: none;
	}

	.block-interface .block-panel .hide-when-contracted {		
		max-height: 100%;
		overflow: hidden;
		height: calc(100% - 80px);
	}
	.block-interface:not(.expanded) .block-panel .hide-when-contracted {
		max-height: 0;
    	overflow: hidden;
    	opacity: 0;
    	transition: none;
	}		
	.block-panel .hide-when-contracted .dynamic-height-section {
		/* height: calc(100% - 44px) !important; */
		/*height: calc(100% - 80px) !important;*/
	}

	.top-menu {
		border-top: 1px solid #f3f3f3; 
		padding: 16px 24px; 
		position: absolute; 
		top: 62px; 
		left: 0; 
		z-index: 5; 
		min-height: calc(100% - 62px); 
		background: white; 
		box-sizing: border-box;
		width: 100%;
	}


	.section-divider {
		padding:16px;border-bottom: 1px solid #F4F4F4;border-top: 1px solid #F4F4F4;
	}

	.section-leading-header {
		font-family: Montserrat;font-size: 20px;font-style: normal;font-weight: 600;
		margin-block-start: unset;
		margin-block-end: unset;
	}

	.gmnoprint.gm-bundled-control.gm-bundled-control-on-bottom {
		display: none;
	}

	.map-container {
		height: 100%;
	}

	.scrollable-section {
		max-height: calc(100% - 132px);
		overflow-x: hidden;
	}

	.footer-ui {
		position: relative;
    	background: white;
	}
	.footer-ui.fixed-bottom {
		position: absolute; 
		width: 100%; 
		bottom: 0;
		box-sizing: border-box; 
		left: 0; 
		padding: 16px;
	}

	.custom-intercom-launcher {
	    bottom: 80px;
	    right: 20px;
	}

	#transition-overlay {
		width: 100%;
		height: 200px;
	    bottom: 0;
	    top: auto;
	}

	#notification-container {
		right: auto;
		left: 10px;
	}

	#owned-blox {
		width: 100%;
	    position: relative;
	    top: 0;
	    left: 0;
	}
	#owned-blox.expanded {
		height: 100%;
		max-height: 100%;
	}
	#owned-blox .blox-list-header {
		display: none;
	}
	#owned-blox #my-blox-list {
		max-height: calc(100% - 108px);
	}

	#cookie-warning {
		right: 0;
		bottom: 0;
		width: 100%;
	}

	.modal.auth-modal.checkout-modal {
    	height: 55%;
    	top: calc(50% - 250px);
	}

	.success-checkout-modal{
		padding: 24px;
		width: 320px !important;
		height: 560px !important;;
		left: calc(50% - 160px) !important;;
		top: 100px !important;;
	}

	.modal.success-checkout-modal p {
		margin-block-start: unset !important;
    	margin-block-end: unset !important;
    	padding-bottom: 2% !important;
	}

	.search-title{
		font-size: 24px;
	}

	.search-container.click-away-root {
    	width: 350px !important;
	}

	.tab {
        width: 100% !important;
        display: none;
    }

    .active {
        display: block;
    }

	#my-memories, #my-collections{
		padding: 5%;
        float: unset;
        width: unset !important;
        position: relative;
	}

	.bottom-nav {
		position: absolute;
		bottom: 0;
		width: 100%;
		left: 0;
		background: white;
		border-top: 1px solid #f4f4f4;
		border-bottom: 1px solid #f4f4f4;
		display: flex;
		height: 66px;
		color: #757575;
		z-index: 3;
	}
	.bottom-nav .bottom-nav-icon {
		border: 1px solid;
		border-radius: 100%;
		margin: auto;
		padding: 5px;
	}

	.bottom-nav-icon-active {
		border: 2px solid #EA794C !important;
    	color: #EA794C;
    	background-color: #FFEFE9;
	}

	.my-metarent {
        width: 100%;
        border: none;
    }

    .my-metacoin, .my-credit {
        width: 50%;
		padding-left: unset;
    }

    .my-credit {
        padding-left: 16px;
    }

    .my-tokens {
        max-width: 100%;
    }

    .blox-card-panel {
        width: 100%;
        margin-bottom: 16px;
    }

	.mobile-asset-level-modal-container{

	}
}