/*============== mobile  ==================*/
@media screen and (max-width: 768px) {
  /*================================ general ================================*/
  .callToAction,
  .callToAction2 {
    font-size: 16px;
    line-height: 22px;
    padding: 10px 0;
    width: 100%;
  }
  .section_title {
    font-size: 20px;
  }
  .section_caption {
    font-size: 16px;
  }
   p.drtax {
     margin: 0;
	 font-size: 16px;
	 font-weight: 700;
   }

  /*================================ header ================================*/
  header {
    border-bottom: 1px solid rgba(0, 132, 39, 0.2);
  }
  header .navbar-collapse {
    height: 90vh !important;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
    padding: 32px 0 40px;
  }
  header .navbar-toggler:focus {
    box-shadow: none;
  }
  header nav {
    flex-direction: row-reverse;
  }
  header .navbar-brand {
    margin: 0;
    width: 40px;
  }
  header .navbar-toggler {
    padding: 0;
  }
  header .navbar-toggler .menu_img {
    width: 24px;
  }
  header .navbar-nav li {
    font-weight: 700;
    font-size: 24px;
    line-height: 16px;
    margin: 0 0 40px;
  }
  .call_box.mobile {
    display: flex;
    margin: 0 auto;
  }
  .call_box.desktop {
    display: none;
  }

  #Services_items .dropdown-menu{
    border: none;
    background-color: #fff;
    margin-right: 0.5rem;
    margin-bottom: -30px;
    margin-top: 20px;
  }
  #Services_items .dropdown-menu li {
    margin: 0;
    margin-bottom: 10px;
  }
  #Services_items > ul .dropdown-item{
    color: #005d1f;
    margin: 0;
  }

  /*================================ intro ================================*/
  #introduction {
    background: #f1f5f7;
    padding: 20px 0 42px;
  }
  #introduction .content .right {
    align-items: center;
  }
  #introduction .title {
    font-size: 24px;
    margin: 0 auto;
    text-align: center;
    text-align-last: center;
  }
  #introduction .caption {
    font-size: 22px;
    margin: 0 auto 10px;
    text-align: center;
    text-align-last: center;
  }
  #introduction .btn_group {
    flex-direction: column;
    justify-content: center;
    width: 100%;
  }
  #introduction .btn_group .callToAction {
    margin: 0 auto 10px;
  }
  #introduction .btn_group a {
    width: 100%;
  }
  #introduction .callToAction {
    margin-left: 0;
  }
  #introduction .content .left {
    text-align: center;
    padding: 35px 55px 0;
  }

  /*================================ remaining_time ================================*/
  #remaining_time {
    background: #19532e;
    padding: 32px 0 39px;
  }
  #remaining_time .right {
    justify-content: center;
    flex-direction: column;
  }
  #remaining_time .title {
    font-size: 20px;
    margin: 0 auto 24px;
    text-align: center;
    text-align-last: center;
    max-width: 77%;
  }

  .time_label div {
    min-width: 66px;
  }
  #remaining_time .content .left {
    text-align: center;
  }
  .tick {
    margin: 0 auto 40px;
  }
  .tick-group {
    margin: 0 2px;
  }
  .time_label {
    justify-content: space-between;
    max-width: 280px;
  }
  .tick-flip-card,
  .tick-flip {
    min-width: 30px;
  }
  /*================================ Road Map ================================*/
  #roadMap{
    background-image:unset;
  }
  #roadMap .content {
    margin-bottom: 30%;
  }
  #roadMap .content > .background-img{
    margin-left: -40%;
  }
  #item-history-1{
    flex-direction: row-reverse;
    align-items: end !important;
    left: 40%;
    bottom: -10%;
  }
  #item-history-1 .text-history{
    align-items: end !important;
  }
  #item-history-1 .text-history span{
    text-align: left !important;
  }

  #item-history-2{
    flex-direction: column;
    right: 4%;
    bottom: 8%;
  }
  #item-history-2 .text-history > span{
    max-width: 140px !important;
  }

  #item-history-3{
    left: 38%;
    top: 38%;
  }
  #item-history-4{
    flex-direction: row;
    right: 8%;
    top: 10%;
  }
  #item-history-5{
    left: 37%;
  }
  #item-history-5 .text-history > span{
    max-width: 95px !important;
  }
  /*================================ reason ================================*/
  #reason {
    padding: 60px 0 40px;
  }
  #reason .section_title {
    margin: 0 auto 18px;
  }
  #reason .section_caption {
    margin: 0 auto 18px;
  }
  #reason .property_box .img_box {
    min-height: auto;
  }
  #reason .property_box .title {
    font-size: 18px;
    line-height: 42px;
    max-width: 82%;
  }

  /*================================ services ================================*/
  #services {
    padding: 40px 0 24px;
  }
  #services .section_title {
    margin: 0 auto 14px;
  }
  #servicesAccordion .accordion-item {
    padding: 24px 19px 57px;
    margin-bottom: 20px;
    border-radius: 16px !important;
    position: relative;
  }
  #servicesAccordion .accordion-header {
    margin: 0 0 6px;
  }
  #servicesAccordion .accordion-button {
    padding: 0;
    font-weight: 700;
    font-size: 18px;
    line-height: 170%;
    text-align: center;
    text-align-last: center;
    justify-content: center;
  }
  #servicesAccordion .accordion-button:not(.collapsed) {
    color: #000000;
    background-color: transparent;
    box-shadow: none;
  }
  #servicesAccordion .accordion-button::after {
    display: none;
  }
  #servicesAccordion .accordion-body {
    padding: 0 0 27px;
  }
  #services .caption {
    margin: 0 0 8px;
    min-height: auto;
  }
  .see_description {
    background: #d0eed8;
    border-radius: 0px 0px 16px 16px;
    position: absolute;
    width: 100%;
    left: 0;
    right: 0;
    bottom: 0;
    margin: 0 auto;
    text-align: center;
    padding: 12px 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
  }
  .see_description p {
    margin: 0;
    color: #005d1f;
    font-weight: 700;
    font-size: 18px;
    line-height: 25px;
    margin-left: 3px;
  }
  .see_description .down_arrow {
    margin-right: 3px;
    width: 10px;
  }
  #servicesAccordion .accordion-collapse.show + .see_description p {
    font-weight: 300;
  }
  #servicesAccordion .accordion-collapse.show + .see_description .down_arrow {
    transform: rotate(180deg);
  }
  #services .img_box{
    display: flex;
    justify-content: center;
    align-items: center;
  }

  /*================================ membership ================================*/
  .membership {
    padding: 32px 0 0;
  }
  .membership .content .right {
    order: 2;
    height: 227px;
  }
  .membership .content .left {
    height: auto;
    padding: 0 15px 36px;
  }
  .membership .title {
    color: #222222;
    font-weight: 700;
    font-size: 24px;
    line-height: 195%;
    text-align: center;
    text-align-last: center;
    margin: 0 auto 16px;
  }

  /*================================ testimonial ================================*/
  #testimonial {
    padding: 50px 0 160px;
  }
  #testimonial .section_title {
    margin: 0 auto 16px;
  }
  .testimonial_Swiper {
    padding: 0 24px;
    height: 511px;
  }
  .testimonial_Swiper .swiper-wrapper {
    padding: 0;
  }
  .testimonial_Swiper .swiper-slide.swiper-slide-active {
    margin-top: 0;
  }
  .testimonial_Swiper .swiper-slide .testimonial_box {
    width: 100%;
    background: #f1f5f7;
    border-radius: 15px;
    padding: 41px 24px;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .testimonial_Swiper .swiper-slide .testimonial_box {
    padding: 32px 16px;
    flex-direction: column;
  }
  .testimonial_Swiper .customer_box {
    margin: 0 0 24px 0;
    min-width: auto;
  }
  .testimonial_Swiper .comments {
    max-height: unset;
    overflow-y: hidden;
  }
  /* button-next , button-prev */
  .testimonial_Swiper .swiper-button-next,
  .testimonial_Swiper .swiper-button-prev {
    display: block;
    background-image: url(../images/next.png);
    background-repeat: no-repeat;
    background-size: 50%;
  }
  .testimonial_Swiper .swiper-button-next:after,
  .testimonial_Swiper .swiper-button-prev:after {
    content: "" !important;
  }
  .testimonial_Swiper .swiper-button-prev {
    right: 40% !important;
  }
  .testimonial_Swiper .swiper-button-next {
    left: 40% !important;
    transform: rotate(180deg);
  }
  .testimonial_Swiper .swiper-button-next,
  .testimonial_Swiper .swiper-button-prev {
    width: 15px;
    height: 15px;
  }
  .testimonial_Swiper .swiper-button-prev {
    right: 5px !important;
  }
  .testimonial_Swiper .swiper-button-next {
    left: 5px !important;
  }

  /*================================ about_us ================================*/
  .about_us {
    padding: 0 0 40px;
  }
  .about_us .about_us_img {
    margin: -80px auto 24px;
    max-width: 100%;
  }
  .about_us .section_title {
    margin: 0 auto 8px;
  }
  .about_us .section_caption {
    margin: 0 auto 24px;
    text-align: justify;
    text-align-last: right;
  }
  .about_us .callToAction2 {
    width: fit-content;
    padding: 10px 55px;
    font-weight: 700;
    font-size: 20px;
    line-height: 28px;
  }

  /*================================ footer ================================*/
  footer .content {
    padding: 24px 0;
  }
  footer .tadbirHesab_logo {
    margin: 0 0 18px;
  }
  footer .content .social {
    justify-content: space-evenly;
    margin: 0 auto 50px;
  }
  footer .social_box {
    margin-left: 0;
  }
  #footerAccordion {
    padding: 0 14px;
  }
  #footerAccordion .accordion-item {
    background: transparent;
    color: #fff;
    border: none;
    border-top: 1px solid #ffffff30;
    border-radius: 0 !important;
  }
  #footerAccordion .accordion-button {
    background: transparent;
    border-radius: 0 !important;
    padding: 18px 0;
    color: #fff;
    font-weight: 700;
    font-size: 18px;
    line-height: 30px;
    justify-content: space-between;
  }
  #footerAccordion .accordion-button::after {
    filter: brightness(100);
    margin-left: 0 !important;
  }
  #footerAccordion .accordion-button:not(.collapsed) {
    color: #fff;
    background-color: transparent;
    box-shadow: none;
  }
  #footerAccordion .accordion-body {
    padding: 0;
  }
  #footerAccordion .accordion-body p {
    text-align: right;
    text-align-last: right;
    color: #fff;
  }
  footer .copyright {
    background: #008427;
    border-top: none;
    padding: 10px 0;
    opacity: 1;
  }
  footer .harmonyLogo {
    max-width: 70%;
    margin: 0 auto;
  }
  #not_found {
    padding: 50px 24px;
  }
  .not_found_img {
    margin: 0 auto 40px;
  }
  /*================================ content_box ================================*/
  .content_box {
    background: #f1f5f7;
    padding: 36px 0 42px;
  }
  .content_box .content_box_subtitle {
    font-size: 20px;
    margin: 0 auto 20px;
  }
  .content_box .content_box_caption {
    text-align: justify;
    text-align-last: right;
    margin: 0 auto 28px;
  }
  .single_box {
    margin: 0 0 32px;
  }
  .single_box .single_box_img {
    width: 100%;
    height: auto;
    margin: 0 0 16px;
  }
  .single_box .single_box_title {
    margin: 0 auto 8px;
  }
  .single_box .single_box_caption {
    font-size: 16px;
    margin: 0;
  }
  .search_box {
    margin: 0 auto 34px;
    width: 100%;
    padding: 8px 12px;
  }
  .search_box input {
    font-size: 14px;
  }

  /*================================ faq ================================*/
  .faq {
    padding: 60px 0 70px;
  }
  .faq .section_title {
    margin: 0 auto 16px;
  }
  .faq .accordion-item {
    margin: 0 0 16px;
  }
  .faq .accordion-button {
    font-size: 16px;
    line-height: 174%;
    padding: 8px 14px;
  }
  .faq .accordion-button:not(.collapsed) {
    font-size: 16px;
  }
  .faq .accordion-button::after {
    border: 2px solid #008427;
    border-radius: 4.7px;
    padding: 9px;
    background-size: 70%;
  }
  .faq .accordion-button:not(.collapsed)::after {
    background-size: 70%;
  }
  .faq .accordion-body {
    padding: 0 16px 8px;
  }
  .faq .accordion-body p {
    line-height: 174%;
    text-align: justify;
    text-align-last: right;
  }

  /*================================ single_blog ================================*/
  .single_blog_content {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
  }
  .single_blog {
    padding: 50px 0 40px;
  }
  .single_blog_title {
    line-height: 40px;
    margin: 0 0 25px;
    order: 1;
  }
  .single_blog_caption {
    line-height: 34px;
    margin: 0 0 20px;
    order: 4;
  }
  .share_box {
    position: static;
    flex-direction: row;
    width: 100%;
    padding: 16px 55px;
    justify-content: space-between;
    align-items: center;
    border-radius: 10px;
  }
  .share_box a {
    height: fit-content;
  }
  .share_box .title {
    line-height: 34px;
    margin: 0;
    max-width: 100%;
  }
  .share_box img {
    margin: 0;
  }
  /*================================ single_blog ================================*/
  .related_blog {
    padding: 80px 0 100px;
  }
  .single_blog_img {
    margin: 0 auto 32px;
    order: 2;
  }

  .blog_headlines_box {
    margin: 0 auto 32px;
    background: #f1f5f7;
    border-radius: 10px;
    padding: 8px 15px;
    position: static;
    width: 100%;
    order: 3;
  }

  .blog_headlines_title {
    font-size: 14px;
    margin: 0 0 7px;
  }
  .blog_headlines {
    font-size: 12px;
    line-height: 28px;
    margin: 0 0 10px;
  }

  /*================================ about_us_main ================================*/
  .about_us_main {
    background: #008427;
    padding: 43px 0 0;
  }
  .about_us_main .right {
    justify-content: center;
  }
  .about_us_main .left {
    padding: 0 56px;
  }
  .about_us_main .title {
    font-size: 24px;
    text-align: center;
    text-align-last: center;
    margin: 0 auto 32px;
  }

  /*================================ description ================================*/
  .description .content {
  }
  .description .flex_content_reverse {
    flex-direction: column-reverse !important;
  }
  .description .content .right {
    order: 2;
  }
  .description .content .left {
    margin: 0 0 20px;
  }
  .description .about_text_part {
    max-width: 100%;
    padding: 0 15px;
    height: auto;
  }
  .description .about_part .caption {
    font-size: 16px;
    line-height: 34px;
    margin: 0;
  }
  .description .about_part .title {
    margin: 0;
  }
  .description .about_part ul {
    padding-right: 20px;
  }
  .description .about_part ul li {
    font-size: 16px;
    line-height: 32px;
  }
  .description .content:nth-child(2) .right {
    order: unset;
  }
  .description .content:nth-child(2) .about_text_part {
    float: unset;
  }
  .description .content:nth-child(2) .left {
    margin: 0 auto;
  }
  .description .about_text_part * {
    font-size: 1.5rem;
  }
  .description .about_text_part br {
    display: none !important;
  }
  /*================================ contact_us ================================*/
  #contact_us {
    background: #008427;
    padding: 60px 0 70px;
  }
  #contact_us .content .title {
    margin: 0 auto 16px;
  }
  #contact_us .content .col-12 {
    margin: 0 auto 43px;
  }

  /*================================ Contact Us ================================*/
  #map .mapLocation {
    height: 300px;
  }
  /*================================ Common Features ================================*/
  #common_features .content > * > .detial > .title{
    font-size: 1.3rem;
  }
  #common_features .content > * > .detial > span{
    font-size: 1rem;
  }
  /*================================ Compare Services ================================*/
  * > .container > .title{
    font-size: 1.3rem !important;
  }
  #compare_services .container > .content .title {
    font-size: 14px;
  }
  #compare_services .container > .content .icon {
    width: 30px;
    height: 30px;
  }
}



/* Iphone 320 style */
@media screen and (max-width: 350px) {
  header .content .info .callToAction {
    padding: 10px;
  }
  #discount .content .left .discount1 {
    bottom: 100px;
  }
}

/* Debug image roadMap */
@media screen and (min-width: 768px) and (max-width: 900px) {
  #roadMap{
    background-image:unset;
  }

  #item-history-2{
    flex-direction: row;
    right: 0;
  }
}

 /*Debug RoadMap*/
@media screen and (max-width: 480px) {
  #item-history-1{
    bottom: -15%;
  }
  #item-history-2{
    right: 2%;
    bottom: -2%;
  }

  #item-history-3{
    left: 28%;
  }
  #item-history-4{
    top: 7%;
  }
  #item-history-5{
    top: -12%;
    left: 30%;
  }
}