/* responsive.css */

/* ... 959px width and less ...
-------------------------------------------------------------------------------------------------*/
@media(max-width: 959px) {
  :root {
    --margin-x: var(--margin-x-tablet);
  }
}
/* ... 959px width and less ... END
-------------------------------------------------------------------------------------------------*/



/* ... 859px width and less ...
-------------------------------------------------------------------------------------------------*/
@media(max-width: 859px) {
  .logo .image_container {
  	border-bottom: 0 none;
  }
  #main .mainnav {
    display: none;
  }
}
/* ... 859px width and less ... END
-------------------------------------------------------------------------------------------------*/



/* ... 700px width and less ...
-------------------------------------------------------------------------------------------------*/
@media(max-width: 700px) {
  .float_left,
  .float_right {
    float: none;
  	margin: 0 0 1em;
  	display: inline-block;
  }
  .ui-accordion-content > div {
    flex-wrap: wrap;
  }
    .ce_gallery .cols_4 {
	--gallery-cols: 2;
  }
  .ce_gallery .cols_6 {
    --gallery-cols: 3;
  }
  .ce_gallery .cols_8 {
    --gallery-cols: 4;
  }
  .ce_text.has_float {
    display: flex;
    flex-direction: column;
  }
  .ce_text.has_float figure {
    order: 1;
    margin-top: 1em;
  }
}

/* ... 700px width and less ... END
-------------------------------------------------------------------------------------------------*/



/* ... 430px width and less ... Andreas
-------------------------------------------------------------------------------------------------/
@media(max-width: 430px) {
  :root {
    --margin-x: var(--margin-x-mobile);
  }
  .ce_gallery .cols_4,
  .ce_gallery .cols_5,
  .ce_gallery .cols_6,
  .ce_gallery .cols_8 {
    --gallery-cols: 2;
  }
}
/* ... 430px width and less ... END
-------------------------------------------------------------------------------------------------*/

/* ... 430px width and less ...
-------------------------------------------------------------------------------------------------*/
@media(max-width: 430px) {
  :root {
    --margin-x: var(--margin-x-mobile);
  }
  /* ... 430px width and less ...-*/
  .ce_gallery .cols_3 {
    --gallery-cols: 2;
  }
  .ce_gallery .cols_4 {
	--gallery-cols: 2;
  }
  body.index .ce_gallery .cols_5 {
	--gallery-cols: 3;
  }
  .ce_gallery .cols_5 {
	--gallery-cols: 2;
  }
  .ce_gallery .cols_6 {
	--gallery-cols: 4;
  }
  .ce_gallery .cols_8 {
	--gallery-cols: 4;
  }
  img.width-1-3, img.width-1-4 {
    --dividend: 2;
}
/* ... 430px width and less ... END
-------------------------------------------------------------------------------------------------*/