#viewport{
	width: 100%; /* Defines the size of the visible part of the carousel
		Attention : if you only want to see plain items in the viewport,
		the width of the viewport should take into account of :
		- the items width
		- the right and left padding of items
		- the number of items you want to see in the viewport
	 */
	overflow:hidden; /* Hides extra elements, those outside the viewport area */
	
}
#viewport ul{
	position: relative; /* Enables positionning of elements inside viewport */
	padding: 0; margin:0px; overflow:hidden; /* Resets default - User Agent - style */
}
#viewport li{
	width: 720px; /* Defines the size of inner element */
	overflow:hidden;
	float: left; /* Places list items side by side*/
	list-style: none; /* Resets default - User Agent - style */
	
	/* Cosmetic */
	padding: 10px 0;
	
	
}

/* Cosmetic */
.buttons_container{ margin:20px 0 20px 0px; overflow:hidden; font-family:'fontawesome'; font-size:36px;}
.buttons_container *{  display: inline-block; margin-right: 6px;}

#simplePrevious{ border: 3px solid #fff; cursor: pointer; height: 40px; width: 40px; text-align:center;}
#simplePrevious:before{ content: "\f104";}

#simpleNext{ border: 3px solid #fff; cursor: pointer; height: 40px; width: 40px; text-align:center;}
#simpleNext:before{ content: "\f105";}
#simpleNext:hover, #simplePrevious:hover{ background:#fff; color:#000;}