Difference between revisions of "Team:IISER-Kolkata/style.css"

(temp page for 29-6 deadline. completed till team)
Line 1: Line 1:
 
.logo_2018, #firstHeading, #top_menu_under {
 
.logo_2018, #firstHeading, #top_menu_under {
−
display:none;}
+
display:none !important;}
  
 
#content {
 
#content {
−
width: 100vw;
+
width: 100vw !important;
−
padding: 0;
+
padding: 0 !important;
−
margin-left:0;
+
margin-left:0 !important;
 
}
 
}
 
/*fonts*/
 
/*fonts*/
 
@font-face {
 
@font-face {
−
     src: url("https://static.igem.org/mediawiki/2018/1/14/T--IISER-Kolkata--blogger.ttf");
+
     src: url("https://static.igem.org/mediawiki/2018/1/14/T--IISER-Kolkata--blogger.ttf") !important;
−
     font-family: blogger;
+
     font-family: blogger !important;
 
}
 
}
 
@font-face {
 
@font-face {
−
     src: url("https://static.igem.org/mediawiki/2018/7/7a/T--IISER-Kolkata--prime.otf");
+
     src: url("https://static.igem.org/mediawiki/2018/7/7a/T--IISER-Kolkata--prime.otf") !important;
−
     font-family: prime;
+
     font-family: prime !important;
 
}
 
}
 
@font-face {
 
@font-face {
−
     src: url("https://static.igem.org/mediawiki/2018/5/5a/T--IISER-Kolkata--rodina.otf");
+
     src: url("https://static.igem.org/mediawiki/2018/5/5a/T--IISER-Kolkata--rodina.otf") !important;
−
     font-family: rodina;
+
     font-family: rodina !important;
 
}
 
}
 
@font-face {
 
@font-face {
−
     src: url("https://static.igem.org/mediawiki/2018/f/f7/T--IISER-Kolkata--social.ttf");
+
     src: url("https://static.igem.org/mediawiki/2018/f/f7/T--IISER-Kolkata--social.ttf") !important;
−
     font-family: social;
+
     font-family: social !important;
 
}
 
}
  
 
/*body*/
 
/*body*/
 
body, html {
 
body, html {
−
width: 100vw;
+
width: 100vw !important;
−
margin: 0;
+
margin: 0 !important;
−
padding: 0;
+
padding: 0 !important;
 
}
 
}
 
body {
 
body {
−
     height: 1200vh;
+
     height: 1200vh !important;
−
overflow-y: scroll;
+
overflow-y: scroll !important;
−
overflow-x: hidden;
+
overflow-x: hidden !important;
−
margin: auto;
+
margin: auto !important;
 
}
 
}
 
body::-webkit-scrollbar-track
 
body::-webkit-scrollbar-track
 
{
 
{
−
background-color: black;
+
background-color: black !important;
 
}
 
}
 
body::-webkit-scrollbar
 
body::-webkit-scrollbar
 
{
 
{
−
width: 1vw;
+
width: 1vw !important;
 
}
 
}
 
body::-webkit-scrollbar-thumb
 
body::-webkit-scrollbar-thumb
 
{
 
{
−
background-color: #999999;
+
background-color: #999999 !important;
 
}
 
}
 
body::-webkit-scrollbar-thumb:hover
 
body::-webkit-scrollbar-thumb:hover
 
{
 
{
−
     background-color: #777777;
+
     background-color: #777777 !important;
 
}
 
}
  
 
#container {
 
#container {
−
height: 1200vh;
+
height: 1200vh !important;
−
width: 100vw;
+
width: 100vw !important;
−
display: flex;
+
display: flex !important;
−
flex-direction: column;
+
flex-direction: column !important;
 
}
 
}
  
 
#home_gif{
 
#home_gif{
−
     height: 60vh;
+
     height: 60vh !important;  
−
     width: 60vw;
+
     width: 60vw !important;
−
     margin-left: 20vw;
+
     margin-left: 20vw !important;
−
     margin-top: 2vh;
+
     margin-top: 2vh !important;
 
}
 
}
 
#main_title{
 
#main_title{
−
     top: 57vh;
+
     top: 57vh !important;
−
     left: 20vw;
+
     left: 20vw !important;
−
     height: 6vw;
+
     height: 6vw !important;
−
     width: 6vw;
+
     width: 6vw !important;
−
     font-size: 4vw;
+
     font-size: 4vw !important;
−
     position: absolute;
+
     position: absolute !important;
−
     align-items: center;
+
     align-items: center !important;
−
     justify-content: center;
+
     justify-content: center !important;
 
}
 
}
 
#title_desc{
 
#title_desc{
−
     position: absolute;
+
     position: absolute !important;
−
     left: 40vw;
+
     left: 40vw !important;
−
     top: 65vh;
+
     top: 65vh !important;
−
     height: 4vh;
+
     height: 4vh !important;
−
     width:40vw;
+
     width:40vw !important;
−
     align-items: center;
+
     align-items: center !important;
−
     justify-content: center;
+
     justify-content: center !important;
 
}
 
}
  
 
#mascot{
 
#mascot{
−
     margin-left:5vw;
+
     margin-left:5vw !important;
−
     margin-top: 15vh;
+
     margin-top: 15vh !important;
 
}
 
}
  
 
#abstract_text{
 
#abstract_text{
−
     height:70vh;
+
     height:70vh !important;
−
     width:55vw;
+
     width:55vw !important;
−
     left:40vw;
+
     left:40vw !important;
−
     top:15vh;
+
     top:15vh !important;
−
     justify-content: center;
+
     justify-content: center !important;
−
     align-items: center;
+
     align-items: center !important;
−
     position: absolute;
+
     position: absolute !important;
 
}
 
}
  
 
#descript  ,#details{
 
#descript  ,#details{
−
     height:70vh;
+
     height:70vh !important;
−
     width:80vw;
+
     width:80vw !important;
−
     top:20vh;
+
     top:20vh !important;
−
     left:10vw;
+
     left:10vw !important;
 
}
 
}
 
#des_left ,#det_cont{
 
#des_left ,#det_cont{
−
     position: absolute;
+
     position: absolute !important;
−
     left:10vw;
+
     left:10vw !important;
−
     top: 15vh;
+
     top: 15vh !important;
−
     width: 80vw;
+
     width: 80vw !important;
−
     justify-content: center;
+
     justify-content: center !important;
−
     align-items: center;
+
     align-items: center !important;
−
     text-align: justify;
+
     text-align: justify !important;
 
}
 
}
 
#team_left{
 
#team_left{
−
     width: 35vw;
+
     width: 35vw !important;
−
     height: 70vh;
+
     height: 70vh !important;
−
     left:10vw;
+
     left:10vw !important;
−
     top:25vh;
+
     top:25vh !important;
−
     position: absolute;
+
     position: absolute !important;
 
}
 
}
 
#team_right{
 
#team_right{
−
     width: 35vw;
+
     width: 35vw !important;
−
     height: 70vh;
+
     height: 70vh !important;
−
     left:45vw;
+
     left:45vw !important;
−
     top:17vh;
+
     top:17vh !important;
−
     position: absolute;
+
     position: absolute !important;
 
}
 
}
 
#team_right2{
 
#team_right2{
−
     width: 35vw;
+
     width: 35vw !important;
−
     height: 70vh;
+
     height: 70vh !important;
−
     left:75vw;
+
     left:75vw !important;
−
     top:17vh;
+
     top:17vh !important;
−
     position: absolute;
+
     position: absolute !important;
 
}
 
}
 
/*navbar*/
 
/*navbar*/
 
#menubar {   
 
#menubar {   
−
width: 100vw;
+
width: 100vw !important;
−
     height: 3vw;
+
     height: 3vw !important;
−
     background-color: rgba(0,0,0,0.7);
+
     background-color: rgba(0,0,0,0.7) !important;
−
     display: inline-flex;
+
     display: inline-flex !important;
−
     align-items: center;   
+
     align-items: center !important;   
−
     position: absolute;
+
     position: absolute !important;
−
     top: 100vh;
+
     top: 100vh !important;
−
     left: 0vw;
+
     left: 0vw !important;
−
     z-index: 10;
+
     z-index: 10 !important;
 
}
 
}
 
#menubar.stickymenu {
 
#menubar.stickymenu {
−
     position: fixed;
+
     position: fixed !important;
−
     top: 3vh;
+
     top: 3vh !important;
−
     left: 0vw;
+
     left: 0vw !important;
 
}
 
}
 
#menubar #logo {
 
#menubar #logo {
−
     margin-left: 1vw;
+
     margin-left: 1vw !important;
−
     margin-right: 1vw;
+
     margin-right: 1vw !important;
−
     display: flex;
+
     display: flex !important;
−
     width: 2.5vw;
+
     width: 2.5vw !important;
−
     height: 2.5vw;     
+
     height: 2.5vw !important;     
 
}
 
}
 
#logo img {
 
#logo img {
−
     height: 100%;
+
     height: 100% !important;
−
     width: 100%;
+
     width: 100% !important;
 
}
 
}
 
#menubar .pagelink {
 
#menubar .pagelink {
−
     display: flex;   
+
     display: flex !important;   
−
     align-items: center;
+
     align-items: center !important;
−
     justify-content: center;   
+
     justify-content: center !important;   
−
     height: 100%;
+
     height: 100% !important;
−
     width: 8vw;         
+
     width: 8vw !important;         
 
}
 
}
 
#menubar .pagelink#registerMenu {
 
#menubar .pagelink#registerMenu {
−
     margin-left: auto;
+
     margin-left: auto !important;
 
}
 
}
 
#menubar .pagelink#loginMenu {
 
#menubar .pagelink#loginMenu {
−
     margin-right: 1vw;
+
     margin-right: 1vw !important;
 
}
 
}
 
.pagelink div {
 
.pagelink div {
−
     cursor: pointer;
+
     cursor: pointer !important;
−
     -webkit-transition: 0.2s linear;
+
     -webkit-transition: 0.2s linear !important;
−
     -moz-transition: 0.2s linear;
+
     -moz-transition: 0.2s linear !important;
−
     -o-transition: 0.2s linear;
+
     -o-transition: 0.2s linear !important;
−
     transition: 0.2s linear;
+
     transition: 0.2s linear !important;
 
}
 
}
 
.pagelink div p {
 
.pagelink div p {
−
     font-family: prime !imporant;
+
     font-family: prime !imporant !important;
−
     font-size: 1vw;  
+
     font-size: 1vw !important;  
−
     color: #cccccc;   
+
     color: #cccccc !important;   
 
}
 
}
 
.pagelink div:hover > p {
 
.pagelink div:hover > p {
−
     color: white !important;
+
     color: white !important !important;
 
}
 
}
  
 
.orangetext div p {
 
.orangetext div p {
−
     color: orange !important;
+
     color: orange !important !important;
 
}
 
}
 
.orangetext div:hover > p {
 
.orangetext div:hover > p {
−
     color: yellow !important;
+
     color: yellow !important !important;
 
}
 
}
  
 
section {
 
section {
−
position: relative;
+
position: relative !important;
−
display: flex;
+
display: flex !important;
−
height: 200vh;
+
height: 200vh !important;
−
width: 100vw;
+
width: 100vw !important;
 
}
 
}
  
 
#home {
 
#home {
−
     background: white;
+
     background: white !important;
−
     height: 100vh;
+
     height: 100vh !important;
 
}
 
}
 
#home #iiserk {
 
#home #iiserk {
−
     height: 6vw;
+
     height: 6vw !important;
−
     width: 6vw;     
+
     width: 6vw !important;     
−
     display: flex;
+
     display: flex !important;
−
     align-items: center;   
+
     align-items: center !important;   
−
     position: absolute;
+
     position: absolute !important;
−
     top: 1vw;
+
     top: 1vw !important;
−
     left: 1vw;
+
     left: 1vw !important;
−
     z-index: 5;
+
     z-index: 5 !important;
−
     cursor: pointer;
+
     cursor: pointer !important;
 
}
 
}
 
#iiserk:hover {
 
#iiserk:hover {
Line 228: Line 228:
 
}
 
}
 
#iiserk a img {
 
#iiserk a img {
−
     height: 6vw;
+
     height: 6vw !important;
−
     width: auto;
+
     width: auto !important;
 
}
 
}
 
#home #pagedown {
 
#home #pagedown {
−
     top: 90vh;
+
     top: 90vh !important;
−
     left: 47vw;
+
     left: 47vw !important;
−
     height: 3vw;
+
     height: 3vw !important;
−
     margin-left: 6vw;
+
     margin-left: 6vw !important;
−
     margin-top: 7vh;
+
     margin-top: 7vh !important;
−
     width: 6vw;
+
     width: 6vw !important;
−
     cursor: pointer;
+
     cursor: pointer !important;
−
     display: flex;
+
     display: flex !important;
−
     align-items: center;
+
     align-items: center !important;
−
     justify-content: center;
+
     justify-content: center !important;
−
     background-color: gray;
+
     background-color: gray !important;
−
     border: solid black 0.1vw;
+
     border: solid black 0.1vw !important;
 
}
 
}
  
 
/*aboutUs page*/
 
/*aboutUs page*/
 
#aboutUs {
 
#aboutUs {
−
background-color: D8D9E5;
+
background-color: D8D9E5 !important;
 
}
 
}
  
Line 254: Line 254:
 
/*events page*/
 
/*events page*/
 
#events {
 
#events {
−
     background-color: B4BAC2;
+
     background-color: B4BAC2 !important;
 
}
 
}
  
 
#gallery {
 
#gallery {
−
     background-color: D8D9E5;
+
     background-color: D8D9E5 !important;
 
}
 
}
 
#ourTeam {
 
#ourTeam {
−
     background-color: B4BAC2;
+
     background-color: B4BAC2 !important;
 
}
 
}
 
#sponsors {
 
#sponsors {
−
     background-color: D8D9E5;
+
     background-color: D8D9E5 !important;
 
}
 
}
 
#reachUs {
 
#reachUs {
−
     background-color: B4BAC2;
+
     background-color: B4BAC2 !important;
−
     height: 100vh;
+
     height: 100vh !important;
 
}
 
}

Revision as of 13:03, 29 June 2018

.logo_2018, #firstHeading, #top_menu_under { display:none !important;}

  1. content {

width: 100vw !important; padding: 0 !important; margin-left:0 !important; } /*fonts*/ @font-face { 

   src: url("https://static.igem.org/mediawiki/2018/1/14/T--IISER-Kolkata--blogger.ttf") !important;
   font-family: blogger !important;

} @font-face { 

   src: url("https://static.igem.org/mediawiki/2018/7/7a/T--IISER-Kolkata--prime.otf") !important;
   font-family: prime !important;

} @font-face { 

   src: url("https://static.igem.org/mediawiki/2018/5/5a/T--IISER-Kolkata--rodina.otf") !important;
   font-family: rodina !important;

} @font-face { 

   src: url("https://static.igem.org/mediawiki/2018/f/f7/T--IISER-Kolkata--social.ttf") !important;
   font-family: social !important;

}

/*body*/ body, html { width: 100vw !important; margin: 0 !important; padding: 0 !important; } body { 

   height: 1200vh !important;

overflow-y: scroll !important; overflow-x: hidden !important; margin: auto !important; } body::-webkit-scrollbar-track { background-color: black !important; } body::-webkit-scrollbar { width: 1vw !important; } body::-webkit-scrollbar-thumb { background-color: #999999 !important; } body::-webkit-scrollbar-thumb:hover { 

   background-color: #777777 !important;

}

  1. container {

height: 1200vh !important; width: 100vw !important; display: flex !important; flex-direction: column !important; }

  1. home_gif{
   height: 60vh !important; 
   width: 60vw !important;
   margin-left: 20vw !important;
   margin-top: 2vh !important;

}

  1. main_title{
   top: 57vh !important;
   left: 20vw !important;
   height: 6vw !important;
   width: 6vw !important;
   font-size: 4vw !important;
   position: absolute !important;
   align-items: center !important;
   justify-content: center !important;

}

  1. title_desc{
   position: absolute !important;
   left: 40vw !important;
   top: 65vh !important;
   height: 4vh !important;
   width:40vw !important;
   align-items: center !important;
   justify-content: center !important;

}

  1. mascot{
   margin-left:5vw !important;
   margin-top: 15vh !important;

}

  1. abstract_text{
   height:70vh !important;
   width:55vw !important;
   left:40vw !important;
   top:15vh !important;
   justify-content: center !important;
   align-items: center !important;
   position: absolute !important;

}

  1. descript ,#details{
   height:70vh !important;
   width:80vw !important;
   top:20vh !important;
   left:10vw !important;

}

  1. des_left ,#det_cont{
   position: absolute !important;
   left:10vw !important;
   top: 15vh !important;
   width: 80vw !important;
   justify-content: center !important;
   align-items: center !important;
   text-align: justify !important;

}

  1. team_left{
   width: 35vw !important;
   height: 70vh !important;
   left:10vw !important;
   top:25vh !important;
   position: absolute !important;

}

  1. team_right{
   width: 35vw !important;
   height: 70vh !important;
   left:45vw !important;
   top:17vh !important;
   position: absolute !important;

}

  1. team_right2{
   width: 35vw !important;
   height: 70vh !important;
   left:75vw !important;
   top:17vh !important;
   position: absolute !important;

} /*navbar*/

  1. menubar {

width: 100vw !important; 

   height: 3vw !important;
   background-color: rgba(0,0,0,0.7) !important;
   display: inline-flex !important;
   align-items: center !important;  
   position: absolute !important;
   top: 100vh !important;
   left: 0vw !important;
   z-index: 10 !important;

}

  1. menubar.stickymenu {
   position: fixed !important;
   top: 3vh !important;
   left: 0vw !important;

}

  1. menubar #logo {
   margin-left: 1vw !important;
   margin-right: 1vw !important;
   display: flex !important;
   width: 2.5vw !important;
   height: 2.5vw !important;

}

  1. logo img {
   height: 100% !important;
   width: 100% !important;

}

  1. menubar .pagelink {
   display: flex !important;  
   align-items: center !important;
   justify-content: center !important;   
   height: 100% !important;
   width: 8vw !important;

}

  1. menubar .pagelink#registerMenu {
   margin-left: auto !important;

}

  1. menubar .pagelink#loginMenu {
   margin-right: 1vw !important;

} .pagelink div { 

   cursor: pointer !important;
   -webkit-transition: 0.2s linear !important;
   -moz-transition: 0.2s linear !important;
   -o-transition: 0.2s linear !important;
   transition: 0.2s linear !important;

} .pagelink div p { 

   font-family: prime !imporant !important;
   font-size: 1vw !important; 
   color: #cccccc !important;

} .pagelink div:hover > p { 

   color: white !important !important;

}

.orangetext div p { 

   color: orange !important !important;

} .orangetext div:hover > p { 

   color: yellow !important !important;

}

section { position: relative !important; display: flex !important; height: 200vh !important; width: 100vw !important; }

  1. home {
   background: white !important;
   height: 100vh !important;

}

  1. home #iiserk {
   height: 6vw !important;
   width: 6vw !important;    
   display: flex !important;
   align-items: center !important;  
   position: absolute !important;
   top: 1vw !important;
   left: 1vw !important;
   z-index: 5 !important;
   cursor: pointer !important;

}

  1. iiserk:hover {

}

  1. iiserk a img {
   height: 6vw !important;
   width: auto !important;

}

  1. home #pagedown {
   top: 90vh !important;
   left: 47vw !important;
   height: 3vw !important;
   margin-left: 6vw !important;
   margin-top: 7vh !important;
   width: 6vw !important;
   cursor: pointer !important;
   display: flex !important;
   align-items: center !important;
   justify-content: center !important;
   background-color: gray !important;
   border: solid black 0.1vw !important;

}

/*aboutUs page*/

  1. aboutUs {

background-color: D8D9E5 !important; }


/*events page*/

  1. events {
   background-color: B4BAC2 !important;

}

  1. gallery {
   background-color: D8D9E5 !important;

}

  1. ourTeam {
   background-color: B4BAC2 !important;

}

  1. sponsors {
   background-color: D8D9E5 !important;

}

  1. reachUs {
   background-color: B4BAC2 !important;
   height: 100vh !important;

}