@charset "UTF-8";

body {
	background-color: #C4D546;
}
#wrap {
	max-width: 965px;
	margin: 0px auto 0px auto;		
}
#header {
	max-width: 100%;
	height: 388px;
	background: url(../images/headerBG.png);
	background-repeat: no-repeat;
	background-position: 0% 0%;
}
.tree {
    width: 100%;
    height: 388px;
    background:url(../treeAnimation.png) 0 0 no-repeat;
    -webkit-animation-name: expandUp, treeSignal;
    animation-name: expandUp, treeSignal;
    -webkit-animation-duration: 1s, 1.2s;
    animation-duration: 1s, 1.2s;
    -webkit-animation-timing-function: ease, steps(7);
    animation-timing-function: ease, steps(7);
    -webkit-animation-delay: 1s, 2s;
    animation-delay: 1s, 2s;
    -webkit-animation-iteration-count: 1, infinite;
    animation-iteration-count: 1, infinite;
    -webkit-animation-fill-mode: backwards, both;
    animation-fill-mode: backwards, both;
    
    visibility: visible !important;
}
#contentWrap {
	width: 100%;
	background-image: url(../images/contentBG.png);
	background-position: 0% 0%;
	background-repeat: repeat-y;
}
#content {
	text-align:center;
	line-height:1.5em;
	font-size:1.05em;
	padding-left: 90px;
	padding-right: 90px;
}
#footer {
	width: 100%;
	height: 119px;
	background-image: url(../images/footerBG.png);
	background-repeat: no-repeat;
	background-position: 0% 0%;
	text-align:center;
}
#footer p, #footer phone {
	font-family: 'Tenor Sans', "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-weight: 400;
	margin-top: 0px;
	line-height: 1.5em;
}
.smallCap {
	font-variant: small-caps;
}
.cap {
	text-transform: uppercase;
}
.lineType {
	color: #FFF;
	margin-right: 5px;
}
h1 {
	font-size: 80px;
	color:#FFFFFF;
}
h2 {
	font-size: 32px;
	color:#FFFFFF;
}
h3 {
	font-size: 32px;
}
h4{
	font-size: 16px;
}
h5 {
	font-size: 16px;
	color: #FFF;
}
h1, h2, h3, h4, h5, h6 {
	font-family: 'Tenor Sans', "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-weight: 400;
	line-height: 1em;
}
p {
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	margin-top: 25px;
}
a {
	color: #1D351A;
}
a:hover {
	color: #51924B;
}
strong {
	font-weight: bold;
}

/*
----------------------------------------------------------------------------------------------
animation: name duration timing-function delay iteration-count direction fill-mode play-state;
----------------------------------------------------------------------------------------------
animation-name: spin;
animation-duration: 3s;
animation-timing-function: linear;
animation-delay: 3s;
animation-iteration-count: infinite;
animation-direction: alternate;
animation-fill-mode: both;
animation-play-state: running;
*/
@keyframes expandUp {
	0% {transform: translateY(100%) scale(0.01) scaleY(0.1);}
	60%{transform: translateY(-7%) scaleY(1.12);}
	75%{transform: translateY(3%);}	
	100% {transform: translateY(0%) scale(1) scaleY(1);}	
}

@-webkit-keyframes expandUp {
	0% {-webkit-transform: translateY(100%) scale(0.01) scaleY(0.1);}
	60%{-webkit-transform: translateY(-7%) scaleY(1.12);}
	75%{-webkit-transform: translateY(3%);}	
	100% {-webkit-transform: translateY(0%) scale(1) scaleY(1);}	
}
@-webkit-keyframes treeSignal {
    0% {background-position: 0 0;}
    100% {background-position: 0 -2716px;}
}
@keyframes treeSignal {
    0% {background-position: 0 0;}
    100% {background-position: 0 -2716px;}
}
@-webkit-keyframes treeSignal700 {
    0% {background-position: 0 0;}
    100% {background-position: 0 -1967px;}
}
@keyframes treeSignal700 {
    0% {background-position: 0 0;}
    100% {background-position: 0 -1967px;}
}
@-webkit-keyframes treeSignal400 {
    0% {background-position: 0 0;}
    100% {background-position: 0 -903px;}
}
@keyframes treeSignal400 {
    0% {background-position: 0 0;}
    100% {background-position: 0 -903px;}
}

/*
----------------------------------------------------------------------------------------------
Some Responsive Styles
----------------------------------------------------------------------------------------------
*/
@media (max-width: 960px) {
#wrap {
	max-width: 700px;
}
#header {
	height: 281px;
	background-size: 700px 281px;
}
.tree {
	height: 281px;
	background-size: 700px 1967px;
	-webkit-animation-name: expandUp, treeSignal700;
	animation-name: expandUp, treeSignal700;
}
#contentWrap {
	background-size: 700px auto;
}
#footer {
	height: 119px;
	background-size: 700px 119px;
}
h1 {
	font-size: 60px;
}
h2 {
	font-size: 24px;
}
h3 {
	font-size: 24px;
}
h4 {
	font-size: 14px;
	margin-top: 5px;
}
}

@media (max-width: 699px) {
#wrap {
	max-width: 320px;
}
#header {
	height: 129px;
	background-size: 320px 129px;
}
.tree {
	height: 129px;
	background-size: 320px 903px;
	-webkit-animation-name: expandUp, treeSignal400;
	animation-name: expandUp, treeSignal400;
}
#contentWrap {
	background-size: 320px auto;
}
#footer {
	height: 140px;
	background-size: 320px 140px;
}
#content {
	padding-left: 35px;
	padding-right: 35px;
	font-size:1em;
}	
h1 {
	font-size: 30px;
}
h2 {
	font-size: 14px;
}	
h3 {
	font-size: 14px;
}
h4 {
	font-size: 10px;
	margin-top: 3px;
}
}