/* Pre uvodny obrazok min-max rozmer pre citatelnost a vmestenie sa do okna */

.introductory-image {
                    width: 70%;
                    min-width: 400px;
                    height: auto;
                    box-shadow: 0 8px 20px rgba(0,0,0,0.40); /* tien */
                    }

.introductory-image:hover {
                    filter:brightness(95%);
                    transform: scaleX(101%) scaleY(101%);
                    box-shadow: 0 8px 20px rgba(0,0,0,0.95); /* tien */
                    }

/* Wrapper textu pre umiestnenie do stredoveho stlpca*/

.wrappertx {
  max-width: 900px;
  margin: 0 auto; /* centrovanie */
  padding: 0 20px;   /* odsadenie na mobiloch */

}


/* Obalka menu s komentarom */

.wrap {
	max-width:1200px;
	min-width:320px;
	margin:0;
	background:#fff;
	border:5px solid #aa66b2;
	border-radius:25px;
	padding:10px;
        }

/* Obalka textu na stranke - menu */

.wrap-blog-0 {
	max-width:800px;
	min-width:340px;
	margin: 30px auto 20px auto;
/*	background:#eef; */
	background:rgb(193,211,227); /*aqua*/
	border:5px solid #0066ff;
	border-radius:25px;
	padding:3px;
        box-shadow: 0 8px 20px rgba(0,0,0,0.40); /* tien */
        }

.wrap-blog-0:hover {
                    filter:brightness(95%);
                    transform: scaleX(101%) scaleY(101%);
                    box-shadow: 0 8px 20px rgba(0,0,0,0.95); /* tien */
                    }

/* Obalka textu na stranke - druhy nadpis */

.wrap-blog-0-1 {
	max-width:800px;
	min-width:340px;
	margin: 30px auto 20px auto;
/*	background:#eef; */
	background:rgb(254,237,199);
	border:5px solid #0066ff;
	border-radius:25px;
	padding:3px;
        }


/* Obalka textu na stranke*/

.wrap-blog-1 {
	max-width:200px;
	min-width:200px;
	margin: 30px auto 30px auto;
/*	background:#eef; */
	background:#cef;
/*	border:5px solid #0066ff; */
	border:5px solid #0066ff;
	border-radius:25px;
	padding:3px;
        }

/* Obalka textu na stranke*/

.wrap-blog-2 {
	max-width:200px;
	min-width:200px;
	margin: 30px auto 30px auto;
	background:rgb(193,237,193);
	border:5px solid #008855;
	border-radius:25px;
	padding:3px;
        }


/* Pre modre texty s linkami */

/* Link je modry bez dekoracie a pozadie je aqua */

 .text-link-menu{
           color: blue;
           text-decoration: none;
           }

/* Po najazde kurzorom */

 .text-link-menu:hover{
                 text-decoration: black underline;
                 background-color: rgb(193,211,227); /*aqua*/
                 color: grey;
                 }

/* Preblikne po kliknuti - pri podrzani farba trva */

 .text-link-menu:active{
                  color: red;
                  }

.element {
  float: left;
  max-width: 350px;
}


.wrapper {
  max-width: 500px;
  margin: 0 auto; /* centrovanie */
}

/*------------------------------------------------------------------------------------------------------------------*/

/* Pre vacsi obrazok ciary min-max rozmer pre citatelnost a vmestenie sa do okna */

.bigger-line {
          width: 100%;
          min-width: 400px;
          max-width: 900px;
          height: auto;
          }

.bigger-line:hover { 
                   filter:brightness(100%);
                   } 

.bigger-line-1 {
          width: 100%;
          min-width: 400px;
          max-width: 900px;
          height: auto;
          box-shadow: 0 8px 20px rgba(0,0,0,0.50); /* tieň */

          }

.bigger-line-1:hover { 
                   filter:brightness(100%);
                   } 


/* Pre cierne normal texty s linkami */

/* Link je modry bez dekoracie a pozadie je sede */

 .text-link{
           color: blue;
           text-decoration: none;
           }

/* Po najazde kurzorom */

 .text-link:hover{
                 text-decoration: black underline;
                 background-color: lightgrey;
                 color: grey;
                 }

/* Preblikne po kliknuti */

 .text-link:active{
                  color: red;
                  }

/* -------------------------------------------------------------------------------------- */

/* Pri najazde kurzorom na obrazok menu oznaceny touto triedou sa zvysi jas aj velkost */

.menu-image:hover {
                  filter:brightness(150%);
                  transform: scaleX(103%) scaleY(101%);
                  }

/* -------------------------------------------------------------------------------------- */

/* Pre vacsi obrazok min-max rozmer pre citatelnost a vmestenie sa do okna */

.bigger {
          width: 100%;
          min-width: 400px;
          height: auto;
          }

/* Pre texty s linkami */

/* Link je cierny bez dekoracie a pozadie je sede */

 .rscatalog{
           color: black;
           text-decoration: none;
           }

/* Po najazde kurzorom */

 .rscatalog:hover{
                 text-decoration: blue wavy underline;
                 background-color: lightgrey;
                 color: grey;
                 }

/* Preblikne po kliknuti */

 .rscatalog:active{
                  color: green;
                  }

/* -------------------------------------------------------------------------------------- */

/* Pre vsetky obrazky */

img { 
  filter:brightness(100%);
  transition: filter 600ms linear; /* Pomale pohasinanie aj rozhasinanie */
}

/* Pri najazde kurzorom sa znizi jas pre vsetky obrazky */

/*
img:hover { 
 filter:brightness(70%);
} 
*/

/* Zaoblenie rohov pre vsetky obrazky */

img {
  border-radius: 8px;
}

/* Radius specialne pre obrazok, ktory ma pri zavadzani urcenu triedu */


.special-image {
    border-radius: 1%; /* len mierne zaoblenie */
}

/* Pri najazde kurzorom na obrazok oznaceny touto triedou sa zvacsi - ale aj pohasne jas */

.measure-image:hover {
    transform: scaleX(101%) scaleY(101%);

}

/* Pri najazde kurzorom na obrazok oznaceny touto triedou sa zvacsi - ale aj pohasne jas */

.special-image:hover {
    transform: scaleX(101%) scaleY(101%);
}

/*-----------------------------------------------------------------------------------------------------------*/

/* Pri najazde kurzorom na obrazok oznaceny touto triedou sa znizi jas */

.special-image:hover {
 filter:brightness(90%);
}

/*------------------------------------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------------------------------------*/


/* Toto je vyborne */

.mojeVideo {
  width: 100%;    /* video sa prispôsobí šírke kontajnera */

  max-width: 400px;          /* maximálna šírka */

  height: auto;              /* zachovanie pomeru strán */

  border-radius: 15px;       /* zaoblené rohy */

  box-shadow: 0 8px 20px rgba(0,0,0,0.3); /* jemný tieň */

  border: 2px solid #ccc;    /* voliteľný rám */

  transition: transform 0.3s, box-shadow 0.3s; /* animácia pri hover */

}



.mojeVideo:hover {
  transform: scale(1.03);      /* jemné zväčšenie pri hover */

  box-shadow: 0 12px 25px rgba(0,0,0,0.95);      /* intenzívnejší tieň */

  cursor: pointer;                               /* ukazovateľ kliknutia */

}