body { background-color: #fff; font-family: "poppins", sans-serif; } * { margin: 0; padding: 0; box-sizing: border-box; } img { width: 100%; height: auto; display: block; } .container2 { background-color: #000; padding: 2vw; } .header_desktop { display: none; } .header_mobile { display: block; } .logo img { width: 100%; } .nav img { width: 16%; } .nav-bar { display: flex; justify-content: space-evenly; position: relative; padding: 1vw 3vw; background-color: #fff; font-family: "Poppins", sans-serif; font-weight: 400; font-style: normal; } /* .logo img {width: 40px;} */ .menu { display: flex; align-items: center; } .menu li a { display: inline-block; text-decoration: none; text-align: center; transition: 0.15s ease-in-out; position: relative; font-size: 1.5vw; } .menu li a::after { content: ""; position: absolute; bottom: 0; left: 0; width: 0; height: 2px; background-color: #dc1c25; transition: 0.3s ease-in-out; } .menu li a:hover:after { width: 100%; } .open-menu, .close-menu { position: absolute; color: #790416; cursor: pointer; font-size: 1.5rem; display: none; } .open-menu { top: 50%; right: 20px; transform: translateY(-50%); } .close-menu { top: 20px; right: 20px; color: #000; } #check { display: none; } .close { font-size: 5vw; line-height: 1; } ul { list-style: none; } .applynow { font-size: 3vw; text-align: center; padding: 3vw; display: block; color: #fff; background-color: #000; } .contactbtn { background-color: #790417; border-radius: 3vw; color: #fff; padding: 0 1vw; } .contactbtn a { color: #fff; } .heading-text { margin-bottom: 2vw; color: #000000; font-size: 3vw; text-align: center; } .heading-text span { font-size: 3vw; font-weight: 600; } .loginform { height: auto; position: relative; margin: auto; } form { width: 85%; background-color: #f2f2f2; padding: 4vw; margin: auto; margin-bottom: 4%; border-radius: 10px; } .form-group { margin-bottom: 1.5vw; } .form-control { display: block; width: 100%; padding: 2vw; font-size: 3vw; -webkit-transition: 0.5s; transition: 0.5s; outline: none; color: #000; background-color: #ffffff; border: 1px solid rgba(0, 0, 0, 0.25); border-radius: 2px; } .btn { background-color: #d12023; padding: 2vw; font-size: 3vw; border: none; color: #fff; display: block; margin: auto; width: 40%; font-weight: bold; border: 0; border-radius: 5px; color: #fff; cursor: pointer; font-weight: 600; letter-spacing: 0.065em; padding: 0.65em 1.4em; text-transform: uppercase; transition: background 0.3s, color 0.3s, transform 0.3s; } select.form-control:not([size]):not([multiple]) { height: auto; } .error-tab { width: 100%; text-align: center; color: #fff; display: none; font-size: 2vw; background-color: #ff6600; } ::placeholder { color: #000; } a { text-decoration: none; color: #000; } .call { width: 25%; font-size: 3vw; margin-top: 2%; position: absolute; right: 9%; } .call img { width: 18%; } .call a { color: #29166f; } .phone { font-size: 3vw; padding: 3vw; text-align: center; } .icons { display: flex; align-items: center; } .float-container { position: fixed; top: 40%; right: 0; z-index: 1; } .float-container a { z-index: 99; display: flex; width: 40px; height: 40px; transition: all 0.3s ease-in-out; -webkit-box-align: center; align-items: center; -webkit-box-pack: start; justify-content: flex-start; margin-bottom: 10px; } input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; } input[type="number"] { -moz-appearance: textfield; } .card-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); max-width: 1000px; margin: auto; padding: 2vw 6vw; padding-bottom: 0; gap: 15px; margin-bottom: 2%; text-align: center; } .card-list .card-item { padding: 0; border-radius: 0; text-align: center; } .card-list .card-item img { width: 20%; aspect-ratio: 7 / 7; object-fit: contain; margin: auto; } .card-list span { display: inline-block; padding: 0 1vw; font-size: 12px; padding-bottom: 20px; text-align: center; } .card-item h3 { color: #000; font-size: 14px; padding: 10px; font-weight: 400; } .heading { font-size: 4vw; text-align: center; color: #000; padding: 4vw; font-weight: 600; } .aboutus img { width: 100%; margin: auto; } .aboutus ul { display: flex; flex-direction: column; align-items: center; font-size: 3vw; /* padding: 2vw 4vw; */ } .aboutus p, .aboutus h2 { padding: 0 8vw; text-align: justify; } .knowmore{ display: flex; flex-direction: column; gap: 3vw; } .knowmore img{ width: 70%; margin: auto; } @media (max-width: 670px) { .nav-links li a { font-size: 2vw; padding: 0vw; margin-top: 4vw; transition: all 0.3s ease; } .logo img { width: 80%; } } @media (max-width: 710px) { .menu { flex-direction: column; align-items: center; width: 40%; height: 100%; position: fixed; top: 0; right: -100%; z-index: 100; background-color: #fff; box-shadow: -10px 0 10px rgba(0, 0, 0, 0.1); transition: all 0.5s ease-in-out; } .menu li { margin-top: 20px; } .menu li a { font-size: 3vw; color: #000; } .open-menu, .close-menu { display: block; } #check:checked ~ .menu { right: 0; } .contactbtn { background-color: transparent; padding: 0; } } @media (min-width: 900px) { .container2 { background-color: transparent; padding: 0; } .header_desktop { display: block; } .header_mobile { display: none; } .applynow { display: none; } .heading-text { font-size: 1.2vw; margin-bottom: 1vw; } .heading-text span { font-size: 1.2vw; } .btn { padding: 1vw; font-size: 1.2vw; } .error-tab { font-size: 0.6vw; } .form-control, .btn { padding: 0.6vw; font-size: 1vw; } /* #header { margin: auto; width: 70%; } */ .heading { font-size: 2vw; padding: 2vw; } .card-list span { display: inline-block; padding: 0 1vw; font-size: 14px; padding-bottom: 1vw; text-align: center; } .phone { font-size: 1.5vw; padding: 2vw;} .card-item h3 { color: #000; font-size: 20px; padding: 10px; } .card-list .card-item img { width: 40%; } form { width: 25%; float: right; background-color: #f2f2f2; padding: 1.5vw; margin-top: -40%; margin-right: 7%; } .form-group { margin-bottom: 0.5vw; } .float-container a { width: 60px; height: 30px; padding: 40px 0; } .btechbtn, .summitglobal { width: 80%; margin: auto; } .call { font-size: 1.5vw; right: 8%; width: 10%; margin-top: 1%; } /* .phone p, .mail p { font-size: 1.2vw; } */ #address img { width: 4%; } .aboutus { padding: 0; } .aboutus img { width: 100%; margin: auto; } .aboutus { display: flex; align-items: center; flex-direction: row; font-size: 1.2vw; line-height: 1.7; } .aboutus div { width: 100%; } .aboutus p, .aboutus h2 { padding: 0vw 3vw 0vw 0vw; } .menu li a { font-size: 1.2vw; } .knowmore{ display: flex; flex-direction: row; gap: 3vw; padding: 1vw 7vw; } .knowmore img{ width: 100%; margin: auto; } }