/* ==========================================================================
   GENERAL
   ========================================================================== */
@media only screen and (max-width: 1300px) {
    .generalPadding { padding: var(--space-6x) 0;}
    .generalPaddingBottom { padding-bottom: var(--space-6x)}
    .paddingLeft { padding-left: 2vw;}
    .paddingRight { padding-right: 2vw;}
    .flexColumPage { gap: var(--space-6x);}
}
@media only screen and (max-width:1000px) {
    .gridHalf, #camerePage .gridHalf,#contactPage .grid { gap: var(--space-6x);}
}
@media only screen and (max-width:800px) {
    .gridHalf, #camerePage .gridHalf {grid-template-columns: 1fr; gap: var(--space-8x);}
    .gridHalf.alignTop, #camerePage .gridHalf { gap: var(--space-3x);}
    #contactPage .grid { grid-template-columns: 1fr; gap: var(--space-4x);}
}
@media only screen and (max-width: 640px) {
    #homeDespre .sectionTitle .title { font-size: 50rem;}
    .gridDespre { grid-template-columns: 1fr; gap: var(--space-3x); text-align: center;}
    .gridDespre .sectionTitle.alignLeft{ text-align: center; align-items: center;}
    .gridDespre .sectionTitle.alignLeft .subtitle{ align-self: center;}
    #camerePage .lightColorBg { padding: var(--space-6x) 0;}
    .gridServicii,.gridGalerie { grid-template-columns: repeat(2,1fr);}
}
@media only screen and (max-width: 480px) {
    #homeDespre .sectionTitle .title, .sectionTitle .title { font-size: 46rem;}
    .pageTitle .sectionTitle .title { font-size: 48rem;}
    .shapesSlider .celBg .title { font-size: 34rem;}
    .shapesSlider .celBg .subtitle { font-size: 11rem;}
    .sectionTitle .intro, .sectionTitleContent p:first-of-type { font-size: 16rem;}
    .gridServicii { grid-template-columns:1fr;}
    #camerePage .gridServicii,#galerieMancare { margin-top: var(--space-3x);}
    .grid-wrapper {grid-template-columns: repeat(auto-fit, minmax(35vw, 1fr));grid-auto-rows: 35vw;}
    #contactPage .whiteBg { padding: var(--space-3x) var(--space-2x);}
    .styleForm button { margin-top: var(--space-3x);}
}
/* ==========================================================================
   ZIGZAGCONTENT
   ========================================================================== */
@media only screen and (max-width: 1400px) {
    .zigzagContent h2 { margin-bottom: 20px;}
}
@media only screen and (max-width: 800px) {
    .zigzagContent { display: block; table-layout: unset;}
    .zigzagContent tr, .zigzagContent td { display: block; width: 100% !important;}
    .zigzagContent td { display: block; width: 100% !important;}
    .zigzagContent tr:nth-of-type(even) h2:after { right: 0;}
    .zigzagContent tr:nth-of-type(odd) h2:after{ left: 0;}
    .zigzagContent h2:after { width: 100%;}

    .zigzagContent .lightgalleryEditor img { height: auto; width: 100%;}
    .zigzagContent tr:nth-of-type(odd) td:last-of-type, .zigzagContent tr:nth-of-type(even) td:first-of-type{ padding: 20px 0;}
}
@media only screen and (max-width: 640px) {
    .zigzagContent tr:not(:first-of-type) td{padding-top: 20px;}
}
/* ==========================================================================
   RESPONSIVE EMBEDED IFRAME
   ========================================================================== */
.videoWrapper {position: relative;padding-bottom: 56.25%; /* 16:9 */padding-top: 25px;height: 0;}
.videoWrapper iframe {position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
.mapWrapper {position: relative;padding-bottom: 56.25%; overflow: hidden;}
.mapWrapper iframe {position: absolute;top: 0;left: 0;width: 100%;height: 100%; box-shadow: none;}
.mapWrapper iframe:hover { box-shadow: none;}

/* ==========================================================================
   MMENU
   ========================================================================== */
@media only screen and (max-width: 1000px) {
    #my-menu { display: none !important;}
    #showMenu { display: inline-block !important;color: #ffffff;}
    .mm-menu a { color: var(--text-color) !important; text-align: right; margin-bottom: 8px; padding: 15px 30px;letter-spacing: 1.8px;}
    .mm-menu .active { color:var(--brand-color) !important;}
    .mm-navbar { border:none; background: transparent;}
}
@media only screen and (min-width: 1001px) {
    #showMenu { display: none !important; }
    #mm-my-menu { display: none !important;}
}
/* ==========================================================================
   HEADER
   ========================================================================== */
@media only screen and (max-width: 1000px) {
    .headerBottom { padding: var(--space) 0; align-items: center;}
}
/* ==========================================================================
   SLIDER
   ========================================================================== */
@media only screen and (max-width: 1000px) {
    .textSlider .title { font-size: 70rem;}
}
@media only screen and (max-width: 800px) {
    .textSlider .title { font-size: 65rem;}
    .textSlider .intro { font-size: 16rem;}
}
@media only screen and (max-width: 640px) {
    .textSlider .title { font-size: 60rem; margin-bottom: var(--space-2x);}
    .textSlider .intro { margin-top: 0;}
    .textSlider .flexButtons { flex-direction: column;}
    .textSlider .flexButtons a {justify-content: center;}
}
/* ==========================================================================
   HOME
   ========================================================================== */
@media only screen and (max-width: 800px) {
    .shapesSlider { grid-template-columns: repeat(2,1fr); grid-template-rows: unset;}
    .shapesSlider .cel, .shapesSlider .cel { grid-column: unset; grid-row: unset;}
}
@media only screen and (max-width: 480px) {
    .shapesSlider { grid-template-columns: 1fr;}
    #homeSpatii .shapesSlider { margin-top: var(--space-3x);}
}
/* ==========================================================================
   TESTIMONIALE
   ========================================================================== */
@media only screen and (max-width: 640px) {
    #testimonialePage .grid { grid-template-columns: 1fr;}
    #testimonialePage .rating { margin-bottom: 10px;}
    #testimonialePage textarea { margin-bottom: 20px;}
}
@media only screen and (max-width: 480px) {
    #testimonialePage .formStyle { padding: 30px 2vw;}
    .testimonial { padding: 20px;}
    .stars { font-size: 18rem;}
}
/* ==========================================================================
   FOOTER
   ========================================================================== */
@media only screen and (max-width: 1400px)  {
    .upPage { right: 10px;}
}
@media only screen and (max-width: 1000px)  {
    .upPage { bottom: 10px;}
    .footerContent .flex { grid-template-columns: 1fr auto; gap: var(--space-3x); justify-content: space-between;}
    .footerContent .intro { grid-column: 1/-1;}
    .footerContent img  {opacity: 0.8;}
}
@media only screen and (max-width: 480px) {
    .footerContent .flex { grid-template-columns: 1fr;}
}