Difference between revisions of "Template:ECUST/CSS"

Line 1: Line 1:
 
<html>
 
<html>
 
<style>
 
<style>
 +
 +
  
  
Line 57: Line 59:
  
 
.stars {
 
.stars {
     background-color:#000000;
+
     background-color:#2f2f2f;
 
     z-index:-3;
 
     z-index:-3;
 
     position: fixed;
 
     position: fixed;
Line 506: Line 508:
 
nav {
 
nav {
 
     height: 100px;
 
     height: 100px;
     background: linear-gradient(to right, black ,var(--logo-pink));
+
     background: linear-gradient(to right, black ,#ff4e4e);
 
     box-shadow: 0 6px 12px rgba(0,0,0,0.5),0 12px 32px rgba(0,0,0,0.1);  
 
     box-shadow: 0 6px 12px rgba(0,0,0,0.5),0 12px 32px rgba(0,0,0,0.1);  
 
     position: fixed;
 
     position: fixed;
Line 536: Line 538:
  
 
nav ul a:hover, nav ul li:hover .dropbtn, .show .dropbtn{
 
nav ul a:hover, nav ul li:hover .dropbtn, .show .dropbtn{
     background-color: var(--logo-pink);
+
     background-color: #ff4e4e;
 +
color:#4f1919;
 
     box-shadow: 0 6px 12px rgba(0,0,0,0.5),0 12px 32px rgba(0,0,0,0.1);
 
     box-shadow: 0 6px 12px rgba(0,0,0,0.5),0 12px 32px rgba(0,0,0,0.1);
 
     height: 105px;
 
     height: 105px;
Line 542: Line 545:
  
 
a.active, nav ul li.active .dropbtn{
 
a.active, nav ul li.active .dropbtn{
     background-color: var(--logo-pink);
+
     background-color: #ff4e4e;
 
     box-shadow: 0 6px 12px rgba(0,0,0,0.5),0 12px 32px rgba(0,0,0,0.1);
 
     box-shadow: 0 6px 12px rgba(0,0,0,0.5),0 12px 32px rgba(0,0,0,0.1);
 
     height: 105px;
 
     height: 105px;
Line 572: Line 575:
 
     display: none;
 
     display: none;
 
     position: absolute;
 
     position: absolute;
     background-color: var(--logo-bright-blue);
+
     background-color: #4f1919;
 
     z-index: 1;
 
     z-index: 1;
 
}
 
}
Line 594: Line 597:
  
 
.nav-dropdown a:hover {
 
.nav-dropdown a:hover {
     background-color: var(--logo-dark-blue);
+
     background-color: #c14141;
     color: var(--bright-bg-color);
+
     color: #4f1919;
 
     box-shadow: 0 3px 6px rgba(0,0,0,0.25),0 6px 16px rgba(0,0,0,0.05);
 
     box-shadow: 0 3px 6px rgba(0,0,0,0.25),0 6px 16px rgba(0,0,0,0.05);
 
     height: 45px;
 
     height: 45px;
Line 690: Line 693:
 
.footerbar {
 
.footerbar {
 
     font: var(--bodyfont);
 
     font: var(--bodyfont);
     margin-top: 150px;
+
     margin-top: 0px;
     padding: 20px;
+
     padding: 0px;
 
     width: 100%;
 
     width: 100%;
 
     min-height: 150px;
 
     min-height: 150px;
Line 707: Line 710:
 
}
 
}
  
.footerbar a, .footerbar a:visited, footerbar a:hover, .footerbar a:focus, .footerbar a:active {
+
.footerbar a, .footerbar a:visited, footerbar a:dr, .footerbar a:focus, .footerbar a:active {
 
     text-decoration: none;
 
     text-decoration: none;
 
     color: white;
 
     color: white;
Line 991: Line 994:
 
         width: 100%;
 
         width: 100%;
 
         display: block;
 
         display: block;
         background-color: var(--logo-bright-blue);
+
         background-color: #c14141;
 
         position: relative;
 
         position: relative;
 
     }
 
     }
Line 1,015: Line 1,018:
  
 
     nav ul a:hover, nav ul li:hover .dropbtn{
 
     nav ul a:hover, nav ul li:hover .dropbtn{
         background-color: var(--logo-pink);
+
         background-color: #ff4e4e;
 +
color:#4f1919;
 
         width: 100%;
 
         width: 100%;
 
         box-shadow: none;
 
         box-shadow: none;
Line 1,026: Line 1,030:
 
     .nav-dropdown {
 
     .nav-dropdown {
 
         display: none;
 
         display: none;
         background-color: var(--logo-pink);
+
         background-color: #4f1919;
 
         min-width: 130px;
 
         min-width: 130px;
 
         z-index: 1;
 
         z-index: 1;
Line 1,151: Line 1,155:
 
     92% { transform: translateY(-12px);}
 
     92% { transform: translateY(-12px);}
 
     55%, 75%, 87%, 97%, 100% { transform: translateY(0px);}
 
     55%, 75%, 87%, 97%, 100% { transform: translateY(0px);}
 +
}
 +
 +
 +
.t-body {
 +
    margin: 0;
 +
}
 +
.landing-video {
 +
                            position: relative;
 +
                         
 +
                            width: 100%;
 +
                            height: auto;
 +
                            background-color: #974c4c;
 +
                         
 +
 +
                        } 
 +
.phage-scroller {
 +
              width: 150px;
 +
              height: auto;
 +
}
 +
@media (max-width: 1200px) {
 +
          #overall-wrapper {
 +
        min-width: 1000px;
 +
  }
 +
          #wrapper {
 +
              padding-bottom: 0px;
 +
          }
 +
 +
              #textblock1 {
 +
          position: absolute;
 +
          top: 50px;
 +
          left: 0px;
 +
          width: 400px;
 +
      }     
 +
          #textblock1 > p, #textblock2 > p, #textblock3 > p,#textblock4 > p, #textblock5 > p,#textblock6 > p,#textblock7 > p,#textblock8 > p,#textblock9 > p {
 +
    color: white !important;
 +
   
 +
 
 +
    font-size: 24px !important;
 +
    font-weight: 300 !important;
 +
}
 +
         
 +
    #textblock1 > a, #textblock2 > a,#textblock3 > a, #textblock4 > a,#textblock5 > a,#textblock6 > a,#textblock7 > a,#textblock8 > a,#textblock9 > a      {
 +
    line-height: 50px !important;
 +
    font-size: 50px !Important;
 +
}
 +
}
 +
@media screen and (max-width: 960px) {
 +
    .t-container {
 +
      width: 1000px ! important;
 +
      max-width: 1200px !important;
 +
      min-width: 980px !important;
 +
    }
 +
  }
 +
 +
@media screen and (max-device-width: 1024px) {
 +
    .t-cover {
 +
        background-attachment: fixed
 +
    }
 +
}
 +
.textblock > p {font-family: 'Josefin Sans' !important; font-size: 20px !important; color: #444 !important;font-weight: 300 !important;}
 +
 +
      #textblock1 {
 +
          position: absolute;
 +
          top: 100px;
 +
          left: 20px;
 +
          width:500px;
 +
      }     
 +
#textblock1 > p, #textblock3 > p, #textblock5 > p,#textblock2 > p, #textblock4 > p, #textblock6 > p, #textblock7 > p, #textblock8 > p {
 +
    color: white !important;
 +
    text-align: center;
 +
    font-size: 26px !important;
 +
    font-weight: 300 !important;
 +
}
 +
 +
#textblock1 > a {
 +
    color: #F8991D;
 +
    font-size: 60px !important;
 +
    line-height: 60px !important;
 +
}
 +
#textblock1 > a:hover, #textblock2 > a:hover, #textblock3 > a:hover, #textblock4 > a:hover, #textblock5 > a:hover, #textblock6 > a:hover, #textblock7 > a:hover, #textblock9 > a:hover  {
 +
    text-decoration: underline;
 
}
 
}
  

Revision as of 14:16, 22 August 2018