Template:IISc Bangalore sidebar/CSS

.sidebar{

   height: 100%;
   width: 0;
   position: fixed;
   z-index: 1;
   top: 20px;
   left: 0;
   background-color: hsla(345, 57%, 3%, 0.7);
   overflow-x: hidden;
   padding-top: 60px;
   transition: 0.5s;

}

.sidebar a {

 padding: 8px 8px 8px 32px;
   text-decoration: none;
   font-size: 25px;
   color:white;
   display: block;
   transition: 0.3s;

}

.sidebar a:hover, .offcanvas a:focus{

   transform: scale(1.2);
   transition: 0.5s;
   text-decoration: underline;

}

.closebtn {

   position: absolute;
   top: 0;
   right: 25px;
   font-size: 36px !important;
   margin-left: 50px;

} /* btt is back to top. NOt working.*/ /*.btt {

 color: white;
 position: absolute;
 bottom: 0;

}*/

.panel {

 position: relative;
 top: 20px;
 left: 20px;
 display: block;

}

.panel:hover, .panel:active {

 transform: translateY(10px);
 transition: .5s ;

}

.ifacebook, .itwitter {

 position: relative;
 left: 50px;
 top: 50px;
 height: 60px;
 width: 60px;
 /*display:table-column;*/

}

.ifacebook:hover, .itwitter:hover {

 transform: scale(1.5);
 transition: .5s cubic-bezier(.25,.1,.3,2.5);

}

.content {

   transition: margin-left .5s;
   padding: 20px;

}

@media screen and (max-height: 450px) {

   .sidebar {padding-top: 15px;}
   .sidebar a {font-size: 18px;}

}