@import "reset.css";
@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,400,700&subset=latin-ext');

*{
font-family:'Open Sans', trebuchet ms, arial, sans-serif;	
}

body{
margin:0px;
padding:0px;
text-align:center;
font-size:16px;
overflow-x:hidden;
background-color:black;
}

.content{
width:100%;
min-height:100vh;
position:fixed;
top:0px;
left:0px;
padding:0px;
margin:0px;
box-sizing:border-box;
background:url(../jpg/background.jpg) no-repeat center center;
background-size:cover;
z-index:0;
opacity:0.2;
}

.elements {
    width: 100%;
    height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 0;
    box-sizing: border-box;
    position: relative;
    z-index: 10;
}

.whole-stripe {
    display: flex;
    justify-content: center;
    width: auto;
    margin-bottom: 20px; /* odległość między wierzchołkiem a podstawą */
}

.box{
width:150px;
}

.box img{
width:100%;
border-radius:100%;
cursor:pointer;
transition:all 0.2s;
}

.box:hover img{
filter:brightness(80%);
transition:all 0.2s;
}

.box1 {
    margin-bottom: 10px; /* ustawienie wierzchołka wyżej */
	width:180px;
}

.box2, .box3 {
    width: 85px;
}

.box2 {
    margin-right: 55px; /* oddziela lewy box od prawego */
}

.box3 {
    margin-left: 55px; /* oddziela prawy box od lewego */
}