/*this is border declaration only*/

body {
    border: 5px dashed blue;
}

.hero {
    border: 4px dashed red;
}

.header {
    border: 5px solid black;
}
.header-logo {
    border: 2px dashed blue;
}
.group {
    border: 3px dashed red;
}
li {
    border: 2px solid green;
}
.main {
    border: 5px solid red;
}
.flex-one {
    border: 4px dashed greenyellow;
}
.hero-main-text {
    border: 2px solid green;
}
.box {
    border: 2px dashed lightcoral;
}
.footer {
    border: 2px solid red;
}
.main2 {
    border: 3px dashed black;
}
.information {
    border: 3px solid blue;
}
.subtext {
    border: 5px dashed purple;
}
.subtext-image {
    border: 3px solid blue;
}
.emptyforimg {
    border: 2px dashed green;
}
.quote {
    border: 3px solid red;
}
.quote-one {
    border: 2px dashed black;
}
.quote-author {
    border: 2px solid green;
}
.action {
    border: 5px dashed rebeccapurple;
}
.action-one {
    border: 3px solid black;
}
.call-to-action {
    border: 3px solid green;
}
.button2 {
    border: 3px dashed darkorange;
}
.call {
    border: 2px dashed gray;
}
/*this is the end of border declaration*/



body {
    margin: 0px;
    height: 1400px;
    box-sizing: border-box;
    background: white;
    display: flex;
    flex-direction: column;
    font-family: 'Roboto',Helvetica, sans-serif;
}

.hero,
.footer {
    background-color: #1F2937;
   
}

.header-logo {
    font-size: 24px;
    color: #F9FAF8;
}

li,
.box,
.footer-text {
    font-size: 18px;
    color: #E5E7E8;
}
.text1 {
    font-size: 15px;
    color: #E5E7E8;
}

.hero-main-text {
    font-size: 48px;
    font-weight: bolder;
    color: #F9FAF8;
}

.header {
    display: flex;
    justify-content: space-around;
    align-items:center;
}
.group {
    display: flex;
    width: 450px;
    justify-content: space-between;
    list-style: none; 
    padding: 0px;

}

.main {
    display: flex;
    justify-content: center;
    column-gap: 70px;
    padding-top: 40px;
    padding-bottom: 40px;
}

.flex-one {
   width: 360px; 
}

.box {
    display: flex;
    width: 650px;
    justify-content: center;
    align-items: center;
    background-color: grey;
}

button {
    background-color: #3882F6;
    border-style: none;
    border-radius: 5px;
}

.footer {
    display: flex;
    margin-top: auto;
    height: 70px;
    justify-content: center;
    align-items: center;
}

.main2 {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 400px;
    row-gap: 40px;
}

.information {
    font-size: 36px;
    font-weight: bolder;
    color: #1F2937;
    
}

.subtext {
    display: flex;
    width: 800px;
    justify-content: space-between;
    
}

.subtext-image {
    display: flex;
    flex-direction: column;
    width: 150px;
    row-gap: 10px;
}

.emptyforimg {
    width: 150px;
    height:150px;
    border-radius: 10px;
    border: 5px solid #3882F6;
}

.subtext-text {
    text-align: center;
    color: rgb(58, 56, 56);
}

.quote {
    height: 400px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background-color: #E5E7E8;
    row-gap: 10px;
}

.quote-one {
    width: 650px;
    font-size: 36px;
    font-style: italic;
    color: #1F2937;

}

.quote-author {
    margin-left: 350px;
    font-size: 24px;
    font-weight: bold;
}

.action {
    height: 250px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.action-one {
    background-color: #3882F6;
    width: 900px;
    height: 100px;
    border-radius: 10px;
    display: flex;
    justify-content: space-evenly;
    align-items: center;
}

.button2 {
    border: 2px solid #E5E7E8;
    padding: 3px 20px;
    color: #E5E7E8;
}


.button-one {
    padding: 3px 20px;
    color: #E5E7E8;
    margin-top: 5px;
}

.call-to-action {
    color: #E5E7E8;
    font-size: 24px;
    font-weight: bold;
}
 .product {
    color: #E5E7E8;
    font-size: 18px;

 }