.frame {
min-height: 80%; position:relative; background:#ff0; overflow:hidden;
}

.text {  
color: #fff; 
font-weight: 100;  
text-align: center;  
color: antiquewhite; 
line-height: 130%;
position:absolute;
top:50%;
left:50%;
transform:translate(-50%, -50%);
}  

.bold { font-weight: 400;  }

.download { 
font-family: 'Roboto Slab', serif;
text-align: center; 
width:100%; 
min-height:100%;
font-size: 130%;
background: url(./../images/soil.png) top center no-repeat;  
background-color: #5f5240;
position: relative;

}


.files ul { margin-top: 20px; }
.files ul li { display: inline; margin: 0px 15px 0px 15px;}
.files ul li a { color: antiquewhite; font-weight: 500; }

.first-half {
width: 100%;
min-height: 50%;
position: relative;
top:0;
background: rgba(177,216,245,1);
background: -moz-linear-gradient(top, rgba(177,216,245,1) 0%, rgba(243,255,229,1) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(177,216,245,1)), color-stop(100%, rgba(243,255,229,1)));
background: -webkit-linear-gradient(top, rgba(177,216,245,1) 0%, rgba(243,255,229,1) 100%);
background: -o-linear-gradient(top, rgba(177,216,245,1) 0%, rgba(243,255,229,1) 100%);
background: -ms-linear-gradient(top, rgba(177,216,245,1) 0%, rgba(243,255,229,1) 100%);
background: linear-gradient(to bottom, rgba(177,216,245,1) 0%, rgba(243,255,229,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b1d8f5', endColorstr='#f3ffe5', GradientType=0 );
}

.second-half {
width: 100%;
min-height: 40%;
position: relative;
bottom: 0;
background: #ffe2bb;
}

.sign { z-index:501; position:absolute; width:100%; left:-50; top:-200; text-align:center; }
.cactus { z-index:499; position:absolute; width:100%; left:0; top:-100; }
.mountains { z-index:498; position:absolute; width:100%; bottom:0; left:-100; text-align:center; }
.clouds { z-index:497; position:absolute; width:100%; bottom:0; left: 0; }
.sun { z-index:500; position:absolute; width:100%; top:-170; right: -120; }


/* http://meyerweb.com/eric/tools/css/reset/ 
v2.0 | 20110126
License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
display: block;
}
body {
line-height: 1;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}



@-moz-keyframes bounce {
0%, 20%, 50%, 80%, 100% {
-moz-transform: translateY(0);
transform: translateY(0);
}
40% {
-moz-transform: translateY(-30px);
transform: translateY(-30px);
}
60% {
-moz-transform: translateY(-15px);
transform: translateY(-15px);
}
}
@-webkit-keyframes bounce {
0%, 20%, 50%, 80%, 100% {
-webkit-transform: translateY(0);
transform: translateY(0);
}
40% {
-webkit-transform: translateY(-30px);
transform: translateY(-30px);
}
60% {
-webkit-transform: translateY(-15px);
transform: translateY(-15px);
}
}
@keyframes bounce {
0%, 20%, 50%, 80%, 100% {
-moz-transform: translateY(0);
-ms-transform: translateY(0);
-webkit-transform: translateY(0);
transform: translateY(0);
}
40% {
-moz-transform: translateY(-30px);
-ms-transform: translateY(-30px);
-webkit-transform: translateY(-30px);
transform: translateY(-30px);
}
60% {
-moz-transform: translateY(-15px);
-ms-transform: translateY(-15px);
-webkit-transform: translateY(-15px);
transform: translateY(-15px);
}
}
body {
background: black;
}

.arrow {
position: absolute;
left: 50%;
bottom: 0;
width: 48;
height: 25;
    z-index: 502;
background-image: url(./../images/chevron.svg);
background-size: contain;
}

.bounce {
-moz-animation: bounce 2s infinite;
-webkit-animation: bounce 2s infinite;
animation: bounce 2s infinite;
}

.credits { margin-top: 8%;}

.credits h2 {
    color: #463a2b;
    font-weight: 500;
    margin-bottom: 1%;
    font-size: 100%;
}

.credits ul li a { color: #463a2b; font-weight: 500; font-size: 80%; }
.credits ul li { margin-bottom: 2%;}

a:hover { opacity: 0.5; }