@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');

$primary: green;
$secondary: #73B2B7;

h1,
h2,
h3,
h4 {
    font-family: roboto;
}
.active a{
    color: #73B2B7
}

p {
    font-family: roboto;
}

button {
    font-size: 35px;
}

.logo {
    font-size: 32px;
    font-weight: bold
}

header {
   /* display: flex;
    justify-content: center;
    align-items: center;*/



}

.navbar-nav {
    margin: 0 auto;
}

li.nav-item {
    padding: 0 15px;

    a.nav-link {
        color: $primary;
    }
}
li.nav-item:first-child {
    padding-left: 0;
}

#hero-section img {
    width: 1140px;
    height: 550px;
    background-position: center;
    background-repeat: no-repeat;
}

.hero-img {
    display: flex;
    justify-content: center;
}

.hero-content {
    text-align: center;
    padding-top: 80px;
    color: $primary;
    padding-bottom: 30px;

}

.py-6{
    padding: 80px 0;
}
.feature-section {
    padding: 80px 0;
}

.feature-left-col {
    display: flex;
    justify-content: center;
    align-items: center;
}

.feature-image {
    display: flex;
    justify-content: end;
    width: 552px;
    height: 673px;
}

.feature-image {
    display: flex;
    justify-content: end;
}

.feature-content h1 {
    font-size: 60px;
}

.feature-content p {
    font-size: 28px;
}

/*blog-section*/

.blog-section {}

.blog-top {
    display: grid;
    text-align: center;
}

.blog-top p {}

/*blog-navigation*/

.blog-navigation {}

.blog-navigation ul {
    display: flex;
    justify-content: left;
    list-style: none;
    margin: 0;
}

.blog-navigation ul li {
    padding: 0px 30px;
}
.blog-navigation ul li:first-child {
    padding-left: 0;
}

.blog-navigation ul li a {
    color: #6C6C6C;
    text-decoration: none
}


.blog-content {
    padding: 0px 30px;
}



.blog-meta {
    display: flex;
    padding: 20px 0;
}

img.meta-img {
    width: 350px;
    margin-bottom: 20px;
}

.meta-img img {
    width: 68.63px;
    height: 56.49px;
    border-radius: 50%;
}

.blog-meta,
.meta-content {}

.meta-content {
    padding: 5px 5px;
}

.author {
    display: block
}

.blog-meta span {}

.newsletter-section {
    padding: 179px 0px;
}

.newsletter-content {
    display: flex;
    justify-content: center;
    align-items: center;

}

.newsletter-content h1 {
    font-weight: bold;
    font-size: 64px
}

.newsletter-content p {
    font-size: 32px;
}

.newsletter-content button {
    border-radius: 0;
    font-size: 35px;
}

.newsletter-img {
    display: flex;
    justify-content: end
}

.newsletter-img img {
    height: 500px;
    width: 400px;
}

/*premium-content-section*/

.premium-content-section {
    padding-bottom: 180px;
}

.premium-content-article {}

.premium-content-article h1 {
    font-size: 64px;
    font-weight: bold;
}

.premium-content-article p {
    font-size: 28px;
}

.premium-content-article button {
    font-size: 25px;
}

.learn-more-btn {
    box-shadow: 0px 1px 3px grey;
}

.btn-outline {
    border: 1px solid grey
}

.premium-content-img {
    display: flex;
    justify-content: end;
}

.premium-img {
    display: flex;
    justify-content: end;
    flex-direction: column;
    align-items: center;
}

.premium-content-img img {
    width: 633px;
    height: 482px;
}

/*Footer*/

#footer {}

#footer .logo {}

#footer hr {
    color: black;
    height: 2px;
}

#footer ul {
    display: flex;
    margin-bottom: 0;
    justify-content: space-around
}

#footer ul li {
    list-style: none;
    text-decoration: none;
    padding: 0px 16px;
}

#footer ul li a {
    color: #000;
    font-weight: 300;
    text-decoration: none;
    font-size: 25px;
}

/*Social Icons*/

.social-icons-btn {
    display: flex;
    justify-content: flex-end
}

.icons {
    width: 40px;
    height: 40px;
    font-size: 1.5rem;
    font-weight: 500;
    text-decoration: none;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    color: #000;
    cursor: pointer;
    transition:
        all 0.15s ease;
}

.twitter:hover {
    background: #00ECEE;
}

.facebook:hover {
    background: #4267B2;
}

.instagram:hover {
    background-image:
        linear-gradient(#8a3ab9,
            #e95950,
            #bc2a8d,
            #fccc63);
}

.linkedin:hover {
    background: #0A66C2;
}

.footer-bottom {}

.footer-bottom .copyright {
    font-weight: 300;
    font-size: 25px;
    text-align: right;
}

/*Blog Page*/
.blog-navigation li.nav-item.active{
    border: 1px solid #000;
    padding: 0px 20px;
    border-radius: 10px;
}

.content-wrap {
    display: grid;
    justify-content: center;
}
.content-wrap img.meta-img{
    width:450px;
}

/*Pagination*/
.pagination{}
.pagination .page-item{}
.pagination .page-item.active{
    background: #73B2B7;
    border: none;
}
.pagination .page-item.active .page-link {
    color: white;
    background: #73B2B7;
}
.pagination .page-item a{
    width: 80px;
    text-align: center;
    color: black
}
.pagination .page-item.active a {
    color: white;
    border: none;
}
.page-item:last-child .page-link {
    width: 150px;
}
.pagination .page-item span, .page-link{
    font-size: 30px;
}