#clear{
clear: both;
}

#button1, #button2 {
width: 90px;
border:1px solid #d22a00;
-webkit-box-shadow: #A2A3A3 7px 7px 7px  ;-moz-box-shadow: #A2A3A3 7px 7px 7px ; box-shadow: #A2A3A3 7px 7px 7px  ; 
-webkit-border-radius: 3px; 
-moz-border-radius: 3px;
border-radius: 3px;
font-size:12px;
font-family:arial, helvetica, sans-serif;
font-style: normal; 
padding: 7px 10px 7px 10px; 
margin: 25px 0 3px 340px;
text-decoration:none; 
display:inline-block;
font-weight:bold; 
color: #FFFFFF;
background-color: #FF3C0B; background-image: -webkit-gradient(linear, left top, left bottom, from(#FF3C0B), to(#6d0019));
background-image: -webkit-linear-gradient(top, #FF3C0B, #6d0019);
background-image: -moz-linear-gradient(top, #FF3C0B, #6d0019);
background-image: -ms-linear-gradient(top, #FF3C0B, #6d0019);
background-image: -o-linear-gradient(top, #FF3C0B, #6d0019);
background-image: linear-gradient(to bottom, #FF3C0B, #6d0019);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#FF3C0B, endColorstr=#6d0019);
text-shadow: 0 -1px 1px rgba(0, 0, 0, 0.4);
-webkit-box-shadow: 3px 2px 10px 4px rgba(0,0,0,0.54);
-moz-box-shadow: 3px 2px 10px 4px rgba(0,0,0,0.54);
box-shadow: 3px 2px 10px 4px rgba(0,0,0,0.54);
display: none;
}

#button1:hover, #button2:hover {
width: 92px;
 border:1px solid #21a421;
 padding: 7px 7px 7px 13px; 
 background-color: #2AF738; background-image: -webkit-gradient(linear, left top, left bottom, from(#2AF738), to(#0F2B10));
 background-image: -webkit-linear-gradient(top, #2AF738, #0F2B10);
 background-image: -moz-linear-gradient(top, #2AF738, #0F2B10);
 background-image: -ms-linear-gradient(top, #2AF738, #0F2B10);
 background-image: -o-linear-gradient(top, #2AF738, #0F2B10);
 background-image: linear-gradient(to bottom, #2AF738, #0F2B10);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#2AF738, endColorstr=#0F2B10);	
}

#button2 {
	margin: 5px auto;
	display: block;
}

#kontener {
margin: 0;
background: #E8FFE0;
background: radial-gradient(circle, black, white);
border: 6px ridge #222;
background-image: url('../img/kwadrat.png');
background-repeat: repeat;
border: 5px ridge #EE5;
position: absolute;
right: 0px;
bottom: 0px;
overflow: auto;
}


#p1, #p2, #p3, #p4 { 
position: relative; 
left: 30px; 
top: -35px; 
width: 620px; 
height: 40px; 
border: 1px solid black;
cursor: pointer;
border-radius: 10px;
padding: 5px 10px;
text-align: center;
background: #F66; 
color: #003;
font-weight: bold;
-webkit-box-shadow: 2px 1px 3px 2px rgba(0,0,0,0.54);
-moz-box-shadow: 2px 1px 3px 2px rgba(0,0,0,0.54);
box-shadow: 2px 1px 3px 2px rgba(0,0,0,0.54);
zIndex: 100;
}

#p2 { 
background: #8F8; 
}

#p3 {  
background: #FF8; 
}

#p4 { 
background: #66F; 
}

#pt1, #pt2, #pt3, #pt4 {
position: relative; 
left: 27px; 
top: 10px; 
width: 700px; 
height: 53px;
background: #EED;
background: radial-gradient(circle, #a00, #800, #600, #400, #100);
color: #FED;
font-weight: bold;
border: 2px ridge #677;
border-radius: 12px;
padding: 5px;
text-align: center;
zIndex: 2;
}

#pt2 {
top: 15px;
}

#pt3 {
top: 20px;
}

#pt4 {
top: 25px;
}

#droppable {
position: relative;   
top: 30px;  
width: 730px; 
height: 60px; 
border: 2px solid #9C9; 
border-radius: 5px;
background: #CFC;
margin: 10px auto;
zIndex: 1;
}

#content_test, #tytul {
width: 770px;
height: 620px;
margin: 0px auto;
background: #489;
border: 4px ridge #931;
border-radius: 5px;
background: radial-gradient(circle, #ed8, #c62, #600, #400, #200);
}

#tytul {
margin: 0 auto 0 auto;
height: 50px;
}


#p_odpowiedz {
margin: 10px auto;
text-align: center;
font-size: 13px;
font-family: Cambria, Georgia, serif;
}

#div_pytanie {
width: 730px;
height: 75px;
margin: 5px auto 0 auto;
padding: 5px 10px 5px 10px;
text-align: left;
font-size: 1.1em;
font-weight: bold;
font-family: "Comic Sans MS", cursive, sans-serif;
color: #006;
border: 2px ridge #E46;
border-radius: 10px;
background: #EFC;
}

#ozdobnik_l, #ozdobnik_p {
width: 30px; 
height: 30px; 
background: #EEd;
position: relative;
top: -30px;
left: -15px;
border-radius: 5px;
border: 1px ridge #CCC;
border-right: none;
text-align: left;
font-size: 1.6em;
padding: 0px 5px 3px 5px;
font-weight: bold;
font-family: "Comic Sans MS", cursive, sans-serif;
zIndex: 1000;
}

#ozdobnik_p {
left: 550px;
top: -60px;
border: 1px ridge #CCC;
border-left: none;
text-align: right;
}

#p_droppable {
text-align: center;
font-size: 1.3em;
padding: 10px 15px;
font-weight: bold;
font-family: "Comic Sans MS", cursive, sans-serif;
color: #005;
}


#div_numeracja, #div_button {
	width: 30px;
	height: 30px;
	position: absolute;
	top: 15px;
	border-radius: 8px 0 0 8px;
	background: #400;
	border: 1px ridge #200;
	color: #FED;
	font-weight: bold;
	font-family: "Comic Sans MS", cursive, sans-serif;
	font-size: 1.3em;
	text-align: center;
}

#div_button {
	width: 220px;
	height: 180px;
	padding: 5px 10px;
	top: 12px;
	left: 8px;
	font-size: 0.8em;
	font-weight: normal;
}

#div_info {
	width: 740px;
	height: 100px;
	margin: 30px auto 0 auto;
	padding: 5px 10px;
	position: relative;
	top: 12px;
	left: 8px;
	font-size: 0.8em;
	font-weight: normal;
	color: #DFE;
}