html, body, button, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
::-moz-selection { /* Code for Firefox */
    color: white;
    background: black;
}

::selection {
	 color: #efefef;
	 background: black;
}

.dark-mode {
  background-color:rgba(20, 20, 20);
  color:rgba(220, 220, 220);
	a.class1: rgba(220, 220, 220);
}
.dark-mode a.class1 {
  color:rgba(220, 220, 220);
}
.dark-mode a.class2 {
  color:rgba(220, 220, 220);
}
.dark-mode svg path{
  fill: rgba(220, 220, 220);
}


/* Typeface INTER */

/* G E N E R A L  S T Y L E S */

.dada {
	max-width: 2240px;
	margin: 0 auto;
}

.grid-container-header {
  display: grid;
  grid-column-gap: 15px;
  grid-row-gap: 30px;
  grid-template-columns: 1fr 1fr 1fr;
	grid-template-rows: 1fr;
  padding: 20px;
}
.grid-container-h1 {
  display: grid;
  grid-column-gap: 15px;
  grid-row-gap: 30px;
  grid-template-columns: 1fr 1fr 1fr;
  padding: 20px;
	margin-top: 5%;
	margin-bottom: 5%;
}
.grid-container {
  display: grid;
  grid-column-gap: 15px;
  grid-row-gap: 30px;
  grid-template-columns: 1fr 1fr 1fr;
	grid-template-rows: 1fr 1fr 1fr;
  padding: 20px;
}
.grid-container-case-img {
  display: grid;
  grid-column-gap: 15px;
  grid-row-gap: 15px;
  grid-template-columns: 1fr ;
	grid-template-rows: 1fr;
  padding: 20px;
}
.grid-container-about {
  display: grid;
  grid-column-gap: 15px;
  grid-row-gap: 30px;
  grid-template-columns: 1fr 1fr 1fr 1fr;
	grid-template-rows: 1fr;
  padding: 20px;
}
.grid-container-about2 {
  display: grid;
  grid-column-gap: 15px;
  grid-row-gap: 30px;
  grid-template-columns: 1fr 1fr 1fr 1fr;
	grid-template-rows: 1fr;
  padding: 20px;
}
.grid-container-footer {
  display: grid;
  grid-column-gap: 15px;
  grid-row-gap: 30px;
  grid-template-columns: 1fr 1fr 1fr;
	grid-template-rows: 1fr;
  padding: 20px;
}

.grid-item {  /* This is the basic element */
  border: 0px solid rgba(0, 200, 200);  /* This is the gridline */
  font-size: 30px;
  text-align: left;
}
.grid-item-case-img {  /* This is the case img element */
	border: 0px solid rgba(0, 200, 200);  /* This is the gridline */
  font-size: 30px;
  text-align: left;
}
.grid-item2 {  /* This is the dark/light mode toggle element */
  border: 0px solid rgba(0, 200, 200);  /* This is the gridline */
  font-size: 30px;
	display: flex;
	justify-content: space-between;
}

.grid-item-h1 {
  grid-column: 1 / 4;
	border: 0px solid rgba(0, 200, 200);  /* This is the gridline */
	padding-right: 25%;
  text-align: left;
}
.grid-item-case-headline {
  grid-column: 1 / 2;
	border: 0px solid rgba(0, 200, 200);  /* This is the gridline */
	padding-right: 25%;
  text-align: left;
}
.grid-item-case {  /* This is the contact element */
  grid-column: 2 / 4;
	border: 0px solid rgba(0, 200, 200);  /* This is the gridline */
  font-size: 30px;
  text-align: left;
	padding-top: 5px;
	padding-right: 7%;
	vertical-align: 15px;
}
.grid-item-contact {  /* This is the contact element */
  grid-column: 1 / 2;
	border: 0px solid rgba(0, 200, 200);  /* This is the gridline */
  font-size: 30px;
  text-align: left;
	padding-top: 120px;
}

.grid-item-exp {  /* This is the contact element */
	grid-column: 4 / 5;
	grid-row: 2 / 2;
	border: 0px solid rgba(0, 200, 200);  /* This is the gridline */
	font-size: 30px;
	text-align: left;
	padding-right: 25%;
	padding-top: 60px;
}
.grid-item-edu {  /* This is the contact element */
	grid-column: 3 / 4;
	grid-row: 2 / 2;
	border: 0px solid rgba(0, 200, 200);  /* This is the gridline */
	font-size: 30px;
	text-align: left;
	padding-right: 25%;
	padding-top: 60px;
}
.grid-item-about {  /* This is the about element */
  grid-column: 1 / 3;
	grid-row: 2 / 2;
	border: 0px solid rgba(0, 200, 200);  /* This is the gridline */
  font-size: 30px;
	padding-right:15%;
  text-align: left;
	padding-top: 60px;
	max-width: 605px;
}
.grid-item-clientlist {  /* This is the about element */
  grid-column: 1 / 3;
	grid-row: 3 / 3 ;
	border: 0px solid rgba(0, 200, 200);  /* This is the gridline */
  font-size: 30px;
	padding-right:7%;
  text-align: left;
	padding-top: 60px;
	max-width: 615px;
}
.grid-item-footer-r {
  grid-column: 2 / 3;
	border: 0px solid rgba(0, 200, 200);  /* This is the gridline */
	font-size: 26px;
  line-height: 0.9em;
	padding-top: 10%;
  text-align: left;
	padding-bottom: 5%;
}
.grid-item-footer-r2 {
  grid-column: 3 / 5;
	border: 0px solid rgba(0, 200, 200);  /* This is the gridline */
	font-size: 26px;
  line-height: 0.9em;
	padding-top: 10%;
  text-align: left;
	padding-bottom: 5%;
}

h1 {
  font-family: 'Inter', sans-serif;
	font-size: 3Em;
	font-style:normal;
  font-weight: 400;
	padding: 40px, 40px, 40px, 40px;
	letter-spacing: -0.03Em;
}

h2 {
  font-family: 'Inter', sans-serif;
	font-size: 1.7em;
	font-weight: normal;
	letter-spacing: -0.03Em;
	padding: 0;
	margin: 0;
}

p {
  	font-family: 'Inter', sans-serif;
	font-size: 0.7em;
	font-weight: normal;
	line-height:1.3Em;
	padding: 0;
	margin: 0;
}

a:link {
	font-family: 'Inter', sans-serif;
	color: #000000;
	text-decoration: none;
}

a:visited {
	font-family: 'Inter', sans-serif;
	color: #000000;
	text-decoration: none;
}

a:hover {
	font-family: 'Inter', sans-serif;
	color: rgb(0,7,255);
	text-decoration: none;
}

a:active {
	font-family: 'Inter', sans-serif;
	color: rgb(0,7,255);
	text-decoration: none;
}

img {
	width: 100%;
	height: AUTO;
}

video {
  width: 100%;
  height: auto;
}

.button {
  background-color: transparent;
  border: none;
  color: white;
  padding: none;
  font-size: 16px;
  margin: none;
  cursor: pointer;
	vertical-align: text-top;
	text-align: right;
}

.image2 {
width:19px;
height:19px;
padding: 0px 0px 0px 0px;
margin: 2px 0px 0px 0px;
}
.img_photo {
max-width:150px;
height:auto;
padding: 0px 0px 0px 0px;
margin: 2px 0px 0px 0px;
}

svg {
	width:19px;
	height:19px;
	padding: 0px 0px 0px 0px;
	margin: 2px 0px 0px 0px;
}

/*default top navigation links, underline rollover*/
A.class1 {color: rgb(0,0,0);}
A.class1:link {font-family: 'Inter', sans-serif; text-decoration: none;}
A.class1:visited {font-family: 'Inter', sans-serif; text-decoration: none;}
A.class1:hover {font-family: 'Inter', sans-serif;text-decoration: underline; text-underline-offset: 0.2em;}
A.class1:active {font-family: 'Inter', sans-serif;text-decoration: underline; text-underline-offset: 0.2em;}

/*underlined black links*/
A.class2 {color: rgb(0,0,0);}
A.class2:link {font-family: 'Inter', sans-serif;text-decoration: underline; text-underline-offset: 0.2em;}
A.class2:visited {font-family: 'Inter', sans-serif; text-decoration: none;}
A.class2:hover {font-family: 'Inter', sans-serif; text-decoration: none;}
A.class2:active {font-family: 'Inter', sans-serif; text-decoration: none;}

/*underlined black links in case copytext*/
A.class3 {color: rgb(0,0,0);}
A.class3:link {font-family: 'Inter', sans-serif;text-decoration: underline; text-underline-offset: 0.1em;}
A.class3:visited {font-family: 'Inter', sans-serif; text-decoration: none;}
A.class3:hover {font-family: 'Inter', sans-serif; text-decoration: none;}
A.class3:active {font-family: 'Inter', sans-serif; text-decoration: none;}


/* BIG_DESK_TOP Breakpoint */

@media only screen
and (min-width : 1696px) {

	.grid-container {
		display: grid;
		grid-column-gap: 15px;
		grid-row-gap: 30px;
		grid-template-columns: 1fr 1fr 1fr 1fr;
	 grid-template-rows: 1fr 1fr;
		padding: 20px;
	}
	.grid-container-header {
		display: grid;
		grid-column-gap: 15px;
		grid-row-gap: 30px;
		grid-template-columns: 1fr 1fr 1fr 1fr;
	 grid-template-rows: 1fr;
		padding: 20px;
	}
	.grid-container-h1 {
	  display: grid;
	  grid-column-gap: 15px;
	  grid-row-gap: 30px;
	  grid-template-columns: 1fr 1fr 1fr 1fr;
	  padding: 20px;
		margin-top: 5%;
		margin-bottom: 5%;
	}
	.grid-container-about2 {
	  display: grid;
	  grid-column-gap: 15px;
	  grid-row-gap: 30px;
	  grid-template-columns: 1fr 1fr 1fr 1fr;
		grid-template-rows: 1fr;
	  padding: 20px;
	}
	.grid-item-h1 {
	  grid-column: 1 / 4;
		border: 0px solid rgba(0, 200, 200);  /* This is the gridline */
		padding-right: 25%;
	  text-align: left;
	}
	.grid-container-case-img {
	  display: grid;
	  grid-column-gap: 15px;
	  grid-row-gap: 15px;
	  grid-template-columns: 1fr ;
		grid-template-rows: 1fr ;
	  padding: 20px;
	}
	.grid-item-case-headline {
	  grid-column: 1 / 2;
		border: 0px solid rgba(0, 200, 200);  /* This is the gridline */
		padding-right: 5%;
	  text-align: left;
	}
	.grid-item-case {  /* This is the contact element */
	  grid-column: 2 / 4;
		border: 0px solid rgba(0, 200, 200);  /* This is the gridline */
	  font-size: 30px;
	  text-align: left;
		padding-top: 5px;
		vertical-align: 15px;
		max-width: 900px
	}

	.grid-container-footer {
	  display: grid;
	  grid-column-gap: 15px;
	  grid-row-gap: 30px;
	  grid-template-columns: 1fr 1fr 1fr 1fr;
		grid-template-rows: 1fr;
	  padding: 20px;
	}
	.grid-item-case-img {  /* This is the case img element */
		border: 0px solid rgba(0, 200, 200);  /* This is the gridline */
	  font-size: 30px;
	  text-align: left;
	}


	.grid-item-about {  /* This is the about element */
		grid-column: 1 / 3;
		grid-row: 2 / 2;
		border: 0px solid rgba(0, 200, 200);  /* This is the gridline */
		font-size: 30px;
		padding-right: 2%;
		text-align: left;
		padding-top: 60px;
		max-width: 697px;
	}
	.grid-item-exp {  /* This is the contact element */
	  grid-column: 4 / 5;
		grid-row: 2 / 2;
		border: 0px solid rgba(0, 200, 200);  /* This is the gridline */
	  font-size: 30px;
	  text-align: left;
		padding-top: 60px;
	}
	.grid-item-edu {  /* This is the contact element */
	  grid-column: 3 / 4;
		grid-row: 2 / 2;
		border: 0px solid rgba(0, 200, 200);  /* This is the gridline */
	  font-size: 30px;
	  text-align: left;
		padding-top: 60px;
		max-width:310px
	}
	.grid-item-clientlist {  /* This is the about element */
	  grid-column: 1 / 3;
		grid-row: 3 / 3 ;
		border: 0px solid rgba(0, 200, 200);  /* This is the gridline */
	  font-size: 30px;
		padding-right:0%;
	  text-align: left;
		padding-top: 60px;
		max-width: 697px;
	}
	h1 {
		font-family: 'Inter', sans-serif;
		font-size: 3.5em;
		font-weight: normal;
		padding: 40px, 40px, 40px, 40px;
		/*background: blue;*/
	}
}
.grid-item-footer-r {
  grid-column: 1 / 2;
	border: 0px solid rgba(0, 200, 200);  /* This is the gridline */
	font-size: 26px;
  line-height: 0.9em;
	padding-top: 10%;
  text-align: left;
	padding-bottom: 5%;
}
.grid-item-footer-r2 {
  grid-column: 2 / 3;
	border: 0px solid rgba(0, 200, 200);  /* This is the gridline */
	font-size: 26px;
  line-height: 0.9em;
	padding-top: 10%;
  text-align: left;
	padding-bottom: 5%;
}

	/* T_A_B_L_E_T Breakpoint */

	@media only screen
  and (min-width : 751px)
	and (max-width : 1090px)
	and (orientation : portrait) {

		.grid-container-header {
			display: grid;
			grid-column-gap: 15px;
			grid-row-gap: 30px;
			grid-template-columns: 1fr 1fr;
		 grid-template-rows: 1fr;
			padding: 20px;
		}
		.grid-container {
		  display: grid;
		  grid-column-gap: 15px;
		  grid-row-gap: 30px;
		  grid-template-columns: 1fr 1fr;
			grid-template-rows: 1fr 1fr 1fr 1fr;
		  padding: 20px;
		}
		.grid-container-h1 {
		  display: grid;
		  grid-column-gap: 15px;
		  grid-row-gap: 30px;
		  grid-template-columns: 1fr 1fr 1fr 1fr;
		  padding: 20px;
			margin-top: 5%;
			margin-bottom: 5%;
		}
		.grid-container-footer {
		  display: grid;
		  grid-column-gap: 15px;
		  grid-row-gap: 30px;
		  grid-template-columns: 1fr 1fr 1fr 1fr;
			grid-template-rows: 1fr;
		  padding: 20px;
		}
		.grid-item-h1 {
		  grid-column: 1 / 5;
			border: 0px solid rgba(0, 200, 200);  /* This is the gridline */
			padding-right: 25%;
		  text-align: left;
		}
		.grid-item-case-img {  /* This is the case img element */
			grid-column: 1 / 5;
			border: 0px solid rgba(0, 200, 200);  /* This is the gridline */
			font-size: 30px;
			text-align: left;
		}
		.grid-item-case-headline {
		  grid-column: 1 / 3;
			border: 0px solid rgba(0, 200, 200);  /* This is the gridline */
			padding-right: 25%;
		  text-align: left;
		}
		.grid-item-case {  /* This is the contact element */
		  grid-column: 3 / 5;
			border: 0px solid rgba(0, 200, 200);  /* This is the gridline */
		  font-size: 30px;
		  text-align: left;
			padding-top: 5px;
			vertical-align: 15px;
			max-width: 670px
		}
		.grid-item-about {  /* This is the about element */
		  grid-column: 1 / 5;
			grid-row: 1 / 1;
			border: 0px solid rgba(0, 200, 200);  /* This is the gridline */
		  font-size: 30px;
			padding-right:6%;
		  text-align: left;
			padding-top: 60px;
		}
		.grid-item-exp {  /* This is the contact element */
			grid-column: 3 / 5;
			grid-row: 2 / 2;
			border: 0px solid rgba(0, 200, 200);  /* This is the gridline */
			font-size: 30px;
			text-align: left;
			padding-top: 60px;
			padding-right: 0%;
		}
		.grid-item-edu {  /* This is the contact element */
			grid-column: 1 / 3;
			grid-row: 2 / 2;
			border: 0px solid rgba(0, 200, 200);  /* This is the gridline */
			font-size: 30px;
			text-align: left;
			padding-top: 60px;
			padding-right: 13%;
		}
		.grid-item-clientlist {  /* This is the about element */
			grid-column: 1 / 5;
			grid-row: 3 / 3 ;
			border: 0px solid rgba(0, 200, 200);  /* This is the gridline */
			font-size: 30px;
			padding-right:6%;
			text-align: left;
			padding-top: 60px;
			max-width: 1024px;
		}
		p {
		  	font-family: 'Inter', sans-serif;
			font-size: 0.7em;
			font-weight: normal;
			padding: 0;
			margin: 0;
		}
		h1 {
		  font-family: 'Inter', sans-serif;
			font-size: 2.5em;
			font-weight: normal;
			padding: 40px, 40px, 40px, 40px;
			/*background: green;*/
		}
		svg {
			padding: 0px 0px 0px 0px;
			margin: 2px 0px 0px 0px;

   }
.grid-item-footer-r {
  grid-column: 1 / 3;
	border: 0px solid rgba(0, 200, 200);  /* This is the gridline */
	font-size: 26px;
  line-height: 0.9em;
	padding-top: 10%;
  text-align: left;
padding-bottom: 5%;
}
.grid-item-footer-r2 {
  grid-column: 3 / 5;
	border: 0px solid rgba(0, 200, 200);  /* This is the gridline */
	font-size: 26px;
  line-height: 0.9em;
	padding-top: 10%;
  text-align: left;
	padding-bottom: 5%;
}
}
	/* M_O_B_I_L_E Breakpoint */

	@media only screen
	and (max-width: 750px)
	and (orientation : portrait) {
		.dada {
			min-width: 320px;
			margin: 0 auto;
		}
		.grid-container-header {
			display: grid;
			grid-column-gap: 15px;
			grid-row-gap: 30px;
			grid-template-columns: 1fr 1fr;
		 grid-template-rows: 1fr;
			padding: 20px;
		}
		.grid-container-footer {
			display: grid;
			grid-column-gap: 15px;
			grid-row-gap: 30px;
			grid-template-columns: 1fr 1fr 1fr 1fr;
			grid-template-rows: 1fr;
			padding: 20px;
		}
		.grid-item-case-img {  /* This is the case img element */
      grid-column: 1 / 5;
			border: 0px solid rgba(0, 200, 200);  /* This is the gridline */
			font-size: 30px;
			text-align: left;
		}
		.grid-item-h1 {
		  grid-column: 1 / 5;
			border: 0px solid rgba(0, 200, 200);  /* This is the gridline */
			padding-right: 3%;
			font-size: 18px;
		  text-align: left;
		}
		.grid-item-case-headline {
		  grid-column: 1 / 5;
			border: 0px solid rgba(0, 200, 200);  /* This is the gridline */
			padding-right: 3%;
			font-size: 18px;
		  text-align: left;
		}
		.grid-item-contact {  /* This is the contact element */
		  grid-column: 1 / 2;
			border: 0px solid rgba(0, 200, 200);  /* This is the gridline */
		  font-size: 30px;
		  text-align: left;
			padding-top: 50px;
		}
		.grid-item-case {  /* This is the contact element */
			grid-column: 1 / 5;
			grid-row:2;
			border: 0px solid rgba(0, 200, 200);  /* This is the gridline */
			font-size: 30px;
			text-align: left;
		}

		.grid-item-about {  /* This is the about element */
			grid-column: 1 / 5;
			grid-row: 1;
			border: 0px solid rgba(0, 200, 200);  /* This is the gridline */
			font-size: 30px;
			padding-right:3%;
			text-align: left;
			padding-top: 60px;
		}

		.grid-item-clientlist {  /* This is the about element */
		  grid-column: 1 / 5;
			grid-row: 3 ;
			border: 0px solid rgba(0, 200, 200);  /* This is the gridline */
		  font-size: 30px;
			padding-right:3%;
		  text-align: left;
			padding-top: 30px;
		}
		.grid-item-exp {  /* This is the contact element */
			grid-column: 3 / 5;
			grid-row: 2;
			border: 0px solid rgba(0, 200, 200);  /* This is the gridline */
			font-size: 30px;
			text-align: left;
			padding-top: 60px;
			padding-right: 2%;
		}
		.grid-item-edu {  /* This is the contact element */
			grid-column: 1 / 3;
			grid-row: 2;
			border: 0px solid rgba(0, 200, 200);  /* This is the gridline */
			font-size: 30px;
			text-align: left;
			padding-top: 60px;
			padding-right: 10%;
		}
			h1 {
			  font-family: 'Inter', sans-serif;
				font-size: 2em;
				font-weight: normal;
				padding: 40px, 40px, 40px, 40px;
				/*background: red;*/
   }
	 p {
			 font-family: 'Inter', sans-serif;
		 font-size: 0.68em;
		 font-weight: normal;
		 padding: 0;
		 margin: 0;
	 }
	 .grid-container {
	   display: grid;
	   grid-column-gap: 15px;
	   grid-row-gap: 30px;
	   grid-template-columns: 1fr;
	 	grid-template-rows: 1fr 1fr 1fr 1fr 1fr 1fr;
	   padding: 20px;
	 }
	 svg {
	 	padding: 0px 0px 0px 0px;
	 	margin: 2px 0px 0px 0px;
    zoom:0.8;
	 }
	 .grid-item-footer-r {
	   grid-column: 1 / 3;
	 	border: 0px solid rgba(0, 200, 200);  /* This is the gridline */
	 	font-size: 22px;
	   line-height: 0.9em;
	   text-align: left;
		 padding-bottom: 5%;
	 }
	 .grid-item-footer-r2 {
	   grid-column: 3 / 5;
	 	border: 0px solid rgba(0, 200, 200);  /* This is the gridline */
	 	font-size: 22px;
	   line-height: 0.9em;
	   text-align: left;
		 padding-bottom: 5%;
	 }
}

/* M_O_B_I_L_E > Landscape Breakpoint */

@media only screen
and (max-width: 1024px)
and (orientation : landscape) {
	.dada {
		min-width: 568px;
		margin: 0 auto;
	}
	.grid-container-header {
		display: grid;
		grid-column-gap: 15px;
		grid-row-gap: 30px;
		grid-template-columns: 1fr 1fr;
	 grid-template-rows: 1fr;
		padding: 20px;
	}
	.grid-container-footer {
		display: grid;
		grid-column-gap: 15px;
		grid-row-gap: 30px;
		grid-template-columns: 1fr 1fr 1fr 1fr;
		grid-template-rows: 1fr;
		padding: 20px;
	}
	.grid-item-h1 {
		grid-column: 1 / 5;
		border: 0px solid rgba(0, 200, 200);  /* This is the gridline */
		padding-right: 15%;
		text-align: left;
	}
	.grid-item-footer-r {
		grid-column: 1 / 3;
	 border: 0px solid rgba(0, 200, 200);  /* This is the gridline */
	 font-size: 22px;
		line-height: 0.9em;
		text-align: left;
		padding-bottom: 5%;
		padding-top: 0px;
	}
	.grid-item-footer-r2 {
		grid-column: 3 / 5;
	 border: 0px solid rgba(0, 200, 200);  /* This is the gridline */
	 font-size: 22px;
		line-height: 0.9em;
		text-align: left;
		padding-bottom: 5%;
		padding-top: 0px;
	}
}