Difference between revisions of "Template:Template Wellesley TheTech"

 
(168 intermediate revisions by 3 users not shown)
Line 2: Line 2:
 
<!-- Start of CSS-->
 
<!-- Start of CSS-->
 
<style type="text/css">
 
<style type="text/css">
 +
 +
.css-slideshow {
 +
position: relative;
 +
max-width: 495px;
 +
height: 370px;
 +
margin: 1em auto .5em auto;
 +
font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
 +
font-weight: 300;
 +
}
 +
.css-slideshow figure {
 +
margin: 0;
 +
max-width: 495px;
 +
height: 370px;
 +
background: #fff;
 +
position: absolute;
 +
}
 +
.css-slideshow img {
 +
-webkit-box-shadow: 0 0 2px #666;
 +
box-shadow: 0 0 2px #666;
 +
}
 +
.css-slideshow figcaption {
 +
position: absolute;
 +
top: 5px;
 +
color: #fff;
 +
background: rgba(0,0,0, .3);
 +
font-size: .8em;
 +
padding: 8px 12px;
 +
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
 +
filter: alpha(opacity=0);
 +
opacity: 0;
 +
-webkit-transition: opacity .5s;
 +
-moz-transition: opacity .5s;
 +
-o-transition: opacity .5s;
 +
-ms-transition: opacity .5s;
 +
transition: opacity .5s;
 +
}
 +
.css-slideshow:hover figure figcaption {
 +
-webkit-transition: opacity .5s;
 +
-moz-transition: opacity .5s;
 +
-o-transition: opacity .5s;
 +
-ms-transition: opacity .5s;
 +
transition: opacity .5s;
 +
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
 +
filter: alpha(opacity=100);
 +
opacity: 1;
 +
}
 +
.css-slideshow-attr {
 +
max-width: 530px;
 +
text-align: right;
 +
font-size: .7em;
 +
font-style: italic;
 +
}
 +
.css-slideshow-attr a {
 +
color: #666;
 +
}
 +
.css-slideshow figure:nth-child(1),.css-slideshow figure:nth-child(2),.css-slideshow figure:nth-child(3),.css-slideshow figure:nth-child(4),.css-slideshow figure:nth-child(5),.css-slideshow figure:nth-child(6),.css-slideshow figure:nth-child(7) {
 +
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
 +
filter: alpha(opacity=0);
 +
opacity: 0;
 +
}
 +
.css-slideshow figure:nth-child(1) {
 +
-webkit-animation: xfade 48s 42s  infinite;
 +
-moz-animation: xfade 48s 42s  infinite;
 +
-ms-animation: xfade 48s 42s infinite;
 +
-o-animation: xfade 48s 42s infinite;
 +
animation: xfade 48s 42s infinite;
 +
}
 +
.css-slideshow figure:nth-child(2) {
 +
-webkit-animation: xfade 48s 36s infinite;
 +
-moz-animation: xfade 48s 36s infinite;
 +
-ms-animation: xfade 48s 36s infinite;
 +
-o-animation: xfade 48s 36s infinite;
 +
animation: xfade 48s 36s infinite;
 +
}
 +
.css-slideshow figure:nth-child(3) {
 +
-webkit-animation: xfade 48s 30s infinite;
 +
-moz-animation: xfade 48s 30s infinite;
 +
-ms-animation: xfade 48s 30s infinite;
 +
-o-animation: xfade 48s 30s infinite;
 +
animation: xfade 48s 30s infinite;
 +
}
 +
.css-slideshow figure:nth-child(4) {
 +
-webkit-animation: xfade 48s 24s infinite;
 +
-moz-animation: xfade 48s 24s infinite;
 +
-ms-animation: xfade 48s 24s infinite;
 +
-o-animation: xfade 48s 24s infinite;
 +
animation: xfade 48s 24s infinite;
 +
}
 +
.css-slideshow figure:nth-child(5) {
 +
-webkit-animation: xfade 48s 18s infinite;
 +
-moz-animation: xfade 48s 18s infinite;
 +
-ms-animation: xfade 48s 18s infinite;
 +
-o-animation: xfade 48s 18s infinite;
 +
animation: xfade 48s 18s infinite;
 +
}
 +
.css-slideshow figure:nth-child(6) {
 +
-webkit-animation: xfade 48s 12s infinite;
 +
-moz-animation: xfade 48s 12s infinite;
 +
-ms-animation: xfade 48s 12s infinite;
 +
-o-animation: xfade 48s 12s infinite;
 +
animation: xfade 48s 12s infinite;
 +
}
 +
.css-slideshow figure:nth-child(7) {
 +
-webkit-animation: xfade 48s 6s infinite;
 +
-moz-animation: xfade 48s 6s infinite;
 +
-ms-animation: xfade 48s 6s infinite;
 +
-o-animation: xfade 48s 6s infinite;
 +
animation: xfade 48s 6s infinite;
 +
}
 +
.css-slideshow figure:nth-child(8) {
 +
-webkit-animation: xfade 48s 0s infinite;
 +
-moz-animation: xfade 48s 0s infinite;
 +
-ms-animation: xfade 48s 0s infinite;
 +
-o-animation: xfade 48s 0s infinite;
 +
animation: xfade 48s 0s infinite;
 +
}
 +
@keyframes "xfade" {
 +
0% {
 +
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
 +
  filter: alpha(opacity=100);
 +
  opacity: 1;
 +
}
 +
14.67% {
 +
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
 +
filter: alpha(opacity=100);
 +
opacity: 1;
 +
}
 +
16.67% {
 +
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
 +
filter: alpha(opacity=0);
 +
opacity: 0;
 +
}
 +
98% {
 +
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
 +
  filter: alpha(opacity=0);
 +
  opacity: 0;
 +
}
 +
100% {
 +
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
 +
  filter: alpha(opacity=100);
 +
  opacity: 1;
 +
}
 +
}
 +
@-moz-keyframes xfade {
 +
0% {
 +
  filter: alpha(opacity=100);
 +
  opacity: 1;
 +
}
 +
14.67% {
 +
filter: alpha(opacity=100);
 +
opacity: 1;
 +
}
 +
16.67% {
 +
filter: alpha(opacity=0);
 +
opacity: 0;
 +
}
 +
98% {
 +
  filter: alpha(opacity=0);
 +
  opacity: 0;
 +
}
 +
100% {
 +
  filter: alpha(opacity=100);
 +
  opacity: 1;
 +
}
 +
}
 +
@-webkit-keyframes "xfade" {
 +
0% {
 +
  filter: alpha(opacity=100);
 +
  opacity: 1;
 +
}
 +
14.67% {
 +
filter: alpha(opacity=100);
 +
opacity: 1;
 +
}
 +
16.67% {
 +
filter: alpha(opacity=0);
 +
opacity: 0;
 +
}
 +
98% {
 +
  filter: alpha(opacity=0);
 +
  opacity: 0;
 +
}
 +
100% {
 +
  filter: alpha(opacity=100);
 +
  opacity: 1;
 +
}
 +
}
 +
@-ms-keyframes "xfade" {
 +
0% {
 +
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
 +
  filter: alpha(opacity=100);
 +
  opacity: 1;
 +
}
 +
14.67% {
 +
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
 +
filter: alpha(opacity=100);
 +
opacity: 1;
 +
}
 +
16.67% {
 +
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
 +
filter: alpha(opacity=0);
 +
opacity: 0;
 +
}
 +
98% {
 +
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
 +
  filter: alpha(opacity=0);
 +
  opacity: 0;
 +
}
 +
100% {
 +
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
 +
  filter: alpha(opacity=100);
 +
  opacity: 1;
 +
}
 +
}
 +
@-o-keyframes "xfade" {
 +
0% {
 +
  filter: alpha(opacity=100);
 +
  opacity: 1;
 +
}
 +
14.67% {
 +
filter: alpha(opacity=100);
 +
opacity: 1;
 +
}
 +
16.67% {
 +
filter: alpha(opacity=0);
 +
opacity: 0;
 +
}
 +
98% {
 +
  filter: alpha(opacity=0);
 +
  opacity: 0;
 +
}
 +
100% {
 +
  filter: alpha(opacity=100);
 +
  opacity: 1;
 +
}
 +
}
 
 
  
Line 19: Line 255:
 
}
 
}
 
                          
 
                          
−
                         #bodyContent {border:none; height: 100%; width: 100%; margin:auto; position:relative;}
+
                         #bodyContent {border:none; height: 100%; width: 100%; margin:auto; position:relative; }
−
                         #content {border-left: 0px; border-right: 0px; height: calc(100% - 40px); background: transparent;}
+
                         #content {border-left: 0px; border-right: 0px; height:100%; background: transparent; min-height: 679px; bottom:0px;}
 
                         #globalWrapper {font-size: 100%; height: 100%; margin: 0px; position:absolute;}
 
                         #globalWrapper {font-size: 100%; height: 100%; margin: 0px; position:absolute;}
−
                        #top_menu_inside, #top_menu_14 {width: 100%; border:none; background-color: #7a86c2; z-index: 4; margin-top: 0px; height:40px; margin-bottom: 0px;}
 
 
                         .firstHeading {display:none;}
 
                         .firstHeading {display:none;}
 
                          
 
                          
Line 34: Line 269:
 
background-color: #fff;
 
background-color: #fff;
 
border-bottom: 14px solid #717171;
 
border-bottom: 14px solid #717171;
 +
                                text-decoration: none;
  
 
}
 
}
 +
 +
  
 
/*Set up height place holder for the banner*/
 
/*Set up height place holder for the banner*/
 
#bannerContainer {
 
#bannerContainer {
−
bottom: 0px;
+
bottom: 10px;
 
margin-left: -45px;
 
margin-left: -45px;
 
width: 1061px;
 
width: 1061px;
Line 46: Line 284:
 
                                 pointer-events: none !important;
 
                                 pointer-events: none !important;
 
}
 
}
 +
 +
#linkscontainer{
 +
    position: absolute;
 +
    height: 185px;
 +
    top: 2px;
 +
    right: -40px;
 +
}
 +
 +
#linkscontainer img{
 +
height: inherit;
 +
}
  
  
Line 65: Line 314:
 
font-size: 40px;
 
font-size: 40px;
 
margin: 25px 50px 5px;
 
margin: 25px 50px 5px;
−
                                 text-decoration: none !important;
+
                                 border: 0px;
 +
                                line-height: 40px;
 
}
 
}
  
Line 72: Line 322:
 
font-family: "SlimJoe";
 
font-family: "SlimJoe";
 
font-size: 45px;
 
font-size: 45px;
−
margin: -60px 410px -40px;
+
line-height: 10px;
−
                                 text-decoration: none !important;
+
                                margin-left: 410px;
 +
                                 margin-top: -45px;
 +
                                border: 0px;
 
}
 
}
  
Line 82: Line 334:
  
 
.nextLine{
 
.nextLine{
−
margin-top: -40px;
+
                                margin-top: -85px;
 
margin-left: 60px;
 
margin-left: 60px;
 
}
 
}
  
 
#menuBar {
 
#menuBar {
−
                                 padding-top: 150px;
+
                                 padding-top: 185px;
 
width: 100%;
 
width: 100%;
 
}
 
}
Line 105: Line 357:
 
    text-align: center;
 
    text-align: center;
 
    font-family: "SlimJoe";
 
    font-family: "SlimJoe";
−
font-size: 20px;
+
font-size: 15px;
 
font-weight: bold;
 
font-weight: bold;
 
color: #fff;
 
color: #fff;
 
cursor: pointer;
 
cursor: pointer;
−
                            padding: 0px;
 
−
                            width: 24%;
 
 
                             line-height: 40px;
 
                             line-height: 40px;
 
                             vertical-align: center;
 
                             vertical-align: center;
 
                             white-space: nowrap;
 
                             white-space: nowrap;
 +
                            width: 20% ;
 +
                            border-left: 1px solid #57c7da;
 +
                            border-right: 1px solid #57c7da;
 
}
 
}
  
 
                         #placeholder, #placeholder:hover {
 
                         #placeholder, #placeholder:hover {
−
                             width: 4% !important;
+
                             width: 15% !important;
 
                             pointer-events: none;
 
                             pointer-events: none;
 +
                            border-left: 0px;
 +
                            border-right: 0px;
 
                         }
 
                         }
  
 
#menuBar ul li:hover {
 
#menuBar ul li:hover {
−
color: #57c7da;
+
color: #fff;
−
background: #fff;
+
background: #57c7da;
 
}
 
}
  
Line 129: Line 384:
 
padding: 0;
 
padding: 0;
 
position: absolute;
 
position: absolute;
−
top: 48px;
+
left: inherit;
−
left: 0;
+
width: 209px;
−
width: 150px;
+
                                height: auto;
 
display: none;
 
display: none;
−
  opacity: 0;
+
                                background-color: #96dce8;  
−
  visibility: hidden;
+
 
}
 
}
  
 
#menuBar ul li ul li {  
 
#menuBar ul li ul li {  
−
  background: #555;  
+
                                font-size: 13px;
−
display: block;  
+
                                background-color: #96dce8;
−
color: #fff;
+
                                color: #717171;
 +
                                width: 209px;
 +
    height: 20px;
 +
    line-height: 20px;
 +
    display: block;
 
}
 
}
  
 +
                        #menuBar li:hover ul {
 +
                                display: block;
 +
                      }
 +
 +
#overviewRect{
 +
margin:10px;
 +
margin-left:260px;
 +
color: #717171;
 +
font-family: "Roboto", sans-serif;
 +
font-size: 12px;
 +
padding: 10px;
 +
text-align: justify;
 +
border: 3px solid #fff;
 +
}
 +
 +
#allPage_banner{
 +
position: absolute;
 +
margin-top: 1px;
 +
margin-left: 0px;
 +
width: inherit;
 +
background: transparent;
 +
}
 +
 +
#allPage_banner img {
 +
width: inherit;
 +
}
 +
 +
#allPage_banner h1{
 +
color: #fff !important;
 +
font-weight: bold;
 +
font-family: "Roboto", sans-serif;
 +
font-size: 70px;
 +
                                border: 0px;
 +
                                line-height: 70px;
 +
margin-top: 30px;
 +
margin-left: 50px;
 +
margin-bottom: 0;
 +
opacity: 0.9;
 +
padding: 0px;
 +
 +
}
 +
 +
#allPage_banner h1:hover{
 +
opacity:1;
 +
}
 +
 +
#allPage_banner a {
 +
color: #fff !important;
 +
}
 +
 +
#allPage_banner a:hover{
 +
padding-top: 2px;
 +
 +
}
 +
 +
 +
.allPage ul li ul li{
 +
width: 249px;
 +
}
 +
 +
#pageContent {
 +
width: 100%;
 +
border: none;
 +
background: transparent;
 +
padding: 5px;
 +
}
 +
 +
#pageContent a {
 +
padding: 5px;
 +
}
 +
 +
#teamlinks{
 +
color: #57c7da;
 +
font-family: "SlimJoe";
 +
font-size: 20px;
 +
text-align:center;
 +
margin: auto;
 +
}
 +
 +
#teamlinks a:hover{
 +
color:#717171;
 +
}
 +
 +
 +
#pageContent h1 {
 +
color: #57c7da;
 +
font-weight: bold;
 +
font-family: "Roboto", sans-serif;
 +
font-size: 40px;
 +
                                border: 0px;
 +
                                line-height: 40px;
 +
margin: 0px;
 +
padding: 20px;
 +
text-align: center;
 +
}
 +
 +
#pageContent h2 {
 +
 +
color: #57c7da;
 +
font-weight: bold;
 +
font-family: "Roboto", sans-serif;
 +
font-size: 30px;
 +
border: 0px;
 +
line-height: 40px;
 +
margin: 0px;
 +
padding: 20px;
 +
text-align: center;
 +
 +
}
 +
 +
 +
#pageContent h3 {
 +
 +
color: #57c7da;
 +
font-weight: bold;
 +
font-family: "Roboto", sans-serif;
 +
font-size: 25px;
 +
border: 0px;
 +
line-height: 25px;
 +
margin: 0px;
 +
padding: 5px;
 +
 +
}
 +
 +
#pageContent h4 {
 +
 +
color: #5f5f5f;
 +
font-weight: bold;
 +
font-family: "Roboto", sans-serif;
 +
font-size: 20px;
 +
border: 0px;
 +
line-height: 20px;
 +
margin: 0px;
 +
padding: 1px;
 +
 +
}
 +
 +
#pageContent p {
 +
color: #5f5f5f;
 +
font-family: "Roboto", sans-serif;
 +
font-size: 20px;
 +
border: 0px;
 +
line-height: 25px;
 +
margin: 0px;
 +
padding: 5px;
 +
}
 +
 +
#pageContent li {
 +
color: #5f5f5f;
 +
font-family: "Roboto", sans-serif;
 +
font-size: 20px;
 +
border: 0px;
 +
line-height: 25px;
 +
margin: 0px;
 +
padding: 5px;
 +
}
 +
 +
.medal-list li {
 +
color: #5f5f5f;
 +
font-family: "Roboto", sans-serif;
 +
font-size: 25px;
 +
border: 0px;
 +
line-height: 30px;
 +
margin: 0px;
 +
padding: 5px;
 +
}
 +
 +
.medal-list a {
 +
color: #57c7da;
 +
}
 +
 +
.medal-list a:hover {
 +
text-decoration: underline;
 +
}
 +
 +
.acknowledgementsList li {
 +
color: #5f5f5f;
 +
font-family: "Roboto", sans-serif;
 +
font-size: 20px;
 +
border: 0px;
 +
line-height: 25px;
 +
margin: 0px;
 +
padding: 2px;
 +
}
 +
 +
ul.checkmark{
 +
list-style:none;
 +
}
 +
 +
ul.checkmark li:before {
 +
    content:"\2713\0020";
 +
}
 +
 +
ul.checkmark li{
 +
font-family: "SlimJoe";
 +
font-size: 14px;
 +
}
 +
 +
table.medals {
 +
    border-collapse: separate;
 +
    width: 100%;
 +
    border: none;
 +
    table-layout: auto;
 +
}
 +
 +
a.staySame {
 +
color: #5d6bb2;
 +
}
 +
 +
a.staySame : visited {
 +
color: #5d6bb2;
 +
}
  
 
</style>
 
</style>
 
</html>
 
</html>

Latest revision as of 03:52, 19 September 2015