JSFiddle - React, Tailwind, and code Playground

HTML

<body>
	<header>
		<div class="head">
			<div class="polosa1">
			<button class="btnh">HOT BUTTON</button>
			<button class="btnsu">SUNNY BUTTON</button>
			<button class="btnf">FRESH BUTON</button>
			<button class="btnsk">SKY BUTTON</button>
			<button class="btnhs">Hot select</button>
			<button class="btnsus">Sunny select</button>
			<button class="btnfs">Fresh select</button>
			<button class="btnsks">Sky select</button>

			</div>
			<div class="polosa2">
			<button class="btnh">HOT BUTTON</button>
			<button class="btnsu">SUNNY BUTTON</button>
			<button class="btnf">FRESH BUTON</button>
			<button class="btnsk">SKY BUTTON</button>
			<button class="btnhs">Hot select</button>
			<button class="btnsus">Sunny select</button>
			<button class="btnfs">Fresh select</button>
			<button class="btnsks">Sky select</button>

			</div>
			<div class="polosa3">
			<button class="btnh">HOT BUTTON</button>
			<button class="btnsu">SUNNY BUTTON</button>
			<button class="btnf">FRESH BUTON</button>
			<button class="btnsk">SKY BUTTON</button>
			<button class="btnhs">Hot select</button>
			<button class="btnsus">Sunny select</button>
			<button class="btnfs">Fresh select</button>
			<button class="btnsks">Sky select</button>
			</div>
	</header>

CSS

*{
	margin: 0;
}
body {
	background: url(../images/background.jpg)   ;
	background-size:100%;
}
/*----------------------------HEADER---------------------*/
.polosa1 {
	
	margin: 80px 80px 25px 80px;
}

.polosa1 button {
	border-radius:5px ;
	margin-right: 30px;
	height: 53px;
	width: 170px;
	border-top:none;
	border-right: none;
	border-left: none;
}


.polosa1 button:last-child {
	margin-right: 0;
}
.polosa2 {
	display:inline-block;
	margin: 0 80px 25px 80px; 
}	
.polosa2 button {
	border-radius:5px ;
	margin-right: 30px;
	height: 53px;
	width: 170px;
	border-top:none;
	border-right: none;
	border-left: none;
}
.polosa2 button:last-child {
	margin-right: 0;
}
.polosa3 {
	display:inline-block;
	margin: 0 80px 30px 80px;
}
.polosa3 button {
	border-radius:5px ;
	margin-right: 30px;
	height: 53px;
	width: 170px;
	border-top:none;
	border-right: none;
	border-left: none;
}
.polosa3 button:last-child {
	margin-right: 0;
}

.btnh, .btnhs {
	background-color:rgb(219,85,101);
	color:#fff;
	border-color: #AF4451;
}
.btnsu, .btnsus {
	background-color:rgb(244,173,73);
	color:#fff;
	border-bottom-color: rgb(195,138,58);
}
.btnf, .btnfs {
	background-color:rgb(81,191,135);
	color:#fff;
	border-bottom-color: rgb(65,153,108);
}
.btnsk, .btnsks {
	background-color:rgb(11,172,211);
	color:#fff;
	border-bottom-color: rgb(9,138,169);
}