.bg-banner{
    background-color: #EBF5FF;
}

.btn-color{
    background-color: #0049C6;
}

.btn-color:hover{
    background-color: #0049C6;
}

.bg-footer{
    background-color: #E5EEFB;
}

.text-gray{
    color: #7C88A0;
}

.shadow-sky{
    box-shadow: 0 1rem 3rem rgb(242,245,255) !important;
}

.bg-sky-light{
    background-color: rgb(251,252,255);
}

.text-main-color{
    color: #0049C6;
}

.bn-section-3{
    background-image: url("/images/pic1.jpg");
    background-position: center;
    background-size: cover;
    filter:saturate(0.75);
}
.bn-1{
    background-image: url("/images/bn-1.jpg");
    background-size: cover;
    background-position: 200px 0px;
    width: 100%;
    height: 100%;
}

.bn-1-size{
    width: 100%;
    height: 700px;
    position: relative;
}
.bg-main-color{
    background-color: #0049C6;
}

.text-green-color{
    color: #219653;
}

.bg-green-color{
    background-color: #219653;
}

.bg-sky-color{
    background-color: #458FFF;
}

.bg-blue-color{
    background-color: #023D93;
}

.text-header{
    font-size: 65px;
}

.text-sub-header{
    font-size: 22px;
}

.text-sub-header2{
    font-size: 35px;
}

.bg-sky-dark{
    background-color: rgb(248,250,254);
}

.bn-1-size::before{
    content: '';
    position: absolute;
    width: 100%;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background:linear-gradient(90deg,#FFF 30%,rgba(20,20,255,0) 65%);
}

.cover-text{
    padding-left: 12%;
}

@media only screen and (min-width: 300px) and (max-width: 500px) {
    .bn-1-size{
        width: 100%;
        height: 330px;
    }

    .bn-1{
        background-position: center;
    }

    .text-header{
        font-size: 25px;
    }

    .text-sub-header{
        font-size: 15px;
    }

    .text-sub-header2{
        font-size: 15px;
    }
  }


@media only screen and (min-width: 305px)and (max-width: 600px) {
    .bn-1-size{
        width: 100%;
        height: 380px;
    }
    .bn-1{
        background-position: center;
    }

    .text-header{
        font-size: 25px;
    }

    .text-sub-header{
        font-size: 15px;
    }

    .text-sub-header2{
        font-size: 15px;
    }

    .bn-1-size::before{
        background:linear-gradient(90deg,#FFF 40%,rgba(20,20,255,0) 100%);
    }

  }


@media only screen and (min-width:601) and (max-width: 768px) {
    .bn-1-size{
        width: 100%;
        height: 480px;
    }

    .bn-1{
        background-position: center;
    }

    .text-header{
        font-size: 20px;
    }

    .text-sub-header{
        font-size: 15px;
    }

    .text-sub-header2{
        font-size: 15px;
    }
  }