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

Revision as of 08:06, 10 October 2018

/*fonts*/ @font-face {

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

} @font-face {

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

} @font-face {

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

} @font-face {

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

}

/*body*/ body, html { margin: 0; padding: 0; } body { overflow-y: scroll; overflow-x: hidden; margin: auto; } body::-webkit-scrollbar-track { background-color: black; } body::-webkit-scrollbar { width: 1vw; } body::-webkit-scrollbar-thumb { background-color: #999999; } body::-webkit-scrollbar-thumb:hover {

   background-color: #777777;

}

/*navbar*/

menubar {

   width: 100vw;
   height: 3vmax;
   background-color: #222222;
   display: flex;
   align-items: center;  
   position: fixed;
   top: 18px;
   left: 0vw;
   z-index: 10;

}

menubar #logo {

   margin: 0vw 1vw 0vw 0vw;
   align-self: flex-start;
   display: flex;
   align-items: flex-start;
   justify-content: flex-end;
   width: 8vmax;
   height: 5vmax; 
   border-radius: 0% 0% 50% 0%;
   background-color: #222222;

}

logo a {

   height: 90%;
   width: 70%;

}

logo a img {

   height: 100%;
   width: auto;

}

menubar .pagelink {

   display: flex;  
   align-items: center;
   justify-content: center;   
   height: 100%;
   width: auto; 
   padding: 0vw 2vw 0vw 2vw;
   -webkit-transition: 0.2s linear;
   -moz-transition: 0.2s linear;
   -o-transition: 0.2s linear;
   transition: 0.2s linear;

} .pagelink a {

   text-decoration: none;
   font-family: prime;
   font-size: 1.5vmax; 
   color: white;  
   cursor: pointer;

} .pagelink a:hover {

   color: wheat !important;

}

/*side tabnav*/

sidenav {

   width: 15vw;
   height: 100vh;
   display: flex;
   flex-direction: column;
   align-items: center;  
   justify-content: center;
   position: fixed;
   top: 18px;
   left: 0vw;
   z-index: 5;

}

sidenav .subtab {

   display: flex;  
   align-items: center;
   justify-content: center;   
   width: 90%;
   height: 3vmax; 
   padding: 0.5vw 0vw 0.5vw 0vw;
   margin: 0.5vw 0vw 0.5vw 0vw;
   border-radius: 0vw 2vw 0vw 2vw;
   cursor: pointer;
   -webkit-transition: 0.2s linear;
   -moz-transition: 0.2s linear;
   -o-transition: 0.2s linear;
   transition: 0.2s linear;

} .subtab#problemTab,.subtab#assemblyTab,.subtab#resultsTab,.subtab#fieSurTab,.subtab#studentsTab {

   background-color: black;

} .subtab#problemTab p,.subtab#assemblyTab p,.subtab#resultsTab p,.subtab#fieSurTab p,.subtab#studentsTab p {

   color: white;

} .subtab p {

   text-decoration: none;
   font-family: rodina !important;
   font-size: 1.8vmax !important; 
   color: black;

} .subtab:hover {

   background-color: rgba(0,0,0,0.3) !important;
   border-radius: 0vw 2vw 0vw 2vw !important;

} .subtab:hover > p {

   color: white !important;

}

/*page layouts*/ .subcontainer {

   position: relative;
   top: 3vmax;
   width: 85vw;
   left: 15vw;
   height: auto;
   display: flex;
   flex-direction: column;
   background-color: #eeeeee;

} section.subpage {

   padding: 2.5vw 7.5vw 2.5vw 7.5vw;
   position: relative;
   display: flex;
   flex-direction: column;
   align-items: center;
   min-height: 100vh;
   width: 70vw;

} .subpage h1.subheading {

   width: auto !important;
   font-family: rodina !important;
   font-size: 3vmax !important;
   margin: 2.5vw 0vw 2.5vw 0vw !important;

} .subpage h3.subsubheading {

   width: auto !important;
   align-self: flex-start !important;
   font-family: prime !important;
   font-size: 1.8vmax !important;
   margin: 2vw 0vw 1.5vw 0vw !important;

} .subpage p,.subpage ul,.subpage ol {

   width: 70vw;
   font-family: blogger !important;
   font-size: 1.5vmax !important;
   text-align: justify !important;
   margin: 0.8vw 0vw 1.2vw 0vw !important;

} .subpage li {

   margin: 0.7vw 0vw 0.7vw 0vw !important;

} table.tabular {

   font-size: 1.5vmax !important; 
   font-family: blogger !important;
   border-collapse: collapse !important;
   caption-side: bottom !important;
   margin: 2vw !important;

} .tabular caption {

   margin: 0.5vw !important;
   font-size: 1.3vmax !important;

} .tabular td {

   min-width: 5vw !important;
   padding: 1vw !important;
   background-color: #eeeeee !important;
   text-align: center !important;
   border: 0.1vw solid black !important; 
   margin: 0vw !important;

} .tabular th {

   min-width: 5vw !important;
   padding: 1vw !important;
   background-color: #dddddd !important;
   border: 0.1vw solid black !important; 
   margin: 0vw !important;

}