.menubar{
  position:fixed;
  /* width:100%; */
  left: -290px;
  top: 80px;
  color:white;
  text-align:right;
}

.menubar ul{
  font:300 20px 'Roboto', sans-serif;
  /* position:absolute; */
  /* bottom:0; */
  /* right:0; */
  left: 0px;
  top: 0px;
  list-style:none;
}

.menubar ul li a{
  display: block;
  border:2px solid white;
  padding:7px 14px;
  margin:20px 15px;
  text-align: left;
  color:white;
  text-decoration:none;
}

.menubar ul li a:hover{
  background-color:rgba(1,1,1,.2)
}


.opacity{
  opacity:.3;
}

.active{
  transform: rotate(5deg);
}


/* IOS */

a[x-apple-data-detectors]
	{
	color: inherit !important;
	text-decoration: none !important;
	font-size: inherit !important;
	font-family: inherit !important;
	font-weight: inherit !important;
	}

body[x-apple-data-detectors]
	{
	-webkit-appearance: none;
	}

/* IOS */



mylo::after
	{
	content: attr(data-domain);
	}

mylo::before
	{
	content: attr(data-user) "\0040";
	}


a	{
	color: white;
	text-decoration: none;
	}


@-webkit-keyframes uparrow {
	0% { -webkit-transform: translateY(0); opacity: 0.4 }
	100% { -webkit-transform: translateY(-0.4em); opacity: 0.9 }
	}
@-webkit-keyframes downarrow {
	0% { -webkit-transform: translateY(0); opacity: 0.4 }
	100% { -webkit-transform: translateY(0.4em); opacity: 0.9 }
	}


.arrow {
	border-color:transparent;
	border-style:solid;
	border-width:0px 40px;
	display:block;
	height:0;
	/* margin:0 auto -20px; */
	opacity:0.4;
	text-indent:-9999px;
	transform-origin: 50%;
	width:0;
	cursor:auto;
	top: -26px;
	position: relative;
	}
.up {
	-webkit-animation: uparrow 0.6s infinite alternate ease-in-out;
	border-bottom:2em solid #00aaa5;
	}
.down {
	-webkit-animation: downarrow 0.6s infinite alternate ease-in-out;
	border-top: 25px solid #f7fd13;
	}


.downscrollTop {
	-webkit-animation: downarrow 0.6s infinite alternate ease-in-out;
	/* border-top:25px solid #ff5b00; */
	}

.scrollTop
	{
	position: fixed;
	width: 60px;
	height: 60px;
	right: 2rem;
	bottom: 2rem;
	cursor: pointer;
	z-index: 10;
	}

.scrollTop:hover
	{
	bottom: 2.1rem;
	}

.scrollTop i:hover
	{color: #000;box-shadow: 0px 2px 0px 0px #000000, 0px 4px 0px 0px #ffffff;background-color: #f7fd13;}
 
.scrollTop i
	{
	width: 50px;
	height: 50px;
	display: block;
	color: #fff;
	text-align: center;
	line-height: 50px;
	font-size: 2rem;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	-ms-border-radius: 5px;
	/* border-radius: 5px; */
	position: absolute;
	left: 15px;
	top: -6px;
	background-color: black;
	box-shadow: 0px 2px 0px 0px #000000, 0px 4px 0px 0px #ffffff5c;
	}


.icon {
	width: 50px;
	height: 50px;
	position: relative;
	top: -16px;
	float: left;
	margin: 4px 10px 2px 0px;
}


body {
  margin: 0px;
  background: #0a0a0a;
  padding: 0px;
  font-family: 'Roboto Condensed', sans-serif;
  font-size: 19px;
  cursor: default;
}

/* Pre made classes */
.light {
  color: white;
}

.hard {
  color: white;
  font-family: 'Montserrat', sans-serif;
  font-weight: 900;
}

.hard:hover {
  color: #f7fd13;
  box-shadow: 0px 2px 0px 0px #000000, 0px 4px 0px 0px #ffffff5c;
  border-radius: 5px;
}


p {

}

.section {
  height: 100%;
  width: 100%;
  position: relative;
}

a.flat {
  color: white;
  border: solid 2px white;
  padding: 10px 20px;
  text-decoration: none;
  transition: all 0.2s ease;
}
a.flat:hover {
  color: black;
  background: white;
  transition: all 0.2s ease;
}

.heading-styled {
  margin: 0px 0px 0px -3px;
  font-size: 5em;
  color: #ead31f;
  font-weight: bold;
}

blockquote {
  color: #c5c5c5;
  padding: 15px 10px;
  position: relative;
}
blockquote:before {
  content: "";
  height: 2px;
  width: 37px;
  background: #ffffff29;
  left: -39px;
  top: 20px;
  position: absolute;
  font-size: 22px;
}

blockquote span {
	color: black;
	background: #f7fd13;
	font-weight: bold;
	font-size: 0.9em;
}

.image {
  width: 100%;
}

.image img {
  height: 330px;
}

.section {
  position: relative;
}

.section.fh {
  height: 100vh;
}

.content {
  max-width: 800px;
  position: relative;
}

.content.f-width {
  width: 100%;
}

.content.padded {
  padding-bottom: 2em;
  /* padding-top: 4em; */
}

.w-center {
  margin: auto;
}

.headline {
  font-size: 4em;
  color: white;
  position: relative;
  font-family: 'Roboto Condensed', sans-serif;
  font-weight: 900;
}
.headline:before {
  content: '';
  width: 200px;
  background: #f7fd13;
  height: 3px;
  left: -30%;
  top: 50px;
  position: absolute;
}

.mainMenu {
  display: flex;
  position: absolute;
  top: 30px;
  width: 100%;
  z-index: 1;
  transition: -webkit-transform 0.5s;
  transition: transform 0.5s;
  transition: transform 0.5s, -webkit-transform 0.5s;
}

.leftSide {
  position: absolute;
  left: 50px;
}

.leftSide .logo {
  color: white;
  height: 198px;
  width: 604px;
  margin: auto;
  text-decoration: none;
  display: block;
  /* border: 1px solid white; */
  /* border-radius: 100px; */
  /* align-items: center; */
  /* justify-content: center; */
  /* margin-bottom: 40px; */
  background-image: url(../img/logo_curv_full.svg);
}

.rightSide {
  right: 80px;
  position: absolute;
  top: 18px;
}
.rightSide a {
  text-decoration: none;
  font-size: 18px;
  color: #ffffff;
  transition: 0.3s;
  margin-right: 15px;
  background-color: #00000075;
  padding: 10px;
  border-radius: 7px;
  box-shadow: 0px 2px 0px 0px #000000, 0px 4px 0px 0px #ffffff5c;
}
.rightSide a:hover {
  color: #000000;
  box-shadow: 0px 2px 0px 0px #000000, 0px 4px 0px 0px #ffffff;
  background-color: #f7fd13;
}

#main {
  transition: margin-left .5s;
}

.section-1 {
  background: url("../img/main_img.png");
  background-size: cover;
  background-position: bottom center;
  box-shadow: inset 0px 0px 0px 1000px #0a0a0a4a;
}
.section-1 .content {
  position: relative;
  /* bottom: 15vh; */
  padding: 60px 120px;
  /* top: 111px; */
  bottom: -18%;
}
.section-1 p {
  margin-bottom: 40px;
  /* box-shadow: 3px -5px 20px 0px black; */
  /* color: white; */
  background-color: #00000082;
  padding: 7px;
  border-radius: 7px;
}

.section-spacer {
  height: 300px;
  background-size: contain;
  background-repeat: repeat-x;
  background-position: center center;
  background-image: url('../img/otbivka1.png');
}

.section-spacer2 {
  height: 300px;
  background-size: contain;
  background-repeat: repeat-x;
  background-position: center center;
  background-image: url('../img/otbivka2.png');
}

.section-spacer3 {
  height: 300px;
  background-size: contain;
  background-repeat: repeat-x;
  background-position: center center;
  background-image: url('../img/otbivka3.png');
}

.section-4 {
  height: initial;
}

.newsletter {
  background: #f7fd13;
  overflow: hidden;
  place-items: center;
  display: grid;
  padding: 10px 0px;
  grid-template-columns: 55% 45%;
}
.newsletter form {
  grid-template-columns: 70% 30%;
  display: grid;
}
.newsletter form .field-email input {
  border: 1px solid white;
  padding: 10px 40px 10px 10px;
}
.newsletter form .field-submit input {
  padding: 10px 20px;
  border: 1px solid #000000;
  color: #ffffff;
  background: #000000;
}

.footer {
  display: flex;
  justify-content: center;
  text-align: center;
  padding: 20px 0px;
  background: black;
  position: relative;
}
.footer a {
  color: #f7fd13;
  text-decoration: none;
}

/* Custom Scrollbar */
::-webkit-scrollbar {
  width: 12px;
}

::-webkit-scrollbar-track {
  background: #0a0a0a;
}

::-webkit-scrollbar-thumb {
  background: #f7fd13;
}

::-webkit-scrollbar-thumb:hover {
  background: black;
}

/* Custom Scrollbar */
@media screen and (max-width: 760px) {
  .mainMenu {
    /* position: initial; */
    height: 40px;
    padding: 20px 0px;
  }
  .mainMenu .leftSide {
    left: 30px;
    top: 25px;
  }
  .mainMenu .leftSide .logo {
  background-image: url(../img/logo_curv_krosme.svg);
    height: 45px;
  width: 45px;
  }
  .mainMenu .rightSide {
    right: 10px;
    top: 30px;
  }

  .section-1 .content {
    max-width: 85%;
    padding: 20px 40px;
  }

  .video iframe {
    width: 100%;
  }

  html {
    overflow-x: hidden;
  }

  .content {
    width: 90%;
  }

  .newsletter {
    grid-template-columns: auto;
  }

  .section .content .headline:before {
    display: none;
  }

  #scrolling ul li {
    width: 500px;
  }
}

@media screen and (max-width: 600px) {
  .mainMenu {
    /* position: initial; */
    /* height: 48px; */
    padding: 20px 0px;
  }
  .mainMenu .leftSide {
    /* left: 30px; */
    /* top: 25px; */
    display: none;
  }
  .mainMenu .leftSide .logo {
  background-image: url(../img/logo_curv_krosme.svg);
    height: 45px;
  width: 45px;
  }
  .mainMenu .rightSide {
    /* right: 12%; */
    /* left: 4%; */
    top: 4px;
    /* line-height: 55px; */
    display: grid;
    width: 91%;
    position: initial;
    margin: 0 auto;
  }

.section-1 .content {
    position: relative;
    /* bottom: 15vh; */
    padding: 0;
    /* top: 111px; */
    bottom: -41%;
    margin: 0 auto;
 }


.rightSide a {
    /* text-decoration: none; */
    /* font-size: 18px; */
    /* color: #ffffff; */
    /* transition: 0.3s; */
    margin-right: 0;
    background-color: #00000075;
    /* padding: 10px; */
    /* border-radius: 7px; */
    /* box-shadow: 0px 2px 0px 0px #000000, 0px 4px 0px 0px #ffffff5c; */
 }



.menubar {display:none;}

}


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

blockquote {
    /* color: #c5c5c5; */
    padding: 15px 0px;
    /* position: relative; */
    margin: 0;
 }


.headline {
    font-size: 2em;
    /* color: white; */
    /* position: relative; */
    /* font-family: 'Roboto Condensed', sans-serif; */
    /* font-weight: 900; */
 }


.icon {
    /* width: 50px; */
    /* height: 50px; */
    /* position: relative; */
    top: 4px;
    /* float: left; */
    /* margin: 4px 10px 2px 0px; */
	}


.content.padded {
    padding-bottom: 0;
    padding-top: 0;
	}

.section-spacer, .section-spacer2, .section-spacer3, .section-spacer4, .section-spacer5 {
    height: 100px;
 }


}


@media screen and (max-height: 700px) {

.section-1 .content {
    position: relative;
    /* bottom: 15vh; */
    padding: 0;
    top: 222px;
    bottom: 0;
    margin: 0 auto;
}

.section.fh {
    height: 100%;
    bottom: 0;
    position: relative;
    margin-bottom: 222px;
}

}