.inspiro-slider .slide-custom { overflow: hidden; width: 100%; height: 100%; background-repeat: no-repeat; background-size: cover; background-position: 50% 20%; display: -webkit-box !important; display: -webkit-flex !important; display: -ms-flexbox !important; display: flex !important; }

.inspiro-slider .slide-custom .outer-wrapper { position:absolute; background: transparent; }

.inspiro-slider .slide-custom .container {   position: absolute; width: 70vw; top: 15vh; left: 0; color: #FFF; }

.inspiro-slider .slide-custom .inner-wrapper { height: 40vh; padding: 20px; }

/*.inspiro-slider .slide-custom .left h1 { position: relative; left: 0%; font-weight: 700; color: #fff; text-align: left; }

.inspiro-slider .slide-custom .left h2 { position: relative; left: 0%; font-weight: 700; color: #fff; text-align:left; }

.inspiro-slider .slide-custom .left h3 { position: relative; left: 0%; color: #fff; font-weight: 700; color: #fff; text-align:left; }*/

.inspiro-slider .slide-custom { position: relative; text-align: left; }

img-mobile, .img-mobile { height: 60px; padding-right:10px; }

/*.inspiro-slider .slide-custom h1 { font-size: 68px; font-weight: 700; color: #fff; text-align:left;}

.inspiro-slider .slide-custom h2 { font-size: 39px; font-weight: 700; line-height: 68px; color: #fff; text-align:left;}

.inspiro-slider .slide-custom h3 { color: #fff; font-size: 39px; font-weight: 700; line-height: 68px; color: #fff;text-align:left;}

.inspiro-slider .slide-custom h4 { font-size: 32px; font-weight: 700; color: #fff; text-align:left;}

.inspiro-slider .slide-custom h5 { font-size: 65px; font-weight: 700; color: #fff; text-align:center;}

.inspiro-slider .slide-custom h6 { color: #fff;}*/

/* ----------------------------------------------------------------
    Inspiro Slider - Responsive Classes
-----------------------------------------------------------------*/
/*@media (min-width: 768px) {
    .inspiro-slider .slide-custom h1 { font-size: 56px; font-weight: 700; color: #fff; right:370px; bottom:110px; position:relative; text-align:left;}
    
    .inspiro-slider .slide-custom h2 { font-size: 39px; font-weight: 700; line-height: 45px; color: #fff; right:370px; position:relative; text-align:left;}
    
    .inspiro-slider .slide-custom h3 { color: #fff; font-size: 30px; font-weight: 700; line-height: 34px; color: #fff; right:370px; top:30px; position:relative; text-align:left;}
    
    .inspiro-slider .slide-custom h4 { font-size: 28px; font-weight: 700; color: #fff; right:370px; top:40px; position:relative; text-align:left;}
    }*/
    
    
    
    @media (max-width: 767.99px) { .inspiro-slider .flickity-button:hover { background-color: transparent; }
      .inspiro-slider .slide-custom { text-align: left; }
      .inspiro-slider .slide-custom .container { position: absolute; width: 50vw; top: 14vh; left: 0; color: #FFF; }
      .inspiro-slider .slide-custom .strong::after { margin-left: auto; margin-right: auto; }
      .inspiro-slider .slide-custom .left h1 { font-size: 1.3em; text-align: left;}
      .inspiro-slider .slide-custom .left h2 { font-size: 1em; text-align: left;}
      .inspiro-slider .slide-custom .left h3 { font-size:0.71em; text-align: left;}
      .inspiro-slider .slide-custom h4 { text-align: left;}
      .inspiro-slider .slide-custom h5 { text-align: center;}
      .inspiro-slider .slide-custom > p {  font-weight: 400; }
      .inspiro-slider .slide-custom h6 { color: #fff; text-align: center;} }
    

/* 

1. Add your custom Css styles below
2. Place the this code in your template: 

 <link href="css/custom.css" rel="stylesheet">

*/