*{
 padding: 0px;
 margin: 0px;
 box-sizing: border-box;
}

body{
 background-color: #FFF !important;
 max-width: 1366px;
 margin: 180px auto 0px;
}

p{
 margin: 0px;
}




.modal-content{
 border-radius: 0px !important;
 font-family: cairo;
 color: grey;
}

.modal-content h5 i{
}
.modal-content button{
 border-radius: 0px;
}

.modal-content input {
 margin: 10px 0px;
 border-radius: 0px;
 padding: 0px 5px;
 height: 40px;
 line-height: 40px;
}

.modal-content textarea{
 border-radius: 0px;
 min-height: 120px;
}

#closeModalBtn{
 border: none;
 background-color: dimgrey;
 box-shadow: 0px 0px 1px black;
}

#messageSendBtn{
 border: none;
 background-color: dimgrey;
 box-shadow: 0px 0px 1px black;
}

.alert{
 border-radius: 0px;
}

#width{
 z-index: 10000;
 position: fixed;
 bottom: 0px;
 left: 10px;
 width: 80px;
 height: 35px;
 line-height: 35px;
 background-color: rebeccapurple;
 color: #FFF;
 text-align: center;
 display: none !important;
}
.clear{
 clear: both;
}

.sepLine{
 width: calc( 100% - 130px );
 margin: 70px auto 55px;
 height: 30px;
}

.sepLine > div {
 float: left;
 font-family: cairo;
}

.sepLine1{
 width: calc( 50% - 50px );
 border-bottom: 1px solid #DDD;
 height: 13px;
}

.sepLine2{
 width: 100px;
 text-align: center;
 border-bottom: 1px solid #DDD;
 border-top: 1px solid #DDD;
 border-radius: 5px;
}

.sepLine3{
 border-bottom: 1px solid #DDD;
 width: calc( 50% - 50px );
 height: 13px;
}

.sepLine2 > span{
 color: dimgray;
}


/* cairo-regular - arabic */
@font-face {
  font-family: 'Cairo';
  font-style: normal;
  font-weight: 400;
  src: url('../font/cairo-v1-arabic-regular.eot'); /* IE9 Compat Modes */
  src: local('Cairo'), local('Cairo-Regular'),
       url('../font/cairo-v1-arabic-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../font/cairo-v1-arabic-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../font/cairo-v1-arabic-regular.woff') format('woff'), /* Modern Browsers */
       url('../font/cairo-v1-arabic-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../font/cairo-v1-arabic-regular.svg#Cairo') format('svg'); /* Legacy iOS */
}

/* min topbar */

#minTopBar{
 position: fixed;
 top: 0px;
 left: 0px;
 right: 0px;
 z-index: 500;
 width: 100%;
 height: 50px;
 transform: translateY(-50px);
 transition: all 0.5s;
 background-color: #FFF;
 border-bottom: 1px solid #EEE;
}

#minTopBarInner{
 width: 290px;
 text-align: center;
 margin: auto;
 border-bottom: 1px solid #EEE;
}
#closeMinContainer{
 height: 50px;
 width: 100%;
 position: fixed;
 top: 0px;
 display: none;
 transition: all 0.5s;
 z-index: 80;
 background-color: #EEE;
 box-shadow: 1px 1px 1px grey;
 transform: translateY(-2px)
}
#closeMinTabs{
 position: fixed;
 z-index: 250;
 width: 50px;
 height: 48px;
 line-height: 50px;
 right: 0px;
 top: 0px;
 text-align: center;
 background-color: #EEE;
 border-left: 1px solid #FFF;
 transition: all 0.5s;
 cursor: pointer;
 display: none;
}

#minTopBarInner > div {
 float: left;
 padding: 0px 15px;
 height: 50px;
 line-height: 50px;
 color: goldenrod;
 border-right: 1px solid #EEE;
 cursor: pointer;
}

#minTopBarInner > div:nth-of-type(5){
 border-right: none;
}

#minTopBarInner > div:nth-of-type(5) i{
 font-size: 120%;
 position: relative;
 top: 2px;
}

#minTopBarInner > div:nth-of-type(1) i{
 transform: rotate(90deg)
}


/* top line style */
#topLine{
 height: 50px;
 background-color: #FFF;
 line-height: 50px;
 margin: auto;
 border-bottom: 1px solid #EEE;
 position: fixed;
 top: 0px;
 width: 100%;
 z-index: 200;
 transition: all 0.3s;
}

#topLineInner{
 width: calc( 100% - 200px );
 margin: auto;
 position: relative;
 height: 50px;
}

#topLineInner > div{
 float: left;
 height: 50px;
 transition: all 0.5s;
 z-index: 100;
}

#topPhone{
 padding: 0px 15px;
 border-right: 1px solid #EEE;
 width: 210px;
 color: #838383;
 font-size: 90%;
 font-weight: bold;
}
#topPhone span{
 color: grey;
}

#topEmail{
 border-right: 1px solid #EEE;
 padding: 0px 15px;
 width: calc( 100% - 670px );
 color: #838383;
 font-size: 90%;
 font-weight: bold;
}

#topEmail span{
 color: black;
}

#topSocial{
 width: 225px;
 text-align: center;
 border-right: 1px solid #EEE;
}


#topSocial > div{
 width: 40px;
 display: inline-block;
}

#topSocial a{
 color: #838383;
 transition: color 1s;
 font-size: 90%;
 width: 40px;
 height: 40px;
 display: block;
 position: relative;
 top: 5px;
 border-right: 1px solid #EEE;
}

#topSocial a i{
 position: relative;
 top: -5px;
}

#topLinked a{
 border-right: none;
}

#topSocial a:hover{
 color: #FFC527;
}

#topYoutube i{
 right: 2px;
}


#topMessage{
 width: 150px;
 text-align: center;
 font-family: cairo;
 color: #838383;
 cursor: pointer;
 transition: color 1s;
}

#topMessage:hover{
 color: #FFC527;
}


#topLang{
 width: 50px;
 overflow: hidden;
 height: 50px;
 cursor: pointer;
}

#topLang img{
 width: 35px;
 position: relative;
 top: -3px;
}

/* topbar style */
#topBar{
 height: 126px;
 position: fixed;
 width: 100%;
 z-index: 60;
 background-color: #FFF;
 transition: all 0.3s;
 top: 50px;
}

#topBarInner{
 width: calc( 100% - 200px );
 margin: auto;
 height: 121px;
 border-bottom: 1px solid #EEE;
}

#logoContainer{
 width: 250px;
 float: left;
 text-align: center;
 margin-top: 10px;
}

#logoContainer img{
 height: 100px;
 transition: all 0.23s;
}

/* menu style */

#menuContainer{
 width: calc( 100% - 310px );
 float: left;
 text-align: center;
 height: 120px;
 line-height: 120px;
 direction: rtl;
}

#menuContainer > ul{
 list-style: none;
 margin: 0px;
 z-index: 200;
 transition: all 0.2s;
}


#menuContainer > ul > li{
 float: right;
 z-index: 200;
 margin: 0px 10px;
 height: 119px;
 cursor: pointer;
 transition: all 0.2s;
}
#menuContainer > ul > li > a{
 font-family: cairo;
 text-decoration: none;
 color: #393939;
 display: block;
 transition: all 0.2s;
}

.menuLine{
 height: 2px;
 background-color: #FFC527;
 position: relative;
 top: -1px;
 width: 0px;
 transition: all 0.7s;
}

#menuContainer > ul > li:hover .menuLine{
 width: 100%;
}

#menuContainer > ul > li:hover a{
 color: #FFC527;
}


#toggleMenuMin{
 width: 80px;
 height: 80px;
 line-height: 80px;
 font-size: 200%;
 margin-top: 25px;
 color: dimgray;
 cursor: pointer;
 transition: all 0.1s;
 display: none;
}

/* footer style */

#companyFooter{
 background-color: grey;
 margin-top: 50px;
 padding-top: 20px;
 background-image: url(../icons/texture.png);
}

#developer{
 font-family: cairo;
 text-align: center;
 padding: 5px 0px 10px 0px;
 direction: rtl;
}
#developer a{
 color: gray;
 text-decoration: none;
 direction: rtl;
}

#companyFooter p{
 text-align: center;
 font-family: cairo;
 margin: 5px 0px;
 color: #cccccc;
 padding: 5px 0px;
 direction: rtl;
}

#footerInfo{
 height: 50px;
 line-height: 50px;
 border-bottom: 1px solid #EEE;
}

#footerCompanyInfo{
 width: 50%;
 float: right;
 border-left: 1px solid rgba(238, 238, 238, 0.14);
 min-height: 120px;
}

#footerContactInfo{
 width: 50%;
 float: left;
 overflow: auto;
}

#rights{
 border-top: 1px solid rgba(238, 238, 238, 0.14);
 margin-top: 10px !important;
}

#footerContactInfo table{
 margin: 0px auto 0px;
 font-family: cairo;
 width: 370px;
}

#footerContactInfo table tr{
 height: 40px;
 line-height: 40px;
 border: 1px solid rgba(238, 238, 238, 0.14);
 border-left: none;
 border-right: none;
}

#footerContactInfo table tr:nth-of-type(1){
 border-top: none;
}

#footerContactInfo table tr:nth-of-type(3){
 border-bottom: none;
}

#footerContactInfo table tr td:nth-of-type(1){
 width: 30px;
 text-align: center;
 border-right: 1px solid rgba(238, 238, 238, 0.14);
 color: rgba(255, 187, 3, 0.54);
}

#footerContactInfo table tr td:nth-of-type(2){
 padding-left: 5px;
 color: #cccccc;
}