@font-face {
  font-family: 'Oswald';
  font-style: normal;
  font-weight: 400;
  src: local('Oswald Regular'), local('Oswald-Regular'), url('oswald.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Oswald ExtraLight';
  font-style: normal;
  font-weight: 200;
  src: local('Oswald ExtraLight'), local('Oswald-ExtraLight'), url('oswald_extralight.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Leckerli One';
  font-style: normal;
  font-weight: 400;
  src: local('Leckerli One'), local('LeckerliOne-Regular'), url('leckerli_one.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

#clouds{ z-index:2; position:fixed; top:0px; left:0px; opacity:0.6; }
.cloud { width: 200px; height: 60px; background: #fff;	border-radius: 200px; -moz-border-radius: 200px; -webkit-border-radius: 200px; position: relative; }
.cloud:before, .cloud:after { content: ''; position: absolute; background: #fff; width: 100px; height: 80px; position: absolute; top: -15px; left: 10px; border-radius: 100px; -moz-border-radius: 100px; -webkit-border-radius: 100px; -webkit-transform: rotate(30deg); transform: rotate(30deg); -moz-transform: rotate(30deg); }
.cloud:after { width: 120px; height: 120px; top: -55px; left: auto; right: 15px; }
.x1 { -webkit-animation: moveclouds 15s linear infinite; -moz-animation: moveclouds 15s linear infinite; -o-animation: moveclouds 15s linear infinite; }
.x2 { left: 200px; -webkit-transform: scale(0.6); -moz-transform: scale(0.6); transform: scale(0.6); opacity: 0.6; -webkit-animation: moveclouds 25s linear infinite; -moz-animation: moveclouds 25s linear infinite; -o-animation: moveclouds 25s linear infinite; }
.x3 { left: -250px; top: -200px; -webkit-transform: scale(0.8); -moz-transform: scale(0.8); transform: scale(0.8); opacity: 0.8; -webkit-animation: moveclouds 20s linear infinite; -moz-animation: moveclouds 20s linear infinite; -o-animation: moveclouds 20s linear infinite; }
.x4 { left: 470px; top: -250px; -webkit-transform: scale(0.75);	-moz-transform: scale(0.75); transform: scale(0.75); opacity: 0.75; -webkit-animation: moveclouds 18s linear infinite; -moz-animation: moveclouds 18s linear infinite; -o-animation: moveclouds 18s linear infinite; }
.x5 { left: -150px; top: -150px; -webkit-transform: scale(0.8);	-moz-transform: scale(0.8); transform: scale(0.8); opacity: 0.8; -webkit-animation: moveclouds 20s linear infinite; -moz-animation: moveclouds 20s linear infinite; -o-animation: moveclouds 20s linear infinite; }
.x6 { left: 120px; top: 200px; -webkit-transform: scale(0.64); -moz-transform: scale(0.64); transform: scale(0.64); opacity: 0.64; -webkit-animation: moveclouds 23s linear infinite; -moz-animation: moveclouds 23s linear infinite; -o-animation: moveclouds 23s linear infinite; }
.x7 { left: -20px; top: -50px; -webkit-transform: scale(0.8); -moz-transform: scale(0.8); transform: scale(0.8); opacity: 0.8;	-webkit-animation: moveclouds 26s linear infinite; -moz-animation: moveclouds 26s linear infinite; -o-animation: moveclouds 26s linear infinite; }
.x8 { left: -110px; top: -110px; -webkit-transform: scale(0.5); -moz-transform: scale(0.5); transform: scale(0.5); opacity: 0.5; -webkit-animation: moveclouds 18s linear infinite; -moz-animation: moveclouds 18s linear infinite; -o-animation: moveclouds 18s linear infinite; }
.x9 { left: 50px; top: 90px; -webkit-transform: scale(0.83); -moz-transform: scale(0.83); transform: scale(0.83); opacity: 0.5; -webkit-animation: moveclouds 40s linear infinite; -moz-animation: moveclouds 40s linear infinite; -o-animation: moveclouds 40s linear infinite; }
.x10 { left: 90px; top: 250px;	-webkit-transform: scale(0.9); -moz-transform: scale(0.9); transform: scale(0.9); opacity: 0.9; -webkit-animation: moveclouds 23s linear infinite; -moz-animation: moveclouds 23s linear infinite; -o-animation: moveclouds 23s linear infinite; }

@-webkit-keyframes moveclouds {	0% {margin-left: 1000px;} 100% {margin-left: -1000px;}}
@-moz-keyframes moveclouds { 0% {margin-left: 1000px;} 100% {margin-left: -1000px;}}
@-o-keyframes moveclouds { 0% {margin-left: 1000px;} 100% {margin-left: -1000px;}}

html { 
font-family:'Oswald ExtraLight', sans-serif; font-size:140%; 
padding:2em; 
min-height:100%; 
background:#7eb6ff;
background:-moz-linear-gradient(top,#7eb6ff 0%, #7eb6ff 20%, #cbe1ff 100%);
background:-webkit-linear-gradient(top,#7eb6ff 0%, #7eb6ff 20%, #cbe1ff 100%);
background:linear-gradient(to bottom,#7eb6ff 0%, #7eb6ff 20%, #cbe1ff 100%);
}

* { color:#00214d; font-family:'Oswald ExtraLight', sans-serif; }
a { text-decoration: none; }
h3,h2,h1 { font-family:'Leckerli One', sans-serif; }
h4,h5 { font-family:'Oswald', sans-serif; }
h1 { font-size:300%; color:#fff; text-shadow: 4px 4px 11px rgba(150, 150, 150, 1); font-weight: lighter !important; }
#palmtree { font-size:300% !important; margin:none; padding:none; cursor:default; }
#main { position:relative; z-index:3000; padding-bottom:2em; }