diff --git a/index.htm b/index.htm new file mode 100644 index 0000000..1eb2df8 --- /dev/null +++ b/index.htm @@ -0,0 +1,42 @@ + + +TC Automotives + + + + + +
+ +
+ +
+
+ ASDadsasddas +
+
+ +
+
+ + \ No newline at end of file diff --git a/index.html b/index.html deleted file mode 100644 index 850e572..0000000 --- a/index.html +++ /dev/null @@ -1,34 +0,0 @@ - - - -TC Automotives - - - - - - -
- -
- -
-
- ASDadsasddas -
-
- -
-
- - - \ No newline at end of file diff --git a/script.js b/script.js deleted file mode 100644 index ba486e1..0000000 --- a/script.js +++ /dev/null @@ -1,6 +0,0 @@ -function expand() { document.getElementById("bar").style.height = "100%"; } -function collapse() { document.getElementById("bar").style.height = "0px"; } -function myFunction() { - if (document.getElementById('bar').clientHeight == 0) { expand(); } - else { collapse(); } -} \ No newline at end of file diff --git a/style.css b/style.css index 6956901..a6da2c2 100644 --- a/style.css +++ b/style.css @@ -1,246 +1,212 @@ -body { - background-color: #000000; - margin: 0; - background-image: url("resources/carcbonbg.jpg"); +body{ +background-color:#000000; +margin:0; +background-image:url("resources/carcbonbg.jpg"); } @font-face { font-family: race; - src: url(resources/Evogria.otf); -} + 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); +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; + 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); +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; + 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"); +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; +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; + cursor: pointer; cursor: hand; } - #eagle:hover { - background-image: url('resources/eagleover.png'); +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%; +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%; +position:absolute; +bottom:0px; +width:100%; +height:100%; } .bs { - position: absolute; - bottom: 0px; +position:absolute; +bottom:0px; } #bar { - position: absolute; - height: 0px; - background: #ffffff; - width: 100%; - top: 0px; - -webkit-transition: all 1s ease-out; +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%; +opacity:50%; } - #bar:hover { - -height: 100%; +-height:100%; } #bar2 { - position: absolute; - width: 0px; - height: 100%; - background: #ffffff; - left: 0px; - -webkit-transition: all 2s ease-out; +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%; +opacity:50%; } - #bar2:hover { - width: 100%; +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; +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; +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%; +opacity: 0.5; +background-size:55%; } - #panel { - position: absolute; - margin: auto; - bottom: 10; - right: 10; - height: 500px; - width: 200px; - background: black; +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; -} +#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; -} - -#b1:hover { - background-image: url("resources/car.png"); -} - -#b2:hover { - background-image: url("resources/sketch.png"); -} - -#b3:hover { - background-image: url("resources/cogs.png"); -} - -#b4:hover { - background-image: url("resources/track.png"); +position:absolute; +right:50; +top:50; +width:300; +height:300; +background-image:url("resources/logo.png"); +background-repeat:no-repeat; } \ No newline at end of file