@import url("https://fonts.googleapis.com/css?family=Roboto|Audiowide");
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,figure{margin:0;padding:0;border:0;outline:0;font-weight:inherit;font-style:inherit;font-family:inherit;vertical-align:baseline}:focus{outline:0}ol,ul,li{list-style-type:none}table{border-collapse:separate;border-spacing:0}caption,th,td{text-align:left;font-weight:400}
/* End Reset defaults (no need to edit above this line)*/

html{font-size:95%}
body{font-size:1em;line-height:1.5;font-weight:400;font-family:'Roboto', sans-serif;color:#000;background:#fff}
/* responsive */
@media all and (max-width:960px){
html{font-size:110%}
}

a{text-decoration:none;cursor:pointer;color:#007;outline:none;}
a:hover{color:#063}

p{margin-bottom:1%}
.clear{clear:both;width:100%}

.container{width:96%;margin:0 auto;padding:1% 2%;text-align:center}
.box{width:60%;margin:0 auto;padding:2%;margin-top:0.5%;margin-bottom:0.5%;text-align:center}
/* responsive */
@media all and (max-width:960px){
.box{position:relative;width:98%;padding:1%}
}

h1{font-size:1.8em;line-height:1.5em;font-family:"Audiowide";margin-bottom:2%;color:#c00}
h2{font-size:1.6em;line-height:1.5em;}

/* -- navigatie top --*/
.navtop{overflow:hidden;border:1px solid #ddd;background:#fff;margin:2% 0;position:relative}
.navtop a{float:left;display:block;color:#000;text-align:center;padding:2%;font-weight:500;letter-spacing:1px;text-transform:uppercase;width:21%}
.navtop a:hover{color:#fff;background:#333;}
.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:96%}
.navtop a.icon{display:block;color:#8f0000}
.navtop a.icon:hover{display:block;color:#deff4a}
.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}
}

/*-- login --*/
.login{text-align: center;width:40%;margin:0 auto;border:1px solid #ddd;padding:2%;margin-top:2%;margin-bottom:2%}
.camp{border-bottom:1px solid #ddd;padding-bottom:2%;margin-bottom:2%}
.login input, .login textarea, .login button, .login select{border:1px solid #ddd;padding:2%;width:95%;background:#fafafa}
.login input[type=submit], .login button{border:none;padding:2% 4%;background:#333;color:#eee;cursor:pointer;font-weight:700;}
.login input[type=submit]:hover{background:#eee;color:#333;}
a.log{float:left;display:block;background:#eee;color:#333;padding:1% 3%;margin-right:2%}
a.log:hover{background:#333;color:#eee;}
.share{display:block;word-wrap:break-word}
/* responsive */
@media all and (max-width: 960px) {
.login{width:96%;padding:2%;border:none}
.login input[type=submit], .login button{width:100%;padding:2%;}
a.log{width:94%;margin-bottom:2%}
}

/*-- coloane egale --*/
.rowequal{display:flex;flex-wrap:wrap;}
.col8{flex-grow:1;line-height:1em;text-align:center}
.col8{flex-basis:1%;padding:0.5% 0;border-right:1px solid #ddd;border-bottom:1px solid #ddd;border-top:1px solid #ddd;}
.col8:nth-of-type(8n+0){border-right:none}
.col8 input[type=submit], .col8 input{border:none;padding:2% 4%;cursor:pointer;background:#fff;}
.rosu{color:#c00;margin:0;padding:0}
.verde{color:#090;margin:0;padding:0}
.txt_c{text-align:center}
.txt_u{text-transform:uppercase}
/* responsive */
@media all and (max-width: 960px) {
.col8{flex-basis:96%!important;padding:2%;border-right:none;}
}

.pagination a{font-size:90%;float:left;padding:8px 16px;text-decoration:none;transition:background-color .3s}
.pagination a.active{background-color:#f6f6f6;color:#06b;font-weight:700}
.pagination a.disabled{display:none}
.pagination a:hover:not(.active){background-color:#f6f6f6;color:#000}
/* responsive */
@media all and (max-width: 960px){
.pagination, .pagination a, .pagination a.active{padding:1% 0;width:100%;display:inline;text-align:center;margin-bottom:2%}
}