body {
    font-family: Arial, sans-serif;
}
html{
	scroll-behavior: smooth;
}


.hero-section {
    background-image: url('/img/image.png');
    /*padding: 50px 0;*/
    /* background-position:top; */
    padding-bottom: 46px;
    min-height: 960px;
    background-repeat: no-repeat;
    background-position: top center;
    background-size: cover;
}

.hero-section h1 {
    border-radius: 10px;
    display: inline-block;
    color: rgb(21, 21, 21);
    font-size: 31px;
    font-weight: 700;
    position: relative;
    top: 4px;

}

.hero-section .card {
    margin: 10px 0;
    background: #3e65a67a;
    border: 1px solid #fff;
    height: 100%;
}
.hero-section .card-body{
    padding: 0px 10px;
    display: flex;
    align-items: center;
}

.hero-section p {
    /* background: rgba(0, 0, 0, 0.5); */
    padding: 0px;
    border-radius: 10px;
    display: inline-block;
    color: white;
    margin-bottom: 0;
    font-size:1.65rem;
}

.container-header {
    display: flex;   
    align-items: center;
    gap:8rem;
}
.logo {
    width: 100px; /* Set the desired width */
    height: auto; /* Maintain aspect ratio */
}
.nav {
    display: flex;
    gap: 3rem; /* Adjust the gap between menu items as needed */
}
.nav-link {
    color: rgb(21, 21, 21);
    text-decoration: none;
    font-weight:700;
    font-size:1.75rem;
    cursor:pointer;
}
.nav-link:hover {
    text-decoration: underline;
}

.home-text{
    background: #3e65a687;
    margin-top: 72px;
    padding: 16px 13px;
}
.home-text p{
    font-size: 20px;
    font-weight: 700;
}
.mt-top{
    margin-top:50rem;
}
.navbar-toggler {
    display: none; /* Hide the toggle button by default */
    background: none;
    border: none;
    color: rgb(21, 21, 21);
    font-size: 24px;
    cursor: pointer;
}
.mt-27{
	margin-top:27px;
}
.contact-title h3{
	margin-top:20px;
	margin-bottom:20px;
}
.contact-form-section{
	background: #3e65a687;
    padding: 20px 20px;
}
.opti-protect-title{
	color:rgb(21, 21, 21);
	font-weight:700;
}
.opti-protect-title h4{
	color:rgb(21, 21, 21);
	font-weight:700;
	font-size:2rem;
}
.opti-protect-title h5{
	color:rgb(21, 21, 21);
	font-weight:700;
	font-size: 1.75rem;
}
.opti-protect-title p{
	color:rgb(21, 21, 21);
	    font-weight: 600;
    font-size: 1.45rem;
}
.m-0 {
	margin: 0
}
.btn:hover{
	color:#fff;
}
.mt-25{
	margin-top:25px;
}
.blue-box{
	background: #e5e5e5;
	/*background:rgb(148, 111, 68);*/
    text-align: center;
    color: #fff;
       padding: 18px 10px;
    margin-bottom: 15px;
    cursor:pointer;
    border-radius: 3px;
}
.blue-box a{
	color:#fff;
	text-decoration:none;
}
.blue-box h5{
	font-weight:600;
	font-size:1.85rem;
}
.protection-plan-bg{
	background-image:url("/img/young-woman-broken-lens.jpg");
	background-repeat:no-repeat;
	background-size:cover;
	background-position:center;
	position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.readers-plan{
	background-image:url("/img/dog-reader.jpg");
	background-repeat:no-repeat;
	background-size:cover;
	background-position:center;
	position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.protection-plan-container{
	display:flex;
	justify-content:space-between;
	
}
.protection-content{
	/*background: #3e65a6d9;*/
	background:#6287cd;
    width: 100%;
    height: 100%;
    color: #fff;
    padding: 60px;
}
.protection-content h3{
	font-size:1.45rem;
	 font-weight: 600;
    text-align: center;
}
.protection-content h5{
	    font-size: 1.45rem;
	    font-weight: 600;
    text-align: center;
}
.coverage{
	font-size:1.35rem;
	line-height: 36px;
}
.coverage ul{
	margin-bottom:0;
	padding-left: 21px;
}
.coverage p:first-child{
	text-decoration:underline;
}

.button-blue{
	   /* background: rgb(148, 111, 68);*/
	   background: #e5e5e5;
    color: #fff;
    margin-bottom: 20px;
    font-size: 1.85rem;
    padding: 10px 10px;
    width: 100%;
    font-weight:600;
}
.buttons-group{
	    position: absolute;
    bottom: 157px;
    right: 90px;
    
}

.sunglass-plan-bg{
	background-image:url("/img/Manbrokensunglasses.jpg");
	background-repeat:no-repeat;
	background-size:cover;
	background-position:center;
	position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.sunglass-content{
	background: #6287cd;
    width: 100%;
    height: 100%;
    color: #fff;
    padding: 40px;

}
.sunglass-content h3{
	font-size:1.45rem;
	 font-weight: 600;
    text-align: center;
}
.sunglass-content h5{
	    font-size: 1.45rem;
	    font-weight: 600;
    text-align: center;
}

.smartglass-plan-bg{
	background-image:url("/img/Smartglasses.jpg");
	background-repeat:no-repeat;
	background-size:cover;
	background-position:center center;
	position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.smart-glass-content{
	font-size: 1.35rem;
        position: absolute;
        bottom: 0;
        font-weight: 600;
        right: 0;
        width: 100%;
        /* align-items: center; */
        /* display: flex; */
        left: 0;
        margin: 0 auto;
        padding: 25px;
}
.footer{
	    /*margin-top: 110px;*/
    background: #f7f7fa;

        padding: 25px 0px;
}
.footer-white-box{
	background: #fff;
    padding: 20px;
    text-align: center;
        margin-bottom: 17px;
}
.footer-white-box h5{
	font-size: 24px;
    color: rgb(148, 111, 68);
    font-weight: 600;
    margin-bottom:0;
}
.footer-find-store{
	background: #fff;
    padding: 20px;
    text-align: center;
    margin-bottom: 17px;
}
.footer-find-store h5{
	color: rgb(148, 111, 68);;
	font-size:24px;
	font-weight: 600;
	margin-bottom:0;
	
}
.social-icons{
	float:right;
}
.social-icons h4{
	font-size:1.55rem;
}
.social-icon-list{
	display:flex;
	justify-content:space-between;
}
.social-icon-list div{
	background: #022a6b;
    color: #fff;
    width: 45px;
    height: 45px;
    border-radius: 50%;
    text-align: center;
    padding: 4px 7px;
    margin: 0px 5px;
}
.social-icon-list i{
	font-size:1.75rem;
	color:#fff;
}


.container-how-it-work h1{
   font-size:1rem
}
.container-how-it-work h2{
   font-size:1rem
}
.how-work-img{
	width:500px;
	margin:0 auto;
	
}
.how-work-img img{
	width:100%;
	
}

.section-space {
	margin: 30px 0;
}
.send-message-btn{
    background: rgb(148, 111, 68);
    color:#fff;
}
.terms-logo-content{
	display:flex;
	gap:35px;
}
.terms-logo-content h4{
	color: #0070c0;
    font-weight: 600;
    font-size: 1.25rem;
}
.terms-logo-content p{
	color: #000;
	 font-weight: 600;
}
.terms-logo-content p:last-child{
	color: #0070c0;
	 font-weight: 600;
}
.terms-logo{
	width:110px;	
}
.term-title{
	color: #0070c0;
    font-weight: 600;
    font-size: 1rem;
}
.mb-20{
	margin-bottom:20px;
}
.p-25{
	padding:25px;
}
.footer-find-store i{
	color: #f57e1a;
    padding-left: 4px;
}

.respo-btn{
	margin-bottom:0;
}
.restrictions{
	/*background: #5b7cb3;*/
	background: #e5e5e5;
    color: #fff;
    padding: 15px;
    font-size: 1.35rem;
    text-align:center;
}

.image-section{
	height: 100%;
    position: relative;
    width: 100%;
    padding-top: 56.25%;
}
.col-spacing{
	padding-right:0;	
}
.col-spacing-left{
	padding-left:0;
}
.section-top{
		margin-top:110px;
}

.coverage-table {
    width: 100%;
    border-collapse: collapse;
    margin: 20px 0;
}
.coverage-table thead {
    background-color: #004c70;
    color: #ffffff;
}
.coverage-table th, .coverage-table td {
    border: 1px solid #dddddd;
    text-align: center;
    padding: 8px;
}
.coverage-table th {
    background-color: #004c70;
    color: white;
    
}
.coverage-table td {
    background-color: #f9f9f9;
   
}
.coverage-table tr:nth-child(even) {
    background-color: #f2f2f2;
}

.coverage-table th:first-child, .coverage-table td:first-child {
   width: 33%;
    text-align: left;
}
.notes {
    font-size: 0.9em;
    margin-top: 10px;
}

.check-mark {
    font-size: 18px;
}
.check-mark.prescription {
    color: #ff0000;
}
.check-mark.readers {
    color: #00ff00;
}
.check-mark.sun {
    color: #0000ff;
}
.check-mark.smart {
    color: #ffa500;
}
       

@media (min-width: 1600px){
	.container{
		max-width:1600px;
	}	
	
}
@media (max-width:1620px){
	
	.nav{
		gap:1rem;
	}
	.nav-link{
		font-size:1.45rem;
	}
	.container-header{
		gap:2rem;
	}
	.hero-section p{
		font-size:1.15rem;
	}
	.mt-top {
    	margin-top: 31rem;
	}
	.hero-section{
		min-height:841px;
	}
	.hero-section h1{
		font-size:22px;
	}
	.section-top {
	    margin-top: 75px;
	}
	.protection-content{
		padding:22px;
	}
	.protection-content h3{
		font-size:1.25rem;
	}
	.protection-content h5{
		font-size:1.15rem;
	}
	.coverage {
    	font-size: 1.15rem;
	}
	.opti-protect-title h4{
		font-size:1.55rem;
	}
	.opti-protect-title h5{
		font-size:1.35rem;
	}
	.opti-protect-title p{
		font-size:1.15rem;
	}
	.blue-box h5{
		font-size:1.1rem;
	}
	.button-blue{
		font-size:1.1rem;
	}
	.restrictions{
		font-size:1.1rem;
	}
	.smart-glass-content p{
		font-size:1.10rem;
	}
	.footer-white-box h5{
		font-size: 19px;
	}
	.footer-find-store h5{
		font-size: 19px;
	}
	.sunglass-content{
		padding:22px;
	}
	.sunglass-content h3{
		font-size:1.25rem;
	}
	.sunglass-content h5{
		font-size:1.15rem;
	}
	.footer{
		/*margin-top: 75px;*/
	}
	.coverage{
		line-height:27px;
	}
}

@media (max-width:1481px){
	.nav {
    	display: flex;
    	gap: 1.85rem;
	}
	.nav-link{
		font-size:1.2rem;
	}
	
}
@media (max-width:1441px){
	
	.container-header {
    	gap:8rem;
	}
	.hero-section p{
		font-size:1.05rem;
	}
	.opti-protect-title h4{
		font-size:1.45rem;
	}
	.opti-protect-title h5{
		font-size:1.35rem;
	}
	.opti-protect-title p{
		font-size:1rem;
	}
	.blue-box h5{
	font-size:1.25rem;
	}
	.protection-content h3{
		font-size: 1.15rem;
	}
	.protection-content h5{
		font-size: 1rem;
	}
	.coverage p:first-child{
		font-size: 0.85rem;
	}
	.coverage li {
    font-size: 1rem;
	}
	.restrictions {
    font-size: 1rem;
	}
	.button-blue{
		font-size:1.25rem;
	}
	.sunglass-content h3 {
    font-size: 1.15rem;
	}
	.sunglass-content h5{
		font-size: 1rem;
	}
	.smart-glass-content p{
		   font-size: 13px;
		   
	}
	.footer-white-box h5{
		font-size:16px;
	}
	.footer-find-store h5{
		font-size:16px;
	}
	
	.protection-content{
		padding:20px;
	}
	.hero-section h1{
		font-size:20px;
	}
	
	.social-icon-list i {
    	font-size: 1.55rem;
  	
	}
	.mt-top {
    	margin-top: 30rem;
	}
	.hero-section{
		min-height:813px;
	}
	
}

@media (max-width: 1399px) {
	
	.container-header {
    	gap:8rem;
	}
	.hero-section h1{
		font-size:18px;
		position: relative;
        top: -5px;
	}
	.nav-link {   
   		 font-size:1.1rem;
	}
	.hero-section p{
		font-size:0.85rem;
	}
	.mt-top{
        margin-top:25.5rem;
    }
    .hero-section{
    	min-height:488px;
    }
    .opti-protect-title h4{
		
		font-size:1.3rem;
	}
	.opti-protect-title h5{
		font-size: 1rem;
	}
	.opti-protect-title p{
		font-size:0.85rem;
	}
	.blue-box h5{
		font-weight:600;
		font-size:0.95rem;
	}
	.protection-content h3{
		font-size:1rem;
	}
	.protection-content h5{
		font-size: 1rem;
	}
	.coverage{
		font-size:1rem;
		line-height:27px;
	}
	.button-blue{	  
   		 font-size: 0.95rem;
	}
	.buttons-group {
	    position: absolute;
	    bottom: 0;
	    right: 51px;
	}
	.sunglass-content h3{
		font-size:1rem;
	}
	.sunglass-content h5{
		font-size: 1rem;
	}
	.smart-glass-content {
	   font-size: 13px;
        position: absolute;
        bottom: 0;
        font-weight: 600;
        right: 0;
        width: 100%;
        /* align-items: center; */
        /* display: flex; */
        left: 0;
        margin: 0 auto;
        padding: 15px;
	}
	.smart-glass-content p{
		font-size:12px;
	}
	.footer-white-box h5{
		font-size: 15px;
	    color: rgb(148, 111, 68);
	    font-weight: 600;
	}
	.footer-find-store h5{
		
		font-size:15px;
		font-weight: 600;
	}
	.social-icons h4{
		font-size:1rem;
	}
	.social-icon-list div{
		background: #022a6b;
	    color: #fff;
	    width: 30px;
	    height: 30px;
	    border-radius: 50%;
	    text-align: center;
	    padding: 4px 7px;
	    margin: 0px 5px;
	}
	.social-icon-list i{
		font-size:0.99rem;
		color:#fff;
	}
	.section-space {
	margin: 12px 0;
	}
	    .coverage li {
        font-size: 0.85rem;
    }
    .restrictions {
        font-size: 0.85rem;
    }
    .sunglass-buttons-group{
    	left:51px;
    }
    .section-top{
    	margin-top:65px;
    }
	
	
}



@media (max-width: 1200px) {
	
    .mb-10{
        margin-bottom:10px;
    }
    .container-header{
        justify-content: space-between;
    }
    .nav {
        display: none; /* Hide the nav links on small screens */
        flex-direction: column;
        gap: 3px;
        background-color: #000; /* Optional: background color for the dropdown */
        position: absolute;
        top: 64px; /* Adjust based on header height */
        right: 0px;
        padding: 10px;
        border-radius: 5px;
        z-index: 1;
        width: 68%;
    }

    .navbar-toggler {
        display: block; /* Show the toggle button on small screens */
    }

    .nav.active {
        display: flex; /* Show the nav links when the nav has active class */
    }
    .nav.active a{
        color:#fff;
    }
    .section-space {
	margin: 25px 0;
}
	.section-top{
		margin-top:75px;
	}
	.footer{
		/*margin-top:75px;*/
	}
	 .hero-section h1 {
        font-size: 16px;
             
    }
    .logo {
	    width: 70px;
	    height: auto;
	}
	.coverage{
		line-height:27px;
	}
	
}

@media (max-width:1024px){
	
	.hero-section p{
		font-size:0.85rem;
	}
	.opti-protect-title h4{
		font-size:1.25rem;
	}
	.opti-protect-title h5{
		font-size:1rem;
	}
	.opti-protect-title p{
		font-size:0.90rem;
	}
	.blue-box h5{
		font-size:1rem;
	}
	.protection-content h3{
		font-size: 0.85rem;
	}
	.protection-content h5{
		font-size: 0.75rem;
	}
	.coverage p:first-child{
		font-size: 1rem;
	}
	.coverage li {
   font-size: 0.75rem;
	}
	.restrictions {
    	font-size: 0.95rem;
	}
	.button-blue{
		font-size:1rem;
	}
	.sunglass-content h3 {
    	font-size: 0.85rem;
	}
	.sunglass-content h5{
		font-size: 0.75rem;
	}
	.section-space {
	margin: 20px 0;
	}
	.protection-content {
        padding: 22px;
    }
     .footer-white-box{
    	padding: 15px;
    }
    .footer-find-store{
    	padding: 9px;
    }
    .footer-white-box {
        padding: 9px;
    }
    .footer-white-box h5{
    	font-size: 12px;
   	
    }
    .footer-find-store h5{
    	font-size: 12px;
    }
     .hero-section h1 {
        font-size: 17px;
        position: relative;
        top: -9px;

             
    }
    .logo {
	    width: 70px;
	    height: auto;
	}
    .section-top {
        margin-top: 45px;
    }
    .footer{
    	 /*margin-top: 45px;*/
    }
    .coverage{
    	line-height:23px;
    }
}
@media (max-width:991px){
	.protection-content {
    
    width: 100%;
    color: #fff;
    padding: 12px;
}
    .buttons-group {
        position: relative;
        bottom: -10px;
        right: 0;
        margin-left: 27px;
    }
    .protection-plan-container{
    	display:block;
    }
    .sunglass-content {
   
    width: 100%;
    color: #fff;
    padding:12px;
}
    .sunglass-buttons-group {
        position: absolute;
        bottom: -11px;
        right: 0;
        margin-left: 23px;
        left: 0;
    }
    .sunglass-plan-container{
    	display:block;
    }
    .smart-glass-content p{
		font-size: 11px;
	   
	}
	.hero-section p{
		font-size:0.65rem;
	}
	.hero-section{
		padding-bottom:27px;
	}
	.section-space {
	margin: 12px 0;
}
	.terms-logo-content{
		display:grid;
	}
	.footer-white-box h5{
		font-size:11px;
	}
	.footer-find-store h5{
		font-size:11px;
	}
	.button-blue {
        font-size: 0.85rem;
    }
    .social-icon-list i{
    	font-size:1rem;
    }
    .respo-btn{
	margin-bottom:15px;
	}
	.col-spacing{
		padding-right:0;	
	}
	.col-spacing-left{
		padding-left:0;
	}
	.section-top{
		margin-top:40px;
	}
	.footer{
		/*margin-top:55px;*/
	}
	.coverage p:first-child {
        font-size: 0.75rem;
    }
	.coverage li {
        font-size: 0.65rem;
    }
        .protection-content h3 {
        font-size: 0.95rem;
    }
   	.protection-content h5 {
        font-size: 0.75rem;
    }
     .sunglass-content h3 {
        font-size: 0.95rem;
    }
    .sunglass-content h5 {
        font-size: 0.75rem;
    }
    .restrictions {
        font-size: 0.75rem;
    }
    .footer-white-box{
    	padding: 15px;
    }
    .footer-find-store{
    	padding: 15px;
    }
        .mt-top {
        margin-top: 18.5rem;
    }
        .hero-section h1 {
        font-size: 15px;
    }
    .blue-box h5 {
        font-size: 0.85rem;
    }
        .opti-protect-title h4 {
        font-size: 1.15rem;
    }
        .opti-protect-title h5 {
        font-size: 0.95rem;
    }
        .opti-protect-title p {
        font-size: 0.85rem;
    }
     .hero-section h1 {
        font-size: 12px;
                position: relative;
        top: -15px;
    }
    .logo {
	    width: 50px;
	    height: auto;
	}
	.coverage{
		line-height:20px;
	}
	
}

@media (max-width:768px){
	.protection-content {
    
    width: 100%;
    color: #fff;
    padding: 12px;
}
    .buttons-group {
        position: relative;
        bottom: -10px;
        right: 0;
        margin-left: 27px;
    }
    .protection-plan-container{
    	display:block;
    }
    .sunglass-content {
   
    width: 100%;
    color: #fff;
    padding:12px;
}
    .sunglass-buttons-group {
        position: absolute;
        bottom: -11px;
        right: 0;
        margin-left: 23px;
        left: 0;
    }
    .sunglass-plan-container{
    	display:block;
    }
    .smart-glass-content p{
		font-size: 11px;
	   
	}
	.hero-section p{
		font-size:0.75rem;
	}
	.section-space {
	margin: 12px 0;
}
	.terms-logo-content{
		display:grid;
	}
	.footer-white-box h5{
		font-size:11px;
	}
	.footer-find-store h5{
		font-size:11px;
	}
	.button-blue {
        font-size: 0.85rem;
    }
    .social-icon-list i{
    	font-size:1rem;
    }
    .respo-btn{
	margin-bottom:15px;
	}
	.col-spacing{
		padding-right:0;	
	}
	.col-spacing-left{
		padding-left:0;
	}
	.section-top{
		margin-top:55px;
	}
	.footer{
		/*margin-top:55px;*/
	}
	.coverage p:first-child {
        font-size: 0.75rem;
    }
	.coverage li {
        font-size: 0.65rem;
    }
        .protection-content h3 {
        font-size: 0.85rem;
    }
   	.protection-content h5 {
        font-size: 0.65rem;
    }
     .sunglass-content h3 {
        font-size: 0.85rem;
    }
    .sunglass-content h5 {
        font-size: 0.65rem;
    }
    .restrictions {
        font-size: 0.75rem;
    }
    .footer-white-box{
    	padding: 15px;
    }
    .footer-find-store{
    	padding: 15px;
    }
      .opti-protect-title h5 {
        font-size: 0.85rem;
    }
    .opti-protect-title p {
        font-size: 0.75rem;
    }
     .hero-section h1 {
        font-size: 12px;
                position: relative;
        top: -14px;
    }
    .logo {
	    width: 50px;
	    height: auto;
	}
	.coverage{
		line-height:18px;
	}
	.coverage-table th{
		font-size:13px;
	}
	.coverage-table td{
		font-size:13px;
	}
	
}
@media (max-width: 576px) {
    .protection-content {
        padding: 30px;
    }

    .image-section {
        padding-top: 75%; /* Adjust for a taller aspect ratio if needed */
    }
    .footer-logo{
    	text-align:center;
    }
    .col-spacing{
		padding-right:15px;	
	}
	.col-spacing-left{
		padding-left:15px;
	}
	.opti-protect-title h4 {
        font-size: 1rem;
    }
      .opti-protect-title h5 {
        font-size: 0.85rem;
    }
    .opti-protect-title p {
        font-size: 0.75rem;
    }
     .hero-section h1 {
        font-size: 12px;
    }
    .logo {
	    width: 50px;
	    height: auto;
	}
	.coverage{
		line-height:27px;
	}
	.coverage-table th{
		font-size:13px;
	}
	.coverage-table td{
		font-size:13px;
	}
	
}

@media (max-width:480px){
	.footer-white-box h5{
		font-size:14px;
	}
	.footer-find-store h5{
		font-size:14px;
	}
	.sunglass-buttons-group{
		position:relative;
	}
	.respo-btn{
	margin-bottom:15px;
	}
	.restrictions{
		padding:20px;
	}
	.smart-glass-content p{
		padding:0px;
	}
	.col-spacing{
		padding-right:15px;	
	}
	.col-spacing-left{
		padding-left:15px;
	}
	.coverage p:first-child {
        font-size: 1rem;
    }
	.coverage li {
        font-size: 0.95rem;
    }
        .protection-content h3 {
        font-size:1rem;
    }
   	.protection-content h5 {
        font-size: 0.95rem;
    }
    .sunglass-content h3 {
        font-size: 1rem;
    }
    .sunglass-content h5 {
        font-size: 0.95rem;
    }
    .opti-protect-title h4 {
        font-size: 1rem;
    }
    .opti-protect-title h5 {
        font-size: 0.80rem;
    }
    .opti-protect-title p {
        font-size: 0.70rem;
    }
    .hero-section h1 {
        font-size: 12px;
           position: relative;
        top: -5px;
    }
	.logo {
	    width: 60px;
	    height: auto;
	}
	.coverage{
		line-height:27px;
	}
	.hero-section .card-body{
		    padding: 0px 48px;
	}
	.coverage-table th{
		font-size:13px;
	}
	.coverage-table td{
		font-size:13px;
	}
   
}
@media (max-width:375px){
	.hero-section .card-body{
		    padding: 0px 45px;
	}
}



/*@media (max-width: 430px) {
    .hero-section {
        height: 135vh;
    }
}*/