/***************************************************************************************************/
/** Custom styles - Responsive *********************************************************************/
/***************************************************************************************************/
@media screen and (min-width: 1800px) {
	.welcomeDepositUsage {
		width: 33.33333333%;
	}
}

@media screen and (min-width: 1026px) {
	.welcomeDividerLeftPanel {
		padding-right: 2rem;
	}

	.welcomeDividerRightPanel {
		padding-left: 2rem;
		height: 100%;
		border-left: 1px solid var(--color-divider);
	}
}

@media screen and (max-width: 1025px) {
	#headerPanel, #bodyPanel {
		padding: 10px 10px;
	}

	#footerPanel .silverSide .contentFooter {
		padding: 10px 10px;
	}

	#mainMenuPanel {
		padding: 0 10px;
	}

	#captionPanel {
		padding-bottom: 0;
	}

	#captionPanel #captionTitlePanel #captionText {
		padding: 10px 10px;
	}

	#bodyPanel #contentPanel #contentBorderPanel {
		margin-left: 10px;
	}

	#bodyPanel #contentPanel #contentBorderPanel .filterPanel {
		margin-bottom: 10px;
	}

	.ui-selectonemenu {
		min-width: 250px !important;
	}

	.welcomeCardContactBlock {
		text-align: center;
	}
}


@media screen and (max-width: 1025px) {
	.cards.hide .card-silbar .ui-card-body .ui-card-content {
	}

}

@media screen and (max-width: 641px) {
	.floatLeftOnMobile {
		float: left;
	}

	#headerPanel #headerLogoPanel1 #headerLogo1 {
		background-image: url("../img/sd-logo-rgb.svg");
		background-repeat: no-repeat;
		width: 200px;
		height: 42px;
		background-size: inherit;
	}

	#headerPanel #authenticationPanel #logoutButtonPanel {
		display: none;
	}

	#headerPanel #authenticationPanel #linkPanel {
		display: none;
	}

	#headerPanel #authenticationPanel .authenticated {
		display: none;
	}

	#headerPanel #mobileMenuControlPanel {
		padding-top: 10px;
	}

	#mainMenuPanel {
		display: none;
	}

	#mainMenuPanel #mainMenu ul.ui-menu-list li.ui-menuitem a.ui-menuitem-link {
		display: block;
		margin: 4px 0;
		background-color: #f8f8f8;
	}

	#mainMenuPanel #mainMenu ul.ui-menu-list li.ui-menuitem a.ui-menuitem-link.ui-state-highlight .ui-menuitem-text {
		background: none;
	}

	#mainMenuPanel #mainMenu ul.ui-menu-list li.ui-menuitem .mainMenuItemForMobile {
		display: block;
	}

	#mainMenuPanel #mainMenu ul.ui-menu-list li.ui-menuitem a#logoutButtonMobile.ui-menuitem-link .ui-menuitem-text {
		color: #fff;
	}

	#mainMenuPanel #mainMenu ul.ui-menu-list li.ui-menuitem a#logoutButtonMobile.ui-menuitem-link.ui-state-hover .ui-menuitem-text {
		color: #fff;
	}

	#bodyPanel #subMenuPanel #subMenu ul.ui-menu-list {
		text-align: center;
	}

	#bodyPanel #subMenuPanel .imagebox img {
		width: 100px;
		margin: 10px;
		padding: 0;
		display: inline;
	}

	#bodyPanel #contentPanel #contentBorderPanel {
		margin-top: 10px;
		margin-left: 0;
	}

	#bodyPanel #contentPanel #contentBorderPanel .listPanel .center {
		text-align: left !important;
	}

	#bodyPanel #contentPanel #contentBorderPanel .listPanel .right {
		text-align: left !important;
	}

	.currencyName {
		padding-left: 10px;
	}

	.ui-datatable table {
		table-layout: fixed;
	}

	.dataTable table tbody tr td.selectControl {
		width: auto;
	}

	.dataTable table tbody tr td.editControl {
		width: auto;
	}

	.dataTable .right, .dataTable .center {
		text-align: left !important;
	}

	.saldoRow {
		border-bottom: none !important;
	}

	.detailColumnLabel, .ui-panelgrid .ui-panelgrid-cell.detailColumnLabel {
		padding-right: 0;
	}

	.tabPanel .ui-tabs-nav li {
		/*width: 100%;*/
	}

	.loginContentPanel {
		width: calc(100% - 60px);
		padding: 40px 30px;
	}

	.loginContentPanel .input-field {

	}

	.loginContentPanel .ui-grid-row {
		border: 0 !important;
	}

	.loginContentOnboarding {
		width: calc(100% - 60px);
	}

	.welcomeCardTitle {
		text-align: center;
	}

	#howToSilbar .barter-silbar-info {
		margin-top: 1rem;
		flex-direction: column;
		text-align: center;
	}
}

@media screen and (min-width: 642px) {
	#headerPanel #mobileMenuControlPanel {
		display: none;
	}

	.loginContentPanel .input-label {
		text-align: right;
	}
}

@media screen and (max-width: 420px) {
	#headerPanel #headerLogoPanel1 {
		float: none;
		width: 100%;
		padding: 0;
	}

	#headerPanel #headerLogoPanel1 #headerLogo1 {
		margin: 0 auto;
	}

	#headerPanel #authenticationPanel {
		width: 50%;
		float: left;
	}

	#headerPanel #authenticationPanel #loggedUserLabel {
		text-align: left;
	}

	#headerPanel #authenticationPanel #loggedUserValue {
		text-align: left;
	}

	#headerPanel #authenticationPanel #localePanel a {
		float: left;
	}

	#headerPanel #mobileMenuControlPanel {
		float: left;
		width: 50%;
	}
}