Skip to content
Snippets Groups Projects
Commit b728ba00 authored by Phoi Luong's avatar Phoi Luong
Browse files

Upload New File

parent a33cf93f
No related branches found
No related tags found
No related merge requests found
style.css 0 → 100644
body {
font-family: "Raleway", sans-serif;
background-color: yellow;
}
.layout_padding {
padding: 75px 0;
}
.layout_padding2 {
padding: 45px 0;
}
.layout_padding2-top {
padding-top: 45px;
}
.layout_padding-top {
padding-top: 75px;
}
.layout_padding-bottom {
padding-bottom: 75px;
}
.call_to-btn {
display: inline-block;
padding: 15px 45px;
border-radius: 10px;
font-size: 15px;
background-color: #ffffff;
color: #262627;
font-weight: 600;
transition: all 0.3s ease 0s;
}
.call_to-btn img {
width: 18px;
margin-left: 10px;
}
.btn_on-hover {
transition: all 0.3s ease 0s;
}
.call_to-btn:hover,
.btn_on-hover:hover {
-webkit-box-shadow: 0px 5px 10px -5px rgba(0, 0, 0, 0.7);
-moz-box-shadow: 0px 5px 10px -5px rgba(0, 0, 0, 0.7);
box-shadow: 0px 5px 10px -5px rgba(0, 0, 0, 0.7);
transform: translateY(-7px);
}
.main-heading {
color: #082465;
font-weight: bold;
text-align: center;
}
/*header section*/
.header_section {
padding-top: 10px;
font-family: "Poppins", sans-serif;
}
nav.navbar.navbar-expand-lg {
padding: 10px 0;
}
.custom_nav-container.navbar-expand-lg .navbar-nav .nav-link {
padding: 20px 20px;
color: black;
text-align: center;
border-color: blue;
}
h3 {
font-family: "Poppins", sans-serif;
font-size: 30px;
font-weight: 600;
color: #082465;
}
a,
a:hover,
a:focus {
text-decoration: none;
}
a:hover,
a:focus {
color: initial;
}
.btn,
.btn:focus {
outline: none !important;
box-shadow: none;
}
.top_container {
position: relative;
}
.top_container::before {
content: "";
position: absolute;
width: 100%;
height: 100%;
background: url(../images/hero-bg.png);
background-size: 100% 100%;
background-position: right bottom;
background-repeat: no-repeat;
z-index: -1;
}
.sub_page .top_container::before {
background-color: #fdd31d;
background-image: none;
}
.sub_page .top_container::after {
display: none;
}
.navbar-brand img {
width: 25px;
margin-right: 7px;
}
.custom_nav-container .nav_search-btn {
background-image: url(../images/search-icon.png);
background-size: 22px;
background-repeat: no-repeat;
background-position-y: 7px;
width: 35px;
height: 35px;
padding: 0;
border: none;
}
.navbar-brand {
display: flex;
align-items: center;
}
.navbar-brand span {
font-size: 22px;
font-weight: 700;
color: black;
}
.custom_nav-container {
z-index: 99999;
padding: 15px 0;
}
.custom_nav-container .navbar-toggler {
outline: none;
}
.custom_nav-container .navbar-toggler .navbar-toggler-icon {
background-image: url(../images/menu.png);
background-size: 40px;
}
/* about section */
.about_section {
text-align: right;
}
.about_section a {
background-color: #6ebca8;
color: #fefeff;
}
/* end about section */
/* admission section */
.admission_section a {
background-color: #fdd31d;
color: #fefeff;
}
/* end admission section */
/* why section */
.why_section {
text-align: right;
}
.why_section a {
background-color: #6ebca8;
color: #fefeff;
}
/* end why section */
/* determine section */
.determine_section a {
background-color: #fdd31d;
color: #fefeff;
}
/* end determine section */
/* client section */
.client_section h2,
.client_section h5,
.client_section p {
font-weight: 600;
}
.client_section h2 {
text-align: center;
}
.client_section h5 {
font-size: 24px;
color: #fdd31d;
}
.client_section .row {
align-items: center;
padding: 75px 0;
margin: 0 15px;
}
.client_section img {
width: 100%;
}
.client_img-box::before,
.client_img-box::after {
content: "";
position: absolute;
width: 100px;
height: 30px;
border-radius: 20px;
background-color: #fdd31d;
}
.client_img-box::before {
top: -15px;
transform: rotate(139deg);
left: -15px;
animation: beforeanimate 1s;
animation-delay: 0.1s;
}
.client_img-box::after {
bottom: -15px;
transform: rotate(142deg);
right: -15px;
animation: afteranimate 1s;
animation-delay: 0.1s;
}
@keyframes beforeanimate {
0% {
top: 43%;
transform: rotate(142deg);
left: 31%;
}
100% {
top: -15px;
transform: rotate(139deg);
left: -15px;
}
}
@keyframes afteranimate {
0% {
bottom: 46%;
transform: rotate(142deg);
right: 35%;
}
100% {
bottom: -15px;
transform: rotate(142deg);
right: -15px;
}
}
.client_section .carousel-indicators {
margin: 0;
justify-content: flex-end;
padding-right: 15px;
bottom: 20px;
}
.client_section .carousel-indicators li {
width: 25px;
height: 25px;
background-color: #6bd1bd;
border-radius: 100%;
opacity: 1;
}
.client_section .carousel-indicators li.active {
background-color: #fdd31d;
}
/* end client section */
/* contact section */
.contact_section {
padding: 75px 45px;
font-family: "Poppins", sans-serif;
}
.contact_section .row {
align-items: center;
}
.contact_section input {
border: none;
outline: none;
border-bottom: 1px solid #000;
width: 90%;
margin: 15px 0;
}
.contact_form-container button {
border: none;
background-color: #6bd1bd;
color: #fff;
font-size: 15px;
padding: 15px 45px;
border-radius: 30px;
text-transform: uppercase;
font-weight: bold;
}
.contact_img-box {
display: flex;
align-items: center;
}
.contact_img-box img {
width: 100%;
}
.contact_section h2 {
font-size: 26px;
color: #010103;
font-weight: 600;
font-family: "Raleway", sans-serif;
margin-bottom: 35px;
}
/* end contact section */
/*category animations */
.image-container {
position: relative;
width: 58%;
height: fit-content;
}
.image-container img {
width: 58%;
height: 80%;
}
#nextButton {
display: block;
margin: 0 auto; /* Center the 'Next' button */
}
/* Additional styles to center pronunciation options and iframe */
#greetingsPronunciation {
text-align: center; /* Center the pronunciation options */
}
#signLangIframe {
display: block;
margin: 0 auto; /* Center the iframe */
}
.main-heading {
font-size: 34px; /* Adjust the font size as needed */
}
.call_to-btn {
font-size: 18px; /* Adjust the font size as needed */
}
#signLangIframe {
display: block;
margin: 10px auto 0; /* Move the iframe down by 10px and center horizontally */
}
#game {
display: flex;
justify-content: space-between;
}
#cards,
#answers {
flex-basis: 45%;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.card,
.answer {
background-color: #f7f7f7;
border: 1px solid #ddd;
padding: 10px;
margin: 10px;
width: calc(50% - 20px);
text-align: center;
}
.card:hover,
.answer:hover {
background-color: #eee;
cursor: pointer;
}
#message {
margin-top: 20px;
padding: 10px;
background-color: #f0f0f0;
border: 1px solid #ccc;
text-align: center;
}
.container {
position: relative;
width: 100%;
}
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment