<!DOCTYPE html>
<html lang="az">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>DervislerTour.com — Tezliklə xidmətinizdə</title>
<meta name="description"
content="DervislerTour.com — Ziyarət və tur xidmətləri. Saytımız yenilənir və tezliklə xidmətinizdə olacaq.">
<style>
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
html, body {
width: 100%;
height: 100%;
}
body {
font-family: Georgia, "Times New Roman", serif;
background:
radial-gradient(circle at center, rgba(255,255,255,.08), transparent 35%),
linear-gradient(135deg, #031f1a, #063b31 45%, #021512);
color: #f8e8b0;
overflow: hidden;
}
/* Ulduzlar */
.stars {
position: fixed;
inset: 0;
overflow: hidden;
z-index: 0;
}
.stars span {
position: absolute;
width: 3px;
height: 3px;
background: #f8e8b0;
border-radius: 50%;
opacity: .7;
animation: twinkle 3s infinite ease-in-out;
}
.stars span:nth-child(1) { top: 12%; left: 10%; animation-delay: .3s; }
.stars span:nth-child(2) { top: 24%; left: 80%; animation-delay: 1s; }
.stars span:nth-child(3) { top: 70%; left: 15%; animation-delay: 1.7s; }
.stars span:nth-child(4) { top: 82%; left: 75%; animation-delay: .8s; }
.stars span:nth-child(5) { top: 35%; left: 45%; animation-delay: 2s; }
.stars span:nth-child(6) { top: 60%; left: 90%; animation-delay: 1.2s; }
.stars span:nth-child(7) { top: 8%; left: 55%; animation-delay: 2.4s; }
.stars span:nth-child(8) { top: 90%; left: 45%; animation-delay: .5s; }
@keyframes twinkle {
0%, 100% { opacity: .2; transform: scale(.7); }
50% { opacity: 1; transform: scale(1.4); }
}
/* Ay */
.moon {
position: absolute;
top: 55px;
right: 8%;
width: 90px;
height: 90px;
border-radius: 50%;
background: #f8e8b0;
box-shadow: 0 0 35px rgba(248,232,176,.35);
z-index: 1;
}
.moon::after {
content: "";
position: absolute;
top: -12px;
left: 20px;
width: 90px;
height: 90px;
border-radius: 50%;
background: #06382f;
}
/* Əsas konteyner */
.container {
position: relative;
z-index: 2;
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
padding: 25px;
}
.card {
width: min(900px, 95%);
text-align: center;
padding: 55px 35px;
border: 1px solid rgba(248,232,176,.4);
border-radius: 28px;
background: rgba(0, 20, 16, .55);
backdrop-filter: blur(10px);
box-shadow:
0 0 60px rgba(0,0,0,.45),
inset 0 0 40px rgba(248,232,176,.04);
animation: appear 1.5s ease;
}
@keyframes appear {
from {
opacity: 0;
transform: translateY(30px) scale(.96);
}
to {
opacity: 1;
transform: translateY(0) scale(1);
}
}
/* İslami ornament */
.ornament {
font-size: 38px;
margin-bottom: 15px;
animation: float 4s infinite ease-in-out;
}
@keyframes float {
0%, 100% { transform: translateY(0); }
50% { transform: translateY(-7px); }
}
.brand {
font-family: Georgia, serif;
font-size: clamp(38px, 8vw, 76px);
letter-spacing: 3px;
color: #f8e8b0;
text-shadow: 0 0 20px rgba(248,232,176,.2);
margin-bottom: 18px;
}
.line {
width: 150px;
height: 2px;
margin: 0 auto 30px;
background: linear-gradient(
to right,
transparent,
#f8e8b0,
transparent
);
}
h1 {
font-size: clamp(25px, 5vw, 45px);
line-height: 1.25;
margin-bottom: 20px;
color: #fff3c9;
}
.arabic {
direction: rtl;
font-size: clamp(22px, 4vw, 32px);
color: #d9c17c;
margin: 25px 0;
line-height: 1.8;
}
.description {
max-width: 680px;
margin: auto;
color: #d8d2bb;
font-family: Arial, sans-serif;
font-size: 16px;
line-height: 1.8;
}
/* Gözləmə göstəricisi */
.loader {
display: flex;
justify-content: center;
gap: 8px;
margin: 35px 0 25px;
}
.loader div {
width: 10px;
height: 10px;
border-radius: 50%;
background: #f8e8b0;
animation: loading 1.4s infinite ease-in-out both;
}
.loader div:nth-child(1) { animation-delay: -.32s; }
.loader div:nth-child(2) { animation-delay: -.16s; }
@keyframes loading {
0%, 80%, 100% {
transform: scale(0);
}
40% {
transform: scale(1);
}
}
.footer {
margin-top: 25px;
font-family: Arial, sans-serif;
color: #aaa58f;
font-size: 14px;
}
.signature {
margin-top: 12px;
color: #f8e8b0;
font-weight: bold;
letter-spacing: .5px;
}
/* Mobil */
@media (max-width: 600px) {
.card {
padding: 40px 22px;
border-radius: 20px;
}
.moon {
width: 55px;
height: 55px;
top: 25px;
right: 25px;
}
.moon::after {
width: 55px;
height: 55px;
left: 12px;
top: -7px;
}
.description {
font-size: 14px;
}
}
</style>
</head>
<body>
<div class="stars">
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
</div>
<div class="moon"></div>
<main class="container">
<section class="card">
<div class="ornament"></div>
<div class="brand">DervislerTour.com</div>
<div class="line"></div>
<h1>
Saytımız yenidir və<br>
tezliklə xidmətinizdə olacaq
</h1>
<div class="arabic">
بِسْمِ اللَّهِ الرَّحْمَنِ الرَّحِيمِ
</div>
<p class="description">
Müqəddəs ziyarətlər, mənəvi səfərlər və unudulmaz
səyahətlər üçün DervislerTour.com hazırlanır.
Yenilənmiş saytımızda sizə daha geniş xidmətlər,
ziyarət proqramları və səyahət imkanları təqdim edəcəyik.
</p>
<div class="loader">
<div></div>
<div></div>
<div></div>
</div>
<div class="footer">
Səbir etdiyiniz üçün təşəkkür edirik.
<div class="signature">
Hörmətlə, iapServer İmran Əli
</div>
</div>
</section>
</main>
</body>
</html>