/****************************** Referenzen Bereich Logos ******************************************/
.service_img {
float: left;
max-width: 25%;
}
.service_img img {
width: 100%;
height: auto;
object-fit:cover;
}
.services_section {
margin: -30px 0 0 0;
width: 100%;
float: left;
}
.services_taital {
width: 100%;
float: left;
font-size: 40px;
color: #1b1b1b;
font-weight: bold;
text-align: center;
}
.services_text_1 {
width: 100%;
font-size: 16px;
margin: 0 auto;
color: #1f1f1f;
padding-top: 20px;
text-align: center;
}
.services_text {
width: 100%;
font-size: 14px;
margin: 0px;
color: #1b1b1b;
padding-top: 20px;
}
.services_section_2 {
width: 90%;
margin: 80px 0 0 0px;
}
.box_main {
width: 100%;
background-color: #f5f5f5;
height: 350px;
padding: 40px 20px 20px 20px;
border-radius: 20px;
margin-top: -50px;
box-shadow: 5px 5px 10px #a5a5a5;
}
.development_text {
width: 100%;
font-size: 16px;
font-weight: 600;
padding: 20px 0px 0px 0px;
height: 80px;
}
.logo_text {
width: 100%;
font-size: 14px;
margin-top: -40px;
}
.readmore_bt {
width: 250px;
padding-top: 30px;
}
.readmore_bt a {
width: 100%;
text-align: center;
font-size: 16px;
color: #fda51a;
padding: 15px 20px;
margin-top: 10px;
font-weight: bold;
}
.readmore_bt a:hover {
color: #252525;
}
.projekt_tag{
font-weight: 600;
font-size: 2.5em;
color: #b00000;
text-align: left;
margin: 30px 0px 0px -5px;
}
.projekt_mj{
font-weight: 500;
font-size: 1.5em;
color: #b00000;
text-align: left;
margin: -43px 0px 0px 55px;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
.service_img {
max-width: 48%;
margin: 110px 10px 20px 0px;
}
.service_img img {
width: 100%;
}
.services_section_2 {
margin: 0px auto;
width: 100%;
}
.box_main {
width: 320px;
height: 400px;
padding: 40px 20px 40px 20px;
margin: -60px 20px 0 0;
}
}
@media only screen and (min-width: 500px) and (max-width: 768px) {
.service_img {
max-width: 48%;
margin: 110px 10px 20px 0px;
}
.service_img img {
width: 100%;
}
.services_section_2 {
margin: 0px auto;
width: 100%;
}
.box_main {
width: 250px;
height: 350px;
padding: 40px 20px 40px 20px;
margin: -60px 20px 0 0;
}
}
@media only screen and (max-width: 499px) {
.service_img {
max-width: 100%;
}
.service_img img {
width: 100%;
}
.services1_section_2 {
margin: -30px auto;
width: 100%;
}
.box_main {
width: 350px;
height: 350px;
padding: 40px 20px 40px 20px;
margin: -60px 20px 0 0;
}
}
@media only screen and (max-width: 400px) {
.service_img {
max-width: 100%;
}
.service_img img {
width: 100%;
}
.services1_section_2 {
margin: 0px auto;
width: 100%;
}
.box_main {
width: 270px;
height: 350px;
padding: 40px 20px 40px 20px;
margin: -60px 0 20px 0;
}
}
/****************************** Kunden-Referenzen ******************************************/
.service1_img {
float: left;
max-width: 32%;
}
.service1_img img {
width: 100%;
height: auto;
object-fit:cover;
-moz-border-radius: 15px;
-khtml-border-radius: 15px;
-webkit-border-radius: 15px;
border-radius: 15px;
}
.services1_section {
margin: -30px 0 0 0;
width: 100%;
float: left;
}
.services1_taital {
width: 100%;
float: left;
font-size: 40px;
color: #1b1b1b;
font-weight: 600;
text-align: center;
}
.services1_text_1 {
width: 100%;
font-size: 16px;
margin: 0 auto;
color: #1f1f1f;
padding-top: 20px;
text-align: center;
}
.services1_text {
width: 100%;
font-size: 14px;
margin: 0px;
padding-top: 20px;
}
.services1_section_2 {
width: 90%;
margin: 80px 0 0 0px;
}
.box1_main {
width: 100%;
background-color: #f5f5f5;
height: 480px;
padding: 40px 20px 40px 20px;
border-radius: 20px;
margin-top: -30px;
box-shadow: 5px 5px 10px #a5a5a5;
}
.development1_text {
width: 100%;
font-size: 16px;
font-weight: 600;
padding: 20px 0px 0px 0px;
min-height: 80px;
}
.logo1_text {
width: 100%;
font-size: 14px;
margin-top: -40px;
color: #1b1b1b;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
.service1_img {
max-width: 50%;
}
.service1_img img {
width: 100%;
}
.services1_section {
margin: -30px auto;
width: 100%;
}
.box1_main {
width: 340px;
height: 480px;
padding: 40px 20px 40px 20px;
margin: -60px 20px 0 0;
}
}
@media only screen and (min-width: 500px) and (max-width: 767px) {
.service1_img {
max-width: 100%;
}
.service1_img img {
width: 100%;
}
.services1_section {
margin: -30px auto;
width: 100%;
}
.box1_main {
width: 500px;
height: 480px;
padding: 40px 20px 40px 20px;
margin: -60px 20px 0 0;
}
}
@media only screen and (max-width: 499px) {
.service1_img {
max-width: 100%;
}
.service1_img img {
width: 100%;
}
.services1_section {
margin: -30px auto;
width: 100%;
}
.box1_main {
width: 350px;
height: 480px;
padding: 40px 20px 40px 20px;
margin: -60px 20px 0 0;
}
}
@media only screen and (max-width: 400px) {
.service1_img {
max-width: 100%;
}
.service1_img img {
width: 100%;
}
.services1_section {
margin: -30px auto;
width: 100%;
}
.box1_main {
width: 260px;
height: 420px;
padding: 40px 20px 40px 20px;
margin: -60px 20px 0 0;
}
}
/******************************* Projekte *******************************/
.no_reffi {
font-weight: 600;
font-size: 1.2em;
color: #f7b500;
text-align: center;
margin: 50px auto;
}
/***************************** Ausgabe Seitenanzahl *************************/
.anz_seiten{
font-weight: 400;
font-size: 12px;
text-align: left;
margin: -20px 0px 0 0px;
}
/*********************************** Projektbezeichnung ***************************************************/
.projekt_bez{
margin: 5px 0px 5px 0px;
text-align: left;
font-weight: 600;
font-size: 16px;
color: #412716;   
text-transform:uppercase; 
}
/********************* Trennlinien ************************************/
.linie {
margin: 90px 0 30px 0px;
width: 100%;
border: 1px solid #c5c5c5;
}
/*.linie_ohne {
margin: 60px 0 30px 0px;
width: 100%;
border: 1px solid #c5c5c5;
}
/****************************** Textfeld Projekte **********************/
.ta_projekte {
margin: -125px 0 0px 280px;
padding: 5px 0 0 7px;
background-color: #fff; 
font-size: 14px;
line-height: 20px;
resize: none;
overflow: auto;
border: 0px inset #c5c5c5;
-moz-border-radius: 5px;
-khtml-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
box-shadow: 5px 5px 20px #a5a5a5;
opacity: 1;
filter: alpha(opacity=100);
scrollbar-face-color:#fff80a; 
scrollbar-track-color:#fff80a; 
scrollbar-highlight-color:#fff80a; 
scrollbar-3dlight-color:#FFFFFF; 
scrollbar-shadow-color:#fff80a; 
scrollbar-darkshadow-color:#FFFFFF; 
scrollbar-arrow-color:#ffffff;
} 
.textarea_weitere_infos {
#width: 30vw; 
#height: 150px; 
margin: 20px 0 0 0;
padding: 5px 0 0 7px;
background-color: #fff; 
font-size: 14px;
line-height: 20px;
resize: none;
overflow: auto;
border: 0px inset #c5c5c5;
-moz-border-radius: 5px;
-khtml-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
box-shadow: 5px 5px 20px #a5a5a5;
opacity: 1;
filter: alpha(opacity=100);
scrollbar-face-color:#fff80a; 
scrollbar-track-color:#fff80a; 
scrollbar-highlight-color:#fff80a; 
scrollbar-3dlight-color:#FFFFFF; 
scrollbar-shadow-color:#fff80a; 
scrollbar-darkshadow-color:#FFFFFF; 
scrollbar-arrow-color:#ffffff;
} 
.ta_projekte_m_grafik {
width: auto; 
height: 150px; 
margin: -85px 0 0px 280px;
padding: 5px 0 0 7px;
background-color: #fff; 
font-size: 14px;
line-height: 20px;
resize: none;
overflow: auto;
border: 0px inset #c5c5c5;
-moz-border-radius: 5px;
-khtml-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
box-shadow: 5px 5px 10px #a5a5a5;
opacity: 1;
filter: alpha(opacity=100);
scrollbar-face-color:#fff80a; 
scrollbar-track-color:#fff80a; 
scrollbar-highlight-color:#fff80a; 
scrollbar-3dlight-color:#FFFFFF; 
scrollbar-shadow-color:#fff80a; 
scrollbar-darkshadow-color:#FFFFFF; 
scrollbar-arrow-color:#ffffff;
} 
.notfall{
float: left;
margin: 20px 0px 0px 0px;
font-size: 14px; 
text-align:left; 
font-weight: 600;
color: #063971;

}

/******************************************* Projektfoto **************************************/
.projektfoto img{
margin: 30px 0px 0px 0px;
width: 35%;
height: auto;
border: 0;
-moz-border-radius: 5px;
-khtml-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
box-shadow: 5px 5px 10px #a5a5a5;
opacity: 1.0;
filter: alpha(opacity=100);
}
/********************* ohne Foto nur mit LVT-Grafik **************************/
.standfoto img{
margin: 30px 0px 0px 0px;
width: 25%;
height: auto;
margin: 30px 0 0 0;
box-shadow: 5px 5px 10px #a5a5a5;
opacity: 1.0;
filter: alpha(opacity=100);
}
/************************************** Seitensplitt ******************************/
.sitzit{
font-size: 14px;
color: #412716;
margin: 0px auto;
text-align: center;
} 
.sitzit a{
color: #002e81;
font-weight: 600;
text-decoration:none;
}
.sitzit a:hover{
text-decoration:underline;
color: #b00000;
}
/************************************************* Zusätzliche Fotos und Infos ********************************/
.fotos_album_z{
margin: 20px 0px 0px 0px;
}
.ut_dfotos  {
width: 100%; 
height: 100px; 
margin: 10px 30px 0px 0px;
padding: 2px 0px 0 0px; 
font-size: 12px; 
border-color:#f7b500; 
border-width:0px;
resize:none;
overflow: hidden;
overflow-wrap: break-word;
} 
/***************************************** Foto-Grid Zusatzinfos***************************************/
.gal_rahm {
margin: 30px 0 0px 0;
}
.gallery-grid {
float: left;
  display: -ms-grid;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  grid-gap: 1.5rem;
  justify-items: center;
  margin: 0;
  padding: 0 30px 0 0;
}

/* The Picture Frame */
.gallery-frame {
max-width: 100%;
  padding: .5rem;
  font-size: 1.0rem;
  text-align: center;
  color: #d9d9d9;
box-shadow: 5px 5px 10px #a5a5a5;
}

/* The Images */
.gallery-img {
  max-width: 100%;
  height: auto;
  object-fit: cover;
  transition: opacity 0.25s ease-in-out;
}

.gallery-img:hover {
  opacity: .7;
}
.text_proj_zus {
margin: 30px 0 0 0;
  font-size: 1.0rem;
  text-align: left;
}
.text_obj_zus {
margin: 0px 0 0 0;
  font-size: 1.0rem;
  text-align: left;
}
.text_fotos{
margin: 25px 0px 0px 0px;
font-size: 35px; 
text-align:left; 
font-weight: 600;
color: #cc0605;

}
/********************* Projektfoto Seite Zusatzinfos **************************/
.projektfoto_zus img{
margin: 30px 0px 0px 0px;
width: 25%;
height: auto;
border: 0;
-moz-border-radius: 5px;
-khtml-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
box-shadow: 5px 5px 10px #a5a5a5;
opacity: 1.0;
filter: alpha(opacity=100);
}
/********************* ohne Foto nur mit LVT-Grafik Seite Zusatzinfos **************************/
.standfoto_zus img{
margin: 10px 0px 20px 0px;
width: 25%;
height: auto;
margin: 30px 0 0 0;
box-shadow: 5px 5px 10px #a5a5a5;
opacity: 1.0;
filter: alpha(opacity=100);
}