#image1, #image2{
width:46%;
border:3px solid #f4ac42;
background: white;
text-align: center;
-webkit-box-shadow: 0 8px 6px -6px #32343a;
  -moz-box-shadow: 0 8px 6px -6px #32343a;
  box-shadow: 0 8px 6px -6px #32343a;
  
}

img{
	max-width:60%;
	height:auto;
	text-align: center;
}


button.advantage{
	
	width:100%;
	margin:2% 0 0 0;
	background:#16a79d;
	font-size: 1.5em;
}

button.disadvantage{
	
	width:100%;
	margin:2% 0 0 0;
	background:#cf4858;
	font-size: 1.5em;
}

#bar {
 background:#f4ac42;
 border-bottom:1px dashed #4d505b!important;
}

#bar h1{
color:#4d505b;
}

textarea{
width:100%;
height:90px;
margin:0 0 .4% 0;
}

.categories{
	margin:0 0 2.4% 0;
	height:95px;
	background-color:#16a79d; 
	border-bottom: 1px dashed #f4ac42;
}

.dis_categories{
	margin:0 0 2.4% 0;
	height:95px;
	background-color:#cf4858; 
	border-bottom: 1px dashed #f4ac42;
}
::-webkit-input-placeholder { /* WebKit browsers */
    color:    #32343a;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
   color:    #32343a;
   opacity:  1;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
   color:    #32343a;
   opacity:  1;
}
:-ms-input-placeholder { /* Internet Explorer 10+ */
   color:    #32343a;
}
#showAnswers{
float: right;
margin-right: 3%;
/*visibility:hidden; hide answers button*/
}

#answers{

	display:none;
}
.answer{

	margin:0 0 1.25% 0;
	height:96px;
	background-color:#16a79d; 
		overflow:auto;
	}
	
.dis_answer{

	margin:0 0 1.25% 0;
	min-height:96px;
	height: auto;
	background-color:#cf4858; 
		overflow:auto;
	}

.dis_categories p, .categories p{
	font-size: 1.1em;
	padding:3%;
	overflow:auto;
	color:#fff;
}

.dis_answer p, .answer p{
	font-size: .9em;
	line-height: 1.3em;
	padding:2%;
	color:#fff;

}