/*	@font-face {
				  font-family: myFirstFont;
				  src: url(sansation_light.woff);
				}*/
body{
	/*background: linear-gradient(to right,#74130f,#000000);*/
	background-image: url(image/qaafilaa-image.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-attachment: fixed;
}
.body_h1div{
	font-family: 'Roboto Condensed', sans-serif;
}
.body_pdiv{
	font-size: 18px;
	/*font-family: 'Roboto Condensed', sans-serif;*/
}
a, a:hover{
	text-decoration: none;
	color: white;
}
.main_cont{
	margin:0px 20px 0px 20px;
	position: fixed;
	width: 97%;
	height: 100%;
}
.nav-item{
	font-family: Gilory-Light;
	font-weight: 100;
}

.active{
	font-weight: 900;
	font-family: Gilroy-ExtraBold;
}
.main_bodydiv{
	/*background: linear-gradient(to right,#74130f,#000000);*/
	height: 100vh;
	width: 100%;
	background-attachment:fixed;
	position:fixed;
	top: 57px !important;
	padding-top: 3px;
}
.main_div{
	background-image: url(image/dark-back.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	height: 88%;
	transition: 10s;
	animation-name:mymove;
	animation-direction: alternate;
	animation-duration: 5s ;
	animation-fill-mode: forwards; 
	animation-iteration-count:infinite; 
	animation-play-state:running; 
	animation-timing-function:ease-in-out; 
}
@keyframes mymove {
	50%{
		background-image: url(image/team-banner.jpg);
	}
}
.about_div{
	background-image: url(image/about-banner.jpg);
	height: 100vh;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	transition: 10s;
	animation-name: jump;
	animation-direction: alternate;
	animation-duration: 5s ;
	animation-fill-mode: forwards; 
	animation-iteration-count:infinite; 
	animation-play-state:running; 
	animation-timing-function:ease-in-out; 
}
@keyframes jump {
	50%{
		background-image: url(image/team-banner.jpg);
	}
}
.team_div{
	background-image: url(image/team-banner.jpg);
	background-repeat: repeat-x;
	background-size: cover;
	background-position: center;
	-webkit-animation: 900000s backgroundScroll infinite linear;
	-moz-animation: 900000s backgroundScroll infinite linear;
	-o-animation: 900000s backgroundScroll infinite linear;
	-ms-animation: 900000s backgroundScroll infinite linear;
	animation: 900000s backgroundScroll infinite linear;
}
@-webkit-keyframes backgroundScroll {
	from {
		background-position: 0 0;
	}
	to {
		background-position: -99999999px 0;
	}
}
@keyframes backgroundScroll {
	from {
		background-position: 0 0;
	}
	to {
		background-position: -99999999px 0;
	}
}
.films_div{
	background-image: url(image/film-shoot6.jpg);
	background-repeat: repeat-x;
	background-size: cover;
	background-position: center;
	-webkit-animation: 900000s backgroundScroll infinite linear;
	-moz-animation: 900000s backgroundScroll infinite linear;
	-o-animation: 900000s backgroundScroll infinite linear;
	-ms-animation: 900000s backgroundScroll infinite linear;
	animation: 900000s backgroundScroll infinite linear;
}
@-webkit-keyframes backgroundScroll {
	from {
		background-position: 0 0;
	}
	to {
		background-position: -99999999px 0;
	}
}
@keyframes backgroundScroll {
	from {
		background-position: 0 0;
	}
	to {
	background-position: -99999999px 0;
	}
}
.music_div{
	background-image: url(image/music55.jpg);
	background-repeat: repeat-x;
	background-size: cover;
	background-position: center;
	-webkit-animation: 900000s backgroundScroll infinite linear;
	-moz-animation: 900000s backgroundScroll infinite linear;
	-o-animation: 900000s backgroundScroll infinite linear;
	-ms-animation: 900000s backgroundScroll infinite linear;
	animation: 900000s backgroundScroll infinite linear;
}
@-webkit-keyframes backgroundScroll {
	from {
		background-position: 0 0;
	}
	to {
		background-position: -99999999px 0;
	}
}
@keyframes backgroundScroll {
	from {
		background-position: 0 0;
	}
	to {
	background-position: -99999999px 0;
	}
}
.event_div{
	background-image: url(image/event-shoot44.jpg);
	background-repeat: repeat-x;
	background-size: cover;
	background-position: center;
	-webkit-animation: 900000s backgroundScroll infinite linear;
	-moz-animation: 900000s backgroundScroll infinite linear;
	-o-animation: 900000s backgroundScroll infinite linear;
	-ms-animation: 900000s backgroundScroll infinite linear;
	animation: 900000s backgroundScroll infinite linear;
}
@-webkit-keyframes backgroundScroll {
	from {
		background-position: 0 0;
	}
	to {
		background-position: -99999999px 0;
	}
}
@keyframes backgroundScroll {
	from {
		background-position: 0 0;
	}
	to {
		background-position: -99999999px 0;
	}
}
.adverti_div{
	background-image: url(image/ad-shoot4.jpg);
	background-repeat: repeat-x;
	background-size: cover;
	background-position: center;
	-webkit-animation: 900000s backgroundScroll infinite linear;
	-moz-animation: 900000s backgroundScroll infinite linear;
	-o-animation: 900000s backgroundScroll infinite linear;
	-ms-animation: 900000s backgroundScroll infinite linear;
	animation: 900000s backgroundScroll infinite linear;
}
@-webkit-keyframes backgroundScroll {
	from {
		background-position: 0 0;
	}
	to {
		background-position: -99999999px 0;
	}
}
@keyframes backgroundScroll {
	from {
		background-position: 0 0;
	}
	to {
		background-position: -99999999px 0;
	}
}

.infobox{
	font-family: 'Roboto-Regular';
	font-weight: 400;
	font-size: 14px;
	color: #323232;
	padding:0px 50px 0px 150px;
	justify-content: center;
	border: 1px solid #f5f5f5;
}
.main_cont h1{
	font-size: 50px;
	font-weight: 800;
	color: #580000;
	font-family: system-ui;
	letter-spacing: 1px;
}
p{
	font-size: 25px;
	line-height: 1.2;
}
.navbar-dark .navbar-nav .nav-link{
	color: white !important;
	font-size: 15px;
}
.img_div{
	text-align: center;
	padding:32px;
	color:  maroon;
}
.text-left .main_li{
	display: flex;
	font-size: 22px;
}
i{
	padding: 10px;
}
.display_div i{
	display: none;
}
.second_div{
	font-family: 'Cookie', cursive;
	font-family: 'Courgette', cursive;
	font-family: 'Lemonada', cursive;
	font-family: 'Playball', cursive;
}
.font_span{
	font-size: 25px;
	color:#00000096;
}
.body_div{
	background-color:#ffffff;
	margin-top: 670px;
	position: relative;
	width: calc(100% - 100px);
}
.image_div{
	float: left;
	margin: 8px 50px 10px 0px;
	width: 40%;
}
.image_div:hover{
	box-shadow: 5px 12px 10px 10px;
}
.iamges_div{
	float:right;
	margin:11px 0px 10px 50px;
	width: 40%;
}
.iamges_div:hover, .hover_div:hover{
	box-shadow: 5px 12px 10px 10px;;
}
.span_lastdiv{
	font-size: 24px;
	font-weight: 600;
}
.p_bodydiv{
	font-size: 18px; 
	font-family: system-ui;
	line-height: 1.6;
}
.container {
	padding: 0 16px;
}
.container::after, .row::after {
	content: "";
	clear: both;
	display: table;
}
.arrow{
	position: relative;
	top: 50%;
	left: 50.5%;
	transform: translate(-50%,-50%);
}
.arrow span{
	display: block;
	width: 19px;
	height: 19px;
	border-bottom: 2px solid #000000;
	border-right: 2px solid #000000;
	transform: rotate(45deg);
	margin: -3px;
	animation: animate 2s infinite;
}
.arrow span:nth-child(2){
	animation-delay: -0.2s;
}
.arrow span:nth-child(3){
	animation-delay: -0.4s;
}
@keyframes animate {
	0%{
		opacity: 0;
		transform: rotate(45deg) translate(-20px,-20px);
	}
	50%{	
		opacity: 1;
	}
	100%{
		opacity: 0;
		transform: rotate(45deg) translate(20px,20px);
	}
}
	.pd_div{
		padding:25px;
		display: flow-root;
	}
	.pd{
		margin: 20px;
	}			
	.p_div{
		font-size: 18px;
		line-height: 1.7;
	}
	.opacity_div{
		top: 0;
		display: inline-block;
		position: fixed;
		right: 0;
		left: 0;
		z-index: 1030;
		background-image: url(image/qaafilaa-image.jpg);
		background-repeat: no-repeat;
		background-size: cover;
		
	}
	.column {
		float: left;
		width: 33.3%;
		margin-bottom: 16px;
		padding: 0 20px 10px;
	}
	.column_div{
		float: left;
		width: 50%;
		margin-bottom: 16px;
		padding: 0 20px 10px;
	}
@media only screen (max-width:1440px){
	body{
		width: 100%;
	}
	.main_cont h1{
		font-size:45px;
		font-weight: 800;
	}
	p{
		font-size:31px;
	}
	.infobox{
		padding:0px 30px 20px 10px;
	}
	.body_div{
		background-color:#ffffffeb;
		margin-top: 550px;
		position: relative;
		width: calc(100% - 100px);
	}
	.pd_div{
		padding: 30px;
	}
}
@media only screen (max-width:1024px){
	body{
		width: 100%;
	}
	.main_cont h1{
		font-size:40px;
		font-weight: 800;
	}
	p{
		font-size:26px;
	}
	.infobox{
		padding:0px 30px 20px 10px;
	}
	.body_div{
		background-color:#ffffffeb;
		margin-top: 550px;
		position: relative;
		width: calc(100% - 100px);
	}
	.pd_div{
		padding: 30px;
	}
	.img_div{
		width: 200px;
		text-align: center;
		padding:20px;
		color:  maroon;
	}
	.navbar-dark .navbar-nav .nav-link{
		color: white !important;
		font-size: 14px;
	}
}
@media only screen (max-width: 991px){
	body{
		width: 100%;
	}
	.navbar-dark .navbar-nav .nav-link {
    	color: white !important;
    	font-size: 13px;
	}
	.main_cont h1{
		font-size:29px;
		font-weight: 800;
	}
	p{
		font-size:15px;
	}
	.infobox{
		padding:0px 30px 20px 10px;
	}
	.body_div{
		background-color:#ffffffeb;
		margin-top: 550px;
		position: relative;
		width: calc(100% - 100px);
		right: 72px;
	}
	.img_div{
		width: 150px;
		text-align: center;
		padding:19px;
		color:  maroon;
	}
	.nav_div{
		font-size: smaller!important;
	}
	.pd_div{
		padding:25px;
		display: flow-root;
	}
	h5{
		font-size:medium;
	}
	.p_div {
		font-size: 17px !important;
		line-height: 1.7;
	}
	.span_lastdiv{
		font-size: 17px;
		font-weight: 600;
	}
	
	.p_bodydiv {
		font-size: 13px;
		font-family: system-ui;
		line-height: 1.6;
	}
	.arrow span {
		display: block;
		width: 16px;
		height: 16px;
		border-bottom: 2px solid #000000;
		border-right: 2px solid #000000;
		transform: rotate(45deg);
		margin: -3px;
		animation: animate 2s infinite;
	}
	.column_div{
		float: left;
		width: 100%;
		margin-bottom: 16px;
		padding: 0 20px 10px;
	}
}

@media only screen and (max-width:768px){
	body{
		width: 100%;
	}
	.main_cont {
		margin: 0px 20px 0px 20px;
		/* background: linear-gradient(to right,#74130f,#000000);*/
		position: fixed;
		width: 89%;
		height: 100%;
	}
	.main_cont h1{
		font-size: 23px;
		font-weight: 800;
	}
	p{
		font-size: 18px;
	}
	.social_div a{
		display: inline-block;
		padding: .5rem;
	}
	.mail_span{
		display: none;
	}
	.image_div{
		float: left;
		margin: 8px 50px 10px 0px;
		width:267px;
		}
	.iamges_div{
		float:right;
		margin:20px 0px 10px 50px;
		width:267px;
	}
	.body_div {
		background-color: #ffffff;
		margin-top: 650px;
		position: relative;
		width: calc(100% - 100px);
		/*  right: 56px;*/
		left: 100px;
	}
	h5{
		font-size:medium;
	}
	.p_div {
		font-size: 16px !important;
		line-height: 1.7;
	}
	.span_lastdiv{
		font-size: 16px;
		font-weight: 600;
	}
	.navbar-dark .navbar-nav .nav-link{
		color: white !important;
		font-size: 12px;
		padding: 12px;
	}
	.p_bodydiv {
		font-size: 13px;
		font-family: system-ui;
		line-height: 1.6;
	}
	.column_div{
		float: left;
		width: 100%;
		margin-bottom: 16px;
		padding: 0 20px 10px;
	}
	.arrow span {
		display: block;
		width: 14px;
		height: 14px;
		border-bottom: 2px solid #000000;
		border-right: 2px solid #000000;
		transform: rotate(45deg);
		margin: -3px;
		animation: animate 2s infinite;}
}
@media only screen and (max-width:680px){
	.main_cont h1{
		font-size: 27px;
		font-weight: 800;
	}
	.body_h1div{
		font-family: 'Roboto Condensed', sans-serif;
		font-size: 19px;
	}
	.body_pdiv{
		font-size: 17px;
		font-family: 'Roboto Condensed', sans-serif;
	}
	.main_cont{
		margin:0px 20px 0px 20px;
		/*background: linear-gradient(to right,#74130f,#000000);*/
		position: fixed;
		width: 94%;
		height: 100%;
	}
	p{
		font-size: 15px;
	}
	.infobox{
		padding:0px 30px 20px 10px;
	}
	.mail_span, .display_div i{
		display: none;
		display: inline-block;
	}
	.image_div{
		float: left;
		margin: 8px 50px 10px 0px;
		width:267px;
	}
	.iamges_div{
		float:right;
		margin:20px 0px 10px 50px;
		width:267px;
	}
	.body_div {
		background-color: #ffffff;
		margin-top: 650px;
		position: relative;
		width: calc(100% - 100px);
		left:100px;
	}
	h5{
		font-size:medium;
	}
	.p_div {
		font-size: 16px !important;
		line-height: 1.7;
	}
	.span_lastdiv{
		font-size: 16px;
		font-weight: 600;
	}
	h2{
		font-size: 1.5rem;
	}
	.font_span{
		font-size: 18px;
	}
	.img_div{
		padding: 20px;
	}
	.p_bodydiv {
		font-size: 12px;
		font-family: system-ui;
		line-height: 1.6;
	}
	.column_div{
		float: left;
		width: 100%;
		margin-bottom: 16px;
		padding: 0 20px 10px;
	}
	.arrow span {
		display: block;
		width: 13px;
		height: 13px;
		border-bottom: 2px solid #000000;
		border-right: 2px solid #000000;
		transform: rotate(45deg);
		margin: -3px;
		animation: animate 2s infinite;}
	}
@media only screen and (max-width:450px){
	body{
		width: 100%;
	}
	.body_h1div{
		font-family: 'Roboto Condensed', sans-serif;
		font-size: 17px;
	}
	.body_pdiv{
		font-size: 15px;
		font-family: 'Roboto Condensed', sans-serif;
	}
	.main_cont {
		margin: 0px 0px 0px 20px;
		/*	    background: linear-gradient(to right,#74130f,#000000);*/
		position: fixed;
		width: 93%;
		height: 100%;
	}
	.infobox{
		padding:0px 30px 20px 10px;
	}
	.main_cont h1{
		font-size: 19px;
		font-weight: 800;
	}
	p{
		font-size: 13px;
	}
	.mail_span, .display_div i{
		display: none;
		display: inline-block;
	}
	.main_bodydiv {
		/* background: linear-gradient(to right,#74130f,#000000);*/
		height: 100vh;
		width: 100%;
		background-attachment: fixed;
		position:relative;
		top: 44px !important;
		padding-top: 3px;
		/*    left: 76px;*/
	}
	.body_div {
		background-color: #ffffff;
		margin-top: 240px;
		position: relative;
		width: calc(100% - 100px);
		left:100px;
	}
	.image_div{
		float: left;
		margin: 8px 25px 10px 0px;
		width:212px;
	}
	.iamges_div{
		float:right;
		margin:20px 0px 10px 25px;
		width:212px;
	}
	h5{
		font-size: small;
	}
	.p_div {
		font-size: 13px !important;
		line-height: 1.7;
	}
	.span_lastdiv{
		font-size: 12px;
		font-weight: 600;
	}
	h2{
		font-size: 1.2rem;
	}
	.font_span{
		font-size: 16px;
	}
	.img_div{
		padding: 21px;
	}
	.p_bodydiv {
		font-size: 12px;
		font-family: system-ui;
		line-height: 1.6;
	}
	.column_div{
		float: left;
		width: 100%;
		margin-bottom: 16px;
		padding: 0 20px 10px;
	}
	.arrow span {
		display: block;
		width: 13px;
		height: 13px;
		border-bottom: 2px solid #000000;
		border-right: 2px solid #000000;
		transform: rotate(45deg);
		margin: -3px;
		animation: animate 2s infinite;}
	}
@media only screen and (max-width:320px){
	body{
		width: 100%;
	}
	.body_h1div{
		font-family: 'Roboto Condensed', sans-serif;
		font-size: 17px;
	}
	.body_pdiv{
		font-size: 11px;
		font-family: 'Roboto Condensed', sans-serif;
	}
	.main_cont {
		margin: 0px 0px 0px 20px;
		/*  background: linear-gradient(to right,#74130f,#000000);*/
		position: fixed;
		width: 88%;
		height: 100%;
	}
	.image_div{
		float: left;
		margin: 8px 50px 10px 0px;
		width:161px;
	}
	.iamges_div{
		float:right;
		margin:20px 0px 10px 50px;
		width:161px;
	}
	.body_div {
		background-color: #ffffff;
		margin-top:144px;
		position: relative;
		width: calc(100% - 100px);
		left: 100px;
		padding: 0px !important;
	}
	h5{
		font-size: small;
	}
	.p_div {
		font-size: 12px !important;
		line-height: 1.7;
	}
	.span_lastdiv{
		font-size: 12px;
		font-weight: 600;
	}
	h2{
		font-size: 1rem;
	}
	.font_span{
		font-size: 15px;
	}
	.img_div{
		padding: 19px;
	}
	.p_bodydiv {
		font-size: 11px;
		font-family: 'Roboto Condensed', sans-serif;
		line-height: 1.6;
	}
	.column_div{
		float: left;
		width: 100%;
		margin-bottom: 16px;
		padding: 0 20px 10px;
	}
	.arrow span {
		display: block;
		width: 12px;
		height: 12px;
		border-bottom: 2px solid #000000;
		border-right: 2px solid #000000;
		transform: rotate(45deg);
		margin: -3px;
		animation: animate 2s infinite;
	}
}

@media screen and (max-width: 650px) {
	.column {
		width: 100%;
		display: block;
	}
}