Team:Central Calgary/teampage.css

.rad, .line {

  -webkit-transition: all 0.25s ease-in-out;
 -moz-transition: all 0.25s ease-in-out;
 transition: all 0.25s ease-in-out;

}

.box {

 -webkit-transition:height 0.5s cubic-bezier(1,0,.47,.03);
 -moz-transition: height 0.5s cubic-bezier(1,0,.47,.03);
 transition: height 0.5s cubic-bezier(1,0,.47,.03);

}

.rad {

 margin: 0 auto;
 display: inline-block;
 position: absolute;
 width: 100px;
 height: 100px;
 top: 0px;
 left:0px;
 background-color: rgba(250, 250, 250, 0.1);
 border: 3px solid rgba(100, 200, 250, 0.5);
 border-radius: 100%;
 cursor: pointer;

} .rad:hover {

 top: 1px;
 border: 4px solid #fafafa;

} .line {

 margin: 0 auto;
 display: inline-block;
 position: absolute;
 width: 0px;
 height: 2px;
 top:50px;
 left:105px;
 opacity: 0.2;
 background-color: rgba(0,0,0,0.85);
 z-index:1;

}

.line.open {

 width: 401px;
 opacity: 1;

}

.box {

 margin: 0 auto;
 display: inline-block;
 position: absolute;
 width: 0px;
 height: 0px;
 top:50px;
 left:105px;
 opacity: 0.2;
 background-color: rgba(0,0,0,0.76);
 text-align: center;
 line-height: 30px;
 color: rgba(255,255,255,1.00);
 overflow: hidden;
 z-index:1;

}

.box.open {

 height: 500px;
 width:401px;
 opacity: 1;

}

.portrait { float:left;

}