body {
  line-height: 1.8;
  color: #000;
}
body, p, h1, h2, h3, li, a, label, div, span{
  font-family: Fieldwork Geo !important; 
  font-style: normal; 
  font-weight: lighter;
  color: #2D323C;
}
p {font-size: 16px;}
.margin {margin-bottom: 45px;}

.container-fluid {
  padding-top: 70px;
  padding-bottom: 70px;
}
.container-fluid p{margin-top: 40px;}

.container{width: 1600px;}
.navbar-default{background: 0;}
.navbar {
  padding-top: 0px;
  padding-bottom: 35px;
  border: 0;
  border-radius: 0;
  font-size: 12px;
  letter-spacing: 5px;
  background: #fff;
  z-index: 111;
  border-bottom: 1px solid #AC7A4D;
  margin-bottom: 0;
  }
.navbar-container{width: 1600px; margin: 0 auto;}
.navbar-nav  li{padding-top: 75px; padding-bottom: 20px; margin-left: 6px}
.navbar-nav  li:hover{color:#fff}
.navbar-nav  li a{font-size: 22px; color:#000 !important; letter-spacing: 1.2px;}
.navbar-nav  .active{background: #AC7A4D; color: #fff !important}
.navbar-nav  .active a{background: #AC7A4D !important; color: #fff !important}
.navbar-nav  li:hover {background: #AC7A4D; }
.navbar-nav  li a:hover {color: #fff !important}
.logo{height:80px; width:auto; margin-top: 30px;}

.lang-item{width: 22px; height: 15px; margin-bottom: 20px}
.lang-item:hover{background: none !important}



.bg-1{background-image: url("img/borospohar-2.png"); width:100%; height:1081px;}
.bg-1 .text-left{padding: 100px 200px 0 80px}
.bg-1 h1{font-family: Trajan Pro !important; font-style: normal; font-weight: 700; font-size: 60px; color: #2D323C}
.bg-1 h3{font-size: 30px; text-align:left}
.bg-1 .text-left h2{padding-right: 120px}
.bg-1 .btn-danger{background: #AB0625; color: #fff}
.bg-1 .btn{margin-top: 70px; font-size: 31px; font-family: Avenir Next LT Pro !important; font-style: normal; font-weight: bold; border-radius: 50px; padding: 20px 100px} 
.bg-1 .text-right{padding: 555px 80px 0 340px;}

.bg-2 h2{color: rgba(172,122,77,1); font-size: 66px;}
.bg-2 .col-sm-3{
  -webkit-box-shadow: 0px 0px 5px 0px rgb(200 200 200 / 75%);
  -moz-box-shadow: 0px 0px 5px 0px rgba(200, 200, 200, 0.75);
  box-shadow: 0px 0px 5px 0px rgb(200 200 200 / 75%);
  margin: 20px 100px;
  width: 23%;
  padding-bottom: 52px;
  height: 416px;
}
.bg-2 .col-sm-3:first-child{margin-left:0;}
.bg-2 .col-sm-3:last-child{margin-right:0;}
.bg-2 img{height: 190px; width: auto; margin: 62px 0;}
.bg-2 h3{font-size: 45px}
.bg-2 .btn{color: #2D323C}

.bg-3{background-color: rgba(172,122,77,1); padding:0; scroll-margin-top: 180px;}
.bg-3 .col-sm-6:first-child{padding:0 !important}
.bg-3 .col-sm-6:last-child{padding: 50px}
.bg-3 h2{color: #fff; font-size: 66px; margin-bottom: 45px;}
.bg-3 p{color: #fff; font-size: 35px; margin: 30px 0;}


.bg-4{scroll-margin-top: 180px; padding-top:40px}
.bg-4 .barnacim{font-size: 60px; color: rgba(172,122,77,1);}
.bg-4 h2{font-size: 44px; margin: 40px 120px 60px 120px; }
/* .bg-4 .col-sm-2{border: 1px solid rgba(172,171,171,1); width: 16%; min-height: 619px; margin: 6px; padding: 10px 0 20px 0} Chardonnay-al */
/*.bg-4 .col-sm-2{border: 1px solid rgba(172,171,171,1); width: 19.3%; min-height: 619px; margin: 6px; padding: 10px 0 20px 0}*/
.bg-4 .col-sm-2{border: 1px solid rgba(172,171,171,1); width: 23%; min-height: 619px; margin: 20px 10px; padding: 10px 0 20px 0}
.bg-4 .col-sm-2 img{max-height: 642px;}
.bg-4 h3{text-transform: uppercase; font-size: 29px; padding: 0 10px; min-height: 45px}
.bg-4 h4{color: rgba(172,122,77,1); font-size: 26px; margin-bottom: 25px}
.bg-4 .btn{border: 1px solid rgba(172,171,171,1); border-radius: 20px}

.bg-5{padding: 20px 0 0 0; scroll-margin-top: 180px;}
.bg-5 h2{font-size: 72px; color: rgba(172,122,77,1); margin-bottom: 60px; scroll-margin-top: 180px;}
.bg-5 .col-sm-3{padding-left:0; padding-right:1px}

.bg-6{background-image: url("img/Mask_Group_20.png"); height: 873px; margin-top: 0px; scroll-margin-top: 180px;}
.bg-6 h2{font-size: 66px; color: yellow; margin-top: 100px; margin-bottom: 60px}
.bg-6 h3{font-size: 46px; color: yellow; margin-top: 20px}
.bg-6 p{font-size: 24px; color: #fff; margin-top: 20px}
.bg-6 .y{color:yellow}
.bg-6 p a{color: #fff !important}
.bg-6 p a:hover,
.bg-6 p a:active{color: #fff !important}

.bg-8{background-color: rgba(172,122,77,1); padding:0; scroll-margin-top: 180px;}
.bg-8 .col-sm-6:first-child{padding:0 !important}
.bg-8 .col-sm-6:last-child{padding: 80px}
.bg-8 h2{color: #fff; font-size: 60px; margin-bottom: 20px;}
.bg-8 p{color: #000; font-size: 28px}
.bg-8 p a{color: #fff}
.bg-8 p a:hover{color: #AB0625; text-decoration: none;}
.bg-9 .kepeslap{max-width: 800px; margin: 0 auto;}

.awards{margin: 0 auto; max-width: 800px;}
.awards img{border: 1px solid #c6a44e;}

.modal-dialog{width: 800px;}
.modal-header{border:none;}
.modal-footer{border:none}
.modal-body{padding:0}
.modal .bal{padding:0;}
.modal .bal img{height: 700px; margin-bottom: 40px }
.modal .jobb{padding-right: 40px; margin-left: -60px; padding-bottom: 30px}
.modal .jobb .borcim{background: rgba(172,122,77,1); padding: 5px 20px; margin-top: 80px; margin-bottom: 50px}
.modal .jobb .borcim h5{color: #fff; text-transform: uppercase; font-family: Trajan Pro !important;}
.modal .jobb .borcim h3{color: #fff; text-transform: uppercase; margin-top: 0; font-family: Trajan Pro !important;}
.modal .jobb h4{margin: 10px 20px; font-size: 20px; font-weight: bold;}
.modal .jobb h4 span{color: rgba(172,122,77,1)}
.modal .jobb p{margin: 40px 20px} 
.modal .arsav{ font-size: 24px; margin-bottom: 20px}
.modal .arsav img{width: 60px; margin-right: 45px;}
.modal .arsav6{ font-size: 24px; margin-bottom: 20px}
.modal .arsav6 img{width:100px}
.modal .ar {border-bottom: 2px solid rgba(172,122,77,1); padding: 20px 50px 10px 50px; font-family: Trajan Pro !important; font-size: 22px;}
.modal .order{border: 1px solid rgba(172,122,77,1); margin: 0px auto 40px auto; width: 70%; color: #fff; padding:10px 20px; text-align:center}
.modal .order h4{margin: 10px 5px; color: rgba(172,122,77,1); margin-bottom: 20px}
.modal .order p{margin: 5px;}
.modal .order a:hover{text-decoration: none; color:#AB0625}

.close{font-size: 25px}

/* The sticky class is added to the header with JS when it reaches its scroll position */
.sticky {
  position: fixed;
  top: 0;
  width: 100%
}


/* Rolunk oldal */
#rolunk .btn-danger{background: #AB0625; color: #fff}
#rolunk p{font-size: 26px;}
#rolunk .btn {
  margin: 30px;
  font-size: 20px;
  font-family: Avenir Next LT Pro !important;
  font-style: normal;
  font-weight: bold;
  border-radius: 50px;
  padding: 10px 50px;
}

#kepek{background: #fff; padding: 40px 0}
#kepek .col-sm-3{padding: 0 !important}
#kepek .col-sm-3 img{width:100%; border: 2px solid #fff; height: 100%;
  object-fit: cover;
  width: 285px;
  height: 285px;
  cursor: pointer;}


#kepek .row > .column {padding: 0 8px; }
#kepek .row:after {  content: ""; display: table; clear: both;  }
#kepek .column { float: left;  width: 25%; }
#kepek .modal {
    display: none;
    position: fixed;
    z-index: 1;
    padding-top: 20px;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: black;
	margin-top: 165px;
  }
#kepek .modal-content {
    position: relative;
    background-color: #fefefe;
    margin: auto;
    padding: 0;
    width: 90%;
    max-width: 800px;
  }
#kepek .close {
    color: white;
    position: absolute;
    top: 10px;
    right: 250px;
    font-size: 35px;
    font-weight: bold;
    opacity: 1;
  }
  
#kepek .close:hover,
#kepek .close:focus {
    color: #999;
    text-decoration: none;
    cursor: pointer;
  }
#kepek .mySlides {
    display: none;
  }
#kepek .prev,
#kepek .next {
    cursor: pointer;
    position: absolute;
    top: 420px;
    width: auto;
    padding: 16px;
    margin-top: -50px;
    background: rgb(171,6,37, 0.6);
    color: #fff;
    font-weight: bold;
    font-size: 20px;
    transition: 0.6s ease;
    border-radius: 0 3px 3px 0;
    user-select: none;
    -webkit-user-select: none;
  }

#kepek .next {
    right: 0;
    border-radius: 3px 0 0 3px;
  }
 
#kepek .prev:hover,
#kepek .next:hover {
    background-color: rgb(171,6,37);
    text-decoration: none;
    color: #fff;
  }
  
#kepek .numbertext {
    color: #f2f2f2;
    font-size: 12px;
    padding: 8px 12px;
    position: absolute;
    top: 0;
  }
  
#kepek .caption-container {
    text-align: center;
    background-color: black;
    padding: 2px 16px;
    color: white;
  }
  
#kepek img.demo {
    opacity: 0.6;
  }
  
#kepek .active,
#kepek .demo:hover {
    opacity: 1;
  }
  
#kepek img.hover-shadow {
    transition: 0.3s;
  }
  
#kepek .hover-shadow:hover {
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  }

/* Rolunk oldal vege */

@media only screen and (max-width: 1366px) {
  .navbar-container,
  .container {width:1300px}
  .logo{height:75px}
  .bg-1 .text-right {padding: 540px 0px 0 410px;}
  .bg-2 h3 {font-size: 31px;}
  .bg-2 .col-sm-3{margin: 13px;}
  .bg-3 .col-sm-6:last-child {padding: 20px;}
  .bg-3 p{font-size: 30px}
  .bg-3 h2{margin-bottom: 30px}
  .bg-4 .col-sm-2 {margin: 8px; width: 32%; min-height: 852px;} 
  .bg-4 h3 {font-size: 34px;}
  .bg-4 .btn{font-size: 22px; padding: 15px 65px;}
  .bg-8 .col-sm-6:last-child {padding: 40px;}
  .bg-8 h2 {font-size: 50px}
  #kepek .container{width: 1170px}
  #video .container{width: 800px; margin:40px auto 0 auto; text-align:center}
  #kepek .close {right: 25px;}
}

@media only screen and (max-width: 1280px) {
  .navbar-container,
  .container {width:1200px}
  .logo{height:60px}
  .navbar-nav li {padding-top: 60px; margin-left: 6px;}
  .bg-3 h2{font-size: 60px; margin-bottom: 30px}
  .bg-4 .col-sm-2 {margin: 8px; width: 32%} 
  .bg-4 h2 {font-size: 46px;}
  .bg-4 img{margin-bottom: 20px}
  .bg-4 h3 {font-size: 32px;}
  .bg-4 .btn{font-size: 22px; padding: 15px 65px;}
  .bg-3 p,
  #rolunk p{    font-size: 22px;   padding: 0 10px;}
  #kepek .container{width: 1170px; }
  #kepek .modal{background: #000; margin-top: 160px; padding-top: 40px}
  #kepek .modal-content{width: 95%; margin-top: 30px}
  #video .container{width: 800px;margin:40px auto 0 auto; text-align:center}
  #kepek .close {top:30px; right: 95px; color: #fff}
}

@media only screen and (max-width: 1024px) {
  .navbar-container,
  .container {width:1000px}
  .logo{height:55px}
  .navbar-nav li {padding-top: 50px; margin-left: 0px;}
  .navbar-nav li a {font-size: 20px;}
  .bg-1 .text-left {padding: 80px 10px 0 40px;}
  .bg-1 .text-right{display:none}
  .bg-2 .col-sm-3 {margin: 11px;}
  .bg-2 h3 {font-size: 22px;}
  .bg-3 h2{font-size: 56px; margin-bottom: 25px;}
  .bg-3 p {font-size: 22px;}
  .bg-4 .col-sm-2 {margin: 6px; width: 32%} 
  .bg-4 h2 {font-size: 46px;}
  .bg-4 img{margin-bottom: 20px}
  .bg-4 h3 {font-size: 28px;}
  .bg-4 .btn{font-size: 22px; padding: 15px 65px;}
  .bg-8 h2 {font-size: 44px; margin-bottom: 30px}
  .bg-8 p {color: #fff; font-size: 28px;}
  #kepek .container{width: 1000px}
  #kepek .modal-content{width: 95%; margin-top: 30px;}
  #video .container{width: 800px;margin:20px auto 0 auto; text-align:center}
  #kepek .close {right: 25px;}
}

@media only screen and (max-width: 820px) {
  .navbar-container,
  .container {width:800px}
  .navbar{padding-bottom: 20px;}
  .logo{height:50px}
  .navbar-nav li {padding-top: 50px; margin-left: 0px;}
  .navbar-nav li a {font-size: 15px; padding: 10px}
  .bg-1 .text-left {padding: 20px 10px 0 20px;}
  .bg-1 .text-right{display:none}
  h1{font-family: Fieldwork Geo !important;}
  .bg-2 .col-sm-3 {margin: 8px; height: 265px;}
  .bg-2 h2 {font-size: 50px;}
  .bg-2 h3 {font-size: 18px;}
  .bg-2 img{height: 150px; margin: 25px 0;}
  .bg-3 h2{font-size: 50px; margin-bottom: 20px;}
  .bg-3 p {font-size: 16px;}
  .bg-4 .col-sm-2 {margin: 7px; width: 31%; float: left; min-height: 434px;}
  .bg-4 h2 {font-size: 36px;}
  .bg-4 h3 {font-size: 24px; line-height: 1.5;}
  .bg-4 .col-sm-2 img{margin-bottom: 20px;}
  .bg-4 .btn{font-size: 20px; padding: 12px 32px;}
  .bg-5 h2{font-size: 50px; margin-bottom: 30px;}
  .bg-6 h2 {font-size: 50px;margin-top: 60px;margin-bottom: 20px;}
  .bg-6 h3 {font-size: 29px;}
  .bg-6 p {font-size: 18px;}

  .bg-8 .col-sm-6:last-child {padding: 30px;}
  .bg-8 h2 {font-size: 36px; margin-bottom: 30px}
  .bg-8 p {color: #000; font-size: 20px;}
  
  #kepek .container{width: 800px}
  #kepek .modal-content{width: 95%; margin-top: 30px;}
  #kepek .col-sm-3 img{width: 100px; height: 100px;}
  #kepek .prev, .next{margin-top:0; top:260px}
  #video .container{width: 800px; margin:20px auto 0 auto; text-align:center}
  #kepek .close {right: 25px;}
}

@media only screen and (max-width: 480px) {
  .navbar-container,
  .container {width:345px; padding:0}
  .container-fluid {padding-top: 20px; padding-bottom: 20px;}
  .logo{margin-top:5px; height: 55px}
  .navbar-toggle{margin-top:12px; margin-right:12px; padding:15px}
  .navbar-toggle .icon-bar+.icon-bar {margin-top: 7px;}
  .navbar {padding-bottom: 28px;}
  .navbar-nav .active{background-color: initial;}
  .navbar-nav li{padding-top: 0; padding-bottom:10px}
  .navbar-default .navbar-collapse, .navbar-default .navbar-form {margin-top: 20px;}
  .bg-1{height: 500px}
  .bg-1 .text-left {padding: 20px 0px 0 10px;}
  .bg-1 h1{font-size: 40px; line-height: 1.5; max-width: 320px; font-family: Fieldwork Geo !important}
  .bg-1 .btn{font-size: 16px; margin-top: 60px}
  .bg-1 h3{font-size: 24px; line-height: 1.5; max-width: 320px}
  h2{font-size: 32px !important}
  .bg-2 .col-sm-3 {margin: 2px; height: 208px; width: 48%; float: left;}
  .bg-2 img {height: 110px; margin: 25px 0;}
  .bg-2 h3 {font-size: 16px;}
  .bg-4{padding:0}
  .bg-3 p{font-size: 18px}
  .bg-4 h2 {margin: 20px; font-size: 28px !important; line-height: 1.5;}
  .bg-4 h3 {font-size: 22px; margin-top:0}
  .bg-4 h4{font-size: 18px; margin: 20px 0}
  .bg-4 .col-sm-2 {margin: 5px; width: 47%; float: left; height:500px;}
  .bg-4 .col-sm-2 img{margin-bottom: 20px;}
  .bg-4 .btn {font-size: 10px; padding: 8px 20px;}
  .modal .jobb .borcim h5{font-weight: normal}
  .modal .jobb .borcim h3{font-weight: bold}
  .modal-header{padding: 15px 15px 0 0;}
  .modal-content{width: 42.5%;}
  .modal .bal img{width: 100%; height: auto; margin:0}
  .modal .jobb {padding-right: 15px;margin-left: 0;}
  .modal .jobb .borcim{margin-top: 20px; margin-bottom: 20px;}
  .modal .order{width: 90%}
    #kepek .container{width: 330px}
	#kepek .modal{margin-top: 100px}
  #kepek .modal-content{width: 95%; margin-top: 30px;}
  #kepek .col-sm-3 img{width: 86px; height: 86px;}
  #kepek .prev, 
  #kepek .next{margin-top:0; top:138px}
  #video .container{width: 300px;margin:20px auto 0 auto; text-align:center}
  #kepek .close {right: 25px;}
    #rolunk p{    font-size: 16px;}
}

@media only screen and (max-width: 359px) {
  .navbar-container,
  .container {width:305px; padding:0}
  .container-fluid {padding-top: 20px; padding-bottom: 20px;}
  .logo{margin-top:5px; height: 51px}
  .navbar-toggle{margin-top:12px; margin-right:12px; padding:15px}
  .navbar-toggle .icon-bar+.icon-bar {margin-top: 7px;}
  .navbar {padding-bottom: 28px;}
  .navbar-nav .active{background-color: initial;}
  .navbar-nav li{padding-top: 0; padding-bottom:10px}
  .navbar-default .navbar-collapse, .navbar-default .navbar-form {margin-top: 20px;}
  .bg-1{height: 500px}
  .bg-1 .text-left {padding: 20px 0px 0 10px;}
  .bg-1 h1{font-size: 40px; line-height: 1.5; max-width: 320px; font-family: Fieldwork Geo !important}
  .bg-1 .btn{font-size: 16px; margin-top: 60px; padding: 20px 80px;}
  .bg-1 h3{font-size: 24px; line-height: 1.5; max-width: 320px}
  h2{font-size: 32px !important}
  .bg-2 .col-sm-3 {margin: 2px; height: 208px; width: 48%; float: left;}
  .bg-2 img {height: 110px; margin: 25px 0;}
  .bg-2 h3 {font-size: 12px;}
  .bg-4{padding:0}
  .bg-4 .btn{font-size: 16px}
  .bg-3 p{font-size: 18px}
  .bg-4 h2 {margin: 20px; font-size: 28px !important; line-height: 1.5;}
  .bg-4 h3 {font-size: 19px; margin-top:0}
  .bg-4 .col-sm-2 {margin: 3px; width: 48%; float: left; min-height: 410px;}
  .bg-4 .col-sm-2 img{margin-bottom: 20px;}
  .bg-4 .btn {font-size: 18px; padding: 10px 15px;}
  .modal .jobb .borcim h5{font-weight: normal}
  .modal .jobb .borcim h3{font-weight: bold}

  .modal-content{width: 42.5%;}
  .modal .bal img{width: 100%; height: auto; margin:0}
  .modal .jobb {padding-right: 15px;margin-left: 0;}
  .modal .jobb .borcim{margin-top: 20px; margin-bottom: 20px;}
  
    #kepek .container{width: 290px}
  #kepek .modal-content{width: 95%; margin-top: 30px;}
  #kepek .col-sm-3 img{width: 86px; height: 86px;}
  #kepek .prev, .next{margin-top:0; top:138px}
  #video .container{width: 280px;margin:20px auto 0 auto; text-align:center}
  #kepek .close {right: 25px;}

}