@charset "utf-8";
/*
1280 平板 640 手機
一律 一個
@media screen and (min-width: 1px) and (max-width: 1279px) {
}
@media screen and (min-width: 1px) and (max-width: 1023px) {
}
z-index chrome 最高 2147483647 最大的質數 2的31次方 - 1 這個數表示為二進位為1111111111111111111111111111111(即31個1)，是32位元作業系統中最大的符號型整型常數 十個
z-index
overlay 99
ul.xxx li.xxx { display: flex; /*flex-direction: column; 分段 justify-content: space-between; || justify-content: space-around; align-content: center; }
display: flex; justify-content: center; align-items: center; flex-direction: column; position: fixed; width: 100vw; height: 100vh; transform: translate(0, 0); 完全置中
*/
/*----------------------------------------------------------------------------*/
/*============================================================================*/
/*
-webkit-animation: flash 500ms;
-moz-animation: flash 500ms;
-ms-animation: flash 500ms;
-o-animation: flash 500ms;
animation: flash 500ms;
-webkit-animation: flipInX 2000ms; animation: flipInX 2000ms;
bounce
flash
pulse
rubberBand
shake
headShake
swing
tada
wobble
jello
bounceIn
bounceInDown
bounceInLeft
bounceInRight
bounceInUp
bounceOut
bounceOutDown
bounceOutLeft
bounceOutRight
bounceOutUp
fadeIn
fadeInDown
fadeInDownBig
fadeInLeft
fadeInLeftBig
fadeInRight
fadeInRightBig
fadeInUp
fadeInUpBig
fadeOut
fadeOutDown
fadeOutDownBig
fadeOutLeft
fadeOutLeftBig
fadeOutRight
fadeOutRightBig
fadeOutUp
fadeOutUpBig
flipInX
flipInY
flipOutX
flipOutY
lightSpeedIn
lightSpeedOut
rotateIn
rotateInDownLeft
rotateInDownRight
rotateInUpLeft
rotateInUpRight
rotateOut
rotateOutDownLeft
rotateOutDownRight
rotateOutUpLeft
rotateOutUpRight
hinge
jackInTheBox
rollIn
rollOut
zoomIn
zoomInDown
zoomInLeft
zoomInRight
zoomInUp
zoomOut
zoomOutDown
zoomOutLeft
zoomOutRight
zoomOutUp
slideInDown
slideInLeft
slideInRight
slideInUp
slideOutDown
slideOutLeft
slideOutRight
slideOutUp
heartBeat
Example
Class Name Delay Time
delay-2s 2s
delay-3s 3s
delay-4s 4s
delay-5s 5s
Example
Class Name Speed Time
slow 2s
slower 3s
fast 800ms
faster 500ms
-webkit-transition: .5s ease-in-out; transition: .5s ease-in-out;
-webkit-animation: bounce 500ms; animation: bounce 500ms;
-webkit-animation: 1s .1s normal ease infinite heartBeat; animation: 1s .1s normal ease infinite heartBeat;
forwards 1次
-webkit-animation: 1s .5s normal ease forwards bounceInUp; animation: 1s .5s normal ease forwards bounceInUp;
content: "\f017"; padding: 0 10px 0 0; font-family: 'Font Awesome 5 Pro'; font-style: normal; font-size: 18px;
background: url(background-photo.jpg) center center cover no-repeat fixed;
transform: translateX(6px); transform: translateY(6px); transform: translate(10px, -180px);
transform: rotateZ(0deg);
-webkit-transition: left .3s ease, width .3s ease; transition: left .3s ease, width .3s ease; linear ease-in-out ease-out ease-in
...
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
border-style: solid;
border-width: 6px 12px 0 12px;
border-left-color: ; border-top-color: ; border-right-color: ; border-bottom-color: ;
border-color: rgba(255, 193, 7, .85) transparent transparent transparent;
border-style: solid;
border-top-width: px ; border-bottom-width: px ;
border-left-width: px ; border-right-width: px ;
border-top-color: ; border-bottom-color: ;
border-left-color: ; border-right-color: ;
*/
/* text-shadow: -1px -1px rgba(120, 200, 35, .65), -1px 1px rgba(120, 200, 35, .65), 1px -1px rgba(120, 200, 35, .65), 1px 1px rgba(120, 200, 35, .65), 1px 1px rgba(120, 200, 35, .65); /*綠*/
/* text-shadow: -1px -1px rgba(51, 105, 30, .65), -1px 1px rgba(51, 105, 30, .65), 1px -1px rgba(151, 105, 30, .65), 1px 1px rgba(51, 105, 30, .65), 1px 1px rgba(51, 105, 30, .65); /*深綠*/
/* text-shadow: -1px -1px rgba(255, 235, 59, .35), -1px 1px rgba(255, 235, 59, .35), 1px -1px rgba(255, 235, 59, .35), 1px 1px rgba(255, 235, 59, .35), 1px 1px rgba(255, 235, 59, .35); /*金*/
/* text-shadow: -1px -1px rgba(255, 87, 34, .65), -1px 1px rgba(255, 87, 34, .65), 1px -1px rgba(255, 87, 34, .65), 1px 1px rgba(255, 87, 34, .65), 1px 1px rgba(255, 87, 34, .65); /*橘*/
/* text-shadow: -1px -1px rgba(150, 140, 80, .65), -1px 1px rgba(150, 140, 80, .65), 1px -1px rgba(150, 140, 80, .65), 1px 1px rgba(150, 140, 80, .65), 1px 1px rgba(150, 140, 80, .65); /*土黃*/
/* text-shadow: -1px -1px rgba(50, 75, 240, .65), -1px 1px rgba(50, 75, 240, .65), 1px -1px rgba(50, 75, 240, .65), 1px 1px rgba(50, 75, 240, .65), 1px 1px rgba(50, 75, 240, .65); /*大藍*/
/* text-shadow: -1px -1px rgba(1, 140, 190, .65), -1px 1px rgba(1, 140, 190, .65), 1px -1px rgba(1, 140, 190, .65), 1px 1px rgba(1, 140, 190, .65), 1px 1px rgba(1, 140, 190, .65); /*藍*/
/* text-shadow: -1px -1px rgba(171, 71, 188, .35), -1px 1px rgba(171, 71, 188, .35), 1px -1px rgba(171, 71, 188, .35), 1px 1px rgba(171, 71, 188, .35), 1px 1px rgba(171, 71, 188, .35); /*紫*/
/* text-shadow: -1px -1px rgba(81, 45, 168, .35), -1px 1px rgba(81, 45, 168, .35), 1px -1px rgba(81, 45, 168, .35), 1px 1px rgba(81, 45, 168, .35), 1px 1px rgba(81, 45, 168, .35); /*大紫*/
/* text-shadow: -1px -1px rgba(250, 125, 150, .35), -1px 1px rgba(250, 125, 150, .35), 1px -1px rgba(250, 125, 150, .35), 1px 1px rgba(250, 125, 150, .35), 1px 1px rgba(250, 125, 150, .35); /*粉*/
/*============================================================================*/
/* RESET */
html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,figure, figcaption, footer, header, hgroup,menu, nav, output, ruby, section, summary,time, mark, audio, video {
margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline;
}
/*============================================================================*/
/* HTML5 display-role reset for older browsers */
* { margin: 0; padding: 0; outline: none; text-decoration: none; -webkit-font-smoothing: antialiased; box-sizing: border-box; }
/*----------------------------------------------------------------------------*/
article, aside, details, figcaption, figure,footer, header, hgroup, menu, nav, section { display: block; }
ol, ul { list-style: none; margin: 0; padding: 0; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after,q:before, q:after { content: ''; content: none; }
table { border-collapse: collapse; border-spacing: 0; }
body > div > a { transition: all 0.3s ease; }
:hover { }
form ,fieldset { margin: 0; max-width: 100%; border: 0; }
img { border: 0px; outline: none; }
section, label { position: relative; padding: 0; }
section > label { position: relative; }
ol,ul { list-style-type: none; list-style-image: none; list-style-position: outside; }
h1,h2,h3,h4,h5,h6,strong,b,u,big,small,em { font-size: 12px; font-weight: normal; font-style: normal; text-decoration: none; }
button { outline: none; border: none; }
object, embed, video { max-width: 100%; border: 0 none; }
li { list-style-type: none; list-style: none; }
mark { background: transparent; background-color: transparent; }
/*----------------------------------------------------------------------------*/
a, a:visited, a:hover, a:focus { outline: none; border: none; text-decoration: none; }
a { color: #454545; color: rgba(69, 69, 69, .8); } a:link { color: #454545; color: rgba(69, 69, 69, .8); } a:visited { color: #454545; color: rgba(69, 69, 69, .75); } a:hover { color: #454545; color: rgba(69, 69, 69, .85); } a:active { color: #454545; color: rgba(69, 69, 69, 1); }
/*----------------------------------------------------------------------------*/
.clears { clear: both; }
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }
/*----------------------------------------------------------------------------*/
.cur-pointer { cursor: pointer; } .cur-move { cursor: move; } .cur-moven { cursor: n-resize; } .cur-bad { cursor: not-allowed; } .cur-auto { cursor: auto; } .cur-help { cursor: help; }
.cur-grab { cursor: grab; } .cur-def { cursor: default; }
/*============================================================================*/
/*Scrollbar*/
::-webkit-scrollbar { background-color: transparent; width: 0px; height: 0px; }
::-webkit-scrollbar-button:start:decrement,::-webkit-scrollbar-button:end:increment { display: none; }
::-webkit-scrollbar-track-piece { background-color: transparent; -webkit-border-radius: 50%; }
::-webkit-scrollbar-thumb {
-webkit-border-radius: 6px;
background: #A0E6FA;background: -moz-linear-gradient(left, #A0E6FA 0%, #0AAADC 100%);background: -webkit-linear-gradient(left, #A0E6FA 0%,#0AAADC 100%);background: linear-gradient(to right, #A0E6FA 0%,#0AAADC 100%);filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#A0E6FA', endColorstr='#0AAADC',GradientType=1 );
}
@media (max-width: 640px) {
::-webkit-scrollbar { background-color: transparent; width: 0px; height: 0px; }
::-webkit-scrollbar-button:start:decrement,::-webkit-scrollbar-button:end:increment { display: none; }
::-webkit-scrollbar-track-piece { background-color: transparent; -webkit-border-radius: 50%; }
::-webkit-scrollbar-thumb {
-webkit-border-radius: 6px;
background: #A0E6FA;background: -moz-linear-gradient(left, #A0E6FA 0%, #0AAADC 100%);background: -webkit-linear-gradient(left, #A0E6FA 0%,#0AAADC 100%);background: linear-gradient(to right, #A0E6FA 0%,#0AAADC 100%);filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#A0E6FA', endColorstr='#0AAADC',GradientType=1 );
}
}
/*============================================================================*/
::-webkit-input-placeholder, ::-moz-placeholder, :-ms-input-placeholder, :-moz-placeholder { font-family: 'cwTeXHei', sans-serif; color: #81d4fa; }
::-webkit-input-placeholder { font-family: 'cwTeXHei', sans-serif; color: #81d4fa; transition: opacity 250ms ease-in-out; }
:focus::-webkit-input-placeholder { opacity: 0.5; }
:-ms-input-placeholder { font-family: 'cwTeXHei', sans-serif; color: #81d4fa; transition: opacity 250ms ease-in-out; }
:focus:-ms-input-placeholder { opacity: 0.5; }
::-moz-placeholder { font-family: 'cwTeXHei', sans-serif; color: #81d4fa; opacity: 1; transition: opacity 250ms ease-in-out; }
:focus::-moz-placeholder { opacity: 0.5; }
:-moz-placeholder { font-family: 'cwTeXHei', sans-serif; color: #81d4fa; opacity: 1; transition: opacity 250ms ease-in-out; }
:focus:-moz-placeholder { opacity: 0.5; }
input::placeholder { font-family: 'cwTeXHei', sans-serif; color: #81d4fa; }
/*============================================================================*/
/*common*/
html { position: relative; margin: 0px; border: 0px; /*overflow-x: hidden; overflow-y: auto /*!important*;*/ background: transparent; background-color: transparent; }
body {
/*禁止全選*
-webkit-user-select: none;
-moz-user-select: none;
-o-user-select: none;
user-select: none;
/*進指點選*
pointer-events: none;
/*禁止右鍵*
star:expression(document.body.onselectstart = document.body.oncontextmenu = function(){return false;});
*/
margin: 0 auto; padding: 0; width: 100%; min-width: 320px; max-width: 1920px; line-height: 1;
font-size: 12px;
background: transparent; background-color: transparent;
overflow-x: hidden; overflow-y: auto;
}
/*----------------------------------------------------------------------------*/
.page-container, section { -webkit-animation: fadeIn 3000ms; animation: fadeIn 3000ms; }
/*============================================================================*/
/*緩衝*/
/*============================================================================*/
.has-fade { -webkit-animation: fadeIn 2500ms; animation: fadeIn 2500ms; }
@keyframes fadeOut {
0% { opacity: 1; }
100% { opacity: 0; }
}
@keyframes fadeIn {
0% { opacity: 0; }
100% { opacity: 1; }
}
/*============================================================================*/
/*page loader*/
/*============================================================================*/
.page-preloader-start { margin: 0 auto; padding: 0; width: 100%; min-width: 320px; max-width: 1920px; height: 100vh; }
.page-preloader { z-index: 2147483647; position: fixed; width: 100vw; height: 100vh; }
/*============================================================================*/
/*overlay*/
/*============================================================================*/
.page-overlay-mask { z-index: 99; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: transparent; background-color: transparent;
-webkit-transition: background .5s ease-in-out, background-color .5s ease-in-out;
transition: background .5s ease-in-out, background-color .5s ease-in-out;
}
.page-overlay-mask.opened { display: block !important; }
.page-overlay-mask.closed { display: none; }
/*============================================================================*/
/*common*/
/*============================================================================*/
.bgcover {
-webkit-background-size: cover !important;
-moz-background-size: cover !important;
-o-background-size: cover !important;
background-size: cover !important;
}
/*----------------------------------------------------------------------------*/
.dnone { display: none; } .dblock { display: block; } .dinblock { display: inline-block; }
.dnoneimp { display: none !important; } .dblockimp { display: block !important; } .dinblockimp { display: inline-block !important; }
.dinfleximp { display: inline-block !important; }
/*----------------------------------------------------------------------------*/
.vhid { visibility: hidden; } .vvis { visibility: visible; }
/*----------------------------------------------------------------------------*/
.nowrap { white-space: nowrap; } .nowrapimp { white-space: nowrap !important; }
/*----------------------------------------------------------------------------*/
/* col */
.w09 { width: 9%; }
.w10 { width: 10%; }
.w14 { width: 14.285714%; }
.w15 { width: 15%; }
.w16 { width: 16.666666%; }
.w15 { width: 15%; }
.w19 { width: 19%; }
.w20 { width: 20%; }
.w24 { width: 24%; }
.w25 { width: 25%; }
.w30 { width: 30%; }
.w32 { width: 32%; }
.w329 { width: 32.9%; }
.w33 { width: 33.333333%; }
.w50 { width: 50%; }
.w45 { width: 45%; }
.w49 { width: 49%; }
.w4949 { width: 49.49%; }
.w100 { width: 100%; }
/*----------------------------------------------------------------------------*/
.w99 { width: 99%; }
.w98 { width: 98%; }
.w96 { width: 96%; }
.w94 { width: 94%; }
.w92 { width: 92%; }
.w90 { width: 90%; }
/*----------------------------------------------------------------------------*/
.opa01 { opacity: .1; filter: alpha(opacity=10); } .opa02 { opacity: .2; filter: alpha(opacity=20); } .opa03 { opacity: .3; filter: alpha(opacity=30); } .opa04 { opacity: .4; filter: alpha(opacity=40); }
.opa05 { opacity: .5; filter: alpha(opacity=50); } .opa06 { opacity: .6; filter: alpha(opacity=60); } .opa07 { opacity: .7; filter: alpha(opacity=70); } .opa08 { opacity: .8; filter: alpha(opacity=80); }
.opa09 { opacity: .9; filter: alpha(opacity=90); } .opa00 { opacity: 0; filter: alpha(opacity=0); }
/*----------------------------------------------------------------------------*/
.zoom100 { zoom: 1; } .zoom90 { zoom: 0.9; } .zoom80 { zoom: 0.8; } .zoom70 { zoom: 0.7; } .zoom60 { zoom: 0.6; } .zoom50 { zoom: 0.5; } .zoom40 { zoom: 0.4; } .zoom30 { zoom: 0.3; } .zoom20 { zoom: 0.2; } .zoom10 { zoom: 0.1; }
.zoom110 { zoom: 1.1; } .zoom120 { zoom: 1.2; } .zoom130 { zoom: 1.3; } .zoom140 { zoom: 1.4; } .zoom150 { zoom: 1.5; } .zoom160 { zoom: 1.6; } .zoom170 { zoom: 1.7; }.zoom180 { zoom: 1.8; } .zoom190 { zoom: 1.9; }
.zoom200 { zoom: 2; }
/*----------------------------------------------------------------------------*/
.flonone { float: none !important; } .floleft { float: left !important; } .floright { float: right !important; }
/*----------------------------------------------------------------------------*/
.pd5 { padding: 5px; } .pd8 { padding: 8px; } .pd10 { padding: 10px; } .pd12 { padding: 12px; } .pd15 { padding: 15px; } .pd20 { padding: 20px; }
.pd25 { padding: 25px; }.pd30 { padding: 30px; } .pd35 { padding: 35px; } .pd40 { padding: 40px; } .pd45 { padding: 45px; } .pd50 { padding: 50px; }
.pdlt5 { padding-left: 5px; } .pdlt10 { padding-left: 10px; } .pdlt15 { padding-left: 15px; }
.pdlt20 { padding-left: 20px; } .pdlt25 { padding-left: 25px; }
.pdlt30 { padding-left: 30px; } .pdlt35 { padding-left: 35px; } .pdlt40 { padding-left: 40px; }
.pdrt5 { padding-right: 5px; } .pdrt10 { padding-right: 10px; } .pdrt15 { padding-right: 15px; }
.pdrt20 { padding-right: 20px; } .pdrt25 { padding-right: 25px; }
.pdrt30 { padding-right: 30px; } .pdrt35 { padding-right: 35px; } .pdrt40 { padding-right: 40px; }
.pdtp5 { padding-top: 5px; } .pdtp10 { padding-top: 10px; } .pdtp15 { padding-top: 15px; }
.pdtp20 { padding-top: 20px; } .pdtp25 { padding-top: 25px; }
.pdtp30 { padding-top: 30px; } .pdtp35 { padding-top: 35px; } .pdtp40 { padding-top: 40px; }
.pdbm5 { padding-bottom: 5px; } .pdbm10 { padding-bottom: 10px; } .pdbm15 { padding-bottom: 15px; }
.pdbm20 { padding-bottom: 20px; } .pdbm25 { padding-bottom: 25px; }
.pdbm30 { padding-bottom: 30px; } .pdbm35 { padding-bottom: 35px; } .pdbm40 { padding-bottom: 40px; }
/*----------------------------------------------------------------------------*/
.mr5 { margin: 5px; } .mr8 { margin: 8px; } .mr10 { margin: 10px; } .mr15 { margin: 15px; } .mr20 { margin: 20px; } .mr25 { margin: 25px; } .mr30 { margin: 30px; } .mr35 { margin: 35px; } .mr40 { margin: 40px; } .mr45 { margin: 45px; } .mr50 { margin: 50px; }
.mrlt5 { margin-left: 5px; } .mrlt10 { margin-left: 10px; } .mrlt15 { margin-left: 15px; }
.mrlt20 { margin-left: 20px; } .mrlt25 { margin-left: 25px; }
.mrlt30 { margin-left: 30px; } .mrlt35 { margin-left: 35px; } .mrlt40 { margin-left: 40px; }
.mrrt5 { margin-right: 5px; } .mrrt10 { margin-right: 10px; } .mrrt15 { margin-right: 15px; }
.mrrt20 { margin-right: 20px; } .mrrt25 { margin-right: 25px; }
.mrrt30 { margin-right: 30px; } .mrrt35 { margin-right: 35px; } .mrrt40 { margin-right: 40px; }
.mrtp5 { margin-top: 5px; } .mrtp10 { margin-top: 10px; } .mrtp15 { margin-top: 15px; }
.mrtp20 { margin-top: 20px; } .mrtp25 { margin-top: 25px; }
.mrtp30 { margin-top: 30px; } .mrtp35 { margin-top: 35px; } .mrtp40 { margin-top: 40px; }
.mrbm5 { margin-bottom: 5px; } .mrbm10 { margin-bottom: 10px; } .mrbm15 { margin-bottom: 15px; }
.mrbm20 { margin-bottom: 20px; } .mrbm25 { margin-bottom: 25px; }
.mrbm30 { margin-bottom: 30px; } .mrbm35 { margin-bottom: 35px; } .mrbm40 { margin-bottom: 40px; }
/*----------------------------------------------------------------------------*/
.line10 { line-height: 10px; } .line20 { line-height: 20px; } .line24 { line-height: 24px; } .line26 { line-height: 26px; } .line28 { line-height: 28px; }
.line30 { line-height: 30px; } .line32 { line-height: 32px; } .line34 { line-height: 34px; } .line36 { line-height: 36px; } .line38 { line-height: 38px; }
.line40 { line-height: 40px; } .line42 { line-height: 42px; } .line45 { line-height: 45px; } .line50 { line-height: 50px; } .line60 { line-height: 60px; }
/*----------------------------------------------------------------------------*/
.minh10 { min-height: 10px; } .minh20 { min-height: 20px; } .minh25 { min-height: 25px; } .minh30 { min-height: 30px; } .minh35 { min-height: 35px; }
.minh40 { min-height: 40px; } .minh45 { min-height: 45px; } .minh50 { min-height: 50px; } .minh100 { min-height: 100px; } .minh120 { min-height: 120px; }
.minh150 { min-height: 150px; } .minh200 { min-height: 200px; } .minh250 { min-height: 250px; } .minh300 { min-height: 300px; } .minh350 { min-height: 350px; }
/*----------------------------------------------------------------------------*/
.bradius3 { border-radius: 3px; } .bradius5 { border-radius: 5px; } .bradius8 { border-radius: 8px; } .bradius10 { border-radius: 10px; } .bradius12 { border-radius: 12px; }
.bradius14 { border-radius: 14px; } .bradius16 { border-radius: 16px; } .bradius18 { border-radius: 18px; } .bradius20 { border-radius: 20px; } .bradius20 { border-radius: 24px; }
.bradius100 { border-radius: 100%; }
/*----------------------------------------------------------------------------*/
.fta-ct { text-align: center; } .fta-lt { text-align: left; } .fta-rt { text-align: right; }
.fva-top { vertical-align: top; } .fva-mid { vertical-align: middle; } .fva-bot { vertical-align: bottom; }
/*----------------------------------------------------------------------------*/
.fs12 { font-size: 12px; } .fs13 { font-size: 13px; } .fs14 { font-size: 14px; } .fs15 { font-size: 15px; } .fs16 { font-size: 16px; } .fs17 { font-size: 17px; } .fs18 { font-size: 18px; } .fs19 { font-size: 19px; }
.fs20 { font-size: 20px; } .fs21 { font-size: 21px; } .fs22 { font-size: 22px; } .fs23 { font-size: 23px; } .fs24 { font-size: 24px; } .fs25 { font-size: 25px; } .fs26 { font-size: 26px; } .fs27 { font-size: 27px; }
.fs28 { font-size: 28px; } .fs29 { font-size: 29px; } .fs30 { font-size: 30px; } .fs32 { font-size: 32px; } .fs34 { font-size: 34px; } .fs36 { font-size: 36px; } .fs38 { font-size: 38px; }
.fs40 { font-size: 40px; } .fs42 { font-size: 42px; } .fs44 { font-size: 44px; } .fs46 { font-size: 46px; } .fs48 { font-size: 48px; } .fs50 { font-size: 50px; }
.fs60 { font-size: 60px; } .fs70 { font-size: 70px; } .fs80 { font-size: 80px; } .fs90 { font-size: 90px; } .fs100 { font-size: 100px; }
/*----------------------------------------------------------------------------*/
.fw5 { font-weight: 500; } .fw6 { font-weight: 600; } .fw7 { font-weight: 700; } .fw8 { font-weight: 800; } .fw9 { font-weight: 900; } .fw10 { font-weight: 1000; }
/*----------------------------------------------------------------------------*/
.fls1 { letter-spacing: 1px; } .fls3 { letter-spacing: 3px; } .fls5 { letter-spacing: 5px; } .fls8 { letter-spacing: 8px; } .fls10 { letter-spacing: 10px; } .fls12 { letter-spacing: 12px; } .fls15 { letter-spacing: 15px; }
.fls18 { letter-spacing: 18px; } .fls20 { letter-spacing: 20px; } .fls24 { letter-spacing: 24px; } .fls26 { letter-spacing: 26px; } .fls28 { letter-spacing: 28px; } .fls30 { letter-spacing: 30px; }
/*----------------------------------------------------------------------------*/
/*上線 下線 中線*/
.litop { text-decoration: overline; } .libottom { text-decoration: underline; } .limiddle { text-decoration: line-through; }
/*----------------------------------------------------------------------------*/
/*需要 縮短字串 ... */
.ellipsis1 { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; }
.ellipsis2, .ellipsis3, .ellipsis4, .ellipsis5, .ellipsis6, .ellipsis7, .ellipsis8, .ellipsis9, .ellipsis10, .ellipsis11, .ellipsis12,
.ellipsis13, .ellipsis14, .ellipsis15, .ellipsis16, .ellipsis17, .ellipsis18, .ellipsis19, .ellipsis20, .ellipsis21, .ellipsis22, .ellipsis23,
.ellipsis24, .ellipsis25, .ellipsis26, .ellipsis27, .ellipsis28, .ellipsis29, .ellipsis30 {
overflow: hidden; text-overflow: ellipsis; display: -webkit-box !important; -webkit-box-orient: vertical;
}
.ellipsis2 { -webkit-line-clamp: 2; } .ellipsis3 { -webkit-line-clamp: 3; } .ellipsis4 { -webkit-line-clamp: 4; }
.ellipsis5 { -webkit-line-clamp: 5; } .ellipsis6 { -webkit-line-clamp: 6; } .ellipsis7 { -webkit-line-clamp: 7; }
.ellipsis8 { -webkit-line-clamp: 8; } .ellipsis9 { -webkit-line-clamp: 9; } .ellipsis10 { -webkit-line-clamp: 10; }
.ellipsis11 { -webkit-line-clamp: 11; } .ellipsis12 { -webkit-line-clamp: 12; } .ellipsis13 { -webkit-line-clamp: 13; }
.ellipsis14 { -webkit-line-clamp: 14; } .ellipsis15 { -webkit-line-clamp: 15; } .ellipsis16 { -webkit-line-clamp: 16; }
.ellipsis17 { -webkit-line-clamp: 17; } .ellipsis18 { -webkit-line-clamp: 18; } .ellipsis19 { -webkit-line-clamp: 19; }
.ellipsis20 { -webkit-line-clamp: 20; } .ellipsis21 { -webkit-line-clamp: 21; } .ellipsis22 { -webkit-line-clamp: 22; }
.ellipsis23 { -webkit-line-clamp: 23; } .ellipsis24 { -webkit-line-clamp: 24; } .ellipsis25 { -webkit-line-clamp: 25; }
.ellipsis26 { -webkit-line-clamp: 26; } .ellipsis27 { -webkit-line-clamp: 27; } .ellipsis28 { -webkit-line-clamp: 28; }
.ellipsis29 { -webkit-line-clamp: 29; } .ellipsis30 { -webkit-line-clamp: 30; }
/*----------------------------------------------------------------------------*/
/*對齊文字*/
.txt-justify {
text-align: justify;
text-justify: inter-ideograph;
-ms-text-justify: inter-ideograph; /*IE9*/
-moz-text-align-last:justify; /*Firefox*/
-webkit-text-align-last:justify; /*Chrome*/
}
/*----------------------------------------------------------------------------*/
.ftsnone { text-shadow: none; }
.fts01 {
text-shadow: 0 1px 0 #ccc,
0 2px 0 #c9c9c9,
0 3px 0 #bbb,
0 4px 0 #b9b9b9,
0 5px 0 #aaa,
0 6px 1px rgba(0,0,0,.1),
0 0 5px rgba(0,0,0,.1),
0 1px 3px rgba(0,0,0,.3),
0 3px 5px rgba(0,0,0,.2),
0 5px 10px rgba(0,0,0,.25),
0 10px 10px rgba(0,0,0,.2),
0 20px 20px rgba(0,0,0,.15);
}
.fts02 { text-shadow: 0px 1px 0px #999, 0px 2px 0px #888, 0px 3px 0px #777, 0px 4px 0px #666, 0px 5px 0px #555, 0px 6px 0px #444, 0px 7px 0px #333, 0px 8px 7px #001135; }
.fts03 { text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black; }
.fts04 { text-shadow: -1px 0 rgba(0, 0, 0, .3), 0 1px rgba(0, 0, 0, .3), 1px 0 black, 0 -1px rgba(0, 0, 0, .3); }
.fts05 { text-shadow: -1px 0 white, 0 1px white, 1px 0 white, 0 -1px white; }
.fts-white35 { text-shadow: -1px -1px rgba(255, 255, 255, .35), -1px 1px rgba(255, 255, 255, .35), 1px -1px rgba(255, 255, 255, .35), 1px 1px rgba(255, 255, 255, .35), 1px 1px rgba(255, 255, 255, .35); }
.fts-white65 { text-shadow: -1px -1px rgba(255, 255, 255, .65), -1px 1px rgba(255, 255, 255, .65), 1px -1px rgba(255, 255, 255, .65), 1px 1px rgba(255, 255, 255, .65), 1px 1px rgba(255, 255, 255, .65); }
.fts-white85 { text-shadow: -1px -1px rgba(255, 255, 255, .85), -1px 1px rgba(255, 255, 255, .85), 1px -1px rgba(255, 255, 255, .85), 1px 1px rgba(255, 255, 255, .85), 1px 1px rgba(255, 255, 255, .85); }
.fts-white100 { text-shadow: -1px -1px rgba(255, 255, 255, 1), -1px 1px rgba(255, 255, 255, 1), 1px -1px rgba(255, 255, 255, 1), 1px 1px rgba(255, 255, 255, 1), 1px 1px rgba(255, 255, 255, 1); }
.fts-red35 { text-shadow: -1px -1px rgba(255, 0, 0, .35), -1px 1px rgba(255, 0, 0, .35), 1px -1px rgba(255, 0, 0, .35), 1px 1px rgba(255, 0, 0, .35), 1px 1px rgba(255, 0, 0, .35); }
.fts-red65 { text-shadow: -1px -1px rgba(255, 0, 0, .65), -1px 1px rgba(255, 0, 0, .65), 1px -1px rgba(255, 0, 0, .65), 1px 1px rgba(255, 0, 0, .65), 1px 1px rgba(255, 0, 0, .65); }
.fts-black15 { text-shadow: -1px -1px rgba(0, 0, 0, .15), -1px 1px rgba(0, 0, 0, .15), 1px -1px rgba(0, 0, 0, .15), 1px 1px rgba(0, 0, 0, .15), 1px 1px rgba(0, 0, 0, .15); }
.fts-black35 { text-shadow: -1px -1px rgba(0, 0, 0, .35), -1px 1px rgba(0, 0, 0, .35), 1px -1px rgba(0, 0, 0, .35), 1px 1px rgba(0, 0, 0, .35), 1px 1px rgba(0, 0, 0, .35); }
.fts-black65 { text-shadow: -1px -1px rgba(0, 0, 0, .65), -1px 1px rgba(0, 0, 0, .65), 1px -1px rgba(0, 0, 0, .65), 1px 1px rgba(0, 0, 0, .65), 1px 1px rgba(0, 0, 0, .65); }
.fts-green35 { text-shadow: -1px -1px rgba(120, 200, 35, .35), -1px 1px rgba(120, 200, 35, .35), 1px -1px rgba(120, 200, 35, .35), 1px 1px rgba(120, 200, 35, .35), 1px 1px rgba(120, 200, 35, .35); }
.fts-green65 { text-shadow: -1px -1px rgba(120, 200, 35, .65), -1px 1px rgba(120, 200, 35, .65), 1px -1px rgba(120, 200, 35, .65), 1px 1px rgba(120, 200, 35, .65), 1px 1px rgba(120, 200, 35, .65); }
.fts-deepblue15 { text-shadow: -1px -1px rgba(50, 150, 200, .15), -1px 1px rgba(50, 150, 200, .15), 1px -1px rgba(50, 150, 200, .15), 1px 1px rgba(50, 150, 200, .15), 1px 1px rgba(50, 150, 200, .15); }
.fts-deepblue35 { text-shadow: -1px -1px rgba(50, 150, 200, .35), -1px 1px rgba(50, 150, 200, .35), 1px -1px rgba(50, 150, 200, .35), 1px 1px rgba(50, 150, 200, .35), 1px 1px rgba(50, 150, 200, .35); }
.fts-deepblue65 { text-shadow: -1px -1px rgba(50, 150, 200, .65), -1px 1px rgba(50, 150, 200, .65), 1px -1px rgba(50, 150, 200, .65), 1px 1px rgba(50, 150, 200, .65), 1px 1px rgba(50, 150, 200, .65); }
.fts-blue35 { text-shadow: -1px -1px rgba(1, 140, 190, .35), -1px 1px rgba(1, 140, 190, .35), 1px -1px rgba(1, 140, 190, .35), 1px 1px rgba(1, 140, 190, .35), 1px 1px rgba(1, 140, 190, .35); }
.fts-blue65 { text-shadow: -1px -1px rgba(1, 140, 190, .65), -1px 1px rgba(1, 140, 190, .65), 1px -1px rgba(1, 140, 190, .65), 1px 1px rgba(1, 140, 190, .65), 1px 1px rgba(1, 140, 190, .65); }
.fts-orange35 { text-shadow: -1px -1px rgba(255, 87, 34, .35), -1px 1px rgba(255, 87, 34, .35), 1px -1px rgba(255, 87, 34, .35), 1px 1px rgba(255, 87, 34, .35), 1px 1px rgba(255, 87, 34, .35); }
.fts-orange65 { text-shadow: -1px -1px rgba(255, 87, 34, .65), -1px 1px rgba(255, 87, 34, .65), 1px -1px rgba(255, 87, 34, .65), 1px 1px rgba(255, 87, 34, .65), 1px 1px rgba(255, 87, 34, .65); }
.fts-purple35 { text-shadow: -1px -1px rgba(171, 71, 188, .35), -1px 1px rgba(171, 71, 188, .35), 1px -1px rgba(171, 71, 188, .35), 1px 1px rgba(171, 71, 188, .35), 1px 1px rgba(171, 71, 188, .35); }
.fts-purple65 { text-shadow: -1px -1px rgba(171, 71, 188, .65), -1px 1px rgba(171, 71, 188, .65), 1px -1px rgba(171, 71, 188, .65), 1px 1px rgba(171, 71, 188, .65), 1px 1px rgba(171, 71, 188, .65); }
.fts-khaki35 { text-shadow: -1px -1px rgba(150, 140, 80, .35), -1px 1px rgba(150, 140, 80, .35), 1px -1px rgba(150, 140, 80, .35), 1px 1px rgba(150, 140, 80, .35), 1px 1px rgba(150, 140, 80, .35); } /*黃褐色 土黃色*/
.fts-khaki65 { text-shadow: -1px -1px rgba(150, 140, 80, .65), -1px 1px rgba(150, 140, 80, .65), 1px -1px rgba(150, 140, 80, .65), 1px 1px rgba(150, 140, 80, .65), 1px 1px rgba(150, 140, 80, .65); }
/*----------------------------------------------------------------------------*/
/*
.defen { font-family: Arial, sans-serif; }
.en001 { font-family: 'Chathura', sans-serif; }
.en002 { font-family: 'Dosis', sans-serif; } /*常用*
.en003 { font-family: 'Elsie Swash Caps', cursive; } /*魔法 細*
.en004 { font-family: 'Emilys Candy', cursive; } /*魔法 銳*
.en005 { font-family: 'Griffy', cursive; } /*魔法 強*
.en006 { font-family: 'Italianno', cursive; } /*藝術*
.en007 { font-family: 'Lancelot', cursive; } /*中規 藝術*
.en008 { font-family: 'Lateef', cursive; } /*一般加粗*
.en009 { font-family: 'Lovers Quarrel', cursive; } /*藝術*
.en010 { font-family: 'Meie Script', cursive; } /*藝術加粗*
.en011 { font-family: 'Milonga', cursive; } /*電影*
.en012 { font-family: 'Miss Fajardose', cursive; } /*藝術長*
.en013 { font-family: 'Old Standard TT', serif; } /*正規*
.en014 { font-family: 'Peddana', serif; } /*正規 縮高*
.en015 { font-family: 'Pinyon Script', cursive; } /*藝術 加粗*
.en016 { font-family: 'Pompiere', cursive; } /*正規 加長*
.en017 { font-family: 'Ruthie', cursive; } /*街頭藝術*
.en018 { font-family: 'Sree Krushnadevaraya', serif; } /*正規 加粗*
.en019 { font-family: 'Stalemate', cursive; } /*藝術草寫*
.en020 { font-family: 'Tangerine', cursive; } /*藝術 一般*
.en021 { font-family: 'Tenali Ramakrishna', sans-serif; } /*正規加粗 縮高*
.en022 { font-family: 'Tulpen One', cursive; } /*pop 縮寬*
.en023 { font-family: 'Josefin Sans', sans-serif; } /*pop 加粗 增寬*
/*2018 04 21 新增*
.en024 { font-family: 'Hi Melody', cursive; }
.en025 { font-family: 'Sacramento', cursive; }
.en026 { font-family: 'Ubuntu', sans-serif; }
.en027 { font-family: 'Poiret One', cursive; }
.en028 { font-family: 'Parisienne', cursive; }
.en029 { font-family: 'Fredericka the Great', cursive; } /*素描*
.en030 { font-family: 'Allerta Stencil', sans-serif; }
.en031 { font-family: 'Kurale', serif; }
.en032 { font-family: 'Spirax', cursive; }
.en033 { font-family: 'Scheherazade', serif; }
.en034 { font-family: 'Unkempt', cursive; }
.en035 { font-family: 'La Belle Aurore', cursive; }
.en036 { font-family: 'Gafata', sans-serif; }
.en037 { font-family: 'Rouge Script', cursive; }
.en038 { font-family: 'Life Savers', cursive; }
.en039 { font-family: 'Mountains of Christmas', cursive; }
.en040 { font-family: 'Mystery Quest', cursive; }
.en041 { font-family: 'Elsie', cursive; }
.en042 { font-family: 'Monsieur La Doulaise', cursive; }
.en043 { font-family: 'Cormorant Upright', serif; }
*/
/*----------------------------------------------------------------------------*/
/*
.tc01 { font-family: 'cwTeXKai', serif; } /*楷體 *
.tc02 { font-family: 'cwTeXYen', sans-serif; } /*圓體*
.tc03 { font-family: 'cwTeXMing', serif; } /*明體 *
.tc04 { font-family: 'cwTeXHei', sans-serif; } /*黑體*
.tc05 { font-family: 'cwTeXFangSong', serif; } /*仿宋體*
.tc06 { font-family: 'Noto Sans TC', sans-serif; } /*思源體*
*/
/*----------------------------------------------------------------------------*/
/*社群通訊*/
.line-color100 { color: rgba(0, 185, 0, 1); } .line-color085 { color: rgba(0, 185, 0, .85); } .line-color065 { color: rgba(0, 185, 0, .65); }
.fb-color100 { color: rgba(66, 103, 178, 1); } .fb-color085 { color: rgba(66, 103, 178, .85); } .fb-color065 { color: rgba(66, 103, 178, .65); }
.twitter-color100 { color: rgba(66, 171, 225, 1); } .twitter-color085 { color: rgba(66, 171, 225, .85); } .twitter-color065 { color: rgba(66, 171, 225, .65); }
/*----------------------------------------------------------------------------*/
.white { color: #fff; }
.white-095 { color: rgba(255, 255, 255, .95); } .white-090 { color: rgba(255, 255, 255, .9); } .white-085 { color: rgba(255, 255, 255, .85); } .white-080 { color: rgba(255, 255, 255, .8); }
.white-075 { color: rgba(255, 255, 255, .75); } .white-070 { color: rgba(255, 255, 255, .7); } .white-065 { color: rgba(255, 255, 255, .65); } .white-060 { color: rgba(255, 255, 255, .6); }
.white-055 { color: rgba(255, 255, 255, .55); } .white-050 { color: rgba(255, 255, 255, .5); } .white-045 { color: rgba(255, 255, 255, .45); } .white-040 { color: rgba(255, 255, 255, .4); }
.white-035 { color: rgba(255, 255, 255, .35); } .white-030 { color: rgba(255, 255, 255, .3); } .white-025 { color: rgba(255, 255, 255, .25); } .white-020 { color: rgba(255, 255, 255, .2); }
.white-015 { color: rgba(255, 255, 255, .15); } .white-010 { color: rgba(255, 255, 255, .1); } .white-005 { color: rgba(255, 255, 255, .05); }
.black-095 { color: rgba(0, 0, 0, .95); } .black-090 { color: rgba(0, 0, 0, .9); } .black-085 { color: rgba(0, 0, 0, .85); } .black-080 { color: rgba(0, 0, 0, .8); }
.black-075 { color: rgba(0, 0, 0, .75); } .black-070 { color: rgba(0, 0, 0, .7); } .black-065 { color: rgba(0, 0, 0, .65); } .black-060 { color: rgba(0, 0, 0, .6); }
.black-055 { color: rgba(0, 0, 0, .55); } .black-050 { color: rgba(0, 0, 0, .5); } .black-045 { color: rgba(0, 0, 0, .45); } .black-040 { color: rgba(0, 0, 0, .4); }
.black-035 { color: rgba(0, 0, 0, .35); } .black-030 { color: rgba(0, 0, 0, .3); } .black-025 { color: rgba(0, 0, 0, .25); } .black-020 { color: rgba(0, 0, 0, .2); }
.black-015 { color: rgba(0, 0, 0, .15); } .black-010 { color: rgba(0, 0, 0, .1); } .black-005 { color: rgba(0, 0, 0, .05); }
.red-50 { color: #ffebee; } .red-100 { color: #ffcdd2; } .red-200 { color: #ef9a9a; } .red-300 { color: #e57373; } .red-400 { color: #ef5350; } .red-500 { color: #f44336; } .red-600 { color: #e53935; }
.red-700 { color: #d32f2f; } .red-800 { color: #c62828; } .red-900 { color: #b71c1c; } .red-A100 { color: #ff8a80; } .red-A200 { color: #ff5252; } .red-A400 { color: #ff1744; } .red-A700 { color: #d50000; }
.pink-50 { color: #fce4ec; } .pink-100 { color: #f8bbd0; } .pink-200 { color: #f48fb1; } .pink-300 { color: #f06292; } .pink-400 { color: #ec407a; } .pink-500 { color: #e91e63; } .pink-600 { color: #d81b60; }
.pink-700 { color: #c2185b; } .pink-800 { color: #ad1457; } .pink-900 { color: #880e4f; } .pink-A100 { color: #ff80ab; } .pink-A200 { color: #ff4081; } .pink-A400 { color: #f50057; } .pink-A700 { color: #c51162; }
.purple-50 { color: #f3e5f5; } .purple-100 { color: #e1bee7; } .purple-200 { color: #ce93d8; } .purple-300 { color: #ba68c8; } .purple-400 { color: #ab47bc; } .purple-500 { color: #9c27b0; } .purple-600 { color: #8e24aa; }
.purple-700 { color: #7b1fa2; } .purple-800 { color: #6a1b9a; } .purple-900 { color: #4a148c; } .purple-A100 { color: #ea80fc; } .purple-A200 { color: #e040fb; } .purple-A400 { color: #d500f9; } .purple-A700 { color: #aa00ff; }
.deeppurple-50 { color: #ede7f6; } .deeppurple-100 { color: #d1c4e9; } .deeppurple-200 { color: #b39ddb; } .deeppurple-300 { color: #9575cd; } .deeppurple-400 { color: #7e57c2; } .deeppurple-500 { color: #673ab7; }
.deeppurple-600 { color: #5e35b1; } .deeppurple-700 { color: #512da8; } .deeppurple-800 { color: #4527a0; } .deeppurple-900 { color: #311b92; } .deeppurple-A100 { color: #b388ff; }
.deeppurple-A200 { color: #7c4dff; } .deeppurple-A400 { color: #651fff; } .deeppurple-A700 { color: #6200ea; }
.indigo-50 { color: #e8eaf6; } .indigo-100 { color: #c5cae9; } .indigo-200 { color: #9fa8da; } .indigo-300 { color: #7986cb; } .indigo-400 { color: #5c6bc0; } .indigo-500 { color: #3f51b5; } .indigo-600 { color: #3949ab; }
.indigo-700 { color: #303f9f; } .indigo-800 { color: #283593; } .indigo-900 { color: #1a237e; } .indigo-A100 { color: #8c9eff; } .indigo-A200 { color: #536dfe; } .indigo-A400 { color: #3d5afe; } .indigo-A700 { color: #304ffe; }
.blue-50 {color: #e3f2fd; } .blue-100 {color: #bbdefb; } .blue-200 {color: #90caf9; } .blue-300 {color: #64b5f6; } .blue-400 {color: #42a5f5; } .blue-500 {color: #2196f3; } .blue-600 {color: #1e88e5; }
.blue-700 {color: #1976d2; } .blue-800 {color: #1565c0; } .blue-900 {color: #0d47a1; } .blue-A100 {color: #82b1ff; } .blue-A200 {color: #448aff; } .blue-A400 {color: #2979ff; } .blue-A700 {color: #2962ff; }
.lightblue-50 { color: #e1f5fe; } .lightblue-100 { color: #b3e5fc; } .lightblue-200 { color: #81d4fa; } .lightblue-300 { color: #4fc3f7; } .lightblue-400 { color: #29b6f6; } .lightblue-500 { color: #03a9f4; }
.lightblue-600 { color: #039be5; } .lightblue-700 { color: #0288d1; } .lightblue-800 { color: #0277bd; } .lightblue-900 { color: #01579b; } .lightblue-A100 { color: #80d8ff; }
.lightblue-A200 { color: #40c4ff; } .lightblue-A400 { color: #00b0ff; } .lightblue-A700 { color: #0091ea; }
.cyan-50 { color: #e0f7fa; } .cyan-100 { color: #b2ebf2; } .cyan-200 { color: #80deea; } .cyan-300 { color: #4dd0e1; } .cyan-400 { color: #26c6da; } .cyan-500 { color: #00bcd4; } .cyan-600 { color: #00acc1; }
.cyan-700 { color: #0097a7; } .cyan-800 { color: #00838f; } .cyan-900 { color: #006064; } .cyan-A100 { color: #84ffff; } .cyan-A200 { color: #18ffff; } .cyan-A400 { color: #00e5ff; } .cyan-A700 { color: #00b8d4; }
.teal-50 { color: #e0f2f1; } .teal-100 { color: #b2dfdb; } .teal-200 { color: #80cbc4; } .teal-300 { color: #4db6ac; } .teal-400 { color: #26a69a; } .teal-500 { color: #009688; } .teal-600 { color: #00897b; }
.teal-700 { color: #00796b; } .teal-800 { color: #00695c; } .teal-900 { color: #004d40; } .teal-A100 { color: #a7ffeb; } .teal-A200 { color: #64ffda; } .teal-A400 { color: #1de9b6; } .teal-A700 { color: #00bfa5; }
.green-50 { color: #e8f5e9; } .green-100 { color: #c8e6c9; } .green-200 { color: #a5d6a7; } .green-300 { color: #81c784; } .green-400 { color: #66bb6a; } .green-500 { color: #4caf50; } .green-600 { color: #43a047; }
.green-700 { color: #388e3c; } .green-800 { color: #2e7d32; } .green-900 { color: #1b5e20; } .green-A100 { color: #b9f6ca; } .green-A200 { color: #69f0ae; } .green-A400 { color: #00e676; } .green-A700 { color: #00c853; }
.lightgreen-50 { color: #f1f8e9; } .lightgreen-100 { color: #dcedc8; } .lightgreen-200 { color: #c5e1a5; } .lightgreen-300 { color: #aed581; } .lightgreen-400 { color: #9ccc65; } .lightgreen-500 { color: #8bc34a; }
.lightgreen-600 { color: #7cb342; } .lightgreen-700 { color: #689f38; } .lightgreen-800 { color: #558b2f; } .lightgreen-900 { color: #33691e; } .lightgreen-A100 { color: #ccff90; }
.lightgreen-A200 { color: #b2ff59; } .lightgreen-A400 { color: #76ff03; } .lightgreen-A700 { color: #64dd17; }
.lime-50 { color: #f9fbe7; } .lime-100 { color: #f0f4c3; } .lime-200 { color: #e6ee9c; } .lime-300 { color: #dce775; } .lime-400 { color: #d4e157; } .lime-500 { color: #cddc39; } .lime-600 { color: #c0ca33; }
.lime-700 { color: #afb42b; } .lime-800 { color: #9e9d24; } .lime-900 { color: #827717; } .lime-A100 { color: #f4ff81; } .lime-A200 { color: #eeff41; } .lime-A400 { color: #c6ff00; } .lime-A700 { color: #aeea00; }
.yellow-50 { color: #fffde7; } .yellow-100 { color: #fff9c4; } .yellow-200 { color: #fff59d; } .yellow-300 { color: #fff176; } .yellow-400 { color: #ffee58; } .yellow-500 { color: #ffeb3b; } .yellow-600 { color: #fdd835; }
.yellow-700 { color: #fbc02d; } .yellow-800 { color: #f9a825; } .yellow-900 { color: #f57f17; } .yellow-A100 { color: #ffff8d; } .yellow-A200 { color: #ffff00; } .yellow-A400 { color: #ffea00; } .yellow-A700 { color: #ffd600; }
.amber-50 { color: #fff8e1; } .amber-100 { color: #ffecb3; } .amber-200 { color: #ffe082; } .amber-300 { color: #ffd54f; } .amber-400 { color: #ffca28; } .amber-500 { color: #ffc107; } .amber-600 { color: #ffb300; }
.amber-700 { color: #ffa000; } .amber-800 { color: #ff8f00; } .amber-900 { color: #ff6f00; } .amber-A100 { color: #ffe57f; } .amber-A200 { color: #ffd740; } .amber-A400 { color: #ffc400; } .amber-A700 { color: #ffab00; }
.orange-50 { color: #fff3e0; } .orange-100 { color: #ffe0b2; } .orange-200 { color: #ffcc80; } .orange-300 { color: #ffb74d; } .orange-400 { color: #ffa726; } .orange-500 { color: #ff9800; } .orange-600 { color: #fb8c00; }
.orange-700 { color: #f57c00; } .orange-800 { color: #ef6c00; } .orange-900 { color: #e65100; } .orange-A100 { color: #ffd180; } .orange-A200 { color: #ffab40; } .orange-A400 { color: #ff9100; } .orange-A700 { color: #ff6d00; }
.deeporange-50 { color: #fbe9e7; } .deeporange-100 { color: #ffccbc; } .deeporange-200 { color: #ffab91; } .deeporange-300 { color: #ff8a65; } .deeporange-400 { color: #ff7043; } .deeporange-500 { color: #ff5722; }
.deeporange-600 { color: #f4511e; } .deeporange-700 { color: #e64a19; } .deeporange-800 { color: #d84315; } .deeporange-900 { color: #bf360c; } .deeporange-A100 { color: #ff9e80; }
.deeporange-A200 { color: #ff6e40; } .deeporange-A400 { color: #ff3d00; } .deeporange-A700 { color: #dd2c00; }
.brown-50 { color: #efebe9; } .brown-100 { color: #d7ccc8; } .brown-200 { color: #bcaaa4; } .brown-300 { color: #a1887f; } .brown-400 { color: #8d6e63; } .brown-500 { color: #795548; } .brown-600 { color: #6d4c41; }
.brown-700 { color: #5d4037; } .brown-800 { color: #4e342e; } .brown-900 { color: #3e2723; }
.grey-50 { color: #fafafa; } .grey-100 { color: #f5f5f5; } .grey-200 { color: #eeeeee; } .grey-300 { color: #e0e0e0; } .grey-400 { color: #bdbdbd; } .grey-500 { color: #9e9e9e; } .grey-600 { color: #757575; }
.grey-700 { color: #616161; } .grey-800 { color: #424242; } .grey-900 { color: #212121; }
.bluegrey-50 { color: #eceff1; } .bluegrey-100 { color: #cfd8dc; } .bluegrey-200 { color: #b0bec5; } .bluegrey-300 { color: #90a4ae; } .bluegrey-400 { color: #78909c; } .bluegrey-500 { color: #607d8b; }
.bluegrey-600 { color: #546e7a; } .bluegrey-700 { color: #455a64; } .bluegrey-800 { color: #37474f; } .bluegrey-900 { color: #263238; }
/*----------------------------------------------------------------------------*/
.whitea100 { background-color: rgba(255, 255, 255, 1); }
.whitea8 { background-color: rgba(255, 255, 255, .8); }
.whitea6 { background-color: rgba(255, 255, 255, .6); }
.whitea5 { background-color: rgba(255, 255, 255, .5); }
.whitea3 { background-color: rgba(255, 255, 255, .3); }
.whitea1 { background-color: rgba(255, 255, 255, .1); }
/*紅 red*/ /*粉 pink*/ /*紫 purple*/ /*深紫 deeppurple*/ /*靛青 indigo*/ /*藍 blue*/ /*淺藍 lightblue*/ /*青色 cyan*/ /*藍綠色 teal*/
/*綠 green*/ /*淺綠 lightgreen*/ /*檸檬綠 lime*/ /*黃色 yellow*/ /*琥珀色 amber*/ /*橙色 orange*/ /*深橙 deeporange*/ /*棕色 brown*/ /*灰色 grey*/ /*灰藍 bluegrey*/
/*紅*/
.red-50a8 { background-color: rgba(255, 235, 238, .8); } .red-100a8 { background-color: rgba(255, 205, 210, .8); } .red-200a8 { background-color: rgba(239, 154, 154, .8); } .red-300a8 { background-color: rgba(229, 115, 115, .8); }
.red-400a8 { background-color: rgba(239, 83, 80, .8); } .red-500a8 { background-color: rgba(244, 67, 54, .8); } .red-600a8 { background-color: rgba(229, 57, 53, .8); } .red-700a8 { background-color: rgba(211, 47, 47, .8); }
.red-800a8 { background-color: rgba(198, 40, 40, .8); } .red-900a8 { background-color: rgba(183, 28, 28, .8); } .red-A100a8 { background-color: rgba(255, 138, 128, .8); } .red-A200a8 { background-color: rgba(255, 82, 82, .8); }
.red-A400a8 { background-color: rgba(255, 23, 68, .8); } .red-A700a8 { background-color: rgba(213, 0, 0, .8); }
/*粉*/
.pink-50a8 { background-color: rgba(252, 228, 236, .8); } .pink-100a8 { background-color: rgba(248, 187, 208, .8); } .pink-200a8 { background-color: rgba(244, 143, 177, .8); } .pink-300a8 { background-color: rgba(240, 98, 146, .8); }
.pink-400a8 { background-color: rgba(236, 64, 122, .8); } .pink-500a8 { background-color: rgba(233, 30, 99, .8); } .pink-600a8 { background-color: rgba(216, 27, 96, .8); } .pink-700a8 { background-color: rgba(194, 24, 91, .8); }
.pink-800a8 { background-color: rgba(173, 20, 87, .8); } .pink-900a8 { background-color: rgba(136, 14, 79, .8); } .pink-A100a8 { background-color: rgba(255, 128, 171, .8); } .pink-A200a8 { background-color: rgba(255, 64, 129, .8); }
.pink-A400a8 { background-color: rgba(245, 0, 87, .8); } .pink-A700a8 { background-color: rgba(197, 17, 98, .8); }
/*紫*/
.purple-50a8 { background-color: rgba(243, 229, 245, .8); } .purple-100a8 { background-color: rgba(225, 190, 231, .8); } .purple-200a8 { background-color: rgba(206, 147, 216, .8); } .purple-300a8 { background-color: rgba(186, 104, 200, .8); }
.purple-400a8 { background-color: rgba(171, 71, 188, .8); } .purple-500a8 { background-color: rgba(156, 39, 176, .8); } .purple-600a8 { background-color: rgba(142, 36, 170, .8); } .purple-700a8 { background-color: rgba(123, 31, 162, .8); }
.purple-800a8 { background-color: rgba(106, 27, 154, .8); } .purple-900a8 { background-color: rgba(74, 20, 140, .8); } .purple-A100a8 { background-color: rgba(234, 128, 252, .8); } .purple-A200a8 { background-color: rgba(224, 64, 251, .8); }
.purple-A400a8 { background-color: rgba(213, 0, 249, .8); } .purple-A700a8 { background-color: rgba(170, 0, 255, .8); }
/*深紫*/
.deeppurple-50a8 { background-color: rgba(237, 231, 246, .8); } .deeppurple-100a8 { background-color: rgba(209, 196, 233, .8); } .deeppurple-200a8 { background-color: rgba(179, 157, 219, .8); } .deeppurple-300a8 { background-color: rgba(149, 117, 205, .8); }
.deeppurple-400a8 { background-color: rgba(126, 87, 194, .8); } .deeppurple-500a8 { background-color: rgba(103, 58, 183, .8); } .deeppurple-600a8 { background-color: rgba(94, 53, 177, .8); } .deeppurple-700a8 { background-color: rgba(81, 45, 168, .8); }
.deeppurple-800a8 { background-color: rgba(69, 39, 160, .8); } .deeppurple-900a8 { background-color: rgba(49, 27, 146, .8); } .deeppurple-A100a8 { background-color: rgba(179, 136, 255, .8); } .deeppurple-A200a8 { background-color: rgba(124, 77, 255, .8); }
.deeppurple-A400a8 { background-color: rgba(101, 31, 255, .8); } .deeppurple-A700a8 { background-color: rgba(98, 0, 234, .8); }
/*靛青*/
.indigo-50a8 { background-color: rgba(232, 234, 246, .8); } .indigo-100a8 { background-color: rgba(197, 202, 233, .8); } .indigo-200a8 { background-color: rgba(159, 168, 218, .8); } .indigo-300a8 { background-color: rgba(121, 134, 203, .8); }
.indigo-400a8 { background-color: rgba(92, 107, 192, .8); } .indigo-500a8 { background-color: rgba(63, 81, 181, .8); } .indigo-600a8 { background-color: rgba(57, 73, 171, .8); } .indigo-700a8 { background-color: rgba(48, 63, 159, .8); }
.indigo-800a8 { background-color: rgba(40, 53, 147, .8); } .indigo-900a8 { background-color: rgba(26, 35, 126, .8); } .indigo-A100a8 { background-color: rgba(140, 158, 255, .8); } .indigo-A200a8 { background-color: rgba(83, 109, 254, .8); }
.indigo-A400a8 { background-color: rgba(61, 90, 254, .8); } .indigo-A700a8 { background-color: rgba(48, 79, 254, .8); }
/*藍*/
.blue-50a8 { background-color: rgba(227, 242, 253, .8); } .blue-100a8 { background-color: rgba(187, 222, 251, .8); } .blue-200a8 { background-color: rgba(144, 202, 249, .8); } .blue-300a8 { background-color: rgba(100, 181, 246, .8); }
.blue-400a8 { background-color: rgba(66, 165, 245, .8); } .blue-500a8 { background-color: rgba(33, 150, 243, .8); } .blue-600a8 { background-color: rgba(30, 136, 229, .8); } .blue-700a8 { background-color: rgba(25, 118, 210, .8); }
.blue-800a8 { background-color: rgba(21, 101, 192, .8); } .blue-900a8 { background-color: rgba(13, 71, 161, .8); } .blue-A100a8 { background-color: rgba(130, 177, 255, .8); } .blue-A200a8 { background-color: rgba(68, 138, 255, .8); }
.blue-A400a8 { background-color: rgba(41, 121, 255, .8); } .blue-A700a8 { background-color: rgba(41, 98, 255, .8); }
/*淺藍*/
.lightblue-50a8 { background-color: rgba(225, 245, 254, .8); } .lightblue-100a8 { background-color: rgba(179, 229, 252, .8); } .lightblue-200a8 { background-color: rgba(129, 212, 250, .8); } .lightblue-300a8 { background-color: rgba(79, 195, 247, .8); }
.lightblue-400a8 { background-color: rgba(41, 182, 246, .8); } .lightblue-500a8 { background-color: rgba(3, 169, 244, .8); } .lightblue-600a8 { background-color: rgba(3, 155, 229, .8); } .lightblue-700a8 { background-color: rgba(2, 136, 209, .8); }
.lightblue-800a8 { background-color: rgba(2, 119, 189, .8); } .lightblue-900a8 { background-color: rgba(1, 87, 155, .8); } .lightblue-A100a8 { background-color: rgba(128, 216, 255, .8); } .lightblue-A200a8 { background-color: rgba(64, 196, 255, .8); }
.lightblue-A400a8 { background-color: rgba(0, 176, 255, .8); } .lightblue-A700a8 { background-color: rgba(0, 145, 234, .8); }
/*青色*/
.cyan-50a8 { background-color: rgba(224, 247, 250, .8); } .cyan-100a8 { background-color: rgba(178, 235, 242, .8); } .cyan-200a8 { background-color: rgba(128, 222, 234, .8); } .cyan-300a8 { background-color: rgba(77, 208, 225, .8); }
.cyan-400a8 { background-color: rgba(38, 198, 218, .8); } .cyan-500a8 { background-color: rgba(0, 188, 212, .8); } .cyan-600a8 { background-color: rgba(0, 172, 193, .8); } .cyan-700a8 { background-color: rgba(0, 151, 167, .8); }
.cyan-800a8 { background-color: rgba(0, 131, 143, .8); } .cyan-900a8 { background-color: rgba(0, 96, 100, .8); } .cyan-A100a8 { background-color: rgba(132, 255, 255, .8); } .cyan-A200a8 { background-color: rgba(24, 255, 255, .8); }
.cyan-A400a8 { background-color: rgba(0, 229, 255, .8); } .cyan-A700a8 { background-color: rgba(0, 184, 212, .8); }
/*藍綠色*/
.teal-50a8 { background-color: rgba(224, 242, 241, .8); } .teal-100a8 { background-color: rgba(178, 223, 219, .8); } .teal-200a8 { background-color: rgba(128, 203, 196, .8); } .teal-300a8 { background-color: rgba(77, 182, 172, .8); }
.teal-400a8 { background-color: rgba(38, 166, 154, .8); } .teal-500a8 { background-color: rgba(0, 150, 136, .8); } .teal-600a8 { background-color: rgba(0, 137, 123, .8); } .teal-700a8 { background-color: rgba(0, 121, 107, .8); }
.teal-800a8 { background-color: rgba(0, 105, 92, .8); } .teal-900a8 { background-color: rgba(0, 77, 64, .8); } .teal-A100a8 { background-color: rgba(167, 255, 235, .8); } .teal-A200a8 { background-color: rgba(100, 255, 218, .8); }
.teal-A400a8 { background-color: rgba(29, 233, 182, .8); } .teal-A700a8 { background-color: rgba(0, 191, 165, .8); }
/*綠*/
.green-50a8 { background-color: rgba(232, 245, 233, .8); } .green-100a8 { background-color: rgba(200, 230, 201, .8); } .green-200a8 { background-color: rgba(165, 214, 167, .8); } .green-300a8 { background-color: rgba(129, 199, 132, .8); }
.green-400a8 { background-color: rgba(102, 187, 106, .8); } .green-500a8 { background-color: rgba(76, 175, 80, .8); } .green-600a8 { background-color: rgba(67, 160, 71, .8); } .green-700a8 { background-color: rgba(56, 142, 60, .8); }
.green-800a8 { background-color: rgba(46, 125, 50, .8); } .green-900a8 { background-color: rgba(27, 94, 32, .8); } .green-A100a8 { background-color: rgba(185, 246, 202, .8); } .green-A200a8 { background-color: rgba(105, 240, 174, .8); }
.green-A400a8 { background-color: rgba(0, 230, 118, .8); } .green-A700a8 { background-color: rgba(0, 200, 83, .8); }
/*淺綠*/
.lightgreen-50a8 { background-color: rgba(241, 248, 233, .8); } .lightgreen-100a8 { background-color: rgba(220, 237, 200, .8); } .lightgreen-200a8 { background-color: rgba(197, 225, 165, .8); } .lightgreen-300a8 { background-color: rgba(174, 213, 129, .8); }
.lightgreen-400a8 { background-color: rgba(156, 204, 101, .8); } .lightgreen-500a8 { background-color: rgba(139, 195, 74, .8); } .lightgreen-600a8 { background-color: rgba(124, 179, 66, .8); } .lightgreen-700a8 { background-color: rgba(104, 159, 56, .8); }
.lightgreen-800a8 { background-color: rgba(85, 139, 47, .8); } .lightgreen-900a8 { background-color: rgba(51, 105, 30, .8); } .lightgreen-A100a8 { background-color: rgba(204, 255, 144, .8); }.lightgreen-A200a8 { background-color: rgba(178, 255, 89, .8); }
.lightgreen-A400a8 { background-color: rgba(118, 255, 3, .8); } .lightgreen-A700a8 { background-color: rgba(100, 221, 23, .8); }
/*檸檬綠*/
.lime-50a8 { background-color: rgba(249, 251, 231, .8); } .lime-100a8 { background-color: rgba(240, 244, 195, .8); } .lime-200a8 { background-color: rgba(230, 238, 156, .8); } .lime-300a8 { background-color: rgba(220, 231, 117, .8); }
.lime-400a8 { background-color: rgba(212, 225, 87, .8); } .lime-500a8 { background-color: rgba(205, 220, 57, .8); } .lime-600a8 { background-color: rgba(192, 202, 51, .8); } .lime-700a8 { background-color: rgba(175, 180, 43, .8); }
.lime-800a8 { background-color: rgba(158, 157, 36, .8); } .lime-900a8 { background-color: rgba(130, 119, 23, .8); } .lime-A100a8 { background-color: rgba(244, 255, 129, .8); } .lime-A200a8 { background-color: rgba(238, 255, 65, .8); }
.lime-A400a8 { background-color: rgba(198, 255, 0, .8); } .lime-A700a8 { background-color: rgba(174, 234, 0, .8); }
/*黃色*/
.yellow-50a8 { background-color: rgba(255, 253, 231, .8); } .yellow-100a8 { background-color: rgba(255, 249, 196, .8); } .yellow-200a8 { background-color: rgba(255, 245, 157, .8); } .yellow-300a8 { background-color: rgba(255, 241, 118, .8); }
.yellow-400a8 { background-color: rgba(255, 238, 88, .8); } .yellow-500a8 { background-color: rgba(255, 235, 59, .8); } .yellow-600a8 { background-color: rgba(253, 216, 53, .8); } .yellow-700a8 { background-color: rgba(251, 192, 45, .8); }
.yellow-800a8 { background-color: rgba(249, 168, 37, .8); } .yellow-900a8 { background-color: rgba(245, 127, 23, .8); } .yellow-A100a8 { background-color: rgba(255, 255, 141, .8); } .yellow-A200a8 { background-color: rgba(255, 255, 0, .8); }
.yellow-A400a8 { background-color: rgba(255, 234, 0, .8); } .yellow-A700a8 { background-color: rgba(255, 214, 0, .8); }
/*琥珀色*/
.amber-50a8 { background-color: rgba(255, 248, 225, .8); } .amber-100a8 { background-color: rgba(255, 236, 179, .8); } .amber-200a8 { background-color: rgba(255, 224, 130, .8); } .amber-300a8 { background-color: rgba(255, 213, 79, .8); }
.amber-400a8 { background-color: rgba(255, 202, 40, .8); } .amber-500a8 { background-color: rgba(255, 193, 7, .8); } .amber-600a8 { background-color: rgba(255, 179, 0, .8); } .amber-700a8 { background-color: rgba(255, 160, 0, .8); }
.amber-800a8 { background-color: rgba(255, 143, 0, .8); } .amber-900a8 { background-color: rgba(255, 111, 0, .8); } .amber-A100a8 { background-color: rgba(255, 229, 127, .8); } .amber-A200a8 { background-color: rgba(255, 215, 64, .8); }
.amber-A400a8 { background-color: rgba(255, 196, 0, .8); } .amber-A700a8 { background-color: rgba(255, 171, 0, .8); }
/*橙色*/
.orange-50a8 { background-color: rgba(255, 243, 224, .8); } .orange-100a8 { background-color: rgba(255, 224, 178, .8); } .orange-200a8 { background-color: rgba(255, 204, 128, .8); } .orange-300a8 { background-color: rgba(255, 183, 77, .8); }
.orange-400a8 { background-color: rgba(255, 167, 38, .8); } .orange-500a8 { background-color: rgba(255, 152, 0, .8); } .orange-600a8 { background-color: rgba(251, 140, 0, .8); } .orange-700a8 { background-color: rgba(245, 124, 0, .8); }
.orange-800a8 { background-color: rgba(239, 108, 0, .8); } .orange-900a8 { background-color: rgba(230, 81, 0, .8); } .orange-A100a8 { background-color: rgba(255, 209, 128, .8); } .orange-A200a8 { background-color: rgba(255, 171, 64, .8); }
.orange-A400a8 { background-color: rgba(255, 145, 0, .8); } .orange-A700a8 { background-color: rgba(255, 109, 0, .8); }
/*深橙*/
.deeporange-50a8 { background-color: rgba(251, 233, 231, .8); } .deeporange-100a8 { background-color: rgba(255, 204, 188, .8); } .deeporange-200a8 { background-color: rgba(255, 171, 145, .8); } .deeporange-300a8 { background-color: rgba(255, 138, 101, .8); }
.deeporange-400a8 { background-color: rgba(255, 112, 67, .8); } .deeporange-500a8 { background-color: rgba(255, 87, 34, .8); } .deeporange-600a8 { background-color: rgba(244, 81, 30, .8); } .deeporange-700a8 { background-color: rgba(230, 74, 25, .8); }
.deeporange-800a8 { background-color: rgba(216, 67, 21, .8); } .deeporange-900a8 { background-color: rgba(191, 54, 12, .8); } .deeporange-A100a8 { background-color: rgba(255, 158, 128, .8); } .deeporange-A200a8 { background-color: rgba(255, 110, 64, .8); }
.deeporange-A400a8 { background-color: rgba(255, 61, 0, .8); } .deeporange-A700a8 { background-color: rgba(221, 44, 0, .8); }
/*棕色*/
.brown-50a8 { background-color: rgba(239, 235, 233, .8); } .brown-100a8 { background-color: rgba(215, 204, 200, .8); } .brown-200a8 { background-color: rgba(188, 170, 164, .8); } .brown-300a8 { background-color: rgba(161, 136, 127, .8); }
.brown-400a8 { background-color: rgba(141, 110, 99, .8); } .brown-500a8 { background-color: rgba(121, 85, 72, .8); } .brown-600a8 { background-color: rgba(109, 76, 65, .8); } .brown-700a8 { background-color: rgba(93, 64, 55, .8); }
.brown-800a8 { background-color: rgba(78, 52, 46, .8); } .brown-900a8 { background-color: rgba(62, 39, 35, .8); }
/*灰色*/
.grey-50a8 { background-color: rgba(250, 250, 250, .8); } .grey-100a8 { background-color: rgba(245, 245, 245, .8); } .grey-200a8 { background-color: rgba(238, 238, 238, .8); } .grey-300a8 { background-color: rgba(224, 224, 224, .8); }
.grey-400a8 { background-color: rgba(189, 189, 189, .8); } .grey-500a8 { background-color: rgba(158, 158, 158, .8); } .grey-600a8 { background-color: rgba(117, 117, 117, .8); } .grey-700a8 { background-color: rgba(97, 97, 97, .8); }
.grey-800a8 { background-color: rgba(66, 66, 66, .8); } .grey-900a8 { background-color: rgba(33, 33, 33, .8); }
/*灰藍*/
.bluegrey-50a8 { background-color: rgba(236, 239, 241, .8); } .bluegrey-100a8 { background-color: rgba(207, 216, 220, .8); } .bluegrey-200a8 { background-color: rgba(176, 190, 197, .8); } .bluegrey-300a8 { background-color: rgba(144, 164, 174, .8); }
.bluegrey-400a8 { background-color: rgba(120, 144, 156, .8); } .bluegrey-500a8 { background-color: rgba(96, 125, 139, .8); } .bluegrey-600a8 { background-color: rgba(84, 110, 122, .8); }
.bluegrey-700a8 { background-color: rgba(69, 90, 100, .8); } .bluegrey-800a8 { background-color: rgba(55, 71, 79, .8); } .bluegrey-900a8 { background-color: rgba(38, 50, 56, .8); }
/*----------------------------------------------------------------------------*/
.red-50a6 { background-color: rgba(255, 235, 238, .6); } .red-100a6 { background-color: rgba(255, 205, 210, .6); } .red-200a6 { background-color: rgba(239, 154, 154, .6); } .red-300a6 { background-color: rgba(229, 115, 115, .6); }
.red-400a6 { background-color: rgba(239, 83, 80, .6); } .red-500a6 { background-color: rgba(244, 67, 54, .6); } .red-600a6 { background-color: rgba(229, 57, 53, .6); } .red-700a6 { background-color: rgba(211, 47, 47, .6); }
.red-800a6 { background-color: rgba(198, 40, 40, .6); } .red-900a6 { background-color: rgba(183, 28, 28, .6); } .red-A100a6 { background-color: rgba(255, 138, 128, .6); } .red-A200a6 { background-color: rgba(255, 82, 82, .6); }
.red-A400a6 { background-color: rgba(255, 23, 68, .6); } .red-A700a6 { background-color: rgba(213, 0, 0, .6); }
.pink-50a6 { background-color: rgba(252, 228, 236, .6); } .pink-100a6 { background-color: rgba(248, 187, 208, .6); } .pink-200a6 { background-color: rgba(244, 143, 177, .6); } .pink-300a6 { background-color: rgba(240, 98, 146, .6); }
.pink-400a6 { background-color: rgba(236, 64, 122, .6); } .pink-500a6 { background-color: rgba(233, 30, 99, .6); } .pink-600a6 { background-color: rgba(216, 27, 96, .6); } .pink-700a6 { background-color: rgba(194, 24, 91, .6); }
.pink-800a6 { background-color: rgba(173, 20, 87, .6); } .pink-900a8 { background-color: rgba(136, 14, 79, .6); } .pink-A100a6 { background-color: rgba(255, 128, 171, .6); } .pink-A200a6 { background-color: rgba(255, 64, 129, .6); }
.pink-A400a6 { background-color: rgba(245, 0, 87, .6); } .pink-A700a6 { background-color: rgba(197, 17, 98, .6); }
.purple-50a6 { background-color: rgba(243, 229, 245, .6); } .purple-100a6 { background-color: rgba(225, 190, 231, .6); } .purple-200a6 { background-color: rgba(206, 147, 216, .6); } .purple-300a6 { background-color: rgba(186, 104, 200, .6); }
.purple-400a6 { background-color: rgba(171, 71, 188, .6); } .purple-500a6 { background-color: rgba(156, 39, 176, .6); } .purple-600a6 { background-color: rgba(142, 36, 170, .6); } .purple-700a6 { background-color: rgba(123, 31, 162, .6); }
.purple-800a6 { background-color: rgba(106, 27, 154, .6); } .purple-900a6 { background-color: rgba(74, 20, 140, .6); } .purple-A100a6 { background-color: rgba(234, 128, 252, .6); } .purple-A200a6 { background-color: rgba(224, 64, 251, .6); }
.purple-A400a6 { background-color: rgba(213, 0, 249, .6); } .purple-A700a6 { background-color: rgba(170, 0, 255, .6); }
.deeppurple-50a6 { background-color: rgba(237, 231, 246, .6); } .deeppurple-100a6 { background-color: rgba(209, 196, 233, .6); } .deeppurple-200a6 { background-color: rgba(179, 157, 219, .6); } .deeppurple-300a6 { background-color: rgba(149, 117, 205, .6); }
.deeppurple-400a6 { background-color: rgba(126, 87, 194, .6); } .deeppurple-500a6 { background-color: rgba(103, 58, 183, .6); } .deeppurple-600a6 { background-color: rgba(94, 53, 177, .6); } .deeppurple-700a6 { background-color: rgba(81, 45, 168, .6); }
.deeppurple-800a6 { background-color: rgba(69, 39, 160, .6); } .deeppurple-900a6 { background-color: rgba(49, 27, 146, .6); } .deeppurple-A100a6 { background-color: rgba(179, 136, 255, .6); } .deeppurple-A200a6 { background-color: rgba(124, 77, 255, .6); }
.deeppurple-A400a6 { background-color: rgba(101, 31, 255, .6); } .deeppurple-A700a6 { background-color: rgba(98, 0, 234, .6); }
.indigo-50a6 { background-color: rgba(232, 234, 246, .6); } .indigo-100a6 { background-color: rgba(197, 202, 233, .6); } .indigo-200a6 { background-color: rgba(159, 168, 218, .6); } .indigo-300a6 { background-color: rgba(121, 134, 203, .6); }
.indigo-400a6 { background-color: rgba(92, 107, 192, .6); } .indigo-500a6 { background-color: rgba(63, 81, 181, .6); } .indigo-600a6 { background-color: rgba(57, 73, 171, .6); } .indigo-700a6 { background-color: rgba(48, 63, 159, .6); }
.indigo-800a6 { background-color: rgba(40, 53, 147, .6); } .indigo-900a6 { background-color: rgba(26, 35, 126, .6); } .indigo-A100a6 { background-color: rgba(140, 158, 255, .6); } .indigo-A200a6 { background-color: rgba(83, 109, 254, .6); }
.indigo-A400a6 { background-color: rgba(61, 90, 254, .6); } .indigo-A700a6 { background-color: rgba(48, 79, 254, .6); }
.blue-50a6 { background-color: rgba(227, 242, 253, .6); } .blue-100a6 { background-color: rgba(187, 222, 251, .6); } .blue-200a6 { background-color: rgba(144, 202, 249, .6); } .blue-300a6 { background-color: rgba(100, 181, 246, .6); }
.blue-400a6 { background-color: rgba(66, 165, 245, .6); } .blue-500a6 { background-color: rgba(33, 150, 243, .6); } .blue-600a6 { background-color: rgba(30, 136, 229, .6); } .blue-700a6 { background-color: rgba(25, 118, 210, .6); }
.blue-800a6 { background-color: rgba(21, 101, 192, .6); } .blue-900a6 { background-color: rgba(13, 71, 161, .6); } .blue-A100a6 { background-color: rgba(130, 177, 255, .6); } .blue-A200a6 { background-color: rgba(68, 138, 255, .6); }
.blue-A400a6 { background-color: rgba(41, 121, 255, .6); } .blue-A700a6 { background-color: rgba(41, 98, 255, .6); }
.lightblue-50a6 { background-color: rgba(225, 245, 254, .6); } .lightblue-100a6 { background-color: rgba(179, 229, 252, .6); } .lightblue-200a6 { background-color: rgba(129, 212, 250, .6); } .lightblue-300a6 { background-color: rgba(79, 195, 247, .6); }
.lightblue-400a6 { background-color: rgba(41, 182, 246, .6); } .lightblue-500a6 { background-color: rgba(3, 169, 244, .6); } .lightblue-600a6 { background-color: rgba(3, 155, 229, .6); } .lightblue-700a6 { background-color: rgba(2, 136, 209, .6); }
.lightblue-800a6 { background-color: rgba(2, 119, 189, .6); } .lightblue-900a6 { background-color: rgba(1, 87, 155, .6); } .lightblue-A100a6 { background-color: rgba(128, 216, 255, .6); } .lightblue-A200a6 { background-color: rgba(64, 196, 255, .6); }
.lightblue-A400a6 { background-color: rgba(0, 176, 255, .6); } .lightblue-A700a6 { background-color: rgba(0, 145, 234, .6); }
.cyan-50a6 { background-color: rgba(224, 247, 250, .6); } .cyan-100a6 { background-color: rgba(178, 235, 242, .6); } .cyan-200a6 { background-color: rgba(128, 222, 234, .6); } .cyan-300a6 { background-color: rgba(77, 208, 225, .6); }
.cyan-400a6 { background-color: rgba(38, 198, 218, .6); } .cyan-500a6 { background-color: rgba(0, 188, 212, .6); } .cyan-600a6 { background-color: rgba(0, 172, 193, .6); } .cyan-700a6 { background-color: rgba(0, 151, 167, .6); }
.cyan-800a6 { background-color: rgba(0, 131, 143, .6); } .cyan-900a6 { background-color: rgba(0, 96, 100, .6); } .cyan-A100a6 { background-color: rgba(132, 255, 255, .6); } .cyan-A200a6 { background-color: rgba(24, 255, 255, .6); }
.cyan-A400a6 { background-color: rgba(0, 229, 255, .6); } .cyan-A700a6 { background-color: rgba(0, 184, 212, .6); }
.teal-50a6 { background-color: rgba(224, 242, 241, .6); } .teal-100a6 { background-color: rgba(178, 223, 219, .6); } .teal-200a6 { background-color: rgba(128, 203, 196, .6); } .teal-300a6 { background-color: rgba(77, 182, 172, .6); }
.teal-400a6 { background-color: rgba(38, 166, 154, .6); } .teal-500a6 { background-color: rgba(0, 150, 136, .6); } .teal-600a6 { background-color: rgba(0, 137, 123, .6); } .teal-700a6 { background-color: rgba(0, 121, 107, .6); }
.teal-800a6 { background-color: rgba(0, 105, 92, .6); } .teal-900a6 { background-color: rgba(0, 77, 64, .6); } .teal-A100a6 { background-color: rgba(167, 255, 235, .6); } .teal-A200a6 { background-color: rgba(100, 255, 218, .6); }
.teal-A400a6 { background-color: rgba(29, 233, 182, .6); } .teal-A700a6 { background-color: rgba(0, 191, 165, .6); }
.green-50a6 { background-color: rgba(232, 245, 233, .6); } .green-100a6 { background-color: rgba(200, 230, 201, .6); } .green-200a6 { background-color: rgba(165, 214, 167, .6); } .green-300a6 { background-color: rgba(129, 199, 132, .6); }
.green-400a6 { background-color: rgba(102, 187, 106, .6); } .green-500a6 { background-color: rgba(76, 175, 80, .6); } .green-600a6 { background-color: rgba(67, 160, 71, .6); } .green-700a6 { background-color: rgba(56, 142, 60, .6); }
.green-800a6 { background-color: rgba(46, 125, 50, .6); } .green-900a6 { background-color: rgba(27, 94, 32, .6); } .green-A100a6 { background-color: rgba(185, 246, 202, .6); } .green-A200a6 { background-color: rgba(105, 240, 174, .6); }
.green-A400a6 { background-color: rgba(0, 230, 118, .6); } .green-A700a6 { background-color: rgba(0, 200, 83, .6); }
.lightgreen-50a6 { background-color: rgba(241, 248, 233, .6); } .lightgreen-100a6 { background-color: rgba(220, 237, 200, .6); } .lightgreen-200a6 { background-color: rgba(197, 225, 165, .6); } .lightgreen-300a6 { background-color: rgba(174, 213, 129, .6); }
.lightgreen-400a6 { background-color: rgba(156, 204, 101, .6); } .lightgreen-500a6 { background-color: rgba(139, 195, 74, .6); } .lightgreen-600a6 { background-color: rgba(124, 179, 66, .6); } .lightgreen-700a6 { background-color: rgba(104, 159, 56, .6); }
.lightgreen-800a6 { background-color: rgba(85, 139, 47, .6); } .lightgreen-900a6 { background-color: rgba(51, 105, 30, .6); } .lightgreen-A100a6 { background-color: rgba(204, 255, 144, .6); }.lightgreen-A200a6 { background-color: rgba(178, 255, 89, .6); }
.lightgreen-A400a6 { background-color: rgba(118, 255, 3, .6); } .lightgreen-A700a6 { background-color: rgba(100, 221, 23, .6); }
.lime-50a6 { background-color: rgba(249, 251, 231, .6); } .lime-100a6 { background-color: rgba(240, 244, 195, .6); } .lime-200a6 { background-color: rgba(230, 238, 156, .6); } .lime-300a6 { background-color: rgba(220, 231, 117, .6); }
.lime-400a6 { background-color: rgba(212, 225, 87, .6); } .lime-500a6 { background-color: rgba(205, 220, 57, .6); } .lime-600a6 { background-color: rgba(192, 202, 51, .6); } .lime-700a6 { background-color: rgba(175, 180, 43, .6); }
.lime-800a6 { background-color: rgba(158, 157, 36, .6); } .lime-900a6 { background-color: rgba(130, 119, 23, .6); } .lime-A100a6 { background-color: rgba(244, 255, 129, .6); } .lime-A200a6 { background-color: rgba(238, 255, 65, .6); }
.lime-A400a6 { background-color: rgba(198, 255, 0, .6); } .lime-A700a6 { background-color: rgba(174, 234, 0, .6); }
.yellow-50a6 { background-color: rgba(255, 253, 231, .6); } .yellow-100a6 { background-color: rgba(255, 249, 196, .6); } .yellow-200a6 { background-color: rgba(255, 245, 157, .6); } .yellow-300a6 { background-color: rgba(255, 241, 118, .6); }
.yellow-400a6 { background-color: rgba(255, 238, 88, .6); } .yellow-500a6 { background-color: rgba(255, 235, 59, .6); } .yellow-600a6 { background-color: rgba(253, 216, 53, .6); } .yellow-700a6 { background-color: rgba(251, 192, 45, .6); }
.yellow-800a6 { background-color: rgba(249, 168, 37, .6); } .yellow-900a6 { background-color: rgba(245, 127, 23, .6); } .yellow-A100a6 { background-color: rgba(255, 255, 141, .6); } .yellow-A200a6 { background-color: rgba(255, 255, 0, .6); }
.yellow-A400a6 { background-color: rgba(255, 234, 0, .6); } .yellow-A700a6 { background-color: rgba(255, 214, 0, .6); }
.amber-50a6 { background-color: rgba(255, 248, 225, .6); } .amber-100a6 { background-color: rgba(255, 236, 179, .6); } .amber-200a6 { background-color: rgba(255, 224, 130, .6); } .amber-300a6 { background-color: rgba(255, 213, 79, .6); }
.amber-400a6 { background-color: rgba(255, 202, 40, .6); } .amber-500a6 { background-color: rgba(255, 193, 7, .6); } .amber-600a6 { background-color: rgba(255, 179, 0, .6); } .amber-700a6 { background-color: rgba(255, 160, 0, .6); }
.amber-800a6 { background-color: rgba(255, 143, 0, .6); } .amber-900a6 { background-color: rgba(255, 111, 0, .6); } .amber-A100a6 { background-color: rgba(255, 229, 127, .6); } .amber-A200a6 { background-color: rgba(255, 215, 64, .8); }
.amber-A400a6 { background-color: rgba(255, 196, 0, .6); } .amber-A700a6 { background-color: rgba(255, 171, 0, .6); }
.orange-50a6 { background-color: rgba(255, 243, 224, .6); } .orange-100a6 { background-color: rgba(255, 224, 178, .6); } .orange-200a6 { background-color: rgba(255, 204, 128, .6); } .orange-300a6 { background-color: rgba(255, 183, 77, .6); }
.orange-400a6 { background-color: rgba(255, 167, 38, .6); } .orange-500a6 { background-color: rgba(255, 152, 0, .6); } .orange-600a6 { background-color: rgba(251, 140, 0, .6); } .orange-700a6 { background-color: rgba(245, 124, 0, .6); }
.orange-800a6 { background-color: rgba(239, 108, 0, .6); } .orange-900a6 { background-color: rgba(230, 81, 0, .6); } .orange-A100a6 { background-color: rgba(255, 209, 128, .6); } .orange-A200a6 { background-color: rgba(255, 171, 64, .6); }
.orange-A400a6 { background-color: rgba(255, 145, 0, .6); } .orange-A700a6 { background-color: rgba(255, 109, 0, .6); }
.deeporange-50a6 { background-color: rgba(251, 233, 231, .6); } .deeporange-100a6 { background-color: rgba(255, 204, 188, .6); } .deeporange-200a6 { background-color: rgba(255, 171, 145, .6); } .deeporange-300a6 { background-color: rgba(255, 138, 101, .6); }
.deeporange-400a6 { background-color: rgba(255, 112, 67, .6); } .deeporange-500a6 { background-color: rgba(255, 87, 34, .6); } .deeporange-600a6 { background-color: rgba(244, 81, 30, .6); } .deeporange-700a6 { background-color: rgba(230, 74, 25, .6); }
.deeporange-800a6 { background-color: rgba(216, 67, 21, .6); } .deeporange-900a6 { background-color: rgba(191, 54, 12, .6); } .deeporange-A100a6 { background-color: rgba(255, 158, 128, .6); } .deeporange-A200a6 { background-color: rgba(255, 110, 64, .6); }
.deeporange-A400a6 { background-color: rgba(255, 61, 0, .6); } .deeporange-A700a6 { background-color: rgba(221, 44, 0, .6); }
.brown-50a6 { background-color: rgba(239, 235, 233, .6); } .brown-100a6 { background-color: rgba(215, 204, 200, .6); } .brown-200a6 { background-color: rgba(188, 170, 164, .6); } .brown-300a6 { background-color: rgba(161, 136, 127, .6); }
.brown-400a6 { background-color: rgba(141, 110, 99, .6); } .brown-500a6 { background-color: rgba(121, 85, 72, .6); } .brown-600a6 { background-color: rgba(109, 76, 65, .6); } .brown-700a6 { background-color: rgba(93, 64, 55, .6); }
.brown-800a6 { background-color: rgba(78, 52, 46, .6); } .brown-900a6 { background-color: rgba(62, 39, 35, .6); }
.grey-50a6 { background-color: rgba(250, 250, 250, .6); } .grey-100a6 { background-color: rgba(245, 245, 245, .6); } .grey-200a6 { background-color: rgba(238, 238, 238, .6); } .grey-300a6 { background-color: rgba(224, 224, 224, .6); }
.grey-400a6 { background-color: rgba(189, 189, 189, .6); } .grey-500a6 { background-color: rgba(158, 158, 158, .6); } .grey-600a6 { background-color: rgba(117, 117, 117, .6); } .grey-700a6 { background-color: rgba(97, 97, 97, .6); }
.grey-800a6 { background-color: rgba(66, 66, 66, .6); } .grey-900a6 { background-color: rgba(33, 33, 33, .6); }
.bluegrey-50a6 { background-color: rgba(236, 239, 241, .6); } .bluegrey-100a6 { background-color: rgba(207, 216, 220, .6); } .bluegrey-200a6 { background-color: rgba(176, 190, 197, .6); } .bluegrey-300a6 { background-color: rgba(144, 164, 174, .6); }
.bluegrey-400a6 { background-color: rgba(120, 144, 156, .6); } .bluegrey-500a6 { background-color: rgba(96, 125, 139, .6); } .bluegrey-600a6 { background-color: rgba(84, 110, 122, .6); }
.bluegrey-700a6 { background-color: rgba(69, 90, 100, .6); } .bluegrey-800a6 { background-color: rgba(55, 71, 79, .6); } .bluegrey-900a6 { background-color: rgba(38, 50, 56, .6); }
/*----------------------------------------------------------------------------*/
.red-50a3 { background-color: rgba(255, 235, 238, .3); } .red-100a3 { background-color: rgba(255, 205, 210, .3); } .red-200a3 { background-color: rgba(239, 154, 154, .3); } .red-300a3 { background-color: rgba(229, 115, 115, .3); }
.red-400a3 { background-color: rgba(239, 83, 80, .3); } .red-500a3 { background-color: rgba(244, 67, 54, .3); } .red-600a3 { background-color: rgba(229, 57, 53, .3); } .red-700a3 { background-color: rgba(211, 47, 47, .3); }
.red-800a3 { background-color: rgba(198, 40, 40, .3); } .red-900a3 { background-color: rgba(183, 28, 28, .3); } .red-A100a3 { background-color: rgba(255, 138, 128, .3); } .red-A200a3 { background-color: rgba(255, 82, 82, .3); }
.red-A400a3 { background-color: rgba(255, 23, 68, .3); } .red-A700a3 { background-color: rgba(213, 0, 0, .3); }
.pink-50a3 { background-color: rgba(252, 228, 236, .3); } .pink-100a3 { background-color: rgba(248, 187, 208, .3); } .pink-200a3 { background-color: rgba(244, 143, 177, .3); } .pink-300a3 { background-color: rgba(240, 98, 146, .3); }
.pink-400a3 { background-color: rgba(236, 64, 122, .3); } .pink-500a3 { background-color: rgba(233, 30, 99, .3); } .pink-600a3 { background-color: rgba(216, 27, 96, .3); } .pink-700a3 { background-color: rgba(194, 24, 91, .3); }
.pink-800a3 { background-color: rgba(173, 20, 87, .3); } .pink-900a8 { background-color: rgba(136, 14, 79, .3); } .pink-A100a3 { background-color: rgba(255, 128, 171, .3); } .pink-A200a3 { background-color: rgba(255, 64, 129, .3); }
.pink-A400a3 { background-color: rgba(245, 0, 87, .3); } .pink-A700a3 { background-color: rgba(197, 17, 98, .3); }
.purple-50a3 { background-color: rgba(243, 229, 245, .3); } .purple-100a3 { background-color: rgba(225, 190, 231, .3); } .purple-200a3 { background-color: rgba(206, 147, 216, .3); } .purple-300a3 { background-color: rgba(186, 104, 200, .3); }
.purple-400a3 { background-color: rgba(171, 71, 188, .3); } .purple-500a3 { background-color: rgba(156, 39, 176, .3); } .purple-600a3 { background-color: rgba(142, 36, 170, .3); } .purple-700a3 { background-color: rgba(123, 31, 162, .3); }
.purple-800a3 { background-color: rgba(106, 27, 154, .3); } .purple-900a3 { background-color: rgba(74, 20, 140, .3); } .purple-A100a3 { background-color: rgba(234, 128, 252, .3); } .purple-A200a3 { background-color: rgba(224, 64, 251, .3); }
.purple-A400a3 { background-color: rgba(213, 0, 249, .3); } .purple-A700a3 { background-color: rgba(170, 0, 255, .3); }
.deeppurple-50a3 { background-color: rgba(237, 231, 246, .3); } .deeppurple-100a3 { background-color: rgba(209, 196, 233, .3); } .deeppurple-200a3 { background-color: rgba(179, 157, 219, .3); } .deeppurple-300a3 { background-color: rgba(149, 117, 205, .3); }
.deeppurple-400a3 { background-color: rgba(126, 87, 194, .3); } .deeppurple-500a3 { background-color: rgba(103, 58, 183, .3); } .deeppurple-600a3 { background-color: rgba(94, 53, 177, .3); } .deeppurple-700a3 { background-color: rgba(81, 45, 168, .3); }
.deeppurple-800a3 { background-color: rgba(69, 39, 160, .3); } .deeppurple-900a3 { background-color: rgba(49, 27, 146, .3); } .deeppurple-A100a3 { background-color: rgba(179, 136, 255, .3); } .deeppurple-A200a3 { background-color: rgba(124, 77, 255, .3); }
.deeppurple-A400a3 { background-color: rgba(101, 31, 255, .3); } .deeppurple-A700a3 { background-color: rgba(98, 0, 234, .3); }
.indigo-50a3 { background-color: rgba(232, 234, 246, .3); } .indigo-100a3 { background-color: rgba(197, 202, 233, .3); } .indigo-200a3 { background-color: rgba(159, 168, 218, .3); } .indigo-300a3 { background-color: rgba(121, 134, 203, .3); }
.indigo-400a3 { background-color: rgba(92, 107, 192, .3); } .indigo-500a3 { background-color: rgba(63, 81, 181, .3); } .indigo-600a3 { background-color: rgba(57, 73, 171, .3); } .indigo-700a3 { background-color: rgba(48, 63, 159, .3); }
.indigo-800a3 { background-color: rgba(40, 53, 147, .3); } .indigo-900a3 { background-color: rgba(26, 35, 126, .3); } .indigo-A100a3 { background-color: rgba(140, 158, 255, .3); } .indigo-A200a3 { background-color: rgba(83, 109, 254, .3); }
.indigo-A400a3 { background-color: rgba(61, 90, 254, .3); } .indigo-A700a3 { background-color: rgba(48, 79, 254, .3); }
.blue-50a3 { background-color: rgba(227, 242, 253, .3); } .blue-100a3 { background-color: rgba(187, 222, 251, .3); } .blue-200a3 { background-color: rgba(144, 202, 249, .3); } .blue-300a3 { background-color: rgba(100, 181, 246, .3); }
.blue-400a3 { background-color: rgba(66, 165, 245, .3); } .blue-500a3 { background-color: rgba(33, 150, 243, .3); } .blue-600a3 { background-color: rgba(30, 136, 229, .3); } .blue-700a3 { background-color: rgba(25, 118, 210, .3); }
.blue-800a3 { background-color: rgba(21, 101, 192, .3); } .blue-900a3 { background-color: rgba(13, 71, 161, .3); } .blue-A100a3 { background-color: rgba(130, 177, 255, .3); } .blue-A200a3 { background-color: rgba(68, 138, 255, .3); }
.blue-A400a3 { background-color: rgba(41, 121, 255, .3); } .blue-A700a3 { background-color: rgba(41, 98, 255, .3); }
.lightblue-50a3 { background-color: rgba(225, 245, 254, .3); } .lightblue-100a3 { background-color: rgba(179, 229, 252, .3); } .lightblue-200a3 { background-color: rgba(129, 212, 250, .3); } .lightblue-300a3 { background-color: rgba(79, 195, 247, .3); }
.lightblue-400a3 { background-color: rgba(41, 182, 246, .3); } .lightblue-500a3 { background-color: rgba(3, 169, 244, .3); } .lightblue-600a3 { background-color: rgba(3, 155, 229, .3); } .lightblue-700a3 { background-color: rgba(2, 136, 209, .3); }
.lightblue-800a3 { background-color: rgba(2, 119, 189, .3); } .lightblue-900a3 { background-color: rgba(1, 87, 155, .3); } .lightblue-A100a3 { background-color: rgba(128, 216, 255, .3); } .lightblue-A200a3 { background-color: rgba(64, 196, 255, .3); }
.lightblue-A400a3 { background-color: rgba(0, 176, 255, .3); } .lightblue-A700a3 { background-color: rgba(0, 145, 234, .3); }
.cyan-50a3 { background-color: rgba(224, 247, 250, .3); } .cyan-100a3 { background-color: rgba(178, 235, 242, .3); } .cyan-200a3 { background-color: rgba(128, 222, 234, .3); } .cyan-300a3 { background-color: rgba(77, 208, 225, .3); }
.cyan-400a3 { background-color: rgba(38, 198, 218, .3); } .cyan-500a3 { background-color: rgba(0, 188, 212, .3); } .cyan-600a3 { background-color: rgba(0, 172, 193, .3); } .cyan-700a3 { background-color: rgba(0, 151, 167, .3); }
.cyan-800a3 { background-color: rgba(0, 131, 143, .3); } .cyan-900a3 { background-color: rgba(0, 96, 100, .3); } .cyan-A100a3 { background-color: rgba(132, 255, 255, .3); } .cyan-A200a3 { background-color: rgba(24, 255, 255, .3); }
.cyan-A400a3 { background-color: rgba(0, 229, 255, .3); } .cyan-A700a3 { background-color: rgba(0, 184, 212, .3); }
.teal-50a3 { background-color: rgba(224, 242, 241, .3); } .teal-100a3 { background-color: rgba(178, 223, 219, .3); } .teal-200a3 { background-color: rgba(128, 203, 196, .3); } .teal-300a3 { background-color: rgba(77, 182, 172, .3); }
.teal-400a3 { background-color: rgba(38, 166, 154, .3); } .teal-500a3 { background-color: rgba(0, 150, 136, .3); } .teal-600a3 { background-color: rgba(0, 137, 123, .3); } .teal-700a3 { background-color: rgba(0, 121, 107, .3); }
.teal-800a3 { background-color: rgba(0, 105, 92, .3); } .teal-900a3 { background-color: rgba(0, 77, 64, .3); } .teal-A100a3 { background-color: rgba(167, 255, 235, .3); } .teal-A200a3 { background-color: rgba(100, 255, 218, .3); }
.teal-A400a3 { background-color: rgba(29, 233, 182, .3); } .teal-A700a3 { background-color: rgba(0, 191, 165, .3); }
.green-50a3 { background-color: rgba(232, 245, 233, .3); } .green-100a3 { background-color: rgba(200, 230, 201, .3); } .green-200a3 { background-color: rgba(165, 214, 167, .3); } .green-300a3 { background-color: rgba(129, 199, 132, .3); }
.green-400a3 { background-color: rgba(102, 187, 106, .3); } .green-500a3 { background-color: rgba(76, 175, 80, .3); } .green-600a3 { background-color: rgba(67, 160, 71, .3); } .green-700a3 { background-color: rgba(56, 142, 60, .3); }
.green-800a3 { background-color: rgba(46, 125, 50, .3); } .green-900a3 { background-color: rgba(27, 94, 32, .3); } .green-A100a3 { background-color: rgba(185, 246, 202, .3); } .green-A200a3 { background-color: rgba(105, 240, 174, .3); }
.green-A400a3 { background-color: rgba(0, 230, 118, .3); } .green-A700a3 { background-color: rgba(0, 200, 83, .3); }
.lightgreen-50a3 { background-color: rgba(241, 248, 233, .3); } .lightgreen-100a3 { background-color: rgba(220, 237, 200, .3); } .lightgreen-200a3 { background-color: rgba(197, 225, 165, .3); } .lightgreen-300a3 { background-color: rgba(174, 213, 129, .3); }
.lightgreen-400a3 { background-color: rgba(156, 204, 101, .3); } .lightgreen-500a3 { background-color: rgba(139, 195, 74, .3); } .lightgreen-600a3 { background-color: rgba(124, 179, 66, .3); } .lightgreen-700a3 { background-color: rgba(104, 159, 56, .3); }
.lightgreen-800a3 { background-color: rgba(85, 139, 47, .3); } .lightgreen-900a3 { background-color: rgba(51, 105, 30, .3); } .lightgreen-A100a3 { background-color: rgba(204, 255, 144, .3); }.lightgreen-A200a3 { background-color: rgba(178, 255, 89, .3); }
.lightgreen-A400a3 { background-color: rgba(118, 255, 3, .3); } .lightgreen-A700a3 { background-color: rgba(100, 221, 23, .3); }
.lime-50a3 { background-color: rgba(249, 251, 231, .3); } .lime-100a3 { background-color: rgba(240, 244, 195, .3); } .lime-200a3 { background-color: rgba(230, 238, 156, .3); } .lime-300a3 { background-color: rgba(220, 231, 117, .3); }
.lime-400a3 { background-color: rgba(212, 225, 87, .3); } .lime-500a3 { background-color: rgba(205, 220, 57, .3); } .lime-600a3 { background-color: rgba(192, 202, 51, .3); } .lime-700a3 { background-color: rgba(175, 180, 43, .3); }
.lime-800a3 { background-color: rgba(158, 157, 36, .3); } .lime-900a3 { background-color: rgba(130, 119, 23, .3); } .lime-A100a3 { background-color: rgba(244, 255, 129, .3); } .lime-A200a3 { background-color: rgba(238, 255, 65, .3); }
.lime-A400a3 { background-color: rgba(198, 255, 0, .3); } .lime-A700a3 { background-color: rgba(174, 234, 0, .3); }
.yellow-50a3 { background-color: rgba(255, 253, 231, .3); } .yellow-100a3 { background-color: rgba(255, 249, 196, .3); } .yellow-200a3 { background-color: rgba(255, 245, 157, .3); } .yellow-300a3 { background-color: rgba(255, 241, 118, .3); }
.yellow-400a3 { background-color: rgba(255, 238, 88, .3); } .yellow-500a3 { background-color: rgba(255, 235, 59, .3); } .yellow-600a3 { background-color: rgba(253, 216, 53, .3); } .yellow-700a3 { background-color: rgba(251, 192, 45, .3); }
.yellow-800a3 { background-color: rgba(249, 168, 37, .3); } .yellow-900a3 { background-color: rgba(245, 127, 23, .3); } .yellow-A100a3 { background-color: rgba(255, 255, 141, .3); } .yellow-A200a3 { background-color: rgba(255, 255, 0, .3); }
.yellow-A400a3 { background-color: rgba(255, 234, 0, .3); } .yellow-A700a3 { background-color: rgba(255, 214, 0, .3); }
.amber-50a3 { background-color: rgba(255, 248, 225, .3); } .amber-100a3 { background-color: rgba(255, 236, 179, .3); } .amber-200a3 { background-color: rgba(255, 224, 130, .3); } .amber-300a3 { background-color: rgba(255, 213, 79, .3); }
.amber-400a3 { background-color: rgba(255, 202, 40, .3); } .amber-500a3 { background-color: rgba(255, 193, 7, .3); } .amber-600a3 { background-color: rgba(255, 179, 0, .3); } .amber-700a3 { background-color: rgba(255, 160, 0, .3); }
.amber-800a3 { background-color: rgba(255, 143, 0, .3); } .amber-900a3 { background-color: rgba(255, 111, 0, .3); } .amber-A100a3 { background-color: rgba(255, 229, 127, .3); } .amber-A200a3 { background-color: rgba(255, 215, 64, .8); }
.amber-A400a3 { background-color: rgba(255, 196, 0, .3); } .amber-A700a3 { background-color: rgba(255, 171, 0, .3); }
.orange-50a3 { background-color: rgba(255, 243, 224, .3); } .orange-100a3 { background-color: rgba(255, 224, 178, .3); } .orange-200a3 { background-color: rgba(255, 204, 128, .3); } .orange-300a3 { background-color: rgba(255, 183, 77, .3); }
.orange-400a3 { background-color: rgba(255, 167, 38, .3); } .orange-500a3 { background-color: rgba(255, 152, 0, .3); } .orange-600a3 { background-color: rgba(251, 140, 0, .3); } .orange-700a3 { background-color: rgba(245, 124, 0, .3); }
.orange-800a3 { background-color: rgba(239, 108, 0, .3); } .orange-900a3 { background-color: rgba(230, 81, 0, .3); } .orange-A100a3 { background-color: rgba(255, 209, 128, .3); } .orange-A200a3 { background-color: rgba(255, 171, 64, .3); }
.orange-A400a3 { background-color: rgba(255, 145, 0, .3); } .orange-A700a3 { background-color: rgba(255, 109, 0, .3); }
.deeporange-50a3 { background-color: rgba(251, 233, 231, .3); } .deeporange-100a3 { background-color: rgba(255, 204, 188, .3); } .deeporange-200a3 { background-color: rgba(255, 171, 145, .3); } .deeporange-300a3 { background-color: rgba(255, 138, 101, .3); }
.deeporange-400a3 { background-color: rgba(255, 112, 67, .3); } .deeporange-500a3 { background-color: rgba(255, 87, 34, .3); } .deeporange-600a3 { background-color: rgba(244, 81, 30, .3); } .deeporange-700a3 { background-color: rgba(230, 74, 25, .3); }
.deeporange-800a3 { background-color: rgba(216, 67, 21, .3); } .deeporange-900a3 { background-color: rgba(191, 54, 12, .3); } .deeporange-A100a3 { background-color: rgba(255, 158, 128, .3); } .deeporange-A200a3 { background-color: rgba(255, 110, 64, .3); }
.deeporange-A400a3 { background-color: rgba(255, 61, 0, .3); } .deeporange-A700a3 { background-color: rgba(221, 44, 0, .3); }
.brown-50a3 { background-color: rgba(239, 235, 233, .3); } .brown-100a3 { background-color: rgba(215, 204, 200, .3); } .brown-200a3 { background-color: rgba(188, 170, 164, .3); } .brown-300a3 { background-color: rgba(161, 136, 127, .3); }
.brown-400a3 { background-color: rgba(141, 110, 99, .3); } .brown-500a3 { background-color: rgba(121, 85, 72, .3); } .brown-600a3 { background-color: rgba(109, 76, 65, .3); } .brown-700a3 { background-color: rgba(93, 64, 55, .3); }
.brown-800a3 { background-color: rgba(78, 52, 46, .3); } .brown-900a3 { background-color: rgba(62, 39, 35, .3); }
.grey-50a3 { background-color: rgba(250, 250, 250, .3); } .grey-100a3 { background-color: rgba(245, 245, 245, .3); } .grey-200a3 { background-color: rgba(238, 238, 238, .3); } .grey-300a3 { background-color: rgba(224, 224, 224, .3); }
.grey-400a3 { background-color: rgba(189, 189, 189, .3); } .grey-500a3 { background-color: rgba(158, 158, 158, .3); } .grey-600a3 { background-color: rgba(117, 117, 117, .3); } .grey-700a3 { background-color: rgba(97, 97, 97, .3); }
.grey-800a3 { background-color: rgba(66, 66, 66, .3); } .grey-900a3 { background-color: rgba(33, 33, 33, .3); }
.bluegrey-50a3 { background-color: rgba(236, 239, 241, .3); } .bluegrey-100a3 { background-color: rgba(207, 216, 220, .3); } .bluegrey-200a3 { background-color: rgba(176, 190, 197, .3); } .bluegrey-300a3 { background-color: rgba(144, 164, 174, .3); }
.bluegrey-400a3 { background-color: rgba(120, 144, 156, .3); } .bluegrey-500a3 { background-color: rgba(96, 125, 139, .3); } .bluegrey-600a3 { background-color: rgba(84, 110, 122, .3); }
.bluegrey-700a3 { background-color: rgba(69, 90, 100, .3); } .bluegrey-800a3 { background-color: rgba(55, 71, 79, .3); } .bluegrey-900a3 { background-color: rgba(38, 50, 56, .3); }
/*============================================================================*/
/* size */
/*============================================================================*/
.dsize1 { width: 160px; height: 200px; } .dsize2 { width: 160px; height: 250px; } .dsize3 { width: 160px; height: 300px; } .dsize4 { width: 160px; height: 350px; } .dsize5 { width: 160px; height: 400px; }
.dsize6 { width: 320px; height: 200px; } .dsize7 { width: 320px; height: 250px; } .dsize8 { width: 320px; height: 300px; } .dsize9 { width: 320px; height: 350px; } .dsize10 { width: 320px; height: 400px; }
.dsize11 { width: 480px; height: 200px; } .dsize12 { width: 480px; height: 250px; } .dsize13 { width: 480px; height: 300px; } .dsize14 { width: 480px; height: 350px; } .dsize15 { width: 480px; height: 400px; }
.dsize16 { width: 640px; height: 200px; } .dsize17 { width: 640px; height: 250px; } .dsize18 { width: 640px; height: 300px; } .dsize19 { width: 640px; height: 350px; } .dsize20 { width: 640px; height: 400px; }
.dsize21 { width: 720px; height: 200px; } .dsize22 { width: 720px; height: 250px; } .dsize23 { width: 720px; height: 300px; } .dsize24 { width: 720px; height: 350px; } .dsize25 { width: 720px; height: 400px; }
.dsize26 { width: 860px; height: 200px; } .dsize27 { width: 860px; height: 250px; } .dsize28 { width: 860px; height: 300px; } .dsize29 { width: 860px; height: 350px; } .dsize30 { width: 860px; height: 400px; }
.dsize31 { width: 1024px; height: 200px; } .dsize32 { width: 1024px; height: 250px; } .dsize33 { width: 1024px; height: 300px; } .dsize34 { width: 1024px; height: 350px; } .dsize35 { width: 1024px; height: 400px; }
.dsize36 { width: 1280px; height: 200px; } .dsize37 { width: 1280px; height: 250px; } .dsize38 { width: 1280px; height: 300px; } .dsize39 { width: 1280px; height: 350px; } .dsize40 { width: 1280px; height: 400px; }
.dsize41 { width: 1440px; height: 200px; } .dsize42 { width: 1440px; height: 250px; } .dsize43 { width: 1440px; height: 300px; } .dsize44 { width: 1440px; height: 350px; } .dsize45 { width: 1440px; height: 400px; }
.dsize46 { width: 1680px; height: 200px; } .dsize47 { width: 1680px; height: 250px; } .dsize48 { width: 1680px; height: 300px; } .dsize49 { width: 1680px; height: 350px; } .dsize50 { width: 1680px; height: 400px; }
/*----------------------------------------------------------------------------*/
/*============================================================================*/
/* lazyLoader */
/*============================================================================*/
.jPluginLazyLoader { clear: both; box-sizing: content-box!important; position: relative!important; padding: 20px 0; }
.jPluginLazyLoader.jPluginLazyHasMore { padding-bottom: 104px!important; }
.jPluginLazyLoader .jPluginLazyItem { margin-bottom: 20px; }
.jPluginLazyLoader .jPluginLazyItem:not(.jPluginLazyAlreadyLoaded) { visibility: hidden; }
.jPluginLazyLoader.jPluginLazyAlreadyLoaded { padding: 20px 0; background: none; }
/*loading gif*/
.jPluginLazyLoader.jPluginLazyIsLoading { background: url("../../spinner-amber.gif") no-repeat center bottom; }
.jPluginLazyLoader.jPluginLazyFirst { background: url("../../spinner-amber.gif") no-repeat center 50px; }
.jPluginLazyLoader.jPluginLazyAlreadyLoaded .jPluginLazyItem { visibility: visible; }
/*Item Style*/
/*如果是 按鈕模式*/
.jPluginLazyIfClickMode { clear: both; box-sizing: border-box; z-index: 1; display: none; position: absolute; left: 0; right: 0; bottom: 0; /*bottom: -100px;*/ padding: 30px 0; width: 100%; height: 100px; text-align: center; }
.jPluginLazyIfClickMode a.jPluginLazyCMBtn {
display: inline-block; padding: 7px 15px 5px 15px; line-height: 30px; text-align: center; white-space: nowrap; vertical-align: middle;
border: 1px solid rgba(128, 128, 128, .35);
border-radius: 5px;
color: #fff;
background-color: rgba(128, 128, 128, .65);
}
.jPluginLazyIfClickMode a.jPluginLazyCMBtn strong { font-size: 20px; }
.jPluginLazyIfClickMode a.jPluginLazyCMBtn:active,
.jPluginLazyIfClickMode a.jPluginLazyCMBtn:focus,
.jPluginLazyIfClickMode a.jPluginLazyCMBtn:hover {
border: 1px solid rgba(128, 128, 128, .35);
color: #333;
background-color: rgba(128, 128, 128, .95);
}
@media screen and (min-width: 1px) and (max-width: 1279px) {
.jPluginLazyIfClickMode { bottom: -20px; padding: 50px 0; }
}
/*============================================================================*/
/* transition */
/*============================================================================*/
.antt-li03 { transition: all .3s linear; } .antt-li03:hover { transition: all .3s linear; }
.antt-li05 { transition: all .5s linear; } .antt-li05:hover { transition: all .5s linear; }
.antt-e03 { transition: all .3s ease; } .antt-e03:hover { transition: all .3s ease; }
.antt-e05 { transition: all .5s ease; } .antt-e05:hover { transition: all .5s ease; }
.antt-ei03 { transition: all .3s ease-in; } .antt-ei03:hover { transition: all .3s ease-in; }
.antt-ei05 { transition: all .5s ease-in; } .antt-ei05:hover { transition: all .5s ease-in; }
.antt-eo03 { transition: all .3s ease-out; } .antt-eo03:hover { transition: all .3s ease-out; }
.antt-eo05 { transition: all .5s ease-out; } .antt-eo05:hover { transition: all .5s ease-out; }
.antt-eio03 { transition: all .3s ease-in-out; } .antt-eio03:hover { transition: all .3s ease-in-out; }
.antt-eio05 { transition: all .5s ease-in-out; } .antt-eio05:hover { transition: all .5s ease-in-out; }
/*============================================================================*/
/* simple animation */
/*============================================================================*/
/*
-webkit-animation: 1.5s 速度 .5s 間隔 normal ease infinite jellen-eraser-x0-x5; animation: 1.5s 速度 .5s 間隔 normal ease infinite jellen-eraser-x0-x5;
-webkit-animation: 1s .1s normal ease infinite jellen-x-x0-x5; animation: 1s .1s normal ease infinite jellen-x-x0-x5;
-webkit-animation: 1s .1s normal ease forwards jellen-x-x0-x5; animation: 1s .1s normal ease forwards jellen-x-x0-x5;
*/
@keyframes jellen-opacity-100-0 {
0% { opacity: 1; }
100% { opacity: 0; }
}
@keyframes jellen-opacity-0-100 {
0% { opacity: 0; }
100% { opacity: 1; }
}
/*一直旋轉*/
@keyframes jellen-spin-0-360 {
from { transform: rotate(0deg); }
to { transform: rotate(360deg); }
}
@keyframes jellen-spin-0-360-rev {
from { transform: rotate(0deg); }
to { transform: rotate(-360deg); }
}
/*水平 前後 擦子*/
@keyframes jellen-x-x0-x5 {
0% { transform: translateX(0px); }
50% { transform: translateX(5px); }
100% { transform: translateX(0px); }
}
@keyframes jellen-x-x0-x5-rev {
0% { transform: translateX(0px); }
50% { transform: translateX(-5px); }
100% { transform: translateX(0px); }
}
@keyframes jellen-x-x0-x3 {
0% { transform: translateX(0px); }
50% { transform: translateX(3px); }
100% { transform: translateX(0px); }
}
@keyframes jellen-x-x0-x3-rev {
0% { transform: translateX(0px); }
50% { transform: translateX(-3px); }
100% { transform: translateX(0px); }
}
/*水平 上下 有子選項*/
@keyframes jellen-y-y0-y5 {
0% { transform: translateY(0px); }
50% { transform: translateY(5px); }
100% { transform: translateY(0px); }
}
@keyframes jellen-y-y0-y5-rev {
0% { transform: translateY(0px); }
50% { transform: translateY(-5px); }
100% { transform: translateY(0px); }
}
@keyframes jellen-y-y0-y3 {
0% { transform: translateY(0px); }
50% { transform: translateY(3px); }
100% { transform: translateY(0px); }
}
@keyframes jellen-y-y0-y3-rev {
0% { transform: translateY(0px); }
50% { transform: translateY(-3px); }
100% { transform: translateY(0px); }
}
/*放大縮小*/
@keyframes jellen-scale03 { 0% { transform: scale(1); } 50% { transform: scale(1.03); } 100% { transform: scale(1); } }
@keyframes jellen-scale05 { 0% { transform: scale(1); } 50% { transform: scale(1.05); } 100% { transform: scale(1); } }
@keyframes jellen-scale08 { 0% { transform: scale(1); } 50% { transform: scale(1.08); } 100% { transform: scale(1); } }
@keyframes jellen-scale12 { 0% { transform: scale(1); } 50% { transform: scale(1.12); } 100% { transform: scale(1); } }
@keyframes jellen-scale15 { 0% { transform: scale(1); } 50% { transform: scale(1.15); } 100% { transform: scale(1); } }
/*放大*/ /*transition: transform 0.25s cubic-bezier(1.03,1.03,1.03,1.03);*/
@keyframes jellen-scale101 { transform: scale(1.01); }
@keyframes jellen-scale102 { transform: scale(1.02); }
@keyframes jellen-scale103 { transform: scale(1.03); }
@keyframes jellen-scale104 { transform: scale(1.04); }
@keyframes jellen-scale105 { transform: scale(1.05); }
@keyframes jellen-scale106 { transform: scale(1.06); }
@keyframes jellen-scale107 { transform: scale(1.07); }
@keyframes jellen-scale108 { transform: scale(1.08); }
@keyframes jellen-scale109 { transform: scale(1.09); }
@keyframes jellen-scale110 { transform: scale(1.10); }
@keyframes jellen-scale120 { transform: scale(1.20); }
/*波*/
/* width: 3px; height: 3px; border-radius: 100%; background-color: rgba(255, 255, 255, .85); -webkit-animation: 1s .5s linear infinite jellen-white-1px-8px; animation: 1s .5s linear infinite jellen-white-1px-8px; */
@keyframes jellen-circle-white-1px-8px { /*白*/
0% { box-shadow: 0 0 0 0 rgba(255, 255, 255, .3), 0 0 0 1px rgba(255, 255, 255, .3), 0 0 0 3px rgba(255, 255, 255, .3), 0 0 0 5px rgba(255, 255, 255, .3); }
100% { box-shadow: 0 0 0 1em rgba(255, 255, 255, .3), 0 0 0 3px rgba(255, 255, 255, .3), 0 0 0 5px rgba(255, 255, 255, .3), 0 0 0 8px rgba(255, 255, 255, 0); }
}
@keyframes jellen-circle-blue-1px-8px { /*藍*/
0% { box-shadow: 0 0 0 0 rgba(1, 140, 190, .3), 0 0 0 1px rgba(1, 140, 190, .3), 0 0 0 3px rgba(1, 140, 190, .3), 0 0 0 5px rgba(1, 140, 190, .3); }
100% { box-shadow: 0 0 0 1em rgba(1, 140, 190, .3), 0 0 0 3px rgba(1, 140, 190, .3), 0 0 0 5px rgba(1, 140, 190, .3), 0 0 0 8px rgba(1, 140, 190, 0); }
}
@keyframes jellen-circle-green-1px-8px { /*綠*/
0% { box-shadow: 0 0 0 0 rgba(120, 200, 35, .3), 0 0 0 1px rgba(120, 200, 35, .3), 0 0 0 3px rgba(120, 200, 35, .3), 0 0 0 5px rgba(120, 200, 35, .3); }
100% { box-shadow: 0 0 0 1em rgba(120, 200, 35, .3), 0 0 0 3px rgba(120, 200, 35, .3), 0 0 0 5px rgba(120, 200, 35, .3), 0 0 0 8px rgba(120, 200, 35, 0); }
}
@keyframes jellen-circle-red-1px-8px { /*紅*/
0% { box-shadow: 0 0 0 0 rgba(255, 0, 0, .3), 0 0 0 1px rgba(255, 0, 0, .3), 0 0 0 3px rgba(255, 0, 0, .3), 0 0 0 5px rgba(255, 0, 0, .3); }
100% { box-shadow: 0 0 0 1em rgba(255, 0, 0, .3), 0 0 0 3px rgba(255, 0, 0, .3), 0 0 0 5px rgba(255, 0, 0, .3), 0 0 0 8px rgba(255, 0, 0, 0); }
}
/*============================================================================*/
/* pure css tooltips */
/*============================================================================*/
.umetips { display: inline-block; position: relative; }
.umetips:before, .umetips:after {
z-index: 888; position: absolute;
border-radius: 6px;
pointer-events: none;
-webkit-transition: 0.3s ease;
-moz-transition: 0.3s ease;
opacity: 0;
}
.umetips:hover:before, .umetips:hover:after { opacity: 1; }
.umetips:before {
z-index: 889; position: absolute;
content: '';
border: 6px solid transparent;
background: transparent;
}
.umetips:after {
padding: 8px 10px;
line-height: 12px;
white-space: nowrap;
font-size: 12px !important;
font-weight: normal !important;
border: 1px solid rgba(255, 255, 255, 1);
/*text-shadow: 0 -1px 0px #46bee1;*/
background: #ffffff;
background-color: rgba(255, 255, 255, .85);
/*box-shadow: 0 0 18px rgba(70, 190, 225,, 0.3);*/
content: attr(data-umetips);
}
.umetips.bgb:after {
border: 1px solid rgba(0, 0, 0, .85);
box-shadow: 0 0 3px 1px rgba(0, 0, 0, .15);
color: rgba(255, 255, 255, .85);
background: #000;
background-color: rgba(0, 0, 0, .85);
}
.umetips--top:before { border-top-color: rgba(255, 255, 255, 1); }
.umetips--bottom:before { border-bottom-color: rgba(255, 255, 255, 1); }
.umetips--left:before { border-left-color: rgba(255, 255, 255, 1); }
.umetips--right:before { border-right-color: rgba(255, 255, 255, 1); }
.umetips--top.bgb:before { border-top-color: rgba(0, 0, 0, 1); }
.umetips--bottom.bgb:before { border-bottom-color: rgba(0, 0, 0, 1); }
.umetips--left.bgb:before { border-left-color: rgba(0, 0, 0, 1); }
.umetips--right.bgb:before { border-right-color: rgba(0, 0, 0, 1); }
.umetips--top:before { margin-bottom: -11px; }
.umetips--top:after { margin-left: -18px; }
.umetips--top:before, .umetips--top:after { bottom: 100%; left: 50%; }
.umetips--top:hover:before, .umetips--top:hover:after {
-webkit-transform: translateY(-8px);
-moz-transform: translateY(-8px);
transform: translateY(-8px);
}
.umetips--bottom:before { margin-top: -11px; }
.umetips--bottom:after { margin-left: -18px; }
.umetips--bottom:before, .umetips--bottom:after { top: 100%; left: 50%; }
.umetips--bottom:hover:before, .umetips--bottom:hover:after {
-webkit-transform: translateY(8px);
-moz-transform: translateY(8px);
transform: translateY(8px);
}
.umetips--right:before { margin-left: -11px; margin-bottom: -6px; }
.umetips--right:after { margin-bottom: -14px; }
.umetips--right:before, .umetips--right:after { left: 100%; bottom: 50%; }
.umetips--right:hover:before, .umetips--right:hover:after {
-webkit-transform: translateX(8px);
-moz-transform: translateX(8px);
transform: translateX(8px);
}
.umetips--left:before { margin-right: -11px; margin-bottom: -6px; }
.umetips--left:after { margin-bottom: -14px; }
.umetips--left:before, .umetips--left:after { right: 100%; bottom: 50%; }
.umetips--left:hover:before, .umetips--left:hover:after {
-webkit-transform: translateX(-8px);
-moz-transform: translateX(-8px);
transform: translateX(-8px);
}
.umetips--always:after, .umetips--always:before { opacity: 1; }
.umetips--always.umetips--top:after, .umetips--always.umetips--top:before {
-webkit-transform: translateY(-8px);
-moz-transform: translateY(-8px);
transform: translateY(-8px);
}
.umetips--always.umetips--bottom:after, .umetips--always.umetips--bottom:before {
-webkit-transform: translateY(8px);
-moz-transform: translateY(8px);
transform: translateY(8px);
}
.umetips--always.umetips--left:after, .umetips--always.umetips--left:before {
-webkit-transform: translateX(-8px);
-moz-transform: translateX(-8px);
transform: translateX(-8px);
}
.umetips--always.umetips--right:after, .umetips--always.umetips--right:before {
-webkit-transform: translateX(8px);
-moz-transform: translateX(8px);
transform: translateX(8px);
}
.umetips--error:after { color: #ff0000; text-shadow: 0 -1px 0px #ff0000; }
/* arrow
.umetips--error.umetips--top:before { border-top-color: #46bee1; }
.umetips--error.umetips--bottom:before { border-bottom-color: #46bee1; }
.umetips--error.umetips--left:before { border-left-color: #46bee1; }
.umetips--error.umetips--right:before { border-right-color: #46bee1; }
*/
.umetips--warning:after { color: #000000; text-shadow: 0 -1px 0px #000000; }
/* arrow
.umetips--warning.umetips--top:before { border-top-color: #46bee1; }
.umetips--warning.umetips--bottom:before { border-bottom-color: #46bee1; }
.umetips--warning.umetips--left:before { border-left-color: #46bee1; }
.umetips--warning.umetips--right:before { border-right-color: #46bee1; }
*/
.umetips--info:after { color: #19A0E6; text-shadow: 0 -1px 0px #19A0E6; }
/* arrow
.umetips--info.umetips--top:before { border-top-color: #46bee1; }
.umetips--info.umetips--bottom:before { border-bottom-color: #46bee1; }
.umetips--info.umetips--left:before { border-left-color: #46bee1; }
.umetips--info.umetips--right:before { border-right-color: #46bee1; }
*/
.umetips--success:after { color: #87C323; text-shadow: 0 -1px 0px #87C323; }
/* arrow
.umetips--success.umetips--top:before { border-top-color: #46bee1; }
.umetips--success.umetips--bottom:before { border-bottom-color: #46bee1; }
.umetips--success.umetips--left:before { border-left-color: #46bee1; }
.umetips--success.umetips--right:before { border-right-color: #46bee1; }
*/
/*============================================================================*/
/* */
/*============================================================================*/