|
|
@@ -0,0 +1,803 @@
|
|
|
+@charset "UTF-8";
|
|
|
+* {
|
|
|
+ margin: 0;
|
|
|
+ padding: 0;
|
|
|
+ -webkit-box-sizing: border-box;
|
|
|
+ box-sizing: border-box;
|
|
|
+}
|
|
|
+
|
|
|
+@font-face {
|
|
|
+ font-family: 追奇手寫體;
|
|
|
+ src: url(./drechifont-proportional.ttf);
|
|
|
+ font-weight: 900;
|
|
|
+}
|
|
|
+
|
|
|
+body {
|
|
|
+ height: 6000px;
|
|
|
+}
|
|
|
+
|
|
|
+body .title {
|
|
|
+ font-weight: bolder;
|
|
|
+ padding: 15px;
|
|
|
+ font-family: "Times New Roman", Times, serif;
|
|
|
+ font-size: 36px;
|
|
|
+ color: #414854;
|
|
|
+ text-align: center;
|
|
|
+}
|
|
|
+
|
|
|
+@media screen and (max-width: 1024px) {
|
|
|
+ body .title {
|
|
|
+ font-size: 48px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media screen and (max-width: 767px) {
|
|
|
+ body .title {
|
|
|
+ font-size: 34px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+body .btn {
|
|
|
+ text-align: center;
|
|
|
+ margin-top: 20px;
|
|
|
+}
|
|
|
+
|
|
|
+body .btn-main {
|
|
|
+ -webkit-box-shadow: 0 10px 9px rgba(0, 0, 0, 0.5);
|
|
|
+ box-shadow: 0 10px 9px rgba(0, 0, 0, 0.5);
|
|
|
+ border: none;
|
|
|
+ padding: 15px;
|
|
|
+ background: #404854;
|
|
|
+ color: #fff;
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: 600;
|
|
|
+ width: 280px;
|
|
|
+ border-radius: 30px;
|
|
|
+ -webkit-transition: 0.3s;
|
|
|
+ transition: 0.3s;
|
|
|
+ margin-top: 50px;
|
|
|
+}
|
|
|
+
|
|
|
+body .btn-main:hover {
|
|
|
+ background-color: #927368;
|
|
|
+ width: 285px;
|
|
|
+ font-size: 17px;
|
|
|
+}
|
|
|
+
|
|
|
+@media screen and (max-width: 1024px) {
|
|
|
+ body .btn-main {
|
|
|
+ font-size: 20px;
|
|
|
+ padding: 20px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.navigation {
|
|
|
+ width: auto;
|
|
|
+ height: 60px;
|
|
|
+ -webkit-box-shadow: 0 5px 9px rgba(0, 0, 0, 0.3);
|
|
|
+ box-shadow: 0 5px 9px rgba(0, 0, 0, 0.3);
|
|
|
+ position: relative;
|
|
|
+ z-index: 5;
|
|
|
+}
|
|
|
+
|
|
|
+.navigation .logo {
|
|
|
+ padding: 10px;
|
|
|
+ margin-bottom: 5px;
|
|
|
+}
|
|
|
+
|
|
|
+.navigation .logo img {
|
|
|
+ width: 128px;
|
|
|
+}
|
|
|
+
|
|
|
+.navigation #menu-btn1 {
|
|
|
+ position: absolute;
|
|
|
+ right: 40px;
|
|
|
+ top: 15px;
|
|
|
+ width: 32px;
|
|
|
+ height: 32px;
|
|
|
+ z-index: 6;
|
|
|
+}
|
|
|
+
|
|
|
+#banner-box {
|
|
|
+ height: 45vh;
|
|
|
+}
|
|
|
+
|
|
|
+@media screen and (max-width: 767px) {
|
|
|
+ #banner-box {
|
|
|
+ height: 50vh;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+#banner-box .banner-slider .banner1,
|
|
|
+#banner-box .banner-slider .banner2,
|
|
|
+#banner-box .banner-slider .banner3 {
|
|
|
+ width: 100vw;
|
|
|
+ height: 50vh;
|
|
|
+ background-size: contain;
|
|
|
+ background-repeat: no-repeat;
|
|
|
+}
|
|
|
+
|
|
|
+@media screen and (max-width: 767px) {
|
|
|
+ #banner-box .banner-slider .banner1,
|
|
|
+ #banner-box .banner-slider .banner2,
|
|
|
+ #banner-box .banner-slider .banner3 {
|
|
|
+ height: 50vh;
|
|
|
+ background-size: cover;
|
|
|
+ background-position: 40% 50%;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media screen and (max-width: 1024px) {
|
|
|
+ #banner-box .banner-slider .banner1,
|
|
|
+ #banner-box .banner-slider .banner2,
|
|
|
+ #banner-box .banner-slider .banner3 {
|
|
|
+ height: 45vh;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+#banner-box .banner-slider .banner1 h1,
|
|
|
+#banner-box .banner-slider .banner2 h1,
|
|
|
+#banner-box .banner-slider .banner3 h1 {
|
|
|
+ line-height: 40vh;
|
|
|
+ text-align: center;
|
|
|
+ padding: 15px;
|
|
|
+ color: #fff;
|
|
|
+ font-family: 追奇手寫體;
|
|
|
+ font-size: 72px;
|
|
|
+}
|
|
|
+
|
|
|
+#banner-box .banner-slider .banner1 {
|
|
|
+ background-image: url(./img/001.jpg);
|
|
|
+}
|
|
|
+
|
|
|
+#banner-box .banner-slider .banner2 {
|
|
|
+ background-image: url(./img/002.jpg);
|
|
|
+}
|
|
|
+
|
|
|
+#banner-box .banner-slider .banner3 {
|
|
|
+ background-image: url(./img/003.jpg);
|
|
|
+}
|
|
|
+
|
|
|
+#content1 {
|
|
|
+ margin-top: 100px;
|
|
|
+ text-align: center;
|
|
|
+}
|
|
|
+
|
|
|
+#content1 .title {
|
|
|
+ margin: 30px 0px;
|
|
|
+ font-family: "Times New Roman", Times, serif;
|
|
|
+}
|
|
|
+
|
|
|
+#content1 .text {
|
|
|
+ position: relative;
|
|
|
+}
|
|
|
+
|
|
|
+#content1 .text .text2 {
|
|
|
+ position: absolute;
|
|
|
+ top: 15vw;
|
|
|
+ left: 20vw;
|
|
|
+ z-index: 1;
|
|
|
+}
|
|
|
+
|
|
|
+@media screen and (max-width: 1024px) {
|
|
|
+ #content1 .text .text2 {
|
|
|
+ width: 60vw;
|
|
|
+ height: 30vw;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media screen and (max-width: 767px) {
|
|
|
+ #content1 .text .text2 {
|
|
|
+ width: 80vw;
|
|
|
+ left: 10vw;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+#content1 .text .text2 h2 {
|
|
|
+ line-height: 1.5;
|
|
|
+ color: #fff;
|
|
|
+ text-align-last: left;
|
|
|
+ font-size: 20px;
|
|
|
+ letter-spacing: 5px;
|
|
|
+}
|
|
|
+
|
|
|
+@media screen and (max-width: 1024px) {
|
|
|
+ #content1 .text .text2 h2 {
|
|
|
+ font-size: 32px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media screen and (max-width: 767px) {
|
|
|
+ #content1 .text .text2 h2 {
|
|
|
+ font-size: 24px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+#content1 img {
|
|
|
+ margin: 15px auto;
|
|
|
+ width: 70vw;
|
|
|
+ height: 30vh;
|
|
|
+ -o-object-fit: cover;
|
|
|
+ object-fit: cover;
|
|
|
+ -webkit-filter: brightness(70%);
|
|
|
+ filter: brightness(70%);
|
|
|
+}
|
|
|
+
|
|
|
+@media screen and (max-width: 767px) {
|
|
|
+ #content1 img {
|
|
|
+ width: 85vw;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+#service {
|
|
|
+ width: 90vw;
|
|
|
+ margin: 0 auto;
|
|
|
+}
|
|
|
+
|
|
|
+#service h1 {
|
|
|
+ margin: 50px;
|
|
|
+}
|
|
|
+
|
|
|
+@media screen and (max-width: 767px) {
|
|
|
+ #service h1 {
|
|
|
+ font-size: 36px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+#service .service-box {
|
|
|
+ display: -ms-grid;
|
|
|
+ display: grid;
|
|
|
+ -ms-grid-columns: (1fr)[2];
|
|
|
+ grid-template-columns: repeat(2, 1fr);
|
|
|
+ width: 80vw;
|
|
|
+ height: 35vh;
|
|
|
+}
|
|
|
+
|
|
|
+@media screen and (max-width: 767px) {
|
|
|
+ #service .service-box {
|
|
|
+ width: 70vw;
|
|
|
+ height: 40vh;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media screen and (max-width: 1024px) {
|
|
|
+ #service .service-box {
|
|
|
+ width: 70vw;
|
|
|
+ margin: 15px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+#service .service-box .text-left {
|
|
|
+ height: 25vh;
|
|
|
+ width: 30vw;
|
|
|
+ background: #eee;
|
|
|
+ text-align: left;
|
|
|
+}
|
|
|
+
|
|
|
+@media screen and (max-width: 1024px) {
|
|
|
+ #service .service-box .text-left {
|
|
|
+ width: 40vw;
|
|
|
+ height: 32vh;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media screen and (max-width: 767px) {
|
|
|
+ #service .service-box .text-left {
|
|
|
+ text-align: left;
|
|
|
+ width: 50vw;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+#service .service-box .text-left .icon-text {
|
|
|
+ width: 40vw;
|
|
|
+ margin: 15px auto;
|
|
|
+}
|
|
|
+
|
|
|
+@media screen and (max-width: 767px) {
|
|
|
+ #service .service-box .text-left .icon-text {
|
|
|
+ margin: 10px auto;
|
|
|
+ font-size: 15px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media screen and (max-width: 1024px) {
|
|
|
+ #service .service-box .text-left .icon-text {
|
|
|
+ font-size: 24px;
|
|
|
+ margin-left: 40px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+#service .service-box .text-left .icon-text p {
|
|
|
+ font-family: 微軟正黑體;
|
|
|
+ font-weight: bolder;
|
|
|
+ font-size: 15px;
|
|
|
+ line-height: 1.5;
|
|
|
+ text-align: left;
|
|
|
+}
|
|
|
+
|
|
|
+@media screen and (max-width: 1024px) {
|
|
|
+ #service .service-box .text-left .icon-text p {
|
|
|
+ font-size: 22px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media screen and (max-width: 767px) {
|
|
|
+ #service .service-box .text-left .icon-text p {
|
|
|
+ font-size: 14px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+#service .service-box .text-left img {
|
|
|
+ margin-top: 30px;
|
|
|
+ margin-left: 50px;
|
|
|
+ width: 128px;
|
|
|
+ height: 128px;
|
|
|
+}
|
|
|
+
|
|
|
+@media screen and (max-width: 1024px) {
|
|
|
+ #service .service-box .text-left img {
|
|
|
+ width: 128px;
|
|
|
+ height: 128px;
|
|
|
+ margin-top: 10px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media screen and (max-width: 767px) {
|
|
|
+ #service .service-box .text-left img {
|
|
|
+ width: 80px;
|
|
|
+ height: 80px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+#service .service-box .text-right img {
|
|
|
+ -o-object-fit: cover;
|
|
|
+ object-fit: cover;
|
|
|
+}
|
|
|
+
|
|
|
+@media screen and (max-width: 1024px) {
|
|
|
+ #service .service-box .text-right img {
|
|
|
+ height: 32vh;
|
|
|
+ width: 40vw;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media screen and (max-width: 767px) {
|
|
|
+ #service .service-box .text-right img {
|
|
|
+ width: 40vw;
|
|
|
+ height: 32vh;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+#service-process {
|
|
|
+ margin: 0 auto;
|
|
|
+ width: 60vw;
|
|
|
+}
|
|
|
+
|
|
|
+@media screen and (max-width: 767px) {
|
|
|
+ #service-process {
|
|
|
+ width: 80vw;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+#service-process h1 {
|
|
|
+ margin-top: 150px;
|
|
|
+ margin-bottom: 50px;
|
|
|
+}
|
|
|
+
|
|
|
+@media screen and (max-width: 1024px) {
|
|
|
+ #service-process h1 {
|
|
|
+ margin-bottom: 150px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media screen and (max-width: 767px) {
|
|
|
+ #service-process h1 {
|
|
|
+ font-size: 32px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+#service-process .process-box {
|
|
|
+ width: 60vw;
|
|
|
+ display: -ms-grid;
|
|
|
+ display: grid;
|
|
|
+ margin: 10px auto;
|
|
|
+ -ms-grid-columns: (1fr)[2];
|
|
|
+ grid-template-columns: repeat(2, 1fr);
|
|
|
+}
|
|
|
+
|
|
|
+@media screen and (max-width: 767px) {
|
|
|
+ #service-process .process-box {
|
|
|
+ width: 70vw;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+#service-process img {
|
|
|
+ width: 128px;
|
|
|
+ height: 128px;
|
|
|
+ -o-object-fit: cover;
|
|
|
+ object-fit: cover;
|
|
|
+}
|
|
|
+
|
|
|
+@media screen and (max-width: 1024px) {
|
|
|
+ #service-process img {
|
|
|
+ height: 256px;
|
|
|
+ width: 256px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media screen and (max-width: 767px) {
|
|
|
+ #service-process img {
|
|
|
+ width: 128px;
|
|
|
+ height: 128px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+#service-process .process-title {
|
|
|
+ text-align: center;
|
|
|
+ width: 190px;
|
|
|
+}
|
|
|
+
|
|
|
+@media screen and (max-width: 1024px) {
|
|
|
+ #service-process .process-title {
|
|
|
+ width: 30vw;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media screen and (max-width: 1024px) {
|
|
|
+ #service-process .process-title {
|
|
|
+ width: 40vw;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+#service-process .process-title p {
|
|
|
+ font-size: 20px;
|
|
|
+ font-family: 微軟正黑體;
|
|
|
+ font-weight: bolder;
|
|
|
+}
|
|
|
+
|
|
|
+@media screen and (max-width: 1024px) {
|
|
|
+ #service-process .process-title p {
|
|
|
+ width: 40vw;
|
|
|
+ font-size: 38px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media screen and (max-width: 767px) {
|
|
|
+ #service-process .process-title p {
|
|
|
+ font-size: 18px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+#service-process .process-title img {
|
|
|
+ margin: 20px;
|
|
|
+ width: 32px;
|
|
|
+ height: 32px;
|
|
|
+}
|
|
|
+
|
|
|
+@media screen and (max-width: 1024px) {
|
|
|
+ #service-process .process-title img {
|
|
|
+ margin-top: 50px;
|
|
|
+ width: 40px;
|
|
|
+ height: 40px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media screen and (max-width: 767px) {
|
|
|
+ #service-process .process-title img {
|
|
|
+ margin-top: 10px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+#feedback {
|
|
|
+ margin: auto;
|
|
|
+ width: 70vw;
|
|
|
+}
|
|
|
+
|
|
|
+@media screen and (max-width: 767px) {
|
|
|
+ #feedback {
|
|
|
+ width: 90vw;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+#feedback .feedback-slider1 {
|
|
|
+ width: 70vw;
|
|
|
+}
|
|
|
+
|
|
|
+@media screen and (max-width: 767px) {
|
|
|
+ #feedback .feedback-slider1 {
|
|
|
+ width: 90vw;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+#feedback h1 {
|
|
|
+ margin-top: 150px;
|
|
|
+ margin-bottom: 50px;
|
|
|
+}
|
|
|
+
|
|
|
+#feedback .box p {
|
|
|
+ margin: 20px;
|
|
|
+ text-align: center;
|
|
|
+ font-size: 18px;
|
|
|
+ font-weight: 600;
|
|
|
+}
|
|
|
+
|
|
|
+#feedback .box img {
|
|
|
+ width: 390px;
|
|
|
+ height: 195px;
|
|
|
+ -o-object-fit: cover;
|
|
|
+ object-fit: cover;
|
|
|
+}
|
|
|
+
|
|
|
+@media screen and (max-width: 1024px) {
|
|
|
+ #feedback .box img {
|
|
|
+ width: 70vw;
|
|
|
+ height: 30vh;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media screen and (max-width: 767px) {
|
|
|
+ #feedback .box img {
|
|
|
+ width: 90vw;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+#contact-us p {
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: 600;
|
|
|
+ margin: 0px 10px;
|
|
|
+}
|
|
|
+
|
|
|
+@media screen and (max-width: 1024px) {
|
|
|
+ #contact-us p {
|
|
|
+ font-size: 24px;
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media screen and (max-width: 767px) {
|
|
|
+ #contact-us p {
|
|
|
+ font-size: 16px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+#contact-us #form-title {
|
|
|
+ padding-top: 100px;
|
|
|
+ margin-bottom: 50px;
|
|
|
+ color: #5c5248;
|
|
|
+}
|
|
|
+
|
|
|
+#contact-us #form-text {
|
|
|
+ margin: 30px auto;
|
|
|
+ margin-left: 50px;
|
|
|
+}
|
|
|
+
|
|
|
+#contact-us h1 {
|
|
|
+ text-align: center;
|
|
|
+ font-size: 24px;
|
|
|
+}
|
|
|
+
|
|
|
+@media screen and (max-width: 1024px) {
|
|
|
+ #contact-us h1 {
|
|
|
+ font-size: 36px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media screen and (max-width: 767px) {
|
|
|
+ #contact-us h1 {
|
|
|
+ font-size: 24px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+#contact-us #contact-form {
|
|
|
+ text-align: center;
|
|
|
+}
|
|
|
+
|
|
|
+#contact-us #contact-form #location,
|
|
|
+#contact-us #contact-form #type,
|
|
|
+#contact-us #contact-form #modal,
|
|
|
+#contact-us #contact-form #budget,
|
|
|
+#contact-us #contact-form #square,
|
|
|
+#contact-us #contact-form #style,
|
|
|
+#contact-us #contact-form #date,
|
|
|
+#contact-us #contact-form #email,
|
|
|
+#contact-us #contact-form #name,
|
|
|
+#contact-us #contact-form #phone,
|
|
|
+#contact-us #contact-form #gender,
|
|
|
+#contact-us #contact-form #rooms,
|
|
|
+#contact-us #contact-form #livingroom,
|
|
|
+#contact-us #contact-form #bathroom {
|
|
|
+ border-radius: 3px;
|
|
|
+ width: 85%;
|
|
|
+ height: 60px;
|
|
|
+ margin: 15px 0;
|
|
|
+ padding-left: 15px;
|
|
|
+ border: 1px solid rgba(0, 0, 0, 0.3);
|
|
|
+ font-size: 18px;
|
|
|
+ -webkit-appearance: none;
|
|
|
+ -moz-appearance: none;
|
|
|
+ appearance: none;
|
|
|
+ background: url(./img/icondown.png) 95% 50% no-repeat scroll transparent;
|
|
|
+ background-size: 10px 10px;
|
|
|
+ background-color: #fff;
|
|
|
+}
|
|
|
+
|
|
|
+#contact-us #contact-form #square,
|
|
|
+#contact-us #contact-form #date,
|
|
|
+#contact-us #contact-form #email,
|
|
|
+#contact-us #contact-form #name,
|
|
|
+#contact-us #contact-form #phone {
|
|
|
+ font-size: 18px;
|
|
|
+ width: 85%;
|
|
|
+}
|
|
|
+
|
|
|
+#contact-us #contact-form #gender {
|
|
|
+ display: block;
|
|
|
+ margin: 0 auto;
|
|
|
+}
|
|
|
+
|
|
|
+#contact-us #contact-form #facebook {
|
|
|
+ margin: 15px auto;
|
|
|
+ width: 85vw;
|
|
|
+ height: 60px;
|
|
|
+ border: 1px solid #000093;
|
|
|
+ text-align: right;
|
|
|
+ background-color: #fff;
|
|
|
+ -webkit-transition: 0.3s;
|
|
|
+ transition: 0.3s;
|
|
|
+ position: relative;
|
|
|
+}
|
|
|
+
|
|
|
+#contact-us #contact-form #facebook p {
|
|
|
+ position: absolute;
|
|
|
+ right: 30px;
|
|
|
+ top: 20px;
|
|
|
+ font-weight: normal;
|
|
|
+}
|
|
|
+
|
|
|
+@media screen and (max-width: 1024px) {
|
|
|
+ #contact-us #contact-form #facebook p {
|
|
|
+ top: 10px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+#contact-us #contact-form #facebook img {
|
|
|
+ position: absolute;
|
|
|
+ left: 30px;
|
|
|
+ top: 15px;
|
|
|
+ width: 32px;
|
|
|
+ height: 32px;
|
|
|
+}
|
|
|
+
|
|
|
+#contact-us #contact-form #facebook:hover {
|
|
|
+ background-color: #2a4f91;
|
|
|
+ color: #fff;
|
|
|
+}
|
|
|
+
|
|
|
+#contact-us #contact-form #facebook:hover img {
|
|
|
+ -webkit-filter: invert(100%) sepia(100%) saturate(19%) hue-rotate(334deg) brightness(106%) contrast(106%);
|
|
|
+ filter: invert(100%) sepia(100%) saturate(19%) hue-rotate(334deg) brightness(106%) contrast(106%);
|
|
|
+}
|
|
|
+
|
|
|
+#contact-us #contact-form a {
|
|
|
+ text-decoration: none;
|
|
|
+ color: #ff8000;
|
|
|
+}
|
|
|
+
|
|
|
+#contact-us #contact-form #checkbox {
|
|
|
+ margin-top: 50px;
|
|
|
+ padding: 20px;
|
|
|
+ width: 15px;
|
|
|
+ height: 15px;
|
|
|
+}
|
|
|
+
|
|
|
+#contact-us #contact-form #email,
|
|
|
+#contact-us #contact-form #name,
|
|
|
+#contact-us #contact-form #phone {
|
|
|
+ background: none;
|
|
|
+ background-color: #fff;
|
|
|
+}
|
|
|
+
|
|
|
+#contact-us #form {
|
|
|
+ text-align: center;
|
|
|
+ position: relative;
|
|
|
+}
|
|
|
+
|
|
|
+#contact-us #form #btn {
|
|
|
+ margin: 50px auto;
|
|
|
+ border: none;
|
|
|
+ padding: 15px;
|
|
|
+ background: #ffaf60;
|
|
|
+ color: #404854;
|
|
|
+ font-size: 20px;
|
|
|
+ width: 300px;
|
|
|
+ border-radius: 30px;
|
|
|
+}
|
|
|
+
|
|
|
+#contact-us #form #btn:hover {
|
|
|
+ color: #fff;
|
|
|
+ background-color: #745c54;
|
|
|
+}
|
|
|
+
|
|
|
+#contact-us #form #phone {
|
|
|
+ position: absolute;
|
|
|
+ left: 500px;
|
|
|
+}
|
|
|
+
|
|
|
+#footer {
|
|
|
+ margin-top: 50px;
|
|
|
+ padding-top: 50px;
|
|
|
+ width: 100vw;
|
|
|
+ height: 150px;
|
|
|
+ background-color: #ffe4ca;
|
|
|
+ color: #9f5000;
|
|
|
+ text-align: center;
|
|
|
+ font-size: 16px;
|
|
|
+ line-height: 2;
|
|
|
+}
|
|
|
+
|
|
|
+#footer a {
|
|
|
+ text-decoration: none;
|
|
|
+ color: #9f5000;
|
|
|
+}
|
|
|
+
|
|
|
+#footer p {
|
|
|
+ margin-left: 5px;
|
|
|
+ display: inline;
|
|
|
+}
|
|
|
+
|
|
|
+#menu-box {
|
|
|
+ top: 60px;
|
|
|
+ height: 45vh;
|
|
|
+ width: 100vw;
|
|
|
+ position: fixed;
|
|
|
+ z-index: 5;
|
|
|
+}
|
|
|
+
|
|
|
+#menu-box hr {
|
|
|
+ margin: 30px;
|
|
|
+ background: #65584c;
|
|
|
+}
|
|
|
+
|
|
|
+#menu-box #menu-box2 {
|
|
|
+ width: 100vw;
|
|
|
+ height: 45vh;
|
|
|
+ background-color: #f4f4f3;
|
|
|
+ opacity: 0.9;
|
|
|
+ z-index: 7;
|
|
|
+ text-align: center;
|
|
|
+}
|
|
|
+
|
|
|
+#menu-box #menu-box2 #menu-link {
|
|
|
+ display: -ms-grid;
|
|
|
+ display: grid;
|
|
|
+ -ms-grid-columns: (1fr)[3];
|
|
|
+ grid-template-columns: repeat(3, 1fr);
|
|
|
+ width: 350px;
|
|
|
+ margin: 0 auto;
|
|
|
+}
|
|
|
+
|
|
|
+#menu-box #menu-box2 .menu-logo {
|
|
|
+ opacity: 1;
|
|
|
+}
|
|
|
+
|
|
|
+#menu-box #menu-box2 .menu-logo img {
|
|
|
+ width: 40px;
|
|
|
+ height: 40px;
|
|
|
+ -webkit-filter: invert(34%) sepia(7%) saturate(1111%) hue-rotate(347deg) brightness(98%) contrast(88%);
|
|
|
+ filter: invert(34%) sepia(7%) saturate(1111%) hue-rotate(347deg) brightness(98%) contrast(88%);
|
|
|
+}
|
|
|
+
|
|
|
+#menu-box #menu-box2 a {
|
|
|
+ display: inline-block;
|
|
|
+ text-decoration: none;
|
|
|
+ color: #65584c;
|
|
|
+ font-size: 16px;
|
|
|
+ margin-top: 20px;
|
|
|
+}
|
|
|
+
|
|
|
+#menu-box #menu-box2 .menu-text {
|
|
|
+ width: 100vw;
|
|
|
+ text-align: center;
|
|
|
+ margin-bottom: 10px;
|
|
|
+}
|
|
|
+/*# sourceMappingURL=style.css.map */
|
jeter20131220
3 years ago
