|
|
| Line 210: |
Line 210: |
| | padding: 0; | | padding: 0; |
| | margin: 0 auto 0.5rem ; | | margin: 0 auto 0.5rem ; |
| | + | } |
| | + | .bodycontent .s2 > ul > li.full-width .full-left{ |
| | + | width:70%; |
| | + | float:left; |
| | + | } |
| | + | .bodycontent .s2 > ul > li.full-width .full-right{ |
| | + | width:calc(30% + 7.5vw); |
| | + | margin-right:-7.5vw; |
| | + | float:left; |
| | + | background:gray; |
| | } | | } |
| | .bodycontent .s2 > ul > li{ | | .bodycontent .s2 > ul > li{ |
| Line 408: |
Line 418: |
| | } | | } |
| | | | |
| − | .details_button_background{
| |
| − | box-sizing: border-box;
| |
| − | }
| |
| − | .details_button_button{
| |
| − | position:absolute;
| |
| − | z-index:99;
| |
| − | height: 4rem;
| |
| − | width: 12rem;
| |
| − | margin:0 0 0 calc(42.5vw - 6rem);
| |
| − | opacity:0;
| |
| − | cursor:pointer;
| |
| − | }
| |
| − | .details_button_button:checked ~ .li_fold{
| |
| − | height:auto !important;
| |
| − | opacity:1;
| |
| − | }
| |
| − | .details_button_button:checked ~ .li_fold >:not(.details_button_background){
| |
| − | opacity:1;
| |
| − | }
| |
| − | .details_button{
| |
| − | border:3px solid black;
| |
| − | height:3.5rem !important;
| |
| − | width:3.5rem !important;
| |
| − | border-radius: 3.5rem;
| |
| − | transition: all 0.3s ease;
| |
| − | position: relative;
| |
| − | padding:0 !important;
| |
| − | margin:0 0 0 calc(42.5vw - 6rem);
| |
| − | box-sizing: border-box;
| |
| − | }
| |
| − | .details_button_button:hover ~ .li_fold > .details_button_background > .details_button, .details_button_button:checked ~ .li_fold > .details_button_background > .details_button{
| |
| − | width:12rem !important;
| |
| − | background:black;
| |
| − | }
| |
| − | .details_button svg{
| |
| − | transform: translate(2.25px,2.25px);
| |
| − | }
| |
| − | .li_fold .details_button svg{
| |
| − | transform: translate(2.25px,2.25px) rotate(90deg);
| |
| − | }
| |
| − | .details_button .vertical_line{
| |
| − | transition: all 0.4s ease;
| |
| − | d:path('M27.5,12,27.5,27.5,27.5,43');
| |
| − |
| |
| − | }
| |
| − | .details_button_button:hover ~ .li_fold > .details_button_background > .details_button .vertical_line, .details_button_button:checked ~ .li_fold > .details_button_background > .details_button .vertical_line{
| |
| − | d:path('M27.5,12,42.94,27.5,27.5,43');
| |
| − | stroke:white;
| |
| − | }
| |
| − | .details_button h5{
| |
| − | transform: translate(-3px,-3px);
| |
| − | padding:0 !important;
| |
| − | margin:0 !important;
| |
| − | color: black;
| |
| − | line-height: 3.5rem !important;
| |
| − | position:absolute;
| |
| − | top:0;
| |
| − | left:3rem;
| |
| − | width:8.5rem !important;
| |
| − | text-align: center;
| |
| − | transition: all 0.3s ease;
| |
| − | font-size:1.1rem !important;
| |
| − | }
| |
| − | .details_button_button:hover ~ .li_fold > .details_button_background > .details_button h5 , .details_button_button:checked ~ .li_fold > .details_button_background > .details_button h5{
| |
| − |
| |
| − | color: white;
| |
| − | }
| |
| − | .details_button .horizon_line, .vertical_line {
| |
| − | fill: none;
| |
| − | stroke: #000;
| |
| − | stroke-width: 3.5px;
| |
| − | }
| |
| − | .details_button .horizon_line {
| |
| − | stroke-miterlimit: 10;
| |
| − | }
| |
| − | .details_button .vertical_line {
| |
| − | stroke-linejoin: round;
| |
| − | }
| |
| | } | | } |
| | | | |
