/* ==========================================================================
   General
   ========================================================================== */
@media only screen and (max-width: 1600px){
	.wrapper {width: 96vw; max-width: none;}
	.paddingRight { padding-right: 2vw;}
	.paddingLeft { padding-left: 2vw;}
}
@media only screen and (max-width: 1000px){
	.tableWrapper { overflow-x: scroll;}
	.generalPadding {padding: 80px 0;overflow: hidden;}
	.generalPadding.compressPadding { padding: 30px 0 80px;}
	.pageTitle { margin-bottom: 80px;}
	h1 {font-size: 3rem;}
	h2 {font-size: 2.8rem;}
	h3 {font-size: 1.8rem;}
	h4 {font-size: 1.4rem;}
}
@media only screen and (max-width: 960px){
	.formStyle INPUT, .formStyle SELECT, .formStyle TEXTAREA, .total-price .redButton { margin-bottom: 0.625em;}
	/*.blackButton, .orangeButton, .greyButton, .redButton, .borderButton {padding: 0.625em 12px; font-size: 0.813rem;}*/
	.boxPadding { padding: 2.5em 0;}
	.boxPadding h1 { margin-bottom: 1.875em;}
}
@media only screen and (max-width: 800px){
	.generalPadding {padding: 60px 0; }
	.generalPadding.compressPadding { padding: 30px 0 60px;}
	.pageTitle { margin-bottom: 60px;}
	.pageTitle .intro { font-size: 18px;}
	h1 {font-size: 2.8rem;}
	h2 {font-size: 2.6rem;}
	h3 {font-size: 1.8rem;}
	h4 {font-size: 1.4rem;}
	/*.pageSectionTitle .title { font-size: 1.75rem; letter-spacing: 0;}*/
	.breadcrumbTop li { font-size: 0.75rem;}
}
@media only screen and (max-width: 640px){
	/*.pageSectionTitle .title { font-size: 1.625rem;}*/
	/*.blackButton, .orangeButton, .greyButton, .redButton {letter-spacing: 1px;}*/
}
@media only screen and (max-width: 480px){
	/*.pageSectionTitle .title { font-size: 1.5rem;}*/

	/*.home50 H1 {font-size: 1.125rem; line-height: 1.25em;}*/
	/*.home50 .box50 {width: 100%; margin-right: 0;}*/
	.listing .box25,.listing .box30 {width: 100%; margin-right: 0; margin-left: 0;}
	.listing .box30:nth-of-type(2n) {margin-left: 0;}
	.listing .box30 .blackButton {margin-top: 0; margin-bottom: 0.625em;}
	/*.blackButton, .orangeButton, .greyButton, .redButton {font-size: 0.813rem; letter-spacing: 1px;}*/
	.buttonIcon { padding: 3px 5px 3px 25px;}
}
/*typo*/
/*@media only screen and (min-width: 601px) and (max-width: 960px) {
	H1 {font-size: 1.875rem; line-height: 1.875em; margin: 1.625em 0 0.625em;}
	H2 {font-size: 1.5rem; line-height: 24px;}
	H3 {font-size: 1.375rem; line-height: 22px; margin: 0.625em 0;}
	H4 {font-size: 1.125rem;}
	H5 {font-size: 1.063px;}
	H6 {font-size: 1rem;}
}*/

/*fix parallax*/
@media (hover: none) {
	.sliderContainer article, .parallax {
		background-attachment: initial;
	}
}
/* ==========================================================================
   MAIN MENU
   ========================================================================== */
@media only screen and (max-width: 1200px){
	#my-menu { display: none !important;}
	#toggleSidebarMobile { display: inline-block !important;}

	.mm-listitem a li { display: block; float: none;}
	.mm-listitem a { letter-spacing: 1px;font-weight: 600;}
	.mm-listitem a.active { color: #9c9a98;}
	.mm-listitem:after { border-color: transparent;}
	.mm-btn:after, .mm-btn:before { border-color: #9c9a98; }

	.dropdown .imgBox, .dropdown .title, .dropdown .allBorder  { display: none;}
}

@media only screen and (min-width: 1201px) {
	#toggleSidebarMobile { display: none !important;}
	#mm-my-menu { display: none !important;}
}
/* ==========================================================================
   HEADER
   ========================================================================== */
@media only screen and (max-width: 1600px){
	#container-cart-products-small:before {right: 120px;}
}
@media only screen and (max-width: 1200px){
	.boxMenu { display: none;}
	#container-cart-products-small:before {right: 145px;}
}
@media only screen and (max-width: 640px){
	.header.wrapper {margin: 0 10px;}
	#boxUserTools > A {margin-left: 25px;}
	#boxLogo IMG {width: 66px;}
	#boxSearchContainer INPUT { padding: 0.625em;}
	#search-input,#search-widget { width: 96vw;}
	#boxSearchContainer:after { right: 2vw;}
}
@media only screen and (max-width: 500px){
	#boxLogo IMG {width: 65px;}
}
/* ==========================================================================
   PRIMA PAGINA
   ========================================================================== */
@media only screen and (max-width: 1200px){
	#homePage .pageBanner { padding-top: 170px;}
	#homePage .empty { display: none;}
	#homeSections .grid {grid-template-columns: 1fr 1fr;grid-gap: 40px;}
	#homeSections .sectionBg .grid {padding: 80px 0;}
	#homeSections .section:first-of-type .introSide, #homeSections .introSide {padding: 80px;margin: 0;}
	#elemente { padding: 30px 0 80px;}
	#elemente .flex {justify-content: space-between;}
	#elemente img {width: 80px;}
	#elemente h2 { margin: 0;}
	#homePage .grid2fr { align-items: center;}
	#homePage > .grid2fr {margin-top: 0;padding: 60px 0;}
	#homePage .darkGrayBg .shape {height: 12vw;}
	#homePage > .grid2fr ~ .grid2fr {padding: 0; align-items: stretch;}
	#homePage > .grid2fr ~ .grid2fr .textBox { padding: 15vw 80px 80px;}
	#homePage .zoomOut { object-fit: cover; height: 100%; object-position: center right;}
	#homePage .grid2fr.paddingLeft {grid-template-columns: 1fr 1fr;}
	.shapeBottom {height: 8vw;}
	.sigle img { width: 150px;}
	.sigle h1 {font-size: 3rem; margin-top: 0;}
}
@media only screen and (max-width: 1000px){
	#homeSections .grid { grid-template-columns: 1fr;}
	#homeSections .section:first-of-type .introSide, #homeSections .introSide {padding: 0;text-align: center;}
	#homeSections .intro { text-align: center;}
	#homeSections .sectionBg .grid { padding: 80px 0;}
	#homePage .grid2fr { grid-template-columns: 1fr; grid-gap: 40px; text-align: center;}
	#homePage .textBox { padding: 0;}
	#elemente img {width: 19%;}
	#elemente .flex {gap: 2%;}
	#homePage .grid2fr.paddingLeft { grid-template-columns: 1fr;}
	#homePage > .grid2fr ~ .grid2fr .textBox {padding: 15vw 2vw 80px;}
}
@media only screen and (max-width: 480px) {
	#homePage .textBoxRight .flex { display: block; text-align: center;}
	#homePage > .grid2fr ~ .grid2fr .textBox { padding: 15vw 2vw 60px;}
	#homeSections .intro { padding: 50px 30px;}
}
/* ==========================================================================
   CONT CLIENT
   ========================================================================== */
/*login, singout, reset*/
@media only screen and (max-width: 1000px){
	/*#autentificarePage .userForm, #autentificarePage .userForm, #inregistrarePage .userForm, #resetarePage .userForm {margin-top: 1.25em;}*/
	.userForm .grayBg, .userForm .boxLine { padding: 2.5em 0.9375em;}
}
@media only screen and (max-width: 640px){
	#inregistrarePage .politica, #inregistrarePage .QapTcha { width: 100% !important;}
	#inregistrarePage .QapTcha .TxtStatus { width: 80%;}

	/*.userForm .formStyle .box50 { width: 100%; margin-right: 0;}*/
	/*.userForm .formStyle .simpleButton { margin: 0 0.625em 0.625em 0;}*/
	/*.userForm .formStyle .mainButton { margin-top: 1.25em;}*/
	/*.userForm .intro { font-size: 1.125rem;}*/
}

/*account*/
@media only screen and (max-width: 1000px){
	.userPage .wrapper { grid-gap: 2vw;}
}

@media only screen and (max-width: 960px){
	/*div[id^="address-container"], div[id^="company-container"], .rowLabel { margin-bottom: 0.625em;}*/
	/*div[id^="address-container"] .mainButton, div[id^="company-container"] .mainButton { width: 100%; margin-top: 0.625em;}*/
	.address { padding: 0.625em;}
	.rowLabel { grid-template-columns: 1fr 80%;}
	.rowLabel .complexRow { grid-gap: 5px;}
	/*.form-edit-address-container { padding-left: 0.625em;}*/
}

@media only screen and (max-width: 640px){
	.userPage .wrapper { position: relative; display: block; padding-left: calc(2.5em + 2vw); min-height: 600px;}
	.userCard { padding: 1.875em 0.9375em;}

	.sideMenu, .sideMenu li  { overflow: hidden;}
	.sideMenu a { padding: 1.25em 0.3125em; text-align: center; font-size: 0.75rem; line-height: 1.1;}
	.sideMenu i { font-size: 1.25rem;}

	.rowLabel { grid-template-columns: 1fr; grid-gap: 5px;}

	.listOrders { font-size: 0.875rem;}
}
@media only screen and (max-width: 480px){
	.address { display: block;}
	/*.rowLabel label { position: relative; top: auto; transform: none;}*/
	/*.rowLabel input, .rowLabel select, .rowLabel textarea, .rowLabel .complexRow { width: 100%; margin: 0;}*/
	/*.rowLabel .complexRow select { width: auto; padding: 0.625em 0;}*/
	/*.rowLabel .complexRow .input-59 { width: 30%;}*/
	/*.rowLabel .complexRow .box15 { width: 20%;}*/
	/*.rowLabel .complexRow .box85 { width: 75%; float: right;}*/
	/*.address .box85 { width: 100%;}*/
	/*.address .box85 p {margin-bottom: 0;}*/
	/*.address .box15 { width: 100%;}*/
	/*.address .box15 A { margin-top: 0;}*/
	/*.form-address-links a { width: 48%; margin-top: 0.625em !important; float: left; margin-left: 0 !important; text-align: center; letter-spacing: 0;}*/
	/*.form-address-links a:nth-of-type(odd) { margin-right: 4%;}*/
	/*.form-address-links a:nth-of-type(even) { margin-right: 0;}*/
	.listOrders { font-size: 0.813rem;}
}

/* ==========================================================================
   COS
   ========================================================================== */
@media only screen and (max-width: 1000px) {
	#form-cos-cumparaturi { margin-top: 1.25em;}
	.formPopup { width: 60%;}
	.mlAuto { flex: 0 1 50%;}
	.grid3fr { grid-template-columns: repeat(2,1fr);}
}
@media only screen and (max-width: 960px) {
	.rowLabel input, .rowLabel select, .rowLabel textarea { margin: 0;}
	.userCard .flexButtons {margin-top: 2em;}
}
@media only screen and (max-width: 660px) {
	#form-cos-cumparaturi { margin-bottom: 0.9375em;}
	.formPopup { width: 80%;}
	.flexLeft, .flexRight { justify-content: space-between;}
	.mlAuto { flex: 0 1 100%;}
	.grid2fr, .grid3fr { grid-template-columns: 1fr;}
	.gridForm input, .gridForm textarea, .gridForm select, .flexForm button,
	.flexForm input, .flexForm textarea, .flexForm select, .flexForm button { margin-bottom: 0; margin-top: 0;}
}
@media only screen and (max-width: 480px) {
	#cosPage .grayBg { padding: 1.25em 0.625em;}
	#form-cos-cumparaturi { overflow-x: scroll;}
	#cart-table TH, #cart-table TD { font-size: 0.813rem;}
	#cart-table TD IMG { max-width: 2.5em; max-height: 3.75em;}
	#box-back-refresh a, #form-login button, #form-login a { width: 100%; text-align: center;}
	.formPopup { width: 90%;}
	.labelInput { display: block; margin-bottom: 0.625em;}
	.labelInput:not(:first-of-type) { margin: 0;}
}
/* ==========================================================================
   WHISHLIST
   ========================================================================== */
@media only screen and (max-width: 640px) {
	#cart-table .mainButton { display: block; text-align: center; margin-bottom: 0.3125em;}
}
/* ==========================================================================
   CATALOG
   ========================================================================== */
@media only screen and (max-width: 1200px) {
	.produs .imgContainer { padding-top: calc(100% + 32px);}
	/*.produs .imgContainer img { top: 0; bottom: auto;}*/
	.produs .addCart, .produs .addWhishlist { transform: none; padding: 0.4375em 0.9375em; font-size: 0.813rem;}
	.produs .addCart {display: inline-block;overflow: hidden;/*max-width:calc(100% - 45px);width:calc(100% - 45px);*/white-space: nowrap;text-overflow: ellipsis;}
	.produsIntro .pageTitle { padding: 0;}
	.produsIntro .pageTitle .title { font-size: 1.875rem;}
}
@media only screen and (max-width: 800px) {
	.flexSort { display: block;}
	.flexSort .sortare {margin-top: 20px;display: flex;justify-content: space-between;}
	.flexSort p { font-size: 12px;}
	.flexSort select { max-width: 70%;}
	/*.gridCategorii, */.gridCatalog { grid-template-columns: repeat(3,1fr);}
	.gridCategorii .halfBoxes { grid-template-columns: 1fr; grid-template-rows:1fr;}
	.gridCategorii .left, .gridCategorii .right { min-height: 200px;}
	.gridCategorii .right { grid-column-start: 1;grid-row-start: 1;}
	.productDetails .containerSliderProdus { width: 50%;}
	.productDetails .introContainer { width: 45%;}
	.produsIntro .pageTitle .title { font-size: 1.625rem;}
	.productDetails .priceNew, .productDetails .price { font-size: 1.375rem;}
	.tabsContent { padding: 2.5em 1.875em;}
	.gridDetaliu {display:block;overflow: hidden;}
	.infoBox { margin-bottom: 30px;}
	.productDetails .pageTitle .title { font-size: 2.8rem;}
}
@media only screen and (max-width: 640px) {
	.productDetails .containerSliderProdus,
	.productDetails .introContainer { width: 100%;}
	.productDetails .introContainer { margin-top: 1.25em;}
	.tabsContent { padding: 1.875em 1.25em;}
	.produsIntro .title {/* font-size: 1.15rem; *//* font-weight: 600; */}
	.gridInfo { padding: 0; grid-template-columns: 30% 65%;}
	.productDetails .pageTitle .title { font-size: 2.6rem;}
	.productDetails .pageTitle { margin-bottom: 2rem;}
	/*.gridCategorii, */.gridCatalog { grid-template-columns: repeat(2,1fr);}
}
@media only screen and (max-width: 480px) {
	.productDetails .pageTitle .title { font-size: 2.2rem;}
	.gridInfo {  grid-template-columns:1fr;}

	.produsIntro .title {/* font-size: 1rem; *//* font-weight: 400; */}
	/*.gridCategorii, */.gridCatalog { grid-template-columns: 1fr;}
}

/* ==========================================================================
   Support
   ========================================================================== */
@media only screen and (max-width: 600px) {
	/*.boxLink {width: 48%; margin-left: 1%; margin-right: 1%;}
	.square H1 {font-size: 1.375rem;}
	.square H4 {font-size: 1.063rem; padding-left: 3%; padding-right: 3%;}
	.square I {margin-top: 5%; font-size: 2.5rem;}*/
}

/* ==========================================================================
   PRESA
   ========================================================================== */
@media only screen and (max-width: 800px){
	.gridLine { grid-template-columns: 1fr 1fr; text-align: left;}
	.gridLine .title:first-child { grid-column: 1/3;}
	.galerieCategorie { grid-template-columns: repeat(3,1fr);}
	.galerieCategorie .imgContainer { padding-bottom: 20vw;}
}
@media only screen and (max-width: 500px){
	.galerieCategorie { grid-template-columns: repeat(2,1fr); grid-gap: 2vw;}
	.galerieCategorie .imgContainer { padding-bottom: 28vw;}
	#presaPage .pageTitle h3.title { text-align: center;}
	#presaPage .borderButton.center { margin-bottom: 40px;}
}
@media only screen and (max-width: 350px){
	.gridLine { grid-template-columns: 1fr;}
	.gridLine .title:first-child { grid-column: 1/2;}
	.gridLine .borderButton {justify-self: auto;}
}
/* ==========================================================================
   MAGIA
   ========================================================================== */
@media only screen and (max-width: 1000px){
	#magiePage .pageBanner .grid {grid-template-columns: 1fr;padding-top: 170px; grid-gap: 60px;}
	#magiePage .grid > .centerAll { justify-content: flex-start; }
	#magiePage .mainColorBg { padding: 80px 60px;}
}
@media only screen and (max-width: 640px){
	#magiePage .grid {grid-template-columns: 1fr;}
	#magiePage .mainColorBg { padding: 80px 2vw;}
	#magiePage .intro { width: 100%; margin-bottom: 60px; line-height: 2em;font-size: 1rem;}
	#magiePage .flex { display: grid; grid-template-columns: repeat(2,1fr); grid-gap: 30px;}
	#magiePage .flex img { max-width: 100px;}
	#magiePage .beneficii .grid { grid-gap: 30px;grid-template-columns: repeat(2,1fr);}
	.iconSymbol { height: 100px; width: 100px;}
}
@media only screen and (max-width: 500px){
	#magiePage .beneficii .grid { grid-gap: 30px;grid-template-columns: 1fr;}
}

/* ==========================================================================
   NOUTATI
   ========================================================================== */
@media only screen and (max-width: 1000px){
	.gridRecomandate { grid-gap: 20px;}
	.next .arrow {width: 45px;}
	.next .titlu {transform: none;}
	.next i {transform: translateX(23px);}
	.next .line {left: -3px;opacity: 1;}
	.prev .arrow {width: 45px;}
	.prev .titlu {transform: none;}
	.prev i {transform: translateX(-23px);}
	.prev .line {right: -3px;opacity: 1;}
	.articleButtons .text { gap: 10px;}
	.articleButtons .imgContainer { padding: 80px 40px;}
}
@media only screen and (max-width: 800px){
	.gridArticole { grid-template-columns: 1fr;}
	.gridRecomandate .titlu { font-size: 1rem; line-height: 1.2;}
	.noutate .textContainer { padding: 20px;}
	.articleButtons { display: grid;}
	.prev i {transform: translateX(-32px);}
	.next i {transform: translateX(32px);}
	.articleButtons .imgContainer {padding: 40px;}
	.articleButtons .prev .text { display: grid; grid-template-columns: 60px 1fr; grid-gap: 10px;}
	.articleButtons .next .text { display: grid; grid-template-columns: 1fr 60px; grid-gap: 10px;}
	.tags { display: block;}
	.tags a { margin: 0 10px 10px 0;}

}
@media only screen and (max-width: 600px){
	.gridRecomandate { grid-template-columns: 1fr;}
	.gridMasonry .grid-item { width: 100%;}
	.shareButtons { display: block;}
	.shareButtons a { margin: 0 15px 15px 0;}
	.gridCateg { gap: 5px;}
	.gridCateg a { font-size: 12px;}
	.noutate .data { margin-top: 10px;}
	.noutate .data img { display: none;}
	.articleButtons .imgContainer {padding: 40px 2vw;}
	.alignright {float: none;margin-left: 0;overflow: hidden;}
	.alignleft {float: none;margin-right: 0;overflow: hidden;}
}
/* ==========================================================================
   PREMII
   ========================================================================== */
@media only screen and (max-width: 1000px) {
	.gridPremii > .titlu {grid-column: 1/3;}
	.gridPremii { grid-template-columns: repeat(2,1fr); grid-gap:60px 30px;}
	.gridPremii:not(:last-of-type) { margin-bottom: 80px;}
	.pageBanner {min-height: 100dvh;}
	/*.pageBanner.gradient:after {background: linear-gradient(to bottom, rgba(255, 255, 255, 0.01) 0, #ffffff 100%);}*/
}
@media only screen and (max-width: 600px) {
	.gridPremii > .titlu {grid-column: 1/2;margin: 0;}
	.gridPremii { grid-template-columns: 1fr; grid-gap:60px;}
	.gridPremii:not(:last-of-type) { margin-bottom: 60px;}
	.gridPremii > .titlu .line {height: 8px;}
}
/* ==========================================================================
   HARTA
   ========================================================================== */
@media only screen and (max-width: 1000px) {
	.lg-map-wrapper .lg-map-text { padding: 40px 2vw;}
	.lg-map-text.active {  width: 100dvw !important; margin: 0 !important;}
	.lg-map-text .content { padding-top: 65px;}
}
/* ==========================================================================
   CONTACT
   ========================================================================== */
@media only screen and (max-width: 1000px) {
	.contactData  { overflow: hidden;}
	#contactPage .grid { grid-template-columns: repeat(3,1fr);}
}
@media only screen and (max-width: 640px) {
	.undercoverBanner .banner { width: auto; height: 100vh;}
	#contactPage .grid { grid-template-columns: repeat(2,1fr);}
}
@media only screen and (max-width: 400px) {
	#contactPage .grid { grid-template-columns: 1fr;}
}

/* ==========================================================================
   FOOTER
   ========================================================================== */
@media only screen and (max-width: 1700px)  {
	.upPage { bottom: 0.625em;}
}
@media only screen and (max-width: 1400px)  {
	.upPage { right: 0.625em;}
}
@media only screen and (max-width: 1000px) {
	#pageFooter {padding: 30px 0 60px;}
	#pageFooter .grid { display: grid; grid-template-columns: repeat(2,1fr); grid-gap:0 30px;}
	#pageFooter .logo img { width: 100px;}
	#pageFooter .logo { gap: 0;}
}
@media only screen and (max-width: 600px) {
	#pageFooter .wrapper:not(.sigleFooter) { display: block;}
	#pageFooter .logo { margin-bottom: 20px;}
}
@media only screen and (max-width: 400px) {
	#pageFooter .grid { grid-template-columns: 1fr;}
	#pageFooter .sigleFooter { gap: 20px;}
}