:root{
    --primary:#21552F;
    --secondary:#F4DB84;
    --dark:#313332;
    --black:#18201A;
    --grey:#707070;
    --light-violet:#FFFAEB;
    --light-grey:#EEEDEC;
    --white:#FFFFFF;
    --h1:63px;
    --h2:32px;
    --h3:24px;
    --h4:20px;
    --h5:22px;
    --h6:18px;
    --p:16px;
    --light-orange:#C1AD80;
}
@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Krub:ital,wght@0,200;0,300;0,400;0,500;0,600;0,700;1,200;1,300;1,400;1,500;1,600;1,700&display=swap');

body{
    font-family: "Lato", sans-serif;
}
h3{
    font-family: "Krub", sans-serif;

}
.navbar{
    padding-top:20px;
    padding-bottom: 20px;
}
.navbar-brand img{
    width: 320px;
}

.nav-link{
    font-size: var(--h6);
    color: var(--black);
    font-weight: 500;
    padding-left: 20px !important;
    padding-right: 20px !important;
    border:1px solid var(--white);
}
.nav-item{
    margin-left: 10px;
}
.nav-link:hover{
    background: #FFFAEB 0% 0% no-repeat padding-box;
    border: 1px dashed #707070;
    border-radius: 23px;
}

/** Banner **/
.banner{
    background: url('../assets/looms_and_blooms_banner_image.png');
    background-size: cover;
    padding-top:200px;
    padding-bottom: 200px;
}
.banner h3{
    font-size: var(--h1);
    color: var(--secondary);
    font-weight: 600;
    text-align: center;
}

/** Product categories **/
.product-categories{
    padding-top:80px;
    padding-bottom: 80px;
    position: relative;
    background: url('../assets/looms_bg_patterns.png');
    background-size: 100% 100%;
    
}
.section-title{
    font-size: var(--h2);
    color: var(--primary);
    font-weight: bold;
}
.product-title{
    font-size: var(--h4);
    color: var(--primary);
    font-weight: 600;
    margin-top:30px;
    text-align: center;
}
.philopsy{
    padding-top:80px;
}
.philopsy-image{
    padding-right: 50px;
}
.philopsy-content p{
    font-size: var(--h6);
    color: var(--black);
    margin-top:20px;
}
.philopsy-content{
    margin-top:30px;
}
.self-center{
    align-self: center;
}
.get-in-touch{
    padding-top:80px;
    padding-bottom: 80px;
    background: var(--light-grey) 0% 0% no-repeat padding-box;

}
.form-section{
    background: #FFFFFF 0% 0% no-repeat padding-box;
    padding: 50px;
}
.get-in-touch-form{
    padding-right: 30px;
    border-right: 1px solid var(--grey);
}
.touch-content-paragraph{
    font-size: var(--h6);
    color: var(--black);
    font-weight: 500;
}
.touch-content{
    padding-left: 30px;
}
.form-group{
    margin-top: 30px;
}
.form-group .form-control{
    background: #FFFFFF 0% 0% no-repeat padding-box;
    border: 1px solid #707070;
    padding-top: 12px;
    padding-bottom: 12px;
}


.btn-primary{
    background: #FFFAEB 0% 0% no-repeat padding-box;
border: 1px solid #707070 !important;
    font-size: var(--h6);
    color: var(--black);
    padding-left: 30px;
    padding-right: 30px;
    width: 100%;
    padding-top:15px;
    padding-bottom: 15px;
    margin-top:30px;
    outline: none !important;
    box-shadow: none !important;
}
.contact-info{
    display: -webkit-box;  /* Legacy WebKit syntax */
    display: -ms-flexbox;  /* IE10 */
    display: flex;         /* Standard syntax */
}
.contact-info .contact-icon img{
    width: 21px;
    height: 30px;
}
.contact-info .contact-info-content{
    padding-left: 20px;
    width: 100%;
}
.contact-info .contact-info-content h5{
    font-size: var(--h4);
    color: var(--primary);
    font-weight: 600;
}
.contact-info-content p{
    font-size: var(--h6);
    color: var(--black);
    font-weight: 500;
    margin-top:10px;
    margin-bottom: 0px;
}
.space-top{
    margin-top:30px;
}
.contact-info-content iframe{
    margin-top: 10px;
}
/** Copyright **/
.copyright{
    background: #FFFFFF 0% 0% no-repeat padding-box;
    padding-top:20px;
    padding-bottom: 20px;
}
.copyright p{
    font-size: var(--h6);
    color: var(--dark);
    font-weight: 400;
    margin-bottom: 0px;
}