
:root {
  --montserrat: "Montserrat", sans-serif;
  --Azo-sans: "azo-sans-web", sans-serif;
  --poppings: 'Poppins', sans-serif;;
}

.main-site-container {
max-width: 1920px;
margin: 0 auto;
}


*, *::before, *::after  {box-sizing: inherit;}

img {
width: 100%;
}

.get-access-fix-01 {
width: 100px;
}

a {
text-decoration: none;
color: #FFFFFF;
}

html,body, ul, li, h1, h2, h3 {
box-sizing: border-box;
padding: 0px;
margin: 0px;
}

header {
height: 86px;
background-color: black;
}

.get-free-w-fix {
    width: 458px;
    margin-left: 100px;
}


.header-container {
display: flex;
justify-content: space-between;
align-items: center;
max-width: 1900px;
padding: 0px 100px 0px 100px;
}


.main-nav .nav-links a:hover {
color: #FF4801 !important ;
}

.main-nav {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
list-style-type: none;
width: 800px;
max-width: 1100px;
font-family: var(--Azo-sans);
font-weight: bold;
font-size: 14px;
color: #FFFFFF;
}


.cyber150-logo {
width: 210px;

}
.it-havest-logo {
width: 294px;
}


.first-section {
background-image: url('https://cyber150.com/dashboard/images/Group3850@2x.png');
background-size: cover;
background-repeat: no-repeat;
background-position: center;
display: flex;
flex-direction: column;
justify-content: space-between;

}

.bottom-content {
display: flex;
justify-content: right;
}
.bottom-content-second {
display: flex;
flex-direction: column;
}


.richard-frame {
display: flex;
width: 800;
padding: 20px 10px 30px 10px;
}

.richard-pic-container {
width: 223px;
}

.richard-text {
max-width: 476px;
text-align: left;
font: normal normal normal 14px/18px Montserrat;
letter-spacing: 0px;
color: #FFFFFF;
opacity: 1;
align-content: center;
}

.top-content {
display: flex;
flex-direction: column;
flex-wrap: wrap;
gap: 30px;
max-width: 1680px !important;
padding-top:50px;
padding-left: 100px;
}


.top-content h1 {
font: normal normal bold 66px/81px Montserrat;
color: #FFFFFF;
width: 1013px;
max-width: 1013px;
}

.get-free-acess-btn {
background: #FF4801 0% 0% no-repeat padding-box;
width: 348px;
height: 41px;
border-radius: 5px;
font: normal normal bold 16px/20px var(--Azo-sans);
color: #FFFFFF;
align-content: center;
text-align: center;
}

.about-container {
padding-top: 50px;
}

.about-text {
font: normal normal bold 50px/55px Montserrat;
letter-spacing: 0.1px;
color: #FFFFFF;
opacity: 1;
}

.it-text {
font: normal normal 600 21px/25px Montserrat;
letter-spacing: 0px;
color: #F54F04;
}


.book-pic {
width: 122px;

}

.book-frame {
display: flex;
align-items: center;


}

.book-text p {
background-color: #FFFFFF;
color: black;
font-family: var(--montserrat);
font: normal normal normal 14px/18px Montserrat;
max-width: 1000px;
align-content: center;
padding: 20px 50px 20px 20px;

}

.whats-is-the-dashboard {
position: relative

}



.title-wtd {
position: absolute;
text-align: left;
font: normal normal bold 50px/55px Montserrat;
letter-spacing: 0.1px;
color: #000000;
opacity: 1;
top: 100px;
left: 100px;
}
.bold-text {
font: normal normal bold 14px/18px Montserrat;
letter-spacing: 0px;
color: #000000;
}



.content-container {
position: relative;
display: flex;
justify-content: center;
align-items: flex-end;
height: 500px;
}
.img-left {
position: absolute;
left: 50px;
top: 220px;
width:40%;
}
.img-right {
position: absolute;
z-index: -1;
width: 25%;
right:200px;
}

.text-content-one {
padding-bottom: 50px;
max-width: 372px;
padding-top: 50px;
}
.text-content {

max-width: 550px;
padding-top: 50px;
}


.section-footer {
height: 85px;
border-bottom: 5px solid #FF4801;
background-color: black;
align-content: center;
}

.whats-is-the-dashboard-second {
margin-top: 200px;
}


.title-section-second {
margin: 0 auto;
max-width: fit-content;
}


.title-section-second p:nth-last-of-type(2) {
text-align: left;
font: normal normal bold 50px/55px Montserrat;
letter-spacing: 0.1px;
color: #000000;
opacity: 1;
max-width: 1696px;
}
.title-section-second p:nth-last-of-type(1) {
text-align: left;
font: normal normal 600 21px/25px Montserrat;
letter-spacing: 0px;
color: #F54F04;
opacity: 1;
max-width: 1640px;

}

.title-section-second-text {
padding-top: 100px;
}



.title-section-second-bottom {
display: flex;
max-width: 1696px;
margin: 0 auto;
padding-top: 50px;
}

.title-section-second-text p:nth-child(1) {
text-align: left;
font: normal normal 600 21px/25px Montserrat;
letter-spacing: 0px;
color: #000000;
max-width: 267px;
}
.title-section-second-text p:nth-child(2) {
text-align: left;
font: normal normal normal 14px/18px Montserrat;
letter-spacing: 0px;
color: #000000;
opacity: 1;
max-width: 267px;
}

.whats-is-the-dashboard-tree {
margin-top: 100px;
}


.titles {
margin: 0 auto;
max-width: 1696px;
}

.whats-is-the-dashboard-tree p:nth-child(1) {
text-align: left;
font: normal normal bold 50px/55px Montserrat;
letter-spacing: 0.1px;
color: #FF4801;
opacity: 1;
}
.whats-is-the-dashboard-tree p:nth-child(2){
text-align: left;
font: normal normal bold 50px/55px Montserrat;
letter-spacing: 0.1px;
color: #000000;
opacity: 1;
}

.ul-section {
display: flex;
justify-content: center;
}

.ul-list-section {
position: relative;
display: inherit;
flex-direction: column;
z-index: 100;
list-style-type: disc;
padding-left: 40px;
}

 .ul-list-section li::marker {
      color: #FF4801; /* Change the bullet color */
    
    }
 .ul-list-section li {
     text-align: left;
font: normal normal 600 21px/25px Montserrat;
letter-spacing: 0px;
color: #000000;
opacity: 1;
    }

.image-section {
position: relative;
width: 60%;
}

#ul-title {
text-align: left;
font: normal normal 600 21px/25px Montserrat;
letter-spacing: 0px;
color: #000000;
opacity: 1;
}

.ul-container {
align-content: center;
}

.section-four-title-one {
font: normal normal bold 50px/55px Montserrat;
letter-spacing: 0.1px;
color: #FF4801;
opacity: 1;
padding-bottom: 10px;
padding-top: 100px;
}
.section-four-title-two {
text-align: left;
font: normal normal bold 50px/55px Montserrat;
letter-spacing: 0.1px;
opacity: 1;
}

.orange {
color: #FF4801;

}

.image-container {
max-width: 100%;
margin: 0 auto;
padding-top: 50px;
}

.image-subs-continer {
display: flex;
justify-content: space-between;
max-width: 80%;
margin: 0 auto;
}
.image-and-sub-container  .image-container{
width: 80%;
}

.image-and-sub-container {
max-width: 1320px;
margin: 0 auto;
}

.sub-1 {
text-align: center;
width: 300px;
text-align: center;
font: normal normal 600 21px/25px Montserrat;
letter-spacing: 0px;
color: #000000;
opacity: 1;
padding-top: 10px;
}

.text-and-image-container {
justify-content: space-between;
display: flex;
max-width: 1520px;
margin: 0 auto;

}


    .text-content h2 {
     text-align: left;
font: normal normal 600 21px/25px Montserrat;
letter-spacing: 0px;
color: #000000;
opacity: 1;
padding-bottom: 20px;
padding-top: 20px;
margin-left: -50px;
    }

    .text-content ul {
      list-style-type: none;
      padding-left: 20px;
    }

    .text-content ul li {
      margin-bottom: 15px;
      position: relative;
text-align: left;
font: normal normal normal 14px/18px Montserrat;
letter-spacing: 0px;
color: #000000;
opacity: 1;
    }

    .text-content ul li::before {
      content: '●';
      color: #FF4801;
      position: absolute;
      left: -20px;
      top: 0;
    }

    /* Nested list styles */
    .text-content ul ul {
      margin-top: 5px;
    }

    .text-content ul ul li::before {
      content: '●';
      color: #FF4801;
      left: -20px;
    }

    .text-content p {
      margin: 0;
    }

.image-container-bottom-div {
position: relative;
width: 55%;
top: 150px;
right: -100px;
}

.title p {
font: normal normal bold 50px/55px Montserrat;
letter-spacing: 0.1px;
color: #000000;
opacity: 1;
margin-bottom: 50px;
max-width: 1696px;
margin: 0 auto;
}


 .text-content-footer-div {
      align-content: center;
      font-family: Arial, sans-serif;
    }

    .text-content-footer-div h2 {
      font-size: 1.5em;
      margin-bottom: 10px;
      text-align: left;
font: normal normal 600 21px/25px Montserrat;
letter-spacing: 0px;
color: #000000;
opacity: 1;
      margin-left: -50px;
    }

    .text-content-footer-div ul {
      list-style-type: none; /* Remove default bullet points */
      padding-left: 20px; /* Indent the list */
    }

    .text-content-footer-div ul li {
      margin-bottom: 10px;
      position: relative;
      padding-left: 20px; 
       font: normal normal normal 14px/18px Montserrat;
letter-spacing: 0px;
color: #000000;
opacity: 1;
  /* Add space for custom bullet */
    }

    /* Custom bullet points using ::before */
    .text-content-footer-div ul li::before {
      content: '●'; /* Unicode bullet symbol */
      color: #FF4801;
      position: absolute;
      left: 0; /* Position bullet on the left */
      top: 0;
      font-size: 1.2em; /* Slightly larger bullet */
    }
.text-content-footer-div-image {
width:45%;
position: relative;
right: -170px;
top: 150px;
}

.text-content-footer-div-container {
display: flex;
max-height: 1520px;
margin: 0 auto;
justify-content: center;
}



.page-footer {
    background-color: #F4F6F8;
    margin-top: 100px;
}

.footer-top-content {
    display: flex;
    gap: 100px;
    max-width: 1340px;
    margin: 0 auto;
    justify-content: space-between;
    padding: 20px 0px 20px 0px;
}

.footer-top-content {
    display: flex;
    gap: 100px;
    max-width: 1340px;
    margin: 0 auto;
    justify-content: space-between;
    padding: 20px 0px 20px 0px;
}
.social-bar {
    display: flex;
    font-size: 30px;
    max-width: 1340px;
    margin: 0 auto;
    gap: 10px;
    padding-bottom: 50px;
    justify-content: space-between;
}

.ul-footer-links {
    display: flex;
    flex-wrap: wrap;
    gap: 50px;
    list-style-type: none;
    justify-content: center;
    align-items: center;
}

.footer-links {
    text-align: left;
    font: normal normal bold 17px/20px azo-sans-web;
    letter-spacing: 0px;
    color: #000000;
    cursor: pointer;
    
}

.footer-top-content h4 {
    font-size: 40px;
    font-weight: 300;
}

.social-bar i {
    color: black !important;

}

.copyright {
    text-align: center;
    margin-left: auto;
    font-weight: 200;
    font-family: montserrat;
    font-size: 15px;
    width: fit-content;
   margin: 0px;
    
}

.copyright-span {
    font-weight: bold;
    max-width: fit-content;
    
}
.h-fix {
align-content: center;
}

.footer-to-top {
    background-color: #424141;
    color: white;
    text-align: center;
    font-family: montserrat;
    height: 40px;
    line-height: 40px;
    font-weight: 600;
    text-decoration: none;
    cursor: pointer;
    padding-top: 10px;
}

.back-to-top-text {
margin: 0px !important;
}

.logos-section {
display: flex;
flex-direction: column;
justify-content: center;
}

.logos-section .title-container-last-section {
display: flex;
justify-content: center;
}

.logos-section p {
font: normal normal bold 50px/55px Montserrat;
letter-spacing: 0.1px;
color: #000000;
opacity: 1;
padding: 100px 0px 50px 0px;
width: 1700px;
max-width: 1728px;
place-self: center;
}
.logos-section img {
width: 90%;
place-self: center
;
}