|
|
Line 248: |
Line 248: |
| | | |
| | | |
− | /*hp tab start*/
| |
− | @import "compass/css3";
| |
− |
| |
− | @import url(https://fonts.googleapis.com/css?family=Rajdhani:300);
| |
− |
| |
− | $colorWhite: rgba(255,255,255,1);
| |
− | $colorDamnLight: rgba(0,220,220,1);
| |
− | $colorLight: rgba(0,190,190,1);
| |
− | $colorDark: rgba(60,60,60,1);
| |
− | $colorBlack: rgba(33,33,33,1);
| |
− | $fontSize: 18px;
| |
− |
| |
− |
| |
− |
| |
− | .scifiUI {
| |
− | list-style: none;
| |
− | position: relative;
| |
− | width: 600px;
| |
− | margin: 50px auto;
| |
− | padding: 0;
| |
− | font-size: 1em;
| |
− | color: $colorLight;
| |
− | }
| |
− |
| |
− | li {
| |
− | display: inline-block;
| |
− |
| |
− | input[type="radio"] {
| |
− | @include opacity(0);
| |
− | position: absolute;
| |
− | outline: none;
| |
− |
| |
− | &:checked {
| |
− |
| |
− | ~ label {
| |
− | background: $colorLight;
| |
− | color: $colorBlack;
| |
− | height: 50px;
| |
− | font-size: 1.2em;
| |
− | cursor: default;
| |
− | @include box-shadow(0 0 10px $colorDamnLight);
| |
− | }
| |
− |
| |
− | ~ .section {
| |
− | @include opacity(1);
| |
− | width: 500px;
| |
− | padding: 50px;
| |
− | border: 1px solid $colorLight;
| |
− | color: $colorDamnLight;
| |
− | letter-spacing: .1em;
| |
− | text-indent: 1em;
| |
− | z-index: 1;
| |
− | }
| |
− | }
| |
− | }
| |
− |
| |
− | label {
| |
− | display: block;
| |
− | width: 120px;
| |
− | height: 40px;
| |
− | border: 1px solid rgba($colorLight, .7);
| |
− | border-bottom: 0;
| |
− | @include border-radius(5px 5px 0 0);
| |
− | color: rgba($colorLight, .7);
| |
− | line-height: 50px;
| |
− | text-align: center;
| |
− | cursor: pointer;
| |
− | @include transition(all 200ms ease-in-out);
| |
− |
| |
− | &:hover {
| |
− | height: 50px;
| |
− | border-color: $colorLight;
| |
− | color: $colorLight;
| |
− | }
| |
− | }
| |
− |
| |
− | .section {
| |
− | @include opacity(0);
| |
− | position: absolute;
| |
− | top: 51px;
| |
− | left: 0;
| |
− | width: 1000px;
| |
− | padding: 50px;
| |
− | border: 1px solid $colorLight;
| |
− | background: rgba($colorLight, .1);
| |
− | color: $colorWhite;
| |
− | letter-spacing: -1em;
| |
− | text-indent: 1em;
| |
− |
| |
− | @include transition(all 200ms ease-in-out);
| |
− | }
| |
− | }
| |
− | /*hp tab end*/
| |
| | | |
| | | |