/* Farm Tech System */ *{ margin: 0; padding: 0; box-sizing: border-box; } .body{ width: 100%; padding: 50px; background-image: url('tea-estate.jpg'); } body { background-image: url('tea-estate.jpg'); font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; font-weight: bolder; font-size: x-large; height: 100vh; color: #123C69; } header { color: white; padding: 8px ; text-align: center; } .logo { font-family: 'Poppins'; font-size: 24px; text-align: center; } .navbar { margin-top: 20px; } .nav-links { list-style: none; padding: 0; display: flex; justify-content: center; } .nav-links li { margin: 0 15px; } .nav-links a { color:#AC3B61 ; font-weight: bolder; font-size: larger; text-decoration: none; } h2 { font-size: 24px; margin-bottom: 10px; } p { line-height: 1.6; } .nav-links li:hover a { background: rgb(255, 255, 255); color: black; padding: .25rem .5rem; transition: all ease-in 300ms; border-radius: 25px; } .animate-charcter { text-align: right; display: flex; align-items: center; justify-content: center; background-image: linear-gradient( -225deg, #231557 0%, #44107a 29%, #ff1361 67%, #fff800 100% ); background-size: auto auto; background-clip: border-box; background-size: 200% auto; color: #AC3B61; background-clip: text; text-justify: transparent; -webkit-background-clip: text; -webkit-text-fill-color: transparent; animation: textclip 2s linear infinite; display: inline-block ; font-size: 80px; font-family: Georgia, 'Times New Roman', Times, serif; font-weight: bold; } @keyframes textclip { to { background-position: center; } }; *{ background-color: #eee2dc; margin-bottom: 20px; padding: 0; box-sizing: border-box; } body{ align-items: center; justify-content: center; } @keyframes scroll{ 0%{ transform: translateX(0); } 100%{ transform: translateX(calc(-250px * 7)); } } .slider{ height: 200px; margin: auto; overflow: hidden; position: relative; width: auto; padding: 0 30px; } /* .slider::before, .slider::after { content: ''; width: calc(50vw - 125px); /* Adjust the width for the desired padding */ *{ margin: 0; padding: 0; box-sizing: border-box; font-family: Verdana, Geneva, Tahoma, sans-serif; } .container{ display: flex; /* flex-direction: column; */ justify-content: center; align-items: center; text-align: center; font-weight: bolder; margin: 20px 20px 0 20px; padding-top: 10%; } .container .heading{ width: 50%; padding-bottom: 50px; } .container .heading h3{ font-size: 3em; font-weight: bolder; padding-bottom: 10px; border-bottom: 3px solid #222; } .container .heading h3 span{ font-weight: 50; } .container .box{ display: flex; flex-direction: row; justify-content: space-between; } .container .box .dream{ display: flex; flex-direction: column; width: 32.5%; } .container .box .dream img{ width: 100%; padding-bottom: 15px; } /* @media only screen and (max-width: 769px){ .container .box{ flex-direction: column; } } .container .box .dream{ width: 100%; } */ /* Default styles for all devices */ .body { font-size: 16px; } /* Tablet styles */ @media (max-width: 1024px) { body { font-size: 14px; } } /* Mobile styles */ @media (max-width: 768px) { body { font-size: 12px; } } /* Adjust the footer for mobile and tablet views */ @media only screen and (max-width: 768px) { .footer { width: 125%; flex-direction: column; align-items: center; } .contact { text-align: left; text-indent: 0; margin: 10px 0; font-size: x-small; } .contact h2{ text-align: left; text-indent: 0; margin: 10px 0; font-size: x-small; } .iframe { width: 100%; padding: 10px; } .contact p:first-child{ text-align: left; text-indent: 0; margin: 10px 0; font-size: x-small; } .contact p:last-child{ text-align: left; text-indent: 0; margin: 10px 0; font-size: x-small; } .developer { text-align: right; text-indent: 0; margin: 10px 0; font-size: x-small; } .footer { width: 100vw !important; } }