/* Document ========================================================================== */ /** * 1. Correct the line height in all browsers. * 2. Prevent adjustments of font size after orientation changes in iOS. */ html { line-height: 1.15; /* 1 */ -webkit-text-size-adjust: 100%; /* 2 */ } /* Sections ========================================================================== */ /** * Remove the margin in all browsers. */ body { margin: 0; } /** * Render the `main` element consistently in IE. */ main { display: block; } /** * Correct the font size and margin on `h1` elements within `section` and * `article` contexts in Chrome, Firefox, and Safari. */ h1 { font-size: 2em; margin: 0.67em 0; } /* Grouping content ========================================================================== */ /** * 1. Add the correct box sizing in Firefox. * 2. Show the overflow in Edge and IE. */ hr { box-sizing: content-box; /* 1 */ height: 0; /* 1 */ overflow: visible; /* 2 */ } /** * 1. Correct the inheritance and scaling of font size in all browsers. * 2. Correct the odd `em` font sizing in all browsers. */ pre { font-family: monospace, monospace !important; /* 1 */ font-size: 1em; /* 2 */ } /* Text-level semantics ========================================================================== */ /** * Remove the gray background on active links in IE 10. */ a { background-color: transparent; } /** * 1. Remove the bottom border in Chrome 57- * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari. */ abbr[title] { border-bottom: none; /* 1 */ text-decoration: underline; /* 2 */ text-decoration: underline dotted; /* 2 */ } /** * Add the correct font weight in Chrome, Edge, and Safari. */ b, strong { font-weight: bolder; } /** * 1. Correct the inheritance and scaling of font size in all browsers. * 2. Correct the odd `em` font sizing in all browsers. */ code, kbd, samp { font-family: monospace, monospace !important; /* 1 */ font-size: 1em; /* 2 */ } /** * Add the correct font size in all browsers. */ small { font-size: 80%; } /** * Prevent `sub` and `sup` elements from affecting the line height in * all browsers. */ sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sub { bottom: -0.25em; } sup { top: -0.5em; } /* Embedded content ========================================================================== */ /** * Remove the border on images inside links in IE 10. */ img { border-style: none; } /* Forms ========================================================================== */ /** * 1. Change the font styles in all browsers. * 2. Remove the margin in Firefox and Safari. */ button, input, optgroup, select, textarea { font-family: inherit; /* 1 */ font-size: 100%; /* 1 */ line-height: 1.15; /* 1 */ margin: 0; /* 2 */ } /** * Show the overflow in IE. * 1. Show the overflow in Edge. */ button, input { /* 1 */ overflow: visible; } /** * Remove the inheritance of text transform in Edge, Firefox, and IE. * 1. Remove the inheritance of text transform in Firefox. */ button, select { /* 1 */ text-transform: none; } /** * Correct the inability to style clickable types in iOS and Safari. */ button, [type="button"], [type="reset"], [type="submit"] { -webkit-appearance: button; } /** * Remove the inner border and padding in Firefox. */ button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner { border-style: none; padding: 0; } /** * Restore the focus styles unset by the previous rule. */ button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring { outline: 1px dotted ButtonText; } /** * Correct the padding in Firefox. */ fieldset { padding: 0.35em 0.75em 0.625em; } /** * 1. Correct the text wrapping in Edge and IE. * 2. Correct the color inheritance from `fieldset` elements in IE. * 3. Remove the padding so developers are not caught out when they zero out * `fieldset` elements in all browsers. */ legend { box-sizing: border-box; /* 1 */ color: inherit; /* 2 */ display: table; /* 1 */ max-width: 100%; /* 1 */ padding: 0; /* 3 */ white-space: normal; /* 1 */ } /** * Add the correct vertical alignment in Chrome, Firefox, and Opera. */ progress { vertical-align: baseline; } /** * Remove the default vertical scrollbar in IE 10+. */ textarea { overflow: auto; } /** * 1. Add the correct box sizing in IE 10. * 2. Remove the padding in IE 10. */ [type="checkbox"], [type="radio"] { box-sizing: border-box; /* 1 */ padding: 0; /* 2 */ } /** * Correct the cursor style of increment and decrement buttons in Chrome. */ [type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button { height: auto; } /** * 1. Correct the odd appearance in Chrome and Safari. * 2. Correct the outline style in Safari. */ [type="search"] { -webkit-appearance: textfield; /* 1 */ outline-offset: -2px; /* 2 */ } /** * Remove the inner padding in Chrome and Safari on macOS. */ [type="search"]::-webkit-search-decoration { -webkit-appearance: none; } /** * 1. Correct the inability to style clickable types in iOS and Safari. * 2. Change font properties to `inherit` in Safari. */ ::-webkit-file-upload-button { -webkit-appearance: button; /* 1 */ font: inherit; /* 2 */ } /* Interactive =========================================== =============================== */ /* * Add the correct display in Edge, IE 10+, and Firefox. */ details { display: block; } /* * Add the correct display in all browsers. */ summary { display: list-item; } /* Misc ========================================================================== */ /** * Add the correct display in IE 10+. */ template { display: none; } /** * Add the correct display in IE 10. */ [hidden] { display: none; } *:focus { outline: 0 !important; } *button:focus { border: none; outline: none; box-shadow: none; } * { list-style-type: none; font-size: 14px; } *:focus, *:active { outline: none !important; } *:hover { transition: 0.5s; } *::selection { color: #1c849e; } *a, a:visited { color: #990000; text-decoration: none; } body { color: #888787; /* dark gray */ } .main_body { z-index: 2; position: relative; background-color: #fff; } .affix { top: 0; width: 100%; z-index: 9999 !important; } h1, h2, h3, h4, h5, h6 { font-family: "Oswald", sans-serif !important; color: #000000; } .gap { padding-top: 100px; padding-bottom: 50px; } .gap2 { padding-top: 50px; } html { scroll-behavior: smooth; } html .back-to-top { position: fixed; bottom: 25px; right: 25px; display: block; z-index: 999; } input{ margin: 0 0 0 0 !important; } .text { font-family: 'Open Sans', sans-serif !important; font-size: 14px; line-height: 29px; letter-spacing: 2px; } .progress-bar { position: fixed; top: 0; height: 3px; width: 0; background-image: linear-gradient(90deg, #B8C1E5 0%, #b36251 100%); z-index: 11; transition: width .2s; will-change: width; } .o_website_rating_table_progress .progress-bar { position: inherit; top: 0; height: 22px; width: 0; background-image: linear-gradient(90deg, #B8C1E5 0%, #FF2E38 100%); z-index: 11; transition: width .2s; will-change: width; } @keyframes fade-in { from { opacity: 0; transform: scale(0.7, 0.7); } to { opacity: 1; } } .fade-in-element { animation: fade-in 1.4s; transition: all 1s; transition-delay: 1s; -webkit-transition-delay: 1s; } .hidden { opacity: 0; } .btn { cursor: unset !important; line-height: 1.5; color: #000000; padding: 12px 12px; letter-spacing: 0.05rem; box-shadow: none !important; background-color: transparent !important; } .btn:focus{ color: #b36251; } .o_dropdown_menu .btn{ padding: 0 !important; } .navbar-light .btn-secondary{ color: #000000; } .o_portal_wrap .nav{ display: flex; flex-wrap: nowrap; } .o_portal_wrap .btn{ line-height: 1; } .oe_website_login_container .btn-secondary{ padding: 0px 10px !important; } .btn-primary, .btn-outline-primary { background-color: #2b2424 !important; color: white; letter-spacing: 4px !important; font-size: 12px !important; border-color: #000000 !important; border: 1px solid #000 !important; } .btn-close:hover{ color: red !important; } .o_homepage_editor_welcome_message b{ font-size: 35px !important; } .o_homepage_editor_welcome_message .lead b{ font-size: 20px !important; } .btn-primary:hover { background-color: transparent !important; color: #000 !important; border: 1px solid #000 !important; } .btn-index { border-radius: 0; border-color: #fff !important; border: 1px solid; background-color: transparent; color: #fff; letter-spacing: 4px; font-size: 12px; padding: 15px 15px; } .btn-index:hover { background-color: transparent; } .btn-top { cursor: unset !important; line-height: 1.5; color: #000000; padding: 10px 12px; letter-spacing: 0.05rem; box-shadow: none !important; background-color: transparent !important; } .btn-top:hover { background-color: #fff !important; color: #888787; } .btn-primary_b { border-radius: 0; border-color: #fff !important; border: 1px solid; background-color: transparent; color: #fff; letter-spacing: 4px; font-size: 12px; padding: 15px 40px; position: relative; } .btn-primary_b::before { position: absolute; content: ""; width: 0px; height: 0px; left: 0; bottom: 0; border: 3px solid transparent; box-sizing: border-box; } .btn-primary_b::before:hover { width: calc(240px / 2); height: 46px; border: 3px solid #111; border-right: none; border-bottom: none; transition: height 0.3s linear, width 0.3s linear 0.3s; } .btn-primary_b::after { position: absolute; content: ""; width: 0px; height: 0px; top: 0; right: 0; border: 3px solid transparent; box-sizing: border-box; } .btn-primary_b::after:hover { width: calc(600px / 2); border: 3px solid #111; border-left: none; border-top: none; transition: height 0.3s linear, width 0.3s linear 0.3s; } .btn-primary_c { border-radius: 0; border-color: #000000 !important; border: 1px solid; background-color: transparent; color: #000000; letter-spacing: 4px; font-size: 13px; font-weight: 600; padding: 15px 40px; } .btn-primary_c:hover { background-color: transparent; } .btn-recent { border-radius: 0; border-color: #b36251 !important; border: 1px solid; background-color: #b36251 !important; color: #fff; letter-spacing: 4px; font-size: 12px; padding: 15px 25px; position: relative; } .btn-recent .arrow { border: solid white; border-width: 0 2px 2px 0; display: inline-block; padding: 3px; } .btn-recent .right { transform: rotate(-45deg); -webkit-transform: rotate(-45deg); margin-left: 23px; position: absolute; top: 20px; left: 110px; } .btn-recent::after { content: ""; position: absolute; height: 1px; width: 10px; background-color: transparent !important; top: 24px; left: 106px; display: block; } .btn-recent:hover { padding-right: 65px; color: #fff !important; } .btn-recent:hover .right { transform: rotate(-45deg); -webkit-transform: rotate(-45deg); margin-left: 22px; position: absolute; position: absolute; top: 22px; left: 141px; transition: 0.5s; } .btn-recent:hover::after { content: ""; position: absolute; height: 1px; width: 20px; background-color: #fff !important; top: 25px; left: 146px; display: block; transition: 0.5s; /* IE 9 */ transform: scaleX(1.5); } .btn-card { border-radius: 25px !important; border-color: #fff !important; border: 1px solid; background-color: transparent; color: #fff; letter-spacing: 4px; font-size: 13px; font-weight: 600; padding: 15px 40px; } .btn-card:hover { background-color: #333333 !important; border-color: #333333 !important; color: #000000; } .btn-load { border-radius: 0; border-color: #fff !important; border: none !important; background-color: transparent; color: #f6faff; font-size: 50px; font-weight: 700; margin: auto; } .btn-load:hover { color: #fff; transition: 0.5s; } .btn-recent-blog { border-radius: 0; border-color: #f6faff !important; border: 1px solid; background-color: #b36251 !important; color: #fff; letter-spacing: 4px; font-size: 12px; padding: 15px 40px; position: relative; } .btn-recent-blog .arrow { border: solid white; border-width: 0 2px 2px 0; display: inline-block; padding: 3px; } .btn-recent-blog .right { transform: rotate(-45deg); -webkit-transform: rotate(-45deg); margin-left: 55px; position: absolute; top: 22px; left: 112px; } .btn-recent-blog::after { content: ""; position: absolute; height: 2px; width: 10px; background-color: transparent !important; top: 25px; left: 106px; display: block; } .btn-recent-blog:hover { padding-right: 65px; color: #fff !important; } .btn-recent-blog:hover .right { transform: rotate(-45deg); -webkit-transform: rotate(-45deg); margin-left: 40px; position: absolute; position: absolute; top: 22px; left: 150px; transition: 0.5s; } .btn-recent-blog:hover::after { content: ""; position: absolute; height: 2px; width: 20px; background-color: #fff !important; top: 25px; left: 172px; display: block; transition: 0.5s; transform: scaleX(1.5); } .btn-link:hover{ color: #b36251 !important; } html, html *, body, body * { cursor: pointer !important; } .cursor-dot, .cursor-dot-outline { pointer-events: none; position: absolute; top: 50%; left: 50%; border-radius: 50%; opacity: 0; transform: translate(-50%, -50%); transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out; z-index: 1051; } .cursor-dot { width: 8px; height: 8px; background-color: #dc5656; } .cursor-dot-outline { width: 40px; height: 40px; background-color: rgba(229, 128, 128, 0.5); } .no-js #loader { display: none; } .js #loader { display: block; position: absolute; left: 100px; top: 0; } .se-pre-con { position: fixed; left: 0px; top: 0px; width: 100%; height: 100%; z-index: 9999; background: url(http://smallenvelop.com/demo/simple-pre-loader/images/loader-64x/Preloader_2.gif) center no-repeat #ffffff; } #menu { z-index: 999; cursor: unset !important; position: fixed; background-color: transparent !important; top: 0; display: block; transition: top 0.3s; } #menu-bar { width: 45px; height: 40px; margin: 35px 35px 10px 20px; cursor: pointer; cursor: unset !important; } .bar { height: 5px; width: 100%; background-color: #b36251; display: block; border-radius: 5px; transition: 0.9s ease; cursor: unset !important; } #bar1 { transform: translateY(-4px); } #bar3 { transform: translateY(4px); } .nav { transition: 0.9s ease; padding-right: 30px; } #top_menu_collapse .nav ul { padding: 0 22px; } #top_menu_collapse .nav li { list-style: none; } #top_menu_collapse .nav li a { color: white; font-size: 25px !important; text-decoration: none; } #top_menu_collapse .nav li span, .links span{ font-size: 25px !important; } #top_menu_collapse { background: #b36251; } .nav li a:hover { font-weight: bold; color: #f0bd7a !important; } .flex-nowrap .col{ flex-grow: 1 !important; } .card ul, li ul{ margin-left: 0 !important; } .nav li a:hover { font-weight: bold; color: #f03f45; } .col-lg, .col-12, .col-lg-auto{ padding-left: 0 !important; padding-right: 0 !important; } .form-inline{ flex-flow: row; } .form-check { display: flex; align-items: center; } .js_variant_change{ margin: 5px !important; } .menu-bg, #menu { top: 0; right: 0 !important; position: absolute; } .menu-bg { z-index: 3; width: 0; height: 0; background: radial-gradient(circle, #b36251, #b36251); transition: 0.9s ease; } .menu-bg2 { z-index: 3; width: 0; height: 0; background: radial-gradient(circle, #333333, #333333); transition: 0.9s ease; } .change { display: block; } .change #bar1 { transform: translateY(4px) rotateZ(-45deg); } .change #bar2 { opacity: 0; } .change #bar3 { transform: translateY(-6px) rotateZ(45deg); } .change-bg { width: 49.5vw; height: 100vh; transform: translate(0%, 0%); z-index: 3; } .change-bg2 { width: 49.5vw; height: 100vh; transform: translate(0%, 0%); z-index: 3; } #logo { position: fixed; top: 10px; z-index: 999; display: block; transition: top 0.6s; display:none; } #logo a { font-size: 45px; color: #b36251; font-weight: 700; text-decoration: none; } .main_body .header { position: relative; z-index: 1; } .main_body .header .wrapper { position: relative; } .main_body .header .wrapper .banner_index .banner_bg { justify-content: center; width: 100%; margin: auto; background-size: cover; height: 100%; background-repeat: no-repeat; background-position: center; background-color: #333333; } @media screen and (max-width: 768px) { .main_body .header .wrapper .banner_index .banner_bg { height: auto; } } .main_body .header .wrapper .banner_index .banner_bg .card { display: none; background: transparent; padding-top: 100px; padding-bottom: 100px; border: none !important; letter-spacing: -2px; text-transform: uppercase; } @media screen and (max-width: 996px) { .main_body .header .wrapper .banner_index .banner_bg .card { display: block; padding-top: 200px; padding-left: 100px; } } @media screen and (max-width: 768px) { .main_body .header .wrapper .banner_index .banner_bg .card { display: block; padding-top: 200px; padding-left: 100px; } } @media screen and (max-width: 572px) { .main_body .header .wrapper .banner_index .banner_bg .card { display: block; padding-top: 100px; padding-left: 25px; } } @media screen and (max-width: 450px) { .main_body .header .wrapper .banner_index .banner_bg .card { display: block; padding-top: 100px; padding-left: 20px; } } .main_body .header .wrapper .banner_index .banner_bg .card .card-title { font-size: 2.5vw; font-weight: 700; color: #f6faff; } @media screen and (max-width: 996px) { .main_body .header .wrapper .banner_index .banner_bg .card .card-title { font-size: 25px; } } @media screen and (max-width: 572px) { .main_body .header .wrapper .banner_index .banner_bg .card .card-title { font-size: 18px; } } @media screen and (max-width: 768px) { .main_body .header .wrapper .banner_index .banner_bg .card .card-title { font-size: 25px; } } .main_body .header .wrapper .banner_index .banner_bg .card .card-text { color: #fff; font-size: 3.5vw; font-weight: bolder; } @media screen and (max-width: 996px) { .main_body .header .wrapper .banner_index .banner_bg .card .card-text { font-size: 40px; } } @media screen and (max-width: 768px) { .main_body .header .wrapper .banner_index .banner_bg .card .card-text { font-size: 40px; } } @media screen and (max-width: 572px) { .main_body .header .wrapper .banner_index .banner_bg .card .card-text { font-size: 30px; } } .main_body .header .wrapper .banner_index .banner_bg .card .text-bottom { font-size: 20px; color: #f6faff; font-weight: bolder; padding-bottom: 40px; letter-spacing: 0px; } .main_body .header .wrapper .banner_index .banner_bg2 { justify-content: center; width: 100%; margin: auto; background-size: cover; height: 100vh; background-repeat: no-repeat; background-position: center; } @media screen and (max-width: 768px) { .main_body .header .wrapper .banner_index .banner_bg2 { height: auto; } } .main_body .header .wrapper .banner_index .banner_bg2 .card { display: none; background: transparent; padding-top: 100px; padding-bottom: 100px; border: none !important; letter-spacing: -2px; text-transform: uppercase; } @media screen and (max-width: 996px) { .main_body .header .wrapper .banner_index .banner_bg2 .card { display: block; padding-top: 200px; padding-left: 100px; } } @media screen and (max-width: 768px) { .main_body .header .wrapper .banner_index .banner_bg2 .card { display: block; padding-top: 200px; padding-left: 100px; } } @media screen and (max-width: 572px) { .main_body .header .wrapper .banner_index .banner_bg2 .card { display: block; padding-top: 100px; padding-left: 25px; } } @media screen and (max-width: 450px) { .main_body .header .wrapper .banner_index .banner_bg2 .card { display: block; padding-top: 100px; padding-left: 20px; } } .main_body .header .wrapper .banner_index .banner_bg2 .card .card-title { font-size: 2.5vw; font-weight: 700; color: #f6faff; } @media screen and (max-width: 996px) { .main_body .header .wrapper .banner_index .banner_bg2 .card .card-title { font-size: 25px; } } @media screen and (max-width: 572px) { .main_body .header .wrapper .banner_index .banner_bg2 .card .card-title { font-size: 18px; } } @media screen and (max-width: 768px) { .main_body .header .wrapper .banner_index .banner_bg2 .card .card-title { font-size: 25px; } } .main_body .header .wrapper .banner_index .banner_bg2 .card .card-text { color: #fff; font-size: 3.5vw; font-weight: bolder; } @media screen and (max-width: 996px) { .main_body .header .wrapper .banner_index .banner_bg2 .card .card-text { font-size: 40px; } } @media screen and (max-width: 768px) { .main_body .header .wrapper .banner_index .banner_bg2 .card .card-text { font-size: 40px; } } @media screen and (max-width: 572px) { .main_body .header .wrapper .banner_index .banner_bg2 .card .card-text { font-size: 30px; } } .main_body .header .wrapper .banner_index .banner_bg2 .card .text-bottom { font-size: 20px; color: #f6faff; font-weight: bolder; padding-bottom: 40px; letter-spacing: 0px; } .main_body .header .wrapper .banner_index .banner_bg3 { justify-content: center; width: 100%; margin: auto; background-size: cover; height: 100vh; background-repeat: no-repeat; background-position: center; } @media screen and (max-width: 768px) { .main_body .header .wrapper .banner_index .banner_bg3 { height: auto; } } .main_body .header .wrapper .banner_index .banner_bg3 .card { display: none; background: transparent; padding-top: 100px; padding-bottom: 100px; border: none !important; letter-spacing: -2px; text-transform: uppercase; } @media screen and (max-width: 996px) { .main_body .header .wrapper .banner_index .banner_bg3 .card { display: block; padding-top: 200px; padding-left: 100px; } } @media screen and (max-width: 768px) { .main_body .header .wrapper .banner_index .banner_bg3 .card { display: block; padding-top: 200px; padding-left: 100px; } } @media screen and (max-width: 572px) { .main_body .header .wrapper .banner_index .banner_bg3 .card { display: block; padding-top: 100px; padding-left: 25px; } } @media screen and (max-width: 450px) { .main_body .header .wrapper .banner_index .banner_bg3 .card { display: block; padding-top: 100px; padding-left: 20px; } } .main_body .header .wrapper .banner_index .banner_bg3 .card .card-title { font-size: 2.5vw; font-weight: 700; color: #f6faff; } @media screen and (max-width: 996px) { .main_body .header .wrapper .banner_index .banner_bg3 .card .card-title { font-size: 25px; } } @media screen and (max-width: 572px) { .main_body .header .wrapper .banner_index .banner_bg3 .card .card-title { font-size: 18px; } } @media screen and (max-width: 768px) { .main_body .header .wrapper .banner_index .banner_bg3 .card .card-title { font-size: 25px; } } .main_body .header .wrapper .banner_index .banner_bg3 .card .card-text { color: #fff; font-size: 3.5vw; font-weight: bolder; } @media screen and (max-width: 996px) { .main_body .header .wrapper .banner_index .banner_bg3 .card .card-text { font-size: 40px; } } @media screen and (max-width: 768px) { .main_body .header .wrapper .banner_index .banner_bg3 .card .card-text { font-size: 40px; } } @media screen and (max-width: 572px) { .main_body .header .wrapper .banner_index .banner_bg3 .card .card-text { font-size: 30px; } } .main_body .header .wrapper .banner_index .banner_bg3 .card .text-bottom { font-size: 20px; color: #f6faff; font-weight: bolder; padding-bottom: 40px; letter-spacing: 0px; } .main_body .header .wrapper .banner_index .banner_left { width: 100%; height: 100%; display: flex; justify-content: center; background-color: #333333; } .main_body .header .wrapper .banner_index .banner_left canvas { position: absolute; top: 0; left: 0; } .main_body .header .wrapper .banner_index .banner_left p { opacity: 0; animation: fadeInUp 1s ease-in-out 0s forwards; } .main_body .header .wrapper .banner_index .banner_left p.first { animation-delay: 1s; } .main_body .header .wrapper .banner_index .banner_left p.second { animation-delay: 3s; } .main_body .header .wrapper .banner_index .banner_left p.third { animation-delay: 5s; } .main_body .header .wrapper .banner_index .banner_left p.fourth { animation-delay: 7s; } .main_body .header .wrapper .banner_index .banner_left p.fifth { animation-delay: 9s; } .main_body .header .wrapper .banner_index .banner_left p.sixth { animation-delay: 11s; } .main_body .header .wrapper .banner_index .banner_left .btn, .main_body .header .wrapper .banner_index .banner_left .owl-nav { opacity: 0; animation: fadeInUp 1s ease-in-out 0s forwards; } .main_body .header .wrapper .banner_index .banner_left .btn.fourth, .main_body .header .wrapper .banner_index .banner_left .owl-nav.fourth { animation-delay: 7s; } .main_body .header .wrapper .banner_index .banner_left .owl-nav { opacity: 0; animation: fadeInUp 1s ease-in-out 0s forwards; } .main_body .header .wrapper .banner_index .banner_left .owl-nav.first { animation-delay: 1s; } .main_body .header .wrapper .banner_index .banner_left .owl-nav.second { animation-delay: 3s; } .main_body .header .wrapper .banner_index .banner_left .owl-nav.third { animation-delay: 5s; } .main_body .header .wrapper .banner_index .banner_left .owl-nav.fourth { animation-delay: 7s; } .main_body .header .wrapper .banner_index .banner_left .owl-nav.fifth { animation-delay: 9s; } .main_body .header .wrapper .banner_index .banner_left .owl-nav.sixth { animation-delay: 11s; } .nav-prev { left: 60% !important; top: inherit !important; bottom: 30px !important; scale: 1.2; width: 0% !important; } .nav-next { left: 70% !important; top: inherit !important; bottom: 30px !important; scale: 1.2; width: 0% !important; } .nav-prev .carousel-control-prev-icon:hover{ scale: 1.38; } .nav-next .carousel-control-next-icon:hover{ scale: 1.38; } .main_body .header .wrapper .banner_index .banner_left .card { background: transparent; padding-top: 100px; padding-bottom: 100px; border: none !important; letter-spacing: -2px; text-transform: uppercase; } .main_body .header .wrapper .banner_index .banner_left .card .card-title { font-size: 2.5vw; font-weight: 700; color: #f6faff; } .main_body .header .wrapper .banner_index .banner_left .card .card-text { color: #fff; font-size: 3.5vw; font-weight: bolder; } .main_body .header .wrapper .banner_index .banner_left .card .text-bottom { font-size: 20px; color: #f6faff; font-weight: bolder; padding-bottom: 40px; letter-spacing: 0px; } .main_body .header .wrapper .owl-carousel button.owl-dot span { height: 20px; width: 20px; color: #fff; background-color: transparent; display: block; font-weight: bolder; margin: 5px; } @media screen and (max-width: 996px) { .main_body .header .wrapper .owl-carousel button.owl-dot span { right: 16%; bottom: 4%; } } .main_body .header .wrapper .owl-carousel button.owl-dot.active span { color: #f0bd7a; height: 30px; width: 30px; font-size: 25px; } .main_body .header .wrapper .owl-carousel { position: relative; } .main_body .header .wrapper .owl-carousel .owl-nav { position: absolute; right: 36%; bottom: 4%; width: 250px; text-align: center; padding-top: 23px; } @media screen and (max-width: 996px) { .main_body .header .wrapper .owl-carousel .owl-nav { right: 0%; bottom: 4%; } } @media screen and (max-width: 572px) { .main_body .header .wrapper .owl-carousel .owl-nav { right: 0%; bottom: 3%; } } @media screen and (max-width: 572px) { .main_body .header .wrapper .owl-carousel .owl-nav { right: 0%; bottom: 3%; } } .main_body .header .wrapper .owl-carousel .owl-prev { color: #fff; margin-right: 15px; } .main_body .header .wrapper .owl-carousel .owl-prev:hover { color: #fff; transition: 0.5s; padding-right: 15px !important; } .main_body .header .wrapper .owl-carousel .owl-prev::after { content: ""; position: absolute; height: 3px; width: 0px; background-color: #f0f0f0; top: 59px; left: -44px; display: block; } .main_body .header .wrapper .owl-carousel .owl-prev:hover::after { content: ""; position: absolute; height: 3px; width: 33px; background-color: #f0f0f0; top: 59px; left: 13px; display: block; transition: 0.5s; } .main_body .header .wrapper .owl-carousel .owl-prev:hover i { font-size: 45px; transition: 0.5s; } .main_body .header .wrapper .owl-carousel .owl-prev i { font-size: 45px; padding: 15px; } .main_body .header .wrapper .owl-carousel .owl-next { color: #fff; } .main_body .header .wrapper .owl-carousel .owl-next::after { content: ""; position: absolute; height: 3px; width: 5px; background-color: #f0f0f000; top: 58px; left: 153px; display: block; } .main_body .header .wrapper .owl-carousel .owl-next:hover { color: #fff; padding-left: 15px !important; transition: 0.5s; } .main_body .header .wrapper .owl-carousel .owl-next:hover::after { content: ""; position: absolute; height: 3px; width: 40px; background-color: #f0f0f0; top: 59px; left: 32px; display: block; transition: 0.5s; } .main_body .header .wrapper .owl-carousel .owl-next:hover i { font-size: 45px; padding: 15px; } .main_body .header .wrapper .owl-carousel .owl-next i { font-size: 45px; padding: 15px; } .main_body .header .wrapper .owl-carousel .owl-dots { position: absolute; bottom: 5%; right: 5%; } @media screen and (max-width: 1000px) { .main_body .header .wrapper .owl-carousel .owl-dots { left: 20px; } } @media screen and (max-width: 768px) { .main_body .header .wrapper .owl-carousel .owl-dots { left: 100px; } } @media screen and (max-width: 600px) { .main_body .header .wrapper .owl-carousel .owl-dots { left: 55px; } } @media screen and (max-width: 450px) { .main_body .header .wrapper .owl-carousel .owl-dots { left: 20px; } } /* defines the animation */ @keyframes fadeInUp { from { opacity: 0; transform: translate3d(0, 100%, 0); } to { opacity: 1; transform: none; } } .b_wrapp { position: absolute; bottom: 65px; z-index: 999; right: 26%; } @media screen and (max-width: 650px) { .b_wrapp { right: 40%; } } .b_wrapp .btn.btn-down { position: relative; z-index: 999; color: #fff; } .b_wrapp .btn.btn-down::after { display: block; top: 103%; left: 50%; position: absolute; content: ''; width: 16px; height: 16px; margin: -12px 0 0 -8px; border-left: 1px solid #fff; border-bottom: 1px solid #fff; transform: rotate(-45deg); box-sizing: border-box; } .b_wrapp .btn.btn-down::before { display: block; position: absolute; z-index: -1; content: ''; width: 44px; height: 44px; box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.1); border-radius: 100%; opacity: 0; animation: sdb03 3s infinite; box-sizing: border-box; } @keyframes sdb03 { 0% { opacity: 0; } 30% { opacity: 1; } 60% { box-shadow: 0 0 0 60px rgba(255, 255, 255, 0.1); opacity: 0; } 100% { opacity: 0; } } .footer { position: fixed; bottom: 0; z-index: 1; min-height: 400px; height: max-content; width: 100%; background-color: #333333; } @media screen and (max-width: 768px) { .footer { height: 1000px; } } .footer .footer_content { padding-top: 70px; } .footer .footer_content .footer_logo { font-size: 45px; color: #b36251; font-weight: 700; text-align: center; } @media screen and (max-width: 768px) { .footer .footer_content .footer_logo { text-align: left; padding-bottom: 30px; } } .footer .footer_content .links ul { margin: auto; } .footer .footer_content .links ul li { padding-bottom: 5px; } @media screen and (max-width: 768px) { .footer .footer_content .links ul li { text-align: left; padding-bottom: 15px !important; } } .footer .footer_content .links ul li a { color: #bfbac9; font-weight: 700; font-size: 18px; text-decoration: none; text-transform: uppercase; } .footer .footer_content .links ul li a:hover { color: #f0bd7a; } @media screen and (max-width: 768px) { .footer .footer_content .footer_contact { padding-top: 15px; } } .footer .footer_content .ft { display: flex; padding-left: 50px; margin-bottom: 20px; } @media screen and (max-width: 768px) { .footer .footer_content .ft { text-align: left; padding-left: 30px; } } .footer .footer_content .ft .icon { max-width: 20px; display: block; } .footer .footer_content .ft .icon img { width: 100%; } .footer .footer_content .ft li { padding: 0 10px; } .footer .footer_content .ft li a { color: #bfbac9; font-size: 16px; font-weight: 700; text-decoration: none; text-transform: uppercase; letter-spacing: 2px; font-size: 11px; } .footer .footer_content .ft li a:hover { color: #f0bd7a; } .footer .footer_content .social li { padding-bottom: 5px; } .footer .footer_content .social li a { color: #bfbac9; font-size: 16px; font-weight: 700; text-decoration: none; text-transform: uppercase; letter-spacing: 2px; font-size: 11px; letter-spacing: 2px; } .footer .footer_content .social li a:hover { color: #f0bd7a; } .footer .footer_bottom { text-align: center; text-transform: uppercase; letter-spacing: 3px; font-weight: 700; font-size: 12px; margin: auto; color: #bfbac9; padding-top: 60px; } @media screen and (max-width: 768px) { .footer .footer_bottom { padding-top: 10px; } } .footer .footer_bottom a { color: #b36251; } .footer .footer_bottom a:hover { color: #f0bd7a; } .sidebar { background-color: #f6faff; position: relative; margin-top: 45px; width: 100%; } @media screen and (max-width: 768px) { .sidebar { } } .sidebar .wrapper_s { padding: 0px 70px; } @media screen and (max-width: 1350px) { .sidebar .wrapper_s { padding: 0px 20px; } } .sidebar .search_box { padding: 100px 0; } .sidebar .search_box .has-search .form-control { padding-left: 3.375rem; background-color: #333333; color: #f6faff; } .sidebar .search_box .form-control { padding: 20px 0; display: block; width: 100%; height: calc(2.5em + .75rem + 2px); padding: .375rem .75rem; padding-left: 0.75rem; font-size: 1rem; font-weight: 400; line-height: 1.5; background-color: #921717; background-clip: padding-box; border: none; border-radius: 0; transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out; box-shadow: none !important; } .sidebar .search_box .has-search .form-control-feedback { z-index: 2; display: block; width: 3.375rem; height: 2.375rem; line-height: 3.375rem; text-align: center; pointer-events: none; color: #152235; } .sidebar .search_box .form-control-feedback { position: absolute; right: 20px; } .sidebar .search_box .form-group { position: relative; } .sidebar .categories { padding-bottom: 40px; } .sidebar .categories h4 { background-color: #333333; color: #f6faff; text-transform: uppercase; letter-spacing: 2px; padding: 10px 10px; font-size: 18px; font-family: "Open Sans", sans-serif !important; font-weight: 700; margin-bottom: 30px; } .sidebar .categories ul { padding-left: 0px; } .sidebar .categories ul li { padding: 5px; margin-bottom: 20px; } .sidebar .categories ul li a { color: #f6faff; text-decoration: none; background-color: #333333; padding: 5px 20px; text-transform: uppercase; } .sidebar .recent_post { padding-bottom: 40px; } .sidebar .recent_post h4 { background-color: #333333; color: #f6faff; text-transform: uppercase; letter-spacing: 2px; padding: 10px 10px; font-size: 18px; font-family: "Open Sans", sans-serif !important; font-weight: 700; margin-bottom: 30px; } .sidebar .recent_post .zen_wrapper { display: flex; margin-bottom: 30px; } @media screen and (max-width: 1140px) { .sidebar .recent_post .zen_wrapper { display: block; } } .sidebar .recent_post .zen_wrapper .post .img_wrapper { max-width: 157px; } @media screen and (max-width: 1140px) { .sidebar .recent_post .zen_wrapper .post .img_wrapper { max-width: 100%; } } .sidebar .recent_post .zen_wrapper .post .img_wrapper img { width: 100%; } .sidebar .recent_post .zen_wrapper .post_details { padding-left: 10px; padding-top: 10px; padding-bottom: 10px; background-color: #333333; padding-right: 38px; width: 100%; } .sidebar .recent_post .zen_wrapper .post_details a { text-decoration: none; text-transform: uppercase; color: #fff; } .sidebar .recent_post .zen_wrapper .post_details a span { font-size: 14px; } .sidebar .recent_post .zen_wrapper .post_details .date { text-transform: uppercase; color: #fff; font-size: 12px; padding-top: 10px; font-family: "Open Sans", sans-serif !important; } .sidebar .tags { padding-bottom: 40px; } .sidebar .tags h4 { background-color: #333333; color: #f6faff; text-transform: uppercase; letter-spacing: 2px; padding: 10px 10px; font-size: 18px; font-family: "Open Sans", sans-serif !important; font-weight: 700; margin-bottom: 30px; } .sidebar .tags .wrapper_t .tt { display: flex; padding-left: 0; flex-flow: wrap; } .sidebar .tags .wrapper_t .tt .inner { padding: 5px; margin-bottom: 20px; } .sidebar .tags .wrapper_t .tt .inner a { color: #f6faff; text-decoration: none; background-color: #333333; padding: 5px 20px; text-transform: uppercase; } .sidebar .instagram { padding-bottom: 50px; } .sidebar .instagram h4 { background-color: #333333; color: #f6faff; text-transform: uppercase; letter-spacing: 2px; padding: 10px 0; font-size: 18px; font-family: "Open Sans", sans-serif !important; font-weight: 700; margin-bottom: 30px; } .sidebar .instagram .wrapper_i .img_wrapper { max-width: 175px; overflow: hidden; } @media screen and (max-width: 992px) { .sidebar .instagram .wrapper_i .img_wrapper { max-width: 100%; } } .sidebar .instagram .wrapper_i .img_wrapper img { width: 100%; overflow: hidden; } .sidebar .instagram .wrapper_i .img_wrapper img:hover { overflow: hidden; transform: scale(1.1); transition: all 1s ease-in-out; transition-property: all; } .sidebar .instagram .wrapper_i .img_wrapper:nth-child(1) img { padding-right: 10px !important; padding-top: 15px; } @media screen and (max-width: 992px) { .sidebar .instagram .wrapper_i .img_wrapper:nth-child(1) img { padding: 0px !important; margin-bottom: 15px; } } .sidebar .instagram .wrapper_i .img_wrapper:nth-child(2) img { padding-left: 10px !important; padding-top: 15px; } @media screen and (max-width: 992px) { .sidebar .instagram .wrapper_i .img_wrapper:nth-child(2) img { padding: 0px !important; margin-bottom: 15px; } } .sidebar .instagram .wrapper_i .img_wrapper:nth-child(3) img { padding-right: 10px !important; padding-top: 15px; } @media screen and (max-width: 992px) { .sidebar .instagram .wrapper_i .img_wrapper:nth-child(3) img { padding: 0px !important; margin-bottom: 15px; } } .sidebar .instagram .wrapper_i .img_wrapper:nth-child(4) img { padding-left: 10px !important; padding-top: 15px; } @media screen and (max-width: 992px) { .sidebar .instagram .wrapper_i .img_wrapper:nth-child(4) img { padding: 0px !important; margin-bottom: 15px; } } .about { background: #f6faff; padding: 100px 0; /*animation element sliding left*/ } .about h1 { text-align: center; color: #333333; text-transform: uppercase; font-size: 65px; letter-spacing: -2px; font-weight: 700; } @media screen and (max-width: 768px) { .about h1 { font-size: 40px; } } .about .animation-elementH { opacity: 1; position: relative; } .about .animation-elementH.slide-left { opacity: 1; transition: all 500ms linear; transform: translate3d(-200px, 0px, 0px); } .about .animation-elementH.slide-left { opacity: 1; transform: translate3d(0px, 0px, 0px); } .about .wrapper { color: #000000; margin-top: 50px; padding: 0 40px; /*animation element sliding left*/ } .about .wrapper .about_text { font-family: 'Open Sans', sans-serif !important; font-size: 16px; line-height: 29px; } .about .wrapper .bt { margin-top: 50px; letter-spacing: 4px; text-align: center; font-size: 13px; } .about .wrapper .animation-element { opacity: 0; position: relative; } .about .wrapper .animation-element.slide-left { opacity: 0; transition: all 900ms linear; transform: translate3d(-200px, 0px, 0px); } .about .wrapper .animation-element.slide-left.in-view { opacity: 1; transform: translate3d(0px, 0px, 0px); } .recent { background: #fff; padding: 100px 0; } .recent .heading { color: #1f2125; padding-bottom: 50px; } .recent .heading h1 { text-align: center; color: #1f2125; text-transform: uppercase; font-size: 65px; letter-spacing: -2px; font-weight: 700; margin-bottom: 10px; } @media screen and (max-width: 768px) { .recent .heading h1 { font-size: 40px; } } .recent .heading p { text-align: center; text-transform: uppercase; letter-spacing: 2px; font-size: 13px; font-weight: 500; } .recent .wrapper { margin-top: 75px; padding-bottom: 40px; } @media screen and (max-width: 996px) { .recent .wrapper { padding: 0 30px; } } @media screen and (max-width: 768px) { .recent .wrapper { margin-top: 0; } } .recent .wrapper .recent_content .top { color: #333333; font-size: 20px; font-weight: 600; margin-bottom: 5px; text-transform: uppercase; padding-top: 23px; } .recent .wrapper .recent_content h3 { color: #1f2125; font-weight: 700; font-size: 30px; text-transform: uppercase; padding-top: 16px; } .recent .wrapper .recent_content .text { padding-top: 40px; padding-bottom: 40px; } .recent .wrapper .recent_img { max-width: 380px; overflow: hidden; position: relative; } @media screen and (max-width: 996px) { .recent .wrapper .recent_img { margin-top: 30px; max-width: 100%; } } .recent .wrapper .recent_img img { width: 100%; } .recent .wrapper .recent_img img:hover { transform: scale(1.1); transition: all 1s ease-in-out; } .he { opacity: 0; animation: tracking-in-expand 6s cubic-bezier(0.215, 0.61, 0.355, 1) both; } .tracking-in-expand { animation: tracking-in-expand 6s cubic-bezier(0.215, 0.61, 0.355, 1) both; } @keyframes tracking-in-expand { 0% { letter-spacing: -0.5em; opacity: 0; } 40% { opacity: 0.6; } 100% { opacity: 1; } } @keyframes fade-left-element { 0% { transform: scaleX(1); transform-origin: right; } 40% { transform: scaleX(0.7); transform-origin: right; } 70% { transform: scaleX(0.3); transform-origin: right; } 100% { transform: scaleX(0); transform-origin: right; opacity: 0; } } .fill { width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.966); position: absolute; top: 0; left: 0; z-index: 10; opacity: 0; } .fade-left-element { animation: fade-left 4s; transition: all 3s ease-in-out; transition-delay: 1s; -webkit-transition-delay: 1s; } .partners { background: #f6faff; padding: 100px 0; } .partners .wrapper h3 { color: #333333; text-transform: uppercase; font-size: 45px; font-weight: 700; margin-bottom: 10px; } @media screen and (max-width: 768px) { .partners .wrapper h3 { font-size: 30px; } } .partners .partners_contents { margin-top: 30px; padding: 60px; } @media screen and (max-width: 768px) { .partners .partners_contents { padding: 0; margin-top: 60px; } } .partners .partners_contents .brd a { width: 100%; height: 100%; border: 1px solid; border-color: #b36251; display: block; border-top-color: transparent; border-left-color: transparent; } .partners .partners_contents .brd:nth-child(4) a { border-right-color: transparent !important; } @media screen and (max-width: 768px) { .partners .partners_contents .brd:nth-child(2) a { border-right-color: transparent !important; } } @media screen and (max-width: 768px) { .partners .partners_contents .brd:nth-child(6) a { border-right-color: transparent !important; } .partners .partners_contents .brd:nth-child(10) a { border-right-color: transparent !important; border-bottom-color: transparent !important; } } .partners .partners_contents .brd:nth-child(8) a { border-right-color: transparent !important; } .partners .partners_contents .brd:nth-child(9) a { border-bottom-color: transparent !important; } .partners .partners_contents .brd:nth-child(10) a { border-bottom-color: transparent !important; } .partners .partners_contents .brd:nth-child(11) a { border-bottom-color: transparent !important; } .partners .partners_contents .brd:nth-child(12) a { border-right-color: transparent !important; border-bottom-color: transparent !important; } @media screen and (max-width: 768px) { .partners .partners_contents .brd:nth-child(11) a { border-top-color: red !important; } .partners .partners_contents .brd:nth-child(12) a { border-top-color: red !important; } } .part_wrapp { margin: auto; padding: 40px 20px; max-width: 200px; } .part_wrapp img { width: 100%; } .part_wrapp img:hover { transition: all 500ms linear; filter: grayscale(100%) sepia(100%) brightness(102%) hue-rotate(128deg) saturate(1000%) contrast(1000%) invert(100%); -webkit-filter: grayscale(100%) sepia(100%) brightness(102%) hue-rotate(128deg) saturate(1000%) contrast(1000%) invert(100%); -moz-filter: grayscale(100%) sepia(100%) brightness(102%) hue-rotate(128deg) saturate(1000%) contrast(1000%) invert(100%); } .testimonial_main_dark { padding-bottom: 70px; } .testimonial_main_dark .s_carousel.s_carousel_default .carousel-indicators li{ border-radius: 10rem !important; width: 10px !important; margin: 0.4rem !important; scale: 0.9; } .testimonial_main_dark .carousel-indicators li{ background-color: #000000 !important; } .testimonial_main_dark .carousel-indicators .active{ scale: 1.4 !important; } .testimonial_main_dark .test_content .test_img { max-width: 120px; margin: auto; } .testimonial_main_dark .test_content .test_img img { width: 100%; border-radius: 50%; } .testimonial_main_dark .test_content .test_details { margin-top: 60px; position: relative; background-color: #333333; padding: 30px 20px; font-family: 'Open Sans', sans-serif !important; font-size: 15px; line-height: 29px; letter-spacing: 2px; color: #fff; font-weight: 700; text-align: justify; } .testimonial_main_dark .test_content .test_details:after { content: " "; position: absolute; background-color: #333333; height: 20px; width: 20px; left: 50%; top: -10px; transform: translateX(-50%) rotate(45deg); } .testimonial_main_dark .test_content .name { margin-top: 20px; text-align: center; color: #333333; font-size: 16px; font-weight: 700; } .testimonial_main_dark .test_content .name span { color: #6c6a74; } .testimonial_main_dark #owl-theme2 button.owl-dot span { height: 8px; width: 8px; color: #fff; background-color: #1f2125; display: block; font-weight: bolder; border-radius: 50%; margin: 20px; } .testimonial_main_dark #owl-theme2 button.owl-dot.active span { color: #f0bd7a; height: 12px; width: 12px; font-size: 25px; transition: 1s; } .testimonial_main_dark #owl-theme2 { position: relative; } .testimonial_main_dark #owl-theme2 .owl-dots { position: absolute; bottom: -14%; right: 38%; transform: translateX(-21%) rotate(-1deg); } @media screen and (max-width: 1000px) { .testimonial_main_dark #owl-theme2 .owl-dots { right: 31%; } } @media screen and (max-width: 768px) { .testimonial_main_dark #owl-theme2 .owl-dots { right: 25%; } } @media screen and (max-width: 650px) { .testimonial_main_dark #owl-theme2 .owl-dots { right: 26%; } } @media screen and (max-width: 500px) { .testimonial_main_dark #owl-theme2 .owl-dots { right: 21%; } } @media screen and (max-width: 414px) { .testimonial_main_dark #owl-theme2 .owl-dots { right: 15%; } } @media screen and (max-width: 375px) { .testimonial_main_dark #owl-theme2 .owl-dots { right: 11%; } } .video { background-image: url(/theme_zen_dark/static/src/img/video/video.jpg); justify-content: center; width: 100%; background-size: cover; height: 90vh; background-repeat: no-repeat; background-position: center; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; } .video .pulse { border: 0 !important; cursor: unset !important; width: 70px; height: 70px; border-radius: 100px; background: #911f1f; box-shadow: 0 0 0 rgba(133, 18, 18, 0.541); animation: pulse 2000ms infinite; position: relative; } .video .pulse:after { content: " "; position: absolute; left: 56%; top: 21px; transform: translateX(-50%) rotate(-180deg); width: 0; height: 0; border-top: 15px solid transparent; border-right: 20px solid #252222; border-bottom: 15px solid transparent; } @keyframes pulse { 0% { -webkit-box-shadow: 0 0 0 0 rgba(247, 59, 59, 0.9); } 90% { -webkit-box-shadow: 0 0 0 20px rgba(0, 0, 0, 0); } 100% { -webkit-box-shadow: 0 0 0 0 rgba(0, 0, 0, 0); } } .video .bs-example { margin: 20px; } .video .modal { position: fixed; left: 0; z-index: 999; display: none; width: 100%; height: 100%; overflow: hidden; outline: 0; } .video .modal-dialog { max-width: 800px; margin: 7.75rem auto; } .video .modal-dialog .modal-header { border: none; } .video .modal-dialog .modal-header .close { color: #fff; padding: 0; background-color: transparent; border: 0; float: right; line-height: 1; color: #fff; text-shadow: 0 1px 0 rgba(255, 255, 255, 0); opacity: 1; padding: 0; } .video .modal-dialog .modal-header .close-button { margin: -1rem -1rem -1rem auto; height: 1px; width: 43px; position: relative; box-sizing: border-box; line-height: 20px; display: inline-block; } .video .modal-dialog .modal-header .close-button:before, .video .modal-dialog .modal-header .close-button:after { transform: rotate(-45deg); content: ''; position: absolute; top: 50%; left: 50%; margin-top: -2.5px; margin-left: -15px; display: block; height: 5px; width: 30px; background-color: #fff; transition: all 0.25s ease-out; } .video .modal-dialog .modal-header .close-button:after { transform: rotate(-135deg); } .video .modal-dialog .modal-header .close-button:hover:before, .video .modal-dialog .modal-header .close-button:hover:after { transform: rotate(0deg); } .video .modal-dialog .modal-body { padding: 0; } .video .modal-content iframe { margin: 0 auto; display: block; } .video .modal-content { position: relative; display: flex; flex-direction: column; width: 100%; pointer-events: auto; background-color: rgba(255, 255, 255, 0); background-clip: padding-box; border: none !important; border-radius: 0; outline: 0; } .modal-backdrop { position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; background-color: #000; display: none; } .blog { padding-top: 100px; padding-bottom: 100px; background: #fcfcfc; } @media screen and (max-width: 768px) { .blog { margin-bottom: 110vh; } } .blog .heading { color: #1f2125; padding-bottom: 50px; } .blog .heading h1 { text-align: center; color: #1f2125; text-transform: uppercase; font-size: 65px; letter-spacing: -2px; font-weight: 700; margin-bottom: 10px; } @media screen and (max-width: 768px) { .blog .heading h1 { font-size: 40px; } } .blog .heading p { text-align: center; text-transform: uppercase; letter-spacing: 2px; font-size: 13px; font-weight: 500; } .blog .wrapper { margin-top: 75px; } .blog .wrapper .card-deck .card { border-radius: 0; border: none; padding: 40px 0; transition: all 1.5s ease; } .blog .wrapper .card-deck .card .img_wrapper { overflow: hidden; } .blog .wrapper .card-deck .card .card-img-top { border-radius: 0; overflow: hidden; } .blog .wrapper .card-deck .card .card-img-top:hover { overflow: hidden; transform: scale(1.1); transition: all 1s ease-in-out; transition-property: all; } .blog .wrapper .card-deck .card .img_wrapper:hover ~ .card-body .card-title { transform: translateX(20px) !important; transition: all 1.5s ease; } .blog .wrapper .card-deck .card .card-body { margin-top: 10px; transition: all 1.5s ease-in !important; } .blog .wrapper .card-deck .card .card-body .card-title { font-size: 30px; text-transform: uppercase; color: #1f2125; padding-top: 15px; margin: 0 10px; } @media screen and (max-width: 768px) { .blog .wrapper .card-deck .card .card-body .card-title { font-size: 20px; } } .blog .wrapper .card-deck .card .card-body .blog-links { padding-top: 20px; margin-top: 10px; transition: all 1.5s ease; } .blog .wrapper .card-deck .card .card-body .blog-links:hover { transform: translateX(20px); } .blog .wrapper .card-deck .card .card-body ul { display: flex; padding-left: 0; } @media screen and (max-width: 738px) { .blog .wrapper .card-deck .card .card-body ul { display: block; } } .blog .wrapper .card-deck .card .card-body ul .icon { max-width: 20px; display: block; } .blog .wrapper .card-deck .card .card-body ul .icon img { width: 100%; } .blog .wrapper .card-deck .card .card-body ul li { padding: 0 10px; } .blog .wrapper .card-deck .card .card-body ul li a { color: #6c6a74; text-decoration: none; text-transform: uppercase; letter-spacing: 2px; font-size: 11px; } .blog .wrapper .card-deck .card .card-body ul li a:hover { color: #f0bd7a; } .blog .wrapper .card-deck .card .card-body .card-text { margin-top: 30px; display: flex; justify-content: space-between; } .blog .wrapper .card-deck .card .card-body .card-text span a { color: #1f2125; text-decoration: none; text-transform: uppercase; letter-spacing: 2px; font-size: 12px; font-weight: 700; } .blog .wrapper .card-deck .card .card-body .card-text span a:hover { color: #f0bd7a; } .main_body_about { z-index: 2; position: relative; background-color: #fff; } .main_body_about .header { position: relative; z-index: 1; } .main_body_about .header .wrapper_about .banner_about .banner_bg { background-image: url(/theme_zen_dark/static/src/img/banner/bg4.jpg) !important; justify-content: center; width: 100%; margin: auto; background-size: cover; height: 100%; background-repeat: no-repeat; background-position: center; background-color: #333333; } .main_body_about .header .wrapper_about .banner_about .banner_bg .card { display: none; background: transparent; padding-top: 100px; padding-bottom: 100px; border: none !important; letter-spacing: -2px; text-transform: uppercase; } @media screen and (max-width: 996px) { .main_body_about .header .wrapper_about .banner_about .banner_bg .card { display: block; padding-top: 200px; padding-left: 100px; } } @media screen and (max-width: 768px) { .main_body_about .header .wrapper_about .banner_about .banner_bg .card { display: block; padding-top: 200px; padding-left: 100px; } } @media screen and (max-width: 572px) { .main_body_about .header .wrapper_about .banner_about .banner_bg .card { display: block; padding-top: 100px; padding-left: 25px; } } @media screen and (max-width: 450px) { .main_body_about .header .wrapper_about .banner_about .banner_bg .card { display: block; padding-top: 100px; padding-left: 20px; } } .main_body_about .header .wrapper_about .banner_about .banner_bg .card .card-title { font-size: 2.5vw; font-weight: 700; color: #f6faff; } @media screen and (max-width: 996px) { .main_body_about .header .wrapper_about .banner_about .banner_bg .card .card-title { font-size: 25px; } } @media screen and (max-width: 572px) { .main_body_about .header .wrapper_about .banner_about .banner_bg .card .card-title { font-size: 18px; } } @media screen and (max-width: 768px) { .main_body_about .header .wrapper_about .banner_about .banner_bg .card .card-title { font-size: 25px; } } .main_body_about .header .wrapper_about .banner_about .banner_bg .card .card-text { color: #fff; font-size: 3.5vw; font-weight: bolder; } @media screen and (max-width: 996px) { .main_body_about .header .wrapper_about .banner_about .banner_bg .card .card-text { font-size: 40px; } } @media screen and (max-width: 768px) { .main_body_about .header .wrapper_about .banner_about .banner_bg .card .card-text { font-size: 40px; } } @media screen and (max-width: 572px) { .main_body_about .header .wrapper_about .banner_about .banner_bg .card .card-text { font-size: 30px; } } .main_body_about .header .wrapper_about .banner_about .banner_bg .card .text-bottom { font-size: 30px; } .main_body_about .header .wrapper_about .banner_about .banner_bg .card .text-bottom span { font-size: 25px; color: #f6faff; font-weight: bolder; padding-bottom: 40px; letter-spacing: 0px; } @media screen and (max-width: 572px) { .main_body_about .header .wrapper_about .banner_about .banner_bg .card .text-bottom span { font-size: 20px; } } @media screen and (max-width: 415px) { .main_body_about .header .wrapper_about .banner_about .banner_bg .card .text-bottom span { font-size: 14px; } } .main_body_about .header .wrapper_about .banner_about .banner_left { width: 100%; height: 100vh; } @media screen and (max-width: 996px) { .main_body_about .header .wrapper_about .banner_about .banner_left { display: none; } } .main_body_about .header .wrapper_about .banner_about .banner_left p { opacity: 0; animation: fadeInUp 1s ease-in-out 0s forwards; } .main_body_about .header .wrapper_about .banner_about .banner_left p.first { animation-delay: 1s; } .main_body_about .header .wrapper_about .banner_about .banner_left p.second { animation-delay: 3s; } .main_body_about .header .wrapper_about .banner_about .banner_left p.third { animation-delay: 5s; } .main_body_about .header .wrapper_about .banner_about .banner_left p.fourth { animation-delay: 7s; } .main_body_about .header .wrapper_about .banner_about .banner_left p.fifth { animation-delay: 9s; } .main_body_about .header .wrapper_about .banner_about .banner_left p.sixth { animation-delay: 11s; } .main_body_about .header .wrapper_about .banner_about .banner_left .card { background: transparent; padding-top: 150px; padding-bottom: 100px; border: none !important; letter-spacing: -2px; text-transform: uppercase; } .main_body_about .header .wrapper_about .banner_about .banner_left .card .card-title { font-size: 2.5vw; font-weight: 700; color: #f6faff; } .main_body_about .header .wrapper_about .banner_about .banner_left .card .card-text { color: #fff; font-size: 3.5vw; font-weight: bolder; } .main_body_about .header .wrapper_about .banner_about .banner_left .card .text-bottom { font-size: 20px; color: #f6faff; font-weight: bolder; padding-bottom: 40px; letter-spacing: 0px; } @keyframes fadeInUp { from { opacity: 0; transform: translate3d(0, 100%, 0); } to { opacity: 1; transform: none; } } .main_body_about .about_sec .about_main { background: #f6faff; padding: 50px 0; } .main_body_about .about_sec .about_main .wrapper_a { padding: 100px; } @media screen and (max-width: 768px) { .main_body_about .about_sec .about_main .wrapper_a { padding: 20px 30px; } } .main_body_about .about_sec .about_main .wrapper_a .who { font-size: 28px; font-weight: 700; color: #333333; letter-spacing: 1px; } .main_body_about .about_sec .about_main .wrapper_a .who_details { font-family: "Open Sans", sans-serif !important; font-size: 18px; font-weight: 700; line-height: 1.7em; letter-spacing: 2px; color: #1f2125; } @media screen and (max-width: 768px) { .main_body_about .about_sec .about_main .wrapper_a .who_details { margin-top: 20px; font-size: 14px; font-weight: normal; } } .main_body_about .about_sec .about_main .abt_bottom { margin-top: 40px; padding-top: 40px; } .main_body_about .about_sec .about_main .abt_bottom ul { padding-left: 0; } @media screen and (max-width: 768px) { .main_body_about .about_sec .about_main .abt_bottom ul { padding-left: 15px; } } .main_body_about .about_sec .about_main .abt_bottom ul h4 { color: #333333; font-size: 18px; padding-bottom: 15px; } .main_body_about .about_sec .about_main .abt_bottom ul li::before { content: "\2022"; color: #b36251; font-weight: bold; display: inline-block; width: 1em; margin-left: -1em; } .main_body_about .about_sec .about_main .abt_bottom li { font-size: 11px; letter-spacing: 3px; padding-bottom: 15px; color: #1f2125; } .main_body_about .about_sec .team { background: #1f2125; padding: 100px; } @media screen and (max-width: 768px) { .main_body_about .about_sec .team { padding: 50px 20px; } } .main_body_about .about_sec .team .mg { margin: 50px 0; } @media screen and (max-width: 768px) { .main_body_about .about_sec .team .mg { margin: 0; } } .main_body_about .about_sec .team .team_heading { text-transform: uppercase; margin-top: 20px; } .main_body_about .about_sec .team .team_heading h5 { font-size: 16px; font-weight: 700; color: #b36251; } @media screen and (max-width: 768px) { .main_body_about .about_sec .team .team_heading h5 { font-size: 15px; } } .main_body_about .about_sec .team .team_heading span { font-weight: 700; color: #fff; font-size: 30px; letter-spacing: 2px; } @media screen and (max-width: 768px) { .main_body_about .about_sec .team .team_heading span { font-size: 24px; } } .main_body_about .about_sec .team .img_wrapper { margin: 20px; } @media screen and (max-width: 768px) { .main_body_about .about_sec .team .img_wrapper { margin: 20px 0; padding-top: 20px; } } .main_body_about .about_sec .team .img_wrapper .team_img { max-width: 400px; } @media screen and (max-width: 768px) { .main_body_about .about_sec .team .img_wrapper .team_img { max-width: 100%; } } .main_body_about .about_sec .team .img_wrapper .team_img img { width: 100%; } .main_body_about .about_sec .team .img_wrapper h6 { font-size: 18px; font-weight: 700; color: #fff; padding-top: 15px; } .main_body_about .about_sec .team .img_wrapper p { font-size: 12px; letter-spacing: 3px; color: #fff; } .main_body_about .about_sec .creative { background-color: #dfdfdf; padding: 100px; } @media screen and (max-width: 992px) { .main_body_about .about_sec .creative { padding: 50px 0px; } } .main_body_about .about_sec .creative .mg { margin: 50px 0; } @media screen and (max-width: 768px) { .main_body_about .about_sec .creative .mg { margin-top: 15px; } } .main_body_about .about_sec .creative .wrapper .heading { padding-bottom: 50px; } .main_body_about .about_sec .creative .wrapper .heading h1 { text-align: center; color: #1f2125; text-transform: uppercase; font-size: 65px; letter-spacing: -2px; font-weight: 700; margin: 0; } @media screen and (max-width: 768px) { .main_body_about .about_sec .creative .wrapper .heading h1 { font-size: 40px; } } .main_body_about .about_sec .creative .wrapper .wrapper_2 { padding: 0 50px; margin: 50px 100px; } @media screen and (max-width: 768px) { .main_body_about .about_sec .creative .wrapper .wrapper_2 { margin: 0; } } .main_body_about .about_sec .creative .wrapper .wrapper_2 .top { color: #888787; font-family: 'Open Sans', sans-serif !important; font-size: 14px; line-height: 29px; font-weight: 700; text-transform: uppercase; letter-spacing: 0; } .main_body_about .about_sec .creative .wrapper .wrapper_2 .bottom { margin-top: 40px; } .main_body_about .about_sec .creative .wrapper .wrapper_2 .bottom .text { color: #1f2125; } .main_body_about .about_sec .creative .slider_part { margin: 0 -100px; padding-top: 50px; } @media screen and (max-width: 992px) { .main_body_about .about_sec .creative .slider_part { margin: 0; } } .main_body_about .about_sec .creative .slider_part .create_img { padding-bottom: 50px; } @media screen and (max-width: 415px) { .main_body_about .about_sec .creative .slider_part .create_img { transform: translate3d(0px, 0px, 0px); } } .main_body_about .about_sec .creative .slider_part .create_img .img_wrapper { max-width: 750px; } @media screen and (max-width: 768px) { .main_body_about .about_sec .creative .slider_part .create_img .img_wrapper { max-width: 400px; } } .main_body_about .about_sec .creative .slider_part .create_img .img_wrapper img { width: 100%; } .main_body_about .about_sec .creative .slider_part .owl-carousel { position: relative; } .main_body_about .about_sec .creative .slider_part .owl-carousel .owl-nav { position: absolute; right: 40%; bottom: -20%; width: 250px; text-align: center; padding-top: 23px; } @media screen and (max-width: 992px) { .main_body_about .about_sec .creative .slider_part .owl-carousel .owl-nav { bottom: -10%; } } @media screen and (max-width: 768px) { .main_body_about .about_sec .creative .slider_part .owl-carousel .owl-nav { right: 35%; bottom: -20%; } } @media screen and (max-width: 415px) { .main_body_about .about_sec .creative .slider_part .owl-carousel .owl-nav { right: 21%; } } .main_body_about .about_sec .creative .slider_part .owl-carousel .owl-prev { color: #000000; margin-right: 15px; } .main_body_about .about_sec .creative .slider_part .owl-carousel .owl-prev:hover { color: #000000; transition: 0.5s; padding-right: 15px; } .main_body_about .about_sec .creative .slider_part .owl-carousel .owl-prev:hover::after { content: ""; position: absolute; height: 3px; width: 33px; background-color: #000000; top: 59px; left: 75px; display: block; transition: 0.5s; } .main_body_about .about_sec .creative .slider_part .owl-carousel .owl-prev:hover i { font-size: 45px; transition: 0.5s; } .main_body_about .about_sec .creative .slider_part .owl-carousel .owl-prev i { font-size: 45px; padding: 15px; } .main_body_about .about_sec .creative .slider_part .owl-carousel .owl-next { color: #000000; } .main_body_about .about_sec .creative .slider_part .owl-carousel .owl-next::after { content: ""; position: absolute; height: 3px; width: 5px; background-color: #f0f0f000; top: 58px; left: 153px; display: block; } .main_body_about .about_sec .creative .slider_part .owl-carousel .owl-next:hover { color: #000000; padding-left: 15px !important; transition: 0.5s; } .main_body_about .about_sec .creative .slider_part .owl-carousel .owl-next:hover::after { content: ""; position: absolute; height: 3px; width: 40px; background-color: #000000; top: 59px; left: 139px; display: block; transition: 0.5s; } .main_body_about .about_sec .creative .slider_part .owl-carousel .owl-next:hover i { font-size: 45px; padding: 15px; } .main_body_about .about_sec .creative .slider_part .owl-carousel .owl-next i { font-size: 45px; padding: 15px; } .main_body_about .about_sec .creative .slider_part .owl-carousel .owl-dots { position: absolute; bottom: 5%; right: 5%; } @media screen and (max-width: 1000px) { .main_body_about .about_sec .creative .slider_part .owl-carousel .owl-dots { left: 150px; } } @media screen and (max-width: 768px) { .main_body_about .about_sec .creative .slider_part .owl-carousel .owl-dots { left: 100px; } } @media screen and (max-width: 600px) { .main_body_about .about_sec .creative .slider_part .owl-carousel .owl-dots { left: 75px; } } .main_body_about .about_sec .pricing { background-color: #f6faff; padding: 100px; } @media screen and (max-width: 992px) { .main_body_about .about_sec .pricing { padding: 50px 0px; } } .main_body_about .about_sec .pricing .mg { margin: 50px 0; } @media screen and (max-width: 768px) { .main_body_about .about_sec .pricing .mg { margin-top: 15px; } } .main_body_about .about_sec .pricing .wrapper { padding: 0 50px; } @media screen and (max-width: 1250px) { .main_body_about .about_sec .pricing .wrapper { padding: 0; } } .main_body_about .about_sec .pricing .wrapper .heading { padding-bottom: 50px; } .main_body_about .about_sec .pricing .wrapper .heading h1 { text-align: center; color: #333333; text-transform: uppercase; font-size: 65px; letter-spacing: -2px; font-weight: 700; margin-bottom: 10px; } @media screen and (max-width: 768px) { .main_body_about .about_sec .pricing .wrapper .heading h1 { font-size: 40px; } } .main_body_about .about_sec .pricing .wrapper .heading p { text-align: center; text-transform: uppercase; letter-spacing: 2px; font-size: 13px; font-weight: 500; color: #333333; } .main_body_about .about_sec .pricing .wrapper .cd2 .card-title { padding: 40px 0 !important; } .main_body_about .about_sec .pricing .wrapper .cd2 .card-body { padding-bottom: 30px !important; } @media screen and (max-width: 768px) { .main_body_about .about_sec .pricing .wrapper .cd2 { margin-top: 80px; margin-bottom: 60px; } .main_body_about .about_sec .pricing .wrapper .cd2 .card-body { padding-bottom: 0px !important; } .main_body_about .about_sec .pricing .wrapper .cd2 .card-title { padding: 20px 0 !important; } } .main_body_about .about_sec .pricing .wrapper .cd1 { margin-top: 20px !important; } .main_body_about .about_sec .pricing .wrapper .cd3 { margin-top: 20px !important; } .main_body_about .about_sec .pricing .wrapper .card { border: none; background: #1f2125; padding-bottom: px; border-top-left-radius: 8px !important; border-top-right-radius: 8px !important; border-bottom-left-radius: 8px !important; border-bottom-right-radius: 8px !important; } .main_body_about .about_sec .pricing .wrapper .card .card-body { border: none; padding: 0; border-bottom-left-radius: 8px !important; border-bottom-right-radius: 8px !important; margin-bottom: 30px; padding-bottom: 20px; } .main_body_about .about_sec .pricing .wrapper .card .card-body .card-title { background: #333333; border: none; padding: 22px 0; font-size: 15px; color: #f6faff; border-top-left-radius: 8px !important; border-top-right-radius: 8px !important; margin-bottom: 0; } .main_body_about .about_sec .pricing .wrapper .card .card-body .card-text { border: none; background-color: #1f2125; padding-top: 40px; font-size: 75px; color: #fff; font-weight: normal; } .main_body_about .about_sec .pricing .wrapper .card .card-body .card-text p { text-transform: uppercase; font-size: 15px; margin-bottom: 0; } .main_body_about .about_sec .pricing .wrapper .card .card-body .card-content { background-color: #1f2125; padding: 40px 20px; } .main_body_about .about_sec .pricing .wrapper .card .card-body .card-content .tick { max-width: 10px; position: absolute; } .main_body_about .about_sec .pricing .wrapper .card .card-body .card-content .tick img { width: 100%; } .main_body_about .about_sec .pricing .wrapper .card .card-body .card-content ul li { position: relative; padding-bottom: 15px; } .main_body_about .about_sec .pricing .wrapper .card .card-body .card-content ul li:last-child { padding-bottom: 0; } .main_body_about .about_sec .pricing .wrapper .card .card-body .card-content ul li span { text-transform: uppercase; color: #fff; letter-spacing: 5px; text-align: center; font-size: 11px !important; } .main_body_about .testimonial_main_dark .test_content .test_img { max-width: 120px; margin: auto; } .main_body_about .testimonial_main_dark .test_content .test_img img { width: 100%; border-radius: 50%; } .main_body_about .testimonial_main_dark .test_content .test_details { margin-top: 60px; position: relative; background-color: #333333; padding: 30px 20px; font-family: 'Open Sans', sans-serif !important; font-size: 15px; line-height: 29px; letter-spacing: 2px; color: #fff; font-weight: 700; text-align: justify; } .main_body_about .testimonial_main_dark .test_content .test_details:after { content: " "; position: absolute; background-color: #333333; height: 20px; width: 20px; left: 50%; top: -10px; transform: translateX(-50%) rotate(45deg); } .main_body_about .testimonial_main_dark .test_content .name { margin-top: 20px; text-align: center; color: #1f2125; font-size: 16px; font-weight: 700; } .main_body_about .testimonial_main_dark .test_content .name span { color: #6c6a74; } .main_body_about .testimonial_main_dark #owl-theme2 button.owl-dot span { height: 8px; width: 8px; color: #fff; background-color: #1f2125; display: block; font-weight: bolder; border-radius: 50%; margin: 20px; } .main_body_about .testimonial_main_dark #owl-theme2 button.owl-dot.active span { background-color: #b36251; height: 12px; width: 12px; font-size: 25px; transition: 1s; } .main_body_about .testimonial_main_dark #owl-theme2 { position: relative; } .main_body_about .testimonial_main_dark #owl-theme2 .owl-dots { position: absolute; bottom: -14%; right: 38%; transform: translateX(-21%) rotate(-1deg); } @media screen and (max-width: 1000px) { .main_body_about .testimonial_main_dark #owl-theme2 .owl-dots { right: 31%; } } @media screen and (max-width: 768px) { .main_body_about .testimonial_main_dark #owl-theme2 .owl-dots { right: 25%; } } @media screen and (max-width: 650px) { .main_body_about .testimonial_main_dark #owl-theme2 .owl-dots { right: 26%; } } @media screen and (max-width: 500px) { .main_body_about .testimonial_main_dark #owl-theme2 .owl-dots { right: 21%; } } @media screen and (max-width: 414px) { .main_body_about .testimonial_main_dark #owl-theme2 .owl-dots { right: 15%; bottom: -10%; } } @media screen and (max-width: 375px) { .main_body_about .testimonial_main_dark #owl-theme2 .owl-dots { right: 11%; } } .main_body_contact { z-index: 3; position: relative; background-color: #fff; } .main_body_contact .header { position: relative; z-index: 1; } .main_body_contact .header .wrapper_abt .banner .banner_bg { background-image: url(/theme_zen_dark/static/src/img/banner/bg10.jpg); justify-content: center; width: 100%; margin: auto; background-size: cover; height: 100vh; background-repeat: no-repeat; background-position: center; } @media screen and (max-width: 768px) { .main_body_contact .header .wrapper_abt .banner .banner_bg { height: auto; } } .main_body_contact .header .wrapper_abt .banner .banner_bg .card { display: none; background: transparent; padding-top: 100px; padding-bottom: 100px; border: none !important; letter-spacing: -2px; text-transform: uppercase; } @media screen and (max-width: 996px) { .main_body_contact .header .wrapper_abt .banner .banner_bg .card { display: block; padding-top: 200px; padding-left: 100px; } } @media screen and (max-width: 768px) { .main_body_contact .header .wrapper_abt .banner .banner_bg .card { display: block; padding-top: 200px; padding-left: 100px; } } @media screen and (max-width: 572px) { .main_body_contact .header .wrapper_abt .banner .banner_bg .card { display: block; padding-top: 100px; padding-left: 25px; } } @media screen and (max-width: 450px) { .main_body_contact .header .wrapper_abt .banner .banner_bg .card { display: block; padding-top: 100px; padding-left: 20px; } } .main_body_contact .header .wrapper_abt .banner .banner_bg .card .card-title { font-size: 2.5vw; font-weight: 700; color: #f6faff; } @media screen and (max-width: 996px) { .main_body_contact .header .wrapper_abt .banner .banner_bg .card .card-title { font-size: 25px; } } @media screen and (max-width: 572px) { .main_body_contact .header .wrapper_abt .banner .banner_bg .card .card-title { font-size: 18px; } } @media screen and (max-width: 768px) { .main_body_contact .header .wrapper_abt .banner .banner_bg .card .card-title { font-size: 25px; } } .main_body_contact .header .wrapper_abt .banner .banner_bg .card .card-text { color: #fff; font-size: 3.5vw; font-weight: bolder; } @media screen and (max-width: 996px) { .main_body_contact .header .wrapper_abt .banner .banner_bg .card .card-text { font-size: 40px; } } @media screen and (max-width: 768px) { .main_body_contact .header .wrapper_abt .banner .banner_bg .card .card-text { font-size: 40px; } } @media screen and (max-width: 572px) { .main_body_contact .header .wrapper_abt .banner .banner_bg .card .card-text { font-size: 30px; } } .main_body_contact .header .wrapper_abt .banner .banner_bg .card .text-bottom span { font-size: 25px; color: #f6faff; font-weight: bolder; padding-bottom: 40px; letter-spacing: 0px; } @media screen and (max-width: 572px) { .main_body_contact .header .wrapper_abt .banner .banner_bg .card .text-bottom span { font-size: 20px; } } @media screen and (max-width: 415px) { .main_body_contact .header .wrapper_abt .banner .banner_bg .card .text-bottom span { font-size: 14px; } } .main_body_contact .header .wrapper_abt .banner .banner_left { width: 100%; height: 100vh; background-color: #333333; } @media screen and (max-width: 996px) { .main_body_contact .header .wrapper_abt .banner .banner_left { display: none; } } .main_body_contact .header .wrapper_abt .banner .banner_left p { opacity: 0; animation: fadeInUp 1s ease-in-out 0s forwards; } .main_body_contact .header .wrapper_abt .banner .banner_left p.first { animation-delay: 1s; } .main_body_contact .header .wrapper_abt .banner .banner_left p.second { animation-delay: 3s; } .main_body_contact .header .wrapper_abt .banner .banner_left p.third { animation-delay: 5s; } .main_body_contact .header .wrapper_abt .banner .banner_left p.fourth { animation-delay: 7s; } .main_body_contact .header .wrapper_abt .banner .banner_left p.fifth { animation-delay: 9s; } .main_body_contact .header .wrapper_abt .banner .banner_left p.sixth { animation-delay: 11s; } .main_body_contact .header .wrapper_abt .banner .banner_left .card { background: transparent; padding-top: 150px; padding-bottom: 100px; border: none !important; letter-spacing: -2px; text-transform: uppercase; } .main_body_contact .header .wrapper_abt .banner .banner_left .card .card-title { font-size: 2.5vw; font-weight: 700; color: #f6faff; } .main_body_contact .header .wrapper_abt .banner .banner_left .card .card-text { color: #fff; font-size: 3.5vw; font-weight: bolder; } .main_body_contact .header .wrapper_abt .banner .banner_left .card .text-bottom { font-size: 20px; color: #f6faff; font-weight: bolder; padding-bottom: 40px; letter-spacing: 0px; } .main_body_contact .contact { background: #f6faff; padding: 100px 0; } @media screen and (max-width: 1200px) { .main_body_contact .contact { padding-top: 50px; } } @media screen and (max-width: 768px) { .main_body_contact .contact { padding: 50px; } } .main_body_contact .contact .wrapper { padding: 0 60px; } @media screen and (max-width: 768px) { .main_body_contact .contact .wrapper { padding: 0 20px; } } .main_body_contact .contact h1 { text-align: center; color: #333333; text-transform: uppercase; font-size: 65px; letter-spacing: -2px; font-weight: 700; margin-bottom: 30px !important; } @media screen and (max-width: 768px) { .main_body_contact .contact h1 { font-size: 40px; } } .main_body_contact .contact p { font-family: "Open Sans", sans-serif !important; font-size: 14px; line-height: 29px; letter-spacing: 2px; font-weight: 700; padding-bottom: 40px; } .main_body_contact .contact .contact_details { margin-top: 75px; margin-bottom: 50px; } @media screen and (max-width: 768px) { .main_body_contact .contact .contact_details { margin: 30px 0; } } .main_body_contact .contact .contact_details .wrapper_c h5 { color: #333333; font-size: 16px; font-weight: bolder; padding-bottom: 10px; } .main_body_contact .contact .contact_details .wrapper_c .e_details { color: #888787; font-size: 35px; font-weight: 700; text-transform: uppercase; letter-spacing: 1px; padding-bottom: 20px; } @media screen and (max-width: 1200px) { .main_body_contact .contact .contact_details .wrapper_c .e_details { font-size: 25px; } } @media screen and (max-width: 820px) { .main_body_contact .contact .contact_details .wrapper_c .e_details { font-size: 22px; font-weight: 600; } } .main_body_contact .contact .contact_details .wrapper_c .mail ul { padding-left: 0; display: flex; justify-content: space-between; padding-right: 100px; flex-direction: column; } @media screen and (max-width: 992px) { .main_body_contact .contact .contact_details .wrapper_c .mail ul { display: block; } } .main_body_contact .contact .contact_details .wrapper_c .mail ul li { padding-bottom: 5px; } .main_body_contact .contact .contact_details .wrapper_c .mail ul li a { color: #b36251; font-weight: 700; text-decoration: none; text-transform: uppercase; letter-spacing: 2px; font-size: 11px; } .main_body_contact .contact .contact_details .wrapper_c .mail ul li a:hover { color: #f0bd7a; } .main_body_contact .contact_form { background-image: url(/theme_zen_dark/static/src/img/contact/contact-bg.jpg); justify-content: center; width: 100%; margin: auto; background-size: cover; height: 100vh; background-repeat: no-repeat; background-position: center; padding: 100px 0; } .main_body_contact .contact_form h4 { text-align: center; color: #333333; margin-bottom: 50px; } .main_body_contact .contact_form form { padding: 0 100px; margin-top: 75px; } @media screen and (max-width: 1000px) { .main_body_contact .contact_form form { padding: 0; } } @media screen and (max-width: 768px) { .main_body_contact .contact_form form { margin-top: 50px; } } .main_body_contact .contact_form form .input-group-addon { position: absolute; right: 9px; top: 10px; } .main_body_contact .contact_form form .form-group { position: relative; } @media screen and (max-width: 768px) { .main_body_contact .contact_form form .form-group { margin-bottom: 40px; } } .main_body_contact .contact_form form .form-group .form-label { position: absolute; top: -15px; left: 10px; z-index: 2; pointer-events: none; font-size: 25px; font-weight: 500; letter-spacing: 1px; color: black; opacity: 1; } @media screen and (max-width: 1000px) { .main_body_contact .contact_form form .form-group .form-label { font-size: 16px; } } .main_body_contact .contact_form form .form-group .form-txt { position: absolute; top: 0px; left: 10px; z-index: 2; pointer-events: none; font-size: 25px; font-weight: 500; letter-spacing: 1px; color: black; opacity: 1; } .main_body_contact .contact_form form .form-group .form-txt1 { position: absolute; top: 60px; left: 10px; z-index: 2; pointer-events: none; font-size: 25px; font-weight: 500; letter-spacing: 1px; color: black; opacity: 1; } .main_body_contact .contact_form form .form-group .transform { transition: all 2s ease; } .main_body_contact .contact_form form .form-group .transform-active { color: #ffffff; font-size: 10px; } .main_body_contact .contact_form form .form-group .form-control { display: block; width: 100%; height: calc(2.5em + 0.75rem + 2px); padding: 0.575rem 0.75rem; font-family: "Open Sans", sans-serif !important; font-size: 14px; font-weight: 400; line-height: 1.5; color: #000000 !important; background-color: transparent !important; background-clip: padding-box; border: 1px solid; border-color: transparent; border-bottom-color: #000000; border-radius: 0; transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; box-shadow: none !important; } .main_body_contact .contact_form form .form-group .btn-secondary.focus { background-color: transparent !important; } .main_body_contact .contact_form form .form-group .btn-secondary:hover { background-color: transparent !important; color: #000000; } .main_body_contact .contact_form form .form-group .btn-secondary:active { background-color: transparent !important; color: #000000; } .main_body_contact .contact_form form .form-group textarea { border: 0.5px solid; border-color: transparent; border-bottom-color: #000000; border-radius: 0; background-color: transparent; margin-top: 60px; margin-bottom: 50px; position: relative; } .main_body_service { z-index: 3; position: relative; background-color: #fff; /* defines the animation */ } .main_body_service .wrapper_cnt { position: relative; } .main_body_service .wrapper_cnt .banner .banner_bg { background-image: url(/theme_zen_dark/static/src/img/banner/bg5.jpg); justify-content: center; width: 100%; margin: auto; background-size: cover; height: 100vh; background-repeat: no-repeat; background-position: center; } @media screen and (max-width: 768px) { .main_body_service .wrapper_cnt .banner .banner_bg { height: auto; } } .main_body_service .wrapper_cnt .banner .banner_bg .card { display: none; background: transparent; padding-top: 100px; padding-bottom: 100px; border: none !important; letter-spacing: -2px; text-transform: uppercase; } @media screen and (max-width: 996px) { .main_body_service .wrapper_cnt .banner .banner_bg .card { display: block; padding-top: 200px; padding-left: 100px; } } @media screen and (max-width: 768px) { .main_body_service .wrapper_cnt .banner .banner_bg .card { display: block; padding-top: 200px; padding-left: 100px; } } @media screen and (max-width: 572px) { .main_body_service .wrapper_cnt .banner .banner_bg .card { display: block; padding-top: 100px; padding-left: 25px; } } @media screen and (max-width: 450px) { .main_body_service .wrapper_cnt .banner .banner_bg .card { display: block; padding-top: 100px; padding-left: 20px; } } section .parallax{ padding-top: 0px !important; padding-bottom: 0px !important; } .main_body_service .wrapper_cnt .banner .banner_bg .card .card-title { font-size: 2.5vw; font-weight: 700; color: #f6faff; } @media screen and (max-width: 996px) { .main_body_service .wrapper_cnt .banner .banner_bg .card .card-title { font-size: 25px; } } @media screen and (max-width: 572px) { .main_body_service .wrapper_cnt .banner .banner_bg .card .card-title { font-size: 18px; } } @media screen and (max-width: 768px) { .main_body_service .wrapper_cnt .banner .banner_bg .card .card-title { font-size: 25px; } } .main_body_service .wrapper_cnt .banner .banner_bg .card .card-text { color: #fff; font-size: 3.5vw; font-weight: bolder; } @media screen and (max-width: 996px) { .main_body_service .wrapper_cnt .banner .banner_bg .card .card-text { font-size: 40px; } } @media screen and (max-width: 768px) { .main_body_service .wrapper_cnt .banner .banner_bg .card .card-text { font-size: 40px; } } @media screen and (max-width: 572px) { .main_body_service .wrapper_cnt .banner .banner_bg .card .card-text { font-size: 30px; } } .main_body_service .wrapper_cnt .banner .banner_bg .card .text-bottom span { font-size: 25px; color: #f6faff; font-weight: bolder; padding-bottom: 40px; letter-spacing: 0px; } @media screen and (max-width: 572px) { .main_body_service .wrapper_cnt .banner .banner_bg .card .text-bottom span { font-size: 20px; } } @media screen and (max-width: 415px) { .main_body_service .wrapper_cnt .banner .banner_bg .card .text-bottom span { font-size: 14px; } } .main_body_service .wrapper_cnt .banner .banner_left { width: 100%; height: 100vh; background-color: #333333; } @media screen and (max-width: 996px) { .main_body_service .wrapper_cnt .banner .banner_left { display: none; } } .main_body_service .wrapper_cnt .banner .banner_left p { opacity: 0; animation: fadeInUp 1s ease-in-out 0s forwards; } .main_body_service .wrapper_cnt .banner .banner_left p.first { animation-delay: 1s; } .main_body_service .wrapper_cnt .banner .banner_left p.second { animation-delay: 3s; } .main_body_service .wrapper_cnt .banner .banner_left p.third { animation-delay: 5s; } .main_body_service .wrapper_cnt .banner .banner_left p.fourth { animation-delay: 7s; } .main_body_service .wrapper_cnt .banner .banner_left p.fifth { animation-delay: 9s; } .main_body_service .wrapper_cnt .banner .banner_left p.sixth { animation-delay: 11s; } .main_body_service .wrapper_cnt .banner .banner_left .card { background: transparent; padding-top: 150px; padding-bottom: 100px; border: none !important; letter-spacing: -2px; text-transform: uppercase; } .main_body_service .wrapper_cnt .banner .banner_left .card .card-title { font-size: 2.5vw; font-weight: 700; color: #f6faff; } .main_body_service .wrapper_cnt .banner .banner_left .card .card-text { color: #fff; font-size: 3.5vw; font-weight: bolder; } .main_body_service .wrapper_cnt .banner .banner_left .card .text-bottom { font-size: 20px; color: #f6faff; font-weight: bolder; padding-bottom: 40px; letter-spacing: 0px; } .main_body_service .service { background: #f6faff; padding: 100px 0; } @media screen and (max-width: 992px) { .main_body_service .service { padding: 50px 0px; } } .main_body_service .service .heading h1 { text-align: center; color: #333333; text-transform: uppercase; font-size: 65px; letter-spacing: -2px; font-weight: 700; margin-bottom: 30px !important; } @media screen and (max-width: 768px) { .main_body_service .service .heading h1 { font-size: 40px; } } .main_body_service .service .wrapper { padding: 0 60px; } @media screen and (max-width: 992px) { .main_body_service .service .wrapper { padding: 0; } } .main_body_service .service .wrapper .service_bg { background-image: url(/theme_zen_dark/static/src/img/service/1.jpg); justify-content: center; width: 100%; margin-top: 90px; background-size: cover; height: 50vh; background-repeat: no-repeat; background-position: center; padding-top: 50px; } .main_body_service .service .wrapper .bg2 { background-image: url(/theme_zen_dark/static/src/img/service/2.jpg) !important; justify-content: center; width: 100%; margin-top: 90px; background-size: cover; height: 50vh; background-repeat: no-repeat; background-position: center; padding-top: 50px; } .main_body_service .service .wrapper .bg3 { background-image: url(/theme_zen_dark/static/src/img/service/3.jpg); justify-content: center; width: 100%; margin-top: 90px; background-size: cover; height: 50vh; background-repeat: no-repeat; background-position: center; padding-top: 50px; } .main_body_service .service .wrapper .branding { margin-top: 50px; } @media screen and (max-width: 768px) { .main_body_service .service .wrapper .branding .wrapper_brand { padding-left: 30px; } } .main_body_service .service .wrapper .branding .team_heading { text-transform: uppercase; margin-top: 20px; } .main_body_service .service .wrapper .branding .team_heading h5 { font-size: 16px; font-weight: 700; color: #333333; margin: auto; } .main_body_service .service .wrapper .branding .team_heading span { font-weight: 700; color: #b36251; font-size: 30px; letter-spacing: 2px; } .main_body_service .service .wrapper .branding .branding_info { margin-top: 40px; } .main_body_service .service .wrapper .branding .branding_info ul { padding-left: 0; } .main_body_service .service .wrapper .branding .branding_info ul h4 { color: #333333; font-size: 18px; padding-bottom: 15px; } .main_body_service .service .wrapper .branding .branding_info ul li::before { content: "\2022"; color: #b36251; font-weight: bold; display: inline-block; width: 1em; margin-left: -1em; } .main_body_service .service .wrapper .branding .branding_info li { font-size: 11px; letter-spacing: 3px; padding-bottom: 15px; color: #1f2125; text-transform: uppercase; } .main_body_service .service .wrapper .branding p { font-family: 'Open Sans', sans-serif !important; font-size: 17px; line-height: 2.5rem; color: #1f2125; } .main_body_service .skills { background-color: #f6faff; } .main_body_service .skills .skill_img { max-width: 750px; } @media screen and (max-width: 992px) { .main_body_service .skills .skill_img { max-width: 100%; } } .main_body_service .skills .skill_img img { width: 100%; } .main_body_service .skills .skill_info .wrapper { padding-top: 100px; } @media screen and (max-width: 992px) { .main_body_service .skills .skill_info .wrapper { padding-top: 50px; padding-bottom: 40px; } } .main_body_service .skills .skill_info .wrapper h3 { color: #333333; text-align: center; font-size: 40px; padding-bottom: 40px; } .main_body_service .skills .skill_info .wrapper .progress_info { padding: 20px 50px; margin-bottom: 20px; } .main_body_service .skills .skill_info .wrapper .progress_info .p_details { position: relative; } .main_body_service .skills .skill_info .wrapper .progress_info .p_details .p_heading { position: absolute; left: 0; bottom: 10px; color: #333333; font-size: 15px; letter-spacing: 2px; text-transform: uppercase; } .main_body_service .skills .skill_info .wrapper .progress_info .p_details .p_perc { position: absolute; bottom: 10px; color: #333333; font-size: 15px; letter-spacing: 2px; text-transform: uppercase; right: 0; } .main_body_service .skills .skill_info .wrapper .progress_info .progress .progress-bar { position: unset; top: 0; height: 3px; width: 0; background-image: linear-gradient(90deg, #B8C1E5 0%, #FF2E38 100%); z-index: 11; transition: width .2s; will-change: width; } .main_body_service .our_service { padding: 100px 0; } @media screen and (max-width: 992px) { .main_body_service .our_service { padding-top: 50px; padding-bottom: 0; } } .main_body_service .our_service .heading { color: #152235; padding-bottom: 50px; } .main_body_service .our_service .heading h1 { text-align: center; color: #333333; text-transform: uppercase; font-size: 65px; letter-spacing: -2px; font-weight: 700; margin-bottom: 10px; } @media screen and (max-width: 768px) { .main_body_service .our_service .heading h1 { font-size: 40px; } } .main_body_service .our_service .heading p { text-align: center; text-transform: uppercase; letter-spacing: 2px; font-size: 13px; font-weight: 500;color: #b36251; } .main_body_service .our_service .wrapper { margin-top: 75px; margin: 0; } @media screen and (max-width: 992px) { .main_body_service .our_service .wrapper { margin-top: 0; } } .main_body_service .our_service .wrapper .card { border-radius: 0; border: none; margin-bottom: 50px; } .main_body_service .our_service .wrapper .card .img_wrapper { overflow: hidden; } .main_body_service .our_service .wrapper .card .card-img-top { border-radius: 0; overflow: hidden; } .main_body_service .our_service .wrapper .card .card-img-top:hover { overflow: hidden; transform: scale(1.1); transition: all 1s ease-in-out; transition-property: all; } .main_body_service .our_service .wrapper .card .card-body { margin-top: 10px; margin-right: 30px; } .main_body_service .our_service .wrapper .card .card-body .card-title { font-size: 20px; text-transform: uppercase; color: #1f2125; padding-top: 15px; } .main_body_service .our_service .wrapper .card .card-body .card-text { margin-top: 30px; font-family: 'Open Sans', sans-serif !important; font-size: 13px; line-height: 29px; color: #1f2125; } .main_body_service .partners_service { background: #1f2125; padding: 100px 0; } .main_body_service .partners_service .wrapper h3 { color: #f6faff; text-transform: uppercase; font-size: 45px; font-weight: 700; margin-bottom: 10px; } @media screen and (max-width: 768px) { .main_body_service .partners_service .wrapper h3 { font-size: 30px; } } .main_body_service .partners_service .partners_contents { margin-top: 30px; padding: 60px; } @media screen and (max-width: 768px) { .main_body_service .partners_service .partners_contents { padding: 0; margin-top: 60px; } } .main_body_service .partners_service .partners_contents .brd a { width: 100%; height: 100%; border: 1px solid; border-color: red; display: block; border-top-color: transparent; border-left-color: transparent; } .main_body_service .partners_service .partners_contents .brd:nth-child(4) a { border-right-color: transparent !important; } @media screen and (max-width: 768px) { .main_body_service .partners_service .partners_contents .brd:nth-child(2) a { border-right-color: transparent !important; } } @media screen and (max-width: 768px) { .main_body_service .partners_service .partners_contents .brd:nth-child(6) a { border-right-color: transparent !important; } .main_body_service .partners_service .partners_contents .brd:nth-child(10) a { border-right-color: transparent !important; border-bottom-color: transparent !important; } } .main_body_service .partners_service .partners_contents .brd:nth-child(8) a { border-right-color: transparent !important; } .main_body_service .partners_service .partners_contents .brd:nth-child(9) a { border-bottom-color: transparent !important; } .main_body_service .partners_service .partners_contents .brd:nth-child(10) a { border-bottom-color: transparent !important; } .main_body_service .partners_service .partners_contents .brd:nth-child(11) a { border-bottom-color: transparent !important; } .main_body_service .partners_service .partners_contents .brd:nth-child(12) a { border-right-color: transparent !important; border-bottom-color: transparent !important; } @media screen and (max-width: 768px) { .main_body_service .partners_service .partners_contents .brd:nth-child(11) a { border-top-color: red !important; } .main_body_service .partners_service .partners_contents .brd:nth-child(12) a { border-top-color: red !important; } } .main_body_service .part_wrapp { margin: auto; padding: 40px 20px; max-width: 200px; } .main_body_service .part_wrapp img { width: 100%; } .main_body_service .part_wrapp img:hover { transition: all 500ms linear; filter: grayscale(100%) sepia(100%) brightness(102%) hue-rotate(128deg) saturate(1000%) contrast(1000%) invert(100%); -webkit-filter: grayscale(100%) sepia(100%) brightness(102%) hue-rotate(128deg) saturate(1000%) contrast(1000%) invert(100%); -moz-filter: grayscale(100%) sepia(100%) brightness(102%) hue-rotate(128deg) saturate(1000%) contrast(1000%) invert(100%); } .main_body_service .b_wrapp { position: absolute; bottom: 40px; z-index: 999; right: 26%; } @media screen and (max-width: 650px) { .main_body_service .b_wrapp { right: 40%; bottom: 20px; } } .main_body_service .b_wrapp .btn.btn-down { position: relative; z-index: 999; color: #fff; } .main_body_service .b_wrapp .btn.btn-down::after { display: block; top: 103%; left: 50%; position: absolute; content: ''; width: 16px; height: 16px; margin: -12px 0 0 -8px; border-left: 1px solid #fff; border-bottom: 1px solid #fff; transform: rotate(-45deg); box-sizing: border-box; } .main_body_service .b_wrapp .btn.btn-down::before { display: block; position: absolute; top: 26%; left: 29%; z-index: -1; content: ''; width: 44px; height: 44px; box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.1); border-radius: 100%; opacity: 0; animation: sdb03 3s infinite; box-sizing: border-box; } @keyframes sdb03 { 0% { opacity: 0; } 30% { opacity: 1; } 60% { box-shadow: 0 0 0 60px rgba(255, 255, 255, 0.1); opacity: 0; } 100% { opacity: 0; } } .main_body_portfolio { z-index: 3; position: relative; background-color: #fff; } .main_body_portfolio .header { position: relative; z-index: 1; } .main_body_portfolio .header .wrapper_portfolio .banner_portfolio .banner_bg { background-image: url(/theme_zen_dark/static/src/img/banner/bg6.jpg); justify-content: center; width: 100%; margin: auto; background-size: cover; height: 100vh; background-repeat: no-repeat; background-position: center; } @media screen and (max-width: 768px) { .main_body_portfolio .header .wrapper_portfolio .banner_portfolio .banner_bg { height: auto; } } .main_body_portfolio .header .wrapper_portfolio .banner_portfolio .banner_bg .card { display: none; background: transparent; padding-top: 100px; padding-bottom: 100px; border: none !important; letter-spacing: -2px; text-transform: uppercase; } @media screen and (max-width: 996px) { .main_body_portfolio .header .wrapper_portfolio .banner_portfolio .banner_bg .card { display: block; padding-top: 200px; padding-left: 100px; } } @media screen and (max-width: 768px) { .main_body_portfolio .header .wrapper_portfolio .banner_portfolio .banner_bg .card { display: block; padding-top: 200px; padding-left: 100px; } } @media screen and (max-width: 572px) { .main_body_portfolio .header .wrapper_portfolio .banner_portfolio .banner_bg .card { display: block; padding-top: 100px; padding-left: 25px; } } @media screen and (max-width: 450px) { .main_body_portfolio .header .wrapper_portfolio .banner_portfolio .banner_bg .card { display: block; padding-top: 100px; padding-left: 20px; } } .main_body_portfolio .header .wrapper_portfolio .banner_portfolio .banner_bg .card .card-title { font-size: 2.5vw; font-weight: 700; color: #f6faff; } @media screen and (max-width: 996px) { .main_body_portfolio .header .wrapper_portfolio .banner_portfolio .banner_bg .card .card-title { font-size: 25px; } } @media screen and (max-width: 572px) { .main_body_portfolio .header .wrapper_portfolio .banner_portfolio .banner_bg .card .card-title { font-size: 18px; } } @media screen and (max-width: 768px) { .main_body_portfolio .header .wrapper_portfolio .banner_portfolio .banner_bg .card .card-title { font-size: 25px; } } .main_body_portfolio .header .wrapper_portfolio .banner_portfolio .banner_bg .card .card-text { color: #fff; font-size: 3.5vw; font-weight: bolder; } @media screen and (max-width: 996px) { .main_body_portfolio .header .wrapper_portfolio .banner_portfolio .banner_bg .card .card-text { font-size: 40px; } } @media screen and (max-width: 768px) { .main_body_portfolio .header .wrapper_portfolio .banner_portfolio .banner_bg .card .card-text { font-size: 40px; } } @media screen and (max-width: 572px) { .main_body_portfolio .header .wrapper_portfolio .banner_portfolio .banner_bg .card .card-text { font-size: 30px; } } .main_body_portfolio .header .wrapper_portfolio .banner_portfolio .banner_bg .card .text-bottom { font-size: 30px; } .main_body_portfolio .header .wrapper_portfolio .banner_portfolio .banner_bg .card .text-bottom span { font-size: 25px; color: #f6faff; font-weight: bolder; padding-bottom: 40px; letter-spacing: 0px; } @media screen and (max-width: 572px) { .main_body_portfolio .header .wrapper_portfolio .banner_portfolio .banner_bg .card .text-bottom span { font-size: 20px; } } @media screen and (max-width: 415px) { .main_body_portfolio .header .wrapper_portfolio .banner_portfolio .banner_bg .card .text-bottom span { font-size: 14px; } } .main_body_portfolio .header .wrapper_portfolio .banner_portfolio .banner_left { width: 100%; height: 100vh; background-color: #333333; } @media screen and (max-width: 996px) { .main_body_portfolio .header .wrapper_portfolio .banner_portfolio .banner_left { display: none; } } .main_body_portfolio .header .wrapper_portfolio .banner_portfolio .banner_left p { opacity: 0; animation: fadeInUp 1s ease-in-out 0s forwards; } .main_body_portfolio .header .wrapper_portfolio .banner_portfolio .banner_left p.first { animation-delay: 1s; } .main_body_portfolio .header .wrapper_portfolio .banner_portfolio .banner_left p.second { animation-delay: 3s; } .main_body_portfolio .header .wrapper_portfolio .banner_portfolio .banner_left p.third { animation-delay: 5s; } .main_body_portfolio .header .wrapper_portfolio .banner_portfolio .banner_left p.fourth { animation-delay: 7s; } .main_body_portfolio .header .wrapper_portfolio .banner_portfolio .banner_left p.fifth { animation-delay: 9s; } .main_body_portfolio .header .wrapper_portfolio .banner_portfolio .banner_left p.sixth { animation-delay: 11s; } .main_body_portfolio .header .wrapper_portfolio .banner_portfolio .banner_left .card { background: transparent; padding-top: 150px; padding-bottom: 100px; border: none !important; letter-spacing: -2px; text-transform: uppercase; } .main_body_portfolio .header .wrapper_portfolio .banner_portfolio .banner_left .card .card-title { font-size: 2.5vw; font-weight: 700; color: #f6faff; } .main_body_portfolio .header .wrapper_portfolio .banner_portfolio .banner_left .card .card-text { color: #fff; font-size: 3.5vw; font-weight: bolder; } .main_body_portfolio .header .wrapper_portfolio .banner_portfolio .banner_left .card .text-bottom { font-size: 20px; color: #f6faff; font-weight: bolder; padding-bottom: 40px; letter-spacing: 0px; } .main_body_portfolio .recent_P { background: #fff; padding-top: 100px; } .main_body_portfolio .recent_P .heading { color: #1f2125; padding-bottom: 50px; } .main_body_portfolio .recent_P .heading h1 { text-align: center; color: #1f2125; text-transform: uppercase; font-size: 65px; letter-spacing: -2px; font-weight: 700; margin-bottom: 10px; } @media screen and (max-width: 768px) { .main_body_portfolio .recent_P .heading h1 { font-size: 40px; } } .main_body_portfolio .recent_P .heading p { text-align: center; text-transform: uppercase; letter-spacing: 2px; font-size: 13px; font-weight: 500; } .main_body_portfolio .recent_P .wrapper { margin-top: 40px; } .main_body_portfolio .recent_P .wrapper .recent_content { padding-bottom: 100px; } .main_body_portfolio .recent_P .wrapper .recent_content .top { color: #333333; font-size: 20px; font-weight: 600; margin-bottom: 5px; text-transform: uppercase; padding-top: 23px; } .main_body_portfolio .recent_P .wrapper .recent_content h3 { color: #1f2125; font-weight: 700; font-size: 30px; text-transform: uppercase; padding-top: 16px; } .main_body_portfolio .recent_P .wrapper .recent_content .text { padding-top: 40px; padding-bottom: 40px; } .main_body_portfolio .recent_P .wrapper .recent_img { padding-bottom: 100px; max-width: 380px; overflow: hidden; position: relative; } .main_body_portfolio .recent_P .wrapper img { width: 100%; } .main_body_portfolio .recent_P .wrapper img:hover { transform: scale(1.1); transition: all 1s ease-in-out; } .main_body_portfolio .load { background-color: #f6faff; } .main_body_portfolio .load .load_more { padding: 80px 0; text-align: center; } .main_body_portfolio .b_wrap{ position: absolute; bottom: 40px; z-index: 999; right: 26%; } @media screen and (max-width: 650px) { .main_body_portfolio .b_wrap { right: 40%; bottom: 20px; } } .main_body_portfolio .b_wrap .btn.btn-down { position: relative; z-index: 999; color: #fff; } .main_body_portfolio .b_wrap .btn.btn-down::after { display: block; top: 103%; left: 50%; position: absolute; content: ''; width: 16px; height: 16px; margin: -12px 0 0 -8px; border-left: 1px solid #fff; border-bottom: 1px solid #fff; transform: rotate(-45deg); box-sizing: border-box; } .main_body_portfolio .b_wrap .btn.btn-down::before { display: block; position: absolute; top: 26%; left: 29%; z-index: -1; content: ''; width: 44px; height: 44px; box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.1); border-radius: 100%; opacity: 0; animation: sdb03 3s infinite; box-sizing: border-box; } @keyframes sdb03 { 0% { opacity: 0; } 30% { opacity: 1; } 60% { box-shadow: 0 0 0 60px rgba(255, 255, 255, 0.1); opacity: 0; } 100% { opacity: 0; } } .main_body_project { z-index: 3; position: relative; background-color: #fff; } .main_body_project .header { position: relative; z-index: 1; } .main_body_project .header .wrapper_project .banner_project .banner_bg { background-image: url(/theme_zen_dark/static/src/img/banner/bg7.jpg); justify-content: center; width: 100%; margin: auto; background-size: cover; height: 100vh; background-repeat: no-repeat; background-position: center; } @media screen and (max-width: 768px) { .main_body_project .header .wrapper_project .banner_project .banner_bg { height: auto; } } .main_body_project .header .wrapper_project .banner_project .banner_bg .card { display: none; background: transparent; padding-top: 100px; padding-bottom: 100px; border: none !important; letter-spacing: -2px; text-transform: uppercase; } @media screen and (max-width: 996px) { .main_body_project .header .wrapper_project .banner_project .banner_bg .card { display: block; padding-top: 200px; padding-left: 100px; } } @media screen and (max-width: 768px) { .main_body_project .header .wrapper_project .banner_project .banner_bg .card { display: block; padding-top: 200px; padding-left: 100px; } } @media screen and (max-width: 572px) { .main_body_project .header .wrapper_project .banner_project .banner_bg .card { display: block; padding-top: 100px; padding-left: 25px; } } @media screen and (max-width: 450px) { .main_body_project .header .wrapper_project .banner_project .banner_bg .card { display: block; padding-top: 100px; padding-left: 20px; } } .main_body_project .header .wrapper_project .banner_project .banner_bg .card .card-title { font-size: 2.5vw; font-weight: 700; color: #f6faff; } @media screen and (max-width: 996px) { .main_body_project .header .wrapper_project .banner_project .banner_bg .card .card-title { font-size: 25px; } } @media screen and (max-width: 572px) { .main_body_project .header .wrapper_project .banner_project .banner_bg .card .card-title { font-size: 18px; } } @media screen and (max-width: 768px) { .main_body_project .header .wrapper_project .banner_project .banner_bg .card .card-title { font-size: 25px; } } .main_body_project .header .wrapper_project .banner_project .banner_bg .card .card-text { color: #fff; font-size: 3.5vw; font-weight: bolder; } @media screen and (max-width: 996px) { .main_body_project .header .wrapper_project .banner_project .banner_bg .card .card-text { font-size: 40px; } } @media screen and (max-width: 768px) { .main_body_project .header .wrapper_project .banner_project .banner_bg .card .card-text { font-size: 40px; } } @media screen and (max-width: 572px) { .main_body_project .header .wrapper_project .banner_project .banner_bg .card .card-text { font-size: 30px; } } .main_body_project .header .wrapper_project .banner_project .banner_bg .card .text-bottom span { font-size: 25px; color: #f6faff; font-weight: bolder; padding-bottom: 40px; letter-spacing: 0px; } @media screen and (max-width: 572px) { .main_body_project .header .wrapper_project .banner_project .banner_bg .card .text-bottom span { font-size: 20px; } } @media screen and (max-width: 415px) { .main_body_project .header .wrapper_project .banner_project .banner_bg .card .text-bottom span { font-size: 14px; } } .main_body_project .header .wrapper_project .banner_project .banner_left { width: 100%; height: 100vh; background-color: #333333; } @media screen and (max-width: 996px) { .main_body_project .header .wrapper_project .banner_project .banner_left { display: none; } } .main_body_project .header .wrapper_project .banner_project .banner_left p { opacity: 0; animation: fadeInUp 1s ease-in-out 0s forwards; } .main_body_project .header .wrapper_project .banner_project .banner_left p.first { animation-delay: 1s; } .main_body_project .header .wrapper_project .banner_project .banner_left p.second { animation-delay: 3s; } .main_body_project .header .wrapper_project .banner_project .banner_left p.third { animation-delay: 5s; } .main_body_project .header .wrapper_project .banner_project .banner_left p.fourth { animation-delay: 7s; } .main_body_project .header .wrapper_project .banner_project .banner_left p.fifth { animation-delay: 9s; } .main_body_project .header .wrapper_project .banner_project .banner_left p.sixth { animation-delay: 11s; } .main_body_project .header .wrapper_project .banner_project .banner_left .card { background: transparent; padding-top: 150px; padding-bottom: 100px; border: none !important; letter-spacing: -2px; text-transform: uppercase; } .main_body_project .header .wrapper_project .banner_project .banner_left .card .card-title { font-size: 2.7vw; font-weight: 700; color: #f6faff; } .main_body_project .header .wrapper_project .banner_project .banner_left .card .card-text { color: #fff; font-size: 4.3vw; font-weight: bolder; } .main_body_project .header .wrapper_project .banner_project .banner_left .card .text-bottom { font-size: 28px; color: #fff; font-weight: bolder; padding-bottom: 40px; letter-spacing: 2px; } .main_body_project .header .wrapper_project .banner_project .banner_left .card .text-bottom span { padding-right: 40px; } .main_body_project .project { background: #333333; padding: 100px 0; } @media screen and (max-width: 768px) { .main_body_project .project { padding: 40px 0; } } .main_body_project .project .wrapper .branding { margin-top: 50px; } @media screen and (max-width: 768px) { .main_body_project .project .wrapper .branding { margin-top: 0px; } } @media screen and (max-width: 768px) { .main_body_project .project .wrapper .branding .wrapper_brand { padding-left: 30px; } } .main_body_project .project .wrapper .branding .team_heading { text-transform: uppercase; margin-top: 20px; } .main_body_project .project .wrapper .branding .team_heading h5 { font-size: 16px; font-weight: 700; color: #f6faff; margin: auto; } .main_body_project .project .wrapper .branding .team_heading span { font-weight: 700; color: #fff; font-size: 30px; letter-spacing: 2px; } .main_body_project .project .wrapper .branding .branding_info { margin-top: 40px; } .main_body_project .project .wrapper .branding .branding_info ul { padding-left: 0; } .main_body_project .project .wrapper .branding .branding_info ul h4 { color: #f6faff; font-size: 18px; padding-bottom: 15px; } .main_body_project .project .wrapper .branding .branding_info ul li::before { content: "\2022"; color: #f6faff; font-weight: bold; display: inline-block; width: 1em; margin-left: -1em; position: absolute; left: -8px; } .main_body_project .project .wrapper .branding .branding_info li { font-size: 11px; letter-spacing: 2px; padding-bottom: 16px; font-weight: 600; color: #fff; text-transform: uppercase; position: relative; } .main_body_project .project .wrapper .branding p { font-family: 'Open Sans', sans-serif !important; font-size: 17px; line-height: 2.5rem; color: #fff; } .main_body_project .project_details { background: #fff; padding: 100px 0; } @media screen and (max-width: 768px) { .main_body_project .project_details { padding: 40px 0; } } .main_body_project .project_details .wrapper { padding: 0 50px; } @media screen and (max-width: 768px) { .main_body_project .project_details .wrapper { padding: 0px 20px; } } @media screen and (max-width: 415px) { .main_body_project .project_details .wrapper { padding: 0px 10px; } } .main_body_project .project_details .wrapper .project_heading { color: #333333; font-size: 30px; font-weight: 700; padding-bottom: 40px; } .main_body_project .project_details .wrapper .project_desc { font-family: 'Open Sans', sans-serif !important; font-size: 17px; line-height: 2.5rem; color: #6c6a74; font-weight: 500; } .main_body_project .project_details .project_bottom { margin-top: 50px; margin-bottom: 50px; } .main_body_project .project_details .project_bottom .single { max-width: 460px; } @media screen and (max-width: 992px) { .main_body_project .project_details .project_bottom .single { max-width: 990px; padding-bottom: 30px; object-fit: cover; } } .main_body_project .project_details .project_bottom .single img { width: 100%; } .main_body_project .project_details .project_bottom .single_2 { color: #f6faff; font-size: 25px; padding-bottom: 30px; } .main_body_project .project_details .single_3 { max-width: 1600px; } .main_body_project .project_details .single_3 img { width: 100%; } .main_body_project .part_two .wrapper { padding: 0 50px; } @media screen and (max-width: 768px) { .main_body_project .part_two .wrapper { padding: 0px 20px; } } @media screen and (max-width: 415px) { .main_body_project .part_two .wrapper { padding: 0px 10px; } } .main_body_project .part_two .wrapper .project_heading { color: #333333; font-size: 30px; font-weight: 700; padding-bottom: 40px; } .main_body_project .part_two .wrapper .project_desc { font-family: 'Open Sans', sans-serif !important; font-size: 17px; line-height: 2.5rem; color: #6c6a74; font-weight: 500; } .main_body_project .part_two .wrapper_part_two { margin-top: 40px; padding-bottom: 100px; } @media screen and (max-width: 768px) { .main_body_project .part_two .wrapper_part_two { margin-top: 0; padding-bottom: 0px; } } .main_body_project .part_two .wrapper_part_two .single_img_part_two { max-width: 1000px; margin: auto; padding-top: 40px; } .main_body_project .part_two .wrapper_part_two .single_img_part_two img { width: 100%; } .main_body_project .part_two .wrapper_part_two .single_img_part_two:nth-child(4) img { margin-bottom: 100px; } .main_body_project .part_two .project_top .wrapper_3 { position: relative; top: 100%; transform: translateY(-100%); } .main_body_project .part_two .project_top .img_nine { max-width: 1000px; } @media screen and (max-width: 768px) { .main_body_project .part_two .project_top .img_nine { margin-top: 40px; } } .main_body_project .part_two .project_top .img_nine img { width: 100%; } .main_body_project .part_two .single_3 { max-width: 1600px; margin-top: 100px; } .main_body_project .part_two .single_3 img { width: 100%; } .main_body_project .project_last { background: #fff; padding: 100px 0; } @media screen and (max-width: 768px) { .main_body_project .project_last { padding: 50px 0; } } .main_body_project .project_last .wrapper .branding { margin-top: 50px; } @media screen and (max-width: 768px) { .main_body_project .project_last .wrapper .branding .wrapper_brand { padding-left: 20px; padding-bottom: 30px; } } .main_body_project .project_last .wrapper .branding .team_heading { text-transform: uppercase; margin-top: 20px; } .main_body_project .project_last .wrapper .branding .team_heading h5 { font-size: 16px; font-weight: 700; color: #333333; margin: auto; } .main_body_project .project_last .wrapper .branding .team_heading span { font-weight: 700; color: #1f2125; font-size: 30px; letter-spacing: 2px; } .main_body_project .project_last .wrapper .branding .branding_info { margin-top: 40px; } .main_body_project .project_last .wrapper .branding .branding_info .own p { font-size: 17px; color: #1f2125; font-weight: 700; } .main_body_project .project_last .wrapper .branding .branding_info .own span { font-size: 17px; color: #1f2125; font-weight: 200; padding-top: 10px; } .main_body_project .project_last .wrapper .branding p { font-family: 'Open Sans', sans-serif !important; font-size: 17px; line-height: 2.5rem; color: #1f2125; } .main_body_project .load { background-color: #f6faff; } .main_body_project .load .load_more { padding: 80px 0; text-align: center; } .main_body_blog { z-index: 3; position: relative; background-color: #fff; } .main_body_blog .header { position: relative; z-index: 1; } .main_body_blog .header .wrapper_blog .banner_blog .banner_bg { background-image: url(/theme_zen_dark/static/src/img/banner/bg8.jpg) !important; justify-content: center; width: 100%; margin: auto; background-size: cover; height: 100vh; background-repeat: no-repeat; background-position: center; } @media screen and (max-width: 768px) { .main_body_blog .header .wrapper_blog .banner_blog .banner_bg { height: auto; } } .main_body_blog .header .wrapper_blog .banner_blog .banner_bg .card { display: none; background: transparent; padding-top: 100px; padding-bottom: 100px; border: none !important; letter-spacing: -2px; text-transform: uppercase; } @media screen and (max-width: 996px) { .main_body_blog .header .wrapper_blog .banner_blog .banner_bg .card { display: block; padding-top: 200px; padding-left: 100px; } } @media screen and (max-width: 768px) { .main_body_blog .header .wrapper_blog .banner_blog .banner_bg .card { display: block; padding-top: 200px; padding-left: 100px; } } @media screen and (max-width: 572px) { .main_body_blog .header .wrapper_blog .banner_blog .banner_bg .card { display: block; padding-top: 100px; padding-left: 25px; } } @media screen and (max-width: 450px) { .main_body_blog .header .wrapper_blog .banner_blog .banner_bg .card { display: block; padding-top: 100px; padding-left: 20px; } } .main_body_blog .header .wrapper_blog .banner_blog .banner_bg .card .card-title { font-size: 2.5vw; font-weight: 700; color: #f6faff; } @media screen and (max-width: 996px) { .main_body_blog .header .wrapper_blog .banner_blog .banner_bg .card .card-title { font-size: 25px; } } @media screen and (max-width: 572px) { .main_body_blog .header .wrapper_blog .banner_blog .banner_bg .card .card-title { font-size: 18px; } } @media screen and (max-width: 768px) { .main_body_blog .header .wrapper_blog .banner_blog .banner_bg .card .card-title { font-size: 25px; } } .main_body_blog .header .wrapper_blog .banner_blog .banner_bg .card .card-text { color: #fff; font-size: 3.5vw; font-weight: bolder; } @media screen and (max-width: 996px) { .main_body_blog .header .wrapper_blog .banner_blog .banner_bg .card .card-text { font-size: 40px; } } @media screen and (max-width: 768px) { .main_body_blog .header .wrapper_blog .banner_blog .banner_bg .card .card-text { font-size: 40px; } } @media screen and (max-width: 572px) { .main_body_blog .header .wrapper_blog .banner_blog .banner_bg .card .card-text { font-size: 30px; } } .main_body_blog .header .wrapper_blog .banner_blog .banner_bg .card .text-bottom { font-size: 30px; } .main_body_blog .header .wrapper_blog .banner_blog .banner_bg .card .text-bottom span { font-size: 25px; color: #f6faff; font-weight: bolder; padding-bottom: 40px; letter-spacing: 0px; } @media screen and (max-width: 572px) { .main_body_blog .header .wrapper_blog .banner_blog .banner_bg .card .text-bottom span { font-size: 20px; } } @media screen and (max-width: 415px) { .main_body_blog .header .wrapper_blog .banner_blog .banner_bg .card .text-bottom span { font-size: 14px; } } .main_body_blog .header .wrapper_blog .banner_blog .banner_left { width: 100%; height: 100vh; background-color: #333333; } @media screen and (max-width: 996px) { .main_body_blog .header .wrapper_blog .banner_blog .banner_left { display: none; } } .main_body_blog .header .wrapper_blog .banner_blog .banner_left p { opacity: 0; animation: fadeInUp 1s ease-in-out 0s forwards; } .main_body_blog .header .wrapper_blog .banner_blog .banner_left p.first { animation-delay: 1s; } .main_body_blog .header .wrapper_blog .banner_blog .banner_left p.second { animation-delay: 3s; } .main_body_blog .header .wrapper_blog .banner_blog .banner_left p.third { animation-delay: 5s; } .main_body_blog .header .wrapper_blog .banner_blog .banner_left p.fourth { animation-delay: 7s; } .main_body_blog .header .wrapper_blog .banner_blog .banner_left p.fifth { animation-delay: 9s; } .main_body_blog .header .wrapper_blog .banner_blog .banner_left p.sixth { animation-delay: 11s; } .main_body_blog .header .wrapper_blog .banner_blog .banner_left .card { background: transparent; padding-top: 150px; padding-bottom: 100px; border: none !important; letter-spacing: -2px; text-transform: uppercase; } .main_body_blog .header .wrapper_blog .banner_blog .banner_left .card .card-title { font-size: 2.5vw; font-weight: 700; color: #f6faff; } .main_body_blog .header .wrapper_blog .banner_blog .banner_left .card .card-text { color: #fff; font-size: 3.5vw; font-weight: bolder; } .main_body_blog .header .wrapper_blog .banner_blog .banner_left .card .text-bottom { font-size: 20px; color: #f6faff; font-weight: bolder; padding-bottom: 40px; letter-spacing: 0px; } .main_body_blog .blog_main { padding: 100px 0; } @media screen and (max-width: 1200px) { .main_body_blog .blog_main { padding-top: 50px; } } .main_body_blog .blog_main .wrapper { padding: 0 50px; } @media screen and (max-width: 1200px) { .main_body_blog .blog_main .wrapper { margin-right: 30px; padding: 0; } } .main_body_blog .blog_main .wrapper .blog_wrapper { margin: 0 30px; } @media screen and (max-width: 1200px) { .main_body_blog .blog_main .wrapper .blog_wrapper { margin-right: 0px; } } .main_body_blog .blog_main .wrapper .blog_wrapper a { text-decoration: none; } .main_body_blog .blog_main .wrapper .blog_wrapper .card { border-radius: 0; border: none; padding: 40px 0; } .main_body_blog .blog_main .wrapper .blog_wrapper .card .img_wrapper { overflow: hidden; } .main_body_blog .blog_main .wrapper .blog_wrapper .card .card-img-top { border-radius: 0; overflow: hidden; } .main_body_blog .blog_main .wrapper .blog_wrapper .card .card-img-top:hover { overflow: hidden; transform: scale(1.1); transition: all 1s ease-in-out; transition-property: all; } .main_body_blog .blog_main .wrapper .blog_wrapper .card .card-body { margin-top: 10px; } .main_body_blog .blog_main .wrapper .blog_wrapper .card .card-body .card-title { font-size: 30px; text-transform: uppercase; color: #1f2125; padding-top: 15px; margin: 0 10px; } .main_body_blog .blog_main .wrapper .blog_wrapper .card .card-body .title_details { font-size: 16px; padding-top: 15px; margin: 0 10px; line-height: 1.8; font-weight: 600; letter-spacing: 0px; font-family: "Open Sans", sans-serif !important; color: #1f2125; } .main_body_blog .blog_main .wrapper .blog_wrapper .card .card-body .blog-links { padding-top: 20px; margin-top: 10px; } .main_body_blog .blog_main .wrapper .blog_wrapper .card .card-body ul { display: flex; padding-left: 0; } .main_body_blog .blog_main .wrapper .blog_wrapper .card .card-body ul .icon { max-width: 20px; display: block; } .main_body_blog .blog_main .wrapper .blog_wrapper .card .card-body ul .icon img { width: 100%; } .main_body_blog .blog_main .wrapper .blog_wrapper .card .card-body ul li { padding: 0 10px; } .main_body_blog .blog_main .wrapper .blog_wrapper .card .card-body ul li a { color: #6c6a74; text-decoration: none; text-transform: uppercase; letter-spacing: 2px; font-size: 11px; } .main_body_blog .blog_main .wrapper .blog_wrapper .card .card-body ul li a:hover { color: #f0bd7a; } .main_body_blog .blog_main .wrapper .blog_wrapper .card .card-body .card-text { margin-top: 30px; display: flex; justify-content: space-between; } .main_body_blog .blog_main .wrapper .blog_wrapper .card .card-body .card-text span a { color: #1f2125; text-decoration: none; text-transform: uppercase; letter-spacing: 2px; font-size: 12px; font-weight: 700; } .main_body_blog .blog_main .wrapper .blog_wrapper .card .card-body .card-text span a:hover { color: #f0bd7a; } .main_body_blog .b_wrapp { position: absolute; bottom: 40px; z-index: 999; right: 26%; } @media screen and (max-width: 650px) { .main_body_blog .b_wrapp { right: 40%; bottom: 20px; } } .main_body_blog .b_wrapp .btn.btn-down { position: relative; z-index: 999; color: #fff; } .main_body_blog .b_wrapp .btn.btn-down::after { display: block; top: 103%; left: 50%; position: absolute; content: ''; width: 16px; height: 16px; margin: -12px 0 0 -8px; border-left: 1px solid #fff; border-bottom: 1px solid #fff; transform: rotate(-45deg); box-sizing: border-box; } .main_body_blog .b_wrapp .btn.btn-down::before { display: block; position: absolute; top: 26%; left: 29%; z-index: -1; content: ''; width: 44px; height: 44px; box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.1); border-radius: 100%; opacity: 0; animation: sdb03 3s infinite; box-sizing: border-box; } @keyframes sdb03 { 0% { opacity: 0; } 30% { opacity: 1; } 60% { box-shadow: 0 0 0 60px rgba(255, 255, 255, 0.1); opacity: 0; } 100% { opacity: 0; } } .main_body_blog_detail { z-index: 3; position: relative; background-color: #fff; } .main_body_blog_detail .header { position: relative; z-index: 1; } .main_body_blog_detail .header .wrapper_blog_d .banner_blog_d .banner_bg { background-image: url(/theme_zen_dark/static/src/img/banner/bg9.jpg) !important; justify-content: center; width: 100%; margin: auto; background-size: cover; height: 100vh; background-repeat: no-repeat; background-position: center; } @media screen and (max-width: 768px) { .main_body_blog_detail .header .wrapper_blog_d .banner_blog_d .banner_bg { height: auto; } } .main_body_blog_detail .header .wrapper_blog_d .banner_blog_d .banner_bg .card { display: none; background: transparent; padding-top: 100px; padding-bottom: 100px; border: none !important; letter-spacing: -2px; text-transform: uppercase; } @media screen and (max-width: 996px) { .main_body_blog_detail .header .wrapper_blog_d .banner_blog_d .banner_bg .card { display: block; padding-top: 200px; padding-left: 100px; } } @media screen and (max-width: 768px) { .main_body_blog_detail .header .wrapper_blog_d .banner_blog_d .banner_bg .card { display: block; padding-top: 200px; padding-left: 100px; } } @media screen and (max-width: 572px) { .main_body_blog_detail .header .wrapper_blog_d .banner_blog_d .banner_bg .card { display: block; padding-top: 100px; padding-left: 25px; } } @media screen and (max-width: 450px) { .main_body_blog_detail .header .wrapper_blog_d .banner_blog_d .banner_bg .card { display: block; padding-top: 100px; padding-left: 20px; } } .main_body_blog_detail .header .wrapper_blog_d .banner_blog_d .banner_bg .card .card-title { font-size: 2.5vw; font-weight: 700; color: #f6faff; } @media screen and (max-width: 996px) { .main_body_blog_detail .header .wrapper_blog_d .banner_blog_d .banner_bg .card .card-title { font-size: 25px; } } @media screen and (max-width: 572px) { .main_body_blog_detail .header .wrapper_blog_d .banner_blog_d .banner_bg .card .card-title { font-size: 18px; } } @media screen and (max-width: 768px) { .main_body_blog_detail .header .wrapper_blog_d .banner_blog_d .banner_bg .card .card-title { font-size: 25px; } } .main_body_blog_detail .header .wrapper_blog_d .banner_blog_d .banner_bg .card .card-text { color: #fff; font-size: 3.5vw; font-weight: bolder; } @media screen and (max-width: 996px) { .main_body_blog_detail .header .wrapper_blog_d .banner_blog_d .banner_bg .card .card-text { font-size: 40px; } } @media screen and (max-width: 768px) { .main_body_blog_detail .header .wrapper_blog_d .banner_blog_d .banner_bg .card .card-text { font-size: 40px; } } @media screen and (max-width: 572px) { .main_body_blog_detail .header .wrapper_blog_d .banner_blog_d .banner_bg .card .card-text { font-size: 30px; } } .main_body_blog_detail .header .wrapper_blog_d .banner_blog_d .banner_bg .card .text-bottom { font-size: 30px; } .main_body_blog_detail .header .wrapper_blog_d .banner_blog_d .banner_bg .card .text-bottom span { font-size: 25px; color: #f6faff; font-weight: bolder; padding-bottom: 40px; letter-spacing: 0px; } @media screen and (max-width: 572px) { .main_body_blog_detail .header .wrapper_blog_d .banner_blog_d .banner_bg .card .text-bottom span { font-size: 20px; } } @media screen and (max-width: 415px) { .main_body_blog_detail .header .wrapper_blog_d .banner_blog_d .banner_bg .card .text-bottom span { font-size: 14px; } } .main_body_blog_detail .header .wrapper_blog_d .banner_blog_d .banner_left { width: 100%; height: 100vh; background-color: #333333; } @media screen and (max-width: 996px) { .main_body_blog_detail .header .wrapper_blog_d .banner_blog_d .banner_left { display: none; } } .main_body_blog_detail .header .wrapper_blog_d .banner_blog_d .banner_left p { opacity: 0; animation: fadeInUp 1s ease-in-out 0s forwards; } .main_body_blog_detail .header .wrapper_blog_d .banner_blog_d .banner_left p.first { animation-delay: 1s; } .main_body_blog_detail .header .wrapper_blog_d .banner_blog_d .banner_left p.second { animation-delay: 3s; } .main_body_blog_detail .header .wrapper_blog_d .banner_blog_d .banner_left p.third { animation-delay: 5s; } .main_body_blog_detail .header .wrapper_blog_d .banner_blog_d .banner_left p.fourth { animation-delay: 7s; } .main_body_blog_detail .header .wrapper_blog_d .banner_blog_d .banner_left p.fifth { animation-delay: 9s; } .main_body_blog_detail .header .wrapper_blog_d .banner_blog_d .banner_left p.sixth { animation-delay: 11s; } .main_body_blog_detail .header .wrapper_blog_d .banner_blog_d .banner_left .card { background: transparent; padding-top: 150px; padding-bottom: 100px; border: none !important; letter-spacing: -2px; text-transform: uppercase; } .main_body_blog_detail .header .wrapper_blog_d .banner_blog_d .banner_left .card .card-title { font-size: 2.5vw; font-weight: 700; color: #f6faff; } .main_body_blog_detail .header .wrapper_blog_d .banner_blog_d .banner_left .card .card-text { color: #fff; font-size: 3.5vw; font-weight: bolder; } .main_body_blog_detail .header .wrapper_blog_d .banner_blog_d .banner_left .card .text-bottom { font-size: 20px; color: #f6faff; font-weight: bolder; padding-bottom: 40px; letter-spacing: 0px; } .main_body_blog_detail .blog_main_detial { padding: 100px 0; } .main_body_blog_detail .blog_main_detial .wrapper { padding: 0 50px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper { margin: 0 30px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper a { text-decoration: none; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card { border-radius: 0; border: none; padding: 40px 0; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .img_wrapper { overflow: hidden; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-img-top { border-radius: 0; overflow: hidden; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-img-top:hover { overflow: hidden; transform: scale(1.1); transition: all 1s ease-in-out; transition-property: all; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body { margin-top: 20px; padding-left: 0; padding-right: 0; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .one, .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .two, .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .three, .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .five { font-family: "Open Sans", sans-serif !important; font-size: 14px; line-height: 29px; letter-spacing: 1px; color: #888787; font-weight: 600; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .two, .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .five { padding-top: 20px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .three { padding-top: 20px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .three .bh { color: #333333; font-weight: 700; font-size: 30px; padding-top: 20px; padding-bottom: 20px; text-align: center; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .four { margin-top: 30px; margin-bottom: 20px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .four .wrapper_i { display: flex; flex-flow: wrap; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .four .wrapper_i .img_wrapper { max-width: 435px; overflow: hidden; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .four .wrapper_i .img_wrapper img { width: 100%; overflow: hidden; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .four .wrapper_i .img_wrapper img:hover { overflow: hidden; transform: scale(1.1); transition: all 1s ease-in-out; transition-property: all; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .four .wrapper_i .img_wrapper:nth-child(1) img { padding-right: 15px !important; padding-bottom: 15px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .four .wrapper_i .img_wrapper:nth-child(2) img { padding-left: 15px !important; padding-bottom: 15px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .four .wrapper_i .img_wrapper:nth-child(3) img { padding-right: 15px !important; padding-top: 15px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .four .wrapper_i .img_wrapper:nth-child(4) img { padding-left: 15px !important; padding-top: 15px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .test_details { margin-top: 60px; position: relative; background-color: #333333; padding: 30px 20px; font-family: "Open Sans", sans-serif !important; font-size: 15px; line-height: 29px; letter-spacing: 2px; color: #fff; font-weight: 700; text-align: justify; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .test_details:after { content: " "; position: absolute; background-color: #333333; height: 20px; width: 20px; left: 95%; bottom: -10px; transform: translateX(-50%) rotate(45deg); } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .blog_icons { display: flex; justify-content: end; align-items: baseline; margin-top: 40px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .blog_icons h6 { padding-right: 20px; color: #6c6a74; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .blog_icons .icons { display: flex; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .blog_icons .icons a { color: #000000; margin-right: 25px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .blog_icons .icons a:hover { color: #f0bd7a; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .blog_icons .icons a span { font-size: 15px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .next .wrapper_b { margin-top: 75px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .next .wrapper_b h6 { font-size: 16px; font-weight: 700; text-transform: uppercase; letter-spacing: 1px; font-family: "Open Sans", sans-serif !important; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .next .wrapper_b .card-deck .card { border-radius: 0; border: none; padding-top: 10px !important; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .next .wrapper_b .card-deck .card .img_wrapper { overflow: hidden; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .next .wrapper_b .card-deck .card .card-img-top { border-radius: 0; overflow: hidden; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .next .wrapper_b .card-deck .card .card-img-top:hover { overflow: hidden; transform: scale(1.1); transition: all 1s ease-in-out; transition-property: all; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .next .wrapper_b .card-deck .card .card-body { margin-top: 10px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .next .wrapper_b .card-deck .card .card-body .card-title { font-size: 14px; text-transform: uppercase; color: #1f2125; margin: 0 10px; letter-spacing: 2px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .next .wrapper_b .card-deck .card .card-body .card-text { padding-top: 10px; margin: 0 10px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .next .wrapper_b .card-deck .card .card-body .card-text span a { color: #1f2125; text-decoration: none; text-transform: uppercase; letter-spacing: 2px; font-size: 12px; font-weight: 700; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .next .wrapper_b .card-deck .card .card-body .card-text span a:hover { color: #f0bd7a; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .top_comment { padding: 60px; display: flex; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .top_comment .img_wrapper { max-width: 200px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .top_comment .img_wrapper img { width: 100%; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .top_comment .comment_details { padding-top: 10px; padding-left: 20px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .top_comment .comment_details h6 { font-size: 16px;color: #b36251; padding-bottom: 10px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .top_comment .comment_details p { font-family: "Open Sans", sans-serif !important; font-size: 14px; line-height: 20px; letter-spacing: 1px; color: #888787; font-weight: 600; margin-bottom: 10px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .top_comment .comment_details .icons { display: flex; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .top_comment .comment_details .icons a { color: #000000; margin-right: 25px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .top_comment .comment_details .icons a:hover { color: #f0bd7a; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .top_comment .comment_details .icons a span { font-size: 15px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay { margin-top: 30px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay h6 { font-size: 16px; font-weight: 700; text-transform: uppercase; letter-spacing: 1px; font-family: "Open Sans", sans-serif !important; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment { padding: 20px; display: flex; border: 1px solid; border-color: transparent; border-bottom-color: #6c6a74; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment .img_wrapper { max-width: 75px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment .img_wrapper img { width: 100%; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment .comment_details { padding-top: 10px; padding-left: 20px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment .comment_details .top { display: flex; justify-content: space-between; padding-bottom: 15px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment .comment_details .top span { color: #1f2125; font-size: 14px; font-weight: 700; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment .comment_details .top span a { color: #888787; font-size: 14px; font-weight: 700; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment .comment_details .date { font-family: "Open Sans", sans-serif !important; padding-bottom: 15px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment .comment_details p { font-family: "Open Sans", sans-serif !important; font-size: 14px; line-height: 20px; letter-spacing: 1px; color: #888787; font-weight: 600; margin-bottom: 10px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment .comment_details .icons { display: flex; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment .comment_details .icons a { color: #000000; margin-right: 25px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment .comment_details .icons a:hover { color: #f0bd7a; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment .comment_details .icons a span { font-size: 15px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment_1 { padding: 20px; margin-top: 30px; display: flex; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment_1 .img_wrapper { max-width: 75px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment_1 .img_wrapper img { width: 100%; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment_1 .comment_details { padding-top: 10px; padding-left: 20px; border: 1px solid; border-color: transparent; border-bottom-color: #6c6a74; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment_1 .comment_details .top { display: flex; justify-content: space-between; padding-bottom: 15px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment_1 .comment_details .top span { color: #1f2125; font-size: 14px; font-weight: 700; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment_1 .comment_details .top span a { color: #888787; font-size: 14px; font-weight: 700; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment_1 .comment_details .date { font-family: "Open Sans", sans-serif !important; padding-bottom: 15px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment_1 .comment_details p { font-family: "Open Sans", sans-serif !important; font-size: 14px; line-height: 20px; letter-spacing: 1px; color: #888787; font-weight: 600; margin-bottom: 25px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment_1 .comment_details .icons { display: flex; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment_1 .comment_details .icons a { color: #000000; margin-right: 25px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment_1 .comment_details .icons a:hover { color: #f0bd7a; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment_1 .comment_details .icons a span { font-size: 15px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment_2 { padding: 20px; margin-top: 30px; display: flex; margin-left: 75px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment_2 .img_wrapper { max-width: 75px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment_2 .img_wrapper img { width: 100%; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment_2 .comment_details { padding-top: 10px; padding-left: 20px; border: 1px solid; border-color: transparent; border-bottom-color: #6c6a74; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment_2 .comment_details .top { display: flex; justify-content: space-between; padding-bottom: 15px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment_2 .comment_details .top span { color: #1f2125; font-size: 14px; font-weight: 700; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment_2 .comment_details .top span a { color: #888787; font-size: 14px; font-weight: 700; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment_2 .comment_details .date { font-family: "Open Sans", sans-serif !important; padding-bottom: 15px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment_2 .comment_details p { font-family: "Open Sans", sans-serif !important; font-size: 14px; line-height: 20px; letter-spacing: 1px; color: #888787; font-weight: 600; margin-bottom: 25px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment_2 .comment_details .icons { display: flex; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment_2 .comment_details .icons a { color: #000000; margin-right: 25px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment_2 .comment_details .icons a:hover { color: #f0bd7a; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment_2 .comment_details .icons a span { font-size: 15px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment_3 { padding: 20px; margin-top: 30px; display: flex; margin-left: 125px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment_3 .img_wrapper { max-width: 75px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment_3 .img_wrapper img { width: 100%; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment_3 .comment_details { padding-top: 10px; padding-left: 20px; border: 1px solid; border-color: transparent; border-bottom-color: #6c6a74; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment_3 .comment_details .top { display: flex; justify-content: space-between; padding-bottom: 15px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment_3 .comment_details .top span { color: #1f2125; font-size: 14px; font-weight: 700; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment_3 .comment_details .top span a { color: #888787; font-size: 14px; font-weight: 700; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment_3 .comment_details .date { font-family: "Open Sans", sans-serif !important; padding-bottom: 15px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment_3 .comment_details p { font-family: "Open Sans", sans-serif !important; font-size: 14px; line-height: 20px; letter-spacing: 1px; color: #888787; font-weight: 600; margin-bottom: 25px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment_3 .comment_details .icons { display: flex; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment_3 .comment_details .icons a { color: #000000; margin-right: 25px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment_3 .comment_details .icons a:hover { color: #f0bd7a; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment_3 .comment_details .icons a span { font-size: 15px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment_4 { padding: 20px; margin-top: 30px; display: flex; margin-left: 50px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment_4 .img_wrapper { max-width: 75px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment_4 .img_wrapper img { width: 100%; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment_4 .comment_details { padding-top: 10px; padding-left: 20px; border: 1px solid; border-color: transparent; border-bottom-color: #6c6a74; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment_4 .comment_details .top { display: flex; justify-content: space-between; padding-bottom: 15px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment_4 .comment_details .top span { color: #1f2125; font-size: 14px; font-weight: 700; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment_4 .comment_details .top span a { color: #888787; font-size: 14px; font-weight: 700; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment_4 .comment_details .date { font-family: "Open Sans", sans-serif !important; padding-bottom: 15px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment_4 .comment_details p { font-family: "Open Sans", sans-serif !important; font-size: 14px; line-height: 20px; letter-spacing: 1px; color: #888787; font-weight: 600; margin-bottom: 25px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment_4 .comment_details .icons { display: flex; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment_4 .comment_details .icons a { color: #000000; margin-right: 25px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment_4 .comment_details .icons a:hover { color: #f0bd7a; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .replay .top_comment_4 .comment_details .icons a span { font-size: 15px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .post_replay { padding-top: 50px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .post_replay h6 { font-size: 16px; font-weight: 700; text-transform: uppercase; letter-spacing: 1px; font-family: "Open Sans", sans-serif !important; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .post_replay form { margin-top: 30px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .post_replay form .form-group { margin-bottom: 30px; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .post_replay form .form-group .form-control { border-radius: 0; height: calc(3.5em + .95rem + 2px); padding: .575rem .75rem; box-shadow: none !important; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .post_replay form .form-group .form-control:focus { color: #5f5f5f; background-color: #fff; border-color: #1f2125; outline: 0; } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .post_replay form textarea { border: 1px solid !important; border-top-color: #c9c7c7 !important; border-right-color: #c9c7c7 !important; border-bottom-color: #c9c7c7 !important; border-left-color: #c9c7c7 !important; padding: 30px 20px; } .main_body_blog_detail .b_wrapp { position: absolute; bottom: 40px; z-index: 999; right: 26%; } @media screen and (max-width: 650px) { .main_body_blog_detail .b_wrapp { right: 40%; bottom: 20px; } } .main_body_blog_detail .b_wrapp .btn.btn-down { position: relative; z-index: 999; color: #fff; } .main_body_blog_detail .b_wrapp .btn.btn-down::after { display: block; top: 103%; left: 50%; position: absolute; content: ''; width: 16px; height: 16px; margin: -12px 0 0 -8px; border-left: 1px solid #fff; border-bottom: 1px solid #fff; transform: rotate(-45deg); box-sizing: border-box; } .main_body_blog_detail .b_wrapp .btn.btn-down::before { display: block; position: absolute; top: 26%; left: 29%; z-index: -1; content: ''; width: 44px; height: 44px; box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.1); border-radius: 100%; opacity: 0; animation: sdb03 3s infinite; box-sizing: border-box; } @keyframes sdb03 { 0% { opacity: 0; } 30% { opacity: 1; } 60% { box-shadow: 0 0 0 60px rgba(255, 255, 255, 0.1); opacity: 0; } 100% { opacity: 0; } } /*# new menus.... */ .navbar-light{ background: #333333; } .nav-item a { font-size: 18px !important; } .nav-link{ font-size: 18px; text-decoration: none; } .navbar .nav-link{ color: white !important; } .nav-link:hover{ color: #F0BD7A !important; } .nav-link.active { background: none !important; color: #b36251 !important; } .navbar-toggler-icon.o_not_editable { font-size: 29px; color: #000000 !important; opacity: 1; } .navbar-toggler.ml-2 { border: none !important; color: #000 !important; } .navbar-toggler.ml-2.collapsed:hover { background: none; } #menu { display: none; } #top_menu_container { display: flex; width: 100%; justify-content: space-between; max-width: none !important; } .row { max-width: none !important; } .card-body { background-color: transparent !important; } section, .oe_img_bg, [data-oe-shape-data], .o_background_video, .parallax, section > *, .oe_img_bg > *, [data-oe-shape-data] > *, .o_background_video > *, .parallax > * { position: relative !important; } .nav { display: block; } div .border-end{ display: none !important; } #oe_structure_header_magazine_1 { display: none; } .s_title { padding-top: 0px !important; padding-bottom: 0px !important; } .nav_style { float: right; background: #b36251 !important; text-align: right; } .main_body .header .wrapper { position: relative; width: 100% !important; overflow: hidden; } .btn-load { border-radius: 0; border-color: #fff !important; border: 1px solid; background-color: transparent; color: #1f2125 !important; letter-spacing: 4px; font-size: 12px; padding: 15px 40px; } .btn-load:hover { background-color: transparent; } .o_portal_chatter_attachment_btn { padding: 9px 12px !important; } .css_attribute_color{ width: 2.1rem; } .o_portal h2 * { font-size: 2rem; } .o_wsale_product_btn .btn-primary{ border-color: #2a797c !important; border-radius: 5px; color: white !important; } .o_wsale_product_btn .btn-primary span{ font-size: 15px; } .o_wsale_product_btn .btn-primary:hover{ background-color: #e6e5e5 !important; color: black !important; } .js_main_product .product_price * { font-size: 30px; } .main_body_contact .header { position: relative; z-index: 1; } .main_body_contact .header .wrapper_abt .banner .banner_bg { background-image: url(/theme_zen_dark/static/src/img/banner/bg10.jpg); justify-content: center; width: 100%; margin: auto; background-size: cover; height: 100vh; background-repeat: no-repeat; background-position: center; } @media screen and (max-width: 768px) { .main_body_contact .header .wrapper_abt .banner .banner_bg { height: auto; } } .main_body_contact .header .wrapper_abt .banner .banner_bg .card { display: none; background: transparent; padding-top: 100px; padding-bottom: 100px; border: none !important; letter-spacing: -2px; text-transform: uppercase; } @media screen and (max-width: 996px) { .main_body_contact .header .wrapper_abt .banner .banner_bg .card { display: block; padding-top: 200px; padding-left: 100px; } } @media screen and (max-width: 768px) { .main_body_contact .header .wrapper_abt .banner .banner_bg .card { display: block; padding-top: 200px; padding-left: 100px; } } @media screen and (max-width: 572px) { .main_body_contact .header .wrapper_abt .banner .banner_bg .card { display: block; padding-top: 100px; padding-left: 25px; } } @media screen and (max-width: 450px) { .main_body_contact .header .wrapper_abt .banner .banner_bg .card { display: block; padding-top: 100px; padding-left: 20px; } } .main_body_contact .header .wrapper_abt .banner .banner_bg .card .card-title { font-size: 2.5vw; font-weight: 700; color: #152235; } .main_body_project .b_wrapp { position: absolute; bottom: 40px; z-index: 999; right: 26%; } @media screen and (max-width: 650px) { .main_body_project .b_wrapp { right: 40%; bottom: 20px; } } .main_body_project .b_wrapp .btn.btn-down { position: relative; z-index: 999; color: #fff; } .main_body_project .b_wrapp .btn.btn-down::after { display: block; top: 103%; left: 50%; position: absolute; content: ''; width: 16px; height: 16px; margin: -12px 0 0 -8px; border-left: 1px solid #fff; border-bottom: 1px solid #fff; transform: rotate(-45deg); box-sizing: border-box; } .main_body_project .b_wrapp .btn.btn-down::before { display: block; position: absolute; top: 26%; left: 29%; z-index: -1; content: ''; width: 44px; height: 44px; box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.1); border-radius: 100%; opacity: 0; animation: sdb03 3s infinite; box-sizing: border-box; } @keyframes sdb03 { 0% { opacity: 0; } 30% { opacity: 1; } 60% { box-shadow: 0 0 0 60px rgba(255, 255, 255, 0.1); opacity: 0; } 100% { opacity: 0; } } .main_body_blog_detail .blog_main_detial .wrapper .blog_wrapper .card .card-body .blog_details .comment .post_replay form textarea:focus { color: #5f5f5f; background-color: #fff; border-color: #1f2125 !important; outline: 0; } .btn-secondary:not(:disabled):not(.disabled).active{ color: #FFFFFF; background-color: #000000 !important; border-color: #000000; } .btn-secondary:not(:disabled):not(.disabled).active:hover{ color: #FFF !important; background-color: #000000 !important; border-color: #000000; } .oe_product .btn-secondary:disabled{ color: red !important; } .products_pager{ padding-bottom: 50px !important; } .product_wrapper{ padding-right: 0; padding-left: 0; width: auto; } .btn-secondary:hover { background-color: transparent !important; color: #b36251 !important; } .contact-zen{ opacity: 1 !important; } #top_menu_container .offcanvas-backdrop { display: none; } #top_menu_collapse .nav li span, .links span { color: #111; font-size: 25px !important; } .coupon_form .input-group .btn-secondary.a-submit{ padding:5px; } #cart_total .table{ border:none; } #wrap{ overflow-y:hidden !important; } .o_portal_content .row > * { flex-shrink: 0 !important; width: 100% !important; max-width: 100% !important; padding-right: calc(var(--gutter-x) * .5) !important; padding-left: calc(var(--gutter-x) * .5) !important; margin-top: var(--gutter-y); } .order-2 { order: 2 !important; } @media (min-width: 768px){ .o_portal_content .col-md-6 { -webkit-box-flex: 0 !important; -webkit-flex: 0 0 auto !important; flex: 0 0 auto !important; width: 50% !important; } } .o_portal .record_pager .oi, .alert-link .oi, .o_portal_security_body .oi { display: inline-block !important; font-family: 'odoo_ui_icons' !important; speak: never !important; font-style: normal !important; font-weight: normal !important; font-variant: normal !important; text-transform: none !important; line-height: 1 !important; -webkit-font-smoothing: antialiased !important; -moz-osx-font-smoothing: grayscale !important; } header#top{ position: relative; height: 85px; } .navbar.navbar-light.o_colored_level.o_cc { position: absolute; width: 100%; } .text-primary-emphasis { color: #b36251 !important; } .badge.bg-primary { background-color: black !important; border-color: black !important; } .oe_product_cart .o_wsale_product_btn .btn:hover { color: #b36251 !important; background-color: #31708f !important; } .bg-primary { background-color: #31708f !important; } .form-check-input:checked { background-color: #31708f !important; border-color: #31708f !important; } input[type="radio"]+label { margin-left: 1rem !important; } .input-group { padding: 10px; } .navbar-light .dropdown-menu .dropdown-item.active { background-color: #31708f !important; }