/*767*/
@media (max-width: 767px) {
	/*--- UI ---*/
	.container {
		width: 100%;
	}
	
	/*--- HEADER ---*/
	.header {
		grid-template-columns: minmax(min-content, max-content) auto minmax(min-content, max-content);
		grid-template-areas: "logo phone burger";
	}
	
	.header-contact--email {
		display: none;
	}
	
	.header__feedback {
		display: none;
	}
	
	.header-contact--phone {
		font-weight: 500;
	}

	.header_social {
		display: none;
	}
	
	/*--- FOOTER ---*/
	.footer {
		display: flex;
		flex-direction: column;
	}
	
	.footer-copiright {
		order: 1;
	}
	
	.footer-inn {
		order: 2;
	}
	
	.footer-phone {
		order: 3;
	}
	
	.footer-adress {
		order: 4;
	}
	
	.footer > div {
		margin-top: var(--hcpadding);
	}
	
	/*--- NAVIGATION ---*/
	.navigation-list {
		display: block;
	}
	
	

	/*--- BREADCRUMBS ---*/
	.section-breadcrumbs {
		padding: var(--cpadding) 0;
		margin: 0 0 var(--cpadding) 0;
		background: var(--main-clr-2);
		color: #fff;
	}
	
	.breadcrumbs-list {
		display: none;
	}

	.breadcrumbs h1 {
		font-size: 1rem;
	}
	
	.breadcrumbs h1:before {
		content: "<";
		padding-right: var(--cpadding);
	}
	
	
	
	/*--- MODAL ---*/
	.modal-wrapper {
		background: #fff;
		backdrop-filter: none;
	}
	
	.modal,
	.invert-body .modal {
		background: none;
		box-shadow: none;
		border: none;
		max-width: unset;
		width: 100%;
		min-width: unset;
		backdrop-filter: none;
	}
	
	.modal-caption {
		text-align: left;
	}
	
	.modal-subcaption {
		text-align: left;
	}
		
	.modal-close {
		position: fixed;
		top: 0;
		right: 0;
		color: var(--text-clr);
	}

	/*--- PORTFOLIO PAGE ---*/
	.portfolio-page__description-wrapper {
		grid-template-columns: 100%;
		grid-gap: var(--cpadding);
		margin: 0 0 var(--cpadding) 0;
	}
	
	.portfolio-page-description {
		padding-top: unset;
	}
	
	.portfolio-page__info {
		margin: 0 var(--mpadding);
		box-shadow: none;
		padding: var(--hcpadding) var(--cpadding);
		border: none;
		border-radius: 0;
		background: var(--main-clr);
		color: #fff;
		grid-template-columns: 133px auto;
	}
	
	.portfolio-page__images {
		margin: 0 0 var(--cpadding) 0;
	}
	
	.portfolio-page__images,
	.portfolio-page__images--mobile {
		padding: 0 calc(var(--cpadding) * 4) 0 var(--cpadding);
		overflow: hidden;
		margin: 0 var( --mpadding);
		width: calc(100% + var(--cpadding) * 2);
	}

	.portfolio-page__images:after,
	.portfolio-page__images--mobile:after {
        content: "";
        display: block;
        position: absolute;
        top: 0;
        right: 0;
        width: calc(var(--cpadding) * 4);
        height: 100%;
        background: linear-gradient(90deg, transparent var(--cpadding), var(--body-clr) 80%);
		opacity: 0.5;
	}
	
	.portfolio-page__images.owl-carousel .owl-stage-outer,
	.portfolio-page__images--mobile.owl-carousel .owl-stage-outer {
        overflow: visible;
	}
	
	/*--- MAIN PAGE ---*/
	.section-main {
	    background-position: center;
	}
	
	body.invert-body .section-header {
	    background: linear-gradient(180deg, #00000099, transparent);
	}
	
	body.invert-body .section-header--hidden {	
		transform: translateY(-110%);
	}
	
	/*about*/
	.section-main.about {
		height: auto;
		min-height: 100vh;
		padding: 0;	
	}
	
	.section-main.about .h-100{
		min-height: 100vh;		
	}	
	
	.section-main.about .container {
		padding: 0;
	}
	
	.main-about__intro {
	    padding: 0 var(--cpadding);	
	    margin: auto 0;	
	}
	
	.main-about {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		text-align: center;
		grid-gap: unset;
		height: 100%;
	    padding: calc(var(--cpadding) + calc(var(--header-height) - 1px)) 0 var(--cpadding) 0;	
	}
	
	.main-about__intro .btn {
	    margin: 0 auto 1.5rem;	
	}
	
	.main-about__chose {
		display: none;	
	}
	
	.main-about__chose-wrapper {
		display: flex;
		justify-content: space-around;
	    margin-bottom: 1rem;	
	}
	
	.main-about__intro h1, 
	.main-about__chose .h1 {
		font-size: 2rem;
		line-height: var(--line-height);
		margin-bottom: 0.75rem;
	}
	
	/*--- SERVICE ---*/
	.section-main.service {
		padding: var(--cpadding) 0;
		height: auto;
	}
	
	.main-service {
		grid-template-columns: 1fr;
		grid-gap: var(--cpadding);
	}
	
	.main-service__item {
		padding: 0 0 0 calc(1.5rem + var(--cpadding));
	}
	
	.main-service__item svg {
		top: calc(50% - 0.7rem);	
	}
	
	/*--- PORTFOLIO ---*/
	.section-main.portfolio {
		padding: var(--cpadding) 0;
		height: auto;
	}
	
	.main-portfolio__item {
		grid-template-columns: 1fr;
		grid-gap: calc(var(--cpadding) * 2);
	}
	
	/*--- PORTFOLIO LIST ---*/
	.portfolio-list {
		display: block;
	}
	
	.portfolio__item + .portfolio__item {
		margin-top: var(--cpadding);
	}
	
	.portfolio__item-info-wrapper {
		display: none;
	}
	
	.portfolio__item-image {
		margin: 0 var(--mhpadding) var(--cpadding);
	}
	
	/*--- SERVICES PAGE ---*/
	.service-page__info-wrapper {
		grid-template-columns: 1fr;
		grid-template-areas: unset;
		margin: 0 0 var(--cpadding) 0;
	}
	
	.service-page-description {
		grid-area: unset;
		padding: 0;
	}
	
	.service-page__order {
		grid-area: unset;
		border-radius: 0;
		margin: 0 var(--mpadding);
		border: none;
	}
	
	.service-page__wrapper {
		grid-template-columns: 1fr;
		margin: 0 0 var(--cpadding);
		grid-gap: var(--cpadding);	
	}
	
	.service-page__item {
		background-size: auto 60px;
		box-shadow: inset 0px 0px 0 1px #41a3b6, inset 0px 0px 0 2px #4ebfd5, 4px 12px 24px 0px #d9dce680;
		background-color: #fff;
	}
	
	.service-page__wrapper:not(.service-page__wrapper--extra) .service-page__item:first-child,
	.service-page__wrapper--extra .service-page__item:nth-child(1) {
		grid-column: unset;
	}	
	
	.service-page__wrapper--extra .service-page__item:nth-child(1) {
	    background-size: auto 46px;	
	}		
	
	.service-page__item-description {
		padding: 0 92px 0 0;
	}
	
	.service-page__item-title {
		line-height: var(--line-height);
	}

	.footer_data {
		grid-template-columns: 1fr;
		grid-template-rows: 1fr 1fr;
		grid-gap: 12px;
	}

	.footer_data .textarea {
		grid-row-start: 1;
	}

	.footer_menu .menu-inner {
		justify-content: flex-start;
	}

	.footer_info {
		flex-direction: column;
		justify-content: center;
		align-items: flex-start;
	}

	.slider-content__right .slider-content--wrap {
		grid-template-columns: repeat(3, 1fr);
	}

}/* /767 */

/*480*/
@media (max-width: 480px) {
	/*--- PORTFOLIO PAGE ---*/
	.portfolio-page__info {
	
	}

	.slider-content__right .slider-content--wrap {
		grid-template-columns: repeat(2, 1fr);
	}
}

/*390*/
@media (max-width: 390px) {
	:root {
		--cpadding: calc(var(--font-size) * var(--line-height) * 0.75);	
	}
	
	.main-about__intro h1, 
	.main-about__chose .h1 {
		font-size: 1.5rem;
	}
	
	.main-service__item-title {
		font-size: 1.25rem;
		line-height: 1.5;
	}
	
	.main-service__item-title span:after {
		bottom: -4px;
	}

	.slider-content__right .slider-content--wrap {
		grid-template-columns: repeat(1, 1fr);
	}
}

/*330*/
@media (max-width: 330px) {
	.header {
		grid-gap: 0 9px;
	}
}

/*768-991*/
@media (min-width: 768px) and (max-width: 991px) {
	:root {
		--cwidth: 768px;
	}

	.header {
		grid-gap: 0 16px;
	}

	.header_social {
		width: auto;
		padding: 0;
	}

	.header_social-btn {
		display: block;
	}

	.header_social-icons {
		position: absolute;
		top: 25px;
		left: 0;
		flex-direction: column;
		font-size: 24px;
		align-items: center;
	}
	
	/*--- MAIN ---*/
	/*about*/
	.section-main {
		height: auto;
	    min-height: 100vh;
	}
	
	.section-main.about {
		padding-top: calc(var(--cpadding) * 4);
	}
	
	.main-about {
		grid-template-columns: 1fr;
		grid-gap: var(--cpadding);
	}
	
	.main-about__chose {
		margin-top: 0;
	}
	
	.main-about__intro h1, .main-about__chose .h1 {
		font-size: 2.5rem;
	}
	
	/*service*/
	.main-service {
	    grid-gap: calc(var(--cpadding) * 2);
	}
	
	/*--- FOOTER ---*/
	.footer {
		display: grid;
		justify-content: flex-start;
		grid-gap: var(--hcpadding) 0;
	}

	.footer_info {
		justify-content: center;
	}

	.footer_info > div {
		margin-right: 10px;
		margin-bottom: 10px;
	}

	.footer_menu .menu-inner {
		justify-content: flex-start;
	}

	.footer_menu .menu__item {
		margin-right: 20px;
	}

	.footer_data {
		grid-template-columns: 280px 1fr;
	}

	.slider-content__right .slider-content--wrap {
		grid-template-columns: repeat(4, 1fr);
	}
	
}/*768-991*/

/*992-1279*/
@media (min-width: 992px) and (max-width: 1279px) {
	:root {
		--cwidth: 992px;
	}

	.footer_info {
		justify-content: center;
		flex-wrap: wrap;
	}

	.footer_info > div {
		margin-bottom: 10px;
	}

	.header_social-icons {
		position: absolute;
		top: 25px;
		left: 0;
		flex-direction: column;
		font-size: 24px;
		align-items: center;
	}

	.slider-content__right .slider-content--wrap {
		grid-template-columns: repeat(4, 1fr);
	}
}

/*1280-1460*/
@media (min-width: 1280px) and (max-width: 1460px) {
	:root {
		--cwidth: 1280px;
	}

	.header_social-icons {
		position: absolute;
		top: 25px;
		left: 0;
		flex-direction: column;
		font-size: 24px;
		align-items: center;
	}
}







