/*Google font import*/
@import url('https://fonts.googleapis.com/css2?family=Jost:ital,wght@0,100..900;1,100..900&display=swap');
html,body{
  font-family: 'Jost'; 
  min-height: 100%;
  height: 100%;
  margin: 0; 
  padding: 0;
}

::-moz-selection {
  background: #343434;
  text-shadow: none;
}

::selection {
  background: #343434;
  text-shadow: none;
}

body{
  background-image: url("../images/background.jpg");
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}
a{
  text-decoration: none;
  color: #19bc7c;
  font-weight: bold;
}

/*fejléc*/
header{
  display: block; 
  width: 100%; 
  top: 0; 
  left: 0; 
  z-index: 10; 
  text-align: center;
  background-color: #fff;
}

/*body*/
main{
  display: block; 
  width: 100%;
  height: 100%;
}
main section{  
  display: -webkit-box;
  display: -moz-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 0;
  -ms-flex: 0 1 auto;
  flex: 0 1 auto;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  position: relative;
  width: 100%;
  height: 100%;
  justify-content: center;
  align-items: center;
}

main section:after{
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(52,52,52,0.8);
}

main .text{
  display: block; 
  position: relative; 
  width: 90%; 
  max-width: 800px; 
  padding: 2rem 0;
  margin: 0 auto; 
  z-index: 10; 
  text-align: center;
  color: white; 
}

.text h1{
  display: block; 
  width: 100%; 
  font-size: 3rem; 
  line-height: 1.2; 
  font-weight: 500; 
  margin-top: 0;
  margin-bottom: 2rem;
}
.text h1 span{
  color: #f8414b;
}
.text h2{
  display: block; 
  width: 100%; 
  font-size: 1.2rem; 
  font-weight: 400;
  line-height: 1.2; 
  text-transform: uppercase;
}

.mainTitle, .subTitle{
  position: relative;
}

@media only screen and (min-width: 767px)  {
  .text h1{ font-size: 4rem;}
  .text h2{ font-size: 1.8rem;}
  .mainTitle{padding-top: 3rem;}
  .subTitle{padding-bottom: 2rem;}
  .mainTitle:after{
    content: "";
    position: absolute;
    right: 0;
    top: 0;
    width: 60px;
    height: 60px;
    background-image: url("../images/plus-icon.svg");
    background-repeat: no-repeat;
    background-size: 60px 60px;
    background-position: center center;
  }
  
  .subTitle:after{
    content: "";
    position: absolute;
    left: -1rem;
    bottom: 0;
    width: 30px;
    height: 30px;
    border-left: 2px solid #f8414b;
    border-bottom: 2px solid #f8414b;
  }
}
@media only screen and (min-width: 900px)  {

}