Difference between revisions of "Team:Central Calgary/header-footer.css"

Line 1: Line 1:
 
@charset "utf-8";
 
@charset "utf-8";
−
 
+
body {  
−
* {
+
width: 80000px;
−
margin:0px 0px 0px 0px;
+
overflow:visible;
−
padding:0px 0px 0px 0px;
+
 
}
 
}
  
−
h10
+
#canvas {
−
{
+
    width: 1920px;
 +
    height: 1080px;
 +
    margin: 0px;
 +
    padding: 0px;
 +
    position:fixed;
 +
    top: 0;
 +
    left: 0;
 +
z-index:-100;
 +
background:rgba(255,0,4,1.00);
 
}
 
}
  
−
#header {
+
#content {
−
+
position:absolute;
−
position:fixed;
+
 
top:0px;
 
top:0px;
 
left:0px;
 
left:0px;
−
height:100px;
+
width:100000px;
−
margin-bottom:100px;
+
z-index:3;
−
width:100%;
+
background: rgba(0,0,0,0);
−
z-index:100;
+
 
}
 
}
  
−
#logo {
+
#contentBg {
−
position:absolute;
+
position:fixed;
−
        top:0px;
+
top:0px;
−
width:75px;
+
left:0px;
−
width:4vw;
+
width:1080;
−
height:75px;
+
height:100vh;
−
height:4vw;
+
z-index:1;
−
z-index:100;
+
background:rgba(255,255,0,1);
 +
 
}
 
}
  
−
#homeText {
+
.panel {  
−
z-index:100;
+
−
position:absolute;
+
−
        top:18px;
+
−
left:100px;
+
−
left:5.2vw;
+
−
font-family:Ubuntu;
+
−
font-size:64px;
+
−
font-size:3.33vw;
+
−
color:rgba(0,0,0,1.00);
+
−
        border-bottom: 0px;
+
−
}
+
−
 
+
−
 
+
−
 
+
−
#headerLeft {
+
 
 
−
position:fixed;
 
−
top:18px;
 
−
left:-40px;
 
−
right:0;
 
 
z-index:0;
 
z-index:0;
−
height:100px;
+
margin-top:130px;
−
height:5vw;
+
padding-bottom: 10px;
−
width:608px;
+
padding-top:10px;
−
width:63vw;
+
width:930px;
−
background-color:rgba(255, 255, 255,1.00);
+
/*width: 100%;*/
 +
height:750px;
 +
height: 70vh;
 +
float: left;
 +
padding-left: 30px;
 +
padding-right: 1020px;
 +
color:rgba(255,255,255,1);
 +
background-color:rgba(0,0,0,0.8);
 +
}
  
−
  -webkit-transform: skew(-30deg, 0deg);  
+
#team1 {
−
    transform: skew(-30deg, 0deg);
+
height:60px;
−
box-shadow: -1px 5px 5px #000000;
+
width:350px;
−
border-right: 2px solid #000000;
+
margin-right:1920px;
−
+
padding-right:30px;
−
+
 
}
 
}
  
−
#footer {
+
h1 {
−
z-index:100;
+
font-size:42px;
−
position:fixed;
+
−
bottom:0;
+
−
left:0;
+
−
right:0;
+
−
height:100px;
+
−
height:6vw;
+
−
width:100%;
+
−
background-color:rgba(255,255,255,1.0);
+
−
box-shadow: -1px -5px 5px #000000;
+
−
 
+
−
}
+
−
 
+
−
#headerMenu {
+
−
overflow:visible;
+
−
list-style-type:none;
+
−
margin:0;
+
−
padding:0;
+
−
padding-right:4vw;
+
−
z-index:1001;
+
−
+
−
}
+
−
 
+
−
.headerMenuItem {
+
−
overflow:visible;
+
−
display:inline;
+
−
top:0px;
+
−
float:right;
+
−
+
−
}
+
−
 
+
−
a.menuItem {
+
−
+
−
overflow:visible;
+
−
display:block;
+
−
width:5vw;
+
−
color: #000000;
+
−
text-decoration:none;
+
−
padding-top:20px;
+
−
padding-top:1vw;
+
−
padding-bottom:4px;
+
−
padding-right:10px;
+
−
padding-right:.52vw;
+
−
padding-left:10px;
+
−
padding-left:.52vw;
+
−
+
−
border-left-width:2px;
+
−
border-left-color:#000000;
+
−
border-left-style:solid;
+
−
border-bottom:1px;
+
−
border-bottom-style:solid;
+
−
border-right-style:solid;
+
−
border-right-color:#000000;
+
−
border-right-width:1px;
+
−
+
 
font-family:Ubuntu;
 
font-family:Ubuntu;
−
font-size:14px;
 
−
font-size:0.8vw;
 
−
box-shadow: -1px 5px 5px #000000;
 
−
background-color:rgba(255, 255, 255,1.0);
 
−
 
−
 
−
-webkit-transform: skew(-30deg, 0deg);
 
−
    transform: skew(-30deg, 0deg);
 
−
 
−
-webkit-backface-visibility: hidden;
 
−
 
−
-webkit-transition: all 0.3s ease-out; 
 
−
    -moz-transition: all 0.3s ease-out; 
 
−
    -o-transition: all 0.3s ease-out; 
 
−
    transition: all 0.3s ease-out; 
 
−
 
−
 
−
 
 
}
 
}
−
 
+
h2 {
−
a.menuItem:hover {
+
font-size:24px;
−
/*background-color:rgba(0,184,251,1.00);*/
+
font-family:Ubuntu;
−
+
−
background-color:rgba(97,252,41,1.00);
+
−
padding-top:30px;
+
−
padding-top:1.5vw;
+
−
+
−
+
 
}
 
}
  
−
a.currentLink {
+
p {
−
overflow:visible;
+
line-height:14px;
−
display:block;
+
font-size:12px;
−
width:5vw;
+
font-family:Volkorn;
−
color: #000000;
+
−
text-decoration:none;
+
−
padding-top:20px;
+
−
padding-top:1vw;
+
−
padding-bottom:4px;
+
−
padding-right:10px;
+
−
padding-right:.52vw;
+
−
padding-left:10px;
+
−
padding-left:.52vw;
+
−
+
−
border-left-width:2px;
+
−
border-left-color:#000000;
+
−
border-left-style:solid;
+
−
border-bottom:1px;
+
−
border-bottom-style:solid;
+
−
border-right-style:solid;
+
−
border-right-color:#000000;
+
−
border-right-width:1px;
+
−
+
−
font-family:Ubuntu;
+
−
font-size:14px;
+
−
font-size:0.8vw;
+
−
box-shadow: -1px 5px 5px #000000;
+
−
background-color:rgba(97,252,41,1.0);
+
−
 
+
−
 
+
−
-webkit-transform: skew(-30deg, 0deg);
+
−
    transform: skew(-30deg, 0deg);
+
−
 
+
−
-webkit-backface-visibility: hidden;
+
−
+
−
-webkit-transition: all 0.3s ease-out; 
+
−
    -moz-transition: all 0.3s ease-out; 
+
−
    -o-transition: all 0.3s ease-out; 
+
−
    transition: all 0.3s ease-out; 
+
−
 
+
−
+
 
}
 
}
  
−
a.currentLink:hover {
+
.popupImage {
−
padding-top:30px;
+
float:left;
−
padding-top:1.5vw;
+
margin-top:10px;
−
+
margin-right:15px;
 +
width:150px;
 +
height:300px
 
 
 
}
 
}

Revision as of 02:50, 3 September 2015

@charset "utf-8"; body { width: 80000px; overflow:visible; }

  1. canvas {
   width: 1920px;
   height: 1080px;
   margin: 0px;
   padding: 0px;
   position:fixed;
   top: 0;
   left: 0;

z-index:-100; background:rgba(255,0,4,1.00); }

  1. content {

position:absolute; top:0px; left:0px; width:100000px; z-index:3; background: rgba(0,0,0,0); }

  1. contentBg {

position:fixed; top:0px; left:0px; width:1080; height:100vh; z-index:1; background:rgba(255,255,0,1);

}

.panel {

z-index:0; margin-top:130px; padding-bottom: 10px; padding-top:10px; width:930px; /*width: 100%;*/ height:750px; height: 70vh; float: left; padding-left: 30px; padding-right: 1020px; color:rgba(255,255,255,1); background-color:rgba(0,0,0,0.8); }

  1. team1 {

height:60px; width:350px; margin-right:1920px; padding-right:30px; }

h1 { font-size:42px; font-family:Ubuntu; } h2 { font-size:24px; font-family:Ubuntu; }

p { line-height:14px; font-size:12px; font-family:Volkorn; }

.popupImage { float:left; margin-top:10px; margin-right:15px; width:150px; height:300px

}