* {  box-sizing: border-box;}
.row > .column {  padding: 0 20px;}
.row:after {  content: "";  display: table;  clear: both;}

.column {  float: left;  width: 50%;} /* ha 50 % akkor 2 oszlopban van */

.modal {  display: none;  position: fixed;  z-index: 1;  padding-top: 100px;  left: 0;  top: 0;  width: 100%;  height: 100%;  overflow: auto;  background-color: black;}
.modal-content {  position: relative;  background-color: #fefefe;  margin: auto;  padding: 0;  width: 90%;  max-width: 1200px; }
.close {  color: white;  position: absolute;  top: 10px;  right: 25px;  font-size: 35px;  font-weight: bold; }
.close:hover,.close:focus {  color: #999;  text-decoration: none;  cursor: pointer;}


.prev,.next {  cursor: pointer;  position: absolute;  top: 50%;  width: auto;  padding: 16px;  margin-top: -50px;  color: white;  font-weight: bold;  font-size: 20px;  transition: 0.6s ease;  border-radius: 0 3px 3px 0;  user-select: none;  -webkit-user-select: none; }
.next {  right: 0;  border-radius: 3px 0 0 3px;}
.prev:hover,.next:hover {  background-color: rgba(0, 0, 0, 0.8);}
.numbertext {  color: #f2f2f2;  font-size: 12px;  padding: 8px 12px;  position: absolute;  top: 0;}
img {  margin-bottom: -4px;}
.caption-container {  text-align: center;  background-color: black;  padding: 2px 16px;  color: white;}
.demo {  opacity: 0.6;}
.active,.demo:hover {  opacity: 1;}

img.kiskepke {  transition: 0.3s; cursor: pointer; border: 1px solid #444444; background:white; padding: 5px; /* kiskép border */
                width: 100%; max-width: 300px;display:block; margin: 0 auto; margin-bottom: 40px; } /* kiskép méret */

.kiskepke:hover {  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);}




.opacnagykep { display: none;
	            animation:opac 0.8s}@keyframes opac{from{opacity:0} to{opacity:1}} /*  animate opacity */