* {
  margin: 0;
  padding: 0;
  border: 0;
}

body {
  /*height: 100%;*/
  margin: 0;
  padding: 0;
  font-family: "Roboto-Thin", sans-serif;
  background-color: rgb(255, 255, 255);
}

.col {
  padding: 0;
}
/* ------------------  Fejléc -------------------- */
header {
  width: 99%;
  background-color: rgb(255, 255, 255);
  position: sticky;
  top: 0;
  z-index: 100;
  padding: 0;
  justify-content: center;
}

.containerCimsor {
  background-color: rgb(147, 42, 26);
  color: whitesmoke;
  font-family: "Times";
  text-decoration: none;
  text-align: center;
  padding: 25px 0;
}

.kozepre {
  justify-content: center;
  margin: 0;
  width: 99.999%;
}

p {
  text-align: justify;
}

h1 {
  font-size: 2.5rem;
  margin-top: 14px;
  color: #393536;
}

h5 {
  color: #393536;
}

header .media600 {
  display: none;
}
/* ------------------  Nagy kép gombbal -------------------- */

.hero-image img {
  width: 100%;
}

.hero-image1 {
  background-image: url("http://kovacstrans2000kft.hu/jpg/fooldal_kamion.jpg");
  background-size: cover;
  background-position: center;
  height: 450px;
}

.hero-image2 {
  background-image: url("https://kovacstrans2000kft.hu/jpg/banya_fejlec.jpg");
  background-size: cover;
  background-position: center;
  height: 450px;
}

.hero-image-szall {
 /* background-image: url("http://kovacstrans2000kft.hu/jpg/szallitmanyozas.jpg"); */
  background-image: url("https://kovacstrans2000kft.hu/jpg/front1.jpg");
  background-size: cover;
  background-position: center;
  height: 450px;
}

.hero-image-szall-belfold {
  background-image: url("https://kovacstrans2000kft.hu/jpg/IBFR3832.JPG");
  background-size: cover;
  background-position: center;
  height: 450px;
}

.hero-image-szall-nemzetkozi {
  background-image: url("https://kovacstrans2000kft.hu/jpg/IMG_E0107.JPG");
  background-size: cover;
  background-position: center;
  height: 450px;
}

.hero-image-flotta {
  background-image: url("https://kovacstrans2000kft.hu/jpg/IMG_E0981.JPG");
  background-size: cover;
  background-position: center;
  height: 450px;
}

.hero-image-karrier {
  background-image: url("https://kovacstrans2000kft.hu/jpg/karrier.jpg");
  background-size: cover;
  background-position: center;
  height: 450px;
}

.hero-image-banya {
  background-image: url("https://kovacstrans2000kft.hu/jpg/banya_fejlec.jpg");
  background-size: cover;
  background-position: center;
  height: 450px;
}

.hero-text-szall {
  text-align: center;
  top: 0%;
  left: 0%;
  transform: translate(0%, 227%);
  color: white;
}

.hero-text-szall h2 {
  font-size: 80px;
  margin: 0px;
  font-family: "Roboto";
}

.hero-image1 span,
.hero-image2 span {
  padding-bottom: 12px;
  transform: translate(3px, 5px);
}

.hero-text {
  text-align: center;
  top: 0%;
  left: 0%;
  transform: translate(0%, 175%);
  color: white;
}

.hero-text h2 {
  font-size: 50px;
  margin: 0px;
  font-family: "Roboto";
}

.hero-text a h3 {
  font-size: 20px;
  margin: 0px;
  font-family: "Roboto";
}

.row h2:hover {
  transition-duration: 2s;
  opacity: 1;
}

.row h2 {
  background-color: rgb(0, 0, 0);
  color: rgb(255, 255, 255);
  padding: 20px;
  border-radius: 75px;
  width: 94%;
  margin-left: 3%;
  transition-duration: 2s;
  opacity: 0.66;
}

.row h3 {
  
  font-size: 28px;
}

.nagyit:hover {
  transition: 0.3s;
  transform: scale(1.25, 1.25);
}

.nagyit {
  transition: 0.5s;
  transform: scale(1, 1);
}

.material-symbols-outlined {
  font-variation-settings: "FILL" 1, "wght" 800, "GRAD" 0, "opsz" 48;
}

.kezdoszo {
  color: rgb(147, 42, 26);
}

/* ------------------  Tartalom -------------------- */

.input:focus,
.input:hover {
  /* outline-color: rgb(147, 42, 26);
  border: 1px solid rgb(147, 42, 26);
  box-shadow: rgb(147, 42, 26) 2px 2px 20px; */

  outline-color: rgb(255, 255, 255);
  /* border: 1px solid rgb(147, 42, 26); */
  box-shadow: rgb(255, 255, 255) 2px 2px 20px;
}

.inputlabel {
  /* color: rgb(147, 42, 26); */
  color: rgb(255, 255, 255);
}

.btn-primary {
  border: 2px solid rgb(147, 42, 26);
  background-color: white;
  border-radius: 30px;
  color: rgb(147, 42, 26);
  transition-duration: 0.4s;
}

.btn-primary:hover {
  border: 2px solid rgb(147, 42, 26);
  background-color: rgb(147, 42, 26);
  color: white;
  transition-duration: 0.4s;
}

.btn-primary-zold {
  border: 2px solid #7ea861;
  background-color: white;
  border-radius: 30px;
  color: #7ea861;
  transition-duration: 0.4s;
}

.btn-primary-zold:hover {
  border: 2px solid #7ea861;
  background-color: #7ea861;
  color: white;
  transition-duration: 0.4s;
}

.media {
  margin-top: 15px;
}

main .media-body a {
  text-decoration: none;
  color: black;
}

.urlap {
  color: whitesmoke;
}
.urlap a {
  color: whitesmoke;
}

.col-xl-4 {
  padding: 5px 0;
}



/* ----------------  Gallery  ------------    */

.gallery img{
  box-shadow: 10px 10px 18px rgb(0, 0, 0);
 transition: 3s ;
}

.gallery img:hover {
  /*box-shadow: 5px 10px 18px rgb(147, 42, 26);  */
  box-shadow: 10px 10px 18px rgb(147, 42, 26);
 transition: 0.3s ;
}



/* --------------  kis Logók - Ajánlatot kérek ------------------- */

.kislogo-szoveg {
  display: flex;
  justify-content: center;
  font-size: small;
}

.kislogo {
  width: 60%;
  margin-left: 20%;
}

.ajanlatot-kerek {
  width: 50%;
  font-size: larger;
}

/* -------------------  Ürlap  ------------------ */

.input {
  width: 90%;
  border: 1px solid rgb(255, 255, 255);
  font-size: 22px;
  padding-top: 0;
}

.inputlabel {
  font-size: 17px;
  padding-bottom: 0;
  color: white;
}
.containerInput {
  background-color: #393536;
  box-shadow: 5px 10px 10px black;
  padding: 10px 2px;
  margin: 0 15px;
}

/* ---------------------  A N I M Á C I Ó ------------------------------- */

@keyframes atlatszo {
  from {
    /* opacity: 0; */
    filter: blur(30px);
  }
  to {
    /*opacity: 1;*/
    filter: blur(0px);
  }
}

@keyframes fent {
  from {
    margin-left: 150px;
    opacity: 0;
  }
  to {
    margin-left: 0px;
    opacity: 1;
  }
}

@keyframes jobbra {
  from {
    margin-left: -150px;
    opacity: 0;
  }
  to {
    margin-left: 0;
    opacity: 1;
  }
}

header h1,
header h5,
main .blur {
  animation-name: atlatszo;
  animation-duration: 3s;
}

header img,
main a {
  animation-name: jobbra;
  animation-duration: 3s;
}

main .jobb {
  animation-name: jobbra;
  animation-duration: 6s;
}

main .intro {
  animation-name: fent;
  animation-duration: 1.2s;
}

main .intro2 {
  animation-name: fent;
  animation-duration: 2.6s;
}

main .intro3 {
  animation-name: fent;
  animation-duration: 3s;
}

main img {
  margin-right: 10px;
}

/* --------------  600 px ------------------
     576 képpont álló telefonokhoz.
    768 képpont táblagépen.
    992 képpont laptopokhoz.
    1200 képpont nagyméretű eszközökhöz.

- */
/* --------------  992 px ------------------ */
@media screen and (max-width: 992px) {

  header .media {
    margin-top: 0;
    margin-left: 10%;
    margin-bottom: 5px;
  }

  header h5 {
    font-size: 1.2rem;
  }

  header h1 {
    font-size: 2.1rem;
    line-height: 12px;
  }

  header img {
   width: 100px; 
  }

  .cegtelo img,
  .cegmail img{
    width: 25px;
  }

  .row h2 {
    width: 96%;
    margin-left: 2%;
    padding: 8px;
  }

  .hero-text h2,
  .hero-text-szall h2,
  .hero-text-szall-belfold h2,
  .hero-text-szall-nemzetkozi h2,
  .hero-image-flotta h2,
  .hero-image-karrier h2,
  .hero-image-banya {
    font-size: 2.0rem;
  }

  .hero-image1,
  .hero-image2,
  .hero-image-szall,
  .hero-image-szall-belfold,
  .hero-image-szall-nemzetkozi,
  .hero-image-flotta,
  .hero-image-karrier,
  .hero-image-banya {
    height: 300px;
  }
}

/* --------------  768 px ------------------ */
@media screen and (max-width: 768px) {
   .topnav a:not(:first-child) {
    display: none;
  }

  .topnav a.icon {
    float: right;
    display: block;
  }

  .topnav.responsive {
    position: relative;
  }

  .topnav.responsive .icon {
    position: absolute;
    right: 0;
    top: 0;
  }

  .topnav.responsive a {
    float: none;
    display: block;
    text-align: left;
  }
  
  header .media {
    margin-top: 0;
    margin-left: 10%;
  }

  
  header h1 {
    font-size: 1.7rem;
    line-height: 10px;
  }

  header h5 {
    font-size: 1rem;
  }
  
  header img {
   width: 75px; 
  }

  
  .row h2 {
    width: 96%;
    margin-left: 2%;
    padding: 4px;
  }

  .hero-text h2,
  .hero-text-szall h2,
  .hero-text-szall-belfold h2,
  .hero-text-szall-nemzetkozi h2,
  .hero-image-flotta h2,
  .hero-image-karrier h2,
  .hero-image-banya {
    font-size: 1.5rem;
  }

  .hero-image1,
  .hero-image2,
  .hero-image-szall,
  .hero-image-szall-belfold,
  .hero-image-szall-nemzetkozi,
  .hero-image-flotta,
  .hero-image-karrier,
  .hero-image-banya {
    height: 250px;
  }
}

/* --------------  600 px ------------------ */
@media screen and (max-width: 600px) {
 

  /* --------------  Fejléc és egyéb szöveg méretek ------------------- */

  header img {
    display: none;
  }
  header h1 {
    font-size: 1.7rem;
  }

  

  header .media,
  .tel {
    padding-left: 10px;
  }

  header .media {
    display: none;
  }

  .hero-text h2,
  .hero-text-szall h2,
  .hero-text-szall-belfold h2,
  .hero-text-szall-nemzetkozi h2,
  .hero-image-flotta h2,
  .hero-image-karrier h2,
  .hero-image-banya {
    font-size: 1.5rem;
  }

  .hero-image1,
  .hero-image2,
  .hero-image-szall,
  .hero-image-szall-belfold,
  .hero-image-szall-nemzetkozi,
  .hero-image-flotta,
  .hero-image-karrier,
  .hero-image-banya {
    height: 250px;
  }

  .hero-text {
    transform: translate(0%, 100%);
  }
  
  .row h3 {
    font-size: 1.2rem;
  }
  .row h5 {
    font-size: 1rem;
  }

  .row h2 {
    width: 70%;
    margin-left: 15%;
    padding: 21px;
  }
  .nagyit:hover {
    transform: scale(1, 1);
  }
  .nagyit {
    transform: scale(0.8, 0.8);
  }
  /* -------------------  Ürlap  ------------------ */

  .input {
    width: 98%;
  }

  .inputlabel {
    font-size: 17px;
    padding-bottom: 0;
  }
  .containerInput {
    padding: 2px 2px;
    margin: 0 2px;
  }

/* -------------------  Gombok  ------------------ */
  .ajanlatot-kerek {
    width: 80%;
    font-size: large;
  }
}