html{
background-color: #fff;
/*E54D38 اللون الثاني*/
}
*{
font-family: 'Almarai', sans-serif;
}
.clearfix::after, .dl-horizontal dd::after, .container::after, .container-fluid::after, .row::after, .form-horizontal .form-group::after, .home-banner .section .owl-carousel .owl-dots::after, .banner-menu .menu.g-menu .owl-carousel .owl-dots::after {
clear: both;
}
body{
background-color: #fff;
}
.ssss{
opacity: 0.6;
transition: transform .2s;
}
.ssss:hover{
opacity: unset;
transition: ease-in-out all .4s;
/*transform: scale(1.1);*/
}
#navbarMy {
position: fixed; /* Make it stick/fixed */
top: 0; /* Stay on top */
width: 100%; /* Full width */
transition: top 0.5s; /* Transition effect when sliding down (and up) */
z-index: 9999999;
}
.icon-bar {
position: fixed;
top: 50%;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
right:15px;
z-index: 99999999;
}.bar-d {
position: fixed;
top: 50%;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
left:2px;
z-index: 99999;
transition: all 0.5s ease;
}
.bar-d img:hover {
width: 180px;
height: 180px;
transition: all 0.5s ease;
}
.icon-bar a {
display: block;
text-align: center;
padding: 0px;
transition: all 0.5s ease;
color: white;
font-size: 20px;
border-radius: 50%;
margin-bottom: 10px;
margin-top: 10px;
width: 40px;
height: 40px;
line-height: 40px;
background-color: #727272;
}
/* Style the social media icons with color, if you want */
.facebook {
color: white;
}.facebook:hover {
background: #3B5998;
width: 50px;
height: 50px;
font-size: 32px;
line-height: 50px;
}
.twitter {
color: white;
}
.twitter:hover {
background: #55ACEE;
width: 50px;
height: 50px;
font-size: 32px;
line-height: 50px;
}
.google {
color: white;
}
.google:hover {
background: #dd4b39;
width: 50px;
height: 50px;
font-size: 32px;
line-height: 50px;
}
.linkedin {
color: white;
}
.linkedin:hover {
background: #007bb5;
width: 50px;
height: 50px;
font-size: 32px;
line-height: 50px;
}
.youtube {
color: white;
}
.youtube:hover {
background: #bb0000;
width: 50px;
height: 50px;
font-size: 32px;
line-height: 50px;
}
.act{
color: #fbc128 !important;
}
.bg-light {
background-color: #fff !important;
}
.navbar-light:hover .navbar-nav:hover .nav-link:hover {
color: #fbc128;
}.navbar-light .navbar-nav .nav-link {
color: #817777;
}
.dropdown-menu{
background: #fff;
}
#navbar{
width: 100%;
}
#navbarSupportedContent li{
color: #111;
margin-top: 13px;
}
.navbar-brand{
font-size: 24px;
}
.slide{
margin-top: 170px;
}
.carousel-indicators li {
background-color: rgba(72, 69, 69, 0.5);
}
.carousel-indicators .active {
background-color: #fbc128;
}
.haderCont{
max-width: 1500px;
}
#hedar{
background-color: #F8B936;
}
#hedar{
width: 50%;
margin: 20px auto;
box-shadow: 2px 2px 6px #000;
background: #faebd7;
direction: rtl;
}#hedar h4{
margin-top: 22px;
font-weight: bold;
}
#logo{
float: right;
}
#logo img{
width: 165px;
height: auto;
margin-top: 10px;
margin-right: -5px;
margin-left: 5px;
}
#logo-h img{
width: 60px;
}
.lastarticles h3{
font-size: 14px;
font-weight: bold;
text-align: center;
background: #000;
width: 257px;
margin: 5px auto 0 auto;
padding: 5px;
color: #fff;
}
.lastarticles2{
width: 257px;
height: 90px;
overflow: hidden;
background: #faebd7;
padding: 5px;
box-shadow: 2px 2px 6px #000;
margin: 0 auto 5px auto;
}
.lastarticles2 a {
text-decoration: none;
color: #000;
}
.lastarticles2 img{
width: 80px;
height: 80px;
border-radius: 50%;
float: right;
}.lastarticles2 h4{
font-size: 12px;
font-weight: bold;
}.lastarticles2 p{
font-size: 10px;
width: 162px;
overflow: hidden;
margin: 0 ;
direction: rtl;
}
#info{
float: left;
text-align: justify;
}
#articles{
width: 100%;
height: 800px;
padding-top: 60px;
transition: 0.5;
text-align: center;
}
.artc{
margin: 0 auto;
max-width: 400px;
border-radius: 20px;
box-shadow: 2px 2px 6px #000;
position: relative;
height: 400px;
overflow: hidden;
background: #eff8f1d1;
padding: 0px;
margin-right: 50px;
}
.artc img{
height: 250px;
}.artc h2{
position: absolute;
background: #000000b0;
top: 214px;
color: #fff;
font-size: 22px;
padding: 5px;
font-weight: bold;
width: 100%;
}
#mnNahn{
height: 800px;
padding-top: 140px;
transition: 0.5;
text-align: center;
width: 60%;
margin: 0 auto;
visibility: visible;
animation-duration: 2s;
animation-delay: 1s;
animation-name: fadeIn;
padding-top: 140px !important;
}
#mnNahnDivp{
width: 100%;
background: #eee;
font-size: 24px;
text-align: justify;
direction: rtl;
padding: 20px;
border-radius: 50px 0 50px 0;
box-shadow: 1px 1px 5px #000;
}
#topcontrol {
z-index: 2;
background: #FF8500 url(../img/separate.png) no-repeat center -410px;
background-color: rgb(255, 133, 0);
width: 30px;
height: 30px;
text-indent: -99999px;
border-radius: 50px;
-moz-border-radius: 50px;
-webkit-border-radius: 50px;
position: fixed;
bottom: -100px;
right: 10px;
cursor: pointer;
-webkit-transition: all .7s ease-in-out;
-moz-transition: all .7s ease-in-out;
-o-transition: all .7s ease-in-out;
-ms-transition: all .7s ease-in-out;
transition: all .7s ease-in-out;
overflow: unset;
background-color: #e54d38 !important;
}
#btn-my-view_1{
text-align: center;
color: #F8B936;
font-weight: bold;
text-shadow: 1px 2px 2px #000000;
margin: 49px 0 0 0;
font-size: 18px;
background: #000;
box-shadow: 2px 2px 6px #000;
}
#btn-my-view_1:hover{
color: #fff;
background: #f8b936;
}
#vision{
height: 800px;
padding-top: 60px;
transition: 0.5;
text-align: center;
width: 60%;
margin: 0 auto;
visibility: visible;
animation-duration: 2s;
animation-delay: 1s;
animation-name: fadeIn;
padding-top: 140px !important;
}
#img1{
opacity: 0.8;
float: right;
}
#img2{
opacity: 0.5;
width: 150px;
position: absolute;
left: 224px;
top: 2447px;
}
#p1{
text-align: justify;
direction: rtl;
line-height: 28px;
margin-top: 42px;
background: #000;
width: 70%;
padding: 10px;
border-radius: 10px;
font-size: 16px;
color: #fdf1d6;
text-shadow: 1px 1px 1px #000;
font-weight: bold;
}
#hadef{
height: 800px;
padding-top: 60px;
transition: 0.5;
text-align: center;
width: 60%;
margin: 0 auto;
visibility: visible;
animation-duration: 2s;
animation-delay: 1s;
animation-name: fadeIn;
padding-top: 140px !important;
}
#hadef img{
width: 28%;
}
#inside{
height: 800px;
padding-top: 60px;
transition: 0.5;
text-align: center;
width: 100%;
margin: 0 auto;
}
#outside{
height: 800px;
padding-top: 60px;
transition: 0.5;
text-align: center;
width: 100%;
margin: 0 auto;
}
.work {
margin: 0 auto;
margin-right: auto;
max-width: 300px;
border-radius: 20px;
box-shadow: 2px 2px 6px #000;
position: relative;
height: 460px;
overflow: hidden;
background: #eff8f1d1;
padding: 0px;
margin-right: 50px;
}
#works_img1{
opacity: 0.2;
width: 185px;
position: absolute;
left: 55px;
top: 287px;
}
#workimg1{
height: 250px;
width: 100%;
}
#contactus{
height: 676px;
padding-top: 60px;
transition: 0.5;
text-align: center;
width: 100%;
margin: 0 auto;
}
#contact-us{
width: 50%;
border: 5px solid #000;
border-radius: 10px;
padding: 20px;
background: #f7efe3;
}
#contact-us label{
font-size: 12px;
}
.placeholder-contactus {
font-size: 12px;
}
#face{
background: url(../img/ic.png) no-repeat left -5px;
width: 69px;
height: 60px;
margin: -50px 0 0 410px;
}
#youtupe{
background: url(../img/ic.png) no-repeat left -69px;
width: 69px;
height: 67px;
margin: -50px 0 0 410px;
}
#twitter {
background: url(../img/ic.png) no-repeat center 1px;
width: 61px;
height: 65px;
margin: -53px 0 0 420px;
}
#whatsapp {
background: url(../img/ic.png) no-repeat right -5px;
width: 72px;
height: 65px;
margin: -50px -11px 0 420px;
}
#viber {
background: url(../img/ic2.png) no-repeat center -189px;
width: 60px;
height: 65px;
margin: -50px 0 0 420px;
}
#email {
background: url(../img/ic2.png) no-repeat center -951px;
width: 60px;
height: 65px;
margin: -53px 0 0 420px;
}
#soshal h3 {
text-align: right;
margin-right: 195px;
margin-top: 10px;
color: #fff;
text-shadow: 1px 1px 2px #000;
}
#articleCon {
width: 50%;
margin: 20px auto;
box-shadow: 2px 2px 6px #000;
background: #FFFFFF;
direction: rtl;
height: 100%;
}
#articleOneImg
{
width: 100%;
margin-top: 16px;
min-height: 70%;
}
#articleOneImgContent img
{
width: 100% !important;
min-height: 70% !important;
}
.redmore:hover{
color: #e54d38;
font-weight: bold;
}
.slidermysize{
width: 100% !important;
height: 500px !important;
}
#mu-my{
background: #efa611;
height: 150px !important;
border-radius: 0 70px 0 70px;
margin: 0 auto;
text-align: center;
}
#mu-my img{
width: 130px;
height: auto;
padding: 20px;
margin-right: 38px;
}#mu-my img:hover{
transition: all 0.5s ease;
width: 140px;
height: auto;
background: #ef4a2b;
border-radius: 0 30px 0 30px;
}
.hideMashare{
display: none;
} .hideHamlat{
display: none;
}
.shadow{
box-shadow: 3px 5px 10px -1px gray !important;
}
.opsety{
opacity: 0.5;
}
#contact-us-sm{
}#contact-us-sm a{
font-size: 24px;color: #fff;text-decoration: none;font-weight: bold;
}#contact-us-sm a:hover{
text-shadow: 0 0 10px #fff;
}
#footer-sm {
}#footer-sm h3{
font-size: 24px;
color: #fff;
}
.ul-footer{
list-style: none;
margin-right: 124px;
}
.footer-link{
display: block;
color: #fff;
text-align: right;
text-decoration: none;
}
.footer-link a{
text-decoration: none;
}
#navbar-brand-2{
font-size: 15px;
text-shadow: none;
color: #727272;
}
#tit-2{
display: none;
}
.aliNav{
display: none;
}
#h3-news{
text-decoration: none;
color: #000;
font-weight: bold;
}
#h3-news:hover{
color: #dc3545;
}
@media screen and (min-width: 300px)and (max-width: 700px) {
#table-bank-account{
width: 100% !important;
vertical-align: middle !important;
}
.navbar{
display: unset !important;
}
#navbarMy {
display: none !important;
}
.modal-content {
width: 80% !important;
}
.work-pop {
width: 100% !important;
}
.m_ms{
}
#don-sm{
width: 100% !important;
height: auto !important;
border-radius: 20px !important;
margin: 5px auto !important;
}
#div-news-sm{
width: 95% !important;
margin: 15px auto !important;
padding: 0 !important;
height: auto !important;
}
#div-news-sm-img{
width: 100% !important;
margin: 0 auto !important;
height: auto !important;
border-bottom: 2px solid !important;
}
#tit-news{
right: 0px !important;
}
#cal-sm{
margin-right: 10px !important;
}
#h3-news-sm{
margin: 30px 10px 0 0 !important;
}
#p-news-sm{
width: auto !important;
text-align: right !important;
margin-right: 10px !important;
}
#show-news-sm{
margin: 0 33% 5px 0 !important;
}
#div-photo-sm{
width: 100% !important;
margin: 30px auto !important;
padding: 0 !important;
height: auto !important;
}
#div-photo-sm-img {
width: 100% !important;
margin: 0 auto !important;
height: auto !important;
border-left: 0px !important;
}
#tit-photo{
top: 5px !important;
left: 12px !important;
}
#ico-photo-sm{
left: 160px !important;
}
#cla-photo-sm{
position: unset !important;
margin-right: 5px !important;
}
#h3-photo-sm{
float: none !important;
margin: 5px 5px 5px 0 !important;
}
#p-photo-sm{
position: unset !important;
width: 100% !important;
text-align: right !important;
margin-right: 5px !important;
}
#show-photo-sm{
position: unset !important;
margin: 0 33% 5px 0 !important;
}
#div-video-sm{
width: 100% !important;
margin: 15px auto !important;
padding: 0 !important;
height: auto !important;
}
#tit-video{
top: -24px !important;
left: -3px !important;
z-index: 1;
}
#div-video-sm-img {
width: 100% !important;
margin: 0 auto !important;
height: auto !important;
border-left: 0px !important;
}
#ico-video-sm{
left: 160px !important;
}
#cla-video-sm{
position: unset !important;
margin-right: 5px !important;
}
#h3-video-sm{
float: none !important;
margin: 5px 5px 5px 0 !important;
}
#p-video-sm{
position: unset !important;
width: 100% !important;
text-align: right !important;
margin-right: 5px !important;
}
#show-video-sm{
position: unset !important;
margin: 0 33% 5px 0 !important;
}
.icon-bar{
display: none;
}
.bar-d{
display: none;
}
.iraq{
display: none;
}
.navbar-toggler-icon {
background: #fff;
}
.navbar-light .navbar-toggler {
border: 1px solid #fff;
}
.slidermysize{
width: 100% !important;
height: 275px !important;
}
#logo-h img{
width: 40px;
}
.slide{
margin-top: 56px !important;
}
.navbar-brand{
font-size: 15px;
display: none !important;
}
#navbar-brand-2{
font-size: 10px;
color: #727272;
}
.navbar-brand img{
width: 40px !important;
}
#hedar{
width: 90%;
}
#articles{
width: 100%;
height: auto;
}
.artc{
width: 93% !important;
margin-right: 12px;
height: auto;
margin-bottom: 25px;
}
#mnNahn{
height: auto;
width: 90%;
padding-top: 0px !important;
}
#vision{
width: 90%;
height: auto;
padding-top: 0px !important;
}
#img1 {
opacity: 0.8;
float: none;
}
#img2{
left: 5px;
top: 3549px;
width: 74px;
}
#p1{
width: 95%;
padding: 10px;
margin: 10px auto;
}
#hadef{
height: auto;
width: 90%;
padding-top: 0px !important;
}
#hadef img{
width: 40%;
position: relative;
width: 50%;
position: relative;
margin: 0 auto 0 auto;
right: 0;
top: 0;
}
#inside{
width: 100%;
height: auto;
}
#outside{
width: 100%;
height: auto;
}
.work {
height: auto;
width: 93% !important;
margin: 10px auto;
}
#contactus{
height: auto;
}
#contact-us{
width: 100%;
margin: 20px auto;
}
#contact-us label{
font-size: 12px;
}
.placeholder-contactus {
font-size: 12px;
}
#face{
margin: -50px 0 0 -85px;
}
#youtupe{
margin: -50px 0 0 -85px;
}
#twitter {
margin: -53px 0 0 -74px;
}
#whatsapp {
margin: -50px 0 0 -74px;
}
#viber {
margin: -50px 0 0 -74px;
}
#email {
margin: -53px 0 0 -74px;
}
#soshal{
width:100%;
}
#articleCon {
width: 100%;
}
#articleOneImg
{
width: 100%;
margin-top: 16px;
min-height: 20%;
}
#articleOneImgContent img
{
width: 100% !important;
min-height: 20% !important;
height: 200px !important;
}
#mu-my {
border-radius: 0px;
margin: 0 auto;
height: 210px !important;
}
#mu-my img {
width: 190px !important;
height: auto;
padding: 20px;
margin: 0 auto !important;
}
.owl-theme .owl-nav [class*="owl-"] {
color: #FFF !important;
font-size: 60px !important;
cursor: pointer;
margin: -50px 60px !important;
}
.owl-theme .owl-dots .owl-dot span {
margin: 0 15px 4px 0 !important;
}
.aliNav{
display: unset;
}
#tit-2{
display: unset;
}
#marg-slide-sm{
margin-top: -45px !important;
}
#div-mahly-sm{
max-width: 100% !important;
}
#contact-us-sm{
height: 100% !important;
}
.contact-us-sm-row{
border-left: 0 !important;
height: 65px;
border-bottom: 1px solid #fff !important;
width: 80% !important;
margin: 0 auto !important;
}
.ul-footer {
list-style: none;
margin-right: 0px !important;
}
#form-ashtrak-sm{
width: 61% !important;
text-align: center;
margin: 10px auto !important;
}
.project{
margin-top: 0px !important;
}
}
@media screen and (min-width: 710px)and (max-width: 1024px) {
.navbar-toggler-icon {
background: #fff;
}
.navbar-light .navbar-toggler {
border: 1px solid #fff;
}
#logo-h img{
width: 40px;
}
.navbar-brand{
font-size: 18px;
}
.lastarticles h3 {
width: 170px;
}
.lastarticles2 {
width: 170px;
}
.artc {
margin: 10px auto;
max-width: 230px;
height: 350px;
}
.artc img{
height: 165px;
}
.artc h2 {
top: 131px;
right: 0;
overflow: hidden;
width: 100%;
font-size: 20px;
}
#img1{
margin: -45px -119px 0 0;
}
#img2 {
left: 74px;
top: 1565px;
}
#p1 {
width: 80%;
}
#inside{
height: auto;
} #outside{
height: auto;
}
.work {
margin: 10px auto;
}
#works_img1{
opacity: 0.2;
width: 185px;
position: absolute;
left: 55px;
top: 287px;
}
#workimg1{
height: 250px;
}
#contactus{
height: auto;
padding-top: 200px;
}
#contact-us{
width: 100%;
margin: 20px auto;
}
#contact-us label{
font-size: 12px;
}
.placeholder-contactus {
font-size: 12px;
}
#face{
margin: -50px 0 0 -85px;
}
#youtupe{
margin: -50px 0 0 -85px;
}
#twitter {
margin: -53px 0 0 -74px;
}
#whatsapp {
margin: -50px 0 0 -74px;
}
#viber {
margin: -50px 0 0 -74px;
}
#email {
margin: -53px 0 0 -74px;
}
#divart{
width: 90% !important;
}
.redmore{
margin: 0 539px 0 0 !important;
}
#img2 {
left: 29px;
top: 2503px;
}
#hadef img {
width: 20%;
right: 75px;
top: 3425px;
}
.slidermysize {
width: 100% !important;
height: 500px !important;
}
}