ÿØÿÛC  ÿØÿÛC  /*=============================== 26.CASE DETAILS css ================================*/ .case-details-area{ .case-details-thumb{ position: relative; & img{ width: 100%; } & .case-live{ box-shadow: 0px 8px 16px 0px rgba(0, 26, 55, 0.3); position: absolute; background: $white; top: 20px; right: 20px; padding: 45px 0px 45px 40px; @media #{$xs} { left: 0; top: 0px; position: inherit; } @media #{$sm} { left: 0; top: 0px; position: inherit; } & .case-live-item-area{ @media #{$xs} { display: block !important; margin-top: 0; } @media #{$sm} { display: flex !important; } & .case-live-item{ padding-left: 30px; padding-right: 40px; position: relative; @media #{$xs} { padding-bottom: 20px; } @media #{$sm} { padding-bottom: 0px; } & .title{ font-size: 20px; } & span{ font-size: 14px; color: #69a1bb; } & i{ position: absolute; top: 2px; left: 0; font-size: 20px; color: $theme-color; } } } & .case-live-btn{ margin-right: 40px; margin-top: 37px; & a{ border-radius: 0; background: $theme-color; color: $white; border-color: $theme-color; } } } } & .case-details-content{ & .case-details-case{ position: relative; & img{ position: absolute; left: 0; top: 5px; @media #{$xs} { position: inherit; top: 0; left: 0; width: 100%; } } & p{ padding-left: 265px; @media #{$xs} { padding-left: 0; margin-top: 20px; } } } } & .case-content-2{ & .title{ font-size: 24px; padding-top: 13px; padding-bottom: 14px; } } & .case-video-thumb{ position: relative; & a{ height: 120px; width: 120px; border-radius: 50%; text-align: center; line-height: 120px; background: $theme-color; font-size: 24px; color: $white; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); @media #{$xs} { height: 80px; width: 80px; line-height: 80px; } } } & .case-next-prev{ position: relative; & .case-prev{ & span{ font-weight: 700; font-size: 14px; letter-spacing: 2px; color: #90b5c0; } & .title{ font-size: 28px; } } & .case-next{ & span{ font-weight: 700; font-size: 14px; letter-spacing: 2px; color: #90b5c0; } & .title{ font-size: 28px; } } & > a{ position: absolute; left: 50%; top: 50%; @include transform(translate(-50%, 0%)); @media #{$xs} { display: none; } } } & .case-details-item{ & img{ @media #{$xs} { width: 100%; } } } }