@charset "UTF-8";
/* CSS Document */
a {
   outline: 0;
}
html,body{
	width: 100%;
    margin: 0px;
    padding: 0px;
    overflow-x: hidden;
}
.Main {
	width:auto;
	background-color: #003767;
	margin:auto;
}
.Background1{
	position:relative;
	background-color: #003767;
}
.MainContent1{
	position:relative;
	padding: 2em 0em 2.5em 0em;
	width:1000px;
	margin: 0em auto 0em auto;
}
.Background2{
	position:relative;
	background-color: #d4e4ef;
	-webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
}
.MainContent2{
	text-align:center;
	position:relative;
	padding: 0em 0em 1.5em 0em;
	width:1000px;
	margin: 0em auto 0em auto;
}
h1{
	line-height: 1.7em;
	margin:3.5em auto auto auto;
	text-align:center;
	color:#ffffff;
	font-size:1.9em;
	letter-spacing:.1em;
	font-family:Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, sans-serif;
	text-shadow: 1px 1px 2px rgba(0, 0, 0, .7);
}


.Lesson{
	z-index: 1;
	text-align:center;
	overflow:hidden;
	position:relative;
	margin: 1em auto 1em auto;
}
.IframeLesson{
	border: 4px solid #ffffff;
	border-radius: 10px 10px 10px 10px;
-moz-border-radius: 10px 10px 10px 10px;
-webkit-border-radius: 10px 10px 10px 10px;
	width:800px;
	height:499px;
	margin: auto;
	-webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
}

.FreeQuiz{
	position:relative;
	cursor:pointer;
	z-index:10;
	margin-left: 2.5em;
	background-image:url(../images/FreeQuiz.png);
	background-repeat:no-repeat;
	height: 345px;
	width: 300px;
	background-size:contain;
	background-position:left;
}
.StartNow{
	position:relative;
	margin-top:2em;
	cursor:pointer;
	z-index:10;
	background-image:url(../images/StartNow.png);
	background-repeat:no-repeat;
	height: 303px;
	width: 400px;
	background-size:contain;
	background-position:left;
}
.ChoiceWrap{
	width: 900px;
	display:inline-block;
	margin: 1em auto 1.5em auto;
	position:relative;
}
.FreeQuizWrap{
	position:relative;
	float:left;
}
.RegisterNowWrap{
	position:relative;
	float:right;
}
.FreeQuizText{
	margin-top: 1em;
	padding-left: .5em;
	color: #000000;
	font-size: 1.2em;
	font-family:Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, sans-serif;
	text-align:center;
	letter-spacing: .05em;
}
.StartNowText{
	margin-top: 1.4em;
	color: #000000;
	font-size: 1.2em;
	font-family:Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, sans-serif;
	text-align:center;
	letter-spacing: .1em;
}
.QuizOval{
	z-index: 1;
	position:absolute;
	bottom:2.4em;
	left:2.1em;
	height: 75px;
	width: 300px;
	transform:rotate(-1.5deg);
	-webkit-transform:rotate(-1.5deg);
	-ms-transform:rotate(-1.5deg);
	border-radius: 150px 150px 150px 150px;
	-moz-border-radius: 150px 150px 150px 150px;
	-webkit-border-radius: 150px 150px 150px 150px;
	border: 4px white solid;
	background: rgba(255,140,0,1);
background: -moz-linear-gradient(top, rgba(252,92,0,1) 0%, rgba(255,140,0,1) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(252,92,0,1)), color-stop(100%, rgba(255,140,0,1)));
background: -webkit-linear-gradient(top, rgba(252,92,0,1) 0%, rgba(255,140,0,1) 100%);
background: -o-linear-gradient(top, rgba(252,92,0,1) 0%, rgba(255,140,0,1) 100%);
background: -ms-linear-gradient(top, rgba(252,92,0,1) 0%, rgba(255,140,0,1) 100%);
background: linear-gradient(to bottom, rgba(252,92,0,1) 0%, rgba(255,140,0,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fc5c00', endColorstr='#ff8c00', GradientType=0 );
-webkit-box-shadow: 1px 1px 5px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 1px 1px 5px 0px rgba(0,0,0,0.75);
box-shadow: 1px 1px 5px 0px rgba(0,0,0,0.75);
}
.StartNowCircle{
	z-index: 1;
	position:absolute;
	bottom:2.5em;
	left:4.5em;
	height: 240px;
	width: 240px;
	border-radius: 150px 150px 150px 150px;
	-moz-border-radius: 150px 150px 150px 150px;
	-webkit-border-radius: 150px 150px 150px 150px;
	border: 4px white solid;
	background: rgba(241,231,103,1);
background: -moz-linear-gradient(top, rgba(241,231,103,1) 0%, rgba(254,182,69,1) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(241,231,103,1)), color-stop(100%, rgba(254,182,69,1)));
background: -webkit-linear-gradient(top, rgba(241,231,103,1) 0%, rgba(254,182,69,1) 100%);
background: -o-linear-gradient(top, rgba(241,231,103,1) 0%, rgba(254,182,69,1) 100%);
background: -ms-linear-gradient(top, rgba(241,231,103,1) 0%, rgba(254,182,69,1) 100%);
background: linear-gradient(to bottom, rgba(241,231,103,1) 0%, rgba(254,182,69,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f1e767', endColorstr='#feb645', GradientType=0 );
-webkit-box-shadow: 1px 1px 5px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 1px 1px 5px 0px rgba(0,0,0,0.75);
box-shadow: 1px 1px 5px 0px rgba(0,0,0,0.75);
}
.StartNowCircle2{
	z-index: 1;
	position:absolute;
	top:5em;
	right:2em;
	height: 200px;
	width: 200px;
	border-radius: 150px 150px 150px 150px;
	-moz-border-radius: 150px 150px 150px 150px;
	-webkit-border-radius: 150px 150px 150px 150px;
	border: 4px white solid;
	background: rgba(241,231,103,1);
background: -moz-linear-gradient(top, rgba(241,231,103,1) 0%, rgba(254,182,69,1) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(241,231,103,1)), color-stop(100%, rgba(254,182,69,1)));
background: -webkit-linear-gradient(top, rgba(241,231,103,1) 0%, rgba(254,182,69,1) 100%);
background: -o-linear-gradient(top, rgba(241,231,103,1) 0%, rgba(254,182,69,1) 100%);
background: -ms-linear-gradient(top, rgba(241,231,103,1) 0%, rgba(254,182,69,1) 100%);
background: linear-gradient(to bottom, rgba(241,231,103,1) 0%, rgba(254,182,69,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f1e767', endColorstr='#feb645', GradientType=0 );
-webkit-box-shadow: 1px 1px 5px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 1px 1px 5px 0px rgba(0,0,0,0.75);
box-shadow: 1px 1px 5px 0px rgba(0,0,0,0.75);
}
.StartNowCircle3{
	z-index: 1;
	position:absolute;
	top:4.5em;
	left:3.5em;
	height: 200px;
	width: 200px;
	border-radius: 150px 150px 150px 150px;
	-moz-border-radius: 150px 150px 150px 150px;
	-webkit-border-radius: 150px 150px 150px 150px;
	border: 4px white solid;
	background: rgba(241,231,103,1);
background: -moz-linear-gradient(top, rgba(241,231,103,1) 0%, rgba(254,182,69,1) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(241,231,103,1)), color-stop(100%, rgba(254,182,69,1)));
background: -webkit-linear-gradient(top, rgba(241,231,103,1) 0%, rgba(254,182,69,1) 100%);
background: -o-linear-gradient(top, rgba(241,231,103,1) 0%, rgba(254,182,69,1) 100%);
background: -ms-linear-gradient(top, rgba(241,231,103,1) 0%, rgba(254,182,69,1) 100%);
background: linear-gradient(to bottom, rgba(241,231,103,1) 0%, rgba(254,182,69,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f1e767', endColorstr='#feb645', GradientType=0 );
-webkit-box-shadow: 1px 1px 5px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 1px 1px 5px 0px rgba(0,0,0,0.75);
box-shadow: 1px 1px 5px 0px rgba(0,0,0,0.75);
}
.SVGArrow{
	z-index:0;
	position:absolute;
	bottom: -9em;
	left:19em;
}









.ClearFix{
	clear:both;
}

.StartToday{
	overflow:hidden;
	animation-name: StartTodayFlyIn;
	animation-duration: 2s;
	position:fixed;
	left:50%;
	top:5.7em;
	margin-left: -6.2em;
	z-index: 99;
	padding: .8em .6em .2em .6em;
	color:#ffffff;
	font-size: .9em;
	letter-spacing: .075em;
	font-family:"Palatino Linotype", Palatino, "Century Schoolbook L", "Times New Roman", serif;
	text-shadow: 1px 1px 1px rgba(0, 0, 0, .9);
	border-radius: 2px 2px 2px 2px;
	-moz-border-radius: 2px 2px 2px 2px;
	-webkit-border-radius: 2px 2px 2px 2px;
	border: 1px solid #ffffff;
	-webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
	background: rgba(164,219,0,1);
background: -moz-linear-gradient(top, rgba(164,219,0,1) 0%, rgba(100,199,0,1) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(164,219,0,1)), color-stop(100%, rgba(100,199,0,1)));
background: -webkit-linear-gradient(top, rgba(164,219,0,1) 0%, rgba(100,199,0,1) 100%);
background: -o-linear-gradient(top, rgba(164,219,0,1) 0%, rgba(100,199,0,1) 100%);
background: -ms-linear-gradient(top, rgba(164,219,0,1) 0%, rgba(100,199,0,1) 100%);
background: linear-gradient(to bottom, rgba(164,219,0,1) 0%, rgba(100,199,0,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a4db00', endColorstr='#64c700', GradientType=0 );
}

@keyframes StartTodayFlyIn {
  from, 60%, 75%, 90%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -3000px, 0);
    transform: translate3d(0, -3000px, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, 25px, 0);
    transform: translate3d(0, 25px, 0);
  }

  75% {
    -webkit-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, 5px, 0);
    transform: translate3d(0, 5px, 0);
  }

  to {
    -webkit-transform: none;
    transform: none;
  }
}
.StartToday:after {
  content: "";
  position: absolute;
  top: -110%;
  left: -210%;
  width: 200%;
  height: 200%;
  opacity: 0;
  transform: rotate(0deg);
  
  background: rgba(255, 255, 255, 0.13);
  background: linear-gradient(
    to right, 
    rgba(255, 255, 255, 0.13) 0%,
    rgba(255, 255, 255, 0.13) 77%,
    rgba(255, 255, 255, 0.5) 92%,
    rgba(255, 255, 255, 0.0) 100%
  );
}

/* Hover state - trigger effect */

.StartToday:hover:after {
  opacity: 1;
  top: -30%;
  left: -30%;
  transition-property: left, top, opacity;
  transition-duration: 0.7s, 0.7s, 0.15s;
  transition-timing-function: ease;
}

/* Active state */

.StartToday:active:after {
  opacity: 0;
}