/*======================================
Theme Name: kraehativ
Description: Child-Theme von Krähativ
Version: 1.0
Author: krähativ design gmbh
Author URI: https://www.kraehativ.de/
Template: Divi
======================================*/



/* FONTS – Start */


@font-face {
	font-family: 'Gilroy';
	font-style: normal;
	font-weight: 300;
	src: local(''),
			 url('webfonts/Gilroy-Light.otf') format('otf'),
			 url('webfonts/Gilroy-Light.woff2') format('woff2'),
			 url('webfonts/Gilroy-Light.otf.woff') format('woff')
}
@font-face {
	font-family: 'Gilroy';
	font-style: italic;
	font-weight: 300;
	src: local(''),
			 url('webfonts/Gilroy-LightItalic.otf') format('otf'),
			 url('webfonts/Gilroy-Light.woff2') format('woff2'),
			 url('webfonts/Gilroy-Light.otf.woff') format('woff')
}
@font-face {
	font-family: 'Gilroy';
	font-style: normal;
	font-weight: 400;
	src: local(''),
			 url('webfonts/Gilroy-Regular.otf') format('otf'),
			 url('webfonts/Gilroy-Regular.woff2') format('woff2'),
			 url('webfonts/Gilroy-Regular.otf.woff') format('woff')
}
@font-face {
	font-family: 'Gilroy';
	font-style: italic;
	font-weight: 400;
	src: local(''),
			 url('webfonts/Gilroy-RegularItalic.otf') format('otf'),
			 url('webfonts/Gilroy-RegularItalic.woff2') format('woff2'),
			 url('webfonts/Gilroy-RegularItalic.otf.woff') format('woff')
}
@font-face {
	font-family: 'Gilroy';
	font-style: normal;
	font-weight: 500;
	src: local(''),
			 url('webfonts/Gilroy-Medium.otf') format('otf'),
			url('webfonts/Gilroy-Medium.woff2') format('woff2'),
			 url('webfonts/Gilroy-Medium.otf.woff') format('woff')
}
@font-face {
	font-family: 'Gilroy';
	font-style: italic;
	font-weight: 500;
	src: local(''),
			 url('webfonts/Gilroy-MediumItalic.otf') format('otf'),
			 url('webfonts/Gilroy-MediumItalic.woff2') format('woff2'),
			 url('webfonts/Gilroy-MediumItalic.otf.woff') format('woff')
}
@font-face {
	font-family: 'Gilroy';
	font-style: normal;
	font-weight: 600;
	src: local(''),
			 url('webfonts/Gilroy-SemiBold.otf') format('otf'),
			 url('webfonts/Gilroy-SemiBold.woff2') format('woff2'),
			 url('webfonts/Gilroy-SemiBold.otf.woff') format('woff')
}
@font-face {
	font-family: 'Gilroy';
	font-style: italic;
	font-weight: 600;
	src: local(''),
			 url('webfonts/Gilroy-SemiBoldItalic.otf') format('otf'),
			 url('webfonts/Gilroy-SemiBoldItalic.woff2') format('woff2'),
			 url('webfonts/Gilroy-SemiBoldItalic.otf.woff') format('woff')
}
@font-face {
	font-family: 'Gilroy';
	font-style: normal;
	font-weight: 800;
	src: local(''),
			 url('webfonts/Gilroy-ExtraBold.otf') format('otf'),
			 url('webfonts/Gilroy-ExtraBold.woff2') format('woff2'),
			 url('webfonts/Gilroy-ExtraBold.otf.woff') format('woff')
}
@font-face {
	font-family: 'Gilroy';
	font-style: italic;
	font-weight: 800;
	src: local(''),
			 url('webfonts/Gilroy-ExtraBoldItalic.otf') format('otf'),
			 url('webfonts/Gilroy-ExtraBoldItalic.woff2') format('woff2'),
			 url('webfonts/Gilroy-ExtraBoldItalic.otf.woff') format('woff')
}

/* FONTS – End */


/* ---------------------------- */


/* BASICS – Start */

:root {
  --hauptfarbe: #111111;  /* <--- EINFÜGEN:  1. Gestaltungsfarbe  */
  --zusatzfarbe: #ffc53d; /* <--- EINFÜGEN:  2. Gestaltungsfarbe  */
  --weiss: #ffffff;
  --schwarz: #000000;
  --grau: #555555;        /* <--- EINFÜGEN:  Grauwert bei Bedarf anpassen  */

  --headlines: normal normal 500 20px/1.5 Gilroy; /* <--- EINFÜGEN:  Hauptschriftart für Überschriften ...  */
  --copytext: normal normal 400 16px/1.5 Gilroy ; /* <--- EINFÜGEN:  Schriftart für Copytext ...  */
}

body {
  font: var(--copytext);
  font-family: Gilroy !important;
}


h1, .h1,
h2, .h2,
h3, .h3,
h4, .h4,
h5, .h5,
h6, .h6 {
  font: var(--headlines);
  font-weight: 700;
  font-family: Gilroy !important;
}


h1, .h1,
h2, .h2,
h3, .h3,
h4, .h4,
h5, .h5 {
  color: var(--hauptfarbe);
}


a {
  color: var(--hauptfarbe);
  font-weight: 400;
}


/* BASICS – End */


/* ---------------------------- */


/* GENERAL STYLES – Start */



/* GENERAL STYLES – End */


/* ---------------------------- */


/* MENU / NAV  – Start */

ul#menu-hauptmenue li.menu-item a {
  font-size: 20px;
  color: var(--schwarz) !important
}

ul#menu-hauptmenue li.menu-item a:hover {
  font-size: 20px;
  color: var(--zusatzfarbe) !important
}

.et_pb_menu_0_tb_header.et_pb_menu {
  background-color: none !important;
}

#mobile_menu1 {
  background-color: var(--zusatzfarbe) !important;
  border: none !important;
  }

  span.mobile_menu_bar {
    margin-right: 20px;
}

#mobile_menu1 li a {
  font-size: 20px;
    font-weight: 600;
    color: var(--weiss);
    padding: 15px 0;
}

/* MENU / NAV  – End */


/* ---------------------------- */


/* CONTENT – Start */

 /* Intro */
    .dipi_info_circle_item-content-wrapper {
      padding: 40px;;
    }


/* CONTENT – End */