/*--Responsive CSS--*/

/* Extra small devices (phones, <480px) */
@media screen and (max-width: 480px) {
	.login-wrapper .card {
	    width: 350px;
	    padding: 20px 15px;
	}
	.logo {
	    margin: 10px 0 20px;
	    text-align: center;
	}
	.card.dash-design.extn h5, .exp h3 {
	    font-size: 20px;
	}
	.main-wrapper .nav-tabs li.nav-item .nav-link {
	    font-size: 15px;
	}
	.main-wrapper .nav-tabs {
    	margin: 0 0 30px;
		flex-direction: column;
	}
	.dash-design h5 {
	    font-size: 30px;
	    line-height: 40px;
	}
	#diampopup .token-input,
	#diampopup .amount-input input{
		width: 100%;
	}
	.dt-paging, #payhistory_info{
		position: relative;
		display: flex;
		width: 100%;
		align-items: center;
		justify-content: center;
	}
	.main-wrapper .dt-layout-cell.dt-layout-start{
		width: 100%;
	}
	.swap-header{
		flex-direction: column;
		grid-gap: 10px;
	}
	.swap-section .input-group input{
		width: 70%;
	}
	.swapContainer {
		width: 100%;
	}
	.main-wrapper .tab-content{
		padding-bottom: 30px;
	}
	button#maxBtn {
		margin-left: 5px;
	}
	.page-wrapper .accordion-body {	
		padding-right: 20px;
	}
	.page-wrapper .accordion-button::after{
		background-size: 14px;
		background-position: 5px;
	}
	.login-wrapper {
		padding: 50px 20px;
	}
	.login-wrapper .card input{
		min-height: 40px;
		padding: 10px 15px;
		font-size: 16px;
	}
}

/* Small devices (phones/tablets, 481px - 768px) */
@media screen and (min-width: 481px) and (max-width: 768px) {
	.card.dash-design.extn h5, .exp h3 {
	    font-size: 16px;
	    line-height: 25px;
	}
	.card.dash-design.extn p {
	    font-size: 15px;
	}
	.swapContainer {
		width: 70%;
	}
	.login-wrapper {
		padding: 50px 0;
	}
}

/* Medium devices (tablets/laptops, 769px - 1024px) */
@media screen and (min-width: 769px) and (max-width: 1024px) {
	.card.dash-design.extn h5, .exp h3 {
	    font-size: 16px;
	    line-height: 25px;
	}
	.card.dash-design.extn p {
	    font-size: 15px;
	}
	.swapContainer{
		width: 60%;
	}
	.login-wrapper {
		padding: 50px 0;
	}
}

/* Large devices (desktops, 1025px - 1366px) */
@media screen and (min-width: 1025px) and (max-width: 1366px) {
	.card.dash-design.extn h5, .exp h3 {
	    font-size: 20px;
	    line-height: 30px;
	}
	.swapContainer {
		width: 50%;
	}
	.login-wrapper{
		padding: 50px 0;
	}
}

/* Extra large devices (large desktops, 1367px and up) */
@media screen and (min-width: 1367px) {
	/* .card.dash-design.extn h5, 
	.exp h3 {
	    font-size: 20px;
	    line-height: 30px;
	} */
}

/* additional screens: 1600, 1536, 1440, 1366, 1280, 1024, 920, 820, 760, 640, 540, 480 */