.Experiments {
padding-top: 5rem; margin-top: 3vw;
} table {
margin-left: 40px; border-collapse: collapse;
}
- accordion .panel {
border: none; box-shadow: none; border-radius: 0; margin: 0 0 15px 10px;
}
- accordion .panel-heading {
padding: 0; border-radius: 30px;
}
- accordion .panel-title a {
display: block; padding: 12px 20px 12px 50px; background: #1d2087; font-size: 18px; font-weight: 600; color: #fff; border: 1px solid transparent; border-radius: 30px; position: relative; transition: all 0.3s ease 0s;
}
- accordion .panel-title a.collapsed {
background: #fff; color: #1d2087; border: 1px solid #ddd;
}
- accordion .panel-title a:after,
- accordion .panel-title a.collapsed:after {
content: "\f107"; font-family: fontawesome; width: 55px; height: 55px; line-height: 55px; border-radius: 50%; background: #1d2087; font-size: 25px; color: #fff; text-align: center; border: 1px solid transparent; box-shadow: 0 3px 10px rgba(0, 0, 0, 0.58); position: absolute; top: -5px; left: -20px; transition: all 0.3s ease 0s;
}
- accordion .panel-title a.collapsed:after {
content: "\f105"; background: #fff; color: #1d2087; border: 1px solid #ddd; box-shadow: none;
}
- accordion .panel-body {
padding: 20px 25px 10px 9px; background: transparent; font-size: 14px; color: #8c8c8c; line-height: 25px; border-top: none; position: relative;
}
- accordion .panel-body p {
padding-left: 25px; border-left: 1px dashed #8c8c8c;
} @media (min-width: 768px) {
.col-md-offset-3 { margin-left: 5% !important; } .col-md-6 { width: 90% !important; }
} .container {
margin-right: auto; margin-left: auto
} @media screen and (max-width: 45rem) {
.container { width: 90vw; } #accordion .panel-title a { padding: 8px 20px 8px 50px; font-size: 14px; } #accordion .panel-title a:after, #accordion .panel-title a.collapsed:after { width: 45px; height: 45px; line-height: 45px; } #accordion .panel-body { padding: 5px 0px 5px 9px; } #accordion .panel-body p { font-size: 12px; line-height: 16px; } table { margin: 8px 0; }
} @media screen and (min-width: 45.0625rem) and (max-width: 769px) {
.container { width: 85vw; }
} @media screen and (min-width: 769px) {
.container { width: 60vw; }
} .collapse {
display: none
} .collapse.in {
display: block
} .collapsing {
position: relative; height: 0; overflow: hidden; -webkit-transition-timing-function: ease; -o-transition-timing-function: ease; transition-timing-function: ease; -webkit-transition-duration: .35s; -o-transition-duration: .35s; transition-duration: .35s; -webkit-transition-property: height, visibility; -o-transition-property: height, visibility; transition-property: height, visibility
} .exp_name {
font-size: 2rem; color: #1d2087; line-height: 3rem; text-align: center; margin-bottom: 10px;
} .row {
margin-bottom: 5vw;
} .expstep_name {
font-size: 1.5rem; color: #1d2087; line-height: 3rem; text-align: left; margin: 25px 0 5px;
} @media screen and (max-width: 45rem) {
.exp_name { font-size: 1.5rem; line-height: 2rem; margin-bottom: 5px; } .expstep_name { font-size: 1.1rem; line-height: 1.5rem; margin: 35px 0 5px; } .row { margin-bottom: 15vw; }
} @media screen and (min-width: 45.0625rem) and (max-width: 769px) {} @media screen and (min-width: 769px) {}