vennsoh

/* Sphere */
.container {
	width: 220px;
	height: 220px;
	text-align: center;
	border-radius: 50%;
	position: relative;
	cursor: default;
	box-shadow: inset 0 0 0 16px rgba(0,0,0,.5);
	transition: all 0.4s ease-in-out;

vennsoh

/* Sphere */
.container {
	position: relative;
	text-align: center;
	width: 220px;
	height: 220px;
	text-align: center;
	border-radius: 50%;
	cursor: default;
	box-shadow: inset 0 0 0 16px rgba(0,0,0,.5);

vennsoh

body{
	height:100%;
}
.container{

	position: relative;
	width: 300px;
	height: 300px;

vennsoh

body, html {
 height: 100%;   
}
.container{
    position: relative;
    width: 300px;
    height: 300px;
    background-color: red;

vennsoh

 body{
	height:100%;
}
.container{

	position: relative;
	width: 300px;
	height: 300px;

vennsoh

/* Sphere2 */
.container {
	width: 220px;
	height: 220px;
	text-align: center;
	border-radius: 50%;
	position: relative;
	cursor: default;
	box-shadow: inset 0 0 0 16px rgba(0,0,0,.5);
	transition: all 0.4s ease-in-out;

vennsoh

/**
 * The first commented line is your dabblet’s title
 */

.container{		
text-align:center;

vennsoh

/**
 * The first commented line is your dabblet’s title
 */

.container{		
text-align:center;

vennsoh

/**
 * The first commented line is your dabblet’s title
 */

.container{		
text-align:center;

vennsoh

/* Sphere2 */

body{
	height: 100%;
}

.container {
	top:50%;
	margin:auto;
	margin-top:-110px;