@import url("https://fonts.googleapis.com/css2?family=Rochester&family=Ubuntu+Condensed&display=swap"); /* =========================== NavBar STyling ========================= */ nav.navbar { border-bottom: 1px solid rgb(128, 128, 128, .2); } .logo { width: 4rem; } .logo_txt { font-family: "Ubuntu Condensed", sans-serif; /* font-style: normal; font-weight: normal; font-size: 30px; line-height: 26px; */ letter-spacing: 0.01em; color: #28be41; } .navbar-collapse { flex-grow: unset; } .nav-link { /* padding: 0; */ margin-right: 1.2rem !important; font-weight: bold; transition: all 300ms cubic-bezier(0.075, 0.82, 0.165, 1); } .nav-link.active { color: #1c853e !important; } .nav-link:hover { font-size: calc(120%); /* font-weight: bolder; */ /* transform: scale(1.2); */ text-shadow: none; } .nav-link.dropdown-toggle::after { /* display: none!important; */ display: inline-block; margin-left: unset!important; vertical-align: unset!important; content: ""; border-top: unset!important; border-right: unset!important; border-bottom: unset!important; border-left: unset!important; } .nav-link:after { content: ""!important; position: relative !important; width: 0% !important; height: 2px !important; display: block !important; transition: all 0.3s ease !important; bottom: 25% !important; } .nav-link:hover::after { width: 100% !important; height: 2px !important; background-color: #1c853e !important; } .nav-link.active:after { color: #1c853e !important; content: ""!important; display: block !important; transition: all 0.3s ease !important; bottom: 25% !important; position: relative !important; width: 100% !important; height: 2px !important; background-color: #1c853e !important; } .dropdown-item.active, .dropdown-item:active { color: #fff; text-decoration: none; background-color: #1c853e !important; } @media (min-width: 992px){ .nav-link:hover { font-size: unset; transform: scale(1.2); text-shadow: none; } /* .nav-link:after { content: ""!important; position: relative !important; width: 0% !important; height: 2px !important; display: block !important; transition: all 0.3s ease !important; bottom: 25% !important; } .nav-link:hover::after { width: 100% !important; height: 2px !important; background-color: #1c853e !important; } .active::after { color: #1c853e !important; content: ""!important; display: block !important; transition: all 0.3s ease !important; bottom: 25% !important; position: relative !important; transform: scale(1.2); width: 100% !important; height: 2px !important; background-color: #1c853e !important; } */ } button.btn-success { margin-right: 1.5rem; font-size: 1rem; } /* =========================== Section1 styling ========================= */ /* .s1_header_text { padding-top: 5rem; } */ div.introducing { font-family: Rochester; font-style: normal; font-weight: normal; font-size: 24px; line-height: 20px; color: #28be41; } /* @media (min-width: 768px) { .s1_header_text{ margin-top: -10vh!important; } } */ .txn_txt { margin: 2rem 0rem; } .d_txt { font-size: .8rem; } /* .s1_header_img { background: url(./img_assets/Vector.png); background-position: center; background-size: 100%; background-repeat: no-repeat; min-height: 100vh; display: grid; grid-template-rows: repeat(3, auto); } .hero_img { grid-row: 2 / 3; max-height: 80vh; } */ @media (min-width: 576px) { .s1_header_img { background: url(./img_assets/Vector.png); background-position: center; background-size: 100%; background-repeat: no-repeat; min-height: 500px; } .hero_img { margin-top: 10%; } } /* // Medium devices (tablets, 768px and up) @media (min-width: 768px) { ... } // Large devices (desktops, 992px and up) @media (min-width: 992px) { ... } // X-Large devices (large desktops, 1200px and up) @media (min-width: 1200px) { ... } // XX-Large devices (larger desktops, 1400px and up) @media (min-width: 1400px) { ... } */ .s1_header_img { background: url(./img_assets/Vector.png); background-position: center; background-size: 100%; background-repeat: no-repeat; /* min-height: 100vh; */ } #softwareInformer{ position: fixed; bottom: 5%; right: 5%; z-index: 1; } #fight-for-ukraine{ position: fixed; bottom: 5%; left: 5%; z-index: 1; } /* =========================== Section 2 ========================= */ /* .s2_why_use_tXn{ margin-top: -2rem; margin-bottom: 4rem; } */ /* .s2_why_use_tXn_txt{ } */ .card_icon { width: 5rem; } .card_body { padding-left: 0px; } .btn-success-50{ background-color: rgb(76, 172, 127); color: white; } .btn-success-50:hover{ background-color: rgb(76, 172, 127, .8); color: white; } /* =========================== Section 3 ========================= */ .carousel-indicators [data-bs-target] { width: 1rem; height: 1rem; background-color: #1c853e !important; color: #1c853e; border-radius: 50%; } .carousel_caption { top: 15%; bottom: unset; } .review_link { color: #000000; text-decoration: none; } .review_link:hover { color: #1c853e; text-decoration: none; } button.mx-auto { display: block; } /* =========================== Section 4 ========================= */ .price_col{ max-width: 500px; /* margin: auto; */ margin-left: auto; margin-right: auto; } .card_price { border: none !important; background-color: #F9F9F9; } /* =========================== Section 5 ========================= */ .p_card { background-color: #F9F9F9; } .p_card_icon { width: 5rem; padding: .3rem; margin-top: 2rem; background-color: #ECECEC; border-radius: 50%; } .p_card_body { padding-left: 0px; } .f_link:hover { color: #E5E5E5; font-weight: bold; } /* about page team section */ .p_card_img { width: 10rem; padding: .3rem; margin-top: 2rem; background-color: #ECECEC; border-radius: 50%; } .s5_link{ text-decoration: none; color: #1c853e; } .s5_link:hover{ text-decoration: underline; color: #28be41; } /* =============================== Support Styling ====================== */ /* ====== Accordion Styling ======== */ .accordion { max-width: 1000px !important; margin: auto; } .accordion-button { background: #E5E5E5 !important; margin: .5rem 0px; color: #000000; border: none !important; } .accordion-button:not(.collapsed) { color: #000000; border: none !important; } .accordion-button::after { flex-shrink: 0; width: 1.25rem; height: 1.25rem; margin-left: auto; content: ""; background-image: url(./img_assets/expand.png); background-repeat: no-repeat; background-size: 1.25rem; transition: transform .2s ease-in-out; } .accordion-button:not(.collapsed)::after { background-image: url(./img_assets/collapse.png); transform: rotate(-180deg); } /* ======================== Contact Styling =============== */ #s1_contact_header { min-height: 70vh; background-image: url(./img_assets/contact_header.png); background-position: center; background-repeat: none; background-size: cover; } /* ====================== product page general banner styling ================ */ .product_page_banner { min-height: 60vh; } /* ========================== Animations ======================= */ .bit-32{ font-size: 1.2rem; text-decoration: none; color: purple; }