|
|
@@ -0,0 +1,5161 @@
|
|
|
+/*-----------------------------------------------------------------------------------
|
|
|
+ CSS INDEX
|
|
|
+ ===================
|
|
|
+ 01. Common
|
|
|
+ 02. Header
|
|
|
+ 03. Banner
|
|
|
+ 04. About
|
|
|
+ 05. Sidebar
|
|
|
+ 06. Footer
|
|
|
+ 07. Solution
|
|
|
+ 08. Core Product
|
|
|
+ 09. About Two
|
|
|
+ 10. Classic Case
|
|
|
+ 11. Sub Company
|
|
|
+ 12. Custom Contact
|
|
|
+ 13. News Breadcrumb
|
|
|
+ 14. News Content
|
|
|
+ 15. Custom Banner
|
|
|
+ 16. Common breadcrumb
|
|
|
+ 17. Product Grid
|
|
|
+ 18. Product Detial
|
|
|
+ 19. Solution Page
|
|
|
+ 20. Join
|
|
|
+ 21. Example Page
|
|
|
+ 22. About Page
|
|
|
+ 23. About Page -- Credential
|
|
|
+ 24. About Page -- Investor Relations
|
|
|
+ 25. About Page -- Organizational Structure
|
|
|
+ 26. About Page -- History
|
|
|
+ 27. About Page -- Sub Company
|
|
|
+ 28. Service page
|
|
|
+ 29. Technology page
|
|
|
+-----------------------------------------------------------------------------------*/
|
|
|
+
|
|
|
+
|
|
|
+/*===========================
|
|
|
+ COMMON CSS
|
|
|
+===========================*/
|
|
|
+
|
|
|
+@import url("https://fonts.googleapis.com/css2?family=Oswald:wght@400;500;600;700&family=Roboto:ital,wght@0,400;0,500;0,700;1,400&display=swap");
|
|
|
+body {
|
|
|
+ /* font-family: "Microsoft YaHei", 微软雅黑, "MicrosoftJhengHei", 华文细黑, STHeiti, MingLiu; */
|
|
|
+ font-family: "Microsoft YaHei", 微软雅黑, "MicrosoftJhengHei";
|
|
|
+ font-weight: normal;
|
|
|
+ font-style: normal;
|
|
|
+ color: #041d38;
|
|
|
+ overflow-x: hidden;
|
|
|
+ font-size: 16px;
|
|
|
+ line-height: 1.6;
|
|
|
+ -webkit-font-smoothing: antialiased;
|
|
|
+}
|
|
|
+
|
|
|
+.cannot_selected {
|
|
|
+ -moz-user-select: none;
|
|
|
+ /*火狐*/
|
|
|
+ -webkit-user-select: none;
|
|
|
+ /*webkit浏览器*/
|
|
|
+ -ms-user-select: none;
|
|
|
+ /*IE10*/
|
|
|
+ -khtml-user-select: none;
|
|
|
+ /*早期浏览器*/
|
|
|
+ user-select: none;
|
|
|
+}
|
|
|
+
|
|
|
+.text_nowrap {
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ white-space: nowrap;
|
|
|
+}
|
|
|
+
|
|
|
+* {
|
|
|
+ margin: 0;
|
|
|
+ padding: 0;
|
|
|
+ -webkit-box-sizing: border-box;
|
|
|
+ box-sizing: border-box;
|
|
|
+}
|
|
|
+
|
|
|
+img {
|
|
|
+ max-width: 100%;
|
|
|
+ -webkit-transition: all 0.4s ease-out 0s;
|
|
|
+ transition: all 0.4s ease-out 0s;
|
|
|
+}
|
|
|
+
|
|
|
+a:focus,
|
|
|
+input:focus,
|
|
|
+textarea:focus,
|
|
|
+button:focus,
|
|
|
+.slick-initialized .slick-slide:focus,
|
|
|
+.btn:focus {
|
|
|
+ text-decoration: none;
|
|
|
+ outline: none;
|
|
|
+ -webkit-box-shadow: none;
|
|
|
+ box-shadow: none;
|
|
|
+}
|
|
|
+
|
|
|
+a:focus,
|
|
|
+a:hover {
|
|
|
+ text-decoration: none;
|
|
|
+}
|
|
|
+
|
|
|
+i,
|
|
|
+span,
|
|
|
+a {
|
|
|
+ display: inline-block;
|
|
|
+}
|
|
|
+
|
|
|
+h1,
|
|
|
+h2,
|
|
|
+h3,
|
|
|
+h4,
|
|
|
+h5,
|
|
|
+h6 {
|
|
|
+ font-family: "Oswald", sans-serif;
|
|
|
+ font-weight: 700;
|
|
|
+ margin: 0px;
|
|
|
+}
|
|
|
+
|
|
|
+h1,
|
|
|
+h1 a,
|
|
|
+h2,
|
|
|
+h2 a,
|
|
|
+h3,
|
|
|
+h3 a,
|
|
|
+h4,
|
|
|
+h4 a,
|
|
|
+h5,
|
|
|
+h5 a,
|
|
|
+h6,
|
|
|
+h6 a {
|
|
|
+ color: #041d38;
|
|
|
+}
|
|
|
+
|
|
|
+h1 {
|
|
|
+ font-size: 48px;
|
|
|
+}
|
|
|
+
|
|
|
+h2 {
|
|
|
+ font-size: 36px;
|
|
|
+}
|
|
|
+
|
|
|
+h3 {
|
|
|
+ font-size: 28px;
|
|
|
+}
|
|
|
+
|
|
|
+h4 {
|
|
|
+ font-size: 24px;
|
|
|
+}
|
|
|
+
|
|
|
+h5 {
|
|
|
+ font-size: 18px;
|
|
|
+}
|
|
|
+
|
|
|
+h6 {
|
|
|
+ font-size: 16px;
|
|
|
+}
|
|
|
+
|
|
|
+ul,
|
|
|
+ol {
|
|
|
+ margin: 0px;
|
|
|
+ padding: 0px;
|
|
|
+ list-style-type: none;
|
|
|
+}
|
|
|
+
|
|
|
+p {
|
|
|
+ margin: 0px;
|
|
|
+}
|
|
|
+
|
|
|
+a {
|
|
|
+ -webkit-transition: all 0.3s ease-out 0s;
|
|
|
+ transition: all 0.3s ease-out 0s;
|
|
|
+}
|
|
|
+
|
|
|
+a,
|
|
|
+a:hover {
|
|
|
+ color: #ffaa17;
|
|
|
+}
|
|
|
+
|
|
|
+input,
|
|
|
+select,
|
|
|
+textarea {
|
|
|
+ width: 100%;
|
|
|
+ height: 50px;
|
|
|
+ border: 2px solid #ededed;
|
|
|
+ font-size: 14px;
|
|
|
+ font-weight: 600;
|
|
|
+ font-family: "Oswald", sans-serif;
|
|
|
+ color: #041d38;
|
|
|
+ text-transform: uppercase;
|
|
|
+ padding: 0 30px;
|
|
|
+}
|
|
|
+
|
|
|
+textarea {
|
|
|
+ padding-top: 20px;
|
|
|
+ height: 120px;
|
|
|
+}
|
|
|
+
|
|
|
+.input-group {
|
|
|
+ position: relative;
|
|
|
+}
|
|
|
+
|
|
|
+.input-group input,
|
|
|
+.input-group textarea {
|
|
|
+ padding-left: 65px;
|
|
|
+}
|
|
|
+
|
|
|
+.input-group .icon {
|
|
|
+ position: absolute;
|
|
|
+ left: 30px;
|
|
|
+ top: 50%;
|
|
|
+ -webkit-transform: translateY(-50%);
|
|
|
+ transform: translateY(-50%);
|
|
|
+ color: #ffaa17;
|
|
|
+}
|
|
|
+
|
|
|
+.input-group.textarea .icon {
|
|
|
+ top: 20px;
|
|
|
+ -webkit-transform: translateY(0);
|
|
|
+ transform: translateY(0);
|
|
|
+}
|
|
|
+
|
|
|
+::-webkit-input-placeholder {
|
|
|
+ opacity: 1;
|
|
|
+}
|
|
|
+
|
|
|
+:-ms-input-placeholder {
|
|
|
+ opacity: 1;
|
|
|
+}
|
|
|
+
|
|
|
+::-ms-input-placeholder {
|
|
|
+ opacity: 1;
|
|
|
+}
|
|
|
+
|
|
|
+::placeholder {
|
|
|
+ opacity: 1;
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+/*===== Common class Style =====*/
|
|
|
+
|
|
|
+.blue_fc1 {
|
|
|
+ color: #2a2e78
|
|
|
+}
|
|
|
+
|
|
|
+#preloader {
|
|
|
+ position: fixed;
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ top: 0px;
|
|
|
+ left: 0px;
|
|
|
+ background-color: #ffaa17;
|
|
|
+ z-index: 9999999;
|
|
|
+}
|
|
|
+
|
|
|
+#preloader>div {
|
|
|
+ display: -webkit-box;
|
|
|
+ display: -ms-flexbox;
|
|
|
+ display: flex;
|
|
|
+ -webkit-box-pack: center;
|
|
|
+ -ms-flex-pack: center;
|
|
|
+ justify-content: center;
|
|
|
+ -webkit-box-align: center;
|
|
|
+ -ms-flex-align: center;
|
|
|
+ align-items: center;
|
|
|
+ height: 100%;
|
|
|
+ width: 100%;
|
|
|
+}
|
|
|
+
|
|
|
+#preloader>div div {
|
|
|
+ height: 40px;
|
|
|
+ width: 40px;
|
|
|
+ background-color: #fff;
|
|
|
+ -webkit-animation: rotateplane 1.2s infinite ease-in-out;
|
|
|
+ animation: rotateplane 1.2s infinite ease-in-out;
|
|
|
+}
|
|
|
+
|
|
|
+.main-btn {
|
|
|
+ font-size: 14px;
|
|
|
+ font-weight: 700;
|
|
|
+ font-family: "Oswald", sans-serif;
|
|
|
+ color: #041d38;
|
|
|
+ text-transform: uppercase;
|
|
|
+ -webkit-transition: all 0.3s ease-out 0s;
|
|
|
+ transition: all 0.3s ease-out 0s;
|
|
|
+ padding: 0 45px;
|
|
|
+ background-color: #fff;
|
|
|
+ border: 2px solid #fff;
|
|
|
+ position: relative;
|
|
|
+ height: 60px;
|
|
|
+ line-height: 60px;
|
|
|
+}
|
|
|
+
|
|
|
+.main-btn::after,
|
|
|
+.main-btn::before {
|
|
|
+ position: absolute;
|
|
|
+ right: 10px;
|
|
|
+ top: 10px;
|
|
|
+ height: 10px;
|
|
|
+ width: 2px;
|
|
|
+ content: '';
|
|
|
+ background-color: #ffaa17;
|
|
|
+ -webkit-transition: all 0.3s ease-out 0s;
|
|
|
+ transition: all 0.3s ease-out 0s;
|
|
|
+}
|
|
|
+
|
|
|
+.main-btn::before {
|
|
|
+ width: 10px;
|
|
|
+ height: 2px;
|
|
|
+}
|
|
|
+
|
|
|
+.main-btn:hover {
|
|
|
+ color: #041d38;
|
|
|
+}
|
|
|
+
|
|
|
+.main-btn.btn-borderd {
|
|
|
+ border: 2px solid rgba(4, 29, 56, 0.1);
|
|
|
+ background-color: transparent;
|
|
|
+}
|
|
|
+
|
|
|
+.main-btn.btn-borderd:hover {
|
|
|
+ background-color: #ffaa17;
|
|
|
+ border-color: #ffaa17;
|
|
|
+}
|
|
|
+
|
|
|
+.main-btn.btn-borderd:hover::after,
|
|
|
+.main-btn.btn-borderd:hover::before {
|
|
|
+ background-color: #041d38;
|
|
|
+}
|
|
|
+
|
|
|
+.main-btn.btn-filled {
|
|
|
+ background-color: #ffaa17;
|
|
|
+ border-color: #ffaa17;
|
|
|
+}
|
|
|
+
|
|
|
+.main-btn.btn-filled::after,
|
|
|
+.main-btn.btn-filled::before {
|
|
|
+ background-color: #041d38;
|
|
|
+}
|
|
|
+
|
|
|
+.main-btn.btn-filled:hover {
|
|
|
+ background-color: transparent;
|
|
|
+ border-color: rgba(4, 29, 56, 0.1);
|
|
|
+}
|
|
|
+
|
|
|
+.main-btn.btn-filled:hover::after,
|
|
|
+.main-btn.btn-filled:hover::before {
|
|
|
+ background-color: rgba(4, 29, 56, 0.1);
|
|
|
+}
|
|
|
+
|
|
|
+.section-title h2 {
|
|
|
+ font-size: 48px;
|
|
|
+ text-transform: uppercase;
|
|
|
+ line-height: 1.2;
|
|
|
+ letter-spacing: -1px;
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 992px) and (max-width: 1200px) {
|
|
|
+ .section-title h2 {
|
|
|
+ font-size: 38px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 768px) and (max-width: 991px) {
|
|
|
+ .section-title h2 {
|
|
|
+ font-size: 40px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 576px) and (max-width: 767px) {
|
|
|
+ .section-title h2 {
|
|
|
+ font-size: 40px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 575px) {
|
|
|
+ .section-title h2 {
|
|
|
+ font-size: 32px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 399px) {
|
|
|
+ .section-title h2 {
|
|
|
+ font-size: 26px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.section-title span.title-tag {
|
|
|
+ text-transform: uppercase;
|
|
|
+ color: #2a2e78;
|
|
|
+ /* font-family: "Oswald", sans-serif; */
|
|
|
+ line-height: 1;
|
|
|
+ font-size: 36px;
|
|
|
+ display: inline-block;
|
|
|
+ margin-bottom: 20px;
|
|
|
+ position: relative;
|
|
|
+}
|
|
|
+
|
|
|
+.section-title.left-border span.title-tag {
|
|
|
+ padding-left: 50px;
|
|
|
+}
|
|
|
+
|
|
|
+.section-title.left-border span.title-tag::before {
|
|
|
+ position: absolute;
|
|
|
+ left: 0;
|
|
|
+ top: 50%;
|
|
|
+ -webkit-transform: translateY(-50%);
|
|
|
+ transform: translateY(-50%);
|
|
|
+ height: 4px;
|
|
|
+ width: 30px;
|
|
|
+ background-color: #2a2e78;
|
|
|
+ content: '';
|
|
|
+}
|
|
|
+
|
|
|
+.section-title.both-border span.title-tag {
|
|
|
+ padding-left: 50px;
|
|
|
+ padding-right: 50px;
|
|
|
+}
|
|
|
+
|
|
|
+.section-title.both-border span.title-tag::before,
|
|
|
+.section-title.both-border span.title-tag::after {
|
|
|
+ position: absolute;
|
|
|
+ left: 0;
|
|
|
+ top: 50%;
|
|
|
+ -webkit-transform: translateY(-50%);
|
|
|
+ transform: translateY(-50%);
|
|
|
+ height: 3px;
|
|
|
+ width: 40px;
|
|
|
+ background-color: #2a2e78;
|
|
|
+ content: '';
|
|
|
+}
|
|
|
+
|
|
|
+.section-title.both-border span.title-tag::after {
|
|
|
+ left: auto;
|
|
|
+ right: 0;
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+/* Custom Container Width */
|
|
|
+
|
|
|
+@media (min-width: 1600px) {
|
|
|
+ .container-fluid.custom-container-one {
|
|
|
+ max-width: 1520px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media (min-width: 1600px) {
|
|
|
+ .container-fluid.custom-container-two {
|
|
|
+ max-width: 1400px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+/* Animation keyfranes */
|
|
|
+
|
|
|
+@-webkit-keyframes sticky {
|
|
|
+ 0% {
|
|
|
+ top: -200px;
|
|
|
+ }
|
|
|
+ 100% {
|
|
|
+ top: 0;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@keyframes sticky {
|
|
|
+ 0% {
|
|
|
+ top: -200px;
|
|
|
+ }
|
|
|
+ 100% {
|
|
|
+ top: 0;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@-webkit-keyframes rotateplane {
|
|
|
+ 0% {
|
|
|
+ transform: perspective(120px) rotateX(0deg) rotateY(0deg);
|
|
|
+ -webkit-transform: perspective(120px) rotateX(0deg) rotateY(0deg);
|
|
|
+ }
|
|
|
+ 50% {
|
|
|
+ transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);
|
|
|
+ -webkit-transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);
|
|
|
+ }
|
|
|
+ 100% {
|
|
|
+ transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
|
|
|
+ -webkit-transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@keyframes rotateplane {
|
|
|
+ 0% {
|
|
|
+ transform: perspective(120px) rotateX(0deg) rotateY(0deg);
|
|
|
+ -webkit-transform: perspective(120px) rotateX(0deg) rotateY(0deg);
|
|
|
+ }
|
|
|
+ 50% {
|
|
|
+ transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);
|
|
|
+ -webkit-transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);
|
|
|
+ }
|
|
|
+ 100% {
|
|
|
+ transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
|
|
|
+ -webkit-transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@-webkit-keyframes hvr-buzz-out {
|
|
|
+ 10% {
|
|
|
+ -webkit-transform: translateX(3px) rotate(2deg);
|
|
|
+ transform: translateX(3px) rotate(2deg);
|
|
|
+ }
|
|
|
+ 20% {
|
|
|
+ -webkit-transform: translateX(-3px) rotate(-2deg);
|
|
|
+ transform: translateX(-3px) rotate(-2deg);
|
|
|
+ }
|
|
|
+ 30% {
|
|
|
+ -webkit-transform: translateX(3px) rotate(2deg);
|
|
|
+ transform: translateX(3px) rotate(2deg);
|
|
|
+ }
|
|
|
+ 40% {
|
|
|
+ -webkit-transform: translateX(-3px) rotate(-2deg);
|
|
|
+ transform: translateX(-3px) rotate(-2deg);
|
|
|
+ }
|
|
|
+ 50% {
|
|
|
+ -webkit-transform: translateX(2px) rotate(1deg);
|
|
|
+ transform: translateX(2px) rotate(1deg);
|
|
|
+ }
|
|
|
+ 60% {
|
|
|
+ -webkit-transform: translateX(-2px) rotate(-1deg);
|
|
|
+ transform: translateX(-2px) rotate(-1deg);
|
|
|
+ }
|
|
|
+ 70% {
|
|
|
+ -webkit-transform: translateX(2px) rotate(1deg);
|
|
|
+ transform: translateX(2px) rotate(1deg);
|
|
|
+ }
|
|
|
+ 80% {
|
|
|
+ -webkit-transform: translateX(-2px) rotate(-1deg);
|
|
|
+ transform: translateX(-2px) rotate(-1deg);
|
|
|
+ }
|
|
|
+ 90% {
|
|
|
+ -webkit-transform: translateX(1px) rotate(0);
|
|
|
+ transform: translateX(1px) rotate(0);
|
|
|
+ }
|
|
|
+ 100% {
|
|
|
+ -webkit-transform: translateX(-1px) rotate(0);
|
|
|
+ transform: translateX(-1px) rotate(0);
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@keyframes hvr-buzz-out {
|
|
|
+ 10% {
|
|
|
+ -webkit-transform: translateX(3px) rotate(2deg);
|
|
|
+ transform: translateX(3px) rotate(2deg);
|
|
|
+ }
|
|
|
+ 20% {
|
|
|
+ -webkit-transform: translateX(-3px) rotate(-2deg);
|
|
|
+ transform: translateX(-3px) rotate(-2deg);
|
|
|
+ }
|
|
|
+ 30% {
|
|
|
+ -webkit-transform: translateX(3px) rotate(2deg);
|
|
|
+ transform: translateX(3px) rotate(2deg);
|
|
|
+ }
|
|
|
+ 40% {
|
|
|
+ -webkit-transform: translateX(-3px) rotate(-2deg);
|
|
|
+ transform: translateX(-3px) rotate(-2deg);
|
|
|
+ }
|
|
|
+ 50% {
|
|
|
+ -webkit-transform: translateX(2px) rotate(1deg);
|
|
|
+ transform: translateX(2px) rotate(1deg);
|
|
|
+ }
|
|
|
+ 60% {
|
|
|
+ -webkit-transform: translateX(-2px) rotate(-1deg);
|
|
|
+ transform: translateX(-2px) rotate(-1deg);
|
|
|
+ }
|
|
|
+ 70% {
|
|
|
+ -webkit-transform: translateX(2px) rotate(1deg);
|
|
|
+ transform: translateX(2px) rotate(1deg);
|
|
|
+ }
|
|
|
+ 80% {
|
|
|
+ -webkit-transform: translateX(-2px) rotate(-1deg);
|
|
|
+ transform: translateX(-2px) rotate(-1deg);
|
|
|
+ }
|
|
|
+ 90% {
|
|
|
+ -webkit-transform: translateX(1px) rotate(0);
|
|
|
+ transform: translateX(1px) rotate(0);
|
|
|
+ }
|
|
|
+ 100% {
|
|
|
+ -webkit-transform: translateX(-1px) rotate(0);
|
|
|
+ transform: translateX(-1px) rotate(0);
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@-webkit-keyframes ripple {
|
|
|
+ 0%,
|
|
|
+ 35% {
|
|
|
+ -webkit-transform: scale(0);
|
|
|
+ transform: scale(0);
|
|
|
+ opacity: 1;
|
|
|
+ }
|
|
|
+ 50% {
|
|
|
+ -webkit-transform: scale(1.5);
|
|
|
+ transform: scale(1.5);
|
|
|
+ opacity: 0.8;
|
|
|
+ }
|
|
|
+ 100% {
|
|
|
+ opacity: 0;
|
|
|
+ -webkit-transform: scale(2);
|
|
|
+ transform: scale(2);
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@keyframes ripple {
|
|
|
+ 0%,
|
|
|
+ 35% {
|
|
|
+ -webkit-transform: scale(0);
|
|
|
+ transform: scale(0);
|
|
|
+ opacity: 1;
|
|
|
+ }
|
|
|
+ 50% {
|
|
|
+ -webkit-transform: scale(1.5);
|
|
|
+ transform: scale(1.5);
|
|
|
+ opacity: 0.8;
|
|
|
+ }
|
|
|
+ 100% {
|
|
|
+ opacity: 0;
|
|
|
+ -webkit-transform: scale(2);
|
|
|
+ transform: scale(2);
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@-webkit-keyframes ripple-white {
|
|
|
+ 0% {
|
|
|
+ opacity: 0;
|
|
|
+ -webkit-transform: scale(1);
|
|
|
+ transform: scale(1);
|
|
|
+ }
|
|
|
+ 40% {
|
|
|
+ opacity: 0.2;
|
|
|
+ -webkit-transform: scale(1.2);
|
|
|
+ transform: scale(1.2);
|
|
|
+ }
|
|
|
+ 100% {
|
|
|
+ opacity: 0;
|
|
|
+ -webkit-transform: scale(1.4);
|
|
|
+ transform: scale(1.4);
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@keyframes ripple-white {
|
|
|
+ 0% {
|
|
|
+ opacity: 0;
|
|
|
+ -webkit-transform: scale(1);
|
|
|
+ transform: scale(1);
|
|
|
+ }
|
|
|
+ 40% {
|
|
|
+ opacity: 0.2;
|
|
|
+ -webkit-transform: scale(1.2);
|
|
|
+ transform: scale(1.2);
|
|
|
+ }
|
|
|
+ 100% {
|
|
|
+ opacity: 0;
|
|
|
+ -webkit-transform: scale(1.4);
|
|
|
+ transform: scale(1.4);
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+/*===========================
|
|
|
+ Header
|
|
|
+===========================*/
|
|
|
+
|
|
|
+header {
|
|
|
+ /*===== Header transparent =====*/
|
|
|
+ /*===== Header to area =====*/
|
|
|
+ /*===== Main Menu =====*/
|
|
|
+ /*===== Mobile Menu =====*/
|
|
|
+ /*===== Header two =====*/
|
|
|
+ /*===== Header three =====*/
|
|
|
+ /*===== Sticky Header =====*/
|
|
|
+ /* off canvas menu */
|
|
|
+}
|
|
|
+
|
|
|
+header.header-absolute {
|
|
|
+ position: absolute;
|
|
|
+ left: 0;
|
|
|
+ top: 0;
|
|
|
+ width: 100%;
|
|
|
+ z-index: 99;
|
|
|
+}
|
|
|
+
|
|
|
+header .header-top-area {
|
|
|
+ padding: 7px 0;
|
|
|
+ background: rgba(0, 0, 0, 0.1)
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 575px) {
|
|
|
+ header .header-top-area {
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+header .header-top-area .contact-list li,
|
|
|
+header .header-top-area .social-link li {
|
|
|
+ display: inline-block;
|
|
|
+ font-weight: 700;
|
|
|
+ font-size: 16px;
|
|
|
+ /* text-transform: uppercase; */
|
|
|
+ margin-right: 25px;
|
|
|
+ /* font-family: "Oswald", sans-serif; */
|
|
|
+}
|
|
|
+
|
|
|
+header .header-top-area .contact-list li:last-child,
|
|
|
+header .header-top-area .social-link li:last-child {
|
|
|
+ margin-right: 0;
|
|
|
+}
|
|
|
+
|
|
|
+header .header-top-area .contact-list li,
|
|
|
+header .header-top-area .contact-list li a,
|
|
|
+header .header-top-area .social-link li,
|
|
|
+header .header-top-area .social-link li a {
|
|
|
+ color: #fff;
|
|
|
+}
|
|
|
+
|
|
|
+header .header-top-area .contact-list li a:hover,
|
|
|
+header .header-top-area .social-link li a:hover {
|
|
|
+ color: #ffaa17;
|
|
|
+}
|
|
|
+
|
|
|
+header .header-top-area .social-link {
|
|
|
+ text-align: right;
|
|
|
+}
|
|
|
+
|
|
|
+header .header-top-area .social-link li {
|
|
|
+ margin-right: 0;
|
|
|
+ margin-left: 25px;
|
|
|
+}
|
|
|
+
|
|
|
+header .header-top-area .social-link li:first-child {
|
|
|
+ margin-left: 0;
|
|
|
+}
|
|
|
+
|
|
|
+header .mainmenu-area {
|
|
|
+ /* border: 1px solid red; */
|
|
|
+ /* background-color: #fff; */
|
|
|
+ position: relative;
|
|
|
+ padding: 0 60px;
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 1200px) and (max-width: 1599px) {
|
|
|
+ header .mainmenu-area {
|
|
|
+ padding: 0 40px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 992px) and (max-width: 1200px) {
|
|
|
+ header .mainmenu-area {
|
|
|
+ padding: 0 30px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 768px) and (max-width: 991px) {
|
|
|
+ header .mainmenu-area {
|
|
|
+ padding: 15px 95px 15px 15px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 767px) {
|
|
|
+ header .mainmenu-area {
|
|
|
+ padding: 15px 95px 15px 15px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 575px) {
|
|
|
+ header .mainmenu-area {
|
|
|
+ margin-top: 15px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+header .mainmenu-area .main-menu {
|
|
|
+ display: -ms-flexbox!important;
|
|
|
+ display: flex!important;
|
|
|
+ -ms-flex-pack: start!important;
|
|
|
+ justify-content: flex-start!important;
|
|
|
+ -ms-flex-align: center!important;
|
|
|
+ align-items: center!important;
|
|
|
+}
|
|
|
+
|
|
|
+header .mainmenu-area .main-menu .logo img {
|
|
|
+ max-width: 87px;
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 399px) {
|
|
|
+ header .mainmenu-area .main-menu .logo img {
|
|
|
+ max-width: 120px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+header .mainmenu-area .main-menu .menu-items {
|
|
|
+ margin-left: 60px;
|
|
|
+}
|
|
|
+
|
|
|
+header .mainmenu-area .main-menu .menu-items ul li {
|
|
|
+ display: inline-block;
|
|
|
+ margin-right: 30px;
|
|
|
+ position: relative;
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 1200px) and (max-width: 1599px) {
|
|
|
+ header .mainmenu-area .main-menu .menu-items ul li {
|
|
|
+ margin-right: 15px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 992px) and (max-width: 1200px) {
|
|
|
+ header .mainmenu-area .main-menu .menu-items ul li {
|
|
|
+ margin-right: 0;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+header .mainmenu-area .main-menu .menu-items ul li:last-child {
|
|
|
+ margin-right: 0;
|
|
|
+}
|
|
|
+
|
|
|
+header .mainmenu-area .main-menu .menu-items ul li a {
|
|
|
+ /* line-height: 74px; */
|
|
|
+ padding: 24px 48px;
|
|
|
+ color: #fff;
|
|
|
+ font-family: "Oswald", sans-serif;
|
|
|
+ font-weight: 500;
|
|
|
+ text-transform: uppercase;
|
|
|
+ font-size: 16px;
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 992px) and (max-width: 1200px) {
|
|
|
+ header .mainmenu-area .main-menu .menu-items ul li a {
|
|
|
+ padding: 0 12px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+header .mainmenu-area .main-menu .menu-items ul li a:hover {
|
|
|
+ color: #639BFF;
|
|
|
+}
|
|
|
+
|
|
|
+header .mainmenu-area .main-menu .menu-items ul li.active>a {
|
|
|
+ color: #639BFF;
|
|
|
+ font-size: 18px
|
|
|
+}
|
|
|
+
|
|
|
+header .mainmenu-area .main-menu .menu-items ul li.active>a:before {
|
|
|
+ content: '';
|
|
|
+ width: 24px;
|
|
|
+ height: 2px;
|
|
|
+ display: inline-block;
|
|
|
+ background-color: #639BFF;
|
|
|
+ /* margin-right: 5px; */
|
|
|
+ position: absolute;
|
|
|
+ bottom: 18px;
|
|
|
+ left: 50%;
|
|
|
+ margin-left: -12px;
|
|
|
+}
|
|
|
+
|
|
|
+header .mainmenu-area .main-menu .menu-items ul li .submenu {
|
|
|
+ position: absolute;
|
|
|
+ left: -28px;
|
|
|
+ top: 120%;
|
|
|
+ width: 220px;
|
|
|
+ background-color: #fff;
|
|
|
+ opacity: 0;
|
|
|
+ visibility: hidden;
|
|
|
+ -webkit-transition: all 0.3s ease-out 0s;
|
|
|
+ transition: all 0.3s ease-out 0s;
|
|
|
+ z-index: 99;
|
|
|
+ -webkit-box-shadow: 0px 8px 16px 0px rgba(73, 167, 211, 0.06);
|
|
|
+ box-shadow: 0px 8px 16px 0px rgba(73, 167, 211, 0.06);
|
|
|
+}
|
|
|
+
|
|
|
+header .mainmenu-area .main-menu .menu-items ul li .submenu>li {
|
|
|
+ position: relative;
|
|
|
+ display: block;
|
|
|
+ margin: 0;
|
|
|
+ text-align: center;
|
|
|
+}
|
|
|
+
|
|
|
+header .mainmenu-area .main-menu .menu-items ul li .submenu>li a {
|
|
|
+ display: block;
|
|
|
+ padding: 0 15px;
|
|
|
+ position: relative;
|
|
|
+ color: #041d38;
|
|
|
+ -webkit-transition: all 0.3s ease-out 0s;
|
|
|
+ transition: all 0.3s ease-out 0s;
|
|
|
+ border-radius: 0;
|
|
|
+ line-height: 40px;
|
|
|
+}
|
|
|
+
|
|
|
+header .mainmenu-area .main-menu .menu-items ul li .submenu>li a:hover {
|
|
|
+ background-color: #639BFF;
|
|
|
+ color: #fff;
|
|
|
+}
|
|
|
+
|
|
|
+header .mainmenu-area .main-menu .menu-items ul li .submenu>li .submenu {
|
|
|
+ position: absolute;
|
|
|
+ left: 100%;
|
|
|
+ top: 30%;
|
|
|
+ width: 200px;
|
|
|
+ background-color: #fff;
|
|
|
+ visibility: hidden;
|
|
|
+ opacity: 0;
|
|
|
+}
|
|
|
+
|
|
|
+header .mainmenu-area .main-menu .menu-items ul li .submenu>li:hover .submenu {
|
|
|
+ opacity: 1;
|
|
|
+ visibility: visible;
|
|
|
+ top: 0;
|
|
|
+}
|
|
|
+
|
|
|
+header .mainmenu-area .main-menu .menu-items ul li:hover .submenu {
|
|
|
+ visibility: visible;
|
|
|
+ opacity: 1;
|
|
|
+ top: 100%;
|
|
|
+}
|
|
|
+
|
|
|
+header .mainmenu-area .main-right {
|
|
|
+ display: -webkit-box;
|
|
|
+ display: -ms-flexbox;
|
|
|
+ display: flex;
|
|
|
+ -webkit-box-pack: right;
|
|
|
+ -ms-flex-pack: right;
|
|
|
+ justify-content: right;
|
|
|
+ -webkit-box-align: center;
|
|
|
+ -ms-flex-align: center;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 575px) {
|
|
|
+ header .mainmenu-area .main-right {
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+header .mainmenu-area .main-right .offcanvas-trigger {
|
|
|
+ margin-left: 20px;
|
|
|
+ height: 60px;
|
|
|
+ width: 60px;
|
|
|
+ line-height: 60px;
|
|
|
+ background-color: #ffaa17;
|
|
|
+ border: 2px solid #ffaa17;
|
|
|
+ color: #fff;
|
|
|
+ text-align: center;
|
|
|
+ -webkit-transition: all 0.3s ease-out 0s;
|
|
|
+ transition: all 0.3s ease-out 0s;
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 767px) {
|
|
|
+ header .mainmenu-area .main-right .offcanvas-trigger {
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+header .mainmenu-area .main-right .offcanvas-trigger:hover {
|
|
|
+ background-color: #041d38;
|
|
|
+ border-color: #041d38;
|
|
|
+}
|
|
|
+
|
|
|
+header .mainmenu-area .main-right .offcanvas-trigger i {
|
|
|
+ font-size: 30px;
|
|
|
+ position: relative;
|
|
|
+ top: 5px;
|
|
|
+}
|
|
|
+
|
|
|
+header .mobile-menu.mean-container .mean-bar {
|
|
|
+ background-color: transparent;
|
|
|
+ padding: 0;
|
|
|
+ min-height: 0;
|
|
|
+}
|
|
|
+
|
|
|
+header .mobile-menu.mean-container .mean-bar a.meanmenu-reveal {
|
|
|
+ margin-right: 15px;
|
|
|
+ margin-top: -75px;
|
|
|
+ border: 2px solid rgba(4, 29, 56, 0.1);
|
|
|
+ padding: 17px 15px;
|
|
|
+ width: 26px;
|
|
|
+ z-index: 222;
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 399px) {
|
|
|
+ header .mobile-menu.mean-container .mean-bar a.meanmenu-reveal {
|
|
|
+ margin-top: -65px;
|
|
|
+ padding: 12px 10px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+header .mobile-menu.mean-container .mean-bar a.meanmenu-reveal span {
|
|
|
+ background-color: #041d38;
|
|
|
+}
|
|
|
+
|
|
|
+header .mobile-menu.mean-container .mean-nav {
|
|
|
+ margin-top: 0;
|
|
|
+ background-color: #041d38;
|
|
|
+ position: absolute;
|
|
|
+ left: 0;
|
|
|
+ top: 0;
|
|
|
+ width: 100%;
|
|
|
+ z-index: 99;
|
|
|
+}
|
|
|
+
|
|
|
+header .mobile-menu.mean-container .mean-nav ul li {
|
|
|
+ border-bottom: 1px solid rgba(255, 255, 255, 0.2);
|
|
|
+}
|
|
|
+
|
|
|
+header .mobile-menu.mean-container .mean-nav ul li:last-child {
|
|
|
+ border: none;
|
|
|
+}
|
|
|
+
|
|
|
+header .mobile-menu.mean-container .mean-nav ul li a {
|
|
|
+ border: none;
|
|
|
+ padding: 0;
|
|
|
+ padding: 15px 20px;
|
|
|
+ width: 100%;
|
|
|
+ font-size: 14px;
|
|
|
+}
|
|
|
+
|
|
|
+header .mobile-menu.mean-container .mean-nav ul li li:first-child {
|
|
|
+ border-top: 1px solid rgba(255, 255, 255, 0.2);
|
|
|
+}
|
|
|
+
|
|
|
+header .mobile-menu.mean-container .mean-nav ul li li a {
|
|
|
+ padding: 15px 40px;
|
|
|
+}
|
|
|
+
|
|
|
+header .mobile-menu.mean-container .mean-nav ul li li li {
|
|
|
+ border-top: 1px solid rgba(255, 255, 255, 0.2);
|
|
|
+}
|
|
|
+
|
|
|
+header .mobile-menu.mean-container .mean-nav ul li li li a {
|
|
|
+ padding: 15px 60px;
|
|
|
+}
|
|
|
+
|
|
|
+header .mobile-menu.mean-container .mean-nav ul li a.mean-expand {
|
|
|
+ border: none !important;
|
|
|
+ width: 50px;
|
|
|
+ height: 53px;
|
|
|
+ padding: 0 !important;
|
|
|
+ line-height: 53px;
|
|
|
+ margin-top: 0;
|
|
|
+}
|
|
|
+
|
|
|
+header .mobile-menu.mean-container .mean-nav ul li a.mean-expand:hover {
|
|
|
+ background: transparent;
|
|
|
+}
|
|
|
+
|
|
|
+header.header-two .header-top-area {
|
|
|
+ padding: 15px 0;
|
|
|
+ background-color: #041d38;
|
|
|
+}
|
|
|
+
|
|
|
+header.header-two .mainmenu-area {
|
|
|
+ border-bottom: 1px solid #f1f1f1;
|
|
|
+ padding: 0;
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 1200px) and (max-width: 1599px) {
|
|
|
+ header.header-two .mainmenu-area {
|
|
|
+ padding: 0;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 992px) and (max-width: 1200px) {
|
|
|
+ header.header-two .mainmenu-area {
|
|
|
+ padding: 0;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 768px) and (max-width: 991px) {
|
|
|
+ header.header-two .mainmenu-area {
|
|
|
+ padding: 15px 95px 15px 0;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 767px) {
|
|
|
+ header.header-two .mainmenu-area {
|
|
|
+ padding: 15px 95px 15px 0;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 575px) {
|
|
|
+ header.header-two .mainmenu-area {
|
|
|
+ margin-top: 0;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+header.header-two .mainmenu-area .main-menu {
|
|
|
+ grid-column-gap: 90px;
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 1200px) and (max-width: 1599px) {
|
|
|
+ header.header-two .mainmenu-area .main-menu {
|
|
|
+ grid-column-gap: 60px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 992px) and (max-width: 1200px) {
|
|
|
+ header.header-two .mainmenu-area .main-menu {
|
|
|
+ grid-column-gap: 30px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+header.header-two .mainmenu-area .main-right {
|
|
|
+ text-align: right;
|
|
|
+}
|
|
|
+
|
|
|
+header.header-two .mainmenu-area .main-right .offcanvas-trigger {
|
|
|
+ margin-left: 50px;
|
|
|
+}
|
|
|
+
|
|
|
+header.header-two .mainmenu-area .main-right .quote-icon {
|
|
|
+ text-align: left;
|
|
|
+ padding-left: 80px;
|
|
|
+ position: relative;
|
|
|
+}
|
|
|
+
|
|
|
+header.header-two .mainmenu-area .main-right .quote-icon .icon {
|
|
|
+ position: absolute;
|
|
|
+ left: 0;
|
|
|
+ top: 50%;
|
|
|
+ -webkit-transform: translateY(-50%);
|
|
|
+ transform: translateY(-50%);
|
|
|
+}
|
|
|
+
|
|
|
+header.header-two .mainmenu-area .main-right .quote-icon span {
|
|
|
+ font-weight: 700;
|
|
|
+ font-size: 14px;
|
|
|
+ color: #041d38;
|
|
|
+ font-family: "Oswald", sans-serif;
|
|
|
+ line-height: 24px;
|
|
|
+ text-transform: uppercase;
|
|
|
+}
|
|
|
+
|
|
|
+header.header-two .mainmenu-area .main-right .quote-icon span span {
|
|
|
+ display: block;
|
|
|
+ font-size: 20px;
|
|
|
+ color: #ffaa17;
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 767px) {
|
|
|
+ header.header-two .mainmenu-area .main-right .quote-icon span span {
|
|
|
+ font-size: 18px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+header.header-three .mainmenu-area {
|
|
|
+ background-color: transparent;
|
|
|
+ padding: 15px 0;
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 768px) and (max-width: 991px) {
|
|
|
+ header.header-three .mainmenu-area {
|
|
|
+ padding: 15px 95px 15px 0;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 767px) {
|
|
|
+ header.header-three .mainmenu-area {
|
|
|
+ padding: 15px 95px 15px 0;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+header.header-three .mainmenu-area .main-menu {
|
|
|
+ grid-column-gap: 75px;
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 1200px) and (max-width: 1599px) {
|
|
|
+ header.header-three .mainmenu-area .main-menu {
|
|
|
+ grid-column-gap: 40px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 992px) and (max-width: 1200px) {
|
|
|
+ header.header-three .mainmenu-area .main-menu {
|
|
|
+ grid-column-gap: 30px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+header.header-three .mainmenu-area .main-menu .logo img.sticky-logo {
|
|
|
+ display: none;
|
|
|
+}
|
|
|
+
|
|
|
+header.header-three .mainmenu-area .main-menu .menu-items ul li {
|
|
|
+ margin-right: 30px;
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 992px) and (max-width: 1200px) {
|
|
|
+ header.header-three .mainmenu-area .main-menu .menu-items ul li {
|
|
|
+ margin-right: 0;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+header.header-three .mainmenu-area .main-menu .menu-items ul li a {
|
|
|
+ color: #fff;
|
|
|
+ line-height: 90px;
|
|
|
+}
|
|
|
+
|
|
|
+header.header-three .mainmenu-area .main-menu .menu-items ul li.active>a {
|
|
|
+ color: #ffaa17;
|
|
|
+}
|
|
|
+
|
|
|
+header.header-three .mainmenu-area .main-right .main-btn.btn-filled:hover {
|
|
|
+ background-color: #fff;
|
|
|
+}
|
|
|
+
|
|
|
+header.header-three .mainmenu-area .main-right .main-btn.btn-filled:hover::after,
|
|
|
+header.header-three .mainmenu-area .main-right .main-btn.btn-filled:hover::before {
|
|
|
+ background-color: #041d38;
|
|
|
+}
|
|
|
+
|
|
|
+header.header-three .mainmenu-area .main-right .offcanvas-trigger {
|
|
|
+ background-color: #fff;
|
|
|
+ border-color: #fff;
|
|
|
+ color: #041d38;
|
|
|
+}
|
|
|
+
|
|
|
+header.header-three .mainmenu-area .main-right .offcanvas-trigger:hover {
|
|
|
+ background-color: #ffaa17;
|
|
|
+ border-color: #ffaa17;
|
|
|
+}
|
|
|
+
|
|
|
+header.header-three .mobile-menu.mean-container .mean-bar a.meanmenu-reveal {
|
|
|
+ border-color: #fff;
|
|
|
+ background-color: #fff;
|
|
|
+}
|
|
|
+
|
|
|
+header.header-three.sticky .mainmenu-area .main-menu .logo img.sticky-logo {
|
|
|
+ display: block;
|
|
|
+}
|
|
|
+
|
|
|
+header.header-three.sticky .mainmenu-area .main-menu .logo img.normal-logo {
|
|
|
+ display: none;
|
|
|
+}
|
|
|
+
|
|
|
+header.sticky {
|
|
|
+ position: fixed;
|
|
|
+ top: 0;
|
|
|
+ left: 0;
|
|
|
+ right: 0;
|
|
|
+ background: rgba(0, 0, 0, .5);
|
|
|
+ /* background: rgba(0, 0, 0, .1); */
|
|
|
+ -webkit-box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.04);
|
|
|
+ box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.04);
|
|
|
+ z-index: 99;
|
|
|
+ -webkit-animation: sticky 1.2s;
|
|
|
+ animation: sticky 1.2s;
|
|
|
+}
|
|
|
+
|
|
|
+header.sticky .mainmenu-area {
|
|
|
+ margin-top: 0;
|
|
|
+}
|
|
|
+
|
|
|
+header.sticky .mainmenu-area .main-menu .menu-items ul li a {
|
|
|
+ /* line-height: 90px; */
|
|
|
+}
|
|
|
+
|
|
|
+header.sticky .header-top-area {
|
|
|
+ display: none;
|
|
|
+}
|
|
|
+
|
|
|
+header.sticky.header-three .mainmenu-area {
|
|
|
+ padding: 0;
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 768px) and (max-width: 991px) {
|
|
|
+ header.sticky.header-three .mainmenu-area {
|
|
|
+ padding: 15px 95px 15px 0;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 767px) {
|
|
|
+ header.sticky.header-three .mainmenu-area {
|
|
|
+ padding: 15px 95px 15px 0;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+header.sticky.header-three .mainmenu-area .main-menu .menu-items ul li a {
|
|
|
+ color: #041d38;
|
|
|
+}
|
|
|
+
|
|
|
+header.sticky.header-three .mainmenu-area .offcanvas-trigger {
|
|
|
+ background-color: #ffaa17;
|
|
|
+ border-color: #ffaa17;
|
|
|
+ color: #041d38;
|
|
|
+}
|
|
|
+
|
|
|
+header.sticky.header-three .mainmenu-area .offcanvas-trigger:hover {
|
|
|
+ background: transparent;
|
|
|
+ border-color: rgba(4, 29, 56, 0.1);
|
|
|
+}
|
|
|
+
|
|
|
+header.sticky.header-three .mobile-menu.mean-container .mean-bar a.meanmenu-reveal {
|
|
|
+ border-color: rgba(4, 29, 56, 0.1);
|
|
|
+ background-color: transparent;
|
|
|
+}
|
|
|
+
|
|
|
+header .off-canvas-wrap {
|
|
|
+ position: fixed;
|
|
|
+ width: 450px;
|
|
|
+ top: 0;
|
|
|
+ min-height: 100vh;
|
|
|
+ right: 0;
|
|
|
+ -webkit-transition: all 0.4s;
|
|
|
+ transition: all 0.4s;
|
|
|
+ z-index: 9999999;
|
|
|
+ margin-right: -450px;
|
|
|
+ -webkit-box-shadow: 0px 8px 16px 0px rgba(73, 167, 211, 0.08);
|
|
|
+ box-shadow: 0px 8px 16px 0px rgba(73, 167, 211, 0.08);
|
|
|
+ text-align: left;
|
|
|
+}
|
|
|
+
|
|
|
+header .off-canvas-wrap.show-off-canvas {
|
|
|
+ margin-right: 0;
|
|
|
+}
|
|
|
+
|
|
|
+header .off-canvas-wrap .overly {
|
|
|
+ position: fixed;
|
|
|
+ height: 100vh;
|
|
|
+ width: 100%;
|
|
|
+ z-index: 998;
|
|
|
+ background-color: #000;
|
|
|
+ left: 0;
|
|
|
+ top: 0;
|
|
|
+ -webkit-transition: all 0.4s;
|
|
|
+ transition: all 0.4s;
|
|
|
+ opacity: 0;
|
|
|
+ visibility: hidden;
|
|
|
+ cursor: pointer;
|
|
|
+}
|
|
|
+
|
|
|
+header .off-canvas-wrap .overly.show-overly {
|
|
|
+ visibility: visible;
|
|
|
+ opacity: 0.6;
|
|
|
+}
|
|
|
+
|
|
|
+header .off-canvas-wrap .off-canvas-widget {
|
|
|
+ padding: 90px 50px;
|
|
|
+ background-color: #fff;
|
|
|
+ height: 100vh;
|
|
|
+ /* height: 860px; */
|
|
|
+ position: relative;
|
|
|
+ z-index: 999;
|
|
|
+}
|
|
|
+
|
|
|
+header .off-canvas-wrap .off-canvas-widget a.off-canvas-close {
|
|
|
+ position: absolute;
|
|
|
+ right: 50px;
|
|
|
+ top: 40px;
|
|
|
+ font-size: 30px;
|
|
|
+ color: #041d38;
|
|
|
+}
|
|
|
+
|
|
|
+header .off-canvas-wrap .off-canvas-widget .widget {
|
|
|
+ margin-bottom: 50px;
|
|
|
+}
|
|
|
+
|
|
|
+header .off-canvas-wrap .off-canvas-widget .widget:last-child {
|
|
|
+ margin-bottom: 0;
|
|
|
+}
|
|
|
+
|
|
|
+header .off-canvas-wrap .off-canvas-widget .widget .widget-title {
|
|
|
+ font-size: 20px;
|
|
|
+ margin-bottom: 20px;
|
|
|
+ text-transform: uppercase;
|
|
|
+ letter-spacing: -1px;
|
|
|
+}
|
|
|
+
|
|
|
+header .off-canvas-wrap .off-canvas-widget .widget.recent-post ul li {
|
|
|
+ display: -ms-grid;
|
|
|
+ display: grid;
|
|
|
+ -ms-grid-rows: auto;
|
|
|
+ grid-template-rows: auto;
|
|
|
+ -ms-grid-columns: 120px 1fr;
|
|
|
+ grid-template-columns: 120px 1fr;
|
|
|
+ margin-bottom: 30px;
|
|
|
+}
|
|
|
+
|
|
|
+header .off-canvas-wrap .off-canvas-widget .widget.recent-post ul li:last-child {
|
|
|
+ margin-bottom: 0;
|
|
|
+}
|
|
|
+
|
|
|
+header .off-canvas-wrap .off-canvas-widget .widget.recent-post ul li .post-img {
|
|
|
+ background-size: cover;
|
|
|
+ background-position: center;
|
|
|
+}
|
|
|
+
|
|
|
+header .off-canvas-wrap .off-canvas-widget .widget.recent-post ul li .post-content {
|
|
|
+ padding-left: 20px;
|
|
|
+}
|
|
|
+
|
|
|
+header .off-canvas-wrap .off-canvas-widget .widget.recent-post ul li .post-content h6 {
|
|
|
+ margin-bottom: 15px;
|
|
|
+ font-size: 18px;
|
|
|
+ text-transform: uppercase;
|
|
|
+ letter-spacing: -1px;
|
|
|
+ line-height: 1.3;
|
|
|
+}
|
|
|
+
|
|
|
+header .off-canvas-wrap .off-canvas-widget .widget.recent-post ul li .post-content .time {
|
|
|
+ font-size: 15px;
|
|
|
+ font-weight: 500;
|
|
|
+}
|
|
|
+
|
|
|
+header .off-canvas-wrap .off-canvas-widget .widget.recent-post ul li .post-content .time i {
|
|
|
+ margin-right: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+header .off-canvas-wrap .off-canvas-widget .widget.contact-widget ul li {
|
|
|
+ font-size: 18px;
|
|
|
+ color: #041d38;
|
|
|
+ font-weight: 600;
|
|
|
+ margin-bottom: 10px;
|
|
|
+ padding-left: 25px;
|
|
|
+ position: relative;
|
|
|
+}
|
|
|
+
|
|
|
+header .off-canvas-wrap .off-canvas-widget .widget.contact-widget ul li i {
|
|
|
+ position: absolute;
|
|
|
+ left: 0;
|
|
|
+ top: 50%;
|
|
|
+ -webkit-transform: translateY(-50%);
|
|
|
+ transform: translateY(-50%);
|
|
|
+ font-size: 15px;
|
|
|
+}
|
|
|
+
|
|
|
+header .off-canvas-wrap .off-canvas-widget .widget.contact-widget ul li a {
|
|
|
+ color: #041d38;
|
|
|
+}
|
|
|
+
|
|
|
+header .off-canvas-wrap .off-canvas-widget .widget.social-widget ul li a {
|
|
|
+ height: 40px;
|
|
|
+ width: 40px;
|
|
|
+ line-height: 40px;
|
|
|
+ border: 1px solid #041d38;
|
|
|
+ color: #041d38;
|
|
|
+ border-radius: 50%;
|
|
|
+ text-align: center;
|
|
|
+ font-size: 15px;
|
|
|
+ margin-right: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+header .off-canvas-wrap .off-canvas-widget .widget.social-widget ul li a:hover {
|
|
|
+ background-color: #ffaa17;
|
|
|
+ color: #fff;
|
|
|
+ border-color: #ffaa17;
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+/*===========================
|
|
|
+ Banner
|
|
|
+===========================*/
|
|
|
+
|
|
|
+.banner-section {
|
|
|
+ position: relative;
|
|
|
+ z-index: 1;
|
|
|
+ max-width: 1920px;
|
|
|
+}
|
|
|
+
|
|
|
+.banner-section .slider-active .slick-dots {
|
|
|
+ position: absolute;
|
|
|
+ left: 50%;
|
|
|
+ bottom: 130px;
|
|
|
+ -webkit-transform: translateX(-50%);
|
|
|
+ transform: translateX(-50%);
|
|
|
+ bottom: 50px;
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 767px) {
|
|
|
+ .banner-section .slider-active .slick-dots {
|
|
|
+ bottom: 50px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 575px) {
|
|
|
+ .banner-section .slider-active .slick-dots {
|
|
|
+ bottom: 50px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.banner-section .slider-active .slick-dots li {
|
|
|
+ display: inline-block;
|
|
|
+ margin: 0 4px;
|
|
|
+}
|
|
|
+
|
|
|
+.banner-section .slider-active .slick-dots li button {
|
|
|
+ font-size: 0;
|
|
|
+ height: 15px;
|
|
|
+ width: 15px;
|
|
|
+ border: navajowhite;
|
|
|
+ border-radius: 50%;
|
|
|
+ background: white;
|
|
|
+}
|
|
|
+
|
|
|
+.banner-section .slider-active .slick-dots li.slick-active button {
|
|
|
+ background-color: #ffaa17;
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+/*===========================
|
|
|
+ About
|
|
|
+===========================*/
|
|
|
+
|
|
|
+.about-section .about-tile-gallery {
|
|
|
+ position: relative;
|
|
|
+ min-height: 620px;
|
|
|
+ border: 1px solid red;
|
|
|
+}
|
|
|
+
|
|
|
+.about-section .about-tile-gallery .col-md-6 {
|
|
|
+ border: 1px solid pink
|
|
|
+}
|
|
|
+
|
|
|
+.about-section h2 {
|
|
|
+ font-size: 32px;
|
|
|
+ font-weight: normal
|
|
|
+}
|
|
|
+
|
|
|
+.about-section .about-text p {
|
|
|
+ text-indent: 25px;
|
|
|
+ line-height: 1.8;
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 768px) and (max-width: 991px) {
|
|
|
+ .about-section .about-tile-gallery {
|
|
|
+ margin-bottom: 50px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 767px) {
|
|
|
+ .about-section .about-tile-gallery {
|
|
|
+ margin-bottom: 50px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 575px) {
|
|
|
+ .about-section .about-tile-gallery {
|
|
|
+ min-height: 450px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.about-section .about-tile-gallery img {
|
|
|
+ position: absolute;
|
|
|
+}
|
|
|
+
|
|
|
+.about-section .about-tile-gallery img.image-one {
|
|
|
+ top: 0;
|
|
|
+ left: 0;
|
|
|
+ max-width: 400px;
|
|
|
+ max-height: 450px;
|
|
|
+ z-index: 1;
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 575px) {
|
|
|
+ .about-section .about-tile-gallery img.image-one {
|
|
|
+ max-width: 100%;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.about-section .about-tile-gallery img.image-two {
|
|
|
+ right: 20px;
|
|
|
+ bottom: 0;
|
|
|
+ max-width: 400px;
|
|
|
+ max-height: 260px;
|
|
|
+ z-index: 2;
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 992px) and (max-width: 1200px) {
|
|
|
+ .about-section .about-tile-gallery img.image-two {
|
|
|
+ max-width: 340px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 575px) {
|
|
|
+ .about-section .about-tile-gallery img.image-two {
|
|
|
+ right: 0;
|
|
|
+ max-width: 300px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 399px) {
|
|
|
+ .about-section .about-tile-gallery img.image-two {
|
|
|
+ max-width: 250px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.about-section .about-tile-gallery img.image-three {
|
|
|
+ right: 20px;
|
|
|
+ top: 20px;
|
|
|
+ max-width: 160px;
|
|
|
+ z-index: 2;
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 575px) {
|
|
|
+ .about-section .about-tile-gallery img.image-three {
|
|
|
+ right: -15px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.about-section .about-tile-gallery img.icon {
|
|
|
+ top: 140px;
|
|
|
+ right: 95px;
|
|
|
+ z-index: 3;
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 992px) and (max-width: 1200px) {
|
|
|
+ .about-section .about-tile-gallery img.icon {
|
|
|
+ right: 0;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 575px) {
|
|
|
+ .about-section .about-tile-gallery img.icon {
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.about-section .about-tile-gallery img.zero-icon {
|
|
|
+ z-index: 4;
|
|
|
+ left: -45px;
|
|
|
+ bottom: 20px;
|
|
|
+}
|
|
|
+
|
|
|
+@media (min-width: 1600px) {
|
|
|
+ .about-section .about-tile-gallery img.zero-icon {
|
|
|
+ bottom: 40px;
|
|
|
+ left: -140px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 575px) {
|
|
|
+ .about-section .about-tile-gallery img.zero-icon {
|
|
|
+ left: -30px;
|
|
|
+ max-width: 150px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 767px) {
|
|
|
+ .about-section .about-text {
|
|
|
+ padding-left: 0;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.about-section .about-text .about-features .sngle-features {
|
|
|
+ margin-bottom: 30px;
|
|
|
+}
|
|
|
+
|
|
|
+.about-section .about-text .about-features .sngle-features:last-child {
|
|
|
+ margin-bottom: 0;
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 575px) {
|
|
|
+ .about-section .about-text .about-features .sngle-features {
|
|
|
+ -ms-grid-rows: 90px 1fr;
|
|
|
+ grid-template-rows: 90px 1fr;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.about-section .about-text .about-features .sngle-features .chart {
|
|
|
+ position: relative;
|
|
|
+ min-width: 94px;
|
|
|
+ min-height: 94px;
|
|
|
+ background-image: url(../img/white_round.png);
|
|
|
+}
|
|
|
+
|
|
|
+.about-section .about-text .about-features .sngle-features .chart .bg_01 {
|
|
|
+ min-width: 94px;
|
|
|
+ min-height: 94px;
|
|
|
+ background-image: url(../img/blue_round.png);
|
|
|
+ transform: rotate(270deg);
|
|
|
+ -ms-transform: rotate(270deg);
|
|
|
+ /* IE 9*/
|
|
|
+ -moz-transform: rotate(270deg);
|
|
|
+ /* Firefox */
|
|
|
+ -webkit-transform: rotate(270deg);
|
|
|
+ /* Safari 和 Chrome */
|
|
|
+ -o-transform: rotate(270deg);
|
|
|
+}
|
|
|
+
|
|
|
+.about-section .about-text .about-features .sngle-features .chart .bg_01 span {
|
|
|
+ transform: rotate(90deg);
|
|
|
+ -ms-transform: rotate(90deg);
|
|
|
+ -moz-transform: rotate(90deg);
|
|
|
+ -webkit-transform: rotate(90deg);
|
|
|
+ -o-transform: rotate(90deg);
|
|
|
+ font-size: 45px;
|
|
|
+ font-weight: 600;
|
|
|
+}
|
|
|
+
|
|
|
+.about-section .about-text .about-features .sngle-features .chart .bg_02 {
|
|
|
+ min-width: 94px;
|
|
|
+ min-height: 94px;
|
|
|
+ background-image: url(../img/blue_round.png);
|
|
|
+}
|
|
|
+
|
|
|
+.about-section .about-text .about-features .sngle-features .chart .bg_02 span {
|
|
|
+ font-size: 45px;
|
|
|
+ font-weight: 600;
|
|
|
+}
|
|
|
+
|
|
|
+.about-section .about-text .about-features .sngle-features .chart .bg_03 {
|
|
|
+ min-width: 94px;
|
|
|
+ min-height: 94px;
|
|
|
+ background-image: url(../img/blue_round.png);
|
|
|
+ transform: rotate(180deg);
|
|
|
+ -ms-transform: rotate(180deg);
|
|
|
+ -moz-transform: rotate(180deg);
|
|
|
+ -webkit-transform: rotate(180deg);
|
|
|
+ -o-transform: rotate(180deg);
|
|
|
+}
|
|
|
+
|
|
|
+.about-section .about-text .about-features .sngle-features .chart .bg_03 span {
|
|
|
+ transform: rotate(180deg);
|
|
|
+ -ms-transform: rotate(180deg);
|
|
|
+ -moz-transform: rotate(180deg);
|
|
|
+ -webkit-transform: rotate(180deg);
|
|
|
+ -o-transform: rotate(180deg);
|
|
|
+ font-size: 45px;
|
|
|
+ font-weight: 600;
|
|
|
+}
|
|
|
+
|
|
|
+.about-section .about-text .about-features .sngle-features .chart span.icon {
|
|
|
+ position: absolute;
|
|
|
+ left: 50%;
|
|
|
+ top: 50%;
|
|
|
+ -webkit-transform: translate(-50%, -50%);
|
|
|
+ transform: translate(-50%, -50%);
|
|
|
+ font-size: 30px;
|
|
|
+ color: #041d38;
|
|
|
+}
|
|
|
+
|
|
|
+.about-section .about-text .about-features .sngle-features .chart canvas {
|
|
|
+ position: absolute;
|
|
|
+ left: 0;
|
|
|
+ top: 0;
|
|
|
+}
|
|
|
+
|
|
|
+.about-section .about-text .about-features .sngle-features .counter-box {
|
|
|
+ text-align: center;
|
|
|
+ color: #ffaa17;
|
|
|
+ font-weight: 700;
|
|
|
+ font-size: 48px;
|
|
|
+ font-family: "Oswald", sans-serif;
|
|
|
+}
|
|
|
+
|
|
|
+.about-section .about-text .about-features .sngle-features .desc {
|
|
|
+ font-size: 20px;
|
|
|
+ line-height: 1.8;
|
|
|
+ padding-left: 30px;
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+/* @media (max-width: 575px) {
|
|
|
+ .about-section .about-text .about-features .sngle-features .desc {
|
|
|
+ margin-top: 20px;
|
|
|
+ grid-column: 1/-1;
|
|
|
+ }
|
|
|
+} */
|
|
|
+
|
|
|
+.about-section .about-text .about-features .sngle-features .desc h4 {
|
|
|
+ margin-bottom: 15px;
|
|
|
+ text-transform: uppercase;
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 992px) and (max-width: 1200px) {
|
|
|
+ .about-section .about-text .about-features .sngle-features .desc h4 {
|
|
|
+ font-size: 20px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.about-section .about-text .about-extra {
|
|
|
+ padding-left: 215px;
|
|
|
+ position: relative;
|
|
|
+ margin-top: 80px;
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 992px) and (max-width: 1200px) {
|
|
|
+ .about-section .about-text .about-extra {
|
|
|
+ margin-top: 50px;
|
|
|
+ padding-left: 180px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 768px) and (max-width: 991px) {
|
|
|
+ .about-section .about-text .about-extra {
|
|
|
+ margin-top: 30px;
|
|
|
+ padding-left: 0;
|
|
|
+ padding-bottom: 200px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 767px) {
|
|
|
+ .about-section .about-text .about-extra {
|
|
|
+ margin-top: 30px;
|
|
|
+ padding-left: 0;
|
|
|
+ padding-bottom: 200px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 575px) {
|
|
|
+ .about-section .about-text .about-extra {
|
|
|
+ padding-bottom: 150px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.about-section .about-text .about-extra .experience-tag {
|
|
|
+ position: absolute;
|
|
|
+ left: -335px;
|
|
|
+ top: 50%;
|
|
|
+ -webkit-transform: translateY(-50%);
|
|
|
+ transform: translateY(-50%);
|
|
|
+ z-index: 6;
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 1200px) and (max-width: 1599px) {
|
|
|
+ .about-section .about-text .about-extra .experience-tag {
|
|
|
+ left: -315px;
|
|
|
+ max-width: 500px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 992px) and (max-width: 1200px) {
|
|
|
+ .about-section .about-text .about-extra .experience-tag {
|
|
|
+ left: -220px;
|
|
|
+ max-width: 350px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 768px) and (max-width: 991px) {
|
|
|
+ .about-section .about-text .about-extra .experience-tag {
|
|
|
+ left: 0;
|
|
|
+ bottom: 0;
|
|
|
+ -webkit-transform: translate(0, 0);
|
|
|
+ transform: translate(0, 0);
|
|
|
+ top: auto;
|
|
|
+ max-width: 100%;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 767px) {
|
|
|
+ .about-section .about-text .about-extra .experience-tag {
|
|
|
+ left: 0;
|
|
|
+ bottom: 0;
|
|
|
+ -webkit-transform: translate(0, 0);
|
|
|
+ transform: translate(0, 0);
|
|
|
+ top: auto;
|
|
|
+ max-width: 100%;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.about-section .about-tile-gallery-two {
|
|
|
+ min-height: 550px;
|
|
|
+ position: relative;
|
|
|
+ z-index: 5;
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 992px) and (max-width: 1200px) {
|
|
|
+ .about-section .about-tile-gallery-two {
|
|
|
+ min-height: 515px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 768px) and (max-width: 991px) {
|
|
|
+ .about-section .about-tile-gallery-two {
|
|
|
+ margin-bottom: 50px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 767px) {
|
|
|
+ .about-section .about-tile-gallery-two {
|
|
|
+ margin-bottom: 50px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 575px) {
|
|
|
+ .about-section .about-tile-gallery-two {
|
|
|
+ min-height: 410px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.about-section .about-tile-gallery-two .image-two {
|
|
|
+ position: absolute;
|
|
|
+ left: -20px;
|
|
|
+ bottom: 0;
|
|
|
+ border-right: 20px solid #fff;
|
|
|
+ border-top: 20px solid #fff;
|
|
|
+ z-index: 1;
|
|
|
+}
|
|
|
+
|
|
|
+@media (min-width: 1600px) {
|
|
|
+ .about-section .about-tile-gallery-two .image-two {
|
|
|
+ left: -120px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 575px) {
|
|
|
+ .about-section .about-tile-gallery-two .image-two {
|
|
|
+ left: -15px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.about-section.about-style-two .about-iconic-boxes {
|
|
|
+ margin-bottom: -60px;
|
|
|
+ z-index: 22;
|
|
|
+ position: relative;
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 768px) and (max-width: 991px) {
|
|
|
+ .about-section.about-style-two .about-iconic-boxes {
|
|
|
+ margin-bottom: -240px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 767px) {
|
|
|
+ .about-section.about-style-two .about-iconic-boxes {
|
|
|
+ margin-bottom: -240px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.about-section.about-style-two .about-iconic-boxes .iconic-box {
|
|
|
+ padding: 30px 35px;
|
|
|
+ background-color: #fff;
|
|
|
+ -webkit-box-shadow: 0px 10px 20px 0px rgba(149, 183, 208, 0.06);
|
|
|
+ box-shadow: 0px 10px 20px 0px rgba(149, 183, 208, 0.06);
|
|
|
+ position: relative;
|
|
|
+ z-index: 1;
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 992px) and (max-width: 1200px) {
|
|
|
+ .about-section.about-style-two .about-iconic-boxes .iconic-box {
|
|
|
+ padding: 30px 25px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 768px) and (max-width: 991px) {
|
|
|
+ .about-section.about-style-two .about-iconic-boxes .iconic-box {
|
|
|
+ margin-bottom: 30px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 767px) {
|
|
|
+ .about-section.about-style-two .about-iconic-boxes .iconic-box {
|
|
|
+ margin-bottom: 30px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 399px) {
|
|
|
+ .about-section.about-style-two .about-iconic-boxes .iconic-box {
|
|
|
+ padding: 30px 25px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.about-section.about-style-two .about-iconic-boxes .iconic-box h4 {
|
|
|
+ text-transform: uppercase;
|
|
|
+ letter-spacing: -1px;
|
|
|
+ margin-bottom: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 992px) and (max-width: 1200px) {
|
|
|
+ .about-section.about-style-two .about-iconic-boxes .iconic-box h4 {
|
|
|
+ font-size: 20px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 399px) {
|
|
|
+ .about-section.about-style-two .about-iconic-boxes .iconic-box h4 {
|
|
|
+ font-size: 20px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.about-section.about-style-two .about-iconic-boxes .iconic-box .icon {
|
|
|
+ position: absolute;
|
|
|
+ right: 35px;
|
|
|
+ top: 30px;
|
|
|
+ height: 30px;
|
|
|
+ width: 30px;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 30px;
|
|
|
+ background-color: #ffaa17;
|
|
|
+ color: #041d38;
|
|
|
+ z-index: 2;
|
|
|
+}
|
|
|
+
|
|
|
+.about-section.about-style-two .about-iconic-boxes .iconic-box .count {
|
|
|
+ position: absolute;
|
|
|
+ left: 0;
|
|
|
+ bottom: 0;
|
|
|
+ font-weight: 700;
|
|
|
+ font-family: "Oswald", sans-serif;
|
|
|
+ font-size: 70px;
|
|
|
+ color: #f7fcff;
|
|
|
+ z-index: -1;
|
|
|
+ line-height: 1;
|
|
|
+}
|
|
|
+
|
|
|
+.about-section.about-style-two .about-text-warp {
|
|
|
+ background-color: #f7fcff;
|
|
|
+ position: relative;
|
|
|
+ z-index: 1;
|
|
|
+ padding-top: 120px;
|
|
|
+ padding-bottom: 120px;
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 768px) and (max-width: 991px) {
|
|
|
+ .about-section.about-style-two .about-text-warp {
|
|
|
+ padding-top: 280px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 767px) {
|
|
|
+ .about-section.about-style-two .about-text-warp {
|
|
|
+ padding-top: 280px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.about-section.about-style-two .about-text-warp .mockup-img {
|
|
|
+ position: absolute;
|
|
|
+ right: 0;
|
|
|
+ bottom: -110px;
|
|
|
+ max-width: 1000px;
|
|
|
+ z-index: -1;
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 1200px) and (max-width: 1599px) {
|
|
|
+ .about-section.about-style-two .about-text-warp .mockup-img {
|
|
|
+ max-width: 800px;
|
|
|
+ bottom: -80px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 992px) and (max-width: 1200px) {
|
|
|
+ .about-section.about-style-two .about-text-warp .mockup-img {
|
|
|
+ max-width: 575px;
|
|
|
+ bottom: 42%;
|
|
|
+ -webkit-transform: translateY(50%);
|
|
|
+ transform: translateY(50%);
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 768px) and (max-width: 991px) {
|
|
|
+ .about-section.about-style-two .about-text-warp .mockup-img {
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 767px) {
|
|
|
+ .about-section.about-style-two .about-text-warp .mockup-img {
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.about-section.about-style-two .about-text-warp .about-small-img {
|
|
|
+ position: absolute;
|
|
|
+ top: 53%;
|
|
|
+ left: 49%;
|
|
|
+ z-index: 1;
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 1200px) and (max-width: 1599px) {
|
|
|
+ .about-section.about-style-two .about-text-warp .about-small-img {
|
|
|
+ left: 44%;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 992px) and (max-width: 1200px) {
|
|
|
+ .about-section.about-style-two .about-text-warp .about-small-img {
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 768px) and (max-width: 991px) {
|
|
|
+ .about-section.about-style-two .about-text-warp .about-small-img {
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 767px) {
|
|
|
+ .about-section.about-style-two .about-text-warp .about-small-img {
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 768px) and (max-width: 991px) {
|
|
|
+ .about-section .about-img {
|
|
|
+ margin-bottom: 50px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 767px) {
|
|
|
+ .about-section .about-img {
|
|
|
+ margin-bottom: 50px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.about-section .with-man-shape {
|
|
|
+ position: relative;
|
|
|
+ padding-top: 150px;
|
|
|
+ padding-bottom: 150px;
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 992px) and (max-width: 1200px) {
|
|
|
+ .about-section .with-man-shape {
|
|
|
+ padding-top: 120px;
|
|
|
+ padding-bottom: 60px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 768px) and (max-width: 991px) {
|
|
|
+ .about-section .with-man-shape {
|
|
|
+ padding-top: 120px;
|
|
|
+ padding-bottom: 500px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 767px) {
|
|
|
+ .about-section .with-man-shape {
|
|
|
+ padding-top: 120px;
|
|
|
+ padding-bottom: 360px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 575px) {
|
|
|
+ .about-section .with-man-shape {
|
|
|
+ padding-bottom: 280px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 399px) {
|
|
|
+ .about-section .with-man-shape {
|
|
|
+ padding-bottom: 120px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.about-section .with-man-shape .about-man-img {
|
|
|
+ position: absolute;
|
|
|
+ left: 0;
|
|
|
+ bottom: 0;
|
|
|
+ max-width: 575px;
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 992px) and (max-width: 1200px) {
|
|
|
+ .about-section .with-man-shape .about-man-img {
|
|
|
+ max-width: 450px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 768px) and (max-width: 991px) {
|
|
|
+ .about-section .with-man-shape .about-man-img {
|
|
|
+ left: 50%;
|
|
|
+ max-width: 345px;
|
|
|
+ -webkit-transform: translateX(-50%);
|
|
|
+ transform: translateX(-50%);
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 767px) {
|
|
|
+ .about-section .with-man-shape .about-man-img {
|
|
|
+ left: 50%;
|
|
|
+ max-width: 250px;
|
|
|
+ -webkit-transform: translateX(-50%);
|
|
|
+ transform: translateX(-50%);
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 399px) {
|
|
|
+ .about-section .with-man-shape .about-man-img {
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.about-section .with-man-shape .about-man-img .shape {
|
|
|
+ position: relative;
|
|
|
+ z-index: 1;
|
|
|
+}
|
|
|
+
|
|
|
+.about-section .with-man-shape .about-man-img .shape::after {
|
|
|
+ content: '';
|
|
|
+ position: absolute;
|
|
|
+ left: 50%;
|
|
|
+ -webkit-transform: translateX(-49%);
|
|
|
+ transform: translateX(-49%);
|
|
|
+ top: 100px;
|
|
|
+ background-color: #ffaa17;
|
|
|
+ height: 465px;
|
|
|
+ width: 465px;
|
|
|
+ border-radius: 50%;
|
|
|
+ z-index: -1;
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 767px) {
|
|
|
+ .about-section .with-man-shape .about-man-img .shape::after {
|
|
|
+ height: 300px;
|
|
|
+ width: 300px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.about-section .with-man-shape .about-text {
|
|
|
+ padding-left: 80px;
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 992px) and (max-width: 1200px) {
|
|
|
+ .about-section .with-man-shape .about-text {
|
|
|
+ padding-left: 20px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 768px) and (max-width: 991px) {
|
|
|
+ .about-section .with-man-shape .about-text {
|
|
|
+ padding-left: 0;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 767px) {
|
|
|
+ .about-section .with-man-shape .about-text {
|
|
|
+ padding-left: 0;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+/*===========================
|
|
|
+ Sidebar Style
|
|
|
+===========================*/
|
|
|
+
|
|
|
+@media only screen and (min-width: 768px) and (max-width: 991px) {
|
|
|
+ .sidebar {
|
|
|
+ margin-top: 80px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 767px) {
|
|
|
+ .sidebar {
|
|
|
+ margin-top: 80px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.sidebar .widget {
|
|
|
+ padding: 40px;
|
|
|
+ border: 2px solid #ededed;
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 992px) and (max-width: 1200px) {
|
|
|
+ .sidebar .widget {
|
|
|
+ padding: 40px 20px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 399px) {
|
|
|
+ .sidebar .widget {
|
|
|
+ padding: 40px 20px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.sidebar .widget .widget-title {
|
|
|
+ font-size: 20px;
|
|
|
+ text-transform: uppercase;
|
|
|
+ margin-bottom: 40px;
|
|
|
+ line-height: 1;
|
|
|
+ position: relative;
|
|
|
+ padding-left: 30px;
|
|
|
+}
|
|
|
+
|
|
|
+.sidebar .widget .widget-title::before {
|
|
|
+ position: absolute;
|
|
|
+ left: 0;
|
|
|
+ top: 0;
|
|
|
+ height: 100%;
|
|
|
+ width: 2px;
|
|
|
+ background-color: #ffaa17;
|
|
|
+ content: '';
|
|
|
+}
|
|
|
+
|
|
|
+.sidebar .widget.about-author-widget .author-box {
|
|
|
+ font-size: 14px;
|
|
|
+ text-align: center;
|
|
|
+}
|
|
|
+
|
|
|
+.sidebar .widget.about-author-widget .author-box h6 {
|
|
|
+ font-size: 18px;
|
|
|
+ text-transform: uppercase;
|
|
|
+ letter-spacing: -1px;
|
|
|
+ margin-top: 30px;
|
|
|
+ padding-bottom: 20px;
|
|
|
+}
|
|
|
+
|
|
|
+.sidebar .widget.about-author-widget .author-box .social-icon {
|
|
|
+ margin-top: 25px;
|
|
|
+}
|
|
|
+
|
|
|
+.sidebar .widget.about-author-widget .author-box .social-icon li {
|
|
|
+ display: inline-block;
|
|
|
+ margin: 0 5px;
|
|
|
+}
|
|
|
+
|
|
|
+.sidebar .widget.about-author-widget .author-box .social-icon li a {
|
|
|
+ padding: 5px;
|
|
|
+ color: #b3bed3;
|
|
|
+}
|
|
|
+
|
|
|
+.sidebar .widget.about-author-widget .author-box .social-icon li a:hover {
|
|
|
+ color: #ffaa17;
|
|
|
+}
|
|
|
+
|
|
|
+.sidebar .widget.search-widget form {
|
|
|
+ position: relative;
|
|
|
+}
|
|
|
+
|
|
|
+.sidebar .widget.search-widget form input {
|
|
|
+ width: 100%;
|
|
|
+ background-color: #f6f4ff;
|
|
|
+ height: 60px;
|
|
|
+ border: none;
|
|
|
+ padding-left: 30px;
|
|
|
+ padding-right: 60px;
|
|
|
+ font-size: 14px;
|
|
|
+}
|
|
|
+
|
|
|
+.sidebar .widget.search-widget form button {
|
|
|
+ border: none;
|
|
|
+ position: absolute;
|
|
|
+ right: 0;
|
|
|
+ top: 0;
|
|
|
+ width: 60px;
|
|
|
+ height: 100%;
|
|
|
+ z-index: 1;
|
|
|
+ background-color: #ffaa17;
|
|
|
+ font-size: 14px;
|
|
|
+ -webkit-transition: all 0.3s ease-out 0s;
|
|
|
+ transition: all 0.3s ease-out 0s;
|
|
|
+}
|
|
|
+
|
|
|
+.sidebar .widget.search-widget form button:hover {
|
|
|
+ background-color: #041d38;
|
|
|
+ color: #fff;
|
|
|
+}
|
|
|
+
|
|
|
+.sidebar .widget.popular-feeds .single-popular-feed {
|
|
|
+ display: -ms-grid;
|
|
|
+ display: grid;
|
|
|
+ -ms-grid-rows: 1fr;
|
|
|
+ grid-template-rows: 1fr;
|
|
|
+ -ms-grid-columns: 80px 1fr;
|
|
|
+ grid-template-columns: 80px 1fr;
|
|
|
+ grid-column-gap: 15px;
|
|
|
+ margin-bottom: 30px;
|
|
|
+ padding-bottom: 30px;
|
|
|
+ border-bottom: 1px solid #e1e6ff;
|
|
|
+ -webkit-box-align: center;
|
|
|
+ -ms-flex-align: center;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+
|
|
|
+.sidebar .widget.popular-feeds .single-popular-feed:last-child {
|
|
|
+ margin-bottom: 0;
|
|
|
+ padding-bottom: 0;
|
|
|
+ border: none;
|
|
|
+}
|
|
|
+
|
|
|
+.sidebar .widget.popular-feeds .single-popular-feed .feed-desc h6 {
|
|
|
+ text-transform: uppercase;
|
|
|
+ font-size: 16px;
|
|
|
+ margin-bottom: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.sidebar .widget.popular-feeds .single-popular-feed .feed-desc .time {
|
|
|
+ font-size: 14px;
|
|
|
+}
|
|
|
+
|
|
|
+.sidebar .widget.popular-feeds .single-popular-feed .feed-desc .time i {
|
|
|
+ margin-right: 5px;
|
|
|
+}
|
|
|
+
|
|
|
+.sidebar .widget.categories-widget ul li {
|
|
|
+ margin-bottom: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.sidebar .widget.categories-widget ul li:last-child {
|
|
|
+ margin-bottom: 0;
|
|
|
+}
|
|
|
+
|
|
|
+.sidebar .widget.categories-widget ul li a {
|
|
|
+ font-size: 14px;
|
|
|
+ padding-left: 30px;
|
|
|
+ height: 50px;
|
|
|
+ background-color: #edf3ff;
|
|
|
+ display: block;
|
|
|
+ position: relative;
|
|
|
+ line-height: 50px;
|
|
|
+ color: #041d38;
|
|
|
+ -webkit-transition: all 0.3s ease-out 0s;
|
|
|
+ transition: all 0.3s ease-out 0s;
|
|
|
+}
|
|
|
+
|
|
|
+.sidebar .widget.categories-widget ul li a span {
|
|
|
+ position: absolute;
|
|
|
+ right: 0;
|
|
|
+ top: 0;
|
|
|
+ width: 50px;
|
|
|
+ height: 50px;
|
|
|
+ line-height: 50px;
|
|
|
+ text-align: center;
|
|
|
+ background-color: #d8e5ff;
|
|
|
+ -webkit-transition: all 0.3s ease-out 0s;
|
|
|
+ transition: all 0.3s ease-out 0s;
|
|
|
+}
|
|
|
+
|
|
|
+.sidebar .widget.categories-widget ul li a:hover {
|
|
|
+ background-color: #ffaa17;
|
|
|
+}
|
|
|
+
|
|
|
+.sidebar .widget.categories-widget ul li a:hover span {
|
|
|
+ background-color: #ffc35c;
|
|
|
+}
|
|
|
+
|
|
|
+.sidebar .widget.socail-widget ul li {
|
|
|
+ display: inline-block;
|
|
|
+ margin-right: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 992px) and (max-width: 1200px) {
|
|
|
+ .sidebar .widget.socail-widget ul li {
|
|
|
+ margin-right: 5px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 399px) {
|
|
|
+ .sidebar .widget.socail-widget ul li {
|
|
|
+ margin-right: 5px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.sidebar .widget.socail-widget ul li a {
|
|
|
+ height: 40px;
|
|
|
+ width: 40px;
|
|
|
+ line-height: 40px;
|
|
|
+ font-size: 14px;
|
|
|
+ color: #041d38;
|
|
|
+ background-color: #edf3ff;
|
|
|
+ text-align: center;
|
|
|
+}
|
|
|
+
|
|
|
+.sidebar .widget.socail-widget ul li a:hover {
|
|
|
+ background-color: #ffaa17;
|
|
|
+}
|
|
|
+
|
|
|
+.sidebar .widget.twitter-feed-widget ul li {
|
|
|
+ margin-bottom: 30px;
|
|
|
+ padding-bottom: 30px;
|
|
|
+ font-size: 12px;
|
|
|
+ border-bottom: 1px solid #e1e6ff;
|
|
|
+ padding-left: 35px;
|
|
|
+ position: relative;
|
|
|
+}
|
|
|
+
|
|
|
+.sidebar .widget.twitter-feed-widget ul li::before {
|
|
|
+ position: absolute;
|
|
|
+ left: 0;
|
|
|
+ top: 0;
|
|
|
+ content: '\f099';
|
|
|
+ font-family: 'Font Awesome 5 Brands';
|
|
|
+ font-size: 14px;
|
|
|
+ color: #ffaa17;
|
|
|
+}
|
|
|
+
|
|
|
+.sidebar .widget.twitter-feed-widget ul li:last-child {
|
|
|
+ margin-bottom: 0;
|
|
|
+ padding-bottom: 0;
|
|
|
+ border: none;
|
|
|
+}
|
|
|
+
|
|
|
+.sidebar .widget.twitter-feed-widget ul li a {
|
|
|
+ color: #041d38;
|
|
|
+}
|
|
|
+
|
|
|
+.sidebar .widget.twitter-feed-widget ul li .date {
|
|
|
+ text-transform: uppercase;
|
|
|
+ margin-top: 15px;
|
|
|
+ font-weight: 500;
|
|
|
+}
|
|
|
+
|
|
|
+.sidebar .widget.instagram-feed-widget ul {
|
|
|
+ display: -ms-flexbox!important;
|
|
|
+ display: flex!important;
|
|
|
+ -ms-flex-pack: start!important;
|
|
|
+ justify-content: flex-start!important;
|
|
|
+ -ms-flex-align: center!important;
|
|
|
+ align-items: center!important;
|
|
|
+}
|
|
|
+
|
|
|
+.sidebar .widget.popular-tag-widget ul li {
|
|
|
+ display: inline-block;
|
|
|
+ margin-right: 5px;
|
|
|
+ margin-bottom: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.sidebar .widget.popular-tag-widget ul li a {
|
|
|
+ font-size: 12px;
|
|
|
+ color: #041d38;
|
|
|
+ padding: 10px 20px;
|
|
|
+ background-color: #f4f4f4;
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 992px) and (max-width: 1200px) {
|
|
|
+ .sidebar .widget.popular-tag-widget ul li a {
|
|
|
+ padding: 10px 15px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 399px) {
|
|
|
+ .sidebar .widget.popular-tag-widget ul li a {
|
|
|
+ padding: 10px 15px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.sidebar .widget.popular-tag-widget ul li a:hover {
|
|
|
+ background-color: #ffaa17;
|
|
|
+}
|
|
|
+
|
|
|
+.sidebar .widget.banner-ad-widget {
|
|
|
+ padding: 0;
|
|
|
+ border: none;
|
|
|
+}
|
|
|
+
|
|
|
+.sidebar .widget.contact-widget .input-group {
|
|
|
+ margin-top: -2px;
|
|
|
+}
|
|
|
+
|
|
|
+.sidebar .widget.service-cat-widget li a,
|
|
|
+.sidebar .widget.brouchers-widget li a {
|
|
|
+ display: block;
|
|
|
+ border: 2px solid #ededed;
|
|
|
+ padding: 15px 30px;
|
|
|
+ text-transform: uppercase;
|
|
|
+ color: #041d38;
|
|
|
+ font-family: "Oswald", sans-serif;
|
|
|
+ font-weight: 600;
|
|
|
+ font-size: 14px;
|
|
|
+}
|
|
|
+
|
|
|
+.sidebar .widget.service-cat-widget li a:hover,
|
|
|
+.sidebar .widget.brouchers-widget li a:hover {
|
|
|
+ background-color: #ffaa17;
|
|
|
+ color: #fff;
|
|
|
+ border-color: #ffaa17;
|
|
|
+}
|
|
|
+
|
|
|
+.sidebar .widget.service-cat-widget li:not(:last-child) a,
|
|
|
+.sidebar .widget.brouchers-widget li:not(:last-child) a {
|
|
|
+ border-bottom: none;
|
|
|
+}
|
|
|
+
|
|
|
+.sidebar .widget.brouchers-widget li a i {
|
|
|
+ margin-right: 20px;
|
|
|
+ color: #ffaa17;
|
|
|
+ -webkit-transition: all 0.3s ease-out 0s;
|
|
|
+ transition: all 0.3s ease-out 0s;
|
|
|
+}
|
|
|
+
|
|
|
+.sidebar .widget.brouchers-widget li a:hover i {
|
|
|
+ color: #fff;
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+/*===========================
|
|
|
+ Footer
|
|
|
+===========================*/
|
|
|
+
|
|
|
+footer {
|
|
|
+ background-color: #2B2F42;
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 575px) {
|
|
|
+ footer .social-icon {
|
|
|
+ margin-top: 30px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+footer .social-icon a {
|
|
|
+ text-align: center;
|
|
|
+ background-color: #14212b;
|
|
|
+ color: #fff;
|
|
|
+ height: 60px;
|
|
|
+ width: 60px;
|
|
|
+ line-height: 60px;
|
|
|
+ border-radius: 50%;
|
|
|
+ margin-left: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 767px) {
|
|
|
+ footer .social-icon a {
|
|
|
+ font-size: 15px;
|
|
|
+ line-height: 45px;
|
|
|
+ height: 45px;
|
|
|
+ width: 45px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 399px) {
|
|
|
+ footer .social-icon a {
|
|
|
+ margin-left: 5px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+footer .social-icon a:hover {
|
|
|
+ background-color: #ffaa17;
|
|
|
+ color: #14212b;
|
|
|
+}
|
|
|
+
|
|
|
+footer .footer-top {
|
|
|
+ background-color: #091620;
|
|
|
+ padding: 40px 0;
|
|
|
+}
|
|
|
+
|
|
|
+footer .footer-widget-area {
|
|
|
+ padding-top: 90px;
|
|
|
+ /* padding-bottom: 40px; */
|
|
|
+}
|
|
|
+
|
|
|
+footer .footer-widget-area .widget {
|
|
|
+ margin-bottom: 40px;
|
|
|
+ text-align: center
|
|
|
+}
|
|
|
+
|
|
|
+footer .footer-widget-area .widget,
|
|
|
+footer .footer-widget-area .widget a {
|
|
|
+ color: #fff;
|
|
|
+}
|
|
|
+
|
|
|
+footer .footer-widget-area .widget a:hover {
|
|
|
+ color: #ffaa17;
|
|
|
+}
|
|
|
+
|
|
|
+footer .footer-widget-area .widget .widget-title {
|
|
|
+ font-size: 20px;
|
|
|
+ text-transform: uppercase;
|
|
|
+ color: #fff;
|
|
|
+ margin-bottom: 40px;
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 768px) and (max-width: 991px) {
|
|
|
+ footer .footer-widget-area .widget .widget-title {
|
|
|
+ margin-bottom: 30px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 767px) {
|
|
|
+ footer .footer-widget-area .widget .widget-title {
|
|
|
+ margin-bottom: 30px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+footer .footer-widget-area .widget.nav-widget ul li {
|
|
|
+ line-height: 38px;
|
|
|
+}
|
|
|
+
|
|
|
+footer .footer-widget-area .widget.recent-post .post-loop .post {
|
|
|
+ display: -ms-grid;
|
|
|
+ display: grid;
|
|
|
+ -ms-grid-rows: auto;
|
|
|
+ grid-template-rows: auto;
|
|
|
+ -ms-grid-columns: 70px 1fr;
|
|
|
+ grid-template-columns: 70px 1fr;
|
|
|
+ grid-column-gap: 20px;
|
|
|
+ -webkit-box-align: center;
|
|
|
+ -ms-flex-align: center;
|
|
|
+ align-items: center;
|
|
|
+ padding-bottom: 20px;
|
|
|
+ margin-bottom: 20px;
|
|
|
+ border-bottom: 1px solid #283742;
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 576px) and (max-width: 767px) {
|
|
|
+ footer .footer-widget-area .widget.recent-post .post-loop .post {
|
|
|
+ grid-column-gap: 10px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+footer .footer-widget-area .widget.recent-post .post-loop .post:last-child {
|
|
|
+ margin-bottom: 0;
|
|
|
+ padding-bottom: 0;
|
|
|
+ border: none;
|
|
|
+}
|
|
|
+
|
|
|
+footer .footer-widget-area .widget.recent-post .post-loop .post .post-img {
|
|
|
+ max-width: 70px;
|
|
|
+ max-height: 70px;
|
|
|
+}
|
|
|
+
|
|
|
+footer .footer-widget-area .widget.recent-post .post-loop .post .time {
|
|
|
+ font-size: 12px;
|
|
|
+ color: #96abbb;
|
|
|
+ text-transform: uppercase;
|
|
|
+ font-family: "Oswald", sans-serif;
|
|
|
+ font-weight: 700;
|
|
|
+}
|
|
|
+
|
|
|
+footer .footer-widget-area .widget.recent-post .post-loop .post .time i {
|
|
|
+ color: #ffaa17;
|
|
|
+ margin-right: 2px;
|
|
|
+}
|
|
|
+
|
|
|
+footer .footer-widget-area .widget.recent-post .post-loop .post h5 {
|
|
|
+ font-size: 20px;
|
|
|
+ line-height: 1.3;
|
|
|
+ color: #fff;
|
|
|
+ text-transform: uppercase;
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 992px) and (max-width: 1200px) {
|
|
|
+ footer .footer-widget-area .widget.recent-post .post-loop .post h5 {
|
|
|
+ font-size: 16px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 576px) and (max-width: 767px) {
|
|
|
+ footer .footer-widget-area .widget.recent-post .post-loop .post h5 {
|
|
|
+ font-size: 14px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 575px) {
|
|
|
+ footer .footer-widget-area .widget.recent-post .post-loop .post h5 {
|
|
|
+ font-size: 16px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+footer .copy-right-area .copyrigt-text {
|
|
|
+ padding: 35px 0 60px;
|
|
|
+ /* border-top: 1px solid #283742; */
|
|
|
+ font-weight: 700;
|
|
|
+ font-size: 14px;
|
|
|
+ color: #fff;
|
|
|
+ text-align: center
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 767px) {
|
|
|
+ footer .copy-right-area .copyrigt-text {
|
|
|
+ font-size: 16px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 575px) {
|
|
|
+ footer .copy-right-area .copyrigt-text {
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
+ footer .copy-right-area .copyrigt-text p {
|
|
|
+ margin-bottom: 10px;
|
|
|
+ }
|
|
|
+ footer .copy-right-area .copyrigt-text p:last-child {
|
|
|
+ margin-bottom: 0;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+footer .copy-right-area .copyrigt-text a {
|
|
|
+ color: #fff;
|
|
|
+}
|
|
|
+
|
|
|
+footer .copy-right-area .copyrigt-text a:hover {
|
|
|
+ color: #ffaa17;
|
|
|
+}
|
|
|
+
|
|
|
+footer.footer-style-two {
|
|
|
+ background-color: #041d38;
|
|
|
+}
|
|
|
+
|
|
|
+footer.footer-style-two .footer-widget-area {
|
|
|
+ padding-bottom: 50px;
|
|
|
+}
|
|
|
+
|
|
|
+footer.footer-style-two .footer-widget-area .foter-logo {
|
|
|
+ margin-bottom: 50px;
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 767px) {
|
|
|
+ footer.footer-style-two .footer-widget-area .foter-logo {
|
|
|
+ margin-bottom: 80px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+footer.footer-style-two .footer-widget-area .widget {
|
|
|
+ padding: 50px 35px;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 38px;
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 992px) and (max-width: 1200px) {
|
|
|
+ footer.footer-style-two .footer-widget-area .widget {
|
|
|
+ padding: 45px 10px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 576px) and (max-width: 767px) {
|
|
|
+ footer.footer-style-two .footer-widget-area .widget {
|
|
|
+ padding: 0;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 575px) {
|
|
|
+ footer.footer-style-two .footer-widget-area .widget {
|
|
|
+ padding: 0 30px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 399px) {
|
|
|
+ footer.footer-style-two .footer-widget-area .widget {
|
|
|
+ padding: 0 15px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+footer.footer-style-two .footer-widget-area .widget .widget-title {
|
|
|
+ font-size: 30px;
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 576px) and (max-width: 767px) {
|
|
|
+ footer.footer-style-two .footer-widget-area .widget.about-widget {
|
|
|
+ font-size: 15px;
|
|
|
+ line-height: 30px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+footer.footer-style-two .footer-widget-area .widget.getin-widget {
|
|
|
+ background-color: #ffaa17;
|
|
|
+ font-weight: 700;
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 767px) {
|
|
|
+ footer.footer-style-two .footer-widget-area .widget.getin-widget {
|
|
|
+ padding: 50px 0;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+footer.footer-style-two .footer-widget-area .widget.getin-widget li {
|
|
|
+ line-height: 36px;
|
|
|
+}
|
|
|
+
|
|
|
+footer.footer-style-two .footer-widget-area .widget.getin-widget,
|
|
|
+footer.footer-style-two .footer-widget-area .widget.getin-widget .widget-title {
|
|
|
+ color: #041d38;
|
|
|
+}
|
|
|
+
|
|
|
+footer.footer-style-two .footer-widget-area .widget.getin-widget .getin-btn {
|
|
|
+ font-family: "Oswald", sans-serif;
|
|
|
+ font-weight: 700;
|
|
|
+ font-size: 14px;
|
|
|
+ padding: 10px 45px;
|
|
|
+ text-transform: uppercase;
|
|
|
+ background-color: #041d38;
|
|
|
+ display: inline-block;
|
|
|
+ margin-top: 30px;
|
|
|
+}
|
|
|
+
|
|
|
+footer.footer-style-two .footer-widget-area .widget.getin-widget .getin-btn:hover {
|
|
|
+ background-color: #041d38;
|
|
|
+ color: #fff;
|
|
|
+}
|
|
|
+
|
|
|
+footer.footer-style-two .copy-right-area {
|
|
|
+ background-color: #021529;
|
|
|
+ padding: 15px 0;
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 767px) {
|
|
|
+ footer.footer-style-two .copy-right-area {
|
|
|
+ padding: 20px 0;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+footer.footer-style-two .copy-right-area .copyrigt-text {
|
|
|
+ padding: 0;
|
|
|
+ border: none;
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 767px) {
|
|
|
+ footer.footer-style-two .copy-right-area .social-icon {
|
|
|
+ margin-top: 15px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+footer.footer-style-two .copy-right-area .social-icon a {
|
|
|
+ background-color: #041d38;
|
|
|
+}
|
|
|
+
|
|
|
+footer.footer-style-three {
|
|
|
+ background-color: #fff;
|
|
|
+}
|
|
|
+
|
|
|
+footer.footer-style-three .footer-top {
|
|
|
+ background-color: #f7fcff;
|
|
|
+}
|
|
|
+
|
|
|
+footer.footer-style-three .footer-top .social-icon a {
|
|
|
+ background-color: #fff;
|
|
|
+ color: #041d38;
|
|
|
+}
|
|
|
+
|
|
|
+footer.footer-style-three .footer-top .social-icon a:hover {
|
|
|
+ background-color: #ffaa17;
|
|
|
+}
|
|
|
+
|
|
|
+footer.footer-style-three .footer-widget-area .widget,
|
|
|
+footer.footer-style-three .footer-widget-area .widget a {
|
|
|
+ color: #041d38;
|
|
|
+}
|
|
|
+
|
|
|
+footer.footer-style-three .footer-widget-area .widget a:hover {
|
|
|
+ color: #ffaa17;
|
|
|
+}
|
|
|
+
|
|
|
+footer.footer-style-three .footer-widget-area .widget .widget-title {
|
|
|
+ color: #041d38;
|
|
|
+}
|
|
|
+
|
|
|
+footer.footer-style-three .footer-widget-area .widget.recent-post .post-loop .post {
|
|
|
+ border-color: #f2f3f4;
|
|
|
+}
|
|
|
+
|
|
|
+footer.footer-style-three .footer-widget-area .widget.recent-post .post-loop .post .time {
|
|
|
+ color: #ffaa17;
|
|
|
+}
|
|
|
+
|
|
|
+footer.footer-style-three .copy-right-area .copyrigt-text {
|
|
|
+ color: #041d38;
|
|
|
+ border-color: #d8e0e9;
|
|
|
+}
|
|
|
+
|
|
|
+footer.footer-style-three .copy-right-area a {
|
|
|
+ color: #041d38;
|
|
|
+}
|
|
|
+
|
|
|
+footer.footer-style-three .copy-right-area a:hover {
|
|
|
+ color: #ffaa17;
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+/*===== Go Top =====*/
|
|
|
+
|
|
|
+.go-top-area {
|
|
|
+ position: relative;
|
|
|
+ z-index: 9999;
|
|
|
+}
|
|
|
+
|
|
|
+.go-top-area .go-top {
|
|
|
+ position: fixed;
|
|
|
+ cursor: pointer;
|
|
|
+ top: 0;
|
|
|
+ right: 24px;
|
|
|
+ color: #ffffff;
|
|
|
+ background-color: #ffaa17;
|
|
|
+ z-index: 9999;
|
|
|
+ width: 40px;
|
|
|
+ text-align: center;
|
|
|
+ height: 42px;
|
|
|
+ line-height: 42px;
|
|
|
+ opacity: 0;
|
|
|
+ visibility: hidden;
|
|
|
+ -webkit-transition: all 0.9s ease-out 0s;
|
|
|
+ transition: all 0.9s ease-out 0s;
|
|
|
+ border-right: 0;
|
|
|
+}
|
|
|
+
|
|
|
+.go-top-area .go-top i {
|
|
|
+ position: absolute;
|
|
|
+ top: 50%;
|
|
|
+ left: -4px;
|
|
|
+ right: 0;
|
|
|
+ margin: 0 auto;
|
|
|
+ font-size: 15px;
|
|
|
+ -webkit-transform: translateY(-50%);
|
|
|
+ transform: translateY(-50%);
|
|
|
+ -webkit-transition: all 0.5s ease-out 0s;
|
|
|
+ transition: all 0.5s ease-out 0s;
|
|
|
+}
|
|
|
+
|
|
|
+.go-top-area .go-top i:last-child {
|
|
|
+ opacity: 0;
|
|
|
+ visibility: hidden;
|
|
|
+ top: 60%;
|
|
|
+}
|
|
|
+
|
|
|
+.go-top-area .go-top::before {
|
|
|
+ content: '';
|
|
|
+ position: absolute;
|
|
|
+ top: 0;
|
|
|
+ left: 0;
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ z-index: -1;
|
|
|
+ background-color: #ffaa17;
|
|
|
+ opacity: 0;
|
|
|
+ visibility: hidden;
|
|
|
+ -webkit-transition: all 0.5s ease-out 0s;
|
|
|
+ transition: all 0.5s ease-out 0s;
|
|
|
+}
|
|
|
+
|
|
|
+.go-top-area .go-top:focus,
|
|
|
+.go-top-area .go-top:hover {
|
|
|
+ color: #fff;
|
|
|
+}
|
|
|
+
|
|
|
+.go-top-area .go-top:focus::before,
|
|
|
+.go-top-area .go-top:hover::before {
|
|
|
+ opacity: 1;
|
|
|
+ visibility: visible;
|
|
|
+}
|
|
|
+
|
|
|
+.go-top-area .go-top:focus i:first-child,
|
|
|
+.go-top-area .go-top:hover i:first-child {
|
|
|
+ opacity: 0;
|
|
|
+ top: 0;
|
|
|
+ visibility: hidden;
|
|
|
+}
|
|
|
+
|
|
|
+.go-top-area .go-top:focus i:last-child,
|
|
|
+.go-top-area .go-top:hover i:last-child {
|
|
|
+ opacity: 1;
|
|
|
+ visibility: visible;
|
|
|
+ top: 50%;
|
|
|
+}
|
|
|
+
|
|
|
+.go-top-area .go-top.active {
|
|
|
+ top: 98%;
|
|
|
+ -webkit-transform: translateY(-98%);
|
|
|
+ transform: translateY(-98%);
|
|
|
+ opacity: 1;
|
|
|
+ visibility: visible;
|
|
|
+ border-radius: 0;
|
|
|
+ right: 20px;
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 992px) and (max-width: 1200px) {
|
|
|
+ .go-top-area .go-top.active {
|
|
|
+ top: 93%;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 768px) and (max-width: 991px) {
|
|
|
+ .go-top-area .go-top.active {
|
|
|
+ top: 93%;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.go-top-wrap {
|
|
|
+ position: relative;
|
|
|
+}
|
|
|
+
|
|
|
+.go-top-wrap .go-top-btn {
|
|
|
+ display: inline-block;
|
|
|
+ width: 40px;
|
|
|
+ height: 40px;
|
|
|
+ line-height: 40px;
|
|
|
+ text-align: center;
|
|
|
+ color: #fff;
|
|
|
+ top: 3px;
|
|
|
+ z-index: 1;
|
|
|
+ background: #ffaa17;
|
|
|
+}
|
|
|
+
|
|
|
+.go-top-wrap .go-top-btn i {
|
|
|
+ font-size: 20px;
|
|
|
+ font-weight: 700;
|
|
|
+ padding-left: 4px;
|
|
|
+ color: #fff;
|
|
|
+}
|
|
|
+
|
|
|
+.go-top-wrap .go-top-btn::after {
|
|
|
+ z-index: -1;
|
|
|
+ content: '';
|
|
|
+ position: absolute;
|
|
|
+ left: 0;
|
|
|
+ top: 0;
|
|
|
+ width: 40px;
|
|
|
+ height: 40px;
|
|
|
+ -webkit-animation: ripple 1.6s ease-out infinite;
|
|
|
+ animation: ripple 1.6s ease-out infinite;
|
|
|
+ opacity: 0;
|
|
|
+ background: #ffaa17;
|
|
|
+}
|
|
|
+
|
|
|
+.go-top-wrap .go-top-btn:hover {
|
|
|
+ background-color: #000;
|
|
|
+ color: #fff;
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+/*===========================
|
|
|
+ Solution
|
|
|
+===========================*/
|
|
|
+
|
|
|
+.solution-section {
|
|
|
+ position: relative;
|
|
|
+ background-color: #f7fcff;
|
|
|
+}
|
|
|
+
|
|
|
+.solution-section .solution-content {
|
|
|
+ font-size: 25px;
|
|
|
+}
|
|
|
+
|
|
|
+.solution-section .solution-btn {
|
|
|
+ border: #2a2e78 1px solid;
|
|
|
+ padding: 5px 40px;
|
|
|
+ font-weight: 600;
|
|
|
+ color: #2a2e78;
|
|
|
+ cursor: pointer;
|
|
|
+}
|
|
|
+
|
|
|
+.solution-section .solution-btn:hover {
|
|
|
+ color: #ffaa17;
|
|
|
+ border: #ffaa17 1px solid;
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+/*===========================
|
|
|
+ Core Product
|
|
|
+===========================*/
|
|
|
+
|
|
|
+.coreproduct-section {
|
|
|
+ position: relative;
|
|
|
+}
|
|
|
+
|
|
|
+.coreproduct-section .grid_titlle {
|
|
|
+ height: 45px;
|
|
|
+ background-color: #2a2e78;
|
|
|
+ color: white;
|
|
|
+ font-size: 20px;
|
|
|
+ text-align: center;
|
|
|
+}
|
|
|
+
|
|
|
+.coreproduct-section .grid_item {
|
|
|
+ margin-top: 20px;
|
|
|
+}
|
|
|
+
|
|
|
+.coreproduct-section .grid_item>div {
|
|
|
+ height: 470px;
|
|
|
+}
|
|
|
+
|
|
|
+.coreproduct-section .grid_img {
|
|
|
+ height: 252px;
|
|
|
+ overflow: hidden;
|
|
|
+}
|
|
|
+
|
|
|
+.coreproduct-section .grid_img>div {
|
|
|
+ height: 252px;
|
|
|
+ background-size: cover;
|
|
|
+ background-position: center center;
|
|
|
+ -webkit-transition: 0.3s;
|
|
|
+ transition: 0.3s;
|
|
|
+}
|
|
|
+
|
|
|
+.coreproduct-section .grid_img>div:hover {
|
|
|
+ -webkit-transform: scale(1.05, 1.05);
|
|
|
+ transform: scale(1.05, 1.05);
|
|
|
+}
|
|
|
+
|
|
|
+.coreproduct-section .grid_item p {
|
|
|
+ font-size: 16px;
|
|
|
+ text-indent: 25px;
|
|
|
+ padding: 15px 15px 0;
|
|
|
+}
|
|
|
+
|
|
|
+.coreproduct-section .grid_item .grid_button {
|
|
|
+ margin-right: 15px;
|
|
|
+ color: #2a2e78;
|
|
|
+ padding-bottom: 20px;
|
|
|
+ font-weight: 600;
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+/*===========================
|
|
|
+ About Two
|
|
|
+===========================*/
|
|
|
+
|
|
|
+.abouttwo-section {
|
|
|
+ position: relative;
|
|
|
+}
|
|
|
+
|
|
|
+.abouttwo-section .abouttwo_item {
|
|
|
+ width: 50%;
|
|
|
+ height: 506px;
|
|
|
+}
|
|
|
+
|
|
|
+.abouttwo-section .abouttwo_content {
|
|
|
+ padding: 0 40px 40px;
|
|
|
+ background-color: #2a2e78;
|
|
|
+}
|
|
|
+
|
|
|
+.abouttwo-section .abouttwo_content>span {
|
|
|
+ color: white;
|
|
|
+ padding: 45px;
|
|
|
+ font-size: 40px;
|
|
|
+}
|
|
|
+
|
|
|
+.abouttwo-section .abouttwo_content p {
|
|
|
+ color: white;
|
|
|
+ font-size: 18px;
|
|
|
+ text-indent: 30px;
|
|
|
+ line-height: 1.9;
|
|
|
+}
|
|
|
+
|
|
|
+.abouttwo-section .abouttwo_content a {
|
|
|
+ color: white;
|
|
|
+ font-size: 16px;
|
|
|
+ cursor: pointer;
|
|
|
+}
|
|
|
+
|
|
|
+.abouttwo-section .abouttwo_content a:hover {
|
|
|
+ color: #ffaa17;
|
|
|
+}
|
|
|
+
|
|
|
+.abouttwo-section .abouttwo_img {
|
|
|
+ background-size: cover;
|
|
|
+ background-position: center center;
|
|
|
+ background-repeat: no-repeat;
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 774px) {
|
|
|
+ .abouttwo-section .abouttwo_item {
|
|
|
+ width: 100%;
|
|
|
+ height: 506px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 774px) and (max-width: 1120px) {
|
|
|
+ .abouttwo-section .abouttwo_content p {
|
|
|
+ color: white;
|
|
|
+ font-size: 16px;
|
|
|
+ text-indent: 30px;
|
|
|
+ line-height: 1.6;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width:570px) {
|
|
|
+ .abouttwo-section .abouttwo_content>span {
|
|
|
+ color: white;
|
|
|
+ padding: 30px 45px;
|
|
|
+ font-size: 40px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width:445px) {
|
|
|
+ .abouttwo-section .abouttwo_content>span {
|
|
|
+ color: white;
|
|
|
+ padding: 25px 30px;
|
|
|
+ font-size: 35px;
|
|
|
+ }
|
|
|
+ .abouttwo-section .abouttwo_content {
|
|
|
+ padding: 0 30px 30px;
|
|
|
+ }
|
|
|
+ .abouttwo-section .abouttwo_content p {
|
|
|
+ color: white;
|
|
|
+ font-size: 16px;
|
|
|
+ text-indent: 30px;
|
|
|
+ line-height: 1.9;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width:321px) {
|
|
|
+ .abouttwo-section .abouttwo_content {
|
|
|
+ height: 526px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+/*===========================
|
|
|
+ Classic Case
|
|
|
+===========================*/
|
|
|
+
|
|
|
+.classic-case-section {
|
|
|
+ position: relative;
|
|
|
+}
|
|
|
+
|
|
|
+.classic-case-section .case-img {
|
|
|
+ position: relative;
|
|
|
+ z-index: 1;
|
|
|
+}
|
|
|
+
|
|
|
+@media only screen and (min-width: 768px) and (max-width: 991px) {
|
|
|
+ .classic-case-section .case-img {
|
|
|
+ margin-top: 60px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 767px) {
|
|
|
+ .classic-case-section .case-img {
|
|
|
+ margin-top: 60px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.classic-case-section .case-img::after {
|
|
|
+ position: absolute;
|
|
|
+ right: -25px;
|
|
|
+ bottom: -25px;
|
|
|
+ width: 180px;
|
|
|
+ height: 180px;
|
|
|
+ background-color: #2a2e78;
|
|
|
+ content: '';
|
|
|
+ -webkit-clip-path: polygon(100% 0, 0 100%, 100% 100%);
|
|
|
+ clip-path: polygon(100% 0, 0 100%, 100% 100%);
|
|
|
+ z-index: -1;
|
|
|
+}
|
|
|
+
|
|
|
+.classic-case-section .case-left {
|
|
|
+ position: relative;
|
|
|
+ z-index: 1;
|
|
|
+ margin-top: 26px;
|
|
|
+ height: 100%;
|
|
|
+}
|
|
|
+
|
|
|
+.classic-case-section .case-left h1,
|
|
|
+strong {
|
|
|
+ color: #2a2e78;
|
|
|
+}
|
|
|
+
|
|
|
+.classic-case-section .case-left a {
|
|
|
+ color: #2a2e78;
|
|
|
+ font-size: 20px;
|
|
|
+ text-decoration: underline;
|
|
|
+ padding-bottom: 15px;
|
|
|
+ cursor: pointer;
|
|
|
+}
|
|
|
+
|
|
|
+.classic-case-section .case-left a:hover {
|
|
|
+ color: #ffaa17;
|
|
|
+}
|
|
|
+
|
|
|
+.classic-case-section .case-left::before {
|
|
|
+ position: absolute;
|
|
|
+ top: -26px;
|
|
|
+ width: 180px;
|
|
|
+ height: 180px;
|
|
|
+ background-color: #2a2e78;
|
|
|
+ content: '';
|
|
|
+ -webkit-clip-path: polygon(100% 0, 0% 100%, 0 0);
|
|
|
+ clip-path: polygon(100% 0, 0% 100%, 0 0);
|
|
|
+ z-index: -1;
|
|
|
+}
|
|
|
+
|
|
|
+.classic-case-section .case-left h1 {
|
|
|
+ font-size: 30px;
|
|
|
+ padding: 20px 0;
|
|
|
+}
|
|
|
+
|
|
|
+.classic-case-section .case-left p {
|
|
|
+ font-size: 16px;
|
|
|
+ padding: 20px 0 0 0;
|
|
|
+ text-indent: 30px;
|
|
|
+}
|
|
|
+
|
|
|
+.classic-case-section .section-title h2 {
|
|
|
+ background-color: #2a2e78;
|
|
|
+ color: white;
|
|
|
+ padding: 10px 0;
|
|
|
+ line-height: 1.5;
|
|
|
+ width: 300px;
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+/*===========================
|
|
|
+ Sub Company
|
|
|
+===========================*/
|
|
|
+
|
|
|
+.sub-company-section {
|
|
|
+ position: relative;
|
|
|
+ background-image: url(../img/sub_company_bg.png);
|
|
|
+ background-position: center center;
|
|
|
+ background-repeat: no-repeat;
|
|
|
+ background-size: cover;
|
|
|
+ height: 1081px;
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 575px) {
|
|
|
+ .sub-company-section {
|
|
|
+ position: relative;
|
|
|
+ background-image: none;
|
|
|
+ height: 100%;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.sub-company-section .icon {
|
|
|
+ width: 25px;
|
|
|
+ height: 25px;
|
|
|
+ fill: currentColor;
|
|
|
+ overflow: hidden;
|
|
|
+}
|
|
|
+
|
|
|
+.sub-company-section .phone {
|
|
|
+ margin-top: 20px;
|
|
|
+}
|
|
|
+
|
|
|
+.sub-company-section hr {
|
|
|
+ margin-top: 30px;
|
|
|
+}
|
|
|
+
|
|
|
+.sub-company-section .company-short-name {
|
|
|
+ width: 100px;
|
|
|
+}
|
|
|
+
|
|
|
+.sub-company-section .company-name {
|
|
|
+ width: 300px;
|
|
|
+ text-align: right;
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 490px) {
|
|
|
+ .sub-company-section .company-name {
|
|
|
+ width: 180px;
|
|
|
+ text-align: right;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 320px) {
|
|
|
+ .sub-company-section .company-name {
|
|
|
+ width: 150px;
|
|
|
+ text-align: right;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+/*===========================
|
|
|
+ Custom Contact
|
|
|
+===========================*/
|
|
|
+
|
|
|
+.cus-contact-section {
|
|
|
+ position: relative;
|
|
|
+}
|
|
|
+
|
|
|
+.cus-contact-section .contact-btn {
|
|
|
+ text-align: center;
|
|
|
+ height: 80px;
|
|
|
+ width: 480px;
|
|
|
+ border-radius: 40px;
|
|
|
+ position: relative;
|
|
|
+}
|
|
|
+
|
|
|
+.cus-contact-section .contact-btn span {
|
|
|
+ font-size: 30px;
|
|
|
+}
|
|
|
+
|
|
|
+.cus-contact-section h2 {
|
|
|
+ font-weight: 400;
|
|
|
+ color: #2a2e78;
|
|
|
+}
|
|
|
+
|
|
|
+.cus-contact-section h1 {
|
|
|
+ letter-spacing: 10px;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #2a2e78;
|
|
|
+}
|
|
|
+
|
|
|
+.cus-contact-section p {
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: 500;
|
|
|
+}
|
|
|
+
|
|
|
+.cus-contact-section .contact-btn::after {
|
|
|
+ content: url("../img/contact.png");
|
|
|
+ position: absolute;
|
|
|
+ left: 400px;
|
|
|
+ top: 2px;
|
|
|
+ color: #2a2e78
|
|
|
+}
|
|
|
+
|
|
|
+.cus-contact-section .contact-btn span {
|
|
|
+ color: #2a2e78;
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 575px) {
|
|
|
+ .cus-contact-section .contact-btn {
|
|
|
+ width: 380px;
|
|
|
+ }
|
|
|
+ .cus-contact-section .contact-btn::after {
|
|
|
+ left: 300px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+/*===========================
|
|
|
+ News Breadcrumb
|
|
|
+===========================*/
|
|
|
+
|
|
|
+.news-breadcrumb-section {
|
|
|
+ position: relative;
|
|
|
+ background-image: url("../img/news/bg.png");
|
|
|
+ background-position: center center;
|
|
|
+ background-repeat: no-repeat;
|
|
|
+ background-size: cover;
|
|
|
+ height: 478px;
|
|
|
+ padding-top: 250px;
|
|
|
+}
|
|
|
+
|
|
|
+.news-breadcrumb-section img {
|
|
|
+ max-height: 89px;
|
|
|
+ max-width: 480px;
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 575px) {
|
|
|
+ .news-breadcrumb-section {
|
|
|
+ height: 370px;
|
|
|
+ padding-top: 200px;
|
|
|
+ }
|
|
|
+ .news-breadcrumb-section img {
|
|
|
+ max-height: 62px;
|
|
|
+ max-width: 336px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+/*===========================
|
|
|
+ News Content
|
|
|
+===========================*/
|
|
|
+
|
|
|
+.news-content-section {
|
|
|
+ position: relative;
|
|
|
+ background-color: #f6f6fe;
|
|
|
+}
|
|
|
+
|
|
|
+.news-content-section .menu-1 {
|
|
|
+ color: white;
|
|
|
+ font-size: 24px;
|
|
|
+ padding: 0 0;
|
|
|
+}
|
|
|
+
|
|
|
+.news-content-section .menu-1 .title {
|
|
|
+ background-color: #2a2e78;
|
|
|
+ padding: 15px 0 15px 15px;
|
|
|
+}
|
|
|
+
|
|
|
+.news-content-section .menu-1 ul li {
|
|
|
+ color: #2a2e78;
|
|
|
+ margin-bottom: 2px;
|
|
|
+ background-color: #e0e0f8;
|
|
|
+ font-size: 20px;
|
|
|
+ cursor: pointer;
|
|
|
+}
|
|
|
+
|
|
|
+.news-content-section .menu-1 ul li a {
|
|
|
+ color: #2a2e78;
|
|
|
+ padding: 10px 0 10px 31px;
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+}
|
|
|
+
|
|
|
+.news-content-section .menu-1 .unactive {
|
|
|
+ padding: 10px 0 10px 31px;
|
|
|
+}
|
|
|
+
|
|
|
+.news-content-section .menu-1 ul .active {
|
|
|
+ padding: 10px 0 10px 15px;
|
|
|
+ cursor: default;
|
|
|
+}
|
|
|
+
|
|
|
+.news-content-section .menu-1 ul .active::before {
|
|
|
+ content: "▪";
|
|
|
+ color: #2a2e78;
|
|
|
+ margin-right: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.news-content-section .menu-2 {
|
|
|
+ display: none;
|
|
|
+}
|
|
|
+
|
|
|
+.news-content-section .menu-2 li {
|
|
|
+ display: inline-block;
|
|
|
+ width: 50%;
|
|
|
+ text-align: center;
|
|
|
+ font-size: 20px;
|
|
|
+ color: #2a2e78;
|
|
|
+ padding: 10px 0;
|
|
|
+ background-color: #e0e0f8;
|
|
|
+ cursor: pointer;
|
|
|
+}
|
|
|
+
|
|
|
+.news-content-section .menu-2 li.active {
|
|
|
+ background-color: #2a2e78;
|
|
|
+ color: white;
|
|
|
+ cursor: default;
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 768px) {
|
|
|
+ .news-content-section .menu-1 {
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+ .news-content-section .menu-2 {
|
|
|
+ display: block;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.news-content-section .content li {
|
|
|
+ background-color: white;
|
|
|
+ margin-bottom: 15px;
|
|
|
+ margin-left: 0;
|
|
|
+ margin-right: 0;
|
|
|
+ padding: 15px 5px 15px 15px;
|
|
|
+}
|
|
|
+
|
|
|
+.news-content-section .content .img {
|
|
|
+ background-position: center center;
|
|
|
+ background-repeat: no-repeat;
|
|
|
+ background-size: cover;
|
|
|
+ height: 169px;
|
|
|
+}
|
|
|
+
|
|
|
+.news-content-section .content .hr1 a {
|
|
|
+ font-size: 20px;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ white-space: nowrap;
|
|
|
+ color: #2a2e78;
|
|
|
+}
|
|
|
+
|
|
|
+.news-content-section .content .hr1 span {
|
|
|
+ min-width: 80px;
|
|
|
+ font-size: 14px;
|
|
|
+ color: #757a89;
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 575px) {
|
|
|
+ .news-content-section .content .hr1 {
|
|
|
+ margin-top: 15px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.news-content-section .content .hr2 {
|
|
|
+ padding-top: 20px;
|
|
|
+}
|
|
|
+
|
|
|
+.news-content-section .content .hr2 p {
|
|
|
+ text-indent: 30px;
|
|
|
+}
|
|
|
+
|
|
|
+.news-content-section .content .hr3 .more {
|
|
|
+ color: #2a2e78;
|
|
|
+ width: 180px;
|
|
|
+ text-align: center;
|
|
|
+ font-size: 23px;
|
|
|
+ height: 40px;
|
|
|
+ border: #2a2e78 1px solid;
|
|
|
+ border-radius: 20px;
|
|
|
+ margin-top: 15px;
|
|
|
+ cursor: pointer;
|
|
|
+}
|
|
|
+
|
|
|
+.news-content-section .content .hr3 .more:hover {
|
|
|
+ color: #ffaa17;
|
|
|
+ width: 180px;
|
|
|
+ text-align: center;
|
|
|
+ font-size: 23px;
|
|
|
+ height: 40px;
|
|
|
+ border: #ffaa17 1px solid;
|
|
|
+ border-radius: 20px;
|
|
|
+ margin-top: 15px;
|
|
|
+}
|
|
|
+
|
|
|
+.news-content-section .content .page a {
|
|
|
+ background-color: white;
|
|
|
+ margin-right: 5px;
|
|
|
+ font-size: 16px;
|
|
|
+ color: #2a2e78;
|
|
|
+ font-weight: bold;
|
|
|
+ border: #2a2e78 1px solid;
|
|
|
+ padding: 10px 15px;
|
|
|
+ cursor: pointer;
|
|
|
+ border-radius: 2px;
|
|
|
+}
|
|
|
+
|
|
|
+.news-content-section .content .page a:hover,
|
|
|
+.news-content-section .content .page a.active {
|
|
|
+ color: white;
|
|
|
+ font-weight: bold;
|
|
|
+ border: none;
|
|
|
+ background-color: #2a2e78;
|
|
|
+}
|
|
|
+
|
|
|
+.news-content-section .content .page a.previous,
|
|
|
+.news-content-section .content .page a.next {
|
|
|
+ padding: 10px 15px;
|
|
|
+}
|
|
|
+
|
|
|
+.news-content-section .content .page span {
|
|
|
+ margin-right: 5px;
|
|
|
+}
|
|
|
+
|
|
|
+.news-content-section .content .page a.disable {
|
|
|
+ color: #757a89;
|
|
|
+ border: none;
|
|
|
+ background-color: white;
|
|
|
+ border: #757a89 1px solid;
|
|
|
+ cursor: default;
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 575px) {
|
|
|
+ .news-content-section .content .page span {
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+ .news-content-section .content .page a {
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+ .news-content-section .content .page a.previous,
|
|
|
+ .news-content-section .content .page a.next {
|
|
|
+ display: inline-block;
|
|
|
+ }
|
|
|
+ .news-content-section .content .page a.previous {
|
|
|
+ margin-right: 150px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.news-content-section .content .read_content {
|
|
|
+ background-color: white;
|
|
|
+ padding: 30px 20px;
|
|
|
+}
|
|
|
+
|
|
|
+.news-content-section .content .read_content .new-read-title h1 {
|
|
|
+ text-align: center;
|
|
|
+ font-size: 24px;
|
|
|
+ font-weight: 600;
|
|
|
+}
|
|
|
+
|
|
|
+.news-content-section .content .read_content .new-read-title2 {
|
|
|
+ padding: 25px 0;
|
|
|
+}
|
|
|
+
|
|
|
+.news-content-section .content .read_content .new-read-title2 span {
|
|
|
+ font-size: 14px;
|
|
|
+ color: #757a89;
|
|
|
+}
|
|
|
+
|
|
|
+.news-content-section .content .read-page {
|
|
|
+ padding: 25px 0;
|
|
|
+}
|
|
|
+
|
|
|
+.news-content-section .content .read-page a {
|
|
|
+ margin-right: 5px;
|
|
|
+ font-size: 22px;
|
|
|
+ color: #2a2e78;
|
|
|
+ text-decoration: underline;
|
|
|
+ cursor: pointer;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ white-space: nowrap;
|
|
|
+}
|
|
|
+
|
|
|
+.news-content-section .content .read-page a.disable {
|
|
|
+ color: #757a89;
|
|
|
+ cursor: default;
|
|
|
+}
|
|
|
+
|
|
|
+.news-content-section .content .read-page a:hover {
|
|
|
+ color: #ffaa17;
|
|
|
+}
|
|
|
+
|
|
|
+.news-content-section .content .read-page a.disable:hover {
|
|
|
+ color: #757a89;
|
|
|
+ cursor: default;
|
|
|
+}
|
|
|
+
|
|
|
+.news-content-section .content .read-page a.previous,
|
|
|
+.news-content-section .content .read-page a.next {
|
|
|
+ max-width: 280px;
|
|
|
+}
|
|
|
+
|
|
|
+.news-content-section .content .read-page a.min-previous,
|
|
|
+.news-content-section .content .read-page a.min-next {
|
|
|
+ display: none;
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 989px) {
|
|
|
+ .news-content-section .content .read-page a.min-previous,
|
|
|
+ .news-content-section .content .read-page a.min-next {
|
|
|
+ display: inline-block;
|
|
|
+ }
|
|
|
+ .news-content-section .content .read-page a.previous,
|
|
|
+ .news-content-section .content .read-page a.next {
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.news-content-section .menu-1 ul.related li {
|
|
|
+ padding: 0;
|
|
|
+ color: #2a2e78;
|
|
|
+ margin-bottom: 2px;
|
|
|
+ background-color: white;
|
|
|
+ font-size: 20px;
|
|
|
+ cursor: pointer;
|
|
|
+}
|
|
|
+
|
|
|
+.news-content-section .menu-1 ul.related li a {
|
|
|
+ padding: 13px 0 7px 10px;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ white-space: nowrap;
|
|
|
+ width: 100%;
|
|
|
+ color: #2a2e78;
|
|
|
+}
|
|
|
+
|
|
|
+.news-content-section .related2 {
|
|
|
+ display: none;
|
|
|
+}
|
|
|
+
|
|
|
+.news-content-section .related2 li {
|
|
|
+ padding: 0;
|
|
|
+ color: #2a2e78;
|
|
|
+ margin-bottom: 2px;
|
|
|
+ background-color: white;
|
|
|
+ font-size: 20px;
|
|
|
+ cursor: pointer;
|
|
|
+}
|
|
|
+
|
|
|
+.news-content-section .related2 li a {
|
|
|
+ padding: 13px 0 7px 10px;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ white-space: nowrap;
|
|
|
+ width: 100%;
|
|
|
+ color: #2a2e78;
|
|
|
+}
|
|
|
+
|
|
|
+.news-content-section .related2 .title {
|
|
|
+ background-color: #2a2e78;
|
|
|
+ padding: 15px 0 15px 15px;
|
|
|
+ color: white;
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 768px) {
|
|
|
+ .news-content-section .related2 {
|
|
|
+ display: block;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+/*===========================
|
|
|
+ Custom Banner
|
|
|
+===========================*/
|
|
|
+
|
|
|
+.banner-section .bg-img {
|
|
|
+ background-size: cover;
|
|
|
+ background-position: top center;
|
|
|
+ background-repeat: no-repeat;
|
|
|
+ max-width: 100%;
|
|
|
+ height: 100vh;
|
|
|
+}
|
|
|
+
|
|
|
+.banner-section .bannerContent0 {
|
|
|
+ margin-top: 320px;
|
|
|
+}
|
|
|
+
|
|
|
+.banner-section .bannerContent0 img:nth-child(1) {
|
|
|
+ max-width: 609px;
|
|
|
+ max-height: 97px;
|
|
|
+}
|
|
|
+
|
|
|
+.banner-section .bannerContent0 img:nth-child(2) {
|
|
|
+ margin-top: 50px;
|
|
|
+ max-width: 668px;
|
|
|
+ max-height: 112px;
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 780px) {
|
|
|
+ .banner-section .bg-img {
|
|
|
+ height: 470px;
|
|
|
+ }
|
|
|
+ .banner-section .bannerContent0 {
|
|
|
+ margin-top: 190px;
|
|
|
+ }
|
|
|
+ .banner-section .bannerContent0 img:nth-child(1) {
|
|
|
+ max-width: 304px;
|
|
|
+ max-height: 48px;
|
|
|
+ }
|
|
|
+ .banner-section .bannerContent0 img:nth-child(2) {
|
|
|
+ margin-top: 25px;
|
|
|
+ max-width: 334px;
|
|
|
+ max-height: 56px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+/*===========================
|
|
|
+ Common Breadcrumb
|
|
|
+===========================*/
|
|
|
+
|
|
|
+.common-bradcrumb-section {
|
|
|
+ position: relative;
|
|
|
+ background-position: center center;
|
|
|
+ background-repeat: no-repeat;
|
|
|
+ background-size: cover;
|
|
|
+ height: 478px;
|
|
|
+ padding-top: 250px;
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 575px) {
|
|
|
+ .common-bradcrumb-section {
|
|
|
+ height: 370px;
|
|
|
+ padding-top: 200px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+/*===========================
|
|
|
+ Product Grid
|
|
|
+===========================*/
|
|
|
+
|
|
|
+.product-grid-section {
|
|
|
+ position: relative;
|
|
|
+ background-color: #f6f6fe
|
|
|
+}
|
|
|
+
|
|
|
+.product-grid-section .grid-filter ul li {
|
|
|
+ display: inline-block;
|
|
|
+ height: 60px;
|
|
|
+ position: relative;
|
|
|
+ width: 12.499999%;
|
|
|
+ padding: 0 1px;
|
|
|
+}
|
|
|
+
|
|
|
+.product-grid-section .grid-filter ul li:nth-child(1) {
|
|
|
+ padding-left: 0;
|
|
|
+ padding-right: 1px;
|
|
|
+}
|
|
|
+
|
|
|
+.product-grid-section .grid-filter ul li:nth-child(8) {
|
|
|
+ padding-right: 0;
|
|
|
+ padding-left: 1px;
|
|
|
+}
|
|
|
+
|
|
|
+.product-grid-section .grid-filter ul li div {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ display: -ms-flexbox;
|
|
|
+ display: flex;
|
|
|
+ -ms-flex-pack: center;
|
|
|
+ justify-content: center;
|
|
|
+ -ms-flex-align: center;
|
|
|
+ align-items: center;
|
|
|
+ background-color: #e0e0f8;
|
|
|
+ color: #2a2e78;
|
|
|
+ font-size: 20px;
|
|
|
+}
|
|
|
+
|
|
|
+.product-grid-section .grid-filter ul li.active div,
|
|
|
+.product-grid-section .grid-filter ul li div:hover {
|
|
|
+ background-color: #2a2e78;
|
|
|
+ color: white;
|
|
|
+ cursor: pointer;
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 999px) {
|
|
|
+ .product-grid-section .grid-filter ul li {
|
|
|
+ width: 24.999999%;
|
|
|
+ margin-top: 2px;
|
|
|
+ }
|
|
|
+ .product-grid-section .grid-filter ul li:nth-child(4) {
|
|
|
+ padding-left: 1px;
|
|
|
+ padding-right: 0;
|
|
|
+ }
|
|
|
+ .product-grid-section .grid-filter ul li:nth-child(5) {
|
|
|
+ padding-left: 0;
|
|
|
+ padding-right: 1px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 575px) {
|
|
|
+ .product-grid-section .grid-filter ul li {
|
|
|
+ width: 49.99999%;
|
|
|
+ margin-top: 2px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.product-grid-section .grid-isotope {
|
|
|
+ background-color: white;
|
|
|
+}
|
|
|
+
|
|
|
+.product-grid-section .grid-isotope .product-grid-box {
|
|
|
+ margin: 20px 0;
|
|
|
+ border: #8386d5 2px solid;
|
|
|
+ border-radius: 5px;
|
|
|
+ position: relative;
|
|
|
+}
|
|
|
+
|
|
|
+.product-grid-section .grid-isotope .product-grid-box .product-img {
|
|
|
+ padding: 30px 0;
|
|
|
+ overflow: hidden;
|
|
|
+ z-index: -2;
|
|
|
+}
|
|
|
+
|
|
|
+.product-grid-section .grid-isotope .product-grid-box .product-img img {
|
|
|
+ height: 250px;
|
|
|
+ max-width: 250px;
|
|
|
+ margin: 0 auto;
|
|
|
+ display: block;
|
|
|
+}
|
|
|
+
|
|
|
+.product-grid-section .grid-isotope .product-grid-box .title {
|
|
|
+ height: 60px;
|
|
|
+ background-color: #8386d5;
|
|
|
+ z-index: -2;
|
|
|
+ padding: 0 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.product-grid-section .grid-isotope .product-grid-box .title span {
|
|
|
+ color: white;
|
|
|
+ font-size: 20px;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ white-space: nowrap;
|
|
|
+}
|
|
|
+
|
|
|
+.product-grid-section .grid-isotope .product-grid-box .product-link {
|
|
|
+ position: absolute;
|
|
|
+ top: 45%;
|
|
|
+ /* -webkit-transform: translate(0%, -50%);
|
|
|
+ transform: translate(0%, -50%); */
|
|
|
+ width: 100%;
|
|
|
+ -webkit-transition: all 0.3s ease-out 0s;
|
|
|
+ transition: all 0.3s ease-out 0s;
|
|
|
+ color: #fff;
|
|
|
+ font-size: 40px;
|
|
|
+ z-index: 2;
|
|
|
+ opacity: 0;
|
|
|
+ visibility: hidden;
|
|
|
+}
|
|
|
+
|
|
|
+.product-grid-section .grid-isotope .product-grid-box .product-link p {
|
|
|
+ font-size: 18px;
|
|
|
+ text-align: center;
|
|
|
+}
|
|
|
+
|
|
|
+.product-grid-section .grid-isotope .product-grid-box::after {
|
|
|
+ content: '';
|
|
|
+ position: absolute;
|
|
|
+ left: 0;
|
|
|
+ top: 0;
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ background-color: #041d38;
|
|
|
+ z-index: 1;
|
|
|
+ -webkit-transition: all 0.3s ease-out 0s;
|
|
|
+ transition: all 0.3s ease-out 0s;
|
|
|
+ opacity: 0;
|
|
|
+ visibility: hidden;
|
|
|
+}
|
|
|
+
|
|
|
+.product-grid-section .grid-isotope .product-grid-box:hover::after {
|
|
|
+ opacity: 0.9;
|
|
|
+ visibility: visible;
|
|
|
+}
|
|
|
+
|
|
|
+.product-grid-section .grid-isotope .product-grid-box:hover .product-link {
|
|
|
+ opacity: 1;
|
|
|
+ visibility: visible;
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+/*===========================
|
|
|
+ Product Detail
|
|
|
+===========================*/
|
|
|
+
|
|
|
+.product-detial-section {
|
|
|
+ position: relative;
|
|
|
+ background-color: #f6f6fe;
|
|
|
+}
|
|
|
+
|
|
|
+.product-detial-section .up-level-page a {
|
|
|
+ color: #2a2e78;
|
|
|
+ font-size: 22px;
|
|
|
+ text-decoration: underline;
|
|
|
+ cursor: pointer;
|
|
|
+}
|
|
|
+
|
|
|
+.product-detial-section .up-level-page a:hover {
|
|
|
+ color: #ffaa17;
|
|
|
+}
|
|
|
+
|
|
|
+.product-detial-section .article {
|
|
|
+ background-color: white;
|
|
|
+ padding: 0 45px;
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 575px) {
|
|
|
+ .product-detial-section .article {
|
|
|
+ padding: 0 5px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.product-detial-section .article .title h1 {
|
|
|
+ font-size: 30px;
|
|
|
+ font-weight: 500;
|
|
|
+ color: #010432;
|
|
|
+ text-align: center;
|
|
|
+}
|
|
|
+
|
|
|
+.product-detial-section .article h2 {
|
|
|
+ font-size: 24px;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #2a2e78;
|
|
|
+ border-left: 8px #2a2e78 solid;
|
|
|
+}
|
|
|
+
|
|
|
+.product-detial-section .article .fun-box .img-box {
|
|
|
+ overflow: hidden;
|
|
|
+ float: right;
|
|
|
+}
|
|
|
+
|
|
|
+.product-detial-section .article .fun-box .img-box img {
|
|
|
+ height: 250px;
|
|
|
+ max-width: 250px;
|
|
|
+}
|
|
|
+
|
|
|
+.product-detial-section .article .fun-box p {
|
|
|
+ padding-bottom: 10px;
|
|
|
+ font-size: 16px;
|
|
|
+ color: #010432;
|
|
|
+}
|
|
|
+
|
|
|
+.product-detial-section .article .fun-box p::before {
|
|
|
+ content: "■";
|
|
|
+ color: #010432;
|
|
|
+ margin-right: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.product-detial-section .article .params-box {
|
|
|
+ border: #8386d5 solid;
|
|
|
+ border-width: 0 1px 0 1px;
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 1007px) {
|
|
|
+ .product-detial-section .article .params-box {
|
|
|
+ overflow-x: auto;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.product-detial-section .article .params-box table {
|
|
|
+ width: 100%;
|
|
|
+ min-width: 768px;
|
|
|
+ border: #8386d5 solid;
|
|
|
+ border-width: 1px 0 0 0;
|
|
|
+}
|
|
|
+
|
|
|
+.product-detial-section .article .params-box table th {
|
|
|
+ background-color: #e0e0f8;
|
|
|
+ padding: 0 10px;
|
|
|
+ height: 50px;
|
|
|
+}
|
|
|
+
|
|
|
+.product-detial-section .article .params-box table th:nth-child(1) {
|
|
|
+ border: #8386d5 solid;
|
|
|
+ border-width: 0 1px 1px 0;
|
|
|
+}
|
|
|
+
|
|
|
+.product-detial-section .article .params-box table th:nth-child(2) {
|
|
|
+ border: #8386d5 solid;
|
|
|
+ border-width: 0 0 1px 0;
|
|
|
+}
|
|
|
+
|
|
|
+.product-detial-section .article .params-box table th:nth-child(3) {
|
|
|
+ border: #8386d5 solid;
|
|
|
+ border-width: 0 0 1px 1px;
|
|
|
+}
|
|
|
+
|
|
|
+.product-detial-section .article .params-box table th:nth-child(4) {
|
|
|
+ border: #8386d5 solid;
|
|
|
+ border-width: 0 0 1px 1px;
|
|
|
+}
|
|
|
+
|
|
|
+.product-detial-section .article .params-box table th span {
|
|
|
+ display: inline-block;
|
|
|
+}
|
|
|
+
|
|
|
+.product-detial-section .article .params-box table th span:nth-child(2) {
|
|
|
+ display: inline-block;
|
|
|
+ font-weight: 400;
|
|
|
+ font-size: 14px;
|
|
|
+}
|
|
|
+
|
|
|
+.product-detial-section .article .params-box table td {
|
|
|
+ padding: 0 10px;
|
|
|
+ height: 50px;
|
|
|
+}
|
|
|
+
|
|
|
+.product-detial-section .article .params-box table td:nth-child(1) {
|
|
|
+ border: #8386d5 solid;
|
|
|
+ border-width: 0 1px 1px 0;
|
|
|
+}
|
|
|
+
|
|
|
+.product-detial-section .article .params-box table td:nth-child(2) {
|
|
|
+ border: #8386d5 solid;
|
|
|
+ border-width: 0 0 1px 0;
|
|
|
+}
|
|
|
+
|
|
|
+.product-detial-section .article .params-box table td:nth-child(3) {
|
|
|
+ border: #8386d5 solid;
|
|
|
+ border-width: 0 0 1px 1px;
|
|
|
+}
|
|
|
+
|
|
|
+.product-detial-section .article .params-box table td:nth-child(4) {
|
|
|
+ border: #8386d5 solid;
|
|
|
+ border-width: 0 0 1px 1px;
|
|
|
+}
|
|
|
+
|
|
|
+.product-detial-section .page a {
|
|
|
+ color: #2a2e78;
|
|
|
+ font-size: 22px;
|
|
|
+ text-decoration: underline;
|
|
|
+ cursor: pointer;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ white-space: nowrap;
|
|
|
+ max-width: 415px;
|
|
|
+}
|
|
|
+
|
|
|
+.product-detial-section .page a:hover {
|
|
|
+ color: #ffaa17;
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+/*===========================
|
|
|
+ Solution Page
|
|
|
+===========================*/
|
|
|
+
|
|
|
+.solution-page-section {
|
|
|
+ position: relative;
|
|
|
+ background-color: #f6f6fe;
|
|
|
+}
|
|
|
+
|
|
|
+.solution-page-section .tab-menu-1 {
|
|
|
+ color: white;
|
|
|
+ font-size: 24px;
|
|
|
+ padding: 0 0;
|
|
|
+}
|
|
|
+
|
|
|
+.solution-page-section .tab-menu-1 .title {
|
|
|
+ background-color: #2a2e78;
|
|
|
+ padding: 15px 0 15px 15px;
|
|
|
+}
|
|
|
+
|
|
|
+.solution-page-section .tab-menu-1 ul li {
|
|
|
+ color: #2a2e78;
|
|
|
+ margin-bottom: 2px;
|
|
|
+ background-color: #e0e0f8;
|
|
|
+ font-size: 18px;
|
|
|
+ cursor: pointer;
|
|
|
+}
|
|
|
+
|
|
|
+.solution-page-section .tab-menu-1 ul li a {
|
|
|
+ color: #2a2e78;
|
|
|
+ padding: 10px 0 10px 31px;
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+}
|
|
|
+
|
|
|
+.solution-page-section .tab-menu-1 ul .active {
|
|
|
+ padding: 10px 0 10px 15px;
|
|
|
+ cursor: default;
|
|
|
+}
|
|
|
+
|
|
|
+.solution-page-section .tab-menu-1 ul .active::before {
|
|
|
+ content: "▪";
|
|
|
+ color: #2a2e78;
|
|
|
+ margin-right: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.solution-page-section .tab-menu-2 {
|
|
|
+ display: none;
|
|
|
+}
|
|
|
+
|
|
|
+.solution-page-section .tab-menu-2 ul li {
|
|
|
+ display: inline-block;
|
|
|
+ text-align: center;
|
|
|
+ font-size: 18px;
|
|
|
+ cursor: pointer;
|
|
|
+ height: 60px;
|
|
|
+ margin-bottom: 2px;
|
|
|
+}
|
|
|
+
|
|
|
+.solution-page-section .tab-menu-2 ul li:nth-child(1),
|
|
|
+.solution-page-section .tab-menu-2 ul li:nth-child(3) {
|
|
|
+ padding-right: 5px;
|
|
|
+ padding-left: 0;
|
|
|
+}
|
|
|
+
|
|
|
+.solution-page-section .tab-menu-2 ul li:nth-child(2),
|
|
|
+.solution-page-section .tab-menu-2 ul li:nth-child(4) {
|
|
|
+ padding-left: 5px;
|
|
|
+ padding-right: 0;
|
|
|
+}
|
|
|
+
|
|
|
+.solution-page-section .tab-menu-2 ul li a {
|
|
|
+ color: #2a2e78;
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ line-height: 60px;
|
|
|
+ background-color: #e0e0f8;
|
|
|
+}
|
|
|
+
|
|
|
+.solution-page-section .tab-menu-2 ul li.active {
|
|
|
+ /* background-color: #2a2e78; */
|
|
|
+ color: white;
|
|
|
+ cursor: default;
|
|
|
+}
|
|
|
+
|
|
|
+.solution-page-section .tab-menu-2 ul li div {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ background-color: #2a2e78;
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 768px) {
|
|
|
+ .solution-page-section .tab-menu-1 {
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+ .solution-page-section .tab-menu-2 {
|
|
|
+ display: block;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.solution-page-section .main {
|
|
|
+ background-color: white;
|
|
|
+ margin: 0;
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 768px) {
|
|
|
+ .solution-page-section .main {
|
|
|
+ margin: 0 -15px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.solution-page-section .main .title h1 {
|
|
|
+ text-align: center;
|
|
|
+ font-size: 24px;
|
|
|
+ font-weight: 600;
|
|
|
+ color: #010432;
|
|
|
+}
|
|
|
+
|
|
|
+.solution-page-section .main .sub-title h2 {
|
|
|
+ text-align: center;
|
|
|
+ font-size: 22px;
|
|
|
+ font-weight: 500;
|
|
|
+ color: #010432;
|
|
|
+}
|
|
|
+
|
|
|
+.solution-page-section .main .solution-grid-box {
|
|
|
+ border: #8386d5 1px solid;
|
|
|
+ border-radius: 5px;
|
|
|
+ position: relative;
|
|
|
+}
|
|
|
+
|
|
|
+.solution-page-section .main .solution-grid-box .solution-img {
|
|
|
+ overflow: hidden;
|
|
|
+ z-index: -2;
|
|
|
+}
|
|
|
+
|
|
|
+.solution-page-section .main .solution-grid-box .solution-img>div {
|
|
|
+ height: 290px;
|
|
|
+ width: 100%;
|
|
|
+ background-position: center center;
|
|
|
+ background-repeat: no-repeat;
|
|
|
+ background-size: cover;
|
|
|
+}
|
|
|
+
|
|
|
+.solution-page-section .main .solution-grid-box .cover-box {
|
|
|
+ position: absolute;
|
|
|
+ top: 0;
|
|
|
+ left: 0;
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ padding: 0 5px;
|
|
|
+ -webkit-transition: all 0.3s ease-out 0s;
|
|
|
+ transition: all 0.3s ease-out 0s;
|
|
|
+ z-index: 2;
|
|
|
+ opacity: 0;
|
|
|
+ visibility: hidden;
|
|
|
+}
|
|
|
+
|
|
|
+.solution-page-section .main .solution-grid-box .cover-box>div {
|
|
|
+ width: 100%;
|
|
|
+}
|
|
|
+
|
|
|
+.solution-page-section .main .solution-grid-box .cover-box p {
|
|
|
+ color: white;
|
|
|
+ font-size: 14px;
|
|
|
+ text-align: center;
|
|
|
+}
|
|
|
+
|
|
|
+.solution-page-section .main .solution-grid-box .cover-box div:nth-child(2) {
|
|
|
+ min-height: 80px;
|
|
|
+}
|
|
|
+
|
|
|
+.solution-page-section .main .solution-grid-box::after {
|
|
|
+ content: '';
|
|
|
+ position: absolute;
|
|
|
+ left: 0;
|
|
|
+ top: 0;
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ background-color: #041d38;
|
|
|
+ z-index: 1;
|
|
|
+ -webkit-transition: all 0.3s ease-out 0s;
|
|
|
+ transition: all 0.3s ease-out 0s;
|
|
|
+ opacity: 0;
|
|
|
+ visibility: hidden;
|
|
|
+}
|
|
|
+
|
|
|
+.solution-page-section .main .solution-grid-box:hover::after {
|
|
|
+ opacity: 0.9;
|
|
|
+ visibility: visible;
|
|
|
+}
|
|
|
+
|
|
|
+.solution-page-section .main .solution-grid-box:hover .cover-box {
|
|
|
+ opacity: 1;
|
|
|
+ visibility: visible;
|
|
|
+}
|
|
|
+
|
|
|
+.solution-page-section .main .solution-grid-title span {
|
|
|
+ color: #010432;
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: 600;
|
|
|
+}
|
|
|
+
|
|
|
+.solution-page-section .page a {
|
|
|
+ color: #2a2e78;
|
|
|
+ font-size: 22px;
|
|
|
+ text-decoration: underline;
|
|
|
+ cursor: pointer;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ white-space: nowrap;
|
|
|
+ max-width: 415px;
|
|
|
+}
|
|
|
+
|
|
|
+.solution-page-section .page a:hover {
|
|
|
+ color: #ffaa17;
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+/*===========================
|
|
|
+ Join us
|
|
|
+===========================*/
|
|
|
+
|
|
|
+.join-section {
|
|
|
+ position: relative;
|
|
|
+ background-color: #f6f6fe;
|
|
|
+}
|
|
|
+
|
|
|
+.join-section .menu-1 {
|
|
|
+ color: white;
|
|
|
+ font-size: 24px;
|
|
|
+ padding: 0 0;
|
|
|
+}
|
|
|
+
|
|
|
+.join-section .menu-1 .title {
|
|
|
+ background-color: #2a2e78;
|
|
|
+ padding: 15px 0 15px 15px;
|
|
|
+}
|
|
|
+
|
|
|
+.join-section .menu-1 ul li {
|
|
|
+ color: #2a2e78;
|
|
|
+ margin-bottom: 2px;
|
|
|
+ background-color: #e0e0f8;
|
|
|
+ font-size: 16px;
|
|
|
+ cursor: pointer;
|
|
|
+ padding: 10px 0 10px 31px;
|
|
|
+}
|
|
|
+
|
|
|
+.join-section .menu-1 ul li.active {
|
|
|
+ padding: 10px 0 10px 15px;
|
|
|
+ cursor: default;
|
|
|
+}
|
|
|
+
|
|
|
+.join-section .menu-1 ul li.active::before {
|
|
|
+ content: "▪";
|
|
|
+ color: #2a2e78;
|
|
|
+ margin-right: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.join-section .menu-2 {
|
|
|
+ display: none;
|
|
|
+}
|
|
|
+
|
|
|
+.join-section .menu-2 ul li {
|
|
|
+ min-width: 50%;
|
|
|
+ text-align: center;
|
|
|
+ font-size: 18px;
|
|
|
+ cursor: pointer;
|
|
|
+ margin-bottom: 5px;
|
|
|
+}
|
|
|
+
|
|
|
+.join-section .menu-2 ul li span {
|
|
|
+ color: #2a2e78;
|
|
|
+ padding: 10px 0;
|
|
|
+ background-color: #e0e0f8;
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+}
|
|
|
+
|
|
|
+.join-section .menu-2 ul li:nth-child(odd) {
|
|
|
+ padding-right: 5px;
|
|
|
+}
|
|
|
+
|
|
|
+.join-section .menu-2 ul li:nth-child(even) {
|
|
|
+ padding-left: 5px;
|
|
|
+}
|
|
|
+
|
|
|
+.join-section .menu-2 ul li.active span {
|
|
|
+ background-color: #2a2e78;
|
|
|
+ color: white;
|
|
|
+ cursor: default;
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 768px) {
|
|
|
+ .join-section .menu-1 {
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+ .join-section .menu-2 {
|
|
|
+ display: block;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.join-section .content {
|
|
|
+ background-color: white;
|
|
|
+ padding: 30px 30px;
|
|
|
+}
|
|
|
+
|
|
|
+.join-section .content h1 {
|
|
|
+ text-align: center;
|
|
|
+ font-size: 24px;
|
|
|
+ font-weight: 600;
|
|
|
+ color: #010432;
|
|
|
+}
|
|
|
+
|
|
|
+.join-section .content h2 {
|
|
|
+ font-size: 20px;
|
|
|
+ font-weight: 600;
|
|
|
+ color: #010432;
|
|
|
+ padding: 10px 0;
|
|
|
+ margin-bottom: 5px;
|
|
|
+}
|
|
|
+
|
|
|
+.join-section .content p {
|
|
|
+ font-size: 16px;
|
|
|
+ color: #010432;
|
|
|
+ margin-bottom: 8px;
|
|
|
+}
|
|
|
+
|
|
|
+.join-section .content .email {
|
|
|
+ font-size: 16px;
|
|
|
+ color: #010432;
|
|
|
+ font-weight: 600;
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+/*===========================
|
|
|
+ Example page
|
|
|
+===========================*/
|
|
|
+
|
|
|
+.example-page-section {
|
|
|
+ position: relative;
|
|
|
+ background-color: #f6f6fe;
|
|
|
+}
|
|
|
+
|
|
|
+.example-page-section .menu-1 {
|
|
|
+ color: white;
|
|
|
+ font-size: 24px;
|
|
|
+ padding: 0 0;
|
|
|
+}
|
|
|
+
|
|
|
+.example-page-section .menu-1 .title {
|
|
|
+ background-color: #2a2e78;
|
|
|
+ padding: 15px 0 15px 15px;
|
|
|
+}
|
|
|
+
|
|
|
+.example-page-section .menu-1 ul li {
|
|
|
+ color: #2a2e78;
|
|
|
+ margin-bottom: 2px;
|
|
|
+ background-color: #e0e0f8;
|
|
|
+ font-size: 16px;
|
|
|
+ cursor: pointer;
|
|
|
+ padding: 10px 0 10px 31px;
|
|
|
+}
|
|
|
+
|
|
|
+.example-page-section .menu-1 ul li.active {
|
|
|
+ padding: 10px 0 10px 15px;
|
|
|
+ cursor: default;
|
|
|
+}
|
|
|
+
|
|
|
+.example-page-section .menu-1 ul li.active::before {
|
|
|
+ content: "▪";
|
|
|
+ color: #2a2e78;
|
|
|
+ margin-right: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.example-page-section .menu-2 {
|
|
|
+ display: none;
|
|
|
+}
|
|
|
+
|
|
|
+.example-page-section .menu-2 ul li {
|
|
|
+ min-width: 50%;
|
|
|
+ text-align: center;
|
|
|
+ font-size: 18px;
|
|
|
+ cursor: pointer;
|
|
|
+ margin-bottom: 5px;
|
|
|
+}
|
|
|
+
|
|
|
+.example-page-section .menu-2 ul li span {
|
|
|
+ color: #2a2e78;
|
|
|
+ padding: 10px 0;
|
|
|
+ background-color: #e0e0f8;
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+}
|
|
|
+
|
|
|
+.example-page-section .menu-2 ul li:nth-child(odd) {
|
|
|
+ padding-right: 5px;
|
|
|
+}
|
|
|
+
|
|
|
+.example-page-section .menu-2 ul li:nth-child(even) {
|
|
|
+ padding-left: 5px;
|
|
|
+}
|
|
|
+
|
|
|
+.example-page-section .menu-2 ul li.active span {
|
|
|
+ background-color: #2a2e78;
|
|
|
+ color: white;
|
|
|
+ cursor: default;
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 768px) {
|
|
|
+ .example-page-section .menu-1 {
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+ .example-page-section .menu-2 {
|
|
|
+ display: block;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.example-page-section .subject-box {
|
|
|
+ background-color: white;
|
|
|
+ padding: 0 25px 5px;
|
|
|
+}
|
|
|
+
|
|
|
+.example-page-section .subject-box h1 {
|
|
|
+ text-align: center;
|
|
|
+ font-size: 24px;
|
|
|
+ font-weight: 600;
|
|
|
+ color: #010432;
|
|
|
+}
|
|
|
+
|
|
|
+.example-page-section .subject-box .subject-img {
|
|
|
+ float: right;
|
|
|
+ max-height: 368px;
|
|
|
+ max-width: 550px;
|
|
|
+}
|
|
|
+
|
|
|
+.example-page-section .subject-box p {
|
|
|
+ font-size: 16px;
|
|
|
+ color: #010432;
|
|
|
+ margin-bottom: 8px;
|
|
|
+ text-align: left;
|
|
|
+ text-indent: 30px;
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 990px) {
|
|
|
+ .example-page-section .subject-box .subject-img {
|
|
|
+ float: none;
|
|
|
+ height: 100%;
|
|
|
+ width: 100%;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.example-page-section .example-list-box {
|
|
|
+ background-color: white;
|
|
|
+ padding: 35px 25px 5px;
|
|
|
+}
|
|
|
+
|
|
|
+.example-page-section .example-list-box .title h1 {
|
|
|
+ background-color: #2a2e78;
|
|
|
+ color: white;
|
|
|
+ font-size: 38px;
|
|
|
+ line-height: 65px;
|
|
|
+ font-weight: 300;
|
|
|
+ width: 300px;
|
|
|
+ text-align: center;
|
|
|
+}
|
|
|
+
|
|
|
+.example-page-section .example-list-box .img-box {
|
|
|
+ /* overflow: hidden; */
|
|
|
+ float: right;
|
|
|
+ position: relative;
|
|
|
+ z-index: 5;
|
|
|
+}
|
|
|
+
|
|
|
+.example-page-section .example-list-box .img-box .img-div {
|
|
|
+ width: 252px;
|
|
|
+ height: 322px;
|
|
|
+ background-position: center center;
|
|
|
+ background-size: cover;
|
|
|
+ background-repeat: no-repeat;
|
|
|
+ z-index: 2;
|
|
|
+}
|
|
|
+
|
|
|
+.example-page-section .example-list-box .img-box::after {
|
|
|
+ position: absolute;
|
|
|
+ right: -14px;
|
|
|
+ bottom: -14px;
|
|
|
+ width: 180px;
|
|
|
+ height: 180px;
|
|
|
+ background-color: #2a2e78;
|
|
|
+ content: '';
|
|
|
+ -webkit-clip-path: polygon(100% 0, 0 100%, 100% 100%);
|
|
|
+ clip-path: polygon(100% 0, 0 100%, 100% 100%);
|
|
|
+ z-index: -1;
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 990px) {
|
|
|
+ .example-page-section .example-list-box .img-box {
|
|
|
+ float: none;
|
|
|
+ width: 100%;
|
|
|
+ margin-bottom: 15px;
|
|
|
+ }
|
|
|
+ .example-page-section .example-list-box .img-box .img-div {
|
|
|
+ width: 100%;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.example-page-section .example-list-box .memo-box img {
|
|
|
+ max-width: 202px;
|
|
|
+ height: 14px;
|
|
|
+}
|
|
|
+
|
|
|
+.example-page-section .example-list-box .memo-box h1 {
|
|
|
+ color: #2a2e78;
|
|
|
+ font-size: 22px;
|
|
|
+ font-weight: 600;
|
|
|
+ padding: 5px 0;
|
|
|
+}
|
|
|
+
|
|
|
+.example-page-section .example-list-box .memo-box .location-scale {
|
|
|
+ color: #2a2e78;
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: 600;
|
|
|
+}
|
|
|
+
|
|
|
+.example-page-section .example-list-box .memo-box .location-scale span:nth-child(1) {
|
|
|
+ min-width: 200px;
|
|
|
+}
|
|
|
+
|
|
|
+.example-page-section .example-list-box .memo-box p {
|
|
|
+ color: #010432;
|
|
|
+ text-indent: 30px;
|
|
|
+ line-height: 1.7;
|
|
|
+}
|
|
|
+
|
|
|
+.example-page-section .example-list-box .line {
|
|
|
+ height: 2px;
|
|
|
+ background-color: #f6f6fe;
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+/*===========================
|
|
|
+ About Page
|
|
|
+===========================*/
|
|
|
+
|
|
|
+.about-introduce-section {
|
|
|
+ position: relative;
|
|
|
+}
|
|
|
+
|
|
|
+.about-introduce-section .img-box img {
|
|
|
+ max-width: 411px;
|
|
|
+ max-height: 332px;
|
|
|
+ margin: 0 auto;
|
|
|
+ display: block;
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+}
|
|
|
+
|
|
|
+.about-introduce-section .content p {
|
|
|
+ font-size: 18px;
|
|
|
+ color: #010432;
|
|
|
+ line-height: 1.8;
|
|
|
+}
|
|
|
+
|
|
|
+.about-introduce-section .content p:nth-child(1) {
|
|
|
+ text-indent: 20px;
|
|
|
+}
|
|
|
+
|
|
|
+.about-introduce-section .content p:nth-child(2) {
|
|
|
+ text-indent: 30px;
|
|
|
+}
|
|
|
+
|
|
|
+.about-introduce-section .content p span {
|
|
|
+ font-weight: 600;
|
|
|
+ padding-right: 5px;
|
|
|
+}
|
|
|
+
|
|
|
+.about-introduce-section .content a {
|
|
|
+ border: #2a2e78 1px solid;
|
|
|
+ color: #2a2e78;
|
|
|
+ font-size: 20px;
|
|
|
+ padding: 3px 30px;
|
|
|
+}
|
|
|
+
|
|
|
+.about-introduce-section .content a:hover {
|
|
|
+ border: #ffaa17 1px solid;
|
|
|
+ color: #ffaa17;
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+/*===========================
|
|
|
+ About Page -- Credential
|
|
|
+===========================*/
|
|
|
+
|
|
|
+.credential-section {
|
|
|
+ position: relative;
|
|
|
+ background-color: #f7fcff;
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+/*===========================
|
|
|
+ About Page -- Investor Relations
|
|
|
+===========================*/
|
|
|
+
|
|
|
+.investor-section {
|
|
|
+ position: relative;
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+/*===========================
|
|
|
+ About Page -- Organizational Structure
|
|
|
+===========================*/
|
|
|
+
|
|
|
+.org-structure-section {
|
|
|
+ position: relative;
|
|
|
+ background-color: #f7fcff;
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+/*===========================
|
|
|
+ About Page -- History
|
|
|
+===========================*/
|
|
|
+
|
|
|
+.history-section {
|
|
|
+ position: relative;
|
|
|
+}
|
|
|
+
|
|
|
+.history-section .content .left-box {
|
|
|
+ width: 185px;
|
|
|
+ min-width: 185px;
|
|
|
+ border-right: #2a2e78 5px solid;
|
|
|
+ display: inline-block;
|
|
|
+}
|
|
|
+
|
|
|
+.history-section .content h1 {
|
|
|
+ color: #2a2e78;
|
|
|
+ font-size: 20px;
|
|
|
+ font-weight: 600;
|
|
|
+}
|
|
|
+
|
|
|
+.history-section .content .line {
|
|
|
+ height: 5px;
|
|
|
+ width: 25px;
|
|
|
+ background-color: #2a2e78;
|
|
|
+}
|
|
|
+
|
|
|
+.history-section .content .right-box {
|
|
|
+ display: inline-block;
|
|
|
+}
|
|
|
+
|
|
|
+.history-section .content .right-box p {
|
|
|
+ padding-left: 25px;
|
|
|
+}
|
|
|
+
|
|
|
+.history-section .content .right-box p span,
|
|
|
+.history-section .content .left-box p span {
|
|
|
+ color: #2a2e78;
|
|
|
+ padding-right: 5px;
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+/*===========================
|
|
|
+ About Page -- Sub Company
|
|
|
+===========================*/
|
|
|
+
|
|
|
+.about-sub-company-section {
|
|
|
+ position: relative;
|
|
|
+ background-image: url(../img/sub_company_bg.png);
|
|
|
+ background-position: center center;
|
|
|
+ background-repeat: no-repeat;
|
|
|
+ background-size: cover;
|
|
|
+ min-height: 1081px;
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 770px) {
|
|
|
+ .about-sub-company-section {
|
|
|
+ background-image: none;
|
|
|
+ height: 100%;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.about-sub-company-section p {
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: 600;
|
|
|
+}
|
|
|
+
|
|
|
+.about-sub-company-section .item-box {
|
|
|
+ max-width: 500px;
|
|
|
+}
|
|
|
+
|
|
|
+.about-sub-company-section .item-box .address-iphone-box .icon {
|
|
|
+ width: 25px;
|
|
|
+ height: 25px;
|
|
|
+ min-width: 25px;
|
|
|
+ min-height: 25px;
|
|
|
+ fill: currentColor;
|
|
|
+ overflow: hidden;
|
|
|
+}
|
|
|
+
|
|
|
+.about-sub-company-section hr {
|
|
|
+ margin: 35px 0;
|
|
|
+}
|
|
|
+
|
|
|
+.about-sub-company-section .item-box .short-name-box {
|
|
|
+ min-width: 100px;
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+/*===========================
|
|
|
+ Service page
|
|
|
+===========================*/
|
|
|
+
|
|
|
+.service-section {
|
|
|
+ position: relative;
|
|
|
+ background-color: #f6f6fe;
|
|
|
+}
|
|
|
+
|
|
|
+.service-section h1 {
|
|
|
+ text-align: center;
|
|
|
+ font-size: 22px;
|
|
|
+ font-weight: 500;
|
|
|
+ color: #010432;
|
|
|
+}
|
|
|
+
|
|
|
+.service-section .content-box {
|
|
|
+ max-width: 440px;
|
|
|
+ margin: 0 auto;
|
|
|
+}
|
|
|
+
|
|
|
+.service-section .left-box {
|
|
|
+ min-width: 200px;
|
|
|
+ padding: 0 20px;
|
|
|
+ display: inline-block;
|
|
|
+}
|
|
|
+
|
|
|
+.service-section .left-box img {
|
|
|
+ max-width: 160px;
|
|
|
+ max-height: 160px;
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ display: block;
|
|
|
+ margin: 0 auto;
|
|
|
+}
|
|
|
+
|
|
|
+.service-section .left-box span {
|
|
|
+ text-align: center;
|
|
|
+ display: block;
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: 500;
|
|
|
+ color: #010432;
|
|
|
+}
|
|
|
+
|
|
|
+.service-section .right-box {
|
|
|
+ padding: 0 20px;
|
|
|
+ height: 160px;
|
|
|
+ display: inline-block;
|
|
|
+}
|
|
|
+
|
|
|
+.service-section .right-box>div {
|
|
|
+ height: 100%;
|
|
|
+}
|
|
|
+
|
|
|
+.service-section .right-box img {
|
|
|
+ max-width: 26px;
|
|
|
+ max-height: 20px;
|
|
|
+}
|
|
|
+
|
|
|
+.service-section .right-box p span {
|
|
|
+ font-size: 16px;
|
|
|
+ color: #010432;
|
|
|
+}
|
|
|
+
|
|
|
+.service-section .right-box .download {
|
|
|
+ padding: 10px 0;
|
|
|
+ background-color: #2a2e78;
|
|
|
+ cursor: pointer;
|
|
|
+}
|
|
|
+
|
|
|
+.service-section .right-box .download span {
|
|
|
+ color: white;
|
|
|
+}
|
|
|
+
|
|
|
+.service-section .right-box .download:hover span {
|
|
|
+ color: #ffaa17;
|
|
|
+}
|
|
|
+
|
|
|
+.service-section .right-box .download:hover svg path {
|
|
|
+ fill: #ffaa17;
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width:576px) {
|
|
|
+ .service-section .right-box,
|
|
|
+ .service-section .left-box {
|
|
|
+ width: 100%;
|
|
|
+ display: block;
|
|
|
+ }
|
|
|
+ .service-section .right-box {
|
|
|
+ margin-top: 20px;
|
|
|
+ }
|
|
|
+ .service-section .right-box>div {
|
|
|
+ -ms-flex-align: center;
|
|
|
+ align-items: center;
|
|
|
+ }
|
|
|
+ .service-section .right-box .download {
|
|
|
+ min-width: 200px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+/*===========================
|
|
|
+ Technology page
|
|
|
+===========================*/
|
|
|
+
|
|
|
+.technology-section {
|
|
|
+ position: relative;
|
|
|
+ background-color: #f6f6fe;
|
|
|
+}
|
|
|
+
|
|
|
+.technology-section .menu-1 {
|
|
|
+ color: white;
|
|
|
+ font-size: 24px;
|
|
|
+ padding: 0 0;
|
|
|
+}
|
|
|
+
|
|
|
+.technology-section .menu-1 .title {
|
|
|
+ background-color: #2a2e78;
|
|
|
+ padding: 15px 0 15px 15px;
|
|
|
+}
|
|
|
+
|
|
|
+.technology-section .menu-1 ul li {
|
|
|
+ color: #010432;
|
|
|
+ margin-bottom: 2px;
|
|
|
+ background-color: #e0e0f8;
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: 600;
|
|
|
+ cursor: pointer;
|
|
|
+ padding: 10px 0 10px 31px;
|
|
|
+}
|
|
|
+
|
|
|
+.technology-section .menu-1 ul li.active {
|
|
|
+ padding: 10px 0 10px 15px;
|
|
|
+ cursor: default;
|
|
|
+ color: #2a2e78;
|
|
|
+ font-weight: 500;
|
|
|
+}
|
|
|
+
|
|
|
+.technology-section .menu-1 ul li.active::before {
|
|
|
+ content: "▪";
|
|
|
+ color: #2a2e78;
|
|
|
+ margin-right: 10px;
|
|
|
+ display: inline-block;
|
|
|
+}
|
|
|
+
|
|
|
+.technology-section .menu-2 {
|
|
|
+ display: none;
|
|
|
+}
|
|
|
+
|
|
|
+.technology-section .menu-2 ul li {
|
|
|
+ min-width: 50%;
|
|
|
+ text-align: center;
|
|
|
+ font-size: 18px;
|
|
|
+ cursor: pointer;
|
|
|
+ margin-bottom: 5px;
|
|
|
+}
|
|
|
+
|
|
|
+.technology-section .menu-2 ul li span {
|
|
|
+ color: #2a2e78;
|
|
|
+ padding: 10px 0;
|
|
|
+ background-color: #e0e0f8;
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+}
|
|
|
+
|
|
|
+.technology-section .menu-2 ul li.active span {
|
|
|
+ background-color: #2a2e78;
|
|
|
+ color: white;
|
|
|
+ cursor: default;
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 768px) {
|
|
|
+ .technology-section .menu-1 {
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+ .technology-section .menu-2 {
|
|
|
+ display: block;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.technology-section .content-box {
|
|
|
+ background-color: white;
|
|
|
+ padding: 40px 30px;
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 575px) {
|
|
|
+ .technology-section .content-box {
|
|
|
+ padding: 40px 15px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.technology-section .content-box h1 {
|
|
|
+ font-size: 24px;
|
|
|
+ font-weight: 600;
|
|
|
+ text-align: center;
|
|
|
+ color: #010432;
|
|
|
+}
|
|
|
+
|
|
|
+.technology-section .content-box .item {
|
|
|
+ border: #dcdcdc 2px solid;
|
|
|
+}
|
|
|
+
|
|
|
+.technology-section .content-box .item .title {
|
|
|
+ height: 45px;
|
|
|
+ color: #010432;
|
|
|
+ background-color: #F0EFF5;
|
|
|
+ font-size: 20px;
|
|
|
+ font-weight: 600;
|
|
|
+}
|
|
|
+
|
|
|
+.technology-section .content-box .item .memo-box {
|
|
|
+ padding: 25px
|
|
|
+}
|
|
|
+
|
|
|
+.technology-section .content-box .item .memo-box .img-box {
|
|
|
+ float: left;
|
|
|
+ margin-right: 10px;
|
|
|
+ overflow: hidden;
|
|
|
+}
|
|
|
+
|
|
|
+.technology-section .content-box .item .memo-box .img-box .img-div {
|
|
|
+ width: 162px;
|
|
|
+ height: 199px;
|
|
|
+ background-position: center center;
|
|
|
+ background-repeat: no-repeat;
|
|
|
+ background-size: cover;
|
|
|
+}
|
|
|
+
|
|
|
+.technology-section .content-box .item .memo-box p {
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: 400;
|
|
|
+ text-indent: 30px;
|
|
|
+ color: #010432;
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 576px) {
|
|
|
+ .technology-section .content-box .item .memo-box .img-box {
|
|
|
+ float: none;
|
|
|
+ width: 100%;
|
|
|
+ margin-right: 0;
|
|
|
+ }
|
|
|
+ .technology-section .content-box .item .memo-box .img-box .img-div {
|
|
|
+ width: 100%;
|
|
|
+ }
|
|
|
+}
|
ming
4 tahun lalu
