@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap');

*
{
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}
a
{
 color: white;
 text-decoration: none;
}


h1,h2,h3,h4,h5,h6, 
{
	 font-family: "Lato", sans-serif;
}
p 
{
	 font-family: "Open Sans", sans-serif;
}
img
{
	width: 100%;
	display: block;
}

.button
{
	background-color:#DE3163;
	color: white;
	padding:8px;
	border-radius:12px;
}
.button:hover
{
	border:1px solid #DE3163;
	background-color: black;
}

.head
{
	padding-left: 5%;
	padding-right: 5%;
	padding-top: 0.5%;
	padding-bottom: 0.5%;
	background-color: black;
	
}

.head_container
{
	
	display:flex;
	max-width: 1920px;
	gap: 32px;
	align-items:center;
}

.head_1 
{
	width:15%;
}

.head_2 
{
	width:70%;
	
}
.head_3 
{
	width:15%;
}
.head_2 p  
{
	color: white;
	font-size:14px;
}

.head_3 a 
{
	text-decoration:none;
}


.pages
{
	background-color:black;
     color: white;
      padding:5px;
      border: none;
      border-radius:12px;
      padding-left:2%;
      padding-right:2%;
    font-size: 16px;
      cursor: pointer;
      transition: background-color 0.3s ease;
      text-decoration: none;
      display: inline-block;
 }

 .pages:hover
  {
      background-color: #DE3163;
      transform: scale(0.9);

  }

/*about*/
.about 
{
	padding:5%;
	background-color:#252525;
	
}
.about_container
{
	max-width: 1920px;
	margin: auto;
	gap: 32px;
	display: flex;
	align-items: center;
}
.about_1
{
	width:40%;
	
}
.about_2
{
	width:60%;
}
.about_2 h1 
{
	font-size:25px;
	color:#DE3163;
	padding: 2%;
}
.about_2 p 
{
	text-align: justify;
	margin-left: 2%;
	margin-right: 2%;
	font-size:14px;
	line-height:1.8;
	color: white;
}
.about_1 img 
{
	border-radius:32px;
}

.services
{
	padding: 5%;
	background-color:rgba(0, 0, 0, 0.481);
}
.services_container
{
	max-width: 1920px;
	display: flex;
	gap: 16px;
	flex-wrap: wrap;
}
.services_1 
{
	width: 100%;
	text-align: center;
	margin-top: 2%;
	margin-bottom: 2%;
}

.services_box
{
	width:23.5%;
	border: 1px solid white;
	border-radius: 8px;
}

.services_box h3
{
	color:#DE3163;
	margin-top: 16px;
	text-align: center;
}

.services_1 h2
{
	color:#DE3163;
}
.services_1 p 
{
	color:white;
	margin-top: 1%;
	margin-bottom: 1%;
}
.services_box p 
{
	text-align: center;
	font-size:20px;
	color: white;
}
.services_1 a
{
  color: white;
}

/*benifits*/

.benifits
{
	padding-top: 8%;
	padding-bottom: 8%;
	padding-left: 5%;
	padding-right: 5%;
	background-color: #DE3163;
}

.benifits_container
{
	max-width: 1920px;
	display: flex;
	gap: 16px;
}
.benifits_box
{
	width: 100%;
	text-align: center;
}
.benifits_box h5  
{
	
	font-size:30px;
}
.benifits_box h2 
{
	margin-top: 1%;
	margin-bottom: 1%;
	color:white;
}
.benifits_box p 
{
	font-size:14px;
	line-height: 1.8;
	color: white;
	text-align: center;
}

/*cusomized*/

.customized
{
	padding:5%;
	background-color:black;
	
}
.customized_container
{
	display: flex;
	max-width: 1920px;
	gap:16px;
	flex-wrap: wrap;
	
}
.customized_1
{
	width: 100%;
	text-align: left;
	color:#DE3163;
	
}
.customized_box
{
	width:23.5%;
	border: 1px solid #DE3163;
	
}

.customized_box h4 
{
	text-align: center;
	margin-top: 2%;
	margin-bottom:2%;
	color:#DE3163;

}
.customized_box p 
{
	text-align: center;
	font-size:13px;
	line-height:2;
	color: white;
}

.RM 
{
	background-color:black;
     color: white;
      padding:8px;
      border: none;
      border-radius:12px;
      margin-left: 25%;
    	margin-top:5%;
    	margin-bottom:5%;
      font-size: 16px;
      cursor: pointer;
      transition: background-color 0.3s ease;
      text-decoration: none;
      display: inline-block;
      border: 1px solid white;
}

.RM:hover
  {
      background-color: #DE3163;
      transform: scale(0.9);

  }

/*booking*/

.booking
{
	padding: 3%;
	background-color:#252525;

}
.booking_container
{
	max-width: 1920px;
	display: flex;
	gap: 16px;
	flex-wrap: wrap;
}
.booking_1
{
	width: 100%;
	text-align: center;
	
}
.booking_steps
{
	width:100%;
	box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
	text-align: center;
	border: 1px solid white;
	padding:.5%;
	border-radius: 8px;
}

.booking_1 h1 
{
	margin-top: 2%;
	margin-bottom:2%;
	color:#DE3163;
} 


.booking_steps h3 
{
	color:#DE3163;
	margin-top:2%;
	margin-bottom:2%;
}

.booking_steps p 
{
	font-size:14px;
	line-height:2;
	color: white;
}

/*service details page */

.service_details
{
	text-align: center;
	padding: 5%;
	background-color:#252525;

}


.details_container
{
	display: flex;
	margin: auto;
	gap: 32px;
	max-width: 1920px;
	flex-wrap: wrap;
	align-items: center
}

.details_1
{
	width: 100%;
	text-align: center;
	
	color:#DE3163;
	margin-top:1%;
	margin-bottom:1%;
}

.details_2 
{
	width:22%;
}
.details_3 
{
	width:30.2%;
}

.details_2 h2 
{
	color:#DE3163;
	text-align: center;
	margin-top: 2%;
	margin-bottom: 2%;
}

.details_2 img 
{
	border-radius:30px;
	
}
.details_2 img:hover
{
	border: 2px dotted #DE3163;

}

.book-now-btn
  {
      background-color:black;
     color: white;
      padding:8px;
      border: none;
      border-radius:12px;
    	margin-top:5%;
      font-size: 16px;
      cursor: pointer;
      transition: background-color 0.3s ease;
      text-decoration: none;
      display: inline-block;
      border: 1px solid white;
    }

    .book-now-btn:hover {
      background-color: #DE3163;
    }

     /* class Styles */

    .class
    {
    	
    	background-color: black;
    }
    .class_conatiner
    {
    	max-width: 1920px;
    	display: flex;
    	margin: auto;
    	gap: 16px;

    }

    .class_1
    {
    	width:100%;
    	padding:6%;
    }

    
   	.class_1 h1 
   	{
   		color:#DE3163;
   		margin-top: 2%;
   		margin-bottom: 2%;
   	}
   	.class_1 h2 
   	{
   		color:#DE3163;
   		margin-bottom: 2%;
   	}
   	.class_1 p 
   	{
   		color: white;
   		font-size:14px;
   		text-align: justify;
   		line-height:1.5;

   	}

 /*russian benifits*/

    .r_benifits
    {
    	padding:5%;
    	background-color: #DE3163;
    }
    .r_conatainer
    {
    	display: flex;
    	max-width: 1920px;
    	text-align: center;
    }

    .russian_1
    {
    	border: 1px solid black;
    	border-radius: 8px;
    	padding: 1%;
    }
    .russian_1 h1
    {
    	text-align: center;
	}
	
    .russian_1 h2 
    {
    	color: white;
    	text-align: center;

    }
	
    .russian_1 p 
    {
    	color: white;
    	text-align: center;
    	margin-top: 2%;
    	font-size: 14px;
    	line-height: 2;
    }

/* Footer Styles */
.footer {
    background: #222;
    color: #fff;
    padding:5%;

    
}

/* Footer Container */
.footer-container {
    display: flex;
    justify-content: space-around;
    max-width: 1200px;
    margin: 0 auto;
    flex-wrap: wrap;
}

/* Footer Logo Section */
.footer-logo {
    text-align:center;
    width: 30%;
    margin-bottom: 20px;
}

.footer-logo img  {
  width:40%;
  margin-left: 25%;
  color: #fff;
}

.footer-logo p {
    font-size: 14px;
    line-height: 2;
    color: #ccc;
}

/* Footer Links Section */
.footer-links {
    width: 30%;
    margin-bottom: 20px;
}

.footer-links h3 {
    font-size: 18px;
    margin-bottom: 15px;
    color:#DE3163 ;
}

.footer-links ul {
    list-style: none;
}

.footer-links ul li {
    margin: 8px 0;
}

.footer-links ul li a {
    color: #ccc;
    text-decoration: none;
    transition: color 0.3s ease;
}

.footer-links ul li a:hover {
    color: #f1c40f;
}

/* Footer Social Section */
.footer-social {
    width: 30%;
    margin-bottom: 20px;
}

.footer-social h3 {
    font-size: 18px;
    margin-bottom: 15px;
    color:#DE3163;
}
.footer-social p 
{
	font-size:12px;
	margin-top: 3%;
	margin-bottom: 3%;
}

.social-icons {
    display: flex;
    justify-content: space-between;
}

.social-icon {
    font-size: 20px;
    color: #ccc;
    transition: color 0.3s ease;
}

.social-icon:hover {
    color: #f1c40f;
}

/* Footer Bottom Section */
.footer-bottom {
    margin-top: 40px;
    font-size: 14px;
    color: #aaa;
}

/* Hover Effects and Transitions */
.footer-links ul li a {
    transition: transform 0.3s ease;
}

.footer-links ul li a:hover {
    transform: scale(1.1);
}

.social-icon {
    transition: transform 0.3s ease;
}

.social-icon:hover {
    transform: scale(1.2);
}

/* Responsive Design */
@media screen and (max-width: 768px) {
    .footer-container {
        flex-direction: column;
        align-items: center;
    }
    .footer-logo,
    .footer-links,
    .footer-social {
        width: 80%;
        text-align: center;
    }
}

@media all and (max-width : 480px) 
{
	.head_2{display: none;}
	.head_1{width: 50%}
	.head_3{width: 40%}
	.about_container{flex-wrap: wrap; flex-direction: column-reverse;}
	.about_1, .about_2{width: 100%;}

	.services_container,.services_box {width: 100%}

	.service_details ,.details_2{width: 100%}

	.customized_1,.customized_box{width: 100%}
}