/* Extra small devices (phones, less than 768px) */
@media (max-width: 767px) {
	body {
		padding-top: 73px;
	}
	header.navbar {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
	}
	.login-wrapper {
		margin: 5rem auto 0;
	}
	.sidebar {
		position: fixed;
		top: 73px;
		left: -100%;
		transition: left 0.2s ease-out;
	}
	.sidebar.active {
		left: 0;
	}
	.stage {
		padding: 0 15px;
	}
	.stage > .alert {
		margin: 0 -15px;
	}
	.content {
		padding-left: 0;
		padding-right: 0;
	}
	.content-header h2 {
		font-size: 1.5rem;
		margin-bottom: 1.5rem;
	}
	.table-actions .btn {
		margin-top: 7px;
	}
	.table-responsive-sm .column-cb {
		width: 30px;
	}
	.student-schedule-preview .custom-switch,
	.statement-preview .custom-switch,
	.progress-report-preview .custom-switch {
		margin: 10px 0;
	}
	.desktop-only {
		display: none;
	}
	.login {
		width: 100%;
		box-sizing: border-box;
	}
	.current-user {
		position: static;
		margin-bottom: 10px;
	}
	.statement-payment .button,
	.statement-payment .status-text {
		float: none;
	}
	.statement-payment .status-text {
		margin-top: 10px;
	}
	.statement,
	.progress-report {
		padding: 15px;
	}
	.statement .layout-table td {
		display: block;
		width: 100%;
	}
	.statement .header img {
		display: none;
	}
	.statement .statement-title {
		font-size: 24px;
		line-height: auto;
	}
	.statement-items {
		margin-top: 0;
	}
	.view-progress-report .report-download {
		position: static;
		margin-top: 20px;
	}
	.archive-class {
		float: none;
		margin-left: 0;
	}
	.archive-class .button {
		display: block;
		float: left;
		clear: both;
		margin: 5px 0 !important;
	}
	.remodal {
		padding: 35px 15px;
	}
	.record-class-attendance-table thead th {
		text-align: left;
	}
	.record-class-attendance-table thead th span {
		display: block;
		margin-left: 25%;
		-webkit-writing-mode: tb-lr;
		writing-mode: tb-lr;
		-webkit-writing-mode: vertical-lr;
		writing-mode: vertical-lr;
		transform: rotate(-180deg);
		min-height: 5em;
	}
	.gpnf-nested-entries tbody tr td {
		padding: 1rem;
	}
	.tingle-modal-box__content {
		padding: 1rem;
	}
	.gpnf-modal .gpnf-modal-header {
		margin: -1rem -1rem 1rem;
		padding: 0 1rem;
		height: 2.5rem;
		line-height: 2.5rem;
	}
	.tingle-modal-box__footer {
		padding: 1rem;
	}
	.gpnf-nested-entries tbody tr:not(.gpnf-no-entries) td {
		padding: 0.3rem 0.3rem 0.3rem 50%;
	}
	.tingle-modal-box__footer {
		flex-wrap: nowrap;
	}
	.tingle-modal-box__footer .tingle-btn {
		flex-shrink: 1;
		padding: 0.5rem;
		margin-bottom: 0;
	}
	.tingle-modal-box__footer .gpnf-btn-cancel-mobile {
		min-width: 0;
	}
	.tingle-modal--visible .tingle-modal-box__footer {
		height: auto;
	}
	.gpnf-nested-entries ul {
		padding: 0;
	}
	.ginput_container_name {
		display: flex;
	}
	div.ginput_complex.ginput_container.gf_name_has_2 span.name_prefix_select {
		width: 30%;
	}
	div.ginput_complex.ginput_container.gf_name_has_2 span.name_first {
		width: 70%;
	}


	
	/**
	 * Bottom navigation
	 */
	.crm-nav .submenu {
		bottom: 42px;
	}
	.crm-nav > .crm-nav-item:first-child {
		border-left: none;
	}
	.crm-nav > .crm-nav-item:last-child {
		border-right: none;
	}
	.crm-nav > .crm-nav-item > a {
		padding: 10px 5px 10px 8px;
	}
	.crm-nav > .crm-nav-item > a span {
		display: none;
	}
	.crm-nav > .crm-nav-item i {
		font-size: 18px;
		line-height: normal;
	}


	/**
	 * Class resources
	 */
	.class-resources-wrapper .class-files li > div {
		float: none;
	}


	/**
	 * WooCommerce
	 */
	.shop-menu {
		margin: 0 -15px;
	}
	.navbar .mini-cart {
		min-width: 300px;
	}
	.woocommerce #content div.product div.images, 
	.woocommerce div.product div.images, 
	.woocommerce-page #content div.product div.images, 
	.woocommerce-page div.product div.images {
		width: 100%;
	}
	.woocommerce #content div.product div.summary, 
	.woocommerce div.product div.summary, 
	.woocommerce-page #content div.product div.summary, 
	.woocommerce-page div.product div.summary {
		width: 100%;
	}
	.products-filter {
		padding: 15px;
		margin: -30px -15px 2em;
	}
	.products-filter .form-group {
		margin-bottom: 0.5rem;
	}
	.products-filter .form-group.submit {
		margin-top: 0.5rem !important;
	}
	.woocommerce .woocommerce-result-count, 
	.woocommerce-page .woocommerce-result-count,
	.woocommerce .woocommerce-ordering, 
	.woocommerce-page .woocommerce-ordering {
		float: none;
		text-align: center;
		margin-left: auto;
		margin-right: auto;
	}
	.class-bookings-results {
		min-width: 1000px;
	}

	/**
	 * Driver.js UI tour
	 */
	.vipt-page .driver-popover {
		max-width: 90%;
	}
}

/* WP admin bar height increases below this breakpoint — sticky class records header offset */
@media screen and (max-width: 782px) {
	body.admin-bar form.class-records-form table.class-records thead tr {
		top: 46px;
	}
}

/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) {
	.mobile-only {
		display: none;
	}
	header {
		min-height: 73px;
	}
	body.page-template-vipt-dashboard:not(.vipt-page-login) .brand-logo {
		vertical-align: middle;
		width: 210px;
		padding: 6px 0 7px;
		margin: -1rem 0 -1rem -1rem;
		text-align: center;
		background: rgba(2, 33, 65, 0.1);
		background: #0B1E31;
		border-right: 1px solid #ddd;
		border-right: 1px solid rgba(0,0,0,0.1);
		border-bottom: 1px solid rgba(255, 255, 255, 0.1);
	}
	.nav-tabs { 
		border-bottom: 2px solid #f1f1f1;
	}
	.nav-tabs .nav-link {
		border-top: none;
		border-left: none;
		border-right: none;
		padding-left: 0;
		padding-right: 0;
		margin-right: 1.2rem;
		margin-bottom: -1px;
		font-weight: 600;
		color: #999;
		border-bottom: 2px solid transparent;
	}
	.nav-tabs .nav-item.show .nav-link, 
	.nav-tabs .nav-link.active,
	.nav-tabs .nav-link.active:focus,
	.nav-tabs .nav-link.active:hover {
		color: #031b4e;
		border-bottom: 2px solid #0069ff;
	}
	.nav-tabs .nav-link:focus, 
	.nav-tabs .nav-link:hover {
		border-top: none;
		border-left: none;
		border-right: none;
		color: #666;
		border-bottom: 2px solid #bbb;
	}
	.tingle-modal-box {
		width: 90% !important;
	}
	.remodal.class-resources {
		max-width: 900px;
	}
}

/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) {
	.col-count-md-2 {
		column-count: 2;
	}
	.col-count-md-3 {
		column-count: 3;
	}
	.col-count-md-4 {
		column-count: 4;
	}
}

/* Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
	
}

/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) and (max-width: 991px) {

}

/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) and (max-width: 1199px) {
	
}

/* Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
	.stage {
		max-width: calc(100vw - 210px);
	}
}