Difference between revisions of "Template:TecCEM/TeamCss"

 
(30 intermediate revisions by 2 users not shown)
Line 1: Line 1:
 
<html>
 
<html>
 
     <style>
 
     <style>
 +
                @import url('https://fonts.googleapis.com/css2?family=Nunito:wght@700&family=Roboto&display=swap');
 
                 .blue_body{
 
                 .blue_body{
−
width: 100%;
+
width: 100vw;
−
                         background-color: #b1e7ef;
+
                         /*background-color: #b1e7ef;*/
 +
                        background: rgb(255,255,255);
 +
                        //background: linear-gradient(180deg, rgba(177,231,239,1) 39%, rgba(50,113,246,1) 100%);
 
}
 
}
 
.overlay_container{
 
.overlay_container{
Line 14: Line 17:
 
position: absolute;
 
position: absolute;
 
bottom: -1%;
 
bottom: -1%;
 +
left: 0%;
 +
width: 100%;
 +
}
 +
                .island{
 +
position: absolute;
 +
bottom:10%;
 
left: 0%;
 
left: 0%;
 
width: 100%;
 
width: 100%;
Line 42: Line 51:
 
.td_person_table{
 
.td_person_table{
 
position: relative;
 
position: relative;
−
border: 5px solid #CDECA9;
+
/*border: 5px solid #CDECA9;
−
border-radius: 50px;
+
border-radius: 50px;*/
 
}
 
}
 
.person_image_div img{
 
.person_image_div img{
−
border-radius: 20%;
+
border-radius: 100%;
−
width: 100%;
+
width: 100%;
 +
                        height: 100%;
 +
                        cursor: pointer;
 +
                        border: solid 5px #04ADD2;
 
}
 
}
 
.person_image_div{
 
.person_image_div{
 +
width: 200px;
 +
margin-left: 50%;
 +
margin-top: 15%;
 +
margin-bottom: 15%;
 +
transform: translate(-50%,0%);
 +
}
 +
                .person_name_tb{
 +
                        width: 100%;
 +
                        margin-top: 5%;
 +
margin-bottom: 5%;
 +
 +
                }
 +
                .advisor_image_div img{
 +
border-radius: 20%;
 +
width: 100%;
 +
                        border: solid 5px #85D6A5;
 +
}
 +
.advisor_image_div{
 +
width: 200px;
 +
margin-left: 50%;
 +
margin-top: 15%;
 +
margin-bottom: 15%;
 +
transform: translate(-50%,0%);
 +
}
 +
                .investigator_image_div img{
 +
border-radius: 20%;
 +
width: 100%;
 +
                        border: solid 5px #3A9300
 +
}
 +
.investigator_image_div{
 
width: 200px;
 
width: 200px;
 
margin-left: 50%;
 
margin-left: 50%;
Line 66: Line 108:
 
}
 
}
 
               .table_title{
 
               .table_title{
−
color: white;
+
color: #45ACFF;
 
font-size: 50px;
 
font-size: 50px;
 
font-family: sans-serif;
 
font-family: sans-serif;
Line 80: Line 122:
 
animation-name: rise_up;
 
animation-name: rise_up;
 
animation-iteration-count: infinite;
 
animation-iteration-count: infinite;
 +
}
 +
                .image_slider{
 +
                        width:100%;
 +
                }
 +
                .image_slider img{
 +
                        width:60%;
 +
                        margin-left: 50%;
 +
                        margin-top: 10%;
 +
                        margin-bottom: 10%;
 +
  transform: translate(-50%,0%);
 +
                }
 +
                .tips{
 +
display: flex;
 +
transition: transform 0.6s ease-out;
 +
flex-wrap: wrap;
 +
width: 10%;
 +
background: #FDEBC5;
 +
border-radius: 2rem;
 +
box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
 +
justify-content: center;
 +
align-content: center;
 +
align-items: center;
 +
max-height: 45rem;
 +
position: fixed;
 +
top: 15%;
 +
margin-left: 2rem;
 +
padding: 1rem;
 +
right: 26px;
 +
transform: translateX(+150%) translateY(0);
 +
 +
}
 +
.tips_hidden{
 +
transform: translateX(0%) translateY(0);
 +
/*100% - .menu_lateral.height + .menu_lateral_teccem.heigh
 +
100 - 35 + 20 = 85
 +
*/
 
}
 
}
  
−
@keyframes rise_up{
+
/*@keyframes rise_up{
 
from{
 
from{
−
top: 100%;
+
bottom: 10%;
 
}
 
}
 
to{
 
to{
−
top: 20%;
+
bottom: 80%;
 
}
 
}
−
}
+
}*/
  
 
     </style>
 
     </style>
 
</html>
 
</html>

Latest revision as of 01:33, 18 October 2021