/*  Classes  on  outer  slideshow  wrapper:


    either  NONE  or  'fraction'  or  'fraction'  +  one  of  'fraction1'...'fraction10'.


        fraction  sets  box-sizing:  border-box,  so  that  padding  on  the  element  is  taken  out  ;


    either  NONE  or  'center'  or  'right'





*/


.m-carousel  {


    position:  relative;


    overflow:  hidden;


    -webkit-font-smoothing:  antialiased;  }


    .m-carousel.m-left  {


        text-align:  left;  }


    .m-carousel.m-center  {


        text-align:  center;  }


    .m-carousel.m-fluid  >  .m-carousel-inner  >  *  {


        width:  100%;  }


    .m-carousel.m-fluid.m-center  >  .m-carousel-inner  >  *:first-child  {


        margin-left:  0%;  }


    .m-carousel.m-fluid-2  >  .m-carousel-inner  >  *  {


        width:  50%;  }


    .m-carousel.m-fluid-2.m-center  >  .m-carousel-inner  >  *:first-child  {


        margin-left:  25%;  }


    .m-carousel.m-fluid-3  >  .m-carousel-inner  >  *  {


        width:  33.333%;  }


    .m-carousel.m-fluid-3.m-center  >  .m-carousel-inner  >  *:first-child  {


        margin-left:  33.333%;  }


    .m-carousel.m-fluid-4  >  .m-carousel-inner  >  *  {


        width:  25%;  }


    .m-carousel.m-fluid-4.m-center  >  .m-carousel-inner  >  *:first-child  {


        margin-left:  37.5%;  }


    .m-carousel.m-fluid-5  >  .m-carousel-inner  >  *  {


        width:  20%;  }


    .m-carousel.m-fluid-5.m-center  >  .m-carousel-inner  >  *:first-child  {


        margin-left:  40%;  }


    .m-carousel.m-fluid-6  >  .m-carousel-inner  >  *  {


        width:  16.667%;  }


    .m-carousel.m-fluid-6.m-center  >  .m-carousel-inner  >  *:first-child  {


        margin-left:  41.667%;  }


    .m-carousel  img  {


        -ms-interpolation-mode:  bicubic;  }





.m-carousel-inner  {


    position:  relative;


    white-space:  nowrap;


    text-align:  left;


    /*  Removes  inline-block  gaps  due  to  whitespace  */


    font-size:  0;


    /*  Configure  animations  */


    -webkit-transition-property:  -webkit-transform;


    -moz-transition-property:  -moz-transform;


    -ms-transition-property:  -ms-transform;


    -o-transition-property:  -o-transform;


    transition-property:  transform;


    /*  iOS  like  slide  timings  */


    -webkit-transition-timing-function:  cubic-bezier(0.33,  0.66,  0.66,  1);


    -moz-transition-timing-function:  cubic-bezier(0.33,  0.66,  0.66,  1);


    -ms-transition-timing-function:  cubic-bezier(0.33,  0.66,  0.66,  1);


    -o-transition-timing-function:  cubic-bezier(0.33,  0.66,  0.66,  1);


    transition-timing-function:  cubic-bezier(0.33,  0.66,  0.66,  1);


    -webkit-transition-duration:  0.5s;


    -moz-transition-duration:  0.5s;


    -ms-transition-duration:  0.5s;


    -o-transition-duration:  0.5s;


    transition-duration:  0.5s;  }


    .m-carousel-inner  >  *  {


        display:  inline-block;


        vertical-align:  top;


        white-space:  normal;


        /*  We  must  reset  the  font-size  here  */


        font-size:  16px;  }


    .m-fluid  >  .m-carousel-inner  >  *  {


        box-sizing:  border-box;


        -ms-box-sizing:  border-box;


        -moz-box-sizing:  border-box;


        -o-box-sizing:  border-box;


        -webkit-box-sizing:  border-box;  }


    .m-center:not(.m-fluid)  >  .m-carousel-inner  {


        display:  inline-block;


        margin-right:  -20000px  !important;


        margin-left:  0  !important;  }


        .m-center:not(.m-fluid)  >  .m-carousel-inner  >  *  {


            position:  relative;


            left:  -20000px;  }


        .m-center:not(.m-fluid)  >  .m-carousel-inner  >  *:first-child  {


            float:  left;


            margin-right:  20000px;


            left:  0;  }


            .m-center:not(.m-fluid)  >  .m-carousel-inner  >  *:first-child:last-child  {


                margin-right:  0;  }


        .m-center:not(.m-fluid)  >  .m-carousel-inner  >  *:last-child  {


            margin-right:  -30000px;  }



/* 


  Carousel control base styling 


*/





.m-carousel-controls {


    padding-top: 10px;


    text-align: center;


}





.m-carousel-controls a {


    padding: 5px;


    -webkit-user-select: none;


    -moz-user-select: -moz-none;


    user-select: none;


    -webkit-user-drag: none;


    -moz-user-drag: -moz-none;


    user-drag: none;


}








   


/* Carousel controls: Bulleted */


.m-carousel-bulleted {


	position:absolute;


	bottom:25px;


	width:100%;


	margin:0 0 0;


}


.m-carousel-bulleted a {


    text-decoration: none;


    text-indent: -999px;


    overflow: hidden;


	background:url(https://www.stefan-bolte.de//folder/circle_page.png);


	background-position:0 0;


    display: inline-block;


    width: 12px;


    height: 12px;


	padding:0 !important;


    margin: 0 3px;


	border-radius:6px !important;


	outline:none;


}


.m-carousel-bulleted a:hover, .m-carousel-bulleted a:focus {


    text-decoration: none;


}


.m-carousel-bulleted a:hover {


    background-position:0 -12px;


}


.m-carousel-bulleted a.m-active {


    background-position:0 -12px;


}











/* Carousel controls: Pagination */


.m-carousel-pagination {


    padding-top: 10px;


}


.m-carousel-pagination a {


    text-decoration: none;


    display: inline-block;


    padding: 3px 10px;


    margin: 1px 0;


    color: #333;


    background-color: rgba(255,255,255,0.3);


    -webkit-transition: background-color 0.1s ease-in;


    -moz-transition: background-color 0.1s ease-in;


    -o-transition: background-color 0.1s ease-in;


    transition: background-color 0.1s ease-in;


    -webkit-border-radius: 2px;


    -moz-border-radius: 2px;


    border-radius: 2px;


}


.m-carousel-pagination a:hover, .m-carousel-pagination a:focus {


    text-decoration: none;


    background-color: rgba(255,255,255,0.6);


}


.m-carousel-pagination a.m-active {


    background-color: rgba(255,255,255,1);


}





/* Carousel controls: HUD */


.m-carousel-hud {


  padding-top: 0;


}


.m-carousel-hud a {


    z-index: 2;


    opacity: 1;


    display: block;


    position: absolute;


    top: 50%;


    width: 70px;


    height: 70px;


    margin: -35px 0 0 0;


    padding: 0;


    text-decoration: none;


    text-indent: -999px;


    overflow: hidden;


	background:url(https://www.stefan-bolte.de//folder/bg_arrow.png);


	background-position:0 0;


	outline:none;


}


.m-carousel:hover .m-carousel-hud a {


    opacity: 1;


}


.m-carousel .m-carousel-hud a:hover, .m-carousel .m-carousel-hud a:focus {


    opacity: 1;


}


.m-carousel-hud .m-carousel-prev {


    left: 30px;


}


.m-carousel-hud .m-carousel-prev:hover {


    background-position:0 -70px;


}


.m-carousel-hud .m-carousel-next {


    right: 30px;


	background-position:0 -140px;


}


.m-carousel-hud .m-carousel-next:hover {


	background-position:0 -210px;


}











/* extra bits */





/* captions */


.m-caption {


    margin: 0;


    padding: 10px;


    height: auto;


    text-align: center;


}

















/* scaled slides */


.m-scaled .m-item {


    opacity: 0.7;


    -webkit-backface-visibility: hidden;


    -webkit-transform: scale(0.75);


    -moz-transform: scale(0.75);


    -ms-transform: scale(0.75);


    -o-transform: scale(0.75);


    transform: scale(0.75);





    /* Configure animations */


    /* (0.5s would match the transition length between each, 


      but fast swiping on a phone can result in odd timing. 


      Half-length durations for each transform is a reasonable 


      middle ground.) */


    -webkit-transition: -webkit-transform cubic-bezier(0.33, 0.66, 0.66, 1) 0.25s, opacity ease-out 0.25s;


    -moz-transition-timing-function: -moz-transform cubic-bezier(0.33, 0.66, 0.66, 1) 0.25s, opacity ease-out 0.25s;


    -o-transition-timing-function: -o-transform cubic-bezier(0.33, 0.66, 0.66, 1) 0.25s, opacity ease-out 0.25s;


    transition-timing-function: transform cubic-bezier(0.33, 0.66, 0.66, 1) 0.25s, opacity ease-out 0.25s;


}


.m-scaled .m-active {


    opacity: 1;


    -webkit-transform: scale(1);


    -moz-transform: scale(1);


    -ms-transform: scale(1);


    -o-transform: scale(1);


    transform: scale(1);


}





/* Default Themes/Sytles for Slider */





.m-fluid .m-item {


    margin-right: 0;


}





/* Fluid Width Photo Carousel


 * .m-carousel.m-fluid.m-carousel-photos


 */





.m-carousel-photos {





}





.m-carousel-photos .m-item  > img {


    margin: 0;


    padding: 0;


    max-width: none;


    width: 100%;


    height: auto;


}





.m-carousel-photos .m-caption {


   


    bottom: 0;


    position: absolute;


    z-index: 9;


    width: 100%;


    -webkit-box-sizing: border-box;


    -moz-box-sizing: border-box;


    box-sizing: border-box;


}








/* Inner Cards for Carousel */


.m-card-dark, .m-card-light {


    padding: 20px;


    -webkit-border-radius: 6px;


    -moz-border-radius: 6px;


    border-radius: 6px;





    -webkit-box-shadow: rgba(0,0,0,0.5) 0 5px 10px;


    -moz-box-shadow: rgba(0,0,0,0.5) 0 5px 10px;


    -o-box-shadow: rgba(0,0,0,0.5) 0 5px 10px;


    -ms-box-shadow: rgba(0,0,0,0.5) 0 5px 10px;


    box-shadow: rgba(0,0,0,0.5) 0 5px 10px;    


}


.m-card-dark {


    background: rgba(0,0,0,0.5);


    color: #FFF;


}


.m-card-light {


    background: rgba(255,255,255,0.9);


    color: #000;


}


.m-card-dark .m-caption, .m-card-light .m-caption {


    margin: 0;


    padding: 10px 0 0 0;


}





.m-fade-out {


    -webkit-mask-image: -webkit-linear-gradient(left, rgba(0,0,0,0) 0%,


    rgba(0,0,0,1) 5%, rgba(0,0,0,1) 95%, rgba(0,0,0,0) 100%);


}