/* BASE - Base Variable file along with starting point Mixins and Placeholders.
 ========================================================================== */
/* TYPO3 8 : CHANGE DEFAULT SETTINGS */
/* Image Rows */
.ce-gallery {
  margin-right: -20px !important; }

.ce-row {
  display: inline !important;
  height: 100%;
  overflow: hidden;
  margin-bottom: 0px !important; }

.ce-gallery .ce-column {
  margin-right: 20px !important;
  margin-bottom: 20px !important; }

.ce-gallery .ce-column img {
  max-width: 100% !important;
  height: auto; }

.ce-gallery[data-ce-columns="2"] .ce-column {
  width: 48%;
  width: calc(50% - 20px); }

.ce-gallery[data-ce-columns="3"] .ce-column {
  width: 31%;
  width: calc(33.333% - 20px); }

.ce-gallery[data-ce-columns="4"] .ce-column {
  width: 22%;
  width: calc(25% - 20px); }

.ce-gallery[data-ce-columns="5"] .ce-column {
  width: 18%;
  width: calc(20% - 20px); }

.ce-gallery[data-ce-columns="6"] .ce-column {
  width: 15%;
  width: calc(16.666% - 20px); }

.ce-gallery[data-ce-columns="7"] .ce-column {
  width: 13%;
  width: calc(14.285% - 20px); }

.ce-gallery[data-ce-columns="8"] .ce-column {
  width: 12%;
  width: calc(12.5% - 20px); }

.ce-gallery[data-ce-columns="9"] .ce-column {
  width: 11%;
  width: calc(11.1111% - 20px); }

.ce-gallery[data-ce-columns="10"] .ce-column {
  width: 10%;
  width: calc(10% - 20px); }

@media screen and (max-width: 1060px) {
  .ce-gallery[data-ce-columns="8"] .ce-column {
    width: 15%;
    width: calc(16.666% - 20px); }

  .ce-gallery[data-ce-columns="9"] .ce-column {
    width: 15%;
    width: calc(16.666% - 20px); }

  .ce-gallery[data-ce-columns="10"] .ce-column {
    width: 15%;
    width: calc(16.666% - 20px); } }

@media screen and (max-width: 880px) {
  .ce-gallery[data-ce-columns="5"] .ce-column {
    width: 24%;
    width: calc(25% - 20px); }

  .ce-gallery[data-ce-columns="6"] .ce-column {
    width: 24%;
    width: calc(25% - 20px); }

  .ce-gallery[data-ce-columns="7"] .ce-column {
    width: 24%;
    width: calc(25% - 20px); }

  .ce-gallery[data-ce-columns="8"] .ce-column {
    width: 24%;
    width: calc(25% - 20px); }

  .ce-gallery[data-ce-columns="9"] .ce-column {
    width: 24%;
    width: calc(25% - 20px); }

  .ce-gallery[data-ce-columns="10"] .ce-column {
    width: 24%;
    width: calc(25% - 20px); } }

@media screen and (max-width: 680px) {
  /* Typo3 Bild Text Reset für Mobile */
    .ce-gallery[data-ce-columns="4"] .ce-column {
      width: 24%;
      width: calc(33.333% - 20px); }
    .ce-gallery[data-ce-columns="5"] .ce-column {
      width: 24%;
      width: calc(33.333% - 20px); }
    .ce-gallery[data-ce-columns="6"] .ce-column {
      width: 24%;
      width: calc(33.333% - 20px); }
    .ce-gallery[data-ce-columns="7"] .ce-column {
      width: 24%;
      width: calc(33.333% - 20px); }
    .ce-gallery[data-ce-columns="8"] .ce-column {
      width: 24%;
      width: calc(33.333% - 20px); }
    .ce-gallery[data-ce-columns="9"] .ce-column {
      width: 24%;
      width: calc(33.333% - 20px); }
    .ce-gallery[data-ce-columns="10"] .ce-column {
      width: 24%;
      width: calc(33.333% - 20px); }
    div.csc-textpic-imagewrap {
      float: none;
      clear: both;
      display: block; }
    div.csc-textpic-text {
      float: none;
      clear: both;
      margin-left: 0px !important;
      margin-right: 0px !important;
      padding-bottom: 10px !important; } }

@media screen and (max-width: 480px) {
  .ce-gallery {
    margin-right: -15px !important; }

  .ce-gallery .ce-column {
    margin-right: 15px !important;
    margin-bottom: 15px !important; }

  .ce-gallery[data-ce-columns="3"] .ce-column {
    width: 24%;
    width: calc(50% - 15px); }

  .ce-gallery[data-ce-columns="4"] .ce-column {
    width: 24%;
    width: calc(50% - 15px); }

  .ce-gallery[data-ce-columns="5"] .ce-column {
    width: 24%;
    width: calc(50% - 15px); }

  .ce-gallery[data-ce-columns="6"] .ce-column {
    width: 24%;
    width: calc(50% - 15px); }

  .ce-gallery[data-ce-columns="7"] .ce-column {
    width: 24%;
    width: calc(50% - 15px); }

  .ce-gallery[data-ce-columns="8"] .ce-column {
    width: 24%;
    width: calc(50% - 15px); }

  .ce-gallery[data-ce-columns="9"] .ce-column {
    width: 24%;
    width: calc(50% - 15px); }

  .ce-gallery[data-ce-columns="10"] .ce-column {
    width: 24%;
    width: calc(50% - 15px); } }
/*******************************************************************************/
/* M O D U L E  */
/******************************************************************************/
/******************************************************************************/
/**  Standtad Effekt Text & Bild**/
/******************************************************************************/
/******************************************************************************/
/** TEAM  **/
/******************************************************************************/
.produkte .ce-bodytext h4 {
  margin-bottom: 0px !important; }

.team .ce-bodytext, .team .ce-bodytext p {
  font-size: 18px !important;
  color: #000;
  line-height: 120%; }
/******************************************************************************/
/** PRODUKTE  **/
/******************************************************************************/
.produkte .gridrow div[class*="col-sm"] {
  margin-bottom: 60px; }
/* min-height: 400px;*/
.produkte .ce-bodytext, .produkte .ce-bodytext p {
  font-size: 18px !important;
  line-height: 120%; }

.produkte .gridcol {
  position: relative; }

.produkte .ce-bodytext {
  position: absolute;
  bottom: 0;
  left: 15px;
  width: calc(100% - 30px);
  height: 32px;
  background: rgba(199, 7, 15, 0.9);
  background: rgba(255, 255, 255, 0.9);
  padding: 10px 0px 15px 15px;
  color: #fff;
  font-weight: 700;
  text-align: left !important;
  margin-bottom: -22px;
  webkit-transition: all 300ms ease-in-out;
  -moz-transition: all 300ms ease-in-out;
  -ms-transition: all 300ms ease-in-out;
  -o-transition: all 300ms ease-in-out;
  transition: all 300ms ease-in-out;
  overflow: hidden; }

.produkte .ce-bodytext h2 {
  margin-bottom: 0px !important;
  margin-top: 0px !important;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  color: #111 !important;
  font-size: 17px !important;
  font-weight: 700 !important;
  margin-bottom: 0px !important;
  line-height: 100%; }

.produkte p {
  webkit-transition: all 300ms ease-in-out;
  -moz-transition: all 300ms ease-in-out;
  -ms-transition: all 300ms ease-in-out;
  -o-transition: all 300ms ease-in-out;
  transition: all 300ms ease-in-out;
  font-size: 16px !important;
  font-weight: 400;
  color: #fff !important;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  /* IE 8 */
  filter: alpha(opacity=0);
  /* IE 5-7 */
  -moz-opacity: 0;
  /* Mozilla */
  -khtml-opacity: 0;
  /* Safari 1.x */
  opacity: 0;
  /* Good browsers */
  padding-top: 55px; }

.produkte .gridcol > div:hover .ce-bodytext {
  background: rgba(199, 7, 15, 0.8);
  height: calc(100% - 10px);
  margin-bottom: 10px; }

.produkte .gridcol > div:hover p {
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  /* IE 8 */
  filter: alpha(opacity=100);
  /* IE 5-7 */
  -moz-opacity: 1;
  /* Mozilla */
  -khtml-opacity: 1;
  /* Safari 1.x */
  opacity: 1;
  /* Good browsers */
  padding-top: 65px; }

.produkte .gridcol > div:hover h2 {
  position: absolute;
  top: 40px;
  transform: none !important;
  color: #fff !important; }

@media screen and (max-width: 680px) {
  .produkte .ce-bodytext {
    left: 7.5px;
    width: calc(100% - 15px); } }

@media screen and (max-width: 580px) {
  .produkte .ce-bodytext h2 {
    font-size: 16px !important; }

  .produkte .ce-bodytext, .produkte .ce-bodytext p {
    font-size: 16px !important; }

  .produkte .gridcol > div:hover h2 {
    top: 18px; }

  .produkte .gridcol > div:hover p {
    padding-top: 40px; } }

@media screen and (max-width: 480px) {
  .produkte .ce-bodytext h2 {
    font-size: 14px !important; }

  .produkte .ce-bodytext, .produkte .ce-bodytext p {
    font-size: 14px !important; }

  .produkte .ce-bodytext {
    padding: 10px 0px 15px 5px; }

  .produkte .gridcol > div:hover h2 {
    top: 10px; }

  .produkte .gridcol > div:hover p {
    padding-top: 30px; } }
/* end standard
 /******************************************************************************/
/******************************************************************************/
/** FOTOGALERIE  **/
/******************************************************************************/
/* end fotogalerie 	
 /******************************************************************************/
/*******************************************************************************/
/* GLOBAL CLASSES */
/*******************************************************************************/
.gridcontainer:after {
  visibility: hidden;
  display: block;
  font-size: 0;
  content: " ";
  clear: both;
  height: 0; }

.gridrow div[class*="col-sm"] {
  margin-bottom: 30px; }

.gridrow div.csc-textpic .csc-textpic-imagewrap .csc-textpic-image {
  margin-bottom: 0px !important; }

.gridrow .ce-gallery .ce-column {
  margin-right: 20px !important;
  margin-bottom: 0px !important; }
/*******************************************************************************/
/* MEDIA QUERIES */
/*******************************************************************************/
@media screen and (max-width: 767px) {
  .gridrow div[class*="col-sm-3"] {
    width: 33.333% !important;
    float: left !important; }

  .gridrow div[class*="col-sm-4"] {
    width: 33.333% !important;
    float: left !important; }

  .gridrow div[class*="col-sm-6"] {
    width: 50% !important;
    float: left !important; }

  .gridrow h2 {
    font-size: 16px !important; } }

@media screen and (max-width: 680px) {
  .gridrow.row {
    margin-right: -7.5px;
    margin-left: -7.5px; }

  .gridrow div[class*="col-sm"] {
    width: 50% !important;
    float: left !important;
    padding-right: 7.5px;
    padding-left: 7.5px; } }

@media screen and (max-width: 500px) {
  .gridrow h2 {
    font-size: 16px !important; }

  .gridrow p {
    font-size: 15px; }

  .gridrow div[class*="col-sm"] {
    margin-bottom: 15px; } }
/*******************************************************************************/
/* ANTIQUE BROWSER FIX */
/*******************************************************************************/
/* IE 9 + IE 10 + 11 */
@media screen and (min-width:0\0) {
  .modul img {
    max-width: none;
    width: 100% !important;
    -ms-transition: none !important;
    transition: none !important;
    -ms-transform: none !important;
    transform: none !important; }

  .mdoul .csc-textpic-imagewrap:hover:hover img {
    -ms-transition: none !important;
    transition: none !important;
    -ms-transform: none !important;
    transform: none !important; } }
