html, body{
	margin:0;
	min-height:100%;
	height:100%;
	width:100%;
	font-family: 'Poppins', sans-serif;
}

body{

    background-image: url("/img/sport_pozadina.jpg");
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size:cover;
}

h1{
	font-family: 'Poppins', sans-serif;
	font-weight:800;
	margin:0;
	padding:0;
	font-size:1rem;
}

h2{
	font-family: 'Poppins', sans-serif;
	font-weight:600;
	text-align:center;
	font-size:1.5rem;
    margin:0;
	width:fit-content;
	color:inherit;
}

h3{
	font-weight:800;
}

h4{
	font-weight:700;
	font-size:1.1rem;
}

.ekran{
    position:relative;
    width:100%;
    height:100%;
    overflow:hidden;
	color:black;
/*     background-color:black; */
}

.header {
    position:relative;
    top:0;
    min-height:4rem;
    width:100%;
	padding:0;
	display:flex;
	flex-wrap:wrap;
	justify-content:center;
	align-items:center;
	color:#0e1b2c;
/*     border-bottom:2px solid white; */
	z-index:1;
}

.items{
    position:relative;
    width:96%;
    max-width:1700px;
    height:100%;
    padding:0% 2%;
    display:flex;
    flex-wrap:wrap;
/* 	justify-content:center; */
}

.items > div{
    width:fit-content;
    display:flex;
    flex-wrap:wrap;
    justify-content:space-evenly;
    align-items:center;
}

.items > div > .logo{
    position:relative;
    margin-left:-48px;
    max-height:3rem;
    aspect-ratio:1/1;
    display:none;
}

.logo img{
    width:100%;
    height:100%;
    object-fit:contain;
    filter: brightness(0%);
}

.items > div > div{
    display:block;
    /*max-width:calc(25% - 40px); /* za mobitel */
    margin:0 10px;
    padding:7px 10px;
    height:fit-content;
    text-align:center;
    transition:all .1s;
}

.items > div > div:hover{
    border-bottom:3px solid #0e1b2c;
}

.header-link{
    position:relative;
    color:inherit;
    text-decoration:none;
    font-weight:500;
    font-size:20px;
}

.lang-cont{
    position:absolute;
    top:4rem;
    right:10px;
    margin:20px 0;
    z-index:1;
}

.lang-cont > a > img{
    position:relative;
    height:20px;
    display:inline-block;
    margin:0 5px;
}

.crni{
    background-color:#f2f2f2;
    color:white;
}

.pocetni-video{
    position:absolute;
    width:100%;
    height:100%;
}

.pocetni-video > video{
    height:100%;
    width:100%;
    object-fit:cover;
}

.pocetni-cont{
    position:relative;
    width:100%;
    height:100%;
    color:white;
/*     background-color:rgba(0,0,0,0.5); */
    overflow:hidden;
}

.text-prvi{
    position:absolute;
    bottom:-100%;
    width:calc(100% - 20px);
    height:270px;
    padding:10px;
    background-color:rgba(91, 46, 2, 0.2);
/*     color:#5b2e02; */
    color:white;
    text-align:center;
    transition:all 1s;
    overflow:hidden;
}

.glavni-naslov{
    position:absolute;
    bottom:-100%;
    width:calc(100% - 20px);
    max-width:1000px;
    height:190px;
    padding-bottom:100px;
    text-align:center;
    color:inherit;
    transition:all 1s;
}

.glavni-naslov > h1{
    position:relative;
    margin:10px auto;
    font-size:1.8rem;
    font-weight:600;
    color:inherit;
}

.glavni-naslov > p{
    position:relative;
    margin:10px auto;
    font-size:1rem;
    font-weight:500;
    color:inherit;
}

.glavni-naslov > a{
    position:relative;
    display:inline-block;
    margin:20px auto;
    padding:7px 10px;
    font-size:14px;
    font-weight:500;
    color:inherit;
    text-decoration:none;
    border:3px solid white;
    transition:all .2s;
}

.glavni-naslov > a:hover{
    background-color:white;
    color:black;
}

/*.sportovi-ponuda-cont{
    position:relative;
    height:fit-content;
    width:96%;
    max-width:1800px;
    margin:0 auto;
    padding:0 2%;
}*/

.ponuda-dod{
    height:fit-content !important;
    max-height:fit-content !important;
}

.sportovi-ponuda{
    position:relative;
    float:right;
    width:100%;
    height:fit-content;
    margin:15% auto;
    display:flex;
    flex-wrap:wrap;

}

.sportovi-ponuda-pojed{
    position:relative;
    width:100%;
    min-height:490px;
    height:fit-content;
    margin:10% 0px;
    padding:0px;
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    align-items:center;
    text-align:center;
    transition:all .2s;
    font-size:30px;
    text-align:right;
    color:#e9e9e9;
}

.ponuda-pojed-background{
    background: rgba(128,0,33,0.9);
    background: linear-gradient(120deg, rgba(128,0,33,0) 25%, rgba(0,20,117, 1) 63%);
}

.ponuda-pojed-background-reverse{
    background: rgba(0,20,117,0.9);
    background: linear-gradient(120deg, rgba(128,0,33,0) 25%, rgba(0,20,117, 1) 63%);
/*     direction: rtl; */
}

.kartica img{
    position:relative;
    max-width:50%;
    margin:0 auto;
    display:block;
    filter: brightness(0%) invert(1);
    opacity:0.9;
}

.objasnjenje{
    padding:10px;
    display:none;
    transition:all .1s;
}

.objasnjenje > h3{
    font-size:inherit;
    margin-top:50px;
    margin-bottom:0;
    width:100%;
    font-weight:600;
}

.objasnjenje > h4{
    font-size:18px;
    font-style:italic;
    margin-top:5px;
    width:100%;
    font-weight:400;
}

.objasnjenje > p{
    width:100%;
    padding:0 2%;
    font-size:16px;
}

.kartica{
    max-width:100%;
    transition:all .1s;
}

.kartica > h3{
    font-size:inherit;
    font-weight:600;
    text-align:center;
}

.sportovi-ponuda-pojed:hover .objasnjenje{
    display:inline-block;
}

.sportovi-ponuda-pojed:hover .kartica{
    display:none;
}

.team-dod{
    background-image: url("/img/treneri_pozadina.png");
    background-repeat: no-repeat;
/*     background-attachment: fixed; */
    background-size:cover;
/*     background-position:center; */
    height:fit-content;
    color:white;
    padding-top:100px;
}

.team-cont{
    position:relative;
    width:96%;
    height:100%;
    margin:0 auto 20% auto;
    display:flex;
    flex-wrap:wrap;
    justify-content:space-evenly;
/*     backdrop-filter: blur(5px); */
}

.team-cont > h2{
    position:relative;
    width:100%;
    font-size:35px;
    font-weight:600;
    margin:50px 0 50px 0;
    text-align:center;
}

.osobna{
    position:relative;
    width:48%;
    height:fit-content;
    margin:10px 0;
    display:flex;
    flex-wrap:wrap;
    justify-content:space-evenly;
    align-items:center;
    background-color:transparent;

    aspect-ratio: cos(30deg);
    clip-path: polygon(-50% 50%,50% 100%,150% 50%,50% 0);
    background-color: #e6c309;

}

.osobna:hover{
/*  box-shadow: 0 4px 100px 10px rgba(95,15,64,1); */
}

.osobna-slika{
    position:relative;
    width:90%;
    aspect-ratio: cos(30deg);
    clip-path: polygon(-50% 50%,50% 100%,150% 50%,50% 0);
    background-color:#12396d;
/*     background: linear-gradient(0deg, rgba(0,20,117,0) 10%, rgba(0,20,117, 1) 63%); */
/*     background: linear-gradient(135deg, rgba(95,15,64,1) 0%, rgba(49,14,104,1) 100%); */
    /*background-image: url("/img/medalja.png");
    background-repeat: no-repeat;
    background-size:contain;
    background-position:center;*/
}

.osobna-slika > img{
    position:relative;
    width:100%;
    aspect-ratio:1 / 1;
    object-fit:contain;
/*     background-color:#f2f2f2; */
/*     filter: invert(1); */
}

.zrcaljeno{
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
}

.text-osobna{
    position:relative;
    width:85%;
    height:100%;
    margin:0 auto;
    display:flex;
    flex-wrap:wrap;
    align-content:center;
    color:#e6c309;
}

.text-osobna > h3{
    width:100%;
    margin:0px 0 0px 0;
    font-size:22px;
    text-align:center;
    font-weight:600;
}

.text-osobna > p{
    width:100%;
    margin:0% 0;
    font-size:14px;
    text-align:center;
    font-weight:500;
    font-style:italic;
}

.animacija-osobna{
    position:relative;
    width:33%;
    aspect-ratio:1/1;
    display:none;
    flex-wrap:wrap;
    justify-content:center;
    align-items:center;
    align-content:center;
}

.animacija-osobna > img{
    position:relative;
    width:50%;
    height:50%;
    object-fit:contain;
}

.footer-cont{
    position:relative;
    height:fit-content;
    min-height:20%;
    width:100%;
    padding:2% 0 0 0;
    background-color:#0e1b2c;
    color:#e9e9e9;
}

.footer{
    position:relative;
    width:96%;
    max-width:1500px;
    height:fit-content;
    margin:0 auto;
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    text-align:center;
}

.odjeljak{
    margin-top:10%;
}

.odjeljak > p{
    margin:0;
}

.footer-podnaslov{
	position:relative;
	margin:1.2rem 0 0 0 !important;
	padding:0;
	font-weight:700;
}

.footer-link{
    color:white;
    display:block;
	margin:0.5rem 0 1rem 0;
}

.footer-sdrz{
	margin:0.2rem 0 1rem 0 !important;
}

.copyright{
    position:relative;
    width:100%;
    margin:50px 0 20px 0;
    text-align:center;
}

.copyright > p{
    position:relative;
    display:inline-block;
    width:fit-content;
    margin:0 10px;
}

.copyright a{
    color:white;
}


/*#######################################################################################################################################################################################################################*/
/*DESKTOP*/


@media (min-width:961px)  {

    .logo{
        display:block !important;
    }

    .logo:hover{
        background-color:transparent !important;
    }

    .lang-cont{
        top:0;
    }

    .text-prvi{
        left:calc(50% - 630px);
        width:1200px;
        height:330px;
        padding:30px;
    }

    .glavni-naslov{
        left:calc(50% - 500px);
        width:calc(100% - 60px);
        max-width:1000px;
        height:270px;
        padding-bottom:100px;
    }

    .glavni-naslov > h1{
        margin:10px auto;
        font-size:3.3rem;
    }

    .glavni-naslov > p{
        margin:10px auto;
        font-size:1.5rem;
        font-weight:500;
        color:inherit;
    }

    .glavni-naslov > a{
        margin:20px auto;
        padding:7px 10px;
        font-size:18px;
    }

    .ponuda-dod{
        height:100%;
        max-height:100%;
    }

    .sportovi-ponuda{
        height:100%;
        width:55%;
        margin:0;
    }

    .sportovi-ponuda-pojed{
        width:100%;
        font-size:40px;
        margin:50px 0;
        padding:20px;
    }

    .kartica img{
        max-width:100%;
        max-height:256px;
    }

    .objasnjenje > h4{
        font-size:23px;
    }

    .objasnjenje > p{
        font-size:21px;
        padding:0;
    }

    .team-cont{
        width:100%;
        padding:0 0 7% 0;
        margin-bottom:0;
    }

    .team-cont > h2{
        font-size:50px;
    }

    .osobna{
        width:18%;
        justify-content:space-evenly;
        margin:20px auto;
    }

    .osobna-slika{
        width:90%;
    }

    .text-osobna{
        width:85%;
        height:100%;
        margin:0% auto;
    }

    .text-osobna > h3{
        font-size:34px;
        margin-bottom:10px;
    }

    .text-osobna > p{
        font-size:22px;
        margin:0;
    }

    .animacija-osobna{
        display:flex;
    }

    .footer{
        justify-content:space-between;
        text-align:left;
    }

    .odjeljak{
        margin-top:0;
    }

}
