diff --git a/activites.html b/activites.html index 8d800b1..602d081 100644 --- a/activites.html +++ b/activites.html @@ -5,6 +5,8 @@ Activites + +
diff --git a/css/activites.css b/css/activites.css index caccd94..68b0389 100644 --- a/css/activites.css +++ b/css/activites.css @@ -1,188 +1,4 @@ -@font-face { - font-family: mediamoure; - src: url("/fonts/mediamoure.ttf"); -} -@font-face { - font-family: abhayalibre; - src: url("/fonts/AbhayaLibre.ttf"); -} -@font-face { - font-family: lora; - src: url("/fonts/lora.ttf"); -} -@font-face { - font-family: roboto; - src: url("/fonts/roboto.ttf"); -} -@font-face { - font-family: opensans; - src: url("/fonts/opensans.ttf"); -} - -* { - margin: 0; - padding: 0; - box-sizing: border-box; - -ms-overflow-style: none; - scrollbar-width: none; -} -body { - width: 100%; - overflow-x: hidden; -} -*::-webkit-scrollbar { - display: none; -} -.header { - background-image: none; - background-color: #fff; - color: #000; -} -.headerbody h1 { - font-family: mediamoure; - color: #000; -} - -input#search { - color: #000; - border-radius: 21.5px; - border: 1px solid #000; - font-size: 16px; - background-color: transparent; - background-image: url("/images/assests/searchdark.png"); - background-position: 5px 5px; - background-repeat: no-repeat; - width: 100%; - padding: 6px 20px 6px 40px; -} - -.navbar { - padding: 20px 20px; - display: flex; - justify-content: space-between; - align-items: center; -} -.navleft { - padding-left: 20px; - display: flex; - gap: 20px; - align-items: center; -} - -.navright { - padding-right: 20px; - display: flex; - gap: 50px; - align-items: center; -} - -.navbar a { - color: #000; - text-decoration: none; - font-family: abhayalibre; - font-size: 20px; -} -.splitter { - margin: 20px auto 20px auto; - width: 80%; -} -#menu-container { - position: relative; -} - -#menu-button { - cursor: pointer; - padding: 15px; - color: #fff; - text-align: center; -} - -#dropdown-menu { - display: none; - position: absolute; - top: 60px; - right: 40px; - width: 25%; - background-color: #000; - color: #fff; - font-family: abhayalibre; - z-index: 1; - overflow: hidden; - padding: 30px; - flex-direction: column; - animation: slideIn 0.6s ease-out; - -webkit-box-shadow: 0px 0px 25px -2px rgba(0, 0, 0, 0.75); - -moz-box-shadow: 0px 0px 25px -2px rgba(0, 0, 0, 0.75); - box-shadow: 0px 0px 25px -2px rgba(0, 0, 0, 0.75); -} - -@keyframes slideIn { - from { - height: 0; - } - to { - height: 750px; - } -} -@keyframes slideOut { - from { - height: 750px; - } - to { - height: 0; - } -} - -.menu-item { - padding: 12px; - text-decoration: none; - color: #333; - display: block; - transition: background-color 0.3s; -} -.menu-item a { - color: #fff; - display: flex; - height: 100%; - align-items: center; -} -.dropdownbody h5 { - display: flex; - align-items: center; - font-family: abhayalibre; - font-size: 20px; - margin-bottom: 10px; - color: #e6222b; - vertical-align: middle; -} -.dropdownbody ul { - list-style-type: none; -} -.dropdownbody ul li { - margin-bottom: 10px; - text-align: left; - margin-bottom: 20px; - font-size: 15px; - margin-left: 40px; - margin-right: 20px; -} -.menu-item:hover { - background-color: #f1f1f1; -} -#close-button { - display: flex; - width: 100%; - justify-content: flex-end; - color: #fff; - padding: 10px; - text-align: center; - cursor: pointer; - padding: 20px; -} -#close-button img { - height: 25px; -} .headerbody { display: flex; flex-direction: column; @@ -269,42 +85,7 @@ input#search { .navitems { display: none; } - .headerbody h1 { - width: 80%; - font-size: 40px; - } - .headerbtn { - padding: 20px 40px 20px 40px; - font-size: 20px; - } - .navleft { - gap: 0px; - margin-right: 10px; - } - .navleft img { - margin-right: 10px; - } - #dropdown-menu { - width: 100%; - right: 0; - top: 0; - } - @keyframes slideIn { - from { - height: 0; - } - to { - height: 732px; - } - } - @keyframes slideOut { - from { - height: 732px; - } - to { - height: 0; - } - } + .activities h1 { font-size: 60px; } diff --git a/css/global.css b/css/global.css new file mode 100644 index 0000000..bd1cc1e --- /dev/null +++ b/css/global.css @@ -0,0 +1,226 @@ +@font-face { + font-family: mediamoure; + src: url("/fonts/mediamoure.ttf"); +} +@font-face { + font-family: abhayalibre; + src: url("/fonts/AbhayaLibre.ttf"); +} +@font-face { + font-family: lora; + src: url("/fonts/lora.ttf"); +} +@font-face { + font-family: roboto; + src: url("/fonts/roboto.ttf"); +} +@font-face { + font-family: opensans; + src: url("/fonts/opensans.ttf"); +} + +* { + margin: 0; + padding: 0; + box-sizing: border-box; + -ms-overflow-style: none; + scrollbar-width: none; +} +body { + width: 100%; + overflow-x: hidden; +} +*::-webkit-scrollbar { + display: none; +} +.header { + background-image: none; + background-color: #fff; + color: #000; +} +.headerbody h1 { + font-family: mediamoure; + color: #000; +} + +input#search { + color: #000; + border-radius: 21.5px; + border: 1px solid #000; + font-size: 16px; + background-color: transparent; + background-image: url("/images/assests/searchdark.png"); + background-position: 5px 5px; + background-repeat: no-repeat; + width: 100%; + padding: 6px 20px 6px 40px; +} + +.navbar { + padding: 20px 20px; + display: flex; + justify-content: space-between; + align-items: center; +} +.navleft { + padding-left: 20px; + display: flex; + gap: 20px; + align-items: center; +} + +.navright { + padding-right: 20px; + display: flex; + gap: 50px; + align-items: center; +} + +.navbar a { + color: #000; + text-decoration: none; + font-family: abhayalibre; + font-size: 20px; +} +.splitter { + margin: 20px auto 20px auto; + width: 80%; +} +#menu-container { + position: relative; +} + +#menu-button { + cursor: pointer; + padding: 15px; + + color: #fff; + text-align: center; +} + +#dropdown-menu { + display: none; + position: absolute; + top: 60px; + right: 40px; + width: 25%; + background-color: #000; + color: #fff; + font-family: abhayalibre; + z-index: 1; + overflow: hidden; + padding: 30px; + flex-direction: column; + animation: slideIn 0.6s ease-out; + -webkit-box-shadow: 0px 0px 25px -2px rgba(0, 0, 0, 0.75); + -moz-box-shadow: 0px 0px 25px -2px rgba(0, 0, 0, 0.75); + box-shadow: 0px 0px 25px -2px rgba(0, 0, 0, 0.75); +} + +@keyframes slideIn { + from { + height: 0; + } + to { + height: 750px; + } +} +@keyframes slideOut { + from { + height: 750px; + } + to { + height: 0; + } +} + +.menu-item { + padding: 12px; + text-decoration: none; + color: #333; + display: block; + transition: background-color 0.3s; +} +.menu-item a { + color: #fff; + display: flex; + height: 100%; + align-items: center; +} +.dropdownbody h5 { + display: flex; + align-items: center; + font-family: abhayalibre; + font-size: 20px; + margin-bottom: 10px; + color: #e6222b; + vertical-align: middle; +} +.dropdownbody ul { + list-style-type: none; +} +.dropdownbody ul li { + margin-bottom: 10px; + text-align: left; + margin-bottom: 20px; + font-size: 15px; + margin-left: 40px; + margin-right: 20px; +} +.menu-item:hover { + background-color: #f1f1f1; +} +#close-button { + display: flex; + width: 100%; + justify-content: flex-end; + color: #fff; + padding: 10px; + text-align: center; + cursor: pointer; + padding: 20px; +} +#close-button img { + height: 25px; +} +@media screen and (max-width: 1000px) { + .navitems { + display: none; + } + .headerbody h1 { + width: 80%; + font-size: 40px; + } + .headerbtn { + padding: 20px 40px 20px 40px; + font-size: 20px; + } + .navleft { + gap: 0px; + margin-right: 10px; + } + .navleft img { + margin-right: 10px; + } + #dropdown-menu { + width: 100%; + right: 0; + top: 0; + } + @keyframes slideIn { + from { + height: 0; + } + to { + height: 732px; + } + } + @keyframes slideOut { + from { + height: 732px; + } + to { + height: 0; + } + } +} diff --git a/css/style.css b/css/style.css index 8112559..93fb447 100644 --- a/css/style.css +++ b/css/style.css @@ -1,39 +1,3 @@ -@font-face { - font-family: mediamoure; - src: url("/fonts/mediamoure.ttf"); -} -@font-face { - font-family: abhayalibre; - src: url("/fonts/AbhayaLibre.ttf"); -} -@font-face { - font-family: lora; - src: url("/fonts/lora.ttf"); -} -@font-face { - font-family: roboto; - src: url("/fonts/roboto.ttf"); -} -@font-face { - font-family: opensans; - src: url("/fonts/opensans.ttf"); -} - -* { - margin: 0; - padding: 0; - box-sizing: border-box; - -ms-overflow-style: none; - scrollbar-width: none; -} -body { - width: 100%; - overflow-x: hidden; -} -*::-webkit-scrollbar { - display: none; -} - .header { background-image: url("/images/home/headerhome.png"); background-size: cover; @@ -58,26 +22,6 @@ input#search { padding: 6px 20px 6px 40px; } -.navbar { - padding: 20px 20px; - display: flex; - justify-content: space-between; - align-items: center; -} -.navleft { - padding-left: 20px; - display: flex; - gap: 20px; - align-items: center; -} - -.navright { - padding-right: 20px; - display: flex; - gap: 50px; - align-items: center; -} - .navbar a { color: #fff; text-decoration: none; @@ -88,103 +32,7 @@ input#search { margin: 20px auto 20px auto; width: 80%; } -#menu-container { - position: relative; -} - -#menu-button { - cursor: pointer; - padding: 15px; - - color: #fff; - text-align: center; -} -#dropdown-menu { - display: none; - position: absolute; - top: 60px; - right: 40px; - width: 25%; - background-color: #000; - color: #fff; - font-family: abhayalibre; - z-index: 1; - overflow: hidden; - padding: 30px; - flex-direction: column; - animation: slideIn 0.6s ease-out; - -webkit-box-shadow: 0px 0px 25px -2px rgba(0, 0, 0, 0.75); - -moz-box-shadow: 0px 0px 25px -2px rgba(0, 0, 0, 0.75); - box-shadow: 0px 0px 25px -2px rgba(0, 0, 0, 0.75); -} - -@keyframes slideIn { - from { - height: 0; - } - to { - height: 750px; - } -} -@keyframes slideOut { - from { - height: 750px; - } - to { - height: 0; - } -} - -.menu-item { - padding: 12px; - text-decoration: none; - color: #333; - display: block; - transition: background-color 0.3s; -} -.menu-item a { - color: #fff; - display: flex; - height: 100%; - align-items: center; -} -.dropdownbody h5 { - display: flex; - align-items: center; - font-family: abhayalibre; - font-size: 20px; - margin-bottom: 10px; - color: #e6222b; - vertical-align: middle; -} -.dropdownbody ul { - list-style-type: none; -} -.dropdownbody ul li { - margin-bottom: 10px; - text-align: left; - margin-bottom: 20px; - font-size: 15px; - margin-left: 40px; - margin-right: 20px; -} -.menu-item:hover { - background-color: #f1f1f1; -} -#close-button { - display: flex; - width: 100%; - justify-content: flex-end; - color: #fff; - padding: 10px; - text-align: center; - cursor: pointer; - padding: 20px; -} -#close-button img { - height: 25px; -} .headerbody { display: flex; flex-direction: column; @@ -579,9 +427,6 @@ input[type="radio"]:checked { color: #fff; } @media screen and (max-width: 1000px) { - .navitems { - display: none; - } .headerbody h1 { width: 80%; font-size: 40px; @@ -590,18 +435,7 @@ input[type="radio"]:checked { padding: 20px 40px 20px 40px; font-size: 20px; } - .navleft { - gap: 0px; - margin-right: 10px; - } - .navleft img { - margin-right: 10px; - } - #dropdown-menu { - width: 100%; - right: 0; - top: 0; - } + .headerbody p { width: 80%; } @@ -659,22 +493,6 @@ input[type="radio"]:checked { .socials { justify-content: center; } - @keyframes slideIn { - from { - height: 0; - } - to { - height: 732px; - } - } - @keyframes slideOut { - from { - height: 732px; - } - to { - height: 0; - } - } } @media screen and (min-width: 1400px) { .bodymissiontext ul li { diff --git a/index.html b/index.html index b41c270..594634b 100644 --- a/index.html +++ b/index.html @@ -3,7 +3,9 @@ + + AD Life Home