b0y-101 Mini Shell


Current Path : E:/wordpress/wp-content/themes/spacious/assets/scss/
File Upload :
Current File : E:/wordpress/wp-content/themes/spacious/assets/scss/_responsive.scss

/* =RESPONSIVE STRUCTURE
----------------------------------------------- */
@media screen and (min-width: 1500px) {
	.wide-978 #featured-slider .entry-container {
		left: 17.6%;
	}
	.wide-1218 #featured-slider .entry-container {
		left: 9.6%;
	}
}

@media screen and (min-width: 1650px) {
	.wide-978 #featured-slider .entry-container {
		left: 19.45%;
	}
	.wide-1218 #featured-slider .entry-container {
		left: 11.9%;
	}
}

@media screen and (max-width: 1308px) {
	#page {
		width: 97%;
	}
	.wide-1218 #page, .wide-978 #page {
		width: 100%;
	}
	.inner-wrap {
		width: 94%;
	}
}

@media screen and (max-width: 1078px) {
	body {
		padding: 15px 0;
	}
	#featured-slider .entry-container {
		max-width: 60%;
	}
	.call-to-action-content {
		float: none;
		width: 100%;
		margin-bottom: 10px;
		text-align: center;
	}
	.call-to-action-button {
		width: 93%;
	}
	.footer-socket-wrapper {
		.copyright {
			float: none;
			max-width: 100%;
			text-align: center;
			margin-bottom: 5px;
		}

		.small-menu {
			float: none;
			text-align: center;

			li {
				float: none;
				display: inline;

			}

			a {
				float: none;
				display: inline;
				padding: 5px 5px 0;
			}
		}
	}
	.small-menu li.default-menu, li.default-menu {
		display: none;
	}
	.tg-one-half, .tg-one-third, .tg-one-fourth {
		float: left;
		width: 46.7684729%;
	}
	#colophon {
		.tg-one-third {
			float: left;
			margin-right: 2.38916257%;
			padding: 0 0 30px;
			width: 31.7405583%;

			&.tg-after-two-blocks-clearfix {
				clear: none;
			}
		}
	}
	.widget_service_block .tg-one-third {
		float: left;
		margin: 0 2.46305%;
		padding: 0 0 30px;
		width: 28.4072%;
	}
	.tg-one-half-last, .tg-one-fourth-last {
		float: right;
	}
	.tg-service-left {
		float: left;
		margin: 0;
	}
	.tg-service-right {
		float: right;
		margin: 0;
	}
	.tg-column-1, .tg-column-3 {
		float: left;
		width: 46.7684729%;
	}
	.tg-column-2, .tg-column-4 {
		float: right;
		margin-right: 0;
	}
	.tg-after-two-blocks-clearfix {
		clear: both;
	}
	.tg-after-three-blocks-clearfix {
		clear: none;
	}
}

@media screen and (max-width: 1200px) and (min-width: 768px) {
	.no-sidebar-full-width,
	.no-sidebar {

		#primary {

			.entry-content {

				> .alignwide {
					margin-left: -40px;
					margin-right: -40px;
				}
			}
		}
	}
}

@media screen and (max-width: 768px) {
	.no-sidebar-full-width,
	.no-sidebar {

		#primary {

			.entry-content {

				> .alignwide {
					margin-left: -15px;
					margin-right: -15px;
				}
			}
		}

		&.narrow-978,
		&.narrow-1218 {

			#primary {

				.entry-content {

					> .alignwide {
						margin-left: -15px;
						margin-right: -15px;
					}

					> .alignfull {
						margin-left: -30px;
						margin-right: -30px;
					}
				}
			}
		}
	}

	.no-sidebar {
		#primary {

			.entry-content {

				> .alignfull {
					margin-left: -15px;
					margin-right: -15px;
				}
			}
		}
	}

	#primary, #secondary, .wide-978 #primary, .narrow-978 #primary {
		float: none;
		width: 100%;
		margin: 0;
	}
	#header-left-section {
		float: none;
		max-width: 100%;
		margin-right: 0;
	}
	#header-logo-image {
		float: none;
		text-align: center;
		margin-bottom: 10px;
		padding-right: 0;
	}
	#header-text {
		float: none;
		text-align: center;
		padding: 0;
		margin-bottom: 10px;
	}
	#site-description {
		padding-bottom: 5px;
	}
	#header-right-section {
		float: none;
		max-width: 100%;

		.widget {
			padding: 0 0 10px 0;
			float: none;
			text-align: center;
		}
	}

	.site-header .menu-toggle {
		display: block;
		text-align: left;
		padding: 10px 20px;
	}

	.main-small-navigation {
		width: 100%;
	}

	.main-navigation {
		float: none;

		&.toggled .nav-menu {
			display: block;
		}

		.menu-primary-container {
			> ul {

				.spacious-menu-header-button-enabled & {
					display: none;
				}
			}
		}

		ul {
			display: none;
		}

	}
	#featured-slider {
		.entry-container {
			max-width: 70%;
		}

		.entry-description-container {
			padding: 0.5rem 1rem;
		}

		.slider-title-head {
			margin-bottom: 0;
		}

		.entry-title span {
			font-size: 18px;
			line-height: 1.4;
		}

		.entry-content p {
			font-size: 14px;
			line-height: 1.4;
		}

		.slider-read-more-button {
			font-size: 14px;
			padding: 0.5rem 1rem;
		}
	}

	.woocommerce,
	.woocommerce-page {
		.related {
			ul.products {
				li {

					&.first {
						clear: both;
					}

					&.product {
						width: 48%;
						margin: 0 0 1em 0;
					}
				}
			}
		}
	}

	.woocommerce .related ul.products li.product,
	.woocommerce-page .related ul.products,
	.woocommerce form .form-row {
		input.input-text, textarea {
			line-height: 1.5em;
			padding: 10px;
		}
	}
	.woocommerce-page form .form-row {
		input.input-text, textarea {
			line-height: 1.5em;
			padding: 10px;
		}
	}
	/* =RESPONSIVE SUB TOGGLE MENU
	----------------------------------------------- */
	/* sub-toggle */
	.sub-toggle {
		background: #0FBE7C none repeat scroll 0 0;
		color: #ffffff;
		cursor: pointer;
		display: block;
		height: 24px;
		line-height: 21px;
		position: absolute;
		right: 15px;
		text-align: center;
		top: 9px;
		width: 24px;
	}
	.main-small-navigation li.current-menu-item > .sub-toggle {
		background: #ffffff none repeat scroll 0 0;

		i {
			color: #d40234;
		}
	}
	.better-responsive-menu .menu-primary-container .sub-menu {
		display: none;
	}
	.sub-toggle span {
		display: inline-block;
		font-size: 11px;
		line-height: 23px;
		margin-left: 0;
	}
	.main-small-navigation li:hover > .sub-toggle {
		background: #ffffff;
		color: #0FBE7C;
	}
	.sub-toggle span.genericon-downarrow {
		line-height: 30px;
		margin-left: 0;
	}

	.site-header.spacious-header-display-four {
		.bottom-menu {
			position: relative;

			.menu-toggle {
				position: absolute;
				z-index: 9999;
				right: 20px;
				top: -40px;
			}
		}
	}


	.better-responsive-menu {

		#header-right-section {
			float: right;
			margin-top: 15px;
			max-width: 100%;
		}

		#site-navigation {
			float: right;
			margin-top: 10px;
			padding: 0;
		}

		.main-small-navigation {
			margin-top: 10px;
		}

		#header-logo-image {
			float: left;
			margin-bottom: 0;
			margin-right: 10px;
		}

		#header-left-section {
			float: left;
			margin-top: 10px;
		}

		#header-text {
			margin: 13px 0 0;
			float: left;
			text-align: left;
		}

		#site-description {
			font-size: 13px;
			margin-bottom: 0;
		}

		#site-title a {
			font-size: 28px;
		}

		.site-header .menu-toggle {
			background: #3a3a3a none repeat scroll 0 0;
			color: #fff;
			height: 36px;
			margin: 0;
			padding: 0;
			position: relative;
			text-align: center;
			width: 40px;
		}

		#header-text-nav-wrap {
			padding: 0;

			#header-right-section .widget {
				padding: 0;
			}

		}

		.site-header .menu-toggle::before {
			font-size: 21px;
			left: 50%;
			line-height: 25px;
			margin-right: 0;
			position: absolute;
			top: 50%;
			-webkit-transform: translate(-50%, -50%);
			-moz-transform: translate(-50%, -50%);
			-ms-transform: translate(-50%, -50%);
			-o-transform: translate(-50%, -50%);
			transform: translate(-50%, -50%);
		}

		#header-text-nav-container {
			position: relative;
			margin-bottom: 15px;
			border: none;
		}

		#site-navigation .menu-primary-container {
			left: 0;
			position: absolute;
			top: 100%;
			width: 100%;
			z-index: 9999;
		}
	}
}

@media screen and (max-width: 767px) {

	.social-links {
		float: none;
		padding-right: 0;
		padding-top: 10px;
	}

	.small-info-text {
		float: none;
		padding-right: 0;
	}

	.social-links ul {
		display: inline-block;
	}

	#header-meta {
		text-align: center;

		.small-menu {
			float: none;

			ul {
				display: inline-block;
			}
		}
	}

	.tg-one-half, .tg-one-third, .tg-one-fourth, .widget_service_block .tg-one-third {
		float: none;
		width: 100%;
		margin: 0;
	}
	.tg-column-1, .tg-column-2, .tg-column-3, .tg-column-4 {
		float: none;
	}
	#primary, #secondary {
		float: none;
		width: 100%;
		margin: 0;
	}
	.wide-978 #primary, .narrow-978 #primary, .wide-978 #secondary, .narrow-978 #secondary {
		width: 100%;
	}
	.related-posts {
		margin: 0;
	}
	#colophon {
		.tg-one-third {
			float: none;
			width: 100%;
			margin: 0;

			&.tg-after-two-blocks-clearfix {
				clear: both;
			}
		}
	}
}

@media screen and (max-width: 600px) {
	.no-sidebar-full-width,
	.no-sidebar {

		#primary {

			.entry-content {

				> .alignwide {
					margin-left: 0;
					margin-right: 0;
				}
			}
		}

		&.narrow-978,
		&.narrow-1218 {

			#primary {

				.entry-content {

					> .alignwide {
						margin-left: 0;
						margin-right: 0;
					}
				}
			}
		}
	}
	.site-header.spacious-header-display-four {
		.bottom-menu {

			.menu-toggle {
				position: relative;
				right: 0;
				top: 0;
			}
		}
	}

	.better-responsive-menu {
		#header-logo-image {
			display: block;
			float: none;
		}

		#header-text {
			display: block;
			float: none;
			margin-top: 12px;
			text-align: center;
		}

		#header-left-section {
			padding-top: 10px;
			text-align: center;
			float: none;
		}

		#header-right-section {
			float: none;
		}

		#header-right-sidebar {
			float: right;
			padding-left: 20px;
		}

		#site-navigation {
			float: none;
			margin-top: 0;
		}

		.site-header.spacious-header-display-four {

			.bottom-menu {
				.menu-toggle {
					position: absolute;
					right: auto;
					top: -45px;
					left: 15px;
				}
			}

			#header-left-section,
			#header-right-section {
				float: none;
			}
		}
	}

	.main-navigation,
	.main-small-navigation {
		padding-top: 8px;
	}

	#featured-slider {
		.entry-description-container {
			padding: 0.3rem 0.6rem;
		}

		.entry-title span {
			font-size: 14px;
		}

		.entry-content p {
			font-size: 10px;
		}

		.slider-read-more-button {
			margin-top: 5px;
			font-size: 10px;
			padding: 0.3rem 0.6rem;
		}
	}
	#controllers {
		bottom: 5px;

		a {
			height: 4px;
			margin: 0 3px;
			width: 12px;
		}
	}

	.woocommerce {
		table {
			font-size: 12px;

			&.shop_table {
				border-collapse: collapse;

				th {
					padding: 9px 2px;
				}

				td {
					padding: 6px 2px;
				}
			}
		}

		ul.products li.product h3 {
			font-size: 18px;
		}
	}
	.woocommerce-page ul.products li.product h3 {
		font-size: 18px;
	}
	.woocommerce ul.products li.product .price, .woocommerce-page ul.products li.product .price {
		font-size: 16px;
	}
	.woocommerce {
		a.button, button.button, input.button, #respond input#submit, #content input.button {
			font-size: 14px;
			margin-bottom: 0;
			padding: 8px 10px;
		}
	}
	.woocommerce-page {
		a.button, button.button, input.button, #respond input#submit, #content input.button {
			font-size: 14px;
			margin-bottom: 0;
			padding: 8px 10px;
		}
	}
	.woocommerce {
		.quantity input.qty, #content .quantity input.qty {
			height: 24px;
		}
	}
	.woocommerce-page {
		.quantity input.qty, #content .quantity input.qty {
			height: 24px;
		}
	}
	.woocommerce {
		table.cart td.actions .coupon .input-text, #content table.cart td.actions .coupon .input-text {
			font-size: 14px;
			height: 32px;
			line-height: 1.5;
			padding: 4px 10px;
			width: 120px;
		}
	}
	.woocommerce-page {
		table.cart td.actions .coupon .input-text, #content table.cart td.actions .coupon .input-text {
			font-size: 14px;
			height: 32px;
			line-height: 1.5;
			padding: 4px 10px;
			width: 120px;
		}
	}
	.woocommerce .cart_totals h2 {
		float: none;
	}

	.gallery-columns-4,
	.gallery-columns-5,
	.gallery-columns-6,
	.gallery-columns-7,
	.gallery-columns-8,
	.gallery-columns-9 {
		.gallery-item {
			width: 25%;
		}
	}

	.author-box {

		.author-img {

			img {
				margin-bottom: 20px;
			}
		}

		.author-description-wrapper {
			margin-left: 0;
		}
	}
}

@media only screen and (max-width: 420px) {
	#page {
		width: 97%;
	}

	.inner-wrap {
		width: 95%;
	}

	#featured-slider {
		.entry-content,
		.slider-read-more-button {
			display: none;
		}
	}

	.gallery-columns-4,
	.gallery-columns-5,
	.gallery-columns-6,
	.gallery-columns-7,
	.gallery-columns-8,
	.gallery-columns-9 {
		.gallery-item {
			width: 33.33%;
		}
	}

	.better-responsive-menu #header-text {
		text-align: center;
	}
}

Copyright © 2019 by b0y-101