html{
  scroll-behavior: smooth;
  scroll-padding-top:50px;
}

body{
  font-family: 'Open Sans', sans-serif;
}

/*Navbar*/

nav{
  background-color:#221726;
  font-size: large;
}

.navbar-brand{
  font-size:25px;
}

#navbar-right{
  display: flex;
  justify-content: flex-end;
  margin-left:20px;
}

.d-inline-block{
  height:28px;
  width:auto;
  margin:7px;
}

#logo-217{
  height:50px;
  margin:-7px;
  margin-right:0px;
}

#main-text-header{
  color:white;
  font-size: 23px;
  text-align: center;
}

/*Carousel*/

.carousel-inner{
  height:400px;
  width: 100%;
  margin-top:50px;
}

.carousel-item {
  height:400px;
}

.carousel-img{
    object-fit:cover;
    top: 0;
    left: 0;
    min-height: 400px;
}

/*Rólunk*/

#rólunk{
  display: flex;
  justify-content: center;
  height:auto;
  margin-bottom:10px;
}

h2{
  margin-top:20px;
  text-align: center;
  font-family: 'Lilita One', cursive;
  font-size: 40px;
}

.box-orange{
  background-color: #F29F05;
  margin-top:10px;
  height:auto;
}

#box-b-rólunk{
  display:flex;
  justify-content: space-around;
  flex-wrap: wrap;
  margin-top:30px;
}

.boxes-big{
  display:flex;
  flex-direction: column;
  align-items: center;
  margin-bottom:40px;
  width:350px;
}

.box-s{
  background-color:#221726;
  height: 40px;
  width:auto;
  padding:22px;
  color:white;
  font-weight:bold;
  display:flex;
  justify-content: center;
  align-items: center;
  border-radius:6px;
  margin-bottom:10px;
}

.box-b{
  background-color:white;
  height: auto;
  padding:30px;
  padding-bottom:20px;
  text-align: justify;
  box-shadow: 10px 10px #221726;
}

.btn{
  background:#221726;
  color:white;
}

.text-link{
  color:#F2B705;
}

#csapatunk-img{
  height:50px;
  display: block;
  margin:auto;
}

/*Programok*/

#programjaink{
  background: #F2B705;
  height:auto;
  padding-top:15px;
}

.boxes-big-programs{
  margin-top: 60px;
}

h4{
  text-align: center;
}

.card{
  width: 250px;
  border:0px;
  margin:10px;
  box-shadow: 7px 7px #221726;
}

.card-img-top{
  height:188px;
}

.card-title{
  font-weight: bold;
}

#calendar{
  height:400px;
  margin:20px;
  box-shadow: 10px 10px #221726;
  width:auto;
  align-items: center;
}

#box-prog-upper{
  display: flex;
  justify-content: space-around;
}

.box-bp-left{
  display:flex;
  justify-content: space-around;
  flex-wrap: wrap;
  padding:20px;
}

/*Gyakori kérdések*/

#gyakori-kérdések{
  display: flex;
  justify-content: center;
  align-items: center;
  height:auto;
  margin-bottom:10px;
}

.accordion{
  margin-top:20px;
  margin-bottom:30px;
  width:100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items:center;
}

.coll{
  margin-bottom:5px;
  width:75%;
}

.coll-header{
  color:#221726;
  width:100%;
}

.coll-body{
  background:white;
  border-bottom-left-radius:6px;
  border-bottom-right-radius: 6px;
  padding:20px;
  text-align: justify;
}

#coll-btn{
  width:100%;
  text-align: left;
  font-size:17px;
  border-top-left-radius:6px;
  border-top-right-radius: 6px;
  border-bottom-left-radius:0px;
  border-bottom-right-radius:0px;
}

.btn:hover{
  background:#221726;
  color:#F29F05;
  text-decoration: none;
}

/*Kapcsolat*/

#kapcsolat{
  background: #F2B705;
  height:auto;
  padding-top:15px;
}

#bubbles-box{
  display:flex;
  justify-content: space-around;
  padding-top:40px;
  padding-bottom:40px;
  flex-wrap: wrap;
}

.kapcsolat-link{
  background:#221726;
  border-radius: 200px;
  height:200px;
  width:200px;
  display:flex;
  flex-direction: column;
  align-items:center;
  justify-content: center;
  text-align: center;
  margin:10px;
}

.kapcsolat-link:hover{
  text-decoration: none;
}

.bubble-img{
  height:70px;
  width:70px;
  padding-bottom:5px;
}

.bubble-text{
  color:white;
  text-emphasis: 2px;
  font-size:20px;
}

/*Banners*/

.card-details{
  width: 50vw;
  background: white;
  box-shadow: 4px 4px 4px 4px rgb(0,0,0,.4);
  position: fixed;
  top: 100px;
  left: 25vw;
  bottom: 50px;
  margin: 0 auto 0 auto;
  display: none;
  overflow-y: scroll;
  z-index: 4;
}

.overlaynav{
  width: 50vw;
  height: 50px;
  background: #221726;
  position: fixed;
}

@media (orientation: portrait) {
  
  .card-details{
    width: 90vw;
    left: 5vw;
  }

  .overlaynav{
    width: 90vw;
  }
}

.close{
  position: relative;
  top: 0;
  left: 0;
  font-size: 50px;
  float: right;
  color: white;
  opacity: 1;
}

.close:hover{
  color:#F29F05;
}

.banner1{
  width: 100%;
  height: 6vh;
  margin-bottom: 20px;
}

.overlayBody{
  padding: 15px;
}

.overlayImg{
  width: 75%;
  display: block;
  margin:auto;
  margin-top: 20px;
  margin-bottom:20px;
  box-shadow: 10px 10px #221726;
}

.card-details-title{
  font-weight:bold;
  text-align:center;
}

.card-details-box{
  margin:15px;
  padding:20px;
  text-align:justify;
  border:2px dashed #221726;
  border-radius:6px;
}

.tudnivalók-title{
  text-align:center;
  font-weight: bold;
  margin-bottom:10px;
  margin-top:-35px;
  background: white;
  width:145px;
}

.élménybeszámoló-title{
  text-align:center;
  font-weight: bold;
  margin-bottom:10px;
  margin-top:-35px;
  background: white;
  width:220px;
}

/*Footer*/

footer{
  background: #221726;
  color:white;
  margin:0px;
  height:50px;
  width:100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

#copyright{
  margin-left:20px;
  margin-bottom:0px;
  text-align: center;
}