/*--------------------------------------------------------------
# Info Pages
--------------------------------------------------------------*/

.info__content {
    margin-top: 30px;
    max-width: 900px;
    font-weight: 500;
    line-height: 1.4;
}

.info__content p {
    margin-bottom: 15px;
}

.info__content h4{
    margin-bottom: 15px;
    text-transform: uppercase;
}

.info__list ul {
    margin-bottom: 20px;
    list-style: disc;
    margin-left: 30px;
}

.info__list ul li{
    line-height: 1.3;
    margin-bottom: 5px;
}

.info__heading {
    margin-top: 30px;
    margin-bottom: 10px;
    color: var(--accent-color);
}

.info__note {
    color: var(--red-color);
    font-weight: 700;
}

.info__accent-text-upper {
    font-size: 25px;
    line-height: 1.2;
    text-transform: uppercase;
    margin-bottom: 30px;
    font-weight: 500;
}

@media (max-width:767px) {
    .info__accent-text-upper {
        font-size: 20px;
    }
}

.info__accent-text-small {
    font-size: 18px;
    line-height: 1.2;
    font-weight: 700;
}

.vakansii .info__accent-text-small {
    margin-bottom: 20px;
}

.optom .info__accent-text-small {
    margin: 30px 0 15px
}

.info__paragraph {
    margin: 20px 0;
}

.info__table {
	min-width: 50%;
	margin-top:20px;
	margin-bottom: 20px;
	border: 2px solid #dddddd;
	border-collapse: collapse; 
}
.info__table th {
	font-weight: bold;
	line-height: 110%;
	padding: 5px;
	background: #efefef;
	border: 2px solid #dddddd;
}

.info__table td {
	padding: 5px 10px ;
	line-height: 110%;
	border: 2px solid #dddddd;
}

/*--------------------------------------------------------------
# Contacts
--------------------------------------------------------------*/

.contacts__wrap {
    display: grid;
    grid-template-columns: repeat(2, auto);
    column-gap: 20px;
    row-gap: 50px;
    grid-template-areas: 
    "phones mail"
    "adress hours" 
    "map map";
    max-width: 100%;
    margin-top: 30px;
}

@media (max-width: 1024px) {
    .contacts__wrap {
        grid-template-areas: 
        "phones phones"
        "mail mail"
        "adress hours" 
        "map map";
        row-gap: 30px;
    }
}

@media (max-width: 767px) {
    .contacts__wrap {
        grid-template-columns: 100%;
        row-gap: 20px;
        grid-template-areas: 
        "phones"
        "mail" 
        "hours"
        "adress"
        "map";
        max-width: 100%;
    }
}

.contacts__phones {
    grid-area: phones;
    font-size: 40px
}

.contacts__phones p:first-child {
    margin-bottom: 15px;
}

.contacts__mail {
    grid-area: mail;
    font-size: 40px
}

@media(max-width: 1100px) {
    .contacts__phones {
        font-size: 30px
    }
    .contacts__mail {
        font-size: 30px
    }
}

@media(max-width: 767px) {
    .contacts__phones {
        font-size: 25px
    }
    .contacts__mail {
        font-size: 25px
    }
}
.contacts__work-hours {
    grid-area: hours;
}
.contacts__adress {
    grid-area: adress;
}

.contacts__map {
    grid-area: map;
}

.contacts__wrap .heading-2 {
    margin-bottom: 15px;
    color: var(--gray-text);
    font-weight: 300;
}

.contacts__social-media {
    margin-top: 20px;
}

.contacts__map iframe {
    width: 100%;
}

/*--------------------------------------------------------------
# Delivery
--------------------------------------------------------------*/

.delivery {
    display: flex;
    /* flex-direction: column; */
    flex-flow: wrap;
    column-gap: 100px;
}

.delivery__block {
    max-width: 450px;
}

.delivery__block:nth-child(3) {
    max-width: 100%;
}

@media (max-width: 1300px) {
    .delivery__block {
        max-width: 600px;
    }
    .delivery__block:nth-child(3) {
        max-width: 600px;
    }
}

@media (max-width: 767px) {
    .delivery__block{
        max-width: 100%;
    }
}


@media (max-width: 767px) {
    .delivery .entry-header{
        font-size: 25px;
    }
}

/* .delivery__header {
    display: flex;
    position: relative;
    align-items: center;
    border-bottom: solid 1px rgba(0, 0, 0, .3);
    padding: 20px 0;
}

.delivery__header:hover {
    cursor: pointer;
} */

.delivery .entry-header {
    color: var(--text);
    font-size: 30px;
    margin: 40px 0 20px;
}

/* .delivery__header:hover .entry-header {
    color: var(--accent-color);
} */

/* .delivery__header:hover .delivery__dropdown-arrow {
    color: var(--accent-color);
} */

/* .delivery__header_show {
    border-bottom: none;
} */

.delivery__heading {
    margin-bottom: 10px;
    color: var(--accent-color);
}

/* .delivery__dropdown {
    max-height: 0;
    overflow: hidden;
} */

/* .delivery__dropdown_show {
    display: block;
    max-height: 9999px;
    -moz-transform: scaleY(1);
    -ms-transform: scaleY(1);
    -webkit-transform: scaleY(1);
    transform: scaleY(1);
    -moz-transition: max-height 1s ease-in-out;
    -o-transition: max-height 1s ease-in-out;
    -webkit-transition: max-height 1s ease-in-out;
    transition: max-height 1s ease-in-out;
} */
/* 
.delivery__block_show {
    border-bottom: solid 1px rgba(0, 0, 0, .3);
} */

/* .delivery__dropdown-arrow {
    display: inline;
    position: absolute;
    right: 20px;
    content: "next";
    font-family: swiper-icons;
    font-size: 20px;
    font-weight: 800;
    color: var(--text);
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    -moz-transition: -moz-transform 0.6s;
    -o-transition: -o-transform 0.6s;
    -webkit-transition: -webkit-transform 0.6s;
    transition: transform 0.6s;
}

.delivery__block_show .delivery__dropdown-arrow {
    -moz-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
    -moz-transition: -moz-transform 0.6s;
    -o-transition: -o-transform 0.6s;
    -webkit-transition: -webkit-transform 0.6s;
    transition: transform 0.6s;
} */

.delivery p {
    margin-bottom: 15px;
    line-height: 1.4;
}

.delivery small {
    margin-bottom: 15px;
    line-height: 1.4;
    display: block;
}

.delivery .info__map {
    margin-bottom: 20px;
}
.delivery .info__map iframe {
    width: 100%;
}
/*--------------------------------------------------------------
# Contacts Part
--------------------------------------------------------------*/

.contacts-part__wrap {
    display: flex;
    column-gap: 50px;
    align-items: center;
    margin: 30px 0;
    font-weight: 600;
}

.contacts-part__phones {
    display: flex;
    flex-direction: column;
    row-gap: 15px;
}

/*--------------------------------------------------------------
# About
--------------------------------------------------------------*/

.about {
    font-size: 18px;
    max-width: 100%;
}

.about__wrap {
    display: grid;
    column-gap: 50px;
    row-gap: 30px;
    grid-template-columns: 60% calc(40% - 50px);
}

@media (max-width:1023px) {
    .about__wrap {
        grid-template-columns: 100%;
        row-gap: 10px;
    } 
}

.about__full-width-wrap {
    background-color: var(--accent-color);
    color: var(--white);
    padding: 30px 0;
    margin-top: 30px;
    margin-bottom: -28px;
}

.about__full-width-wrap .entry-title {
    color: var(--white);
    margin-bottom: 25px;
}
/* 
.about__slider_photo .nivo-controlNav {
    bottom: 10px;
    color: var(--white);
} */

/* .about__slider .nivo-controlNav {
    bottom: 10px;
    color: var(--white);
} */

.about__slider_feedback {
    grid-column: span 2;
}

/* .about__slider_feedback .nivo-nextNav {
    right: 9px;
}
.about__slider_feedback .nivo-prevNav {
    left: 9px;
} */

/* @media (max-width:767px) {
    .about__slider .nivo-nextNav {
        display: none;
    }
    .about__slider .nivo-prevNav {
        display: none;
    }
}
.about__slider_feedback .nivo-controlNav {
    bottom: -15px;
}
.about__slider_feedback .nivo-controlNav a {
   margin: 7px;
}

.about__slider_photo .nivo-directionNav {
    color: var(--white);
}

.about__slider .nivo-directionNav {
    font-size: 25px;
} */

.about__slider {
    position: relative;
}

.about__slider_feedback {
    background-color: var(--accent-color);
    border-radius: 10px;
}

.about__slider_photo img {
    border-radius: 10px;
}


/*--------------------------------------------------------------
# Peresadka
--------------------------------------------------------------*/
.peresadka {
    max-width: 1000px;
}

/* .peresadka__heading {
    margin-bottom: 15px;
    font-size: 22px;
    font-weight: 600;
    margin-top: 30px;
    line-height: 1.1;
} */

/*--------------------------------------------------------------
# Landscaping
--------------------------------------------------------------*/

.landscaping {
    display: grid;
    grid-template-columns: 60% auto;
    column-gap: 30px;
    max-width: 100%;
}

@media (max-width:1023px) {
    .landscaping {
        grid-template-columns: 100%;
    }
    
}

.landscaping__photo {
    border-radius: 10px;
}

.landscaping .heading-2 {
    margin-top: 25px;
}

/*--------------------------------------------------------------
# Optom & Plant categories A to Z
--------------------------------------------------------------*/
/* .optom .heading-2 {
    margin: 50px 0 30px;
} */
.optom__plants-cats-az {
    display: flex;
    flex-direction: column;
    row-gap: 20px;
    align-items: center;
}
.optom__buttons {
    display: flex;
    flex-direction: column;
    align-items: center;
    row-gap: 15px;
}

.optom__button {
    color: var(--white);
    width: 300px;
    /* margin: auto; */
}

.optom__button_cats {
    background-color: var(--accent-color);
    border-color: var(--accent-color);
}

.optom__button_pricelist {
    background-color: var(--added-cart);
    border-color: var(--added-cart);
}

.plants-cats-az {
    display: flex;
    flex-wrap: wrap;
    column-gap: 15px;
    row-gap: 15px;
    margin-bottom: 25px;
}

.plants-cats-az__item {
    max-width: 230px;
}

@media (max-width:740px) {
    .plants-cats-az__item {
        max-width: calc((100% - 15px)/2);
        width: calc((100% - 15px)/2);
    }
}

.plants-cats-az-title {
    font-size: 20px;
    font-weight: 700;
    text-align: center;
    margin-top: 8px;
}

.plants-cats-az__inner-box {
    border-radius: 5px;
    box-shadow: 2px 1px 10px 1px rgba(0, 0, 0, 0.25);
    font-size: 0;
}

.plants-cats-az__inner-box img{
    border-radius: 5px;
    width: 100%;
}

/*--------------------------------------------------------------
# 404 page
--------------------------------------------------------------*/

.error-404 .page-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    row-gap: 20px;
}

/*--------------------------------------------------------------
# Services
--------------------------------------------------------------*/

@media (max-width: 767px) {
    .service-page {
        margin-top: 80px;
    }
}

.page-ukhod__first-screen {
  display: grid;
  grid-template-columns: 300px 200px auto;
  grid-template-rows: auto auto 50px auto;
  grid-template-areas:
    "title title photo"
    "intro intro photo"
    "rasschet social photo"
    "smallintro smallintro photo";
  column-gap: 100px;
  row-gap: 40px;
  padding: 50px;
  background-color: var(--gray);
  border-radius: 40px;
  margin-bottom: 50px;
}

@media(max-width:1200px) {
  .page-ukhod__first-screen {
    column-gap: 60px;
    padding: 40px;
  }
}

@media (max-width: 1080px) {
    .page-ukhod__first-screen {
        grid-template-columns: auto;
        grid-template-rows: auto auto 50px 50px auto auto;
        grid-template-areas:
        "title"
        "intro"
        "rasschet"
        "social"
        "smallintro"
        "photo";
        column-gap: 50px;
        row-gap: 30px;
        padding: 30px;
        margin-bottom: 35px;
    }
}

.page-peresadka__first-screen {
    display: grid;
    grid-template-columns: 500px auto;
    grid-template-rows: auto auto 50px;
    grid-template-areas:
        "title photo"
        "intro photo"
        "buttons photo";
    column-gap: 100px;
    row-gap: 40px;
    padding: 50px;
    background-color: var(--gray);
    border-radius: 40px;
    margin-bottom: 50px;
}

@media (max-width: 1000px) {
    .page-peresadka__first-screen {
        grid-template-columns: auto;
        grid-template-rows: auto auto 50px auto;
        grid-template-areas:
        "title"
        "intro"
        "buttons"
        "photo";
        column-gap: 50px;
        row-gap: 30px;
        padding: 30px;
        margin-bottom: 35px;
    }
}
@media (max-width: 767px) {
    .page-peresadka__first-screen {
        grid-template-rows: auto auto auto auto;
    }
}

.service-page .entry-title {
  grid-area: title;
  color: var(--text);
}

@media (max-width: 767px) {
   .service-page .entry-title {
        font-size: 24px;
    }
}

.page-ukhod__photo {
  grid-area: photo;
  border-radius: 40px;
  height: 100%;
  object-fit: cover;
}

.page-peresadka__photo {
  grid-area: photo;
  border-radius: 40px;
  height: 300px;
  width: 100%;
  object-fit: cover;
}

@media (max-width: 1080px) {
   .page-ukhod__photo {
        height: 400px;
        width: 100%;
        object-fit: cover;
    }
}
@media (max-width: 767px) {
   .page-ukhod__photo {
        height: 200px;
        width: 100%;
        object-fit: cover;
    }
}

@media (max-width: 1000px) {
   .page-peresadka__photo {
        height: 200px;
        width: 100%;
        object-fit: cover;
    }
}


.page-ukhod__intro {
  grid-area: intro;
  font-size: 22px;
  line-height: 1.3;
}

@media (max-width: 767px) {
   .page-ukhod__intro {
        font-size: 18px;
        line-height: 1.2;
    }
}

.page-peresadka__intro {
  grid-area: intro;
  font-size: 22px;
  line-height: 1.3;
  max-width: 500px;
}

@media (max-width: 1000px) {
    .page-peresadka__intro {
        max-width: 100%;
    }
}

@media (max-width: 767px) {
   .page-peresadka__intro {
        font-size: 18px;
        line-height: 1.2;
    }
}


.page-ukhod__rasschet {
  grid-area: rasschet;
  background-color: var(--text);
  color: var(--white);
  border-radius: 50px;
}

.page-peresadka__rasschet {

  background-color: var(--text);
  color: var(--white);
  border-radius: 50px;
}

.page-ukhod .social-media__buttons {
  grid-area: social;
  justify-content: start;
  column-gap: 50px;
}

@media(max-width:1200px) {
  .page-ukhod .social-media__buttons {
    column-gap: 60px;
  }
}

@media (max-width: 1080px) {
   .page-ukhod .social-media__buttons {
        margin: auto;
    } 
}

.page-peresadka__buttons {
    grid-area: buttons;
    display: flex;
    column-gap: 30px;
}

@media (max-width: 767px) {
   .page-peresadka__buttons {
        flex-direction: column;
        row-gap: 25px;
    }
}


.page-peresadka__buttons button {
    width: 100%;
}

@media (max-width: 767px) {
   .page-peresadka__buttons button {
        height: 50px;
    }
}
@media (max-width: 767px) {
   .page-peresadka__buttons .social-media__buttons {
        margin: auto;
    }
}

.page-ukhod__intro_small {
  grid-area: smallintro;
  font-size: 24px;
  font-weight: 600;
  margin: auto;
  line-height: 1.2;
  margin-top: 25px;
}

@media (max-width: 767px) {
   .page-ukhod__intro_small {
        font-size: 20px;
    }
}

.page-ukhod__intro_small p:first-child {
  margin-bottom: 10px;
}


.page-ukhod__services {
  display: grid;
  column-gap: 150px;
  grid-template-columns: 400px 600px;
  margin-bottom: 120px;
  padding: 0 50px;
}

@media(max-width:1200px) {
    .page-ukhod__services {         
        grid-template-columns: 300px auto;
        column-gap: 100px;
        padding: 0 40px;
    }
}

@media(max-width:767px) {
    .page-ukhod__services {         
        display: flex;
        flex-direction: column;
        row-gap: 30px;
        margin-bottom: 60px;
        padding: 0 30px;
    }
}

.page-peresadka__services {
  display: grid;
  grid-template-columns: 500px 600px;
  margin-bottom: 120px;
  padding: 0 50px;
  column-gap: 100px;
}

@media(max-width:1300px) {
    .page-peresadka__services {         
        grid-template-columns: 300px auto;
        column-gap: 100px;
        padding: 0 40px;
    }
}

@media(max-width:767px) {
    .page-peresadka__services {         
        display: flex;
        flex-direction: column;
        row-gap: 30px;
        margin-bottom: 60px;
        padding: 0 30px;
    }
}

.page-ukhod__services-list li {
  font-size: 18px;
  padding: 15px 0;
  border-bottom: solid 1px var(--gray-text);
}

@media(max-width:767px) {
    .page-ukhod__services-list li {         
        font-size: 16px;
    }
}

.page-ukhod__services-list li:first-child {
  padding-top: 0;
}

.page-peresadka__services-list li {
  font-size: 18px;
  padding: 15px 0;
  border-bottom: solid 1px var(--gray-text);
}

@media(max-width:767px) {
    .page-peresadka__services-list li {         
        font-size: 16px;
    }
}

.page-peresadka__services-list li:first-child {
  padding-top: 0;
}

.page-ukhod__services-title {
  font-size: 28px;
  text-transform: uppercase;
  line-height: 1.2;
}

@media(max-width:767px) {
    .page-ukhod__services-title {         
        font-size: 24px;
    }
}
.page-peresadka__services-title {
  font-size: 28px;
  text-transform: uppercase;
  line-height: 1.2;
}

@media(max-width:767px) {
    .page-peresadka__services-title {         
        font-size: 24px;
    }
}


.page-ukhod__service-item {
  display: grid;
  grid-template-columns: 200px 250px auto;
  grid-template-rows: auto auto 50px;
  column-gap: 50px;
  grid-template-areas: "title cost description"
  "title period description"
  "button button description";
  margin-bottom: 90px;
  row-gap: 30px;
  padding: 50px;
  background-color: var(--gray);
  border-radius: 40px;
}

@media(max-width:1080px) {
    .page-ukhod__service-item {
        grid-template-columns: 200px auto auto;
        grid-template-rows: auto auto 50px;
        column-gap: 30px;
        grid-template-areas: "title cost period"
        "description description description"
        "button button button";
        margin-bottom: 60px;
        row-gap: 20px;
        padding: 40px;
    }
}

@media(max-width:767px) {
    .page-ukhod__service-item {
        grid-template-columns: auto;
        grid-template-rows: auto auto auto auto 50px;
        column-gap: 30px;
        grid-template-areas: "title"
        "cost"
        "period"
        "description"
        "button";
        margin-bottom: 60px;
        row-gap: 20px;
        padding: 30px;
    }
}

.page-ukhod__service-item-title {
  grid-area: title;
}
.page-ukhod__service-item-cost {
  grid-area: cost;
}

.page-ukhod__service-item-cost p:first-of-type {
  font-weight: 700;
}

.page-ukhod__service-item-period {
  grid-area: period;
}

.page-ukhod__service-item-period p:first-of-type {
  font-weight: 700;
}

.page-ukhod__service-item-descr {
  grid-area: description;
}

.page-ukhod__service-item-order {
  grid-area: button;
  background-color: var(--text);
  color: var(--white);
  border-radius: 40px;
}

.page-ukhod__service-item p {
  margin-bottom: 7px;
  line-height: 1.4;
}

.page-peresadka__service-item p {
  margin-bottom: 7px;
  line-height: 1.4;
}
.page-peresadka__service-item ul {
  list-style: disc;
  padding-left: 20px;
}
.page-peresadka__service-item li {
  margin-bottom: 7px;
  line-height: 1.4;
}

.page-ukhod__service-item-descr {
  line-height: 1.5;
}

.page-peresadka__service-item {
  display: grid;
  grid-template-columns: 500px 600px;
  column-gap: 100px;
  padding: 50px;
  margin-bottom: 90px;
  background-color: var(--gray);
  border-radius: 40px;
}

@media(max-width:1300px) {
  .page-peresadka__service-item {
      grid-template-columns: 300px auto;
      column-gap: 100px;
      row-gap: 30px;
      margin-bottom: 60px;
      padding: 40px;
  }
}

@media(max-width:767px) {
  .page-peresadka__service-item {
      grid-template-columns: auto;
      row-gap: 30px;
      margin-bottom: 60px;
      padding: 30px;
  }
}


.page-peresadka .info__table {
  border: none;
  margin-bottom: 7px;
  margin-top: 0;
}

.page-peresadka .info__table td {
  border: none;
  border-bottom: 1px solid #dddddd;
}

.page-ukhod__advantages {
  padding: 50px;
  background-color: var(--dark-bg);
  color: white;
  border-radius: 40px;
  margin-bottom: 90px;
}

@media(max-width:1200px) {
    .page-ukhod__advantages {
      padding: 40px;
    }
}
@media(max-width:767px) {
    .page-ukhod__advantages {
      padding: 30px;
      margin-bottom: 60px;
    }
}

.page-ukhod__advantages-title {
    margin-bottom: 35px;
    font-size: 28px;
    text-transform: uppercase;
    line-height: 1.2;
    text-align: center;
}

@media(max-width:767px) {
    .page-ukhod__advantages-title {
      font-size: 24px;
    }
}

.page-ukhod__advantages-item {
  display: flex;
  flex-wrap: wrap;
  column-gap: 80px;
  row-gap: 55px;
  justify-content: center;
}

@media(max-width:767px) {
    .page-ukhod__advantages-item {
      column-gap: 30px;
      row-gap: 30px;
    }
}

.page-ukhod__advantages-item li{
  text-align: center;
  padding: 20px;
  background-color: #4e4d4d;
  border-radius: 20px;
  width: 300px;
  display: flex;
  align-items: center;
  color: var(--white);
  line-height: 1.4;
}

.page-peresadka__example {
    display: grid;
    grid-template-columns: 500px auto;
    column-gap: 100px;
    row-gap: 25px;
    grid-template-rows: auto auto 50px;
    grid-template-areas: "heading rasschet"
    "description rasschet"
    "button x";
    padding: 0 50px;
    margin-bottom: 90px;
}

@media(max-width:1300px) {
    .page-peresadka__example {
        grid-template-columns: 300px auto;
        padding: 0 40px;
    }
}

@media(max-width:1000px) {
    .page-peresadka__example {
        display: flex;
        flex-direction: column;
        padding: 0 10px;
        margin-bottom: 60px;
    }
}

.page-peresadka__example-heading {
    grid-area: heading;
}
.page-peresadka__example-descr {
    grid-area: description;
    line-height: 1.4;
}
.page-peresadka__example-rasschet {
    grid-area: rasschet;
    padding: 15px;
    border-radius: 24px;
    border: 1px solid #e6e8ec;
    box-shadow: 0 18px 39px 0 rgba(0, 0, 0, .102), 0 72px 72px 0 rgba(0, 0, 0, .09);
}

.page-peresadka__example .button {
    grid-area: button;
    width: 100%;
    max-width: 500px;
}

@media(max-width:767px) {
    .page-peresadka__example .button{
        max-width: 100%;
        height: 50px;
    }
}