body,form,figure{margin:0;padding:0}img{border:0}header,footer,nav,section,aside,article,figure,figcaption{display:block}body{font-size:100.01%}select,input,textarea{font-size:99%}#container,.inside{position:relative}#main,#left,#right{float:left;position:relative}#main{width:100%}#left{margin-left:-100%}#right{margin-right:-100%}#footer{clear:both}#main .inside{min-height:1px}.ce_gallery>ul,.content-gallery>ul{margin:0;padding:0;overflow:hidden;list-style:none}.ce_gallery>ul li,.content-gallery>ul li{float:left}.ce_gallery>ul li.col_first,.content-gallery>ul li.col_first{clear:left}.float_left,.media--left>figure{float:left}.float_right,.media--right>figure{float:right}.block{overflow:hidden}.media{display:flow-root}.clear,#clear{height:.1px;font-size:.1px;line-height:.1px;clear:both}.invisible{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.custom{display:block}#container:after,.custom:after{content:"";display:table;clear:both}
@media (max-width:767px){#wrapper{margin:0;width:auto}#container{padding-left:0;padding-right:0}#main,#left,#right{float:none;width:auto}#left{right:0;margin-left:0}#right{margin-right:0}}img{max-width:100%;height:auto}.audio_container audio{max-width:100%}.video_container video{max-width:100%;height:auto}.aspect,.responsive{position:relative;height:0}.aspect iframe,.responsive iframe{position:absolute;top:0;left:0;width:100%;height:100%}.aspect--16\:9,.responsive.ratio-169{padding-bottom:56.25%}.aspect--16\:10,.responsive.ratio-1610{padding-bottom:62.5%}.aspect--21\:9,.responsive.ratio-219{padding-bottom:42.8571%}.aspect--4\:3,.responsive.ratio-43{padding-bottom:75%}.aspect--3\:2,.responsive.ratio-32{padding-bottom:66.6666%}
header,footer,nav,section,aside,main,article,figure,figcaption{display:block}body,div,h1,h2,h3,h4,h5,h6,p,blockquote,pre,code,ol,ul,li,dl,dt,dd,figure,table,th,td,form,fieldset,legend,input,textarea{margin:0;padding:0}table{border-spacing:0;border-collapse:collapse}caption,th,td{text-align:left;text-align:start;vertical-align:top}abbr,acronym{font-variant:normal;border-bottom:1px dotted #666;cursor:help}blockquote,q{quotes:none}fieldset,img,iframe{border:0}ul{list-style-type:none}sup{vertical-align:text-top}sub{vertical-align:text-bottom}del{text-decoration:line-through}ins{text-decoration:none}body{font:12px/1 "Lucida Grande","Lucida Sans Unicode",Verdana,sans-serif;color:#000}input,button,textarea,select{font-family:inherit;font-size:99%;font-weight:inherit}pre,code{font-family:Monaco,monospace}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:400}h1{font-size:1.8333em}h2{font-size:1.6667em}h3{font-size:1.5em}h4{font-size:1.3333em}table{font-size:inherit}caption,th{font-weight:700}a{color:#00f}h1,h2,h3,h4,h5,h6{margin-top:1em}h1,h2,h3,h4,h5,h6,p,pre,blockquote,table,ol,ul,form{margin-bottom:12px}
.content-slider{overflow:hidden;visibility:hidden;position:relative}.slider-wrapper{overflow:hidden;position:relative}.slider-wrapper>*{float:left;width:100%;position:relative}.slider-control{height:30px;position:relative}.slider-control a,.slider-control .slider-menu{position:absolute;top:9px;display:inline-block}.slider-control .slider-prev{left:0}.slider-control .slider-next{right:0}.slider-control .slider-menu{top:0;width:50%;left:50%;margin-left:-25%;font-size:27px;text-align:center}.slider-control .slider-menu b{color:#bbb;cursor:pointer}.slider-control .slider-menu b.active{color:#666}
/* KUN Visual Stylesheet
   ========================================================================== */

  @keyframes fadeInUp {
    from {
      opacity: 0;
      transform: translate3d(0, 15%, 0);
    }
  
    to {
      opacity: 1;
      transform: translate3d(0, 0, 0);
    }
  }
  
  .fadeInUp {
    animation-name: fadeInUp;
  }

@keyframes fadeInLeft {
   from {
      opacity: 0;
      transform: translateX(-60px);
   }
   to {
      opacity: 1;
      transform: translateX(0);
   }
} 



/* nunito-sans-300 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Nunito Sans';
  font-style: normal;
  font-weight: 300;
  src: url('../../files/fonts/nunito-sans-v15-latin-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* nunito-sans-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Nunito Sans';
  font-style: normal;
  font-weight: 400;
  src: url('../../files/fonts/nunito-sans-v15-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* nunito-sans-500 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Nunito Sans';
  font-style: normal;
  font-weight: 500;
  src: url('../../files/fonts/nunito-sans-v15-latin-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* nunito-sans-600 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Nunito Sans';
  font-style: normal;
  font-weight: 600;
  src: url('../../files/fonts/nunito-sans-v15-latin-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* nunito-sans-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Nunito Sans';
  font-style: normal;
  font-weight: 700;
  src: url('../../files/fonts/nunito-sans-v15-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* nunito-sans-800 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Nunito Sans';
  font-style: normal;
  font-weight: 800;
  src: url('../../files/fonts/nunito-sans-v15-latin-800.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

* {
  box-sizing: inherit;
}

html {
  font-size: 62.5%;
  height: 100%;
  box-sizing: border-box;
}



body {
	font-family: 'Nunito Sans', sans-serif;
  font-style: normal;
  font-weight: 500;
	color:#000;
  height: 100%;
}

h1 {
	font-family: 'Nunito Sans', sans-serif;
  font-style: normal;
  font-weight: 600;
  text-decoration: none;
}

h2 {
  font-weight: 600;
  text-decoration: none;
  font-size: 2.8rem;
  line-height: 1.4em;
}

h3 {
  font-size:2.4rem;
  color: #E10017;
  font-weight:600;
  margin-top:1.2rem;
}


a {
	font-family: 'Nunito Sans', sans-serif;
  font-style: normal;
  font-weight: 500;
  text-decoration: none;
  color: #77182C;
}


p {
	font-family: 'Nunito Sans', sans-serif;
  font-style: normal;
  font-weight: 300;
  text-decoration: none;
}

figcaption {
  line-height: 2em;
  text-align: center;
}

#wrapper {
  min-height: 100%;
  display: grid;
  grid-template-rows: auto 1fr auto;
}


/*Colors*/

.dark_red {
  color: #77182C;
}

.clear_red {
  color: #E10017;
}

.bright_yellow {
  color:#EAD800;
}

/*Header*/

#header .inside {
  display: grid;
  grid-template-columns: 1fr 5fr;
  max-width: 1400px;
  padding-left:5rem;
  padding-right:5rem;
  margin-left: auto;
  margin-right: auto;
  padding-top:2.4rem;
  padding-bottom:2.4rem;
  margin-bottom:6rem;
}

.home #header .inside {
  margin-bottom:0px;
}


.main_navigation {
  text-align: right;
  font-size: 2rem;
  font-weight: 600;
  align-self: end;
}

#header .inside .block {
overflow: visible;
}

.main_navigation a {
  color:#000;
  font-weight: 600;
}

.main_navigation ul {
  margin-bottom: 0px;
}

.main_navigation ul li{
  display: inline;
  margin-left:2.4rem;
}

.main_navigation ul li .active{
  color: #E10017;
}

.main_navigation strong {
  font-weight: 600;
}

/* Intro */

.intro {
  background-color: #77182C;
}


.intro_name {
  max-width: 1400px;
  padding-left:5rem;
  padding-right:5rem;
  margin-left: auto;
  margin-right: auto;
  color:#EAD800;
  text-align:right;
  font-size: 2.6rem;
  margin-top: 18rem;
  letter-spacing: .03em;
}

.intro_big {
  max-width: 1400px;
  padding-left:5rem;
  padding-right:5rem;
  margin-left: auto;
  margin-right: auto;
  color:#E10017;
  text-align:right;
  font-size: 6rem;
  line-height:1.3em;
  margin-bottom:9rem;
}

.intro_big p {
  font-weight:600;
}

/* About Home */

.about {
  max-width: 1400px;
  padding-left:5rem;
  padding-right:5rem;
  margin-left: auto;
  margin-right: auto;
  padding-top:2.4rem;
  padding-bottom:6rem;
}


.big_text p {
  max-width: 900px;
  font-size:3.2rem;
  font-weight: 500;
  line-height: 1.4em;
}



/* Portfolio / Cases */

.portfolio {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-gap:3.6rem;
  max-width: 1400px;
  padding-left:5rem;
  padding-right:5rem;
  margin-left: auto;
  margin-right: auto;
  padding-top:4rem;
  margin-bottom: 2rem;
}

.portfolio_slider {
  min-width: 100%;
}


.portfolio h1 {
  grid-column: 1 / 3;
  text-align:center
}

.portfolio .content-text {
  font-size:1.8rem;
  line-height: 1.4em;
}


.portfolio_image img{
  width: 100%;
  padding: 2.4rem;
  background-color: #f3f3f3;
}

.slider_wrapper {
  grid-column: 2 / 3;
}

.swiper-button-next,
.swiper-button-prev {
  padding: 8px 16px;
  background-color: transparent;
  border: none;
  color: #fff;
}
.swiper-pagination-bullet{
  background-color: #fff;
}

:root {
  --swiper-navigation-size: 30px;
}

/* About */

.simple_page {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-gap:3.6rem;
  max-width: 1400px;
  padding-left:5rem;
  padding-right:5rem;
  margin-left: auto;
  margin-right: auto;
  padding-bottom:1.2rem;
}

.simple_page .content-text{
  font-size:1.8rem;
  line-height: 1.4em;
}

.simple_page .content-image {
  padding: 4rem;
  background-color: #F5F3F8;
  margin-bottom: 6rem;
}


/* Kontakt */


.kontakt h1 {
  color:#EAD800;
  grid-column: 1/3;
}


.kontakt .content-text {
  font-size: 2.4rem;
  padding-top:6rem;
}

.kontakt a {
  color: #E10017;
}






/* footer */

#footer .inside{
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  max-width: 1400px;
  padding-left:5rem;
  padding-right:5rem;
  margin-left: auto;
  margin-right: auto;
  padding-top:4.8rem;
  padding-bottom:4.8rem;
  font-size: 1.2em;
}

#footer .inside a{
  color:#000;
  font-size: 1em;
  font-weight:300;
  line-height: 1.6em;
}

#footer .inside {
  font-size: 1.2em;
  font-weight:300;
  line-height: 1.6em;
}



/* mobile */


@media only screen and (max-width: 1180px) {

  html {
  font-size: 57.5%;
}

  .portfolio h2 {
    margin-top:6px;
  }

  .simple_page {
  grid-template-columns: 2fr 1fr;
  }

}


@media only screen and (max-width: 1020px) {


  .portfolio h2 {
    margin-top:0px;
  }

  .portfolio_image img{
  width: 100%;
  padding: 0px;
  background-color: #f3f3f3;
  }

  .simple_page {
  grid-template-columns: 3fr 1fr;
  }
}

@media only screen and (max-width: 860px) {


.portfolio {
  grid-template-columns: 1fr;
  grid-template-rows: auto auto;
  grid-gap:0rem;
}

.portfolio .content-text {
  grid-row: 1/2;
}

.simple_page {
  display: block;
  grid-template-columns: 1fr 1fr;
}


}

@media only screen and (max-width: 740px) {


  .intro_name {
    margin-top: 9rem;
    text-align: center;
  }  

  .intro_big {
    text-align: center;
    font-size: 5rem;
    margin-bottom: 8rem;
  }

  .big_text p {
  font-size: 2.8rem;
  text-align: center;
  }

  #footer .inside {
  font-size: 1em;
  text-align: center;
  }

}


@media only screen and (max-width: 580px) {
  
  #header .inside {
  padding-left: 3rem;
  padding-right: 3rem;
  }

  .main_navigation {
  font-size: 1.6rem;
  }

  .intro_name {
  margin-top: 9rem;
  padding-left: 3rem;
  padding-right: 3rem;
  font-size:2rem;
  text-align:right;
  }  

  .intro_big {
  font-size: 4rem;
  margin-bottom: 7rem;
  padding-left: 3rem;
  padding-right: 3rem;
  text-align:right;
  }

  .about {
  padding-left: 3rem;
  padding-right: 3rem;
  padding-bottom: 2rem;
  }

  .big_text p {
  font-size: 2.2rem;
  text-align: left;
  }

  .portfolio {
  padding-left: 3rem;
  padding-right: 3rem;
  }

  .simple_page {
  padding-left: 3rem;
  padding-right: 3rem;
  margin-bottom: 6rem;
  }

  .kontakt .content-text {
  padding-top: 3rem;
  text-align: center;
  }


   #footer .inside {
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 1fr 1fr;
  padding-left: 3rem;
  padding-right: 3rem;
  padding-top:0rem;
  text-align: left;
}

  .home #footer .inside .contact {
  grid-column: 1/3;
  grid-row: 1/2;
  margin-bottom:6rem;
  font-size:2rem;
  }

  .home #footer .inside .contact a{
  font-weight: 500;
  }

  .home #footer .inside .info {
  grid-column: 1/2;
  grid-row: 2/3;
  }

  .home #footer .inside .info_links {
  grid-column: 2/3;
  grid-row: 2/3;
  }






}


@media screen and (min-width: 501px) {

 .mobile_menu {
  display:none;
 }

}


@media screen and (max-width: 500px) {

  #wrapper {
    display: block;
    overflow-x: hidden; 
}

  #header .inside {
  display: block;
  }

  .home_link {
  max-width: 80px;
  }

 .main_navigation {
  display: none;
  }
  
  #menuToggle
  {
  display: block;
  position: absolute;
  top: 3.4rem;
  right: 3rem;
  
  z-index: 1;
  
  -webkit-user-select: none;
  user-select: none;
  }
  
  #menuToggle input
  {
  display: block;
  width: 40px;
  height: 32px;
  position: absolute;
  top: -7px;
  left: -5px;
  
  cursor: pointer;
  
  opacity: 0; /* hide this */
  z-index: 2; /* and place it over the hamburger */
  
  -webkit-touch-callout: none;
  }
  
  /*
  * Just a quick hamburger
  */
  #menuToggle span
  {
  display: block;
  width: 33px;
  height: 4px;
  margin-bottom: 5px;
  position: relative;
  
  background: #E10017;
  border-radius: 3px;
  
  z-index: 1;
  
  transform-origin: 4px 0px;
  
  transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
              background 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
              opacity 0.55s ease;
  }
  
  #menuToggle span:first-child
  {
  transform-origin: 0% 0%;
  }
  
  #menuToggle span:nth-last-child(2)
  {
  transform-origin: 0% 100%;
  }
  
  /* 
  * Transform all the slices of hamburger
  * into a crossmark.
  */
  #menuToggle input:checked ~ span
  {
  opacity: 1;
  transform: rotate(45deg) translate(-2px, -1px);
  background: #E10017;
  }
  
  /*
  * But let's hide the middle one.
  */
  #menuToggle input:checked ~ span:nth-last-child(3)
  {
  opacity: 0;
  transform: rotate(0deg) scale(0.2, 0.2);
  }
  
  /*
  * Ohyeah and the last one should go the other direction
  */
  #menuToggle input:checked ~ span:nth-last-child(2)
  {
  opacity: 1;
  transform: rotate(-45deg) translate(0, -1px);
  }
  
  /*
  * Make this absolute positioned
  * at the top left of the screen
  */
  #menu
  {
  position: absolute;
  width: 500px;
  margin: -100px 0 0 0;
  padding: 50px;
  padding-top: 125px;
  right: -100px;
  
  background: #F5F5F3;
  list-style-type: none;
  -webkit-font-smoothing: antialiased;
  /* to stop flickering of text in safari */
  
  transform-origin: 0% 0%;
  transform: translate(100%, 0);
  
  transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0);
  }
  
  #menu li
  {
  padding: 10px 0;
  font-size: 22px;
  text-align: right;
  padding-right: 60px;
  }
  
  /*
  * And let's fade it in from the left
  */
  #menuToggle input:checked ~ ul
  {
  transform: scale(1.0, 1.0);
  opacity: 1;
  }
  
}