/*
Description: Stylecheet for home page
Version: 1.0.2
*/


/** Margins **/
  body #main .column-top-margin {margin-top: 70px;}

/** Boka tid puff startsida **/
  .flex_column.start-boka-tid{display: flex; flex-direction: column; justify-content: center;}

/** Tjänster puffar **/
  #main .start-tjanster-puff{padding-top: 20px; letter-spacing: -0.48px;}
  .start-tjanster-puff {overflow: hidden;}
  body.home #main .start-tjanster-puff h3{font-size: 1.375rem;}
  .start-tjanster-puff p{margin-top: 0; font-size: 1rem; line-height: 1.35 !important;}

#top #main .start-tjanster-puff {height: 270px;}

/** Bilbanan **/
  .road-section .container {position: relative;min-height: 100vw;}
  .road-section .flex_column {position: absolute;width: 400px;}

  /* Placering av texterna */
    .road-section #road-text-1 { top: 8vw; left: 7vw; width:450px;}
    .road-section #road-text-2 { top: 33vw; right: 0;}
    .road-section #road-text-3 { top: 52vw; left: 9vw;}
    .road-section #road-text-4 { top: 72vw; right: 1vw;}
    body #main .road-section.main_color .av-special-heading:not(.custom-color-heading) h3 {color: var(--color-lime);text-align: center;width: 100%;margin-bottom: 10px !important;}

/** Media queries **/
  /* Stor skärm - extra för vägen*/
    @media (min-width: 1500px) {
      .road-section .container {height: 1500px;min-height: 1500px;}
      .road-section #road-text-1 { top: 130px; left: 150px;}
      .road-section #road-text-2 { top: 520px;}
      .road-section #road-text-3 { top: 830px; left: 120px;}
      .road-section #road-text-4 { top: 1150px; right: 40px;}
    }
  /* Mellanstor skärm - extra för vägen*/
    @media only screen and (min-width: 990px) and (max-width: 1200px) {
      #top #main .road-section.main_color p {font-size: 1.3rem;line-height: 1.6rem;}
    }
  /* Desktop */
    @media only screen and (min-width:990px){
      [id] {scroll-margin-top: 170px;}
      #av_section_1 {position: relative;}
      #av_section_1:before {content: "";position: absolute;top: 0;right: 50%;width: 1280px;height: 100%;background: linear-gradient(to right, rgb(4 54 36) 40%, rgb(172 33 33 / 0%) 63%);pointer-events: none;}
		.av-desktop-hide {display:none !important;}
    }
  /** Tablet and mobile **/
    @media only screen and (max-width: 989px) {
      #av_section_1.road-section {background: unset;}
      #av_section_1.road-section .entry-content-wrapper {justify-self: center;}
      #av_section_1 .flex_column.av_one_fourth {position: static;margin: 0 auto 28px;background: var(--color-lime);border-radius: var(--radius-default);width: 100%;max-width: 550px;clear: both;}
		.road-section .entry-content-wrapper{position: static;margin: 0 auto 28px;width: 100%;max-width: 550px;clear: both;}
      body #main .road-section.main_color .av-special-heading:not(.custom-color-heading) h3, body #main .road-section.main_color p {color: var(--color-avocado);}
      #av_section_1.road-section .road-container {margin-bottom:0;}
    }

  /* Tablet */
    @media only screen and (min-width:768px) and (max-width:989px){
    	.responsive #top #main .flex_column_table{display: flex; flex-wrap: wrap; justify-content: center;gap:30px;}
    	#top #main .start-tjanster-puff{width: 220px; min-height: 280px; margin-top: 0;}
    	#top #main .av-flex-placeholder{display: none;}
		.av-medium-hide {display:none !important;}
    }

  /* Mobile */
    @media only screen and (max-width: 767px) {
    	#top #main .flex_column.start-boka-tid{padding: 0 10px;margin-left: -20px; margin-right: -20px; width: 100vw; border-radius: 0;}

    	#top #main .flex_column_table.av-equal-height-column-flextable:not(:first-child){margin-top: 0;}
      #top #main .helpie-faq .accordion__header{padding-right: 36px;}
      #top #main .helpie-faq .accordion__header:after{right: 0; margin-right: 15px; width: 33px; height: 33px;}
    	#top #main .helpie-faq .accordion .accordion__item .accordion__header .accordion__title{font-size: var(--font-heading-3); line-height: var(--font-heading-3-line-height);}
    	#top #main .start-tjanster-puff p{font-size: 1rem;}






				#top #main .start-tjanster-puff {width: 100%;max-width: 400px;min-height: auto;height: auto;padding: 20px 16px;position:relative;margin: auto;margin-top: 20px;}
				#top #main .start-tjanster-puff .av-special-heading {grid-area: heading;}
				#top #main .start-tjanster-puff .avia-image-container {bottom: 0;position: absolute;}
				#top #main .start-tjanster-1-puff .avia-image-container img {height: 95px;}
				#top #main .start-tjanster-1-puff .avia-image-container img {height: 95px;}
				#top #main .start-tjanster-2-puff .avia-image-container {right:5px;bottom: -14px;}
				#top #main .start-tjanster-2-puff .avia-image-container img {height: 117px;transform: scaleX(-1);}
				#top #main .start-tjanster-3-puff .avia-image-container {right:5px;}
				#top #main .start-tjanster-3-puff .avia-image-container img {height: 90px;}
				#top #main .start-tjanster-4-puff .avia-image-container {right:0;}
				#top #main .start-tjanster-4-puff .avia-image-container img {height: 80px;}

				#top #main .start-tjanster-puff .av_textblock_section {max-width: 60%;}
				#top #main .start-tjanster-1-puff .av_textblock_section {max-width: calc( 100% - 147px );}
				#top #main .start-tjanster-2-puff .av_textblock_section {max-width: calc( 100% - 141px );}
				#top #main .start-tjanster-3-puff .av_textblock_section {max-width: calc( 100% - 115px );}
				#top #main .start-tjanster-4-puff .av_textblock_section {max-width: calc( 100% - 137px );}
				body #main .start-tjanster-puff h3, #top #main .start-tjanster-puff p {text-align: left;}



    }