@import url("http://fonts.googleapis.com/css?family=Droid+Sans:400,700"); // Base @import "base/orbitbar-override"; @import "base/sitemap-override"; @import "base/global"; @import "base/unity"; @import "base/utilities"; @import "base/pagination"; @import "base/accesskey"; @import "base/go_back_top"; @import "base/ckeditor-reset"; // Layout @import "layout/*"; // Modules @import "modules/*"; // Widget @import "widget/*"; //RWD @import "RWD"; span.i-member-title:after { content: ":"; } span.i-member-title { font-weight: bold; } .dropdown-toggle:focus { // outline: 2px solid #43B5FC; outline: transparent; } // container setting .response-container { position: relative; @media (min-width: $screen-xs) { width: 100%; } @media (min-width: $screen-sm) { width: 100%; } @media (min-width: $screen-md) { width: 90%; } @media (min-width: $screen-lg) { width: 90%; } } body { color: #fff; background: #000 url(/assets/body.png) center bottom no-repeat; background-size:contain; background-attachment: fixed; margin-top: 0!important; min-height: 22rem; letter-spacing: 2px; @media(max-width: 768px){ background-size: 200%; } } .background { width: 100%; position: fixed !important; left: 0; top: 0; z-index: -1; } .jarallax-video-audio { display: none; } .jp-video { border: 0!important; } .extra { clear: both; } .navbar.layout-header .container { fontn-family: "微軟正黑體", "黑體"; @media(min-width: 769px){ display: flex; align-items: center; justify-content: space-between; backdrop-filter: blur(10px); position: fixed; padding-top: 15px; padding-bottom: 5px; top: 2rem; width: 100%; z-index: 10; } @media(max-width: 768px){ top: 4rem; } } .navbar.layout-header .container a, .navbar.layout-header .container a:visited { color: #fff; } .modules-menu .modules-menu-level-0 > li:hover, .modules-menu .modules-menu-level-0 > li:focus-within, .modules-menu .modules-menu-level-0 > li.hover-class, .navbar.layout-header .container a:hover, .navbar.layout-header .container a:active, .navbar.layout-header .container a:focus { background-color: transparent!important; } .layout-header .navbar-header .navbar-brand .site-logo { width: 130px; height: auto; @media(max-width: 768px){ width: 200px; } } #main-nav { width: 100%; } .header-banner-home { height: 41rem; overflow: visible!important; width: 100%; top: -40px; } @media (min-width: 1441px) { .header-banner { height: 100vh; overflow: visible!important; } } .header-marquee { align-items: flex-start; background-color: #000; clear: both; color: #fff; display: flex; justify-content: space-between; position: absolute; top:calc( 100vh - 2.5em); padding: 10px 0; overflow: hidden; width: 100%; font-size: 1.2em; } .flexMarquee div { display: inline-block; width: 100%; } .internal-page{ .layout-content { margin-top:3em; @media(min-width: 769px){ margin-top:calc( 12vh ); } } .header-banner-home{ height: auto; } .header-marquee{ display: none; } } .layout-content { // background: url(/assets/gridBG.png) center center no-repeat; // background-size: contain; margin-top: calc( 100vh + 50px ); } .bg{ background: url(/assets/gridBG.png) center center no-repeat; background-size: cover; position: fixed; width: 90%; height: 95%; top: 50%; left: 50%; -webkit-transform: translateX(-50%) translateY(-50%); -moz-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); pointer-events: none; opacity: .4; } .layout-footer { background-color: transparent; } //公告頁籤 ul.tab_nav { list-style-type: none; padding: 0; display: flex; flex-wrap: wrap; font-family: $main-font; li { padding: 0.5em 1em; background: $theme-color-green; margin: 0.2em; cursor: pointer; transition: all 0.5s; -moz-transition: all 0.5s; -webkit-transition: all 0.5s; -o-transition: all 0.5s; &.active { background: #19524b; color: #fff; } } } .noscroll { overflow: hidden; position: fixed; } //覆蓋bootstrap 設定 .row { margin: 0; } .container>.navbar-collapse { @media (max-width: 767px) { margin-left: 0; margin-right: 0; } } //共用樣式 .title { @extend .unity-title; } .superBtn { a.btn-primary { color: $theme-white; border-color: #990000; background-color: #990000; font-size: 0.8125rem; padding: 0.3em 0.5em; &:hover { background-color: darken(#990000, 10%); border-color: darken(#990000, 10%); } } } .theBall { position: absolute; top: -190px; right: 2%; width: 170px; animation: ballRolling 175s ease-in-out infinite; } @keyframes ballRolling {0%{right:2%;top:-190px;-webkit-filter:drop-shadow(0 0 0 #ffe26f);filter:drop-shadow(0 0 0 #ffe26f);-webkit-transform:rotate(0deg);transform:rotate(0deg)}25%{top:-170px;-webkit-filter:drop-shadow(0 0 25px #ffe26f);filter:drop-shadow(0 0 25px #ffe26f);-webkit-transform:rotate(180deg);transform:rotate(180deg)}50%{right:85%;top:-220px;-webkit-filter:drop-shadow(0 0 0 #ffe26f);filter:drop-shadow(0 0 0 #ffe26f);-webkit-transform:rotate(-180deg);transform:rotate(-180deg)}75%{top:-200px;-webkit-filter:drop-shadow(0 0 25px #ffe26f);filter:drop-shadow(0 0 25px #ffe26f);-webkit-transform:rotate(180deg);transform:rotate(180deg)}to{right:2%;top:-190px;-webkit-filter:drop-shadow(0 0 0 #ffe26f);filter:drop-shadow(0 0 0 #ffe26f);-webkit-transform:rotate(0deg);transform:rotate(0deg)}}