body{ background-color:#000000; margin:0; background-image:url("resources/carcbonbg.jpg"); } @font-face { font-family: race; src: url(resources/evogria.otf); } #menu { position:fixed; height:100%; vertical-align:center; width:15%;--300px; left:0; border-right:1px solid black; background: rgb(160,0,0); background: -moz-linear-gradient(left, rgba(160,0,0,1) 0%, rgba(181,0,0,1) 63%, rgba(160,0,0,1) 100%); background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(160,0,0,1)), color-stop(63%,rgba(181,0,0,1)), color-stop(100%,rgba(160,0,0,1))); background: -webkit-linear-gradient(left, rgba(160,0,0,1) 0%,rgba(181,0,0,1) 63%,rgba(160,0,0,1) 100%); background: -o-linear-gradient(left, rgba(160,0,0,1) 0%,rgba(181,0,0,1) 63%,rgba(160,0,0,1) 100%); background: -ms-linear-gradient(left, rgba(160,0,0,1) 0%,rgba(181,0,0,1) 63%,rgba(160,0,0,1) 100%); background: linear-gradient(to right, rgba(160,0,0,1) 0%,rgba(181,0,0,1) 63%,rgba(160,0,0,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a00000', endColorstr='#a00000',GradientType=1 ); } #buttonholder { position: relative; top: 45%; transform: translateY(-40%); height:auto; width:auto; } .button { width:100%; height:5%; text-align:center; background: #353535; background: -moz-linear-gradient(top, #353535 0%, #383838 1%, #363636 36%, #363636 73%, #343434 99%, #353535 99%, #353535 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#353535), color-stop(1%,#383838), color-stop(36%,#363636), color-stop(73%,#363636), color-stop(99%,#343434), color-stop(99%,#353535), color-stop(100%,#353535)); background: -webkit-linear-gradient(top, #353535 0%,#383838 1%,#363636 36%,#363636 73%,#343434 99%,#353535 99%,#353535 100%); background: -o-linear-gradient(top, #353535 0%,#383838 1%,#363636 36%,#363636 73%,#343434 99%,#353535 99%,#353535 100%); background: -ms-linear-gradient(top, #353535 0%,#383838 1%,#363636 36%,#363636 73%,#343434 99%,#353535 99%,#353535 100%); background: linear-gradient(to bottom, #353535 0%,#383838 1%,#363636 36%,#363636 73%,#343434 99%,#353535 99%,#353535 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#353535', endColorstr='#353535',GradientType=0 ); -webkit-transition: all 500ms ease-out; -moz-transition: all 500ms ease-out; -o-transition: all 500ms ease-out; transition: all 500ms ease-out; transition-delay: all 500ms; border-top:2px solid #363636; border-bottom:2px solid #363636; font-color:000000; font-family:race; font-size:250%; text-shadow: 1px 1px #606060; -box-shadow:inset 0 0 100px #000000; cursor: pointer; cursor: hand; -webkit-user-select: none; /* Chrome/Safari */ -moz-user-select: none; /* Firefox */ -ms-user-select: none; /* IE10+ */ background-repeat:no-repeat; background-size:100%; margin-bottom:-2; overflow: hidden; } .button:hover { height:20%; box-shadow:inset 0 0 100px #000000; text-shadow: none; font-color:f2f2f2; -background-image:url("resources/linkbg.png"); } #eagle { position:absolute; top:3%; left:0%; width:100%; height:18%; background-image:url("resources/eagle2.png"); background-repeat: no-repeat; -background-attachment: fixed; background-size:50%; background-position:45% 30%; -webkit-transition: all 1s ease-out; -moz-transition: all 1s ease-out; -o-transition: all 1s ease-out; transition: all 1s ease-out; cursor: pointer; cursor: hand; } #eagle:hover { background-image:url('resources/eagleover.png'); } #senna { position:absolute; bottom:0px; left:0px; width:100%; height:18%; background-image:url("resources/senna.png"); background-repeat: no-repeat; -background-attachment: fixed; background-size:80%; background-position:50% 70%; } .bottombox { position:absolute; bottom:0px; width:100%; height:100%; } .bs { position:absolute; bottom:0px; } #bar { position:absolute; height:0px; background:#ffffff; width:100%; top:0px; -webkit-transition: all 1s ease-out; -moz-transition: all 1s ease-out; -o-transition: all 1s ease-out; transition: all 1s ease-out; opacity:50%; } #bar:hover { -height:100%; } #bar2 { position:absolute; width:0px; height:100%; background:#ffffff; left:0px; -webkit-transition: all 2s ease-out; -moz-transition: all 2s ease-out; -o-transition: all 2s ease-out; transition: all 2s ease-out; opacity:50%; } #bar2:hover { width:100%; } #wrapper2 { position:fixed; width: -moz-calc(100% - 300px); width: -webkit-calc(100% - 300px); width: -o-calc(100% - 300px); width: calc(100% - 300px); height:100%; left:300; background:url("resources/flag.png"); background-size:50%; background-repeat: no-repeat; background-attachment: fixed; background-position:right bottom; } #wrapper { position:absolute; width:85%; height:100%; left:15%; background:url("resources/lambobg.png"); background-repeat: no-repeat; background-attachment: fixed; background-size:50%; background-position:right -30%; opacity: 1; -webkit-transition: all 1s ease-out; -moz-transition: all 1s ease-out; -o-transition: all 1s ease-out; transition: all 1s ease-out; } #swrapper:hover { opacity: 0.5; background-size:55%; } #panel { position:absolute; margin:auto; bottom:10; right:10; height: 500px; width:200px; background:black; } #dropshadowbg {position:absolute;width:100%;height:100%;box-shadow: inset 0 0 200px #000000;} #logo { position:absolute; right:50; top:50; width:300; height:300; background-image:url("resources/logo.png"); background-repeat:no-repeat; }