JSFiddle - React, Tailwind, and code Playground

HTML

<?php
$page_title = 'Igralnica';
include ('izgradnja/glava_zgornja_vrstica.html');
?>

		<script>		/* funkcija scrollWindow() - klik na sličico igre pomakne pogled na vrh y = 120px */
		function scrollWindow()
		  {
		  var top = document.getElementById('okvir').clientTop;
		  window.scrollTo(0, 120);
		  }
		</script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> <!--Vključi jQuery -->
<script>	
$(document).ready(function(){
	$("h3").click(function(){
		if($(".p_igra, .p_igra_tipke").is(":hidden")) {
		  	$(this).nextAll().toggle(600); // this=h3, all the following sibling objects...
		  	$(this).css("color","#ffda88");
			$(this).text(function () {
		    	return $(this).text().replace("...", ""); // odstrani tri pike
				});
		} else {
			$(this).nextAll().toggle(600); // this=h3, all the following sibling objects...
			$(this).append("...");    //tole dodaj :)
		 	$(this).css("color","#e4e4e4");
			} 
	});
});
</script>

<div id="okras_zgoraj_levo">
<img src="slike/okras_zgoraj_levo2.png" alt="" width="240" height="140" border="0">
</div>

<div id="h1_naslov">
	<h1><a class="hlink_1" href="index.php" title="Domov">&lt;...</a> Igralnica</h1>
</div>

<div id="okras_zgoraj_desno">
<img src="slike/okras_zgoraj_desno2.png"  alt="" width="240" height="140" border="0">  
</div>


<div id="prvi_sklop">
<h2 class="h2_podnaslov" style="text-align:center">Imenitne računalniške igre za razgibavanje prstov in možganov.</h2> 


<div class="wrap_igra">
    <iframe class="iframe_igra" name="igralni_okvir" align="bottom" scrolling="no" frameborder="0">
    </iframe>
</div>


<script type="text/javascript" src="wpscripts/prikazi_skrij_div.js"></script>

<div class="prikazi_skrij_okvir">
<h2><a class="hlink_1" href="#prikazi_skrij_tekst" onclick="prikazi_skrij_div('prikazi_skrij_tekst')"> <!-- funkcija - prikazi_skrij_div iz datoteke prikazi_skrij_div.js -->
Pozitivni in negativni učinki računalniških iger
</a></h2>

<div...

CSS

a:link {color:#ffda88;}
a:visited {color:#ffda88;}
a:hover {color:#d55f4f;}
a:active {color:#d55f4f;}
a.hlink_1:link {color:#ffda88;}
a.hlink_1:visited {color:#ffda88;}
a.hlink_1:hover {color:#d55f4f;}
a.hlink_1:active {color:#ffda88;}
a.hlink_2:link {color:#d55f4f;}
a.hlink_2:visited {color:#d55f4f;}
a.hlink_2:hover {color:#ffda88;}
a.hlink_2:active {color:#d55f4f;}

h1 { 
color:#ffda88;
font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif; font-size:26px;
}

.hlink_1 { 
text-decoration:none;
}

.navigator2 { 
color:#ffda88;
font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif; font-size:16px;
}

h2 { 
color:#e4e4e4;
text-align: center;
font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif; font-weight:700; font-size:22px;
}

body {
margin: 0px; padding: 0px;
background-color:#404e60;
background-repeat:repeat; background-position:top center; background-attachment:fixed; /* parametri za sliko ozadja */
}

#okvir {	/* mrežna postavitve 960px - 20 /15 200 15/15 200 15/15 200 15/15 200 15/ 20 - */
display: table;
border-collapse: collapse;
left:0px;top:0px;
width:960px;
background-color:#404e60;
text-align:left; margin-left:auto; margin-right:auto; position:relative;
}

#naslovnica {
height:140px;
}

.menu_prvi { 
width:960px; 
height:24px; padding-top:5px; /* h=30px */
border-bottom-style:solid; border-bottom-width:1px; border-color: #7995b2;
background-color: #404e60;
font-family: "Trebuchet MS", Helvetica, sans-serif; font-size: 12px;
}

.menu_prvi ul {
list-style-type:none;
margin:0; padding:5px 0px 5px 0px;
overflow:hidden;		/*specifies what happens if content overflows an element's box */
}

.menu_prvi li {
float:left;
width:160px;
text-align: center;
}

.menu_prvi a {
padding-left:15px; width:130px; padding-right:15px; /* š=160px */
display:inline;
text-decoration:none;
}

.menu_drugi { 
width:960px; 
height:24px; padding-top:5px; border-bottom-width:1px; /* v=30px */
border-bottom-style:solid; border-color:...