Skip to content

T
THE BASE
Commit 20bc8b5b authored by TokaKaram's avatar TokaKaram
Browse files
Options

edit arabic version

parent 9cbb9205
Show whitespace changes
Inline Side-by-side
Showing with 1510 additions and 374 deletions
thebase/thebase/the/index.html
View file @ 20bc8b5b
......@@ -21,7 +21,7 @@
<header id="header">
<div class="left_side">
<div class="logo_cont">
<img src="./images/logo.png" alt="Logo">
<img src="./images/logo (4).png" alt="Logo">
<!-- <p class="logo">
<span id="logo_the">The </span>
<span id="logo_base">base</span>
......@@ -30,17 +30,18 @@
</div>
<i class="fa-solid fa-bars list_icon" id="open_list"></i>
<div class="right_side_h hidden ">
<a id="ticketing_btn1">حجز التذاكر</a>
<a id="ticketing_btn1"> التذاكر</a>
<a><i class="fa-solid fa-bars"></i></a>
<a class="en_lang1">EN</a>
<a class="ar_lang1 colored">AR</a>
<a class="en_lang1 colored">EN</a>
<a class="ar_lang1 ">AR</a>
</div>
<p class="date">
<span id="from">from</span>
<span id="date_from">feb 5TH</span>
<span id="to">to</span>
<span id="date_to">feb 7TH 2025</span>
<span id="date_to">feb 7TH <span>2025</span> </span>
</p>
<p class="place" id="place">
<span>HALL 8 -</span>
......@@ -51,15 +52,15 @@
</div>
<div class="right_side">
<a id="ticketing_bnt_en" href="#ticketing_section" class="ticketing_bnt_en hidden1">ticketing</a>
<a id="ticketing_ar" href="#ticketing_section_ar" class=" ticketing_ar">حجز التذاكر</a>
<a id="ticketing_ar" href="#ticketing_section_ar" class=" ticketing_ar"> التذاكر</a>
<a class="lines">
<span></span>
<span></span>
<span></span>
</a>
<a class="en_lang">EN</a>
<a class="ar_lang colored">AR</a>
<a class="en_lang colored">EN</a>
<a class="ar_lang ">AR</a>
</div>
</header>
......@@ -164,7 +165,9 @@
<div class="swiper-slide"><img src="/images/game4.png" alt=""></div>
<div class="swiper-slide"><img src="/images/game5.webp" alt=""></div>
<div class="swiper-slide"><img src="/images/game6.webp" alt=""></div>
<div class="swiper-slide"><img src="/images/game6.webp" alt=""></div>
<div class="swiper-slide"><img src="/images/website_landing_page-02.webp" alt=""></div>
<div class="swiper-slide"><img src="/images/website_landing_page-03.webp" alt=""></div>
<div class="swiper-slide"><img src="/images/website_landing_page-04.webp" alt=""></div>
</div>
<div class="swiper-pagination"> next</div>
......@@ -232,11 +235,17 @@
<h1>CASUAL ACTIVITIES</h1>
<h1> THIS IS WHERE <span>THE REAL
FUN BEGINS! </span> </h1>
<p>ENJOY THE FREE-PLAY VIBES WITH OVER 20 GAMING PCS AND 10 PLAYSTATION 5 CONSOLES OPEN FOR EVERYONE.</p>
<p>JUMP INTO QUICK CHALLENGES, FRIENDLY MATCHES WITH YOUR FRIENDS, OR TRY YOUR FAVORITE GAMES WITHOUT LIMITS.
<p>THIS IS WHERE THE REAL FUN BEGINS!</p>
<p>ENJOY THE FREE-PLAY VIBES WITH OVER
20 GAMING PCS AND 10 PLAYSTATION 5
CONSOLES OPEN FOR EVERYONE.</p>
<p>JOIN SPONTANEOUS MINI TOURNAMENTS,
WIN EXCITING PRIZES, OR CHALLENGE YOUR
FRIENDS TO FRIENDLY MATCHES — IT’S ALL
ABOUT THE THRILL OF PLAY.
</p>
<p>A ZONE THAT BLENDS EXCITEMENT AND COMFORT — WHERE GAMING IS PURE JOY.</p>
<p>A ZONE THAT BLENDS EXCITEMENT AND
COMFORT — WHERE GAMING IS PURE JOY!</p>
</div>
<div class="main_img">
......@@ -262,9 +271,8 @@
ً
والمستقبل
ّ متطورة، استعد لمغامرات VR مع 6 محطات
ستعيشها بكل حواسك — تجربة تنقلك من
المشاهدة إلى قلب الحدث</p>
<p> ّ متطورة، استعد لمغامرات VR مع 6 محطات ستعيشها بكل حواسك — تجربة تنقلك من المشاهدة إلى قلب الحدث</p>
</p>
</div>
<div class="main_img">
......@@ -286,11 +294,11 @@
YOU’VE EXPERIENCED BEFORE.</span></h1>
<p>A FUSION OF VIRTUAL REALITY AND CLASSIC
ARCADE GAMES, BLENDING NOSTALGIA WITH
THE THRILL OF THE FUTURE.
WITH 6 ADVANCED VR STATIONS, GET READY
THE THRILL OF THE FUTURE.</p>
<p>WITH 6 ADVANCED VR STATIONS, GET READY
FOR ADVENTURES THAT ENGAGE ALL YOUR
SENSES — AN EXPERIENCE
THAT PULLS YOU STRAIGHT INTO THE HEART
SENSES — AN EXPERIENCE</p>
<p>THAT PULLS YOU STRAIGHT INTO THE HEART
OF THE ACTION.</p>
</div>
......@@ -373,9 +381,9 @@
STOP AT BIG SCREENS! </span></h1>
<p>JOIN THE DAILY PUBG MOBILE TOURNAMENTS,
WHETHER YOU’RE PLAYING SOLO OR WITH
YOUR SQUAD.
THE COMPETITION HERE IS FAST, THRILLING,
AND ONLY THE BEST REACH THE TOP.</p>
YOUR SQUAD.</p>
<p>THE COMPETITION HERE IS FAST, THRILLING,
AND ONLY THE BEST REACH THE TOP.</p>
<div class="a_parent">
<a>MOBILE AREA</a>
</div>
......@@ -394,7 +402,7 @@
جزءا من عالمها</span></h1>
<p>في منطقة الكوسبلاي، يتحوّل الإبداع
إلى عرض حي ّ من الأزياء، الألوان، والخيال
<span>الى عرض حي ّ من الأزياء، الألوان، والخيال</span>
شارك، التقط الصور، وكن أنت البطل
الذي يعشقه الجميع</p>
</div>
......@@ -617,11 +625,11 @@
<span>15 KD</span>
</div>
<div class="text">
<p class="first-p">على مدار الأيام الثلاثة — البطولات، BASE THE احصل على دخول كامل إلى
والعروض، والكوسبلاي، ومنطقة الواقع الافتراضي، والآركيد، وجميع مناطق
الألعاب. استمتع بدخول غير محدود إلى جميع المناطق الترفيهية والتنافسية
وأنشطة المسرح الرئيسي وفعاليات المجتمع طوال المهرجان
</p>
<p class="first-p">
على مدار الأيام الثلاثة — البطولات، BASE THE احصل على دخول كامل إلى
والعروض، والكوسبلاي، ومنطقة الواقع الافتراضي، والآركيد، وجميع مناطق
الألعاب. استمتع بدخول غير محدود إلى جميع المناطق الترفيهية والتنافسية
وأنشطة المسرح الرئيسي وفعاليات المجتمع طوال المهرجان </p>
</div>
......@@ -637,19 +645,19 @@
<span>10 KD</span>
</div>
<div class="text">
<p class="first-p">مثالي لعشاق الألعاب الذين يرغبون
في خوض التجربة بيوم واحد مكثف.
ّ
<p class="first-p">مثالي لعشاق الألعاب الذين يرغبونمثالي لعشاق الألعاب الذين يرغبون
في خوض التجربة بيوم واحد مكثف.
ّ
يوما ً كاملا تستكشف فيه جميع
يوما ً كاملا تستكشف فيه جميع
ً
ً
ِ اقض
البطولات، والواقع :BASE THE أركان
الافتراضي، وألعاب الطاولة، وعروض
الكوسبلاي، والمزيد — كل ذلك
بتذكرة واحدة
ِ اقض
البطولات، والواقع :BASE THE أركان
الافتراضي، وألعاب الطاولة، وعروض
الكوسبلاي، والمزيد — كل ذلك
بتذكرة واحدة
</p>
......@@ -669,9 +677,10 @@
</div>
<div class="text">
<p class="arab-p">
.على مدار الأيام الثلاثة - البطولات THE BASE احصل على دخول كامل إلى العروض، والكوسبلاي، ومنطقة الواقع
الافتراضي، والأركيد، وجميع مناطق الألعاب. استمتع بدخول غير محدود إلى جميع المناطق الترفيهية والتنافسية وأنشطة
المسرح الرئيسي وفعاليات المجتمع طوال المهرجان
حصري يتضمن أولوية VIP لمن يبحث عن تجربة استثنائية وشاملة. استمتع بدخول
الدخول، ومقاعد محجوزة في المسرح الرئيسي، وفرص لقاء خلف الكواليس، وباقة
منتجات مميزة. ثلاثة أيام من الألعاب، والرفاهية، والوصول إلى أعلى مستويات
التجربة فيBASE THE
</p>
......@@ -744,7 +753,7 @@
<h1 id="newsletter">NEWS LETTER</h1>
<div>
<div class="image">
<img src="./images/logo.png">
<img src="./images/logo.png" alt="Logo">
</div>
<div class="info">
<p id="newsletter_text">RECEIVE THE LATEST NEWS FROM THE BASE - GAMING FESTIVAL</p>
......@@ -757,7 +766,7 @@
<label for="phone">Phone:</label>
<input type="text" id="phone" name="phone" />
</div>
<button type="submit">send message</button>
<button type="submit" onclick=>send message</button>
</form>
</div>
......
thebase/thebase/the/index.js
View file @ 20bc8b5b
......@@ -114,10 +114,10 @@ function changeLanguage(lang) {
{
location.href = "#ticketing_section_ar"
}
document.querySelector(".en_lang").classList.remove("colored")
document.querySelector(".en_lang1").classList.remove("colored")
document.querySelector(".ar_lang").classList.add("colored")
document.querySelector(".ar_lang1").classList.add("colored")
document.querySelector(".en_lang").classList.add("colored")
document.querySelector(".en_lang1").classList.add("colored")
document.querySelector(".ar_lang").classList.remove("colored")
document.querySelector(".ar_lang1").classList.remove("colored")
......@@ -150,16 +150,16 @@ function changeLanguage(lang) {
esports_title.innerHTML="E-SPORTS TOURNAMENTS"
e_sport_btn.innerHTML="BOOK NOW"
document.querySelector(".en_lang").classList.add("colored")
document.querySelector(".en_lang1").classList.add("colored")
document.querySelector(".ar_lang").classList.remove("colored")
document.querySelector(".ar_lang1").classList.remove("colored")
document.querySelector(".en_lang").classList.remove("colored")
document.querySelector(".en_lang1").classList.remove("colored")
document.querySelector(".ar_lang").classList.add("colored")
document.querySelector(".ar_lang1").classList.add("colored")
}
}
document.querySelector(".en_lang").addEventListener("click", () => changeLanguage("en"));
document.querySelector(".en_lang1").addEventListener("click", () => changeLanguage("en"));
// document.querySelector(".en_lang").addEventListener("click", () => changeLanguage("en"));
// document.querySelector(".en_lang1").addEventListener("click", () => changeLanguage("en"));
document.querySelector(".ar_lang").addEventListener("click", () => changeLanguage("ar"));
document.querySelector(".ar_lang1").addEventListener("click", () => changeLanguage("ar"));
// =========================
......@@ -191,8 +191,16 @@ let lastScrollTop = 0;
lastScrollTop = scrollTop <= 0 ? 0 : scrollTop;
});
// ======================= Organize Logic
function openNewWindow(url) {
function openNewWindow(url,target) {
// Opens a new tab with example.com, specifying dimensions
if(target=="self")
{
window.open(url, "_self");
history.pushState("", document.title, window.location.pathname + window.location.search);
}
else
window.open(url, "_blank");
}
e_sport_btn.onclick=function ()
......
thebase/thebase/the/style.css
View file @ 20bc8b5b
......@@ -101,8 +101,9 @@ header {
header .logo_cont {
display: flex;
align-items: start;
align-items: end;
column-gap: 5px;
justify-content: end;
}
header .left_side {
......@@ -110,10 +111,11 @@ header .left_side {
font-family: var(--main-font);
display: flex;
align-items: center;
transform: translateX(-170px);
}
header .left_side img {
width: 65px;
width: 165px;
height: 100px;
object-fit: contain;
/* margin-right: 14px; */
......@@ -159,7 +161,7 @@ header .left_side .date span:nth-child(4) {
}
header .left_side .date span:nth-child(4) span:nth-child(1) {
color: var(--text_color);
color: white;
}
header .right_side {
......@@ -181,14 +183,14 @@ header .right_side a {
header .right_side .ticketing_bnt_en,
header .right_side .ticketing_ar {
background-color: #3023a2;
color: var(--text_color);
padding: 4px 18px;
color: white;
padding: 2px 46px;
display: flex;
align-items: center;
justify-content: center;
text-transform: uppercase;
border-radius: 8px;
font-family: var(--font_noor_light);
border-radius: 12px;
font-family: var(--font_noor_bold);
}
header .right_side .ticketing_bnt_en {
......@@ -237,31 +239,65 @@ header .right_side a:nth-child(4) {
@media(max-width:2200px)
{
header .left_side img
{
width: 160px;
height: 160px;
}
header .left_side .date,
header .left_side .place
{
font-size: 22px;
}
header .left_side
{
transform: translateX(0);
} header .left_side img
{
width: 100% ;
object-fit: contain;
height: 100%;
/* height: 20%; */
}
header .left_side .logo_cont
{
position: relative;
/* background-color: red; */
width: 18%;
}
header .right_side .ticketing_bnt_en,
header .right_side .ticketing_ar,
header .right_side a:nth-child(3),
header .right_side a:nth-child(4),
header .right_side a
{
font-size: 28px;
font-size: 26px;
}
header .left_side .date
{
margin-left: 30px;
}
header .left_side .place
{
margin-left: 5px;
}
}
.right_side .ticketing_ar {
padding: 6px 56px;
font-size: 20px;
}
@media(max-width:1850px)
{
header .left_side img
{
width: 120px;
height: 120px;
width: 100% ;
object-fit: contain;
height: 100%;
/* height: 20%; */
}
header .left_side .logo_cont
{
position: relative;
/* background-color: red; */
width: 18%;
}
header .left_side .date,
header .left_side .place
......@@ -279,15 +315,24 @@ header .right_side a:nth-child(4) {
}
@media(max-width:1500px)
{
header .left_side .date,
header .left_side .place
{
font-size: 16px;
}
header .left_side img
{
width: 110px;
height: 110px;
width: 100% ;
object-fit: contain;
height: 100%;
/* height: 20%; */
}
header .left_side .date,
header .left_side .place
header .left_side .logo_cont
{
font-size: 18px;
position: relative;
/* background-color: red; */
width: 17%;
}
header .right_side .ticketing_bnt_en,
header .right_side .ticketing_ar,
......@@ -300,11 +345,17 @@ header .right_side a:nth-child(4) {
}
@media(max-width:1300px)
{
header .left_side img
header .left_side .logo_cont
{
position: relative;
/* background-color: red; */
width: 20%;
}
header .left_side
{
width: 110px;
height: 110px;
transform: translateX(0px);
}
header .left_side .date,
header .left_side .place
{
......@@ -343,10 +394,10 @@ header .right_side a:nth-child(4) {
.play_games h1 {
text-align: center;
font-family: var(--noor_font);
font-family: var(--font_noor_bold);
font-weight: bold;
color: var(--title_color);
font-size: 50px;
font-size: 60px;
}
.play_games_ar {
......@@ -406,7 +457,8 @@ header .right_side a:nth-child(4) {
/* ===========E-sport================ */
.e_sport {
background-color: var(--bck_color);
padding: 25px 0 25px 0;
padding: 50px 0 25px 0;
/* margin-top: 50px; */
}
......@@ -423,7 +475,9 @@ header .right_side a:nth-child(4) {
.e_sport>div:nth-child(2) {
display: grid;
grid-template-columns: repeat(3, 31%);
grid-template-columns: repeat(3, 569px);
align-items: center;
justify-content: center;
column-gap: 20px;
......@@ -518,9 +572,9 @@ header .right_side a:nth-child(4) {
font-weight: 700;
text-decoration: none;
border: none;
border-radius: 18px;
border-radius: 22px;
background: linear-gradient(90deg, #a509b0, #680b83, #1e0d4e);
padding: 7px 45px;
padding: 9px 65px;
display: block;
width: fit-content;
/* margin-left: 40%; */
......@@ -718,7 +772,7 @@ header .right_side a:nth-child(4) {
}
.hidden {
transform: translateX(250%);
display: none !important;
width: 0;
}
......@@ -754,6 +808,10 @@ header .right_side a:nth-child(4) {
/* Zoom Out 60% */
@media(max-width:2200px)
{
.e_sport a
{
font-size: 25px;
}
.e_sport > div:nth-child(2)
{
grid-template-columns: repeat(3, 569px);
......@@ -792,6 +850,10 @@ header .right_side a:nth-child(4) {
{
height: 678px;
}
.e_sport h1
{
font-size: 78px;
}
.info form div:nth-child(2)
{
......@@ -800,7 +862,7 @@ header .right_side a:nth-child(4) {
.letters form div input
{
padding: 15px 25px;
width: 40%;
width: 60%;
}
.letters h1
{
......@@ -808,29 +870,46 @@ header .right_side a:nth-child(4) {
}
.letters div p:nth-child(1)
{
font-size: 40px;
font-size: 38px;
line-height: 53px;
/* color: red; */
width: 100%;
margin-top: 0;
}
.letters form button
{
font-size: 31.5px;
margin-top: 80px;
}
.letters div img {
width: 55%;
height: 50%;
}
.letters > div {
width: 60%;
margin-left: 10%;
}
}
@media(max-width:1880px)
{
.e_sport h1
{
font-size: 70px;
}
.letters div img
{
{
width: 40%;
height: 20%;
object-fit: contain;
}
}
.letters > div
{
align-items: center ;
/* margin-left: 100%; */
}
.info
{
......@@ -862,16 +941,16 @@ header .right_side a:nth-child(4) {
{
left: 20px;
}
/* .e_sport > div:nth-child(2)
{
grid-template-columns: repeat(3, 550px);
background: black;
} */
}
/* Zoom Out 70% */
@media(max-width:1850px)
{
.e_sport a
{
font-size: 30px;
}
.letters form div input
{
padding: 15px 25px;
......@@ -882,15 +961,13 @@ header .right_side a:nth-child(4) {
{
font-size: 54px;
}
.letters div p:nth-child(1)
{
margin-bottom: 20px;
margin-top: 0;
}
.letters div p:nth-child(1)
{
font-size: 25px;
line-height: 53px;
line-height: 35px;
margin-bottom: 30px;
margin-top: 0;
}
.info form div:nth-child(2)
{
......@@ -922,7 +999,7 @@ header .right_side a:nth-child(4) {
{
.letters div img
{
width: 40%;
width: 50%;
height: 30%;
}
.letters > div
......@@ -934,6 +1011,10 @@ header .right_side a:nth-child(4) {
/* Zppm Out 80% */
@media(max-width:1800px)
{
.e_sport a
{
font-size: 27px;
}
.e_sport > div:nth-child(2)
{
grid-template-columns: repeat(3, 31%);
......@@ -1027,11 +1108,24 @@ header .right_side a:nth-child(4) {
} */
}
@media(max-width:1700px)
{
.e_sport h1
{
font-size: 65px;
}
}
/* Zoom Out 90% */
@media(max-width:1500px) {
.e_sport h1
{
font-size: 60px;
}
.e_sport a
{
font-size: 25px;
}
.letters > div
{
align-items: center ;
......@@ -1081,8 +1175,8 @@ header .right_side a:nth-child(4) {
}
.letters div img
{
width: 60%;
height: 60%;
width: 48%;
height: 50%;
}
.e_sport > div:nth-child(2)
{
......@@ -1119,7 +1213,7 @@ header .right_side a:nth-child(4) {
.e_sport > div div .valorant_img,
.e_sport > div div .bellingham_img
{
transform: translateY(-70px);
transform: translateY(-79px);
}
}
......@@ -1144,6 +1238,14 @@ header .right_side a:nth-child(4) {
/* Norma 100% */
@media(max-width:1300px) {
.e_sport h1
{
font-size: 55px;
}
.e_sport a
{
font-size: 22px;
}
.e_sport > div:nth-child(2)
{
grid-template-columns: repeat(3, 31%);
......@@ -1201,8 +1303,12 @@ header .right_side a:nth-child(4) {
}
.letters div img
{
width: 60%;
height: 60%;
width: 52%;
height: 52%;
}
.e_sport > div div .abs_img
{
top: 90px;
}
......@@ -1310,6 +1416,9 @@ header .right_side a:nth-child(4) {
@media(max-width:950px) {
.e_sport > div div .valorant_img, .e_sport > div div .bellingham_img {
transform: translateY(-75px);
}
.e_sport > div div {
height: 400px;
......@@ -1528,17 +1637,30 @@ header .right_side a:nth-child(4) {
.letters .image {
justify-content: center !important;
width: 100%;
}
header .left_side img {
width: 60px;
height: 100px;
}
.hero_section2
{
position: relative;
z-index: -1;
}
header .logo_cont {
align-items: center;
}
header .left_side
{
padding: 15px 0 0 0 ;
}
header .left_side .logo_cont
{
width: 30%;
}
.letters form div input
{
width: 80%;
}
}
......@@ -1796,7 +1918,7 @@ header .right_side a:nth-child(4) {
.card_game_ar .card_game_cont img {
width: 100%;
height: 520px;
height: 100%;
object-fit: cover;
object-position: 0 65%;
......@@ -1804,16 +1926,22 @@ header .right_side a:nth-child(4) {
.card_game_ar .card_game_cont .img_parent {
overflow: hidden;
clip-path: polygon(0 0, 80% 0, 100% 100%, 0 100%);
border-top-right-radius: 20% 100%;
border-bottom-right-radius: 10% 0%;
/* clip-path: polygon(0 0, 80% 0, 100% 100%, 0 100%); */
clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
/* border-top-right-radius: 20% 100%;
border-bottom-right-radius: 10% 0%; */
border-top-right-radius: 40% 100%;
border-bottom-right-radius: 0% 0%;
/* direction: ltr; */
/* transform: translateY(-40px); */
position: relative;
height: 600px;
}
.card_game_ar .card_game_cont .main_img {
.card_game_ar .card_game_cont .main_img,
.card_game_cont .img_parent
{
position: relative;
height: 600px;
}
.card_game_ar .card_game_cont .main_img::after {
......@@ -1963,17 +2091,18 @@ header .right_side a:nth-child(4) {
{
font-size: 36px;
line-height: 52px;
width: 75%;
width: 85%;
/* color: red; */
margin: 0;
direction: rtl;
margin-left: 25%;
margin-left: 15%;
}
.card_game .card_game_cont a
{
left: 80px;
font-size: 31.5px;
bottom: 50px;
}
}
@media(max-width:2000px)
......@@ -1996,6 +2125,7 @@ header .right_side a:nth-child(4) {
font-size: 30px;
bottom: 20px;
}
}
@media(max-width:1850px)
......@@ -2038,7 +2168,7 @@ header .right_side a:nth-child(4) {
.card_game .card_game_cont .main_img,
.card_game .card_game_cont .img_parent
{
height: 480px;
height: 440px;
/* background: red; */
}
.card_game .card_game_cont .main_img img
......@@ -2053,7 +2183,7 @@ header .right_side a:nth-child(4) {
.card_game .card_game_cont .text p
{
font-size: 26px;
line-height: 52px;
line-height: 40px;
width: 90%;
/* color: red; */
margin: 0;
......@@ -2082,7 +2212,7 @@ header .right_side a:nth-child(4) {
.card_game .card_game_cont .main_img,
.card_game .card_game_cont .img_parent
{
height: 420px;
height: 380px;
/* background: red; */
}
.card_game .card_game_cont .text h1
......@@ -2092,6 +2222,7 @@ header .right_side a:nth-child(4) {
.card_game .card_game_cont .text p
{
font-size: 24px;
line-height: 35px;
}
.card_game .card_game_cont .text
......@@ -2105,6 +2236,19 @@ header .right_side a:nth-child(4) {
bottom: 20px;
}
}
@media(max-width:1440px)
{
.card_game .card_game_cont .main_img, .card_game .card_game_cont .img_parent
{
height: 387px;
}
.card_game .card_game_cont .text p
{
font-size: 32px;
line-height: 39px;
}
}
@media(max-width:1439px) {
.card_game_ar .card_game_cont .text p {
left: -60px;
......@@ -2118,6 +2262,7 @@ header .right_side a:nth-child(4) {
top: 20px;
}
}
@media(max-width:1300px)
......@@ -2127,12 +2272,13 @@ header .right_side a:nth-child(4) {
left: 50px;
bottom: 10px;
font-size: 18px;
padding: 7px 20px;
}
.card_game .card_game_cont .main_img,
.card_game .card_game_cont .img_parent
{
height: 420px;
height: 350px;
/* background: red; */
}
.card_game .card_game_cont .text h1
......@@ -2143,7 +2289,7 @@ header .right_side a:nth-child(4) {
.card_game .card_game_cont .text p
{
font-size: 25px;
line-height: 48px;
line-height: 33px;
}
......@@ -2175,7 +2321,7 @@ header .right_side a:nth-child(4) {
}
.card_game .card_game_cont .text p {
font-size: 22px;
font-size: 25px;
}
/* */
......@@ -2194,7 +2340,7 @@ header .right_side a:nth-child(4) {
}
.card_game .card_game_cont .main_img, .card_game .card_game_cont .img_parent
{
height: 400px;
height: 355px;
}
.card_game .card_game_cont .main_img img {
object-position: 0 68%;
......@@ -2235,10 +2381,17 @@ header .right_side a:nth-child(4) {
.card_game_ar .card_game_cont .text p:nth-child(9) {
top: 405px;
}
}
@media(max-width:800px) {
.card_game .card_game_cont .main_img, .card_game .card_game_cont .img_parent {
height: 400px;
}
.card_game .card_game_cont .text h1
{
font-size: 30px;
}
.card_game .card_game_cont img,
.card_game_ar .card_game_cont img {
height: 100%;
......@@ -2254,7 +2407,11 @@ header .right_side a:nth-child(4) {
margin-left: 0;
font-size: 18px;
}
.card_game .card_game_cont .text p
{
font-size: 22px;
line-height: 30px;
}
.card_game_ar .card_game_cont .text h1 {
width: 100%;
margin-left: 0;
......@@ -2320,7 +2477,7 @@ header .right_side a:nth-child(4) {
.card_game .card_game_cont .text p {
font-size: 18px;
line-height: 30px;
line-height: 28px;
}
......@@ -2390,7 +2547,7 @@ header .right_side a:nth-child(4) {
.card_game .card_game_cont .text p {
font-size: 16px;
font-weight: normal;
line-height: 32px;
line-height: 28px;
}
.card_game_ar .card_game_cont .text p {
......@@ -2537,8 +2694,7 @@ header .right_side a:nth-child(4) {
.mobile .mobile_cont .main_img
{
height: 650px;
/* background: red; */
/* padding-bottom: 40px; */
}
}
......@@ -2576,6 +2732,7 @@ header .right_side a:nth-child(4) {
@media(max-width:1800px) {
.mobile .mobile_cont .text h1 {
font-size: 45px ;
line-height: 66px;
}
.mobile .mobile_cont a
......@@ -2584,17 +2741,22 @@ header .right_side a:nth-child(4) {
}
.mobile .mobile_cont .text p {
font-size: 26px ;
line-height: 38px;
}
.mobile .mobile_cont .main_img
{
height: 620px;
height: 580px;
}
}
@media(max-width:1500px) {
.mobile .mobile_cont .text h1
{
line-height: 68px;
}
.mobile .mobile_cont a
{
font-size: 20px;
......@@ -2602,7 +2764,7 @@ header .right_side a:nth-child(4) {
.mobile .mobile_cont .text p {
font-size: 24px ;
width: 100%;
line-height: 40px;
line-height: 32px;
}
......@@ -2620,7 +2782,16 @@ header .right_side a:nth-child(4) {
@media(max-width:1440px)
{
.mobile .mobile_cont .main_img {
height: 540px;
height: 480px;
}
.mobile .mobile_cont .text h1 {
line-height: 57px;
}
.mobile .mobile_cont .text p {
font-size: 28px;
}
.mobile .mobile_cont a {
margin-top: 20px;
}
}
@media(max-width:1300px) {
......@@ -2639,19 +2810,30 @@ header .right_side a:nth-child(4) {
}
.mobile .mobile_cont .main_img
{
height: 500px;
height: 470px;
}
.mobile .mobile_cont a
{
margin-top: 30px;
}
}
@media(max-width:1030px)
{
.mobile .mobile_cont .text h1 {
font-size: 30px;
line-height: 37px;
}
.mobile .mobile_cont .text p {
font-size: 22px;
width: 100%;
}
.mobile .mobile_cont .main_img {
height: 442px;
}
}
@media(max-width:800px) {
......@@ -2683,7 +2865,8 @@ header .right_side a:nth-child(4) {
width: 80%;
}.mobile .mobile_cont a
{
margin-top: 20px;
margin-top: 30px;
font-size: 18px;
}
.mobile_cont .text {
......@@ -2705,16 +2888,21 @@ header .right_side a:nth-child(4) {
.mobile .mobile_cont .text h1 {
font-size: 25px;
width: 100%;
line-height: 32px;
}
.mobile .mobile_cont .text p {
font-size: 18px;
line-height: 26px;
}
.mobile .mobile_cont .a_parent {
margin-top: 10px;
margin-top: 0px;
}
.mobile .mobile_cont a
{
margin-top: 20px;
}
.mobile .mobile_cont a {
font-size: 18px;
}
......@@ -2725,12 +2913,13 @@ header .right_side a:nth-child(4) {
.mobile .mobile_cont a {
font-size: 16px;
margin-top: 20px;
padding: 10px 40px;
}
.mobile .mobile_cont .text h1 {
font-size: 20px;
width: 100%;
line-height: 42px;
width: 90%;
line-height: 29px;
}
.mobile .mobile_cont .text p {
......@@ -2747,6 +2936,10 @@ header .right_side a:nth-child(4) {
.mobile .mobile_cont .a_parent {
margin-top: 0px;
}
.mobile .mobile_cont .text p {
line-height: 24px;
}
}
/* ===========mobile ar=========== */
......@@ -2777,6 +2970,7 @@ header .right_side a:nth-child(4) {
.mobile_ar .mobile_cont .main_img {
position: relative;
height: 800px;
}
.mobile_ar .mobile_cont .text h1 span {
......@@ -2785,31 +2979,34 @@ header .right_side a:nth-child(4) {
.mobile_ar .mobile_cont .text h1 {
color: white;
font-size: 30px;
font-size: 67px;
line-height: 72px;
font-weight: 700;
width: 100%;
direction: ltr;
margin-left: 0%;
font-family: var(--sora_font);
line-height: 42px;
}
.mobile_ar .mobile_cont .text p {
font-size: 20px;
font-size: 40px;
line-height: 55px;
color: var(--text_color);
font-weight: normal;
font-family: var(--sora_font);
line-height: 35px;
margin: 0;
}
.mobile_ar .mobile_cont img {
width: 100%;
height: 481px;
height: 100%;
object-fit: cover;
object-position: center;
/* border-bottom-right-radius: 20px; */
......@@ -2829,8 +3026,8 @@ header .right_side a:nth-child(4) {
border: none;
border-radius: 30px;
text-align: center;
font-size: 20px;
font-family: var(--sora_font);
font-size: 37px;
font-family: var(--sora_extrabold);
font-weight: bold;
padding: 10px 30px;
margin-top: 20px;
......@@ -2858,8 +3055,84 @@ header .right_side a:nth-child(4) {
opacity: .5;
opacity: .3;
}
@media(max-width:2200px)
{
.mobile_ar .mobile_cont
{
grid-template-columns: 43% 57%;
}
.mobile_ar .mobile_cont .text
{
transform: translateX(120px);
}
.mobile_ar .mobile_cont .text h1
{
font-size: 45px;
line-height: 60px;
margin-bottom: 10px;
}
.mobile_ar .mobile_cont .text p {
font-size: 30px;
line-height: 38px;
width: 100%;
}
.mobile_ar .mobile_cont .main_img
{
height: 630px;
}
.mobile_ar .mobile_cont a
{
font-size: 31.5px;
margin-top: 5px;
}
@media(max-width:1800px) {
}
@media(max-width:1780px)
{
.mobile_ar .mobile_cont
{
grid-template-columns: 43% 57%;
}
.mobile_ar .mobile_cont .text
{
transform: translateX(100px);
}
.mobile_ar .mobile_cont .text h1
{
font-size: 40px;
line-height: 57px;
margin-bottom: 10px;
}
.mobile_ar .mobile_cont .text p {
font-size: 27px;
line-height: 36px;
width: 100%;
}
.mobile_ar .mobile_cont .main_img
{
height: 580px;
}
.mobile_ar .mobile_cont a
{
font-size: 30px;
margin-top: 5px;
}
}
@media(max-width:1750px)
{
.mobile_ar .mobile_cont .text h1
{
font-size: 38px;
line-height: 52px;
margin-bottom: 10px;
}
.mobile_ar .mobile_cont .main_img
{
height: 600px;
}
}
/* @media(max-width:1800px) {
.mobile_ar .mobile_cont .text p {
font-size: 25px;
}
......@@ -2875,22 +3148,38 @@ header .right_side a:nth-child(4) {
.mobile_ar .mobile_cont .text {
transform: translateX(100px);
}
}
} */
@media(max-width:1500px) {
.mobile_ar .mobile_cont .text
{
transform: translateX(70px);
}
.mobile_ar .mobile_cont .text p {
font-size: 20px;
font-size: 23px;
line-height: 29px;
}
.mobile_ar .mobile_cont .text h1 {
font-size: 30px;
font-size: 35px;
line-height: 42px;
margin-bottom: 15px;
}
.mobile_ar .mobile_cont a
{
font-size: 25px;
}
.mobile_ar .mobile_cont .main_img
{
height: 500px;
}
}
@media(max-width:1300px) {
.mobile_ar .mobile_cont .text p {
font-size: 18px;
font-size: 20px;
line-height: 26px;
}
.mobile_ar .mobile_cont .text {
......@@ -2898,15 +3187,45 @@ header .right_side a:nth-child(4) {
}
.mobile_ar .mobile_cont .text h1 {
font-size: 30px;
font-size: 32px;
line-height: 40px;
margin-top: 32px;
}
.mobile_ar .mobile_cont .a_parent {
padding-bottom: 30px;
}
.mobile_ar .mobile_cont a
{
font-size: 22px;
margin-top: 5px;
}
.mobile_ar .mobile_cont .main_img
{
height: 440px;
}
}
@media(max-width:1030px)
{
.mobile_ar .mobile_cont .text h1 {
font-size: 27px;
line-height: 36px;
}
.mobile_ar .mobile_cont .text p {
font-size: 18px;
line-height:25px;
}
.mobile_ar .mobile_cont a
{
margin-top: 13px;
}
}
@media(max-width:800px) {
.mobile_ar .mobile_cont .main_img
{
height: 400px;
}
.mobile_ar .mobile_cont {
display: flex;
flex-direction: column-reverse;
......@@ -2924,6 +3243,15 @@ header .right_side a:nth-child(4) {
transform: translateX(0);
margin-top: 30px;
}
.mobile_ar .mobile_cont .text h1
{
font-size: 25px;
line-height: 32px;
}
.Vr_zone_ar .Vr_zone_ar_cont .text p,.mobile_ar .mobile_cont .text p
{
font-size: 17px;
}
}
@media(max-width:500px) {
......@@ -2945,6 +3273,10 @@ header .right_side a:nth-child(4) {
.mobile_ar .mobile_cont .a_parent {
margin-top: 10px;
}
.mobile_ar .mobile_cont a
{
font-size: 16px;
}
}
@media(max-width:400px) {
......@@ -3040,7 +3372,7 @@ header .right_side a:nth-child(4) {
.casual_av .casual_av_cont img {
width: 100%;
height: 410px;
height: 100%;
object-fit: cover;
object-position: center;
}
......@@ -3104,6 +3436,10 @@ header .right_side a:nth-child(4) {
{
display: none;
}
.casual_av .casual_av_cont .img_parent,
.casual_av .casual_av_cont .main_img{
height: 500px;
}
@media(max-width:2200px) {
.casual_av .casual_av_cont
{
......@@ -3189,15 +3525,17 @@ header .right_side a:nth-child(4) {
/* background-color: #00ff00; */
width: 100%;
}
.casual_av .casual_av_cont .text p
.casual_av .casual_av_cont .img_parent,
.casual_av .casual_av_cont .main_img{
height: 650px;
height: 620px;
}
/* ================== */
}
@media(max-width:2000px) {
.casual_av .casual_av_cont .text h1 {
/* padding-right: 10px; */
/* text-align: start; */
......@@ -3252,7 +3590,7 @@ header .right_side a:nth-child(4) {
.casual_av .casual_av_cont .img_parent::after {
height: 550px;
height: 100%;
width: 105%;
}
......@@ -3262,8 +3600,13 @@ header .right_side a:nth-child(4) {
text-align: center;
}
.casual_av .casual_av_cont .img_parent,
.casual_av .casual_av_cont .main_img{
height: 620px;
/* background-color: red; */
}
/* ================== */
......@@ -3341,6 +3684,10 @@ header .right_side a:nth-child(4) {
{
bottom: 40px;
}
.casual_av .casual_av_cont .img_parent, .casual_av .casual_av_cont .main_img
{
height: 500px;
}
}
......@@ -3354,12 +3701,12 @@ header .right_side a:nth-child(4) {
}
.casual_av .casual_av_cont .text .casual_text
{
padding-right: 150px;
padding-right: 130px;
}
.casual_av .casual_av_cont .text .casual_text p {
padding-right: 0px;
/* transform: translateX(-110px); */
font-size: 26px;
font-size: 30px;
line-height: 36px;
width: 100%;
}
......@@ -3402,10 +3749,18 @@ header .right_side a:nth-child(4) {
.casual_av .casual_av_cont .img_parent,
.casual_av .casual_av_cont .main_img{
height: 500px;
}
}
/* Zoom OUT 75% Google */
@media(max-width:1780px)
{
.casual_av .casual_av_cont .text .casual_text p:nth-child(8)
{
transform: translateX(20px);
}
}
@media(max-width:1750px)
{
......@@ -3421,16 +3776,21 @@ header .right_side a:nth-child(4) {
.casual_av .casual_av_cont .text .casual_text p:nth-child(8)
{
transform: translateX(10px);
transform: translateX(20px);
/* color: b/lack; */
}
.casual_av .casual_av_cont .text .casual_text p
{
font-size: 26px;
}
}
@media(max-width:1500px) {
.casual_av .casual_av_cont .text .casual_text
{
padding-right: 130px;
padding-right: 110px;
}
.casual_av .casual_av_cont .text .casual_text p:nth-child(8)
{
......@@ -3438,7 +3798,7 @@ header .right_side a:nth-child(4) {
}
.casual_av .casual_av_cont .text .casual_text p {
font-size: 23px;
font-size: 25px;
line-height: 34px;
}
.casual_av .casual_av_cont
......@@ -3487,15 +3847,31 @@ header .right_side a:nth-child(4) {
}
.casual_av .casual_av_cont .img_parent
{
height: 450px;
height: 480px;
}
}
@media(max-width:1440px)
{
.casual_av .casual_av_cont .text .casual_text {
padding-right: 110px;
transform: translateX(-51px);
}
.casual_av .casual_av_cont .img_parent {
height: 442px;
}
.casual_av .casual_av_cont a {
bottom: 80px;
}
}
@media(max-width:1300px) {
.casual_av .casual_av_cont .text .casual_text {
transform: translateX(0px);
}
.casual_av .casual_av_cont
{
/* background-color: red; */
......@@ -3537,12 +3913,12 @@ header .right_side a:nth-child(4) {
/* text-align: start; */
padding-right: 80px;
transform: translateX(0);
font-size: 42px;
font-size: 45px;
/* color: red; */
}
.casual_av .casual_av_cont .text h1 span
{
font-size: 42px;
font-size: 39px;
}
......@@ -3553,12 +3929,16 @@ header .right_side a:nth-child(4) {
flex-direction: column;
align-items: start;
justify-content: end;
padding-right: 60px;
padding-right: 50px;
}
.casual_av .casual_av_cont .text .casual_text
{
/* padding-right: 80px; */
}
.casual_av .casual_av_cont .text .casual_text p {
padding-right: 0px;
/* transform: translateX(-110px); */
font-size: 23px;
font-size: 25px;
/* width: 80%; */
line-height: 32px;
/* direction: ltr; */
......@@ -3567,12 +3947,49 @@ header .right_side a:nth-child(4) {
transform: translateX(0px);
}
.casual_av .casual_av_cont .text h1 {
/* padding-right: 10px; */
text-align: center;
padding-right: 0px;
transform: translateX(0);
width: 100%;
font-size: 30px;
/* color: black; */
}
.casual_av .casual_av_cont .text .casual_text p:nth-child(1)
{
transform: translateX(-50px) ;
/* color: red; */
}
.casual_av .casual_av_cont .text .casual_text p:nth-child(2)
{
transform: translateX(-80px) ;
}
.casual_av .casual_av_cont .text .casual_text p:nth-child(3)
{
transform: translateX(-80px) ;
}
.casual_av .casual_av_cont .text .casual_text p:nth-child(4)
{
transform: translateX(-35px) ;
/* color: black; */
}
.casual_av .casual_av_cont .text .casual_text p:nth-child(5)
{
transform: translateX(-65px) ;
}
.casual_av .casual_av_cont .text .casual_text p:nth-child(6)
{
transform: translateX(-50px) ;
}
.casual_av .casual_av_cont .text .casual_text p:nth-child(7)
{
transform: translateX(-45px) ;
}
.casual_av .casual_av_cont .text .casual_text p:nth-child(8)
{
direction: ltr;
/* background-color: #00ff00; */
width: 100%;
transform: translateX(27px);
transform: translateX(-45px) !important;
}
......@@ -3581,13 +3998,14 @@ header .right_side a:nth-child(4) {
{
height: 420px;
}
}
@media(max-width:1030px) {
.casual_av .casual_av_cont .text .casual_text
{
padding-right:27px;
padding-right:40px;
}
.casual_av .casual_av_cont .text .casual_text p
{
......@@ -3604,7 +4022,7 @@ header .right_side a:nth-child(4) {
.casual_av .casual_av_cont a,
.casual_ar .casual_av_cont a {
bottom: 63px;
bottom: 22px;
}
.casual_av .casual_av_cont .img_parent::after {
......@@ -3624,12 +4042,51 @@ header .right_side a:nth-child(4) {
transform: translateX(0);
width: 100%;
font-size: 30px;
/* color: black; */
}
.casual_av .casual_av_cont .text h1 span
{
font-size: 30px;
}
.casual_av .casual_av_cont .text .casual_text p:nth-child(1)
{
transform: translateX(-50px) ;
/* color: red; */
}
.casual_av .casual_av_cont .text .casual_text p:nth-child(2)
{
transform: translateX(-80px) ;
}
.casual_av .casual_av_cont .text .casual_text p:nth-child(3)
{
transform: translateX(-80px) ;
}
.casual_av .casual_av_cont .text .casual_text p:nth-child(4)
{
transform: translateX(-35px) ;
/* color: black; */
}
.casual_av .casual_av_cont .text .casual_text p:nth-child(5)
{
transform: translateX(-65px) ;
}
.casual_av .casual_av_cont .text .casual_text p:nth-child(6)
{
transform: translateX(-50px) ;
}
.casual_av .casual_av_cont .text .casual_text p:nth-child(7)
{
transform: translateX(-45px) ;
}
.casual_av .casual_av_cont .text .casual_text p:nth-child(8)
{
transform: translateX(-45px) !important;
}
}
.casual_av .casual_av_cont .text .casual_text p
{
......@@ -3645,14 +4102,12 @@ header .right_side a:nth-child(4) {
{
display: block;
}
.casual_av .casual_av_cont .main_img,
.casual_ar .casual_av_cont .main_img {
.casual_av .casual_av_cont .main_img {
height: 300px;
}
.casual_av .casual_av_cont .img_parent,
.casual_ar .casual_av_cont .img_parent {
height: 300px;
.casual_av .casual_av_cont .img_parent{
/* height: 300px; */
}
.casual_av .casual_av_cont .img_parent::after {
......@@ -3703,7 +4158,8 @@ header .right_side a:nth-child(4) {
.casual_ar .casual_av_cont a {
bottom: 20px;
}
.casual_av .casual_av_cont .main_img, .casual_ar .casual_av_cont .main_img
.casual_av .casual_av_cont .main_img, .casual_ar .casual_av_cont .main_img,
.casual_av .casual_av_cont .img_parent
{
height: 400px;
}
......@@ -3744,7 +4200,8 @@ header .right_side a:nth-child(4) {
font-size: 25px;
}
.casual_av .casual_av_cont .text h1 {
.casual_av .casual_av_cont .text h1,
.casual_av .casual_av_cont .text h1 span {
font-size: 25px;
width: 100%;
}
......@@ -3831,7 +4288,7 @@ header .right_side a:nth-child(4) {
.casual_ar .casual_av_cont .text h1:nth-child(1) {
color: #aa09b4;
font-family: var(--sora_font);
font-family: var(--sora_extrabold);
direction: ltr;
font-size: 39px;
width: 100%;
......@@ -3874,7 +4331,7 @@ header .right_side a:nth-child(4) {
.casual_ar .casual_av_cont img {
width: 100%;
height: 510px;
height: 100%;
object-fit: cover;
object-position: center;
/* border-bottom-right-radius: 20px; */
......@@ -3884,7 +4341,7 @@ header .right_side a:nth-child(4) {
.casual_ar .casual_av_cont .img_parent {
width: 100%;
position: relative;
height: 75vh;
height: 500px;
overflow: hidden;
clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
border-top-left-radius: 0 100%;
......@@ -3923,7 +4380,7 @@ header .right_side a:nth-child(4) {
border-radius: 30px;
text-align: center;
font-size: 20px;
font-family: var(--sora_font);
font-family: var(--sora_extrabold);
font-weight: bold;
padding: 10px 40px;
position: absolute;
......@@ -3932,10 +4389,90 @@ header .right_side a:nth-child(4) {
text-transform: uppercase;
color: var(--text_color);
}
@media(max-width:2200px)
{
.casual_ar .casual_av_cont .main_img img
{
height: 100%;
}
.casual_ar .casual_av_cont .img_parent,
.casual_ar .casual_av_cont .main_img{
height: 620px;
margin-top: 26px;
}
.casual_ar .casual_av_cont .text p
{
font-size: 36px;
/* color: red; */
width: 100%;
line-height: 42px;
width: 97%;
}
.casual_ar .casual_av_cont .text h1 {
font-size: 50px;
line-height: 55px;
}
.casual_ar .casual_av_cont .text h1:nth-child(1) {
font-size: 65px;
margin-bottom: 40px;
}
.casual_ar .casual_av_cont .text h1
{
margin-bottom: 10px;
/* margin-top: 25px; */
}
}
@media(max-width:2000px)
{
.casual_ar .casual_av_cont .img_parent,
.casual_ar .casual_av_cont .main_img{
height: 680px;
margin-top: 26px;
}
.casual_ar .casual_av_cont .text p
{
font-size: 32px;
}
.casual_ar .casual_av_cont .text h1:nth-child(1) {
margin-bottom: 60px;
}
.casual_ar .casual_av_cont .text h1
{
margin-bottom: 20px;
/* margin-top: 25px; */
}
}
@media(max-width:1850px)
{
.casual_ar .casual_av_cont .img_parent,
.casual_ar .casual_av_cont .main_img{
height: 600px;
margin-top: 25px;
}
.casual_ar .casual_av_cont .text p
{
font-size: 30px;
line-height: 38px;
}
.casual_ar .casual_av_cont .text h1 {
font-size: 45px;
line-height: 50px;
}
.casual_ar .casual_av_cont .text h1:nth-child(1) {
font-size: 60px;
}
}
@media(max-width:1800px) {
.casual_ar .casual_av_cont .img_parent,
.casual_ar .casual_av_cont .main_img{
height: 580px;
margin-top: 25px;
}
.casual_ar .casual_av_cont .text h1 {
font-size: 35px;
line-height: 42px;
}
.casual_ar .casual_av_cont .text h1:nth-child(1) {
......@@ -3944,16 +4481,48 @@ header .right_side a:nth-child(4) {
.casual_ar .casual_av_cont .text p {
font-size: 25px;
/* color: black; */
}
.casual_ar .casual_av_cont .img_parent::after {
height: 99%;
height: 100%;
}
.casual_ar .casual_av_cont a
{
font-size: 24px;
bottom: 40px;
padding: 10px 35px;
}
}
@media(max-width:1500px) {
.casual_ar .casual_av_cont .img_parent,
.casual_ar .casual_av_cont .main_img{
height: 450px;
margin-top: 23px;
}
.casual_ar .casual_av_cont .text h1 {
font-size: 30px;
width: 90%;
line-height: 38px;
margin-bottom: 3px;
}
.casual_ar .casual_av_cont .text h1:nth-child(1) {
font-size: 48px;
margin-bottom: 40px;
}
.casual_ar .casual_av_cont .text p {
font-size: 22px ;
/* color: red; */
/* color: black; */
line-height: 28px;
width: 99%;
}
.casual_ar .casual_av_cont .img_parent::after {
left: -30px;
......@@ -3971,10 +4540,8 @@ header .right_side a:nth-child(4) {
}
.casual_ar .casual_av_cont .text p {
font-size: 25px;
line-height: 35px;
}
}
......@@ -3984,7 +4551,7 @@ header .right_side a:nth-child(4) {
@media(max-width:1441px) {
.casual_ar .casual_av_cont .img_parent::after {
height: 97%;
height: 100%;
}
}
......@@ -3995,19 +4562,22 @@ header .right_side a:nth-child(4) {
height: 100%;
left: -21px;
}
}
@media(max-width:1300px) {
.casual_ar {
/* background-color: red; */
.casual_ar .casual_av_cont .img_parent,
.casual_ar .casual_av_cont .main_img{
height: 420px;
margin-top: 20px;
}
.casual_ar .casual_av_cont .text {
margin-top: 10px;
}
.casual_ar .casual_av_cont .text h1:nth-child(1) {
font-size: 35px;
font-size: 45px;
line-height: 10px;
margin-top: -20px;
......@@ -4015,20 +4585,35 @@ header .right_side a:nth-child(4) {
.casual_ar .casual_av_cont .text h1 {
font-size: 30px;
line-height: 48px;
line-height: 38px;
width: 90%;
margin-bottom: 10px;
}
.casual_ar .casual_av_cont .text p {
font-size: 20px;
line-height: 32px;
line-height: 28px;
/* color: blue; */
}
.casual_ar .casual_av_cont a
{
font-size: 20px;
bottom: 40px;
padding: 10px 35px;
}
.casual_ar .casual_av_cont .main_img img
{
object-position: 80% 70%;
}
}
@media(max-width:1030px) {
.casual_ar .casual_av_cont .text h1:nth-child(1) {
margin-top: 20px;
font-size: 37px;
}
......@@ -4044,17 +4629,29 @@ header .right_side a:nth-child(4) {
}
.casual_ar .casual_av_cont .text p {
font-size: 18px;
font-size: 17px;
}
.casual_ar .casual_av_cont .text h1 {
font-size: 30px;
font-size: 28px;
width: 100%;
line-height: 32px;
line-height: 33px;
}
.casual_ar .casual_av_cont .img_parent, .casual_ar .casual_av_cont .main_img
{
height: 425px;
margin-top: 35px;
}
}
@media(max-width:800px) {
.casual_ar .casual_av_cont .img_parent, .casual_ar .casual_av_cont .main_img
{
height: 380px;
margin-top: 0px;
margin-bottom: 20px;
}
.casual_ar .casual_av_cont .img_parent::after {
height: 100%;
......@@ -4078,13 +4675,19 @@ header .right_side a:nth-child(4) {
transform: translateX(0);
margin-top: 0px;
}
.casual_ar .casual_av_cont a {
font-size: 18px;
bottom: 57px;
padding: 7px 35px;
}
}
@media(max-width:500px) {
.casual_ar .casual_av_cont .img_parent {
width: 100%;
position: relative;
height: 300px;
/* height: 300px; */
overflow: hidden;
clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
border-top-left-radius: 0 0%;
......@@ -4125,7 +4728,8 @@ header .right_side a:nth-child(4) {
font-size: 14px;
right: 30px;
padding: 5px 10px;
padding: 5px 15px;
bottom: 55px;
}
.casual_ar .casual_av_cont .text h1:nth-child(1) {
......@@ -4185,23 +4789,27 @@ header .right_side a:nth-child(4) {
.cosplay .cosplay_cont .text h1 {
color: white;
font-size: 45px;
font-size: 70px;
font-weight: 700;
width: 80%;
width: 100%;
direction: rtl;
/* margin-left: 10%; */
line-height: 42px;
line-height: 75px;
font-family: var(--font_noor_bold);
}
.cosplay .cosplay_cont .text p {
font-size: 30px;
font-size: 45px;
color: var(--text_color);
font-weight: normal;
font-family: var(--font_noor_light);
line-height: 38px;
line-height: 48px;
}
.cosplay .cosplay_cont .text p span
{
transform: translateX(10px);
display: block;
}
.cosplay .cosplay_cont .main_img {
overflow: visible;
}
......@@ -4273,7 +4881,7 @@ header .right_side a:nth-child(4) {
@media(max-width:2200px) {
.cosplay .cosplay_cont .text h1 {
font-size: 60px;
font-size: 57px;
line-height: 77px;
margin-top: 0;
width: 100%;
......@@ -4285,7 +4893,7 @@ header .right_side a:nth-child(4) {
}
.cosplay .cosplay_cont .text p {
font-size: 36px;
width: 75%;
width: 85%;
line-height: 52px;
}
.cosplay .cosplay_cont a
......@@ -4316,16 +4924,18 @@ header .right_side a:nth-child(4) {
@media(max-width:1800px) {
.cosplay .cosplay_cont .text h1 {
font-size: 45px;
line-height: 65px;
}
.cosplay .cosplay_cont .main_img,
.cosplay .cosplay_cont .img_parent
{
height: 520px;
height: 480px;
}
.cosplay .cosplay_cont .text p {
font-size: 26px;
font-size: 30px;
line-height: 38px;
margin-top: -10px;
}
......@@ -4385,28 +4995,39 @@ header .right_side a:nth-child(4) {
{
margin-top: 0;
}
.cosplay .cosplay_cont .text h1 {
line-height: 59px;
font-size: 43px;
}
.cosplay .cosplay_cont .text p {
font-size: 30px;
line-height: 38px;
width: 93%;
}
}
@media(max-width:1300px) {
.cosplay .cosplay_cont .text h1
{
line-height: 52px;
line-height: 46px;
font-size: 35px;
width: 80%;
}
.cosplay .cosplay_cont .main_img,
.cosplay .cosplay_cont .img_parent
{
height: 380px;
height: 350px;
}
.cosplay .cosplay_cont .text p {
font-size: 25px;
line-height: 38px;
font-size: 30px;
line-height: 32px;
width: 87%;
}
.cosplay .cosplay_cont a
{
font-size: 18px;
padding: 10px 27px;
}
.cosplay .cosplay_cont .img_parent::after {
......@@ -4416,29 +5037,31 @@ header .right_side a:nth-child(4) {
.cosplay .cosplay_cont .text h1 {
font-size: 30px;
margin-right: 15px;
}
.cosplay .cosplay_cont .text p {
font-size: 25px;
width: 88%;
}
}
@media(max-width:1030px) {
.cosplay .cosplay_cont .text h1
{
line-height: 52px;
line-height: 42px;
font-size: 30px;
width: 100%;
}
.cosplay .cosplay_cont .main_img,
.cosplay .cosplay_cont .img_parent
{
height: 380px;
height: 350px;
}
.cosplay .cosplay_cont .text p {
font-size: 22px;
line-height: 38px;
width: 100%;
line-height: 32px;
width: 98%;
}
......@@ -4476,7 +5099,15 @@ header .right_side a:nth-child(4) {
}
.cosplay .cosplay_cont .text p {
font-size: 25px;
font-size: 22px;
}
.cosplay .cosplay_cont .text p span
{
transform: translateX(0);
}
.cosplay .cosplay_cont .text h1 {
width: 81%;
}
}
......@@ -4519,7 +5150,7 @@ header .right_side a:nth-child(4) {
.cosplay .cosplay_cont .text p {
font-size: 18px;
line-height: 32px;
line-height: 30px;
}
.cosplay .cosplay_cont a {
......@@ -4541,6 +5172,11 @@ header .right_side a:nth-child(4) {
.cosplay .cosplay_cont .text p {
font-size: 16px;
}
.cosplay .cosplay_cont .text h1 {
width: 99%;
line-height: 32px;
}
}
@media(max-width:350px) {
......@@ -4969,6 +5605,7 @@ header .right_side a:nth-child(4) {
.Vr_zone .Vr_zone_cont .main_img {
position: relative;
height: 650px;
}
.Vr_zone .Vr_zone_cont .main_img::after {
......@@ -4979,7 +5616,7 @@ header .right_side a:nth-child(4) {
width: 100%;
height: 100%;
background: linear-gradient(to right,
rgba(150, 0, 200, 0.55),
#160b46);
opacity: .5;
}
......@@ -4993,7 +5630,7 @@ header .right_side a:nth-child(4) {
font-size: 20px;
font-family: var(--sora_extrabold);
font-weight: bold;
padding: 10px 50px;
padding: 10px 60px;
margin-top: 50px;
text-transform: uppercase;
color: var(--text_color);
......@@ -5018,6 +5655,16 @@ header .right_side a:nth-child(4) {
font-size: 36px ;
line-height: 48px;
width: 90%;
/* margin: 0; */
direction: rtl;
text-align: start;
}
.Vr_zone .Vr_zone_cont .text p:nth-child(3)
{
/* margin: 50px; */
/* color: red; */
margin: 0 -17px 0 0;
}
.Vr_zone_cont .text
{
......@@ -5029,7 +5676,7 @@ header .right_side a:nth-child(4) {
}
.Vr_zone .Vr_zone_cont .main_img
{
height: 550px;
height: 580px;
/* background: red; */
/* padding-bottom: 40px; */
}
......@@ -5039,16 +5686,18 @@ header .right_side a:nth-child(4) {
.Vr_zone .Vr_zone_cont .text h1 {
line-height: 80px;
line-height: 60px;
font-size: 50px;
/* color: black; */
}
.Vr_zone .Vr_zone_cont a
{
font-size: 30px;
}
.Vr_zone .Vr_zone_cont .main_img
{
height: 600px;
height: 630px;
}
}
......@@ -5066,11 +5715,12 @@ header .right_side a:nth-child(4) {
.Vr_zone .Vr_zone_cont .text p {
font-size: 30px ;
}
.Vr_zone .Vr_zone_cont .main_img
{
height: 550px;
height: 580px;
}
......@@ -5082,40 +5732,62 @@ header .right_side a:nth-child(4) {
}
.Vr_zone .Vr_zone_cont .text h1 {
font-size: 45px ;
line-height: 58px;
}
.Vr_zone .Vr_zone_cont .text p {
font-size: 26px ;
line-height: 38px;
}
.Vr_zone .Vr_zone_cont .main_img
{
height: 500px;
height: 540px;
}
}
@media(max-width:1780px)
{
.Vr_zone .Vr_zone_cont .main_img
{
height: 470px;
}
}
@media(max-width:1700px)
{
.Vr_zone .Vr_zone_cont .main_img
{
height: 500px;
}
.casual_av .casual_av_cont .text .casual_text p:nth-child(8)
{
transform: translateX(10px);
}
}
@media(max-width:1500px) {
.Vr_zone .Vr_zone_cont a
{
font-size: 20px;
}
.Vr_zone .Vr_zone_cont .text p {
font-size: 24px ;
font-size: 26px ;
width: 100%;
line-height: 40px;
line-height: 35px;
}
.Vr_zone .Vr_zone_cont .main_img
{
height: 470px;
height: 450px;
}
.Vr_zone .Vr_zone_cont .text h1
{
font-size: 40px;
line-height: 53px;
}
}
......@@ -5126,12 +5798,21 @@ header .right_side a:nth-child(4) {
}
.Vr_zone .Vr_zone_cont .text h1 {
font-size: 35px;
line-height: 52px;
line-height: 45px;
}
.Vr_zone .Vr_zone_cont .text p {
font-size: 25px;
}
.Vr_zone .Vr_zone_cont .main_img
{
height: 420px;
}
.casual_av .casual_av_cont .text .casual_text p:nth-child(8)
{
transform: translateX(45px);
}
}
@media(max-width:1030px)
......@@ -5147,7 +5828,11 @@ header .right_side a:nth-child(4) {
}
.Vr_zone .Vr_zone_cont .main_img
{
height: 450px;
height: 443px;
}
.Vr_zone .Vr_zone_cont .text p:nth-child(3)
{
margin: 0;
}
}
@media(max-width:800px) {
......@@ -5192,11 +5877,12 @@ header .right_side a:nth-child(4) {
.Vr_zone .Vr_zone_cont .text h1 {
font-size: 25px;
width: 100%;
line-height: 34px;
}
.Vr_zone .Vr_zone_cont .text p {
font-size: 18px;
line-height: 32px;
line-height: 30px;
}
.Vr_zone .Vr_zone_cont .a_parent {
......@@ -5217,12 +5903,12 @@ header .right_side a:nth-child(4) {
.Vr_zone .Vr_zone_cont .text h1 {
font-size: 20px;
width: 100%;
line-height: 38px;
line-height: 33px;
}
.Vr_zone .Vr_zone_cont .text p {
font-size: 16px;
line-height: 38px;
line-height: 30px;
}
}
......@@ -5250,7 +5936,7 @@ header .right_side a:nth-child(4) {
justify-content: center;
width: 90%;
margin-left: 5%;
background: linear-gradient(90deg, #410b67, #2b0c57, #160b46 40%);
background: linear-gradient(90deg, #120b42, #1f0c4e, #3f0b66 98%);
}
......@@ -5270,26 +5956,22 @@ header .right_side a:nth-child(4) {
.Vr_zone_ar .Vr_zone_ar_cont .text h1 {
color: white;
font-size: 30px;
font-size: 63px;
line-height: 72px;
font-weight: 700;
width: 100%;
direction: ltr;
margin-left: 0%;
font-family: var(--sora_font);
line-height: 42px;
font-family: var(--sora_extrabold);
}
.Vr_zone_ar .Vr_zone_ar_cont .text p {
font-size: 20px;
font-size: 35px;
line-height: 42px;
color: var(--text_color);
margin: 0;
font-weight: normal;
font-family: var(--sora_font);
line-height: 35px;
}
.Vr_zone_ar .Vr_zone_ar_cont img {
......@@ -5310,16 +5992,17 @@ header .right_side a:nth-child(4) {
.Vr_zone_ar .Vr_zone_ar_cont .main_img {
position: relative;
height: 800px;
}
.Vr_zone_ar .Vr_zone_ar_cont a {
background: var(--background_buttons);
background: linear-gradient(90deg, #1f0d4e,#480c6c,#a109ae);
outline: none;
border: none;
border-radius: 30px;
text-align: center;
font-size: 20px;
font-family: var(--sora_font);
font-size: 37px;
font-family: var(--sora_extrabold);
font-weight: bold;
padding: 10px 45px;
margin-top: 20px;
......@@ -5343,8 +6026,97 @@ header .right_side a:nth-child(4) {
opacity: .5;
opacity: .3;
}
@media(max-width:2200px)
{
@media(max-width:1800px) {
.Vr_zone_ar .Vr_zone_ar_cont a
{
font-size: 31.5px;
padding: 10px 60px;
}
.Vr_zone_ar .Vr_zone_ar_cont .text h1 {
font-size: 50px;
width: 100%;
line-height: 68px;
margin-bottom: 5px;
}
.Vr_zone_ar .Vr_zone_ar_cont .text
{
transform: translateX(-150px);
}
.Vr_zone_ar .Vr_zone_ar_cont .text p {
font-size: 36px;
line-height: 48px;
margin-top: 0;
margin-bottom: 0;
}
.Vr_zone_ar .Vr_zone_ar_cont .main_img
{
height: 780px;
}
}
@media(max-width:2000px)
{
.Vr_zone_ar .Vr_zone_ar_cont a
{
font-size: 30px;
padding: 10px 60px;
}
.Vr_zone_ar .Vr_zone_ar_cont .text h1 {
font-size: 47px;
width: 100%;
line-height: 60px;
margin-bottom: 5px;
}
.Vr_zone_ar .Vr_zone_ar_cont .text
{
transform: translateX(-150px);
}
.Vr_zone_ar .Vr_zone_ar_cont .text p {
font-size: 32px;
line-height: 40px;
margin-top: 0;
margin-bottom: 0;
}
.Vr_zone_ar .Vr_zone_ar_cont .main_img
{
height: 700px;
}
}
@media(max-width:1780px)
{
.Vr_zone_ar .Vr_zone_ar_cont a
{
font-size: 30px;
padding: 10px 60px;
/* color: red; */
}
.Vr_zone_ar .Vr_zone_ar_cont .text h1 {
font-size: 40px;
width: 100%;
line-height: 52px;
margin-bottom: 5px;
}
.Vr_zone_ar .Vr_zone_ar_cont .text
{
transform: translateX(-100px);
}
.Vr_zone_ar .Vr_zone_ar_cont .text p {
font-size: 26px;
line-height: 32px;
margin-top: 0;
width: 100%;
margin-bottom: 0;
}
.Vr_zone_ar .Vr_zone_ar_cont .main_img
{
height: 600px;
}
}
/* @media(max-width:1800px) {
.Vr_zone_ar .Vr_zone_ar_cont .text p {
font-size: 25px;
}
......@@ -5361,40 +6133,83 @@ header .right_side a:nth-child(4) {
.Vr_zone_ar .Vr_zone_ar_cont .text {
transform: translateX(-80px);
}
}
} */
@media(max-width:1500px) {
.Vr_zone_ar .Vr_zone_ar_cont .text p {
font-size: 20px;
font-size: 22px;
width: 100%;
/* color: rebeccapurple; */
line-height: 28px;
}
.Vr_zone_ar .Vr_zone_ar_cont .text h1 {
font-size: 30px;
line-height: 42px;
}
.Vr_zone_ar .Vr_zone_ar_cont .main_img
{
height: 540px;
}
.Vr_zone_ar .Vr_zone_ar_cont a
{
font-size: 25px;
padding: 10px 60px;
}
}
@media(max-width:1300px) {
.Vr_zone_ar .Vr_zone_ar_cont .main_img
{
height: 420px;
}
.Vr_zone_ar .Vr_zone_ar_cont .text p {
font-size: 18px;
font-size: 20px;
line-height: 26px;
}
.Vr_zone_ar .Vr_zone_ar_cont .text {
margin-top: 30px;
}
.Vr_zone_ar .Vr_zone_ar_cont .text h1 {
font-size: 30px;
font-size: 27px;
width: 90%;
line-height: 35px;
}
.Vr_zone_ar .Vr_zone_ar_cont .a_parent {
padding-bottom: 30px;
padding-bottom: 20px;
}
.Vr_zone_ar .Vr_zone_ar_cont a
{
font-size: 20px;
padding: 10px 60px;
}
}
@media(max-width:1030px) {
.Vr_zone_ar .Vr_zone_ar_cont .text {
transform: translateX(-40px);
transform: translateX(-65px);
}
.Vr_zone_ar .Vr_zone_ar_cont .text h1 {
font-size: 20px;
width: 90%;
line-height: 31px;
}
.Vr_zone_ar .Vr_zone_ar_cont .text p {
font-size: 17px;
line-height: 24px;
width: 100%;
}
.Vr_zone_ar .Vr_zone_ar_cont .main_img {
height: 390px;
}
.Vr_zone_ar .Vr_zone_ar_cont a {
font-size: 18px;
}
}
......@@ -5423,10 +6238,20 @@ header .right_side a:nth-child(4) {
}
.Vr_zone_ar .Vr_zone_ar_cont .main_img {
height: 300px;
height: 400px;
}
.Vr_zone_ar .Vr_zone_ar_cont .text h1
{
font-size: 25px;
line-height: 33px;
}
.Vr_zone_ar .Vr_zone_ar_cont .text p
{
line-height: 29px;
}
}
@media(max-width:500px) {
.Vr_zone_ar .Vr_zone_ar_cont>div {
width: 100%;
......@@ -5436,7 +6261,7 @@ header .right_side a:nth-child(4) {
.Vr_zone_ar .Vr_zone_ar_cont .text h1 {
font-size: 18px;
width: 100%;
line-height: 32px;
line-height: 26px;
}
.Vr_zone_ar .Vr_zone_ar_cont .text p {
......
thebase/thebase/the/style2.css
View file @ 20bc8b5b
......@@ -922,10 +922,7 @@
text-align: center;
}
.hidden {
transform: translateX(250%);
width: 0;
}
.hidden1 {
display: none !important;
......@@ -1034,17 +1031,17 @@
font-weight: bold;
text-decoration: none;
border: none;
border-top-left-radius: 8px;
border-bottom-left-radius: 8px;
border-top-left-radius: 20px;
border-bottom-left-radius: 20px;
background: linear-gradient(90deg, #aa09b4, #5f0b7d, #490b6d);
padding: 7px 20px;
display: block;
width: 35%;
width: 25%;
cursor: pointer;
outline: none;
text-align: start;
text-align: center;
margin-top: 50px;
margin-left: 65%;
margin-left: 75%;
font-size: 18px;
font-family: var(--font_noor_bold);
......@@ -1052,8 +1049,8 @@
}
.ticketing_sec_ar .btnn2 {
width: 30%;
margin-left: 70%;
/* width: 20%;
margin-left: 80%; */
}
.btn2_type {
......@@ -1063,15 +1060,15 @@
font-weight: bold;
text-decoration: none;
border: none;
border-top-left-radius: 8px;
border-bottom-left-radius: 8px;
border-top-left-radius: 20px;
border-bottom-left-radius: 20px;
background: linear-gradient(90deg, #aa09b4, #5f0b7d, #490b6d);
padding: 7px 20px;
display: block;
width: 35%;
cursor: pointer;
outline: none;
text-align: start;
text-align: center;
margin-top: 50px;
margin-left: 65%;
font-size: 18px;
......@@ -1088,15 +1085,15 @@
font-weight: bold;
text-decoration: none;
border: none;
border-top-left-radius: 8px;
border-bottom-left-radius: 8px;
border-top-left-radius: 20px;
border-bottom-left-radius: 20px;
background: linear-gradient(90deg, #aa09b4, #5f0b7d, #490b6d);
padding: 7px 20px;
display: block;
width: 45%;
cursor: pointer;
outline: none;
text-align: start;
text-align: center;
margin-top: 50px;
margin-left: 55%;
font-size: 18px;
......@@ -1133,6 +1130,11 @@
font-size: 47px;
line-height: 58px;
}
.btnn2
{
width: 20%;
margin-left: 80%;
}
.btnn2,
.btn2_type_s,
.btn2_type
......@@ -1147,6 +1149,10 @@
{
font-size: 55px;
}
.play_games h1
{
font-size: 60px;
}
}
@media(max-width:2000px)
{
......@@ -1186,6 +1192,7 @@
}
@media(max-width:1880px) {
.ticketing_section .title img
{
width: 500px;
......@@ -1339,6 +1346,13 @@
margin: 30px 0 0 60%;
}
}
@media(max-width:1440px)
{
.ticketing_section_ar .days_t .text p, .ticketing_section_ar .days .text p {
font-size: 25px;
line-height: 35px;
}
}
@media(max-width:1300px) {
......@@ -1356,11 +1370,18 @@
font-size: 25px;
line-height: 38px;
}
.btnn2
{
width: 20%;
/* background: red; */
margin-left: 80%;
}
.btnn2,
.btn2_type_s,
.btn2_type
{
font-size: 18px;
transform: translateX(30px);
}
.ticketing_section .ticket_type h1
{
......@@ -1415,15 +1436,23 @@
@media(max-width:1030px) {
.btnn2, .btn2_type_s, .btn2_type
{
transform: translateX(0);
}
.ticketing_section .title img
{
width: 450px;
}
.ticketing_section .days .text p {
line-height: 32px;
font-size: 18px;
line-height: 33px;
font-size: 25px;
}
.btnn2 {
width: 25%;
/* background: red; */
margin-left: 75%;
}
.ticketing_section .days_t .text p {
font-size: 18px;
line-height: 32px;
......@@ -1736,8 +1765,8 @@
.ticketing_section .ticket_types .days_t,
.ticketing_section .ticket_types .days_t:nth-child(2) {
border-top-left-radius: 20px;
border-top-right-radius: 20px;
border-top-left-radius: 0px;
border-top-right-radius: 0px;
}
......@@ -1970,7 +1999,7 @@
.vr-section {
display: flex;
align-items: center;
align-items: start;
justify-content: center;
width: 95%;
/* padding: 0 0 70px; */
......@@ -2000,14 +2029,14 @@
left: 0;
width: 100%;
height: 100%;
background: linear-gradient(45deg, var(--title_color) 0%, #0d0d41b8 75%);
background: linear-gradient(90deg, var(--title_color) 0%, #200c4e 75%);
opacity: 0.4;
}
.vr-con {
width: 45%;
background: var(--gradient);
padding: 40px;
padding: 40px 40px 0;
height: auto;
box-sizing: border-box;
}
......@@ -2041,17 +2070,21 @@
width: 100%;
color: var(--text_color);
font-family: var(--font_noor_light);
font-size: 40px;
}
.arbt {
margin-left: 20%;
margin-left: 0%;
width: 100%;
direction: ltr;
font-family: var(--font_noor_bold);
font-size: 70px;
}
/* الزر */
.vr-btn1 {
background: var(--background_buttons);
background: linear-gradient(to right, #0d0d4138 20%, #6a1a97, #a809b3);
outline: none;
border: none;
border-radius: 30px;
......@@ -2064,6 +2097,7 @@
margin-bottom: 20px;
text-transform: uppercase;
color: white;
margin-top: 30px;
}
/* .vr-btn1:hover {
......@@ -2086,13 +2120,14 @@
}
.arb {
font-size: 36px;
width: 76%;
margin-left: 20%;
width: 90%;
margin-left: 10%;
}
.vr-btn1
{
font-size: 31.5px;
margin-top: 30px;
}
.vr-image
{
......@@ -2116,7 +2151,8 @@
.vr-btn1
{
font-size: 30px;
margin-top: 60px;
margin-top: 20px;
transform: translateX(-80px);
}
}
@media(max-width:1850px) {
......@@ -2153,7 +2189,7 @@
.vr-btn1
{
font-size: 30px;
margin-top: 160px;
margin-top: 10px;
/* background: red; */
}
.vr-image
......@@ -2179,7 +2215,7 @@
.vr-btn1
{
font-size: 27px;
margin-top: 30px;
margin-top: 10px;
}
.vr-image
{
......@@ -2259,7 +2295,46 @@
margin-bottom: 40px;
}
}
@media(max-width:1440px)
{
.arb {
font-size: 30px;
line-height: 36px;
}
.vr-image {
height: 470px;}
.arbt {
margin-bottom: 30px;
}
}
@media(max-width:1300px)
{
.vr-image
{
height: 380px;
/* background: red; */
}
.arb
{
line-height: 30px;
font-size: 25px;
}
.arbt {
margin-bottom: 25px;
font-size: 40px;
}
}
@media(max-width:1100px)
{
.vr-image
{
height: 420px;
/* background: red; */
}
}
/* ===== التابلت (1024px) ===== */
@media (max-width: 1024px) {
......@@ -2275,7 +2350,7 @@
.vr-image,
.vr-con {
width: 48%;
height: auto;
height: 370px;
/* min-height: 350px; */
}
......@@ -2450,6 +2525,7 @@
@media(max-width:500px) {
.vr-btn1 {
width: 50%;
transform: translateX(0);
}
}
......@@ -3918,8 +3994,8 @@ body {
outline: none;
text-align: start;
box-sizing: border-box;
font-size: 15px;
font-family: var(--noor_font);
font-size: 20px;
font-family: var(--font_noor_bold);
flex-direction: row-reverse;
direction: ltr;
}
......@@ -3939,18 +4015,70 @@ body {
.hero_desc_res_ar p {
font-size: 25px;
font-weight: 700;
font-family: var(--main-font);
font-family: var(--font_noor_light);
width: 100%;
line-height: 32px;
color: var(--text_color);
}
.hero_desc_res_ar h3 span {
color: #be2fbe;
}
@media(max-width:2200px)
{
.word21 {
font-size: 70px;
top: 20%;
left: -3%;
}
.mainiMg1
{
height: 900px;
}
.word22 {
font-size: 61px;
top: 28%;
left: 1.5%;
}
.hero-sec21 {
left: 5.5%;
top: 36%;
font-size: 40px;
}
.hero-sec22 {
left: 5.5%;
top: 41%;
font-size: 40px;
}
.hero-sec23 {
font-size: 40px;
left: 4%;
top: 45.5%;
}
.hero-sec24 {
font-size: 40px;
left: 3.5%;
top: 50%;
}
.hero-sec25 {
font-size: 40px;
left: 2.5%;
top: 55%;
}
.hero_section2 a
{
bottom: 20%;
top: unset;
}
}
/* zoom Out 60% */
@media(max-width:2150px) {
.word21 {
top: 28%;
top: 20%;
left: -23%;
font-size: 79px;
width: 70%;
......@@ -3962,12 +4090,12 @@ body {
font-size: 79px;
}
.mainiMg1 {
height: 100%;
/* height: 100%; */
width: 58%;
right: -38% !important;
}
.word22 {
top: 40%;
top: 29%;
left: -28%;
font-size: 65px;
width: 70%;
......@@ -3976,57 +4104,142 @@ body {
.hero-sec21 {
left: 6%;
top: 51%;
font-size: 36px;
top: 38%;
font-size: 40px;
font-family: var(--font_noor_light);
}
.hero-sec22 {
left: -19%;
top: 43%;
font-size: 40px;
width: 60% !important;
font-family: var(--font_noor_light);
}
.hero-sec23 {
left: 4.5%;
top: 47%;
font-size: 40px;
font-family: var(--font_noor_light);
}
.hero-sec24 {
left:-20.5%;
top: 52%;
font-size: 40px;
width: 60% !important;
font-family: var(--font_noor_light);
}
.hero-sec25 {
font-size: 40px;
left: 3.5%;
top: 57%;
font-size: 36px;
font-family: var(--font_noor_light);
}
.hero_section2 a {
font-size: 16px;
top: unset;
height: 7%;
width: 32%;
font-family: var(--font_noor_light);
}
}
@media(max-width:2600px) {
.word21 {
top: 20%;
left: -22%;
font-size: 69px;
width: 70%;
/* color: red; */
}
.word21 {
top: 20%;
left: -22%;
font-size: 69px;
width: 70%;
/* color: blue; */
}
.word21 .the{
font-weight: bolder;
font-size: 69px;
}
.mainiMg1 {
height: 800px;
width: 58%;
right: -38% !important;
}
.word22 {
top: 28%;
left: -28%;
font-size: 65px;
width: 70%;
font-size: 69px;
}
.hero-sec21 {
left: 6%;
top: 36%;
font-size: 38px;
font-family: var(--font_noor_light);
}
.hero-sec22 {
left: -19%;
top: 41%;
font-size: 38px;
width: 60% !important;
font-family: var(--font_noor_light);
}
.hero-sec23 {
left: 5.5%;
top: 63%;
font-size: 36px;
top: 46%;
font-size: 38px;
font-family: var(--font_noor_light);
}
.hero-sec24 {
left:-20.5%;
top: 69%;
font-size: 36px;
top: 51%;
font-size: 38px;
width: 60% !important;
font-family: var(--font_noor_light);
}
.hero-sec25 {
font-size: 36px;
font-size: 38px;
left: 3.5%;
top: 75%;
top: 56%;
font-family: var(--font_noor_light);
}
.hero_section2 a {
font-size: 20px;
top: 850px;
font-size: 16px;
top: unset ;
height: 7%;
width: 28%;
bottom: 26%;
width: 32%;
font-family: var(--font_noor_light);
}
}
@media(max-width:2000px) {
.word21 {
top: 28%;
left: -23%;
top: 20%;
left: -22%;
font-size: 69px;
width: 70%;
/* color: blue; */
}
......@@ -4035,12 +4248,12 @@ body {
font-size: 69px;
}
.mainiMg1 {
height: 100%;
height: 800px;
width: 58%;
right: -38% !important;
}
.word22 {
top: 40%;
top: 28%;
left: -28%;
font-size: 65px;
width: 70%;
......@@ -4049,59 +4262,132 @@ body {
.hero-sec21 {
left: 6%;
top: 51%;
font-size: 33px;
top: 36%;
font-size: 38px;
font-family: var(--font_noor_light);
}
.hero-sec22 {
left: -19%;
top: 57%;
font-size: 33px;
top: 41%;
font-size: 38px;
width: 60% !important;
font-family: var(--font_noor_light);
}
.hero-sec23 {
left: 5.5%;
top: 63%;
font-size: 33px;
top: 46%;
font-size: 38px;
font-family: var(--font_noor_light);
}
.hero-sec24 {
left:-20.5%;
top: 69%;
font-size: 33px;
top: 51%;
font-size: 38px;
width: 60% !important;
font-family: var(--font_noor_light);
}
.hero-sec25 {
font-size: 33px;
font-size: 38px;
left: 3.5%;
top: 75%;
top: 56%;
font-family: var(--font_noor_light);
}
.hero_section2 a {
font-size: 20px;
top: 750px;
font-size: 16px;
top: unset ;
height: 7%;
width: 28%;
bottom: 26%;
width: 32%;
font-family: var(--font_noor_light);
}
}
/* Zoom Out 70% */
@media(max-width:1950px) {
.word21 {
/* color: red; */
top: 30%;
left: -22%;
font-size: 65px;
/* color: red; */
}
.word1 .the
{
font-size: 65px;
}
.mainiMg1 {
height: auto;
}
.word22 {
top: 41%;
left: -28%;
font-size: 65px;
}
.hero-sec21 {
top: 51%;
left: 6%;
/* font-size: 40px; */
}
.hero-sec22 {
top: 57%;
left: -19.5%;
}
.hero-sec23 {
top: 63%;
left: 5%;
}
.hero-sec24 {
top: 69%;
left: -20.5%;
/* color: gray; */
}
.hero-sec25 {
top: 75%;
left: 4%;
/* color: red; */
}
.hero_section2 a {
top: 740px;
width: 32%;
/* color: black; */
}
}
@media(max-width:1830px) {
.word21 {
/* color: red; */
top: 30%;
left: -22%;
font-size: 65px;
/* color: red; */
}
.word1 .the
......@@ -4173,8 +4459,8 @@ body {
@media(max-width:1800px) {
.word21 {
/* color: rebeccapurple; */
top: 31%;
left: -21%;
top: 33%;
left: -22%;
font-size: 58px;
/* color: red; */
......@@ -4190,7 +4476,7 @@ body {
.word22 {
top: 41.5%;
top: 43.5%;
left: -27.5%;
font-size: 52px;
......@@ -4248,6 +4534,7 @@ body {
@media(max-width:1440px) {
/* .hero_section2
......@@ -4327,7 +4614,7 @@ body {
top: 620px;
width: 32%;
font-size: 28px;
font-size: 16px;
display: flex;
align-items: center;
......@@ -4347,8 +4634,8 @@ body {
.word21 {
top: 39%;
left: -22%;
top: 35%;
left: -21%;
font-size: 50px;
}
......@@ -4360,15 +4647,15 @@ body {
}
.word22 {
top: 50%;
left: -29%;
top: 45%;
left: -28%;
font-size: 42px;
}
.hero-sec21 {
top: 59%;
top: 55%;
left: 7%;
font-size: 28px;
......@@ -4376,16 +4663,16 @@ body {
.hero-sec22 {
top: 65%;
left: -17.5%;
top: 61%;
left: -18%;
width: 100%;
font-size: 28px;
}
.hero-sec23 {
top: 71%;
left: 7%;
top: 67%;
left: 6.5%;
width: 100%;
font-size: 28px;
......@@ -4393,7 +4680,7 @@ body {
.hero-sec24 {
top: 77%;
top: 74%;
left: -19%;
font-size: 28px;
......@@ -4401,17 +4688,17 @@ body {
.hero-sec25 {
top: 84%;
top: 81%;
font-size: 28px;
left: 5%;
left: 4%;
}
.hero_section2 a {
top: 620px;
top: 600px;
width: 32%;
font-size: 28px;
font-size: 16px;
display: flex;
align-items: center;
......@@ -4479,7 +4766,7 @@ body {
.hero_section2 a {
top: 570px;
font-size: 24px;
font-size: 16px;
}
}
......@@ -4574,7 +4861,7 @@ body {
top: unset;
width: 100%;
position: relative;
font-size: 20px;
font-size: 16px;
}
.hero_desc_ar {
......@@ -4602,7 +4889,7 @@ body {
@media(max-width:500px) {
.hero_section2 {
grid-template-columns: 100%;
padding: 50px 5% 0;
padding: 0px 5% 0;
}
.hero_desc_res_ar h3 {
......@@ -4643,10 +4930,17 @@ body {
.hero_section2 {
grid-template-columns: 100%;
padding: 50px 3% 0;
padding: 0px 3% 0;
}
}
@media(max-width:350px)
{
.letters>div div:nth-child(2) {
margin-left: 0%;
margin-right: 0%;
}
}
/* ====================================== */
/* ===============Activate================= */
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment