_child_theme.scss 7.72 KB
.raleway-regular{
    font-family: "Raleway", sans-serif;
    font-family: "PT Sans", sans-serif;
 
  }


h1{
    font-family: "Raleway", sans-serif;
    font-size: 2.5rem;
    line-height: 2.9rem;
    color: #007299;
    font-weight: bold;
    margin-bottom: 20px;
    @media screen and (max-width: 768px) {
        font-size: 2rem;
        line-height: 2.31rem;
    }
}

h2{
    font-family: "Raleway", sans-serif;
    font-size: 2rem;
    line-height: 2.31rem;
    color: #007299;
    font-weight: 500;
    margin-bottom: 26px;
    @media screen and (max-width: 768px) {
        font-size: 1.75rem;
        line-height: 2.06rem;
    }
}

h3{
    font-family: "Raleway", sans-serif;
    font-size: 1.75rem;
    line-height: 2.06rem;
    color: #007299;
    font-weight: 300;
    margin-bottom: 29px;
    @media screen and (max-width: 768px) {
        font-size: 1.5rem;
        line-height: 1.81rem;
    }
}

h4{
    font-family: "Raleway", sans-serif;
    font-size: 1.5rem;
    line-height: 1.81rem;
    color: #007299;
    font-weight: 300;
    margin-bottom:34px;
    @media screen and (max-width: 768px) {
        font-size: 1.25rem;
        line-height: 1.5rem;
    }
}

h5{
    font-family: "Raleway", sans-serif;
    font-size: 1.25rem;
    line-height: 1.5rem;
    color: #007299;
    font-weight: 300;
    margin-bottom: 37px;
    @media screen and (max-width: 768px) {
        font-size: 1.13rem;
        line-height: 1.31rem;
    }
}

h6{
    font-family: "Raleway", sans-serif;
    font-size: 1.13rem;
    line-height: 1.31rem;
    color: #007299;
    font-weight: 300;
    margin-bottom: 34px;
    @media screen and (max-width: 768px) {
        font-size: 1rem;
        line-height: 1.19rem;
    }
}

p{
    font-family: "PT Sans", sans-serif;
    font-size: 1.13rem;
    line-height: 1.5rem;
    color: #63656B;
    font-weight: 300;
}
strong{
    font-family: "PT Sans", sans-serif;
    font-size: 1.13rem;
    line-height: 1.5rem;
    color: #63656B;
    font-weight: 700;
}



a[target="_blank"]::after {
    font-family: "FontAwesome";
    content: "\f08e";
    display: inline-block;
    padding-left: 5px;
    vertical-align: middle;
    font-weight: 900;
  }
 



ul:not(.navbar-nav):not(.menu){
    font-family: "PT Sans", sans-serif;
    font-size: 1.13rem;
    line-height: 1.5rem;
    color: #63656B;
    font-weight: 300;
    list-style-type: disc;
    padding-left: 20px;
        li{
            margin-bottom: 24px;
            ul{
                padding-left: 32px;
            }
        }
    }


    ol{
        font-family: "PT Sans", sans-serif;
        font-size: 1.13rem;
        line-height: 1.5rem;
        color: #63656B;
        font-weight: 300;
        list-style-type: decimal;
        padding-left: 20px;
            li{
                margin-bottom: 24px;
                ol{
                    margin-top: 24px;
                    padding-left: 32px;
                }
            }
        }

        .wp-block-button__link{
            color: #fff;
            background-color: #007299;
            font-family: "PT Sans", sans-serif;
            font-size: 1.25rem;
            padding:12px  30px ;
            @media screen and (max-width: 600px) {
                padding:  12px 20px;
            }

        }

        .wp-block-button__link:hover{
            color: #231F20;
            background-color: #FF9119;
            font-family: "PT Sans", sans-serif;
            font-size: 1.25rem;
        }

        .join-callout{

            .wp-block-button__link{
                color: #fff;
                background-color: #007299;
                font-family: "PT Sans", sans-serif;
                font-size: 1.25rem;
                padding:12px  30px ;
                @media screen and (max-width: 600px) {
                        padding:  12px 20px;
                    }

                }
            
            .wp-block-button__link:hover{
                color: #231F20;
                background-color: #FF9119;
                font-family: "PT Sans", sans-serif;
                font-size: 1.25rem;
            }
         }



.home-page{
    min-height: 900px;
    .container{
        width: 100%;
    }
}

#no-title-page-wrapper,
#page-wrapper{
    padding-top: 103px;
}


.partner-with-us{
    background-image:url("/wp-content/themes/understrap-child/images/green-background.png");
    width: 120%;
    margin: -130px -10% 0 -10%;
    padding: 130px 7% 130px 20%;
    background-position: top left;
    background-size: cover;
    background-repeat: no-repeat;
    @media screen and (max-width: 900px) {
        flex-direction: column-reverse;
        width: 120%;
        margin: -130px -10% 0 -10%;
        padding: 40px 9% 130px 20%;
        background-position: 0px 50px;
        background-size: 120vw;
        background-repeat: no-repeat;
    }
    .wp-block-column:first-of-type{
        p{
            max-width: 550px;
            @media screen and (max-width: 900px) {
                max-width: 80Vw;
            }
        }
    }
    h1{
        color: #231F20;
        @media screen and (max-width: 900px) {
            color: #007299;
        }
    }
    @media screen and (max-width: 900px) {
        .wp-block-image img{
            max-width: 70%;
            float: right;
        }

    }
}

 .half-width{
        max-width: 550px;
        @media screen and (max-width: 900px) {
            max-width: 80Vw;
        }
    }




.join-callout{
    background-color: #a3d55f;
    margin: 0px -25% 0px -25%;
    padding: 0px 25%;
    @media screen and (max-width: 900px) {
        margin: 0px -20% 0px -20%;
        padding: 0px 20%;
    }
   @media screen and (max-width: 600px) {
        margin: 0px -30px 0px -30px;
        padding: 0px 30px;
    }
   
    .wp-block-group__inner-container {
        margin-top: -120px;
        @media screen and (max-width: 900px) {
            margin-top: -75px;
        }
        @media screen and (max-width: 600px) {
            margin-top:-40px;
        }
        
        .wp-block-column{
            display: flex;
            flex-direction: column;
        }
        .wp-block-image {
            margin-bottom: 0px;
            img{
                margin-bottom: 0px;
                position: relative;
                z-index: 2;
            }
        }
    }
}

.join-callout::before{
    position: relative;
    z-index: 1;
    top: -120px;
    content: "";
    display: block;
    width: 150%;
    height: 120px;
    margin: 0 -25%;
    background-position: top left;
    background-size: cover;
    background-repeat: no-repeat;
    background-image: url('data:image/svg+xml,<%3Fxml version="1.0" encoding="UTF-8"%3F><svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1369.39 118.32"><defs><style> .cls-1 { fill: %23a3d55f; stroke-width: 0px; } </style></defs><path id="Subtraction_3" data-name="Subtraction 3" class="cls-1" d="M1369.39,118.28L0,118.32C0,57.99,0,60.48,0,59.76l1.78-1.57c9.81-7.27,20.38-13.46,31.52-18.46,12.26-5.54,24.88-10.24,37.78-14.05,23.89-7.2,51.85-13.01,83.11-17.27C193.3,3.23,232.69.53,272.13.35c1.34,0,2.55,0,3.61.02h.06c9.46-.24,19.03-.36,28.43-.36,14.1,0,28.39.28,42.48.82,13.43.52,27.11,1.3,40.67,2.32,25.04,1.88,50.2,4.59,76.92,8.27,50.22,6.92,97.44,16.16,143.1,25.1h0l1.67.33h0c45.52,8.91,92.59,18.12,141.28,24.89,26.2,3.65,50.81,6.32,75.22,8.18,27.39,2.09,53.84,3.1,80.87,3.1,21.49,0,43.44-.67,65.24-2,82.01-5,158.29-7.53,226.7-7.53,26.88,0,52.6.4,76.43,1.18,19.07.62,36.99,1.5,53.25,2.59,27.46,1.85,40.14,3.6,40.69,3.68l.61,47.35Z"/></svg>');
    @media screen and (max-width: 900px) {
        margin: 0px -20% 0px -20%;
        padding: 0px 20%;
        width: 140%;
        top: -75px;
        height: 75px;
    }
    @media screen and (max-width: 600px) {
        top: -50px;
        height: 50px;
        width: calc(100% + 60px);
        margin: 0 -30px !important;
    }
  
}