@font-face {
font-family: 'feat_film';
src: url('entsani.ttf') format('truetype');

}
@font-face {
font-family: 'pira';
src: url('car.ttf') format('truetype');

}

@font-face {
font-family: 'down';
src: url('dwld.ttf') format('truetype');

}

@font-face {
font-family: 'chan';
src: url('char.ttf') format('truetype');

}


@font-face {
font-family: 'developer';
src: url('win_pro.ttf') format('truetype');

}

body {
    background-color: black;
    text-align: center;
height: 100%;

}

h1 {
color : white;
font-family: feat_film;
font-size: 100px;
margin-bottom: 0;
margin-top: 15px;
}

h2#pira {
color: white;
font-family: pira;
font-size: 50px;

}

.bar {
width: 100%;
height: 10px;
background-color:blue;
margin-bottom:4px;
}

button#btn_dwload{
background-color: green;
border-width: 5px;
border-color: #0b0 green green green;
color: black;
font-family: down;
font-size: 50px;
}

button#btn_dwload:active {
margin-top: 4px;
margin-bottom: -4px;
margin-right: -4px;
margin-left: 4px;

}

td#sq_1 h1{
font-size: 50px;
font-family: developer;
color: black;
}

td#sq_2 h1{
font-size: 30px;
font-family: chan;
}

td#sq_3 h1{
font-size: 30px;
font-family: developer;
}

#sq_1{
color: black;
background-color: orange;
width: 40%;
text-align: center;

}

#sq_2{
color: white;
background-color: grey;


}

#sq_3{
color: white;
background-color: #333;
}

li {
font-size: 20px;

}


#hac_prog {
width: 50%;
background-color: grey;
border: 8px solid grey;
}


#hac_bar {
width: 1%;
height: 30px;
background-image: linear-gradient(to bottom, cyan, navy);
}