
/* SMARTPHONES */
@media only screen and (min-width: 320px) {
	#guestbook header{
		text-align:center;
	}
	#guestbook #comments{
		float:left;
		width: 100%;
	}
	#guestbook #comments ul{
		list-style-type: none;
		margin: 0;
		padding: 0;
	}
	#guestbook #comments ul li{
		background: #f9f9f9;
		border: 1px solid #dfdfdf;
		margin: 0 0 10px 0;
		padding: 5px 10px;
		color:#999;
	}
	#guestbook #comments ul li p{
		font-style: italic;
		color:#333;
	}
	#guestbook #form{
		float:right;
		width: 100%;
	}
	#guestbook fieldset{
		border: 1px solid #dddddd;
		background-color: #efefef;
		padding: 12px;
	}
	#guestbook fieldset label, #guestbook fieldset input{
		display:block;
	}
	
	#guestbook fieldset input, #guestbook fieldset textarea{
		margin: 0 0 10px 0;
		width: 97%;
		padding: 1%;
		font-size: 1em;
	}
	#guestbook fieldset div#cryptographp{
		margin: 0 auto 1em auto;
		width: 80%;
	}
	
	#guestbook fieldset #cryptographp span{
  display: block;
    margin: auto;
    text-align: center;
    width: 200px;
 }
  
 #guestbook fieldset #cryptographp span input{
  margin: 0;
    width: 100%;
	}
	
	#guestbook fieldset input[type=submit]{
		width:50%;
		margin:10px auto 0 auto;
		background-color:#ccc;
		color:black;
		padding: 4px 8px;
		border: 1px solid #bbb;
		cursor: pointer;
		border-radius: 3px;
	}
	#guestbook fieldset input[type=submit]:hover{
		background-color:#ddd;	
	}
}
/* TABLETTES */
@media only screen and (min-width: 768px) {
	#guestbook #comments{
		width: 48%;
	}
	#guestbook #form{
		width: 48%;
	}
}
/* ORDINATEURS */
@media only screen and (min-width: 1024px) {
	#guestbook #comments{
		width: 48%;
	}
	#guestbook #form{
		width: 48%;
	}
}

