body {
  background-color: #222222;
  margin:0;
}

img {
  width: 100px;
}

.diva {
  position: relative;
  border-style: solid;
  border-width: 2px;
  background-color: red;
  height: 200px;
  width: 300px;
}

/***************************************************/
.imgbika {
  position: absolute;
  right: 20px;
}

/*Lényegében az about szülőhöz viszonyítva működik*/
/***************************************************/
.imgkecske {
  position: relative;
  right: 130px;
}

/*100px a másik kecske 2 és ahoz képest adok még 30 hogy lássam, hogy ahhozképest mozdult el*/
/***************************************************/
.img2kecske {
  position: relative;
  left: 0px;
}

/*természetes helyhez képest +- rakaj*/
.divkecske {
  background-color: green;
}

/***************************************************/
.divrat {
  background-color: yellow;
  position: absolute;
  right: 200px;
  /*itt a Web szélét veszi alapúl*/
}

/***************************************************/
/*absolute a HTML-t veszi alapul ezállatl a másik kép alá is betud menni
mivel a többi div figyelmen kívül hagyja*/
.bird {
  position: fixed;
  top: 20px;
  left: 80px;
}

/* 1pontoban rögzítu majd bármi felett mehetha legörgetünk.
/***************************************************/
.betu1{
  font-family:sans-serif;
}
.betu2{
  font-family:serif;
}
.betu3{
  font-family:fantasy;
}
.betu4{
  font-family:cursive;
}
.betu5{
  font-family:inherit;
}
.betu6{
  font-family:monospace;
}
.betu6{
  font-family:Algerian,monospace;
}
.betu7{
  font-family:Algerian,fantasy;
}
.betu8{
  font-family:Bernadette,serif;
}
.betu9{
  font-family:Bernadette,sans-serif;
}
/*sky projekt****************/
.skyh{
  position: fixed;
  margin: 0px 0px;
  width:100%;
  height: 800px;
}
.div3{/*üres háttér nélküli*/
  height: 300px;

}
/*kídésrlet div 2 ************************/

.birdr{
   transform: rotate(180deg);
}
.bz-index{
  z-index: 1;}
.uhz-index{
  z-index: -100;
}
.repcsir{
   transform: rotate(180deg);
}
.repcsi{
position: fixed;
top:20px;
left: 50px;
z-index: 0;

}

.div1{
  margin:0 ;
  position: relative;
  border-style: solid;
  border-width: 2px;
  background-color: #555555;
  height: 500px;
  width: 100%;
}

.div2{
  position: relative;
  background-color: #222222;

}
/*Terminátor projekt***************************/
.termh{
  position: absolute;
  right: 30px;
  top:30px;

}
.termh2{
  position: absolute;
  right: 20px;
  top:30px;
  filter: blur(10px);
}

.termm{
  width: 20%;
  height: 60%;
}
.term:hover{
  z-index:-1;
}
.term:active{
  z-index:-1;
}



/*Terminátor projekt***************************/