html, body {padding:0; margin:0; height:100%; width:100%; font-family: 'Gentium Basic', serif; min-height:700px; min-width:1200px;}


.entirepage
{
	position:absolute;
	top:0%;
	height:100%;
	width:100%;
	overflow:hidden;
}


.CF_heading
{
	display:inline-block;
	border-radius:50%;
	position:absolute;
	top:25%;
	width:50%;
	height:50%;
	left:25%;
	border-left: 1px solid lightgrey;
	border-top: 1px solid transparent;
	font-size:120px;
	background:white;
		-webkit-box-shadow: -8px 3px 5px -5px grey;

}

.CF_heading_block
{
	background:white;
	display:inline-block;
	border-radius:50%;
	position:absolute;
	top:10%;
	left:5%;
	width:120px;
	height:120px;
		-webkit-box-shadow: -2px -2px 2px -2px lightgrey;
}

.borderTopLeft{
	border-top:1px solid transparent;
	border-left:1px solid transparent;
	border-right:1px solid transparent;	
		-webkit-box-shadow: -4px -4px 3px -2px black;
}
.borderLeft{border-left:1px solid transparent;
		-webkit-box-shadow: -4px 0px 3px -2px black;
}
.borderBottom{ border-bottom:1px solid transparent;	
		-webkit-box-shadow: -1px 4px 3px -2px black;
}

.Rotate1{
	-webkit-animation:rotatingBall 1s; /* Safari and Chrome */	
	-webkit-animation-iteration-count:10;
	-webkit-animation-timing-function:linear; /* Safari and Chrome */	
}
.Rotate2{
	-webkit-animation:rotatingBall 3s; /* Safari and Chrome */	
	-webkit-animation-iteration-count:4;
}
.Rotate3{
	-webkit-animation:rotatingBall2 3s; /* Safari and Chrome */	
	-webkit-animation-iteration-count:5;
	-webkit-animation-timing-function:linear; /* Safari and Chrome */	
}
.Rotate4{
	-webkit-animation:rotatingBall2 5s; /* Safari and Chrome */	
	-webkit-animation-iteration-count:3;
}
/*
.CF_heading_block:hover .Rotate1, .CF_heading_block:hover .Rotate2, .CF_heading_block:hover .Rotate3, .CF_heading_block:hover .Rotate4{-webkit-animation-play-state: paused; }
*/
.CF_heading_inside
{
	display:inline-block;
	border-radius:50%;
	position:absolute;
	top:0px;
	width:100%;
	height:100%;
	left:0%;
	text-align:center;
}

.CF_heading_inside2
{
	display:inline-block;
	border-radius:50%;
	position:absolute;
	top:20px;
	width:60%;
	height:60%;
	right:0%;
}

.CF_heading:hover .letter1{ 
	-webkit-animation:animateLetters 1s; /* Safari and Chrome */		
	-webkit-animation-delay:0s;
}
.CF_heading:hover .letter2{ 
	-webkit-animation:animateLetters 1s; /* Safari and Chrome */		
	-webkit-animation-delay:0.3s;
}
.CF_heading:hover .letter3{ 
	-webkit-animation:animateLetters 1s; /* Safari and Chrome */		
	-webkit-animation-delay:0.6s;
}
.CF_heading:hover .letter4{ 
	-webkit-animation:animateLetters 1s; /* Safari and Chrome */		
	-webkit-animation-delay:0.9s;
}
.CF_heading:hover .letter5{ 
	-webkit-animation:animateLetters 1s; /* Safari and Chrome */		
	-webkit-animation-delay:1.1s;
}
.CF_heading:hover .letter6{ 
	-webkit-animation:animateLetters 1s; /* Safari and Chrome */		
	-webkit-animation-delay:1.3s;
}
.CF_heading:hover .letter7{ 
	-webkit-animation:animateLetters 1s; /* Safari and Chrome */		
	-webkit-animation-delay:1.5s;
}
.CF_heading:hover .letter8{ 
	-webkit-animation:animateLetters 1s; /* Safari and Chrome */		
	-webkit-animation-delay:1.7s;
}
.CF_heading:hover .letter9{ 
	-webkit-animation:animateLetters 1s; /* Safari and Chrome */		
	-webkit-animation-delay:1.8s;
}



.CF_heading_text{
	-webkit-animation:showText 15s; /* Safari and Chrome */	
	-webkit-animation-iteration-count:1;
	position:absolute;
	top:25%;
	left:50%;
	height:100px;
	width:400px;
	font-size:50%;	
}

.CF_textbox_container
{
	position:absolute;
	top:45%;
	left:30%;
	padding:5% 0;
	font-size:20px;	
	background:white;
	overflow:hidden;
	height:30%;
}

.CF_textbox:hover .CF_textbox_text{color:black;}
.CF_textbox:hover {-webkit-animation-play-state: paused; }
.CF_textbox a{ color:grey; }

.CF_textbox{
	-webkit-animation:rotateText 10s; /* Safari and Chrome */	
	-webkit-animation-iteration-count:1;
	-webkit-animation-timing-function:linear; /* Safari and Chrome */	
	position:relative;
	top:0;
	display:block;
	font-size:20px; 
	color:grey;
}

.CF_textbox_cover{
	position:absolute;
	top:0%;
	left:0%;
	width:100%;
	background:white;
	opacity:0.5;
}
.CF_textbox_cover2{
	position:absolute;
	bottom:0%;
	left:0%;
	width:100%;
	background:white;
	opacity:0.5;
}


@-webkit-keyframes rotatingBall /* Safari and Chrome */
{
0%   {-webkit-transform: rotate(-0deg); font-size: 1px;}
25%   {-webkit-transform: rotate(-90deg);}
50%   {-webkit-transform: rotate(-180deg);font-size: 100px;}
75%   {-webkit-transform: rotate(-270deg);}
100%   {-webkit-transform: rotate(-359deg);font-size: 100px;}
}

@-webkit-keyframes colorBall /* Safari and Chrome */
{
0%   {background:red;}
20%   {background:orange;}
40%   {background:yellow;}
60%   {background:green;}
80%   {background:blue;}
100%   {background:purple;}
}


@-webkit-keyframes rotatingBall2 /* Safari and Chrome */
{
0%   {-webkit-transform: rotate(0deg);}
25%   {-webkit-transform: rotate(90deg);}
50%   {-webkit-transform: rotate(180deg);}
75%   {-webkit-transform: rotate(270deg);}
100%   {-webkit-transform: rotate(359deg);}
}

@-webkit-keyframes showText /* Safari and Chrome */
{
0%   {opacity:0;}
20%   {opacity:0;}
95%   {opacity:0.5;}
100%   {opacity:1;}
}


@-webkit-keyframes animateBorders /* Safari and Chrome */
{
0%   {border-color:black;}
33% {border-color:silver;}
100%   {border-color:black;}
}

@-webkit-keyframes animateLetters /* Safari and Chrome */
{
0%   {color:black;}
33% {color:silver;}
100%   {color:black;}
}


@-webkit-keyframes rotateText /* Safari and Chrome */
{
0%   {top:0px;}
74% {top:-420px;left:0;}
75% {top:100%;left:10000px;}
76% {top:100%;left:0px;}
100%   {top:0px;}
}
