/* 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); }

/* Exception : Columns = 1 (no Image Row )*/
.ce-gallery[data-ce-columns="1"] {
  margin-right: 0px !important; }

@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) {
  .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);
    /* Typo3 Bild Text Reset für Mobile */ }
  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;
    /* clear flaot on t3 Text & Bild */ }
  .ce-gallery[data-ce-columns="1"] {
    float: none !important; }
  .ce-intext.ce-right .ce-gallery[data-ce-columns="1"], .ce-intext.ce-left .ce-gallery[data-ce-columns="1"], .ce-above .ce-gallery[data-ce-columns="1"] {
    margin-bottom: 15px; } }

@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="2"] .ce-column {
    width: 100%; }
  .ce-gallery[data-ce-columns="3"] .ce-column {
    width: 100%; }
  .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  **/
/******************************************************************************/
.team .ce-gallery .ce-column {
  margin-bottom: 0px !important; }

.team .ce-bodytext h3 {
  margin-bottom: 0px !important;
  font-weight: 600 !important;
  color: #111 !important;
  font-size: 18px !important;
  line-height: 100% !important; }

.team h3 span {
  position: relative;
  display: inline-block; }

.team h3 span:after {
  content: '';
  position: absolute;
  display: block;
  width: 100%;
  margin: 0px;
  border: 2px solid #E8122E; }

.team .ce-bodytext, .team .ce-bodytext p {
  font-size: 18px !important;
  line-height: 120%;
  margin: 8px 0px 8px 0px !important; }

/******************************************************************************/
/** PRODUKTE  **/
/******************************************************************************/
.produkte .gridrow div[class*="col-sm"] {
  margin-bottom: 0px;
  /* 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: 44px;
  background: transparent;
  padding: 10px 0px 0px 15px;
  color: #fff;
  font-weight: 700;
  text-align: left !important;
  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-intext.ce-right .ce-gallery, .produkte .ce-intext.ce-left .ce-gallery, .produkte .ce-above .ce-gallery {
  margin-bottom: 0px !important; }

.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=1);
  /* IE 5-7 */
  -moz-opacity: 1;
  /* Mozilla */
  -khtml-opacity: 1;
  /* Safari 1.x */
  opacity: 1;
  /* Good browsers */
  padding-bottom: 10px; }

.produkte .gridcol > a:hover .ce-bodytext {
  height: 100%;
  margin-bottom: 0px;
  background: rgba(232, 18, 46, 0.9); }

.produkte .gridcol > a: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: 70%;
  position: absolute;
  bottom: -17px; }

@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; } }

/*******************************************************************************/
/* PRINT CSS */
/*******************************************************************************/
@media print {
  .produkte .ce-bodytext {
    position: relative !important;
    height: auto !important;
    background: transparent;
    padding: 6px 0px 0px 0px !important;
    color: #000;
    overflow: visible; }
  .produkte .gridcol > a:hover .ce-bodytext {
    background: inherit !important; }
  .produkte .gridcol > a:hover .ce-bodytext {
    height: auto !important;
    margin-bottom: 0px;
    background: transparent; }
  .produkte p {
    font-size: 16px !important;
    font-weight: 400;
    color: #fff !important;
    opacity: 1;
    /* Good browsers */
    padding-bottom: 0px; } }

/* end standard
 /******************************************************************************/
/******************************************************************************/
/** FOTOGALERIE  **/
/******************************************************************************/
/*  @import "effekte/fotogallery.scss";  */
/* end fotogalerie 	
 /******************************************************************************/
/*******************************************************************************/
/* GLOBAL CLASSES */
/*******************************************************************************/
.gridcontainer:after {
  visibility: hidden;
  display: block;
  font-size: 0;
  content: " ";
  clear: both;
  height: 0; }

.gridrow div[class*="col-md"] {
  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; }

.gridrow .ce-gallery[data-ce-columns="1"] .ce-column {
  margin-right: 0px !important; }

/*******************************************************************************/
/* MEDIA QUERIES */
/*******************************************************************************/
@media screen and (max-width: 767px) {
  .gridrow div[class*="col-md-2"] {
    width: 25% !important;
    float: left !important; }
  .gridrow div[class*="col-md-3"] {
    width: 33.333% !important;
    float: left !important; }
  .gridrow div[class*="col-md-4"] {
    width: 50% !important;
    float: left !important; }
  .gridrow div[class*="col-md-6"] {
    width: 50% !important;
    float: left !important; }
  .gridrow h2 {
    font-size: 16px !important; }
  .marken .gridrow div[class*="col-md"] {
    width: 31% !important; } }

@media screen and (max-width: 680px) {
  .gridrow.row {
    margin-right: -7.5px;
    margin-left: -7.5px; }
  .gridrow div[class*="col-md"] {
    width: 50% !important;
    float: left !important;
    padding-right: 7.5px;
    padding-left: 7.5px; } }

@media screen and (max-width: 480px) {
  .gridrow div[class*="col-md"] {
    width: 100% !important;
    float: left !important;
    padding-right: 7.5px;
    padding-left: 7.5px;
    margin-bottom: 15px; }
  .gridrow div[class*="col-md-3"] {
    width: 50% !important;
    float: left !important; }
  .gridrow div[class*="col-md-2"] {
    width: 33.33333% !important;
    float: left !important; } }

/*******************************************************************************/
/* 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; } }
