.tboxminorContent { padding: 10px; background: RGB(127,127,127); color: white; /*border-radius: 10px;*/ border-radius: 0px 10px 10px 10px; line-height: 1.2; } .tboxminorResponse { padding: 10px; background: yellow; color: black; /*border-radius: 10px;*/ border-radius: 0px 10px 10px 10px; line-height: 1.2; } .prev { /*background-color: #f1f1f1;*/ background-color: lightblue; color: black; } .next { background-color: #04AA6D; color: white; } .close { background-color: lightcoral; color: white; } .youtube { background-color: lightpink; color: white; } .round { border-radius: 50%; /* background-color: #FFFF00; */ } .roundyoutube { border-radius: 80%; } /*-- 星評--*/ .stars a { display: inline-block; padding-right: 4px; text-decoration: none; margin: 0; } .stars a:after { position: relative; font-size: 18px; font-family: 'FontAwesome', serif; display: block; content: "\f005"; color: #9e9e9e; } .stars a:hover ~ a:after { color: #9e9e9e !important; } spanstar { font-size: 0; } spanstar.active a.active ~ a:after { color: #9e9e9e; } spanstar:hover a:after { color: blue !important; } spanstar.active a:after, .stars a.active:after { color: blue; } .scrollcomment { /*background-color: lightblue;*/ height: 600px; /*overflow-x: scroll;*/ overflow-y: scroll; } .embedScoll { background-color: lightblue; height: 400px; width: 200px; overflow-x: scroll; overflow-y: scroll; } .white-space-pre-wrap { white-space: pre-wrap; } .big { width: 100vw; height: 100vh; background: rgba(0, 0, 0, .6); position: fixed; top: 0; left: 0; z-index: 10000; display: none; } .big_img { width: auto; height: auto; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 2; } .embedScoll { background-color: lightblue; height: 400px; width: 200px; overflow-x: scroll; overflow-y: scroll; } /*--------------------------------------------------------------------------*/ #bgQuoteToExpet { /*padding-top: 50px; padding-bottom: 50px; padding-left: 50px; padding-right: 50px;*/ position: fixed; left: 0; top: 0; height: 100%; width: 100%; display: flex; /* 水平置中 */ justify-content: center; /* 垂直置中 */ align-items: center; /*vertical-align: middle;*/ background: rgba(0, 0, 0, .4); z-index: 10001; /*background-color: lightblue;*/ overflow-x: scroll; overflow-y: scroll; } .preload_higher { margin: 0; position: absolute; top: 20%; left: 50%; margin-right: -50%; transform: translate(-50%, -50%); display: none; z-index: 100000; } .popupdialog { width: 220px; height: 50px; border-radius: 20px; background: #454545; font-size: 16px; font-family: 'Global Monospace'; font-weight: bold; text-align: center; line-height: 50px; position: fixed; left: calc(50% - 110px); top: calc(50% - 25px); color: #fff; z-index: 10000; } .preload { margin: 0; position: absolute; top: 50%; left: 50%; margin-right: -50%; transform: translate(-50%, -50%); display: none; } #bgExpetQuote { /*padding-top: 50px; padding-bottom: 50px; padding-left: 50px; padding-right: 50px;*/ position: fixed; left: 0; top: 0; height: 100%; width: 100%; display: flex; /* 水平置中 */ justify-content: center; /* 垂直置中 */ align-items: center; /*vertical-align: middle;*/ background: rgba(0, 0, 0, .4); z-index: 10001; /*background-color: lightblue;*/ overflow-x: scroll; overflow-y: scroll; } .scrollex { /*background-color: lightblue;*/ height: 100px; /*overflow-x: scroll;*/ overflow-y: scroll; } /*---------------------------------youtube-------------------------------*/ #bgPickImg { /*padding-top: 50px; padding-bottom: 50px; padding-left: 50px; padding-right: 50px;*/ position: fixed; left: 0; top: 0; height: 100%; width: 100%; display: flex; /* 水平置中 */ justify-content: center; /* 垂直置中 */ align-items: center; /*vertical-align: middle;*/ background: rgba(0, 0, 0, .4); z-index: 998; /*background-color: lightblue;*/ overflow-x: scroll; overflow-y: scroll; } .video-container { position: relative; padding-bottom: 56.25%; padding-top: 30px; height: 0; overflow: hidden; } .video-container iframe, .video-container object, .video-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 0 none; } #alertBigShow { /* margin: 50px 50px 50px 50px; */ text-align: center; padding-top: 1%; padding-bottom: 1%; padding-left: 1%; padding-right: 1%; vertical-align: middle; /* 水平置中 */ /*display: flex; justify-content: center;*/ /* 垂直置中 */ align-content: center; flex-wrap: wrap; width: 95%; /*height: 700px;*/ background: #FFF; border-radius: 3px; box-shadow: 2px 2px rgba(0, 0, 0, .3); z-index: 999; } #alertBigShow p { font-size: 1.4em; margin-bottom: 20px; } #alertBigShow #ok { padding: 5px 20px; font-size: 1em; } #alertBoxYoutube { margin: 200px auto 0; text-align: center; padding-top: 25px; width: 400px; height: 400px; background: #FFF; border-radius: 3px; box-shadow: 2px 2px rgba(0, 0, 0, .3); z-index: 999; } #alertBoxYoutube p { font-size: 1.4em; margin-bottom: 20px; } #alertBoxYoutube #ok { padding: 5px 20px; font-size: 1em; } #alertBoxYoutubeEdit { margin: 200px auto 0; text-align: center; padding-top: 25px; width: 400px; height: 400px; background: #FFF; border-radius: 3px; box-shadow: 2px 2px rgba(0, 0, 0, .3); z-index: 999; } #alertBoxYoutubeEdit p { font-size: 1.4em; margin-bottom: 20px; } #alertBoxYoutubeEdit #ok { padding: 5px 20px; font-size: 1em; } .youtube { background-color: lightpink; color: white; } .round { border-radius: 50%; } .roundyoutube { border-radius: 80%; } /*----------------------------img-box-----------------------*/ img { vertical-align: middle; display: block; } .ImgScroll { background-color: lightblue; overflow-x: scroll; overflow-y: scroll; } .img-box { margin: 10px; display: inline-block; /*vertical-align: middle; display: block;*/ position: relative; } .myimage { width: 120px; height: 120px; } .del-icon-big { /*margin: 30px 0px 0px 0px;*/ position: absolute; width: 30px; height: 30px; border: 1px solid red; border-radius: 50%; top: -26px; right: -30px; transform: rotate(45deg); } .del-icon-big::before { display: block; position: absolute; content: ""; width: 20px; height: 4px; background-color: red; top: 50%; left: 50%; transform: translate3d(-50%, -50%, 0); } .del-icon-big::after { display: block; position: absolute; content: ""; width: 4px; height: 20px; background-color: red; top: 50%; left: 50%; transform: translate3d(-50%, -50%, 0); } .del-icon { position: absolute; width: 15px; height: 15px; border: 1px solid red; border-radius: 50%; top: -13px; right: -15px; transform: rotate(45deg); } .del-icon::before { display: block; position: absolute; content: ""; width: 10px; height: 2px; background-color: red; top: 50%; left: 50%; transform: translate3d(-50%, -50%, 0); } .del-icon::after { display: block; position: absolute; content: ""; width: 2px; height: 10px; background-color: red; top: 50%; left: 50%; transform: translate3d(-50%, -50%, 0); } /*圖片icon顯示圓形,靠近時放大。 */ .PopupDialog { width: 220px; height: 50px; border-radius: 20px; background: #454545; font-size: 16px; font-family: 'Global Monospace'; font-weight: bold; text-align: center; line-height: 50px; position: fixed; left: calc(50% - 110px); top: calc(50% - 25px); color: #fff; } #bgAskExpetJoin { /*padding-top: 50px; padding-bottom: 50px; padding-left: 50px; padding-right: 50px;*/ position: fixed; left: 0; top: 0; height: 100%; width: 100%; display: flex; /* 水平置中 */ justify-content: center; /* 垂直置中 */ align-items: center; /*vertical-align: middle;*/ background: rgba(0, 0, 0, .4); z-index: 10001; /*background-color: lightblue;*/ overflow-x: scroll; overflow-y: scroll; } .circleImg { border-radius: 50%; width: 200px; height: 200px; } .picbig { overflow: hidden; } .picbig img { transform: scale(1,1); /*transition: all 1s ease-out;*/ transition: .5s; } .picbig img:hover { transform: scale(1.2,1.2); }