/* Namari Landing Page Dynamic Style Index 1. Website Default Styling 2. Navigation 3. Primary and Secondary Colors 4. Banner 5. Typography 6. Buttons 7. Footer /*------------------------------------------------------------------------------------------*/ /* 1. Website Default Styling */ /*------------------------------------------------------------------------------------------*/ @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;700&display=swap'); /* Default Link Color */ a, .la-ball-triangle-path { color: #FF8B4A; } a:hover, #header.nav-solid nav a:hover { color: #FF8B4A; } /* Default Icon Color */ .icon i { color: #FF8B4A; } /* Border Color */ #banner .section-heading:before, .testimonial.classic footer:before { background: #FF8B4A; } .pricing-block-content:hover { border-color: #FF8B4A; } /*------------------------------------------------------------------------------------------*/ /* 2. Navigation */ /*------------------------------------------------------------------------------------------*/ /* Transparent Navigation Color on a Banner */ #header nav a, #header i { color: #111; font-size: 16px; font-weight: 500; } /* Navigation Colors when the Navigation is sticky and solid */ #header.nav-solid, #header.nav-solid a, #header.nav-solid i, #nav-mobile ul li a { color: #333; } /* Navigation Active State */ #header.nav-solid .active { color: #FF8B4A; border-color: #FF8B4A; } /*------------------------------------------------------------------------------------------*/ /* 3. Primary and Secondary Colors */ /*------------------------------------------------------------------------------------------*/ /* Primary Background and Text Colors */ .primary-color, .featured .pricing { background-color: #FF8B4A; } .primary-color, .primary-color .section-title, .primary-color .section-subtitle, .featured .pricing, .featured .pricing p { color: #fff; } .text-center .section-heading h2:after { margin: 30px auto 25px auto; } /* Primary Icon Colors */ .primary-color .icon i, .primary-color i { color: #fff; } /* Secondary Background and Text Colors */ .secondary-color { background-color: #f5f5f5; } /*------------------------------------------------------------------------------------------*/ /* 4. Banner */ #banner { background-color: #f5f5f500; } /*------------------------------------------------------------------------------------------*/ /* Banner Background and Text Colors */ /*------------------------------------------------------------------------------------------*/ /* 5. Typography */ /*------------------------------------------------------------------------------------------*/ body { font-family: 'Poppins', sans-serif, Arial, Helvetica; font-size: 15px; font-weight: normal; color: #111; } /* Logo, if you are using Fonts as Logo and not image #logo h1 { font-family:; font-size:; font-weight:; color:; } #logo h2 { font-family:; font-size:; font-weight:; color:; } */ /* Banner Typography */ #banner h1 { font-family: 'Poppins', sans-serif, Arial, Helvetica; font-size: 60px; line-height: 60px; font-weight: 700; color: #111; } #banner h2 { font-family: 'Poppins', sans-serif, Arial, Helvetica; font-size: 17px; font-weight: 200; color: #111; padding-top: 0%; } /* Section Title and Subtitle */ .section-title { font-family: 'Poppins', sans-serif, Arial, Helvetica; font-size: 34px; font-weight: 700; color: #111; } .section-subtitle { font-family: 'Poppins', sans-serif, Arial, Helvetica; font-size: 16px; font-weight: 300; color: #9c9c9c; } /* Testimonial */ .testimonial q { font-family: 'Poppins', sans-serif, Arial, Helvetica; font-size: 17px; font-weight: 300; } .testimonial.classic q, .testimonial.classic footer { color: #111; } /* Standard Headings h1-h6 */ h1 { font-family: 'Poppins', sans-serif, Arial, Helvetica; font-size: 40px; font-weight: 300; color: #111; } h2 { font-family: 'Poppins', sans-serif, Arial, Helvetica; font-size: 34px; font-weight: 300; color: #111; } h3 { font-family: 'Poppins', sans-serif, Arial, Helvetica; font-size: 30px; font-weight: 700; color: #111; } h4 { font-family: 'Poppins', sans-serif, Arial, Helvetica; font-size: 18px; font-weight: 400; color: #111; } h5 { font-family: 'Poppins', sans-serif, Arial, Helvetica; font-size: 16px; font-weight: 400; color: #111; } h6 { font-family: 'Poppins', sans-serif, Arial, Helvetica; font-size: 14px; font-weight: 400; color: #111; } /*------------------------------------------------------------------------------------------*/ /* 6. Buttons */ /*------------------------------------------------------------------------------------------*/ /* ----------Default Buttons---------- */ /* Button Text */ .button, input[type="submit"] { font-family: 'Poppins', sans-serif, Arial, Helvetica; font-size: 14px; font-weight: bold; color: #111; } /* Button Color */ .button, input[type="submit"] { border-color: #111; } /* Button Hover Color */ .button:hover, input[type="submit"]:hover { border-color: #FF8B4A; color: #FF8B4A; } /* ----------Banner Buttons---------- */ /* Button Text */ #banner .button { font-family: 'Poppins', sans-serif, Arial, Helvetica; font-size: 16px; color: #111; } /* Button Color */ #banner .button { border-color: #111; } /* Button Hover Color */ #banner .button:hover { color: #FF8B4A; border-color: #FF8B4A; } /*------------------------------------------------------------------------------------------*/ /* 7. Footer */ /*------------------------------------------------------------------------------------------*/ #landing-footer, #landing-footer p, #landing-footer a { font-family: 'Poppins', sans-serif, Arial, Helvetica; font-size: 12px; font-weight: normal; color: #999; } /* Footer Icon Color */ #landing-footer i { color: #999; }