@import url("../fontStyle.css");
@import url("header.css?v1.2");
@import url("menus.css?v3");
@import url("footer.css?v1.1");
@import url("formsStyle.css?v1.2");
@import url("sliders.css?v3.1");
@import url("searchResult.css");

* {
    box-sizing: border-box;
}

html {
  font-family: 'Assistant', 'Arial', sans-serif;
  line-height: 1.15;
  direction: rtl;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
   height: 100%;  
}

body {
    font-family: 'Assistant', 'Arial', sans-serif;
    margin: 0;
    padding: 0;
    color: #29344b;
    font-weight: 300;
    height: auto;
    text-align: right;
    background-color: #ffffff;
}

  /* Preloader */
  
#preloader {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #264275;
    z-index: 101;
}
  
#status {
    width: 220px;
    height: 110px;
    position: absolute;
    left: 50%;
    top: 50%;
    background-image: url(../../images/cloud/MainMenu/Logo2.png), url(../../images/cloud/MainMenu/Logo1.png), url(../../images/cloud/MainMenu/LogoIT.png);
    background-repeat: no-repeat;
    background-position: left 75px top 14px, left center, left 76px top 60px;
    background-size: 138px, 53px, 90px;
    margin: -100px 0 0 -100px;
}

#status::after {
    content: '';
    position: absolute;
    width: 1px;
    height: calc(100% - 23px);
    background-color: #b6d0ff;
    left: 62px;
    top: 0;
    bottom: 0;
    margin: auto;
}

:focus {
    outline: 0px solid #000;
}

a {
    text-decoration: none;
    color: #1a75d1;
}

a:hover {
    color: #042c7b;
    text-decoration: none;
}

a:focus {
    color: #000000;
    text-decoration: none;
}

a, button, input, select, textarea {
    transition: all .3s ease-in;
    
}

button {
    cursor: pointer;
}

button:focus {
    outline: 0px solid #000;
}

p {
    font-size: 1.250em;
    margin: 5px 0px 10px 0px;
    line-height: 26px;
    font-weight: 300;
}

strong, b {
    font-weight: 500;
}

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

img {
    vertical-align: middle;
    width: 100%;
}

.hidden {
    display: none;
}

.outline {
    outline: 2px solid #000000 !important;
}

header .outline {
    outline: 2px solid #ffffff !important;
}

/* start global styles */

.bgColor0 {
    background-color: #051d4d; 
}

.bgColor1 {
    background-color: #264275; 
}

.bgColor2 {
    background-color: #1a75d1; 
}

.bgColor3 {
    background-color: #534c99; 
}

.bgColor4 {
    background-color: #0f857b; 
}

.bgColor5 {
    background-color: #ffffff; 
}

.bgColor6 {
    background-color: #edf1f4; 
}

.bgColor7 {
    background-color: #a1dad6; 
}
.bgColor8 {
    background-color: #dee4e8; 
}

.bgColor9 {
    background-color: #e1e5f2;
}

.cloudbgColor {
    background-color: #dee4e8;
}

.servicefloorColor {
    background-color: #edf1f4;
}

.contactUs-section {
    background-color: #edf1f4;
}

a.ancourLink {
    position: relative;
    top: -50px;
}

.buttonCleanStyle {
    background-color: transparent;
    font-family: inherit;
    border: none;
}

p.expressTitle {
    text-align: center;
    font-size: 22px;
    font-weight: 400;
}

/* end global styles */


body.innerPage {
    padding-top: 125px;
}

article ul {
    margin: 15px 0px 15px 0px;
    padding: 0px 30px 0px 0px;
    list-style: none;
    font-size: 1.210em;
}

article ul li {
    line-height: 25px;
    margin-bottom: 15px;
    position: relative;
}

article ul li::before {
    content: '';
    position: absolute;
    right: -32px;
    top: 2px;
    width: 22px;
    height: 22px;
    background-image: url(../../images/cloud/Bullet.png);
    background-repeat: no-repeat;
    background-position: center center;
}

article ol {
    font-size: 1.150rem;
}

.heddingLevel-Style-centerd {
    text-align: center;
    font-weight: 500;
    font-size: 1.3em;
    max-width: 670px;
    margin: 40px auto;
}

a.goBack-btn {
    display: inline-block;
    position: relative;
    text-align: center;
    font-size: 1.250em;
    font-weight: 400;
    background-color: #1a75d1;
    padding: 10px 25px 10px 30px;
    margin: auto;
    color: #ffffff;
    box-shadow: 5px 5px 5px 0px rgba(0,0,0,0.15);
    border-radius: 2px;
}

a.goBack-btn.rmArrow::after {
    left: 15px;
}

a.goBack-btn.rmArrow:hover::after, a.goBack-btn.rmArrow:focus::after {
    left: 6px;
}

a.goBack-btn:hover, a.goBack-btn:focus {
    background-color: #134c86;
}

.servicesList-item {
    display: flex;
    justify-content: flex-start;
    padding: 30px 0px;
}

.introImage img {
    width: 260px;
    height: 240px;
    padding: 10px;
    background-color: #edf1f4;
    border-radius: 10px;
    margin: 5px 0px 0px 65px;
    box-shadow: -5px 5px 5px 0px rgba(0,0,0,0.15);
}

.innerArticleStyle h2 {
    margin: 0px;
    font-weight: 500;
    font-size: 1.4em;
    line-height: 26px;
}

.gradientColorStyle {
    background-color: #264275;
    height: 100vh;
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
}

img.nessLogotp {
    width: 50px;
    margin: auto;
    display: block;
}

.pic1, .pic2, .pic3, .pic4, .pic5 {
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}

.pic1 {
    background-image: url(../../images/cloud/HP/IMG1.png);
}

.pic2 {
    background-image: url(../../images/cloud/HP/IMG2.png);
}

.pic3 {
    background-image: url(../../images/cloud/HP/IMG3.png);
}

.pic4 {
    background-image: url(../../images/cloud/HP/IMG4.jpg);
}

.pic5 {
    background-image: url(../../images/cloud/HP/IMG5.jpg);
}

.picContainer {
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    width: 100%;
    height: 100%;
    z-index: 0;
    transition: all .2s ease-in;
}

.picContainer:hover, .gridCell a:focus .picContainer {
    width: 110%;
    height: 110%;
}

section.grid-container {
    max-width: 1920px;
    height: 100vh;
    padding: 25px 15px;
    position: relative;
    display: flex;
    flex-direction: column;
    margin: auto;
}

.gridCell a > span {
    transition: all .3s ease-in;
}

.gridCell a:hover > span, .gridCell a:focus > span {
    bottom: 15px;
}

.gridRow {
    display: flex;
    flex-direction: row-reverse;
    justify-content: flex-start;
    position: relative;
    margin-bottom: 16px;
    flex: 1;
}

.row2 {
    margin-bottom: 0px;
}

.gridCell {
    margin: 0px 8px;
    flex: 1;
    position: relative;
    overflow: hidden;
}

.gridCell.DubleCell {
    flex: 2 16px;
}

.gridCell a {
    display: block;
    width: 100%;
    height: 100%;
}

.gridCell a span {
    position: absolute;
    bottom: 0;
    font-size: 2.4em;
    padding: 0px 35px 24px 15px;
    right: 0;
    color: #ffffff;
    font-family: 'mixtape';
}

a.gridLink.outline:focus span {
    outline: 2px solid #000000;
}

.scrollDown {
    display: block;
    position: relative;
    width: 28px;
    height: 49px;
    padding: 0px;
    background-color: transparent;
    border: none;
    background-image: url(../../images/cloud/HP/SCROLL.png);
    background-repeat: no-repeat;
    background-position: center center;
}

.scrollDown span {
    font-family: 'mixtape';
    display: block;
    font-size: 1.4em;
    color: #ffffff;
    position: absolute;
    top: -60px;
    right: -31px;
    width: 90px;
    transform: rotate(-90deg);
}

.arrowDown-anim {
    position: absolute;
    left: 0;
    top: 0;
    bottom: -7px;
    right: 0;
    margin: auto;
    width: 16px;
    height: 19px;
    background-image: url(../../images/cloud/HP/arrowDown.png);
    background-repeat: no-repeat;
    background-position: center center;
    animation: float 2s ease-in-out infinite;
}

@keyframes float {
	0% {
		/* box-shadow: 0 5px 15px 0px rgba(0,0,0,0.6); */
		transform: translatey(0px);
	}
	50% {
		/* box-shadow: 0 25px 15px 0px rgba(0,0,0,0.2); */
		transform: translatey(-10px);
	}
	100% {
		/* box-shadow: 0 5px 15px 0px rgba(0,0,0,0.6); */
		transform: translatey(0px);
	}
}

.scrollDown-container {
    position: absolute;
    left: 38px;
    bottom: 70px;
}

.sectionContainer {
    padding: 75px 0px;
}

.sectionInner-container {
    max-width: 1080px;
    margin: auto;
    padding: 0px 15px;
}

.headingStyle1 {
    margin: 0px;
    font-size: 3.4em;
    font-family: 'mixtape';
    color: #1b3c81;
    text-align: center;
    line-height: 52px;
    font-weight: 100;
}

img.aboutUs-img {
    max-width: 510px;
    display: block;
    margin: auto;
}

.sectionHeader {
    padding: 15px 0px;
}

.centerBlockText {
    max-width: 795px;
    margin: auto;
}

/*thankYouMassage*/
.thankYouMassage h1 {
    color: #29344b;
    font-size: 1.4em;
    font-weight: 400;
    margin: 15px 0px;
}

.thankYouMassage {
    text-align: center;
    padding: 35px 15px;
}

.readMore-container {
    text-align: center;
    padding: 15px 0px;
}

a.readMore-link {
    font-size: 1.250em;
    font-weight: 500;
    position: relative;
}

a.rmArrow::after {
    content: "\f104";
    font-family: FontAwesome;
    position: absolute;
    left: -15px;
    font-size: 22px;
    font-weight: 600;
    transition: all .3s ease-in;
}

a.rmArrow:hover::after, a.rmArrow:focus::after {
    left: -10px;
}

.benefits-section {
    background-image: url(../../images/cloud/WhyUS/WhyUs_BG.png);
    background-repeat: no-repeat;
    background-position: top center;
    background-size: cover;
}

.headingStyle2 {
    margin: 0px;
    font-size: 3.4em;
    font-family: 'mixtape';
    color: #ffffff;
    text-align: center;
    line-height: 52px;
    font-weight: 100;
}

ul.benefitsList {
    color: #ffffff;
    padding: 0px;
    list-style: none;
    margin: 0px auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

ul.benefitsList li {
    width: 260px;
    padding: 0px;
    margin: 35px 30px 35px 30px;
    text-align: center;
}

ul.benefitsList li p {
    font-size: 1.350em;
    margin: 0px;
    padding: 0px;
    line-height: 28px;
}

.circleGreen, .circlePrpl, .circleBlue {
    font-family: 'PatuaOne-Regular';
    width: 79px;
    height: 79px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 3em;
    margin: 10px auto;
    background-repeat: no-repeat;
    background-position: top center;
}

.circleGreen {
    background-image: url(../../images/cloud/WhyUS/GreenFrame.png);
    color: #50e4af;
}

.circlePrpl {
    background-image: url(../../images/cloud/WhyUS/PirpleFrame.png);
    color: #be9aee;
}

.circleBlue {
    background-image: url(../../images/cloud/WhyUS/BlueFrame.png);
    color: #56c7d6;
}

ul.teamList {
    margin: 0px;
    padding: 40px 0px 0px 0px;
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

ul.teamList li {
    position: relative;
    margin: 7px;
    transition: all .3s ease-in;
}

ul.teamList li:hover, ul.teamList li:focus {
    transform: scale(1.150);
    position: relative;
    z-index: 10;
    box-shadow: 0px 0px 31px 0px rgba(34, 36, 39, 0.35);
}

ul.teamList li p {
    position: absolute;
    bottom: 9px;
    line-height: 25px;
    width: 100%;
    left: 0;
    right: 0;
    text-align: center;
    color: #ffffff;
    font-size: 1.2em;
    margin: 0px;
}

ul.teamList li p span {
    display: block;
}

span.teamMember-name {
    font-weight: 500;
}

.teamGrid-container {
    max-width: 890px;
    margin: auto;
}

.contactTeam-container {
    margin: 0px 13px;
    padding: 25px 220px 25px 15px;
    background-image: url(../../images/cloud/Team/Question_Illus.png);
    background-repeat: no-repeat;
    background-position: right 35px center;
    transition: all .2s ease-in;
}

.contactTeam-container:hover, .contactTeam-container:focus {
    background-position: right 50px center;
}

.headingStyle3 {
    margin: 0px;
    font-size: 2.8em;
    font-family: 'mixtape';
    color: #2b6298;
    line-height: 46px;
    font-weight: 100;
    position: relative;
    top: -7px;
}

.mailAddres {
    color: #2b6298;
    font-size: 1.5em;
    line-height: 15px;
    font-weight: 400;
    display: block;
}

a.mailLink:hover .mailAddres {
    color: #12395f;
    text-decoration: underline;
}

.dubleContainer {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}

.sectionBox-header {
    padding-bottom: 15px;
}

.sectionBox {
    flex: 1;
    padding: 10px;

}
.dataSlider-container {
    box-shadow: -5px 5px 5px 0px rgba(0,0,0,0.13);
    border-radius: 10px;
    padding: 40px 35px 25px 35px;
    height: calc(100% - 75px);
    position: relative;
}

.readLinks {
    background-image: url(../../images/cloud/Reading/ReadingIllustration-01.svg);
    background-repeat: no-repeat;
    background-position: right 25px bottom;
    background-size: 280px;
    padding-bottom: 170px;
}

.articledLinks {
    padding-bottom: 80px;
}

#uxAnimLogo {
    display: block;
    width: 170px;
    height: 47px;
    position: relative;
    bottom: -6px;
}

span.forScreenReaders {
    font-size: 0px;
    position: absolute;
}

p.credit a {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: flex-end;
    line-height: 28px;
    font-size: 1em;
    flex-direction: row-reverse;
    color: #ffffff;
}




@media (max-width: 800px) {

    .gridCell a span {
        font-size: 2em;
        width: 140px;
        padding: 0px 25px 24px 15px;
    }

    .dataSlider-container {
        padding: 40px 15px 25px 15px;
    }

    .readLinks {
        background-size: 170px;
        padding-bottom: 130px;
    }

    .articledLinks {
        padding-bottom: 64px;
    }

    body.innerPage {
        padding-top: 75px;
    }

    .introImage img {
        width: 180px;
        height: 160px;
    }

    .pic3 {
        background-position: right;
    }
    

}


@media (max-width: 736px) {

    .sectionContainer {
        padding: 45px 0px;
    }

    .row2, .cell2 {
        display: none;
    }

    .gridRow {
        margin: 0px;
    }

    section.grid-container {
        padding: 15px 5px;
    }

    .contactTeam-container {
        padding: 25px 90px 25px 15px;
        background-size: 40px;
        background-position: right 15px center;
    }

    .introImage img {
        width: 100%;
        height: 140px;
        margin: 0px 0px 20px 0px;
        background-color: transparent;
        box-shadow: none;
    }

    .servicesList-item {
        display: block;
    }

}

@media (max-width: 400px) {
    
    
}

@media (max-width: 320px) {
    
    
}