/* latin */
@font-face{font-family:'Audiowide';font-style:normal;font-weight:400;src:local('Audiowide Regular'), local('Audiowide-Regular'), url(audiowide.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;font-display: swap;}
/* latin */
@font-face{font-family:'Roboto';font-style:normal;font-weight:400;src: local('Roboto'), local('Roboto-Regular'), url(roboto.woff2) format('woff2');unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;font-display: swap;}

*{margin:0;padding:0}
html{box-sizing:border-box;/*font:87.5%/1.4 HelveticaNeue, "Helvetica Neue", Helvetica, Arial, sans-serif;*/}
body{font:96%/1.5 Roboto, "Roboto", Arial, sans-serif;color:#dfe3ee;background:#fff url('bg.jpg') fixed}
*, *:before, *:after{box-sizing:inherit;}
.container{width:90%;margin:0 auto;}
h1{color:#fff;text-transform:uppercase;font-size:1.3em}
h2{color:#fff;margin:2% 0;text-transform:uppercase;font-size:1.2em}
.clear{clear:both;width:100%}
a{text-decoration:none;color:#fff}

.articol{text-align:justify;background:#284E7A;padding:2%;margin:20px 10px 10px 10px;border:1px solid #6077AB}
.articol img{width:30%;height:auto;float:left;margin-right:2%;margin-bottom:2%;clear:left}

.wrapper img{width:100%;height:240px;float:left;margin-bottom:10px;object-fit:cover;}
.wrapper{list-style:none;margin:10px auto;padding:0;display:grid;grid-template-columns:1fr 1fr 1fr 1fr;grid-template-rows:auto;grid-auto-flow:dense;}
/*@media (min-width: 460px) {
.wrapper{grid-template-columns:1fr 1fr}
.text{grid-column:1 / 3}
}
@media (min-width: 660px) {
.wrapper{grid-template-columns:1fr 1fr 1fr 1fr}
.text{grid-column:2 / 4;grid-row:2 / 3}
.wide{grid-column:auto / span 2}
.wide1{grid-column:auto / span 4}
}*/

.wrapper a{margin:10px;padding:10px;background:#284E7A;word-wrap:break-word;border:1px solid #6077AB;text-align:left!important}
.wrapper a:hover{background:#6077AB;}
.wrapper a:nth-child(3n+0){grid-column:auto / span 4}
.wrapper a:nth-child(2n+0){grid-column:auto / span 2}
.wrapper a:nth-child(4n+1){grid-column:auto / span 1}	

@media all and (max-width: 960px) {
.wrapper{grid-template-columns:1fr}
.wrapper a:nth-child(3n+0){grid-column:auto}
.wrapper a:nth-child(2n+0){grid-column:auto}
.wrapper a:nth-child(4n+1){grid-column:auto}
.wrapper img{width:100%;height:auto}

}



/* -- navigatie top --*/
nav{margin-bottom:1.5%;}
.navtop{overflow:hidden;background:#284E7A;position:relative;z-index:2!important;border-bottom:1px solid #6077AB}
.navtop a{float:left;display:block;color:#ddd;text-align:center;padding:1.5% 0.5%;font-weight:500;letter-spacing:1px;text-transform:uppercase;width:16.666%;text-align:center;font-size:90%}
.navtop a:hover{color:#fff;background:#6077AB;}
.navtop a.icon{display:none}
.navtop .dropdown-content{display:none;overflow:auto;z-index:1;text-align:left}
.navtop .show{display:block;z-index:1;width:96%;padding:2%}
.navtop a.close{float:right;cursor:pointer;border-right:none}
/* responsive */
@media all and (max-width:960px){
.navtop{width:100%}
.navtop a{display: none;}
.navtop a{width:100%}
.navtop a.icon{display:block;color:#ddd}
.navtop a.icon:hover{display:block;color:#ddd}
.navtop.responsive{position:relative;}
.navtop.responsive .icon{display:block;}
.navtop.responsive a{float:none;display:block;text-align:center;font-size:100%}
.navtop .dropdown-content{position:relative}
}


.logo{background:url('logo.png') no-repeat center;min-height:100px;text-align:center;margin:0 10px}

.titlu{background:#284E7A;text-align:center;margin:0 10px;padding:1.5%;border:1px solid #6077AB}
.titlu:hover{background:#6077AB}
.desc{font-size:90%;font-style:italic;color:#888;margin-top:2%}

#player, fb-video{position:relative;padding-bottom:56.25%;padding-top:25px;height:0;}
#player iframe, .fb-video iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:none;}

.pagination{display:block;margin:10px;text-align:center} 
.pagination a{font-size:90%;display:inline-block;padding:1% 1.5%;text-decoration:none;transition:background-color .3s;background:#284E7A;border:1px solid #6077AB}
.pagination a.active{background-color:#6077AB;color:#ddd;font-weight:700}
.pagination a.disabled{display:none}
.pagination a:hover:not(.active){background-color:#6077AB;color:#eee}
/* responsive */
@media all and (max-width: 960px){
.pagination, .pagination a, .pagination a.active{padding:1% 0;width:100%;display:block;text-align:center;margin-bottom:2%}
}

.footer{background:#284E7A;display:block;margin-top:10px;text-align:center;padding:1.5% 0;border-top:1px solid #6077AB} 
/* cautare */
.footer form{float:left;width:100%;}
.footer input{border:none;padding:1%;width:70%;background:#6077AB;color:#fff}
.footer button{background:#6077AB;border:none;padding:1%;cursor:pointer;width:18%;color:#fff;font-weight:700;border:1px solid #6077AB}
.footer button:hover{background:#284E7A;border:1px solid #6077AB}
/* responsive */
@media all and (max-width: 960px){
.footer input, .footer button{width:100%;text-align:center}
}

/*-- up ---*/
#up{display:none;position:fixed;bottom:0.5%;right:0.5%;z-index:99;border:none;outline:none;background-color:#6077AB;color:#fff;cursor:pointer;padding:15px;border-radius:4px;border:1px solid #6077AB}
#up:hover{background:#284E7A;border:1px solid #6077AB}