@import url('hover.css');
@import url('https://fonts.googleapis.com/css2?family=Rajdhani:wght@300;400;500;600;700&family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');

/*
.rajdhani-light {
  font-family: "Rajdhani", sans-serif;
  font-weight: 300;
  font-style: normal;
}

.rajdhani-regular {
  font-family: "Rajdhani", sans-serif;
  font-weight: 400;
  font-style: normal;
}

.rajdhani-medium {
  font-family: "Rajdhani", sans-serif;
  font-weight: 500;
  font-style: normal;
}

.rajdhani-semibold {
  font-family: "Rajdhani", sans-serif;
  font-weight: 600;
  font-style: normal;
}

.rajdhani-bold {
  font-family: "Rajdhani", sans-serif;
  font-weight: 700;
  font-style: normal;
}
*/



img {outline: none;}
a{color:var(--skyBlue); outline: none; text-decoration:none;}
a:hover {color: var(--linkHover);}
code {color:var(--skyBlue);}

html{
	height:100%;
	scroll-behavior: smooth;
}
page{
	text-align: center;
	margin:0 0 0 0;
	padding:0 0 0 0;
	height:100%;
	}

body{
	font-family: 'Roboto', sans-serif;
	/*font-family:Rajdhani;*/
	font-weight:400;
	font-size:17px;
	background-color: var(--back);
	color:var(--textLo);
	margin:0;
	padding:0;
	height:100%;
}

.pageWrap{
	display:block;
	position:relative;
	width:1280px;	
	background-color:var(--backLo);
	margin: 0 auto;
	min-height: 100vh;
	display:none;
}

.vsebina{
	/*margin:5px;*/
}

.link_menu{
    font-size: 20px;
    color: var(--textHi);
    font-weight: 500;
    text-shadow: 0 0 10px black;
}
.link_menu>a{
    border: 1px var(--skyBlue) solid;
    border-radius: 30px;
    color: var(--textHi);
    background-color: var(--backHi);
    padding: 10px;
    font-size: 16px;
}

.link_menu>a:hover{
    color: var(--skyBlue);
    box-shadow: 0 0 10px -2px white;
}

.rabimPomoc{
	position:absolute;
	top: 10px; right:10px;
	text-align:right;
}

.rabimPomoc>a{
	background-color: var(--red);
	color: var(--textHi);
	border: 1px var(--textHi) solid;
}

.rabimPomoc>a:hover{
    color: var(--textHi);
}

.rabimPomoc img{
	vertical-align:text-bottom;
}

#backToTopDiv img{
	vertical-align:text-bottom;
}


.textSmall{
	font-size:16px;
}


#backToTopDiv{
	display:none;
	position:fixed;
	top:20px;
	right:60px;
	z-index:100;
}

/*--- glava --------------------------- */
.glava{
	font-weight:300;
	font-size:17px;
	vertical-align:middle;
	height:123px;
	background:var(--backLo);
	text-align:left;
	position: -webkit-sticky; /* Safari */
	position: sticky;
	width:100%;
	z-index:20;
	position:relative;
}
.logo{
	position:absolute;
	top:5px;
	left:5px;
}

.img-glow {
  filter: brightness(1) saturate(1);
  animation: glowPulse 2s ease-in-out infinite;
}

@keyframes glowPulse {
  0%   { filter: brightness(1) saturate(1) drop-shadow(0 0 0px rgba(0,0,0,0.0)); }
  10%  { filter: brightness(1.15) saturate(1.10) drop-shadow(0 0 10px rgba(255,255,255,0.40)); }
  20%  { filter: brightness(1.15) saturate(1.10) drop-shadow(0 0 10px rgba(255,255,255,0.40)); }
  30%  { filter: brightness(1) saturate(1) drop-shadow(0 0 0px rgba(0,0,0,0.0)); }
  100% { filter: brightness(1) saturate(1) drop-shadow(0 0 0px rgba(0,0,0,0.0)); }
}

#menu{
	position:absolute;
	left:160px;
	top:90px;
}

#menu a{
	display:inline-block;
	text-decoration:none;
	color:var(--textLo);
	vertical-align:middle;
	margin:3px 0 0 0;
	text-shadow: 0 0 10px black;
	padding: 4px .5rem ;
    margin-top: 0px;
}

#menu a:hover{
	color:var(--skyBlue);
	transition: 200ms linear;
}

#menu a.selected{
	color:var(--skyBlue);
	text-shadow: 0 0 10px black;
	/*background-color:#000000dd;*/
	/*max-width:calc(100% - 31px);*/
}

#menuMobileBurger{
	display:none;
}

#menuMobile {
	display:inherit;
}


#menuAdmin, #menuAdmin ul{vertical-align:middle;font-size:18px;margin:0;padding:0;list-style:none;display:inline-block;}
#menuAdmin:after{content:'';clear:both;}
#menuAdmin li{float:left;position:relative;width:auto;}

#menuAdmin > li:nth-of-type(8) img[src$=".svg"],
#menuAdmin > li:nth-of-type(9) img[src$=".svg"]{
	height:15px;
	filter: grayscale(1) drop-shadow(2px 4px 6px black);
}

#menuAdmin > li:nth-of-type(8) img[src$=".svg"]:hover,
#menuAdmin > li:nth-of-type(9) img[src$=".svg"]:hover{
	filter: none;
}


#menuAdmin ul a{min-width:150px;}
#menuAdmin ul{visibility:hidden;opacity:.0;position:absolute;top:30px;right:0;width:150px;z-index:1;transition: all .3s ease-in-out;box-shadow: 0 0 10px -2px black;	border-radius:0 0 15px 15px;}
#menuAdmin ul:last-child{border-radius:0 0 15px 15px;}
#menuAdmin li:hover>ul{visibility:visible;opacity:1;margin:0;}
#menuAdmin ul ul{top:0;left:100%;margin:0 0 0 60px;float:none;display:block;clear:both;}
#menuAdmin ul li{float:none;border-bottom: thin #697861 dotted;}
#menuAdmin ul:last-child li:last-child{border-radius: 0 0 15px 15px;}
#menuAdmin ul:last-child li:last-child a{border-radius: 0 0 15px 15px;}
#menuAdmin ul.subMenu{
	background-color:#232327CC;
	margin-top:-5px;
	/*overflow:hidden;*/
	border-left:1px black solid;
	border-bottom:1px black solid;
	border-right:1px black solid;
	width:auto;
}





/*--- page slots --------------------------- */



.naslovPoglavja {
    font-family: Rajdhani;
    color: var(--skyBlue);
    font-size: 40px;
    font-weight: 600;
    margin-top: 5px;
    text-shadow: 0 0 8px black;
    letter-spacing:5px;
    text-align:center;
}




/*--- slot 1 --------------------------- */

.sl1 {
    margin: 0;
    position: relative;
    text-align: center;
    height: 680px;
}

.sl1 > img:nth-of-type(2){
	position:absolute;
	top:0px;left:0px;
}
.sl1_naslov {
    font-family: rajdhani;
    font-size: 58px;
    color: var(--skyBlue);
    position: absolute;
    top: 180px;
    width: 100%;
    font-weight: 600;
    text-shadow: 0 5px 9px black;
    letter-spacing: 3px;
}

.sl1_podnaslov{
    font-size: 30px;
    color: var(--textHi);
    font-weight: 500;
    text-shadow: 0 0 10px black;
    letter-spacing:0px;
}

.blinkKurzor::after {
  content: '❚';
  animation: blink 0.8s infinite;
}

@keyframes blink {
  50% { opacity: 0; }
}
.noBlinkKurzor::after {
  content: '❚';
  opacity:0;
}


.sl1_menu{
    font-size: 20px;
    color: var(--textHi);
    font-weight: 500;
    text-shadow: 0 0 10px black;
    position: absolute;
    bottom: 20px;
    left:20px;
}
.sl1_menu>a{
    border: 1px var(--skyBlue) solid;
    border-radius: 30px;
    color: var(--textHi);
    background-color: var(--backHi);
    padding: 10px;
    font-size: 16px;
}

.sl1_menu>a:hover {
    box-shadow: 0 0 10px -2px white;
}

.sl1_Reklama{
    width: 370px;
    height: 165px;
    position: absolute;
    bottom: 20px;
    right: 20px;
    filter: drop-shadow(2px 4px 6px black);    
}





/*--- slot 2 --------------------------- */
.home_sl2 {
    margin: 0;
    background-color: var(--backLo);
    text-align: center;
}

.home_sl2_oblacek {
    position: relative;
    display: inline-block;
    width: 530px;
    height: 300px;
    background-color: var(--backHi);
    margin: 20px;
    border: 1px var(--border) solid;
    padding: 20px;
}

.levo{
	border-radius:10px 0 0 10px;
}
.desno{
	border-radius:0 10px 10px 0;
}

.home_sl2_oblacek>img{
    position: absolute;
    top: 15px;
    left: 15px;
}

.home_sl2_oblacek>.naslov {
    color: var(--skyBlue);
    position: absolute;
    top: 20px;
    left: 106px;
    width:445px;
    font-size: 20px;
    font-weight: 600;
    text-align:left;
}

.home_sl2_oblacek>.text{
    color: var(--textLo);
    position: absolute;
    top: 50px;
    left: 106px;
    width:445px;
    font-size: 15px;
    font-weight: 300;
    text-align:left;
}

.home2{
	position:absolute;
	bottom:20px;
	left:100px;
}







/*--- slot3 --------------------------- */

.home_sl3, .forBusinesses_sl3{
    margin: 0;
    background-color: var(--backHi);
    text-align: center;
    position:relative;
}

.home_sl3_oblacek {
    display: inline-block;
    width: 170px;
    height: 200px;
    background-color: var(--backLo);
    margin: 10px;
    border: 1px var(--border) solid;
    padding: 20px;
    border-radius:20px;
    text-align:center;
    vertical-align:top;
}


.home_sl3_oblacek>.naslov {
    color: var(--textHi);
    font-size: 20px;
    font-weight: 600;
    margin-top:5px;
}

.home_sl3_oblacek>.text{
    color: var(--textLo);
    font-size: 15px;
    font-weight: 300;
}





/*--- forBusinesses slot2 --------------------------- */

.forBusinesses_sl5 {
    background-color: var(--backHi);
}


.forBusinesses_sl2>.text,
.forBusinesses_sl4>.text,
.forBusinesses_sl5_levo>.text,
.forBusinesses_sl6_levo>.text,
.forIndividuals_sl2>.text{
    color: var(--textLo);
    font-weight: 300;
    margin:10px;
}


.forBusinesses_sl5_levo, .forBusinesses_sl6_levo{
    display: inline-block;
    vertical-align: top;
    width: 430px;
    margin: 10px 10px 10px 30px;
}

.forBusinesses_sl5_levo>img, .forBusinesses_sl3_desno>img, .forBusinesses_sl6_levo>img, .mnenja{
	border-radius:20px;
}

.forBusinesses_sl5_desno, .forBusinesses_sl6_desno {
    display: inline-block;
    vertical-align: top;
    margin: 10px;
    width: 780px;
}



/*--- forBusinesses slot 3 --------------------------- */





.forBusinesses_sl3_oblacek {
    display: inline-block;
    width: 1080px;
    min-height: 100px;
    background-color: var(--backLo);
    margin: 10px;
    border: 1px var(--border) solid;
    padding: 20px;
    border-radius: 20px;
    text-align: left;
    vertical-align: top;
}

.forBusinesses_sl3_levo{
	display:inline-block;
	width:100px;
	vertical-align: top;
}
.forBusinesses_sl3_sreda{
	display:inline-block;
	width:500px;
	vertical-align: top;
}

.forBusinesses_sl3_desno{
	display:inline-block;
	width:430px;
	vertical-align: top;
	margin-left:20px;
}



.forBusinesses_sl3_levo{
	vertical-align:top;
}


.forBusinesses_sl3_levo>img {
    top: 20px;
    left: 20px;
    display: inline-block;
}

/*.forBusinesses_sl3_desno>img .forBusinesses_sl6_levo>img{
	border-radius:20px;
}
*/


.forBusinesses_sl3_sreda>.naslov {
    /* position: absolute; */
    top: 20px;
    left: 100px;
    color: var(--textHi);
    font-size: 20px;
    font-weight: 600;
    margin-top: 5px;
    display: block;
    width: 500px;
}


.forBusinesses_sl3_sreda>.text {
    /* position: absolute; */
    top: 55px;
    left: 100px;
    color: var(--textLo);
    font-size: 15px;
    font-weight: 300;
    display: block;
    width: 500px;
}




/*--- noga --------------------------- */
.noga{
	width:100%;
	position:absolute;
	bottom:0;
	text-align:center;
	font-size:12px;
}