@import url('https://fonts.googleapis.com/css2?family=Jost:ital,wght@0,100..900;1,100..900&family=Pacifico&display=swap');
body{ font-size: 16px; overflow-x: hidden; background: var(--bgm); color: var(--black); font-family: "Jost", serif; letter-spacing: 0px;}
a, a:link, a:visited, a:hover, a:active, button, button:hover, i, i:hover, h6, h6:hover, :hover, img{ text-decoration:none; outline:none; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; }
img{ max-width:100%;} input, textarea, button, input:focus, textarea:focus, button:focus{outline: none;}
a, a:hover, a:focus{color:inherit;}
html { scroll-behavior: smooth;}
header{ padding: 20px 0px;}
.container-fluid{padding: 0px 60px;}
.header-appear {position: fixed; width: 100%; top: 0px; z-index: 15; box-shadow: 0px 0px 20px rgb(0 0 0 / 15%); border: none;}
.navbar-expand-lg .navbar-collapse{display: inline-block !important; text-align: right;}
.navbar-expand-lg .navbar-nav{display: inline-flex !important; padding-top: 20px;}
h2{font-size: 42px; font-weight: 800; margin-bottom: 30px; font-family: "Pacifico", serif; line-height: 48px; color: var(--primary-colour);}
h3{font-size: 30px; font-weight: 700; color: var(--primary-colour);}
h5{font-size: 20px; font-weight: 700; margin-bottom: 20px;}
.ds-none{display: none;}
section{padding: 80px 0px;}
button{width: 100%; max-width: 160px; height: 50px; border: none; background: var(--secondary-colour); color: var(--white); border-radius: 30px;}
button:hover{background: var(--primary-colour);}
.our-products{text-align: center;}
.fixedmenu .navbar-nav{padding-top: 10px;}
.line-1{max-width: 100px; margin-top: 20px; margin-bottom: 30px;}
.product-box{margin-bottom: 30px;}
.product-box h5{margin-bottom: 10px; font-size: 18px;}
.product-box img{margin-bottom: 20px;}
.aboutus ul li{position: relative; padding-left: 30px; padding-bottom: 18px;}
.aboutus ul li::before{content: "\f0a4"; font-weight: 400; font-family: "Font Awesome 6 Free"; color: var(--primary-colour);
left: 0px; position: absolute;}
.aboutus ul{padding-bottom: 20px;}
.aboutus h6{font-size: 16px; font-weight: 700; line-height: 30px; margin-bottom: 25px;}
.contact-box{position: relative; padding-left: 50px; margin-bottom: 30px;}
.contact-box i{width: 35px; height: 35px; line-height: 35px; border-radius: 50%; border: 1px solid var(--primary-colour); color: var(--primary-colour);
text-align: center; position: absolute; left: 0px; top: -6px;}
.social-icons{margin-top: 20px; margin-bottom: 30px;}
.social-icons i{ width: 35px; height: 35px; line-height: 35px; border-radius: 50%; background: var(--primary-colour); color: var(--white) !important;
text-align: center;}
.social-icons i:hover{background: var(--secondary-colour);}
.contact-us h4{font-size: 22px; margin-bottom: 20px;}
.contact-us .form-group label{margin-bottom: 6px;}
.contact-us .form-group input{background: none; border: 1px solid var(--black);}
.contact-us .form-group input:focus, .contact-us .form-group textarea:focus{box-shadow: none;}
.contact-us .form-group textarea{resize: none; background: none; border: 1px solid var(--black);}
footer{background: url(../images/bgm-3.png) var(--white) 100%  top; background-size: cover; text-align: center; padding-bottom: 20px;
padding-top: 250px;}
footer img{max-width: 200px; margin-bottom: 30px;}
.footer-contact i{margin-right: 5px; color: var(--primary-colour);}
.footer-contact p span{margin-left: 20px;}
.footer-contact p{margin-bottom: 10px;}

 :root {
    --primary-colour: #DC0138;
    --white: #ffffff;
    --secondary-colour:#00c1ff;
    --bgm: #FFDDAA;
    --black: #000;

  }