@charset "utf-8";
/* CSS Document */

@font-face {
  font-family: "archristy";
         src: url("../font/ARCHRISTY.ttf") format("truetype");
}

html {
    height: 100%;
	overflow:hidden;
}
body {
    height: 100%;
    margin: 0;
    background-repeat: no-repeat;
    background-attachment: fixed;
	overflow:hidden;

	background: #05b0ff; /* Old browsers */
/* IE9 SVG, needs conditional override of 'filter' to 'none' */
background: -webkit-linear-gradient(#f00, #2a89e9); /* For Safari 5.1 to 6.0 */
background: -o-linear-gradient(#05b0ff, #2a89e9); /* For Opera 11.1 to 12.0 */
background: -moz-linear-gradient(#05b0ff, #2a89e9); /* For Firefox 3.6 to 15 */
background: linear-gradient(#05b0ff, #2a89e9); /* Standard syntax (must be last) */

}

/* ----------------- Background -------------------------- */

#sun {position:absolute; top:17px; left:25px;  width:140px; height:138px; background-image:url(../img/sun.png); background-repeat:no-repeat;}

#bigcloud {position:absolute; top:369px; right:52px; width: 254px; height:120px; background-image:url(../img/cloud-large.png); background-repeat:no-repeat;}
#medcloud {position:absolute; top:334px; left:95px; width:158px;height: 123px; background-image:url(../img/cloud-med.png); background-repeat:no-repeat;}
#smallcloud {position:absolute; top:134px; right:35px;width:90px; height: 58px; background-image:url(../img/cloud-small.png); background-repeat:no-repeat;}

#lefthill {position:absolute; bottom:-20px; left:-150px; width:865px; height: 186px;  background-image:url(../img/hill-center.png); background-repeat:no-repeat;}
#righthill {position:absolute; bottom:-20px; right:-150px; width:865px; height: 176px;  background-image:url(../img/hill-center.png); background-repeat:no-repeat;}
#middlehill {position:absolute; bottom:0px; left:50%; margin-left: -432px;width:865px; height: 254px;  background-image:url(../img/hill-center.png); background-repeat:no-repeat;}

#leftflower {position:absolute; bottom:40px; left:133px; width:185px; height: 91px;  background-image:url(../img/flower-left.png); background-repeat:no-repeat;}
#rightflower {position:absolute; bottom:42px; right:92px; width:367px; height: 84px;  background-image:url(../img/flower-right.png); background-repeat:no-repeat;}
#middleflower {position:absolute; bottom:141px; left:50%; margin-left: -42px; width:184px; height: 67px; ; background-image:url(../img/flower-center.png); background-repeat:no-repeat;}

#donkey {position:absolute; top:0px; left:50%; margin-left: -400px; width:900px; height: 119px;  background-image:url(../img/donkey.png); background-repeat:no-repeat; background-position:right; font-family:"archristy", Arial, Helvetica, sans-serif; font-size: 3.5em; line-height: 119px; }

.a { color:#ff4f68; text-shadow:3px 3px black;}
.s { color:#39ff34;text-shadow:3px 3px  black;}
.m { color:#eaff02;text-shadow:3px 3px black;}
.j { color:#ff51e8;text-shadow:3px 3px  black;}
.f { color:#02ffd8;text-shadow:3px 3px black;}
.y { color:#ff6c7a;text-shadow:3px 3px  black;}

/* ----------------- video block -------------------------- */
#vidblock {background-image:url(../img/alpha50.png); background-repeat:repeat; width:100% ; height:300px; position:absolute; top:111px;}
#innervid {width: 926px; height:260px;  position:absolute; left:50%; margin-left:-463px; margin-top:20px;}
#currentvid {width:464px; height:260px;  display:inline-block;}
#vidlist {width:458px; height:260px;  display:inline-block; vertical-align:top; cursor:pointer;overflow:hidden; }
#vidlist .open {background-image:url(../img/alpha85.png);}
.viditem:hover {background-image:url(../img/alpha85y.png);}
.viditem {width:100%; height: 64px; background-image:url(../img/alpha50.png); margin:1px; line-height:64px;}
.title {font-family:"archristy", Arial, Helvetica, sans-serif; font-size: 2.5em; margin-left:15px; overflow:hidden; width:443px;}
#vid1 .title { color:#dc0c02; text-shadow:2px 2px white;}
#vid2 .title { color:#2829de; text-shadow:2px 2px white;}
#vid3 .title { color:#109a10; text-shadow:2px 2px white;}
#vid4 .title { color:#dd7b08; text-shadow:2px 2px white;}

#browse {cursor:pointer;background-image:url(../img/alpha50.png);height:260px;  display:none; vertical-align:top; overflow:hidden; width:458px;}

/* ----------------- send block -------------------------- */
#send {display:none; width: 926px;position:absolute; top:430px;left:50%; margin-left:-463px; margin-top:10px; height:214px; background-image:url(../img/alpha85y.png);
 border-radius:20px;
-webkit-border-radius:20px;
-moz-border-radius:20px;
cursor:pointer;
}

/* ----------------- contact block -------------------------- */
#contact {display:none; width: 926px;position:absolute; top:430px;left:50%; margin-left:-463px; margin-top:10px; height:214px; background-image:url(../img/alpha85.png);
 border-radius:20px;
-webkit-border-radius:20px;
-moz-border-radius:20px;
cursor:pointer;
}


/* ----------------- instruction block -------------------------- */
#infoblocks {width: 926px;position:absolute; top:430px;left:50%; margin-left:-463px; margin-top:10px; height:214px;}
.iblock {background-image:url(../img/alpha85.png); width:208px; height:214px; margin: 0 10px; display:inline-block; border-radius:20px;
-webkit-border-radius:20px;
-moz-border-radius:20px;
cursor:pointer;
}

.ititle {font-family:"archristy", Arial, Helvetica, sans-serif; font-size: 2.5em;text-shadow:2px 2px white; text-align:center; }
#ititle1 { color:#1e851b; }
#ititle2 { color:#da16dc;}
#ititle3 { color:#d0850f; }
#ititle4 { color:#434edc;}
.itext {font-family: Arial, Helvetica, sans-serif; font-size: .9em; margin:10px; overflow:hidden; float:left;}

/* ----------------- footer -------------------------- */
#footer {background-image:url(../img/alphafooter.png); width:100%; height: 40px; font-family:Arial, Helvetica, sans-serif; font-size: .7em; color:#aaa; text-align:center; padding:10px; margin-top:20px; position:absolute; bottom:-20px;}

#footerlinks {display:none;}

/* ----------------- browse list -------------------------- */
.scrollbar{
width:150px;
height:300px;
background-color:#eee;
margin-top:40px;
margin-left:40px;
overflow-y:scroll;
float:left;
}

#browsecontainer::-webkit-scrollbar{
width:16px;
background-color:#ddd;
} 

#browsecontainer::-webkit-scrollbar-thumb{
background-color:#ffa21c;
border-radius:10px;
}
#browsecontainer::-webkit-scrollbar-thumb:hover{
background-color:#ffa21c;
border:1px solid #fff;
}
#browsecontainer::-webkit-scrollbar-thumb:active{
background-color:#ffa21c;
border:1px solid #ff0;
} 

#browsecontainer { margin:10px; height:168px; width:438px; overflow: auto ; }
.browseitem:hover {background-color:#8bcffa;}
.browseitem:hover .viewlink {background-color:#268deb !important;}
.playing {background-color:#ee0 !important;}
.browseitem { height:40px; background-color:#ccc; margin-top:2px; width:418px;}
.viewlink { display:inline-block; background-image:url(../img/watch.png); background-repeat:no-repeat; width:40px; height: 40px; background-color:#999;
position: relative;
top: -3px;}
.viewlink.watch {background-position:-80px 0px;}
.itemtext {display:inline-block; width: 372px;height:40px;}
.itemtitle {font-family: Arial, Helvetica, sans-serif; font-size: .9em; overflow:hidden; font-weight:bold; margin: 0;height: 15px;
line-height: 15px;
margin-bottom: 10px;
padding-top: 3px;}
.itemdesc {font-family: Arial, Helvetica, sans-serif; font-size: .7em;  overflow:hidden;display:inline-block;position:relative; top:-7px;}

#now { margin-left:10px;font-family: Arial, Helvetica, sans-serif; font-size: .9em; }
#nowtitle { font-weight:bold;}
#sendthis {margin-left:10px;font-family: Arial, Helvetica, sans-serif; font-size: 1.0em; height:40px; width: 100px; font-weight:bold; background-color: #e5616e; color:#fff; cursor:pointer;display:inline-block; text-align:center; line-height:40px; margin:5px; display:inline-block;overflow:hidden;}
#sendthis:hover {background-color: #cc5662;}
#sharethis {margin-left:10px;font-family: Arial, Helvetica, sans-serif; font-size: .9em; display:none;}
#direct {margin:15px 40px 0 10px;font-family: Arial, Helvetica, sans-serif; font-size: .9em;display:inline-block;overflow:hidden;}
/* ----------------- send vid -------------------------- */
#send { height:200px;}
#vid {}
#sendto {margin:10px; display:inline-block; width:250px; height:180px; vertical-align:top; border-right:#999 solid thin; line-height:2.7em;}
h3 {font-family:"archristy", Arial, Helvetica, sans-serif; font-size: 1.5em; color:#C3F; margin:2px;}
label {font-family: Arial, Helvetica, sans-serif; font-size: .9em;}
input {font-family: Arial, Helvetica, sans-serif; font-size: .9em;}
.req {font-family: Arial, Helvetica, sans-serif; font-size: .9em; color:#F00;vertical-align:top;}
#sendfrom {margin:10px; display:inline-block; width:250px; height:180px;vertical-align:top; border-right:#999 solid thin; line-height:2.7em;}
#capcha1 { opacity:0; position:absolute; top: 450px; z-index:300;}
#sendvid {margin:40px 10px; display:inline-block;font-family:"archristy", Arial, Helvetica, sans-serif; font-size: 1.3em; background-color: #C3F; width: 200px; height:30px;text-align:center; color:#fff; position:absolute; bottom:-35px; right:90px; line-height:1.3em;}
#sendvid:hover {background-color:#90F;}
#yourname {background-color:#ddd;}
#youremail {background-color:#ddd;}

/* ----------------- send msg -------------------------- */
#contact { height:200px;}
#sendinfo {margin:10px; display:inline-block; width:500px; height:180px;vertical-align:top; border-right:#999 solid thin; line-height:2.7em;}
#sendmsg {margin:40px 10px; display:inline-block;font-family:"archristy", Arial, Helvetica, sans-serif; font-size: 1.3em; background-color: #C3F; width: 200px; height:30px;text-align:center; color:#fff; position:absolute; bottom:-35px; right:90px; line-height:1.3em;}
#sendmsg:hover {background-color:#90F;}
.bold {font-weight:bold;}
.red {color:#C00;}
.green {color:#060;}
#captcha-status {font-family: Arial, Helvetica, sans-serif; font-size: .6em;}

/* ----------------- misc -------------------------- */


/* ----------------- misc -------------------------- */