body{ 
  color:white;                                                                                    
  width: 90%;                                                                             /*sirka stranky je nastavena na 90% sirky prehliadaca*/
  max-width: 960px;                                                                       /*sirka nesmie presiahnut 960px*/
  height: fit-content;                                                                    /*vyska obsahu zavisi od velkosti obsahu na stranke*/
  margin: 0 auto;                                                                         /*stranku vycentruje horizontalne na stred*/                                                                  
  display:grid;                                                                           /*tu pouzivam css grid na rozlozenie obsahu stranky*/
  grid-template-areas:                                                                    /*tento riadok urcuje ako maju byt jednotlive casti stranky rozlozene*/
  "header header"
  "nav      nav"
  "main aside"
  "footer footer";
  grid-template-rows: auto auto 1fr auto;                                                 /*zadanie velkosti riadkov*/
  grid-template-columns: 85% 15%;                                                         /*podiel v akom su rozlozene stlpce main a aside*/
  background-image: url('../images/pozadie.jpg');                                         /*zadefinovanie obrazku pozadia : no-repeat - aby sa pozadie neopakoval*/
  background-repeat:no-repeat;                                                            /*center - aby bolo ulozene pekne na stred, cover - aby pozadie pokrylo cele pozadie bez odrezanych krajov*/
  background-position: center;                                                            /*fixed - aby sa pozadie nepohybovalo pocas scrollovania, dalej box-shadow aby okolie obsahovej stranky webu vyzeralo ze vrha tien*/
  background-size: cover;
  background-attachment:fixed;
  box-shadow: 0px 0px 20px rgb(0, 0, 0); 
}
a{
  color:white;                                                                          /*farba textu yadefinovana na bielu*/
}
header{
  grid-area:header;                                                                                                 /*tu som zadefinoval nazov casti webu aby css a html vedeli rozlozit tieto csati podla vyssie zadefinovaneho gridu*/
  background-image:linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)),url('../images/sekcie.jpg');         /*pozadie obsahu casti s jemnym prechodom pre vzhlad*/
  background-repeat:no-repeat;                                                                                      /*zadefinovanie obrazku pozadia : no-repeat - aby sa pozadie neopakoval*/
  background-position: center;                                                                                      /*center - aby bolo ulozene pekne na stred, */
  background-size: cover;                                                                                           /*cover - aby pozadie pokrylo cele pozadie bez odrezanych krajov*/
  display: flex;                                                                                                    /*ulozenie obsahu do stredu*/
  justify-content: center;                                                                                          /*horizontalne ulozenie obsahu na stred*/
  align-items: center;                                                                                               /*vertikalne ulozenie obsahu na stred*/
}
article{
  width: 80%;                                                                                                       /*zadefinovane aby velkost vsetkych casti article mali maximalnu sirku 80% velkosti contajnera*/
  border-radius: 25px;                                                                                              /*kazda cast article bude mat zaoblene rohy o velkosti 25px*/
  border: 2px solid grey;                                                                                         /*kazdy article bude mat defaultne oramovanie solid o velkosti 2px a sedu farbu*/
  padding-left: 8px;                                                                                                /*vnutorny lavy okraj 8px*/
  padding-right: 8px;                                                                                               /*vnutorny pravy okraj 8px*/
  font-family:Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;                                            /*kazdy article bude mat v obsahu primarne font Cambria ak nieje k dispozici tak Cochin atd. nakoniec je zadefinovana rodina pisma*/
}
footer{
  grid-area:footer;                                                                                               /*tu som zadefinoval nazov casti webu aby css a html vedeli rozlozit tieto csati podla vyssie zadefinovaneho gridu*/
  background-image:linear-gradient(rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 1)),url('../images/sekcie.jpg');        /*obrazok pozadie s jemnym prechodom */
  height: fit-content;                                                                                            /*vyska sa prisposoby obsahu*/
  padding: 10px;                                                                                                  /*vnutorne okraje su zadefinovane na velkosto 10px*/                                                                                  
}
.menu{
  font-size: x-large;                                                                                             /*zadefinovana velkost pisma */
  padding: 10px;                                                                                                  /*vnutorne okraje jeddnotlyvych odkazov zadefinovane na 10px*/
  margin: 0 auto;                                                                                                 /*centrovanie menu v ramci navigacie*/

}
nav{
  grid-area:nav;                                                                                                    /*tu som zadefinoval nazov casti webu aby css a html vedeli rozlozit tieto csati podla vyssie zadefinovaneho gridu*/
  display: flex;                                                                                                    /*ulozenie obsahu do stredu*/
  background-image: linear-gradient(rgba(80, 74, 74, 0.89), rgba(0, 0, 0, 0.932));                              /*obrazok pozadie s jemnym prechodom */
}
main{
  grid-area:main;                                                                                                 /*tu som zadefinoval nazov casti webu aby css a html vedeli rozlozit tieto csati podla vyssie zadefinovaneho gridu*/
  background-image:linear-gradient(rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 1)),url('../images/sekcie.jpg');        /*obrazok pozadie s jemnym prechodom */
  background-position: center;
  padding: 10px;
}
aside{
  grid-area:aside;                                                                                                /*tu som zadefinoval nazov casti webu aby css a html vedeli rozlozit tieto csati podla vyssie zadefinovaneho gridu*/
  background-color: black;                                                                                      /*farba pozadia zadefinovana na ciernu*/
}
.logo_odkaz{
  height: 100px;                                                                                                  /*zvacsenie obrazku na 100px*/
}
p{
  font-size: x-large;                                                                                             /*zadefinovana velkost pisma */
}
li{
  font-size: large;                                                                                               /*zadefinovana velkost pisma */
}
#textura{
  margin-left: auto;                                                                                              /*ulozenie artikla aby bol na lavej strane*/
}
dl{
  font-size: x-large;                                                                                             /*zadefinovana velkost pisma */
}
dt{
  font-size: large;                                                                                               /*zadefinovana velkost pisma */
}
dd{
  font-size: medium;                                                                                              /*zadefinovana velkost pisma */
}
#modelovanie{
  background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 1)), url('../images/Modeling.png');     /*obrazok pozadie s jemnym prechodom */
  background-position: center;                                                                              /*ulozenie obrazku pozadia na stred*/                                                                              
  margin:10px;                                                                                               /*vonkajsi okraj 10px*/
  border-style:double;                                                                                      /*zmena vyzoru oramovania*/
  border-width: 5px;
}
h1{
  text-align:center;                                                                                        /*ulozenie nadpisov h1 vzdy na stred*/
}
.uvod_prihovor{
  text-align: center;                                                                                       /*ulozenie textu na stred*/
}
.autor{
  float: right;                                                                                             /*ulozenie textu na pravo*/
}
mark{
  background-color:transparent;                                                                             /*pozadie mark je teraz priehladne*/
}
#article_kontakt{
  padding: 2%;                                                                                              /*vnutorny okraj 2%*/
  max-width:600px;                                                                                          /*maximalna sirka zadefinovana na 600px*/
  margin: 15px;                                                                                             /*vonkajsie okraje zadefinovane na 15px*/
  background-image: linear-gradient(rgba(83, 83, 83, 0.89), rgba(0, 0, 0, 0.932));                      /*prechod na pozadi kontajnera*/
}
.ja{
  padding:10px;                                                                                             /*vnutorny okraj zadefinovany na 10px*/
  float:left;                                                                                               /*ulozenie artickla na lavo*/
}

#image_map{
  margin-left: auto;                                                                                        /*ulozenie artickla na lavo*/
  text-align:center;                                                                                        /*ulozenie obsahu na stred*/
  background-image: linear-gradient(rgba(83, 83, 83, 0.89), rgba(0, 0, 0, 0.932));                      /*pozadie zadefinovane na farebny prechod*/
}
.mapa{
  padding: 10px;                                                                                            /*vnutorny okraj 10px*/
}
aside{
  text-align:center;                                                                                        /*ulozenie textu na stred kontajnera*/
}
#udaje{
  align-content:center;                                                                                     /*ulozenie obsahu na stred*/
  background-color:transparent;                                                                             /*zadefinovanie aby pozadie bolo priehladne*/
  border:none;                                                                                              /*zrusenie oramovania pre artickle*/
}
#textury{
  list-style-image: url('../images/favicon-16x16.png');                                                     /*zadefinovanie odrazok pre zoznam aby bol pouzity obrazok*/
}
#textura{
  background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 1)), url('../images/Textury.jpg');    /*obrazok pozadie s jemnym prechodom */
  background-position: center;                                                                                  /*ulozenie obrazku pozadia na stred*/ 
  margin-right: 10px;
  border-style:dotted;                                                                                            /*zmena vyzoru oramovania*/
  border-width:3px;
}
#galeria{
  margin:10px;
  background-image:linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 1)), url('../images/Galeria.jpg');     /*obrazok pozadie s jemnym prechodom */
  background-position: center;                                                                                  /*ulozenie obrazku pozadia na stred*/ 
  border-style:ridge;                                                                                          /*zmena vyzoru oramovania*/
  border-width:8px;                                                                                             /*zadefinovanie sirky oramovania*/
  border-color:lightskyblue;                                                                                  /*zadefinovanie farby oramovania*/
}
#zdroje{
  padding : 10px;
  margin-left: auto;
  background-image: linear-gradient(rgba(83, 83, 83, 0.89), rgba(0, 0, 0, 0.932));
}
#paragraf_zdroje{
  font-size:large;                                                                                              /*velkost pisma v paragrafe*/
  text-overflow: ellipsis;                                                                                      /*ak text presahuje kontajner zobrazia sa tri bodky*/
  overflow: hidden;                                                                                             /*skrytie presahujuceho textu*/
 }
 #Kerlow_modelovanie{
  font-size: x-large;                                                                                           /*zmena velkosti ppisma*/
 }
#poligon{
  border-style:none;                                                                                            /*zmena vyzoru oramovania na ziadny*/
  margin:15px;                                                                                                  /*vonkajsie okraje zadefinovane na 15px*/
 }
#vlak{
  float:left;                                                                                                   /*ulozenie artickla vlavo*/
  border-radius: 15px;                                                                                          /*zmena zaoblenia okrajov na 15px*/
  margin-right:20px;                                                                                            /*azdefinovanie praveho vonkajsieho kraja na 20px*/
  transition: transform 0.5s ease;                                                                              /*rychlst prechodu zmeny velkosti pri ukazani kurzorom*/
}
#vlak:hover{
  transform: scale(1.1);                                                                                        /*pri prechode mysou sa velkost obrazku zvacsi o 10%*/
}
video{
  border-radius:15px;                                                                                           /*zaoblenie okrajov o 15px*/
}
#video_kontajner{
  display:flex;                                                                                                 /*ulozenie obsahu do stredu*/
  justify-content:center;                                                                                       /*horizontalne ulozenie obsahu na stred*/                                                                                     
  width:auto;                                                                                                   /*uprava velkosti kontajnera aby bol obsah vizualne na stred*/
  border-style:none;                                                                                            /*zmena vyzoru oramovania na ziadny*/
}
h2{
  padding: 20px;
}