/* font */
@font-face{ font-family:"Dubai"; src: url('fonts/Dubai-Light.otf') format('truetype'); font-weight: normal; font-style: normal; }
@font-face{ font-family:"Dubai"; src: url('fonts/Dubai-Bold.otf') format('truetype'); font-weight: bold; font-style: normal; }

/* Body generals */
body { -webkit-text-size-adjust: none; -webkit-tap-highlight-color:  rgba(255, 255, 255, 0); margin: 0px; font-family: "Dubai"; font-size: 16px; background-color: #FFFFFF; color: #111111; }
body a { color: #c83d43; text-decoration:none; }
body a:hover { color: #c83d43; text-decoration: none; }
.hiddenDom { display: none; }
.longTextContainer { margin: 30px; margin-top: 0px; text-align: justify; font-size: 18px; }
.centered { text-align: center; }
.indexButton { width: 250px; margin-right: auto; margin-left: auto; margin-bottom: 40px; text-align: center; font-size: 20px; padding: 20px; box-sizing: border-box; color: #FFFFFF; background-color: #cc3c44; border-radius: 3px; }

/* Loading */
.loadingImage { width: 130px; height: 35px; }
.preLoadingImage { width: 1px; height: 1px; display: none; }


/* Header */
.headerContainer { z-index: 100; position: fixed; top: 0px; right: 0px; width: 100%; height: 90px; }
.menuButtonContainer { float: right; width: 30px; height: 30px; padding: 30px; padding-right: 20px !important; cursor: pointer; }
.menuIcon { width: 30px; height: 30px; background-image: url('../img/menu_icon_color.png'); background-size: 100%; }
.menuIconOverlay { position: absolute; width: 30px; height: 30px; margin-right: -30px; background-image: url('../img/menu_icon_white.png'); background-size: 100%; }
.logoContainer { float: left; width: 50px; height: 50px; padding: 20px; cursor: pointer; }
.headerLogo { width: 50px; height: 50px; background-image: url('../img/default_logo_color.png'); background-size: 100%; }
.headerLogoOverlay { position: absolute; width: 50px; height: 50px; margin-right: -50px; background-image: url('../img/default_logo_white.png'); background-size: 100%; }
.landingContainer { position: absolute; width: 100%; background-color: #c83d43; }
.landingSlogan { opacity: 0; position: absolute; top: 0%; width: 100%; padding-right: 20px; padding-left: 20px; box-sizing: border-box; text-align: center; font-size: 48px; color: #FFFFFF; }
.landingSloganAni { animation-name: landingSloganAniKF; animation-duration: 0.5s; animation-timing-function: ease-in-out; animation-fill-mode: forwards; }
@keyframes landingSloganAniKF { from { top: 0%; opacity: 0; } to { top: 50%; opacity: 1; } }
.landingScroll { position: absolute; width: 70px; bottom: 20px; right: 20px; color: #FFFFFF; }
.landingScrollDownGIF { width: 70px; height: 70px; } 
.poweredByContainer { position: absolute; width: 50px; height: 50px; bottom: 40px; left: 40px; color: #FFFFFF; }
.poweredByImage { width: 50px; height: 50px; background-image: url('../img/poweredby.png'); background-size: 100%; }
.pageContainer { }

/* Dialogs */
.alertDialog { z-index: 2000; position: fixed; width: 100%; height: 100%; background-color: rgba(0,0,0,0.5); display: none; }
.alertContainer { position: absolute; top: 50%; right: 50%; margin-right: -180px; width: 360px; background-color: #FFFFFF; text-align: center; border-radius: 3px; }
.alertMessage { width: 100%; padding: 20px; box-sizing: border-box; max-height: 200px; overflow: scroll; -webkit-overflow-scrolling: touch; }
.alertButton { padding: 20px; color: #cc3c44; border-top: 1px solid #EAEAEA; font-weight: bold; cursor: pointer; }

/* Contact */
.contactElementsContainer { width: 100%; text-align: center; }
.contactElement { display: inline-block; width: 360px; margin: 20px; margin-top: 0px; text-align: right; vertical-align: top; }
.contactFormSectionTitle { font-weight: bold; margin-top: 30px; margin-bottom: 30px; }
.inputTextField { outline-width: 0; -webkit-appearance: none; width: 100%; text-align: right; box-sizing: border-box; padding: 20px; border: 0px; border-bottom: 1px solid #EEEEEE; border-radius: 0px; font-family: "Dubai"; font-size: 14px; color: #111111; }
.inputTextField::-webkit-input-placeholder { color: #999999; }
.captchaContainer { width: 305px; margin-right: auto; margin-left: auto; margin-top: 10px; margin-bottom: 10px; overflow: hidden; }
.inputButton { width: 100%; padding: 20px; box-sizing: border-box; color: #FFFFFF; background-color: #cc3c44; border-radius: 3px; cursor: pointer; text-align: center; margin-bottom: 40px; }
.contactThankyou { text-align: center; display: none; }
.contactThankyouImage { width: 150px; height: 150px; margin-bottom: 20px; background-image: url('../img/messagesent_icon.png?'); background-size: 100%; }

/* Founder */
.longTextContainer p { text-indent: 30px; }
.paragraphTitle { text-indent: 0px !important; font-weight: bold; font-size: 20px; }
.founderTitleContainer { width: 100%; text-align: center; background-color: #F9F9F9; padding: 20px; box-sizing: border-box; }
.founderImage { width: 100px; height: 100px; background-image: url('../img/founder.jpg?ac'); background-size: 100%; border-radius: 100%; }
.founderName { font-size: 18px; }
.founderTitle { font-size: 14px; margin-bottom: 10px; }
.founderLinks a { font-size: 14px; } 

/* Menu */
.menuContainer { z-index: 1000; position: fixed; top: -100%; right: 0px; width: 100%; height: 100%; color: #FFFFFF; background-color: #c83d43; overflow: scroll; -webkit-overflow-scrolling: touch; }
.menuContainer a { color: #FFFFFF; }
.menuContainer a:hover { color: #FFFFFF; }
.menuCancelContainer { position: absolute; top: 0px; right: 0px; width: 30px; height: 30px; padding: 30px; padding-right: 20px; cursor: pointer; }
.menuCancelIcon { width: 30px; height: 30px; background-image: url('../img/cancel_icon_white.png'); background-size: 100%; }
.menuHeaderContainer { height: 5%; }
.menuLogoContainer { height: 20%; overflow: hidden; text-align: center; margin-bottom: 30px; }
.menuLogo { height: 100%; background-image: url('../img/default_logo_white.png'); background-size: 100%; }
.menuElement { width: 100%; padding-top: 10px; padding-bottom: 10px; box-sizing: border-box; text-align: center; font-size: 20px; cursor: pointer; }
.menuFooter { position: absolute; bottom: 0px; width: 100%; text-align: center; padding-top: 20px; padding-bottom: 20px; background-color: rgba(200,61,67,0.7); font-size: 16px; color: #ea888c; }
.menuFooter a { color: #ea888c; }
.menuFooter a:hover { color: #ea888c; }

/* Footer */
.footerContainer { width: 100%; padding: 50px; box-sizing: border-box; background-color: #222222; color: #777777; text-align: center; }
.footerLinks a { color: #FFFFFF; margin-right: 5px; margin-left: 5px; font-size: 14px; } 
.footerLinks a:hover { color: #FFFFFF; margin-right: 5px; margin-left: 5px; font-size: 14px; } 
.footerDownloads { width: 100%; text-align: center; cursor: pointer; }
.appStoreIcon { display: inline-block; width: 149px; height: 50px; background-image: url('../img/appstore_white.png'); background-size: 100%; margin: 10px; opacity: 0.4; }
.googlePlayIcon { display: inline-block; width: 149px; height: 50px; background-image: url('../img/googleplay_white.png'); background-size: 100%; margin: 10px; opacity: 0.4; }
.footerAuthor { margin-top: 30px; margin-bottom: 40px; }
.authorLogo { width: 72px; height: 50px; background-image: url('../img/author.png'); background-size: 100%; opacity: 0.4; }
.footerAuthorText { margin-top: 5px; font-size: 14px; }
.hashtagContainer { margin-top: 40px; margin-bottom: 10px; }
.shareContainer { margin-bottom: 40px; }

/* Footer.download */
.downloadHeaderContainer { width: 100%; padding: 30px; box-sizing: border-box; text-align: center; } 
.downloadStoresContainer { width: 100%; box-sizing: border-box; text-align: center; }
.downloadStoreImage { width: 130px; height: 130px; margin-bottom: 30px; margin-top: 30px; opacity: 1; }
.downloadStoreiOS { background-image: url('../img/download_ios_w.png'); background-size: 100%; margin-left: 20px; }
.downloadStoreOSX { background-image: url('../img/download_osx_w.png'); background-size: 100%; }
.downloadStoreAndroid { background-image: url('../img/download_android_w.png'); background-size: 100%; }
.downloadStoresTitle { font-size: 25px; color: #FFFFFF; opacity: 0.4; padding-bottom: 30px; }

/* Footer.Social Media */
.reachUsTitile { font-size: 25px; color: #FFFFFF; opacity: 0.4; padding-top: 30px; padding-bottom: 30px; }
.reachUsContainer { width: 100%; text-align: center; box-sizing: border-box; padding-bottom: 30px; }
.socialMediaImage_Twitter { width: 40px; height: 40px; background: url('../img/sm_twitter.png'); background-size: 100%; margin-right: 10px; margin-left: 10px; opacity: 0.4; }
.socialMediaImage_Instagram { width: 40px; height: 40px; background: url('../img/sm_instagram.png'); background-size: 100%; margin-right: 10px; margin-left: 10px; opacity: 0.4; }
.socialMediaImage_LinkedIn { width: 40px; height: 40px; background: url('../img/sm_linkedin.png'); background-size: 100%; margin-right: 10px; margin-left: 10px; opacity: 0.4; }
.socialMediaImage_Email { width: 40px; height: 40px; background: url('../img/sm_email.png'); background-size: 100%; margin-right: 10px; margin-left: 10px; opacity: 0.4; }

/* Main container */
.blocksContainer { z-index: 90; position: absolute; top: 100%; width: 100%; overflow: scroll; -webkit-overflow-scrolling: touch; }

/* Index About */
.quoteContainer { width: 100%; padding: 40px; box-sizing: border-box; text-align: center; font-size: 30px; }
.textContainer { width: 100%; padding: 30px; box-sizing: border-box; text-align: center; font-size: 18px; }
.screenshotsContainer { width: 100%; white-space: nowrap; overflow: scroll !important; -webkit-overflow-scrolling: touch; text-align: center; }
.screenshotElement { display: inline-block; width: 187px; margin: 30px; white-space: normal; }
.screenshotImage { width: 187px; height: 400px; }
.screenshotDescription { width: 187px; height: 160px; overflow: hidden; text-align: justify; text-align-last: center; display: block; font-size: 16px; white-space: normal; }
.screenshotTitle { color: #cc3c44; font-weight: bold; margin-bottom: 10px; }

/* Index Commercial */
.commercialContainer { width: 100%; margin-right: auto; margin-left: auto; }

/* Index Platforms */
.platformsContainer { width: 100%; padding: 30px; box-sizing: border-box; text-align: center; }
.platformsImage { width: 100%; }
.platformsText { width: 100%; margin-top: 20px; font-size: 16px; }

/* Index Specs */
.specsContainer { width: 100%; text-align: center; }
.specsElement { display: inline-block; width: 250px; margin: 20px; margin-top: 20px; padding: 20px; border-radius: 3px; }
.specsImage { width: 75px; height: 75px; }
.specsDescription { width: 250px; height: 80px; overflow: hidden; font-size: 16px; white-space: normal; text-align: justify; text-align-last: center; }
.specsAPI { background-image: url('../img/specs/api_color.png'); background-size: 100%; }
.specsSSL { background-image: url('../img/specs/ssl_color.png'); background-size: 100%; }
.specsOOP { background-image: url('../img/specs/oop_color.png'); background-size: 100%; }
.specsOPTIMIZED { background-image: url('../img/specs/optimized_color.png'); background-size: 100%; }

/* Index Clients */
.clientsContainer { width: 100%; text-align: center; white-space: nowrap; overflow: scroll !important; -webkit-overflow-scrolling: touch; }
.clientsElement { display: inline-block; width: 150px; margin: 20px; margin-top: 0px; padding: 20px; }
.clientsImage { width: 100px; height: 100px; border-radius: 100%; }
.clientName { width: 100%; font-size: 18px; color: #c83d43; }
.clientDescription { width: 100%; font-size: 14px; }
.client_Almedlij { background-image: url('../img/clients/almedlij.jpg'); background-size: 100%; }
.client_Alkandari { background-image: url('../img/clients/alkandari.jpg'); background-size: 100%; }
.client_Almudhaf { background-image: url('../img/clients/almudhaf.jpg'); background-size: 100%; }
.client_Alfadhalah { background-image: url('../img/clients/alfadhalah.jpg'); background-size: 100%; }
.client_Albassam { background-image: url('../img/clients/albassam.jpg'); background-size: 100%; }

/* Index Pricing */
.pricesContainer { width: 100%; text-align: center; }
.pricesElement { display: inline-block; width: 300px; margin: 20px; background-color: #F9F9F9; padding: 20px; border-radius: 3px; }
.priceTitle { font-size: 25px; color: #c83d43; }
.priceSubtitle { font-size: 16px; color: #999999; }
.pricesTable { width: 100%; }
.priceTableCellTitle { width: 50%; padding: 10px; font-size: 14px; }
.priceTableCellFigure { width: 50%; padding: 10px; color: #FFFFFF; background-color: #c83d43; font-weight: bold; font-size: 20px; border-radius: 3px; cursor: pointer; }
.disclaimerSup { color: #c83d43; }
.disclaimersContainer { width: 100%; padding: 20px; box-sizing: border-box; text-align: center; font-size: 13px; }
.pricesImage { width: 75px; height: 75px; }
.pricesOmma { background-image: url('../img/specs/omma_color.png'); background-size: 100%; }
.pricesBaladi { background-image: url('../img/specs/baladi_color.png'); background-size: 100%; }
.pricesCoop { background-image: url('../img/specs/coop_color.png'); background-size: 100%; }
.priceTableCellTitleDes { width: 100%; font-size: 13px; color: #666666; }

/* Index Media */
.mediaContainer { width: 100%; text-align: center; }
.mediaElement { display: inline-block; width: 71px; height: 50px; margin: 20px; overflow: hidden; }
.mediaImage { width: 71px; height: 50px; opacity: 0.3; }

/* Index Prerequisits */
.prerequisitsContainer { width: 100%; text-align: center; }
.prerequisitsElement { display: inline-block; width: 300px; height: 245px; margin: 20px; background-color: #F9F9F9; padding: 20px; border-radius: 3px; overflow: hidden; }	
.prerequisitsTitle { font-weight: bold; margin-bottom: 20px; }
.prerequisitsText { font-size: 14px; text-align: justify; text-align-last: center; }
.prerequisitsImage { width: 75px; height: 75px; }
.prerequisitsList { background-image: url('../img/specs/list_color.png'); background-size: 100%; }
.prerequisitsCloud { background-image: url('../img/specs/cloud_color.png'); background-size: 100%; }
.prerequisitsSpecs { background-image: url('../img/specs/specs_color.png'); background-size: 100%; }
.providersContainer { width: 100%; text-align: center; }
.providersElement { display: inline-block; width: 50px; height: 50px; margin: 20px; overflow: hidden; }
.providerImage { width: 50px; height: 50px; opacity: 0.3; }

/* Analytics */
.analyticsMainHoriMenu { width: 100%; text-align: center; }
.analyticsMainHoriMenuEl { display: inline-block; width: 22%; margin: 10px; padding-top: 20px; padding-bottom: 20px; text-align: center; font-size: 20px; border: 2px solid #c83d43; border-radius: 3px; }
.analyticsHomeContainer { width: 100%; padding: 30px; box-sizing: border-box; font-size: 18px; text-align: center; }
.analyticsSectionContainer { width: 100%; padding-top: 50px; padding-bottom: 50px; text-align: center; }
.analyticsSubSectionContainer { padding-top: 50px; width: 100%; text-align: center; }
.analyticsSearchContainer { padding-top: 50px; width: 100%; text-align: center; margin-bottom: 50px; }
.analyticsWelcomeText { font-size: 18px; }
.analyticsOverallChartsContainer { will-change: padding-top, opacity;  padding-top: 150px; opacity: 0; }
@keyframes loadAOCCKF { from { opacity: 0; padding-top: 150px; } to { opacity: 1; padding-top: 0px; } }
.loadAOCC { animation-name: loadAOCCKF; animation-duration: 0.7s; animation-iteration-count: 1; animation-fill-mode: forwards; -webkit-animation-timing-function: ease; animation-timing-function: ease; }
.analyticsHoriChartsBox { width: 100%; white-space: nowrap; overflow-y: hidden; overflow-x: scroll !important; -webkit-overflow-scrolling: touch; }
.analyticsChartElement { display: inline-block; width: 460px; height: 350px; margin-right: 20px; }
.analyticsTFContainer { width: 100%; margin-bottom: 50px; }
.analyticsTotalFigure { font-weight: bold; font-size: 40px; color: #c83d43; }
.analyticsSubHoriMenu { width: 100%; text-align: center; }
.analyticsSubHoriMenuEl { display: inline-block; margin: 10px; padding: 20px; text-align: center; font-size: 16px; border: 2px solid #c83d43; border-radius: 3px; }
.analyticsSearchInput { outline-width: 0; -webkit-appearance: none; width: 80%; text-align: center; box-sizing: border-box; padding: 20px; border: 0px; border-bottom: 1px solid #EEEEEE; border-radius: 0px; font-family: "Dubai"; font-size: 18px; color: #111111; }
.analyticsSearchInput::-webkit-input-placeholder { color: #999999; }
.analyticsRecordContainer { margin-top: 20px; }
.analyticsRecordName { font-size: 18px; font-weight: bold; color: #c83d43; }
.analyticsRecordBlock {  }
.analyticsSearch_caution { font-size: 20px; color: #000000; }

/* Jobs */
.jobTitle { font-size: 22px; font-weight: bold; color: #c83d43; padding-top: 20px; padding-bottom: 10px; }
.jobShortDescription { color: #444444; }
.jobElementTitle { font-size: 20px; color: #c83d43; padding-top: 10px; padding-bottom: 5px; }
.jobElementDescription { font-size: 15px; color: #444444; }
.jobIncentives_Table { width: 100%; text-align: center; color: #000000; margin-top: 20px; }
.jobIncentives_TD1 { width: 34%; padding-top: 5px; padding-bottom: 5px; }
.jobIncentives_TD2 { width: 22%; padding-top: 5px; padding-bottom: 5px; }
.jobIncentives_TD3 { width: 22%; padding-top: 5px; padding-bottom: 5px; }
.jobIncentives_TD4 { width: 22%; padding-top: 5px; padding-bottom: 5px; }
.jobIncentives_TDTitle { border-top: 1px solid #000000; border-bottom: 1px solid #000000; font-weight: bold; }
.jobIncentives_TDFirst { padding-top: 10px !important; }
.jobApplyBox { width: 100%; padding: 20px; box-sizing: border-box; border-radius: 3px; border: 1px solid #CCCCCC; text-align: center; margin-top: 30px; }

/* Error Page */
.pageErrorCode { margin-top: 50px; font-size: 100px; color: #FFFFFF; width: 100%; text-align: center; }
.pageErrorDescription { font-size: 20px; color: #FFFFFF; width: 100%; text-align: center; }
.pageErrorLink { width: 300px; padding: 20px; margin-top: 80px; margin-right: auto; margin-left: auto; text-align: center; font-size: 18px; color: #c83d43; background-color: #FFFFFF; border-radius: 3px; }