﻿
@font-face {
    font-family: 'Montserrat';
    src: url('~/fonts/Montserrat.otf') format('opentype');
    font-weight: normal;
    font-style: normal;
}




@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

html {
    position: relative;
    min-height: 100%;
    font-size: 12px;
}

body {
    font-family: 'Montserrat', 'Corbel', sans-serif;
    margin-bottom: 60px;
}

.btn-primary {
    background-color: #007bff;
    border-color: #007bff;
}

.btn-secondary {
    background-color: #6c757d;
    border-color: #6c757d;
 
}

.btn-login {
    background-color: #6c757d;
    border-color: #6c757d;
    color: white;
}

.btn-login:hover {
        background-color: transparent; /* Change hover background color */
        border-color: black;
        border: solid;
        border-width: medium;
        color: black; /* Ensure text color remains white */
        text-decoration: none; /* Ensure underline is not added on hover */
}

.nav-spacing {
    padding-left: 5%;
}



.full-width-Background-image {
    background-image: url('../Images/Bkg-darker Space with few faint stars.jpg');
    background-size: cover;
    background-position: center;
    width: 100%;
    /*height: 45%;*/ /* Adjust height as needed */
   height: 28vw;
    display: flex;
   
}

.full-width-Background-image-long {
    background-image: url('../Images/Bkg-darker Space with few faint stars.jpg');
    background-size: cover;
    background-position: center;
    width: 100%;
    /*height: 45%;*/ /* Adjust height as needed */
    height: 35vw;
    display: flex;
   
}



.home-hero-text {
    display: inline-block;
    
    width: 58%;
}

.home-hero-banner1-image {
    display: inline-block;
    height: 100%;
    width: 38%;
    padding: 1% 0 1% 0;
}

.stretch-image {
    width: 100%;
    height: 100%;
    object-fit: contain;
   
}

.stretch-image-75 {
    width: 75%;
    height: 75%;
    object-fit: contain;
}

.stretch-image-90 {
    width: 90%;
    height: 90%;
    object-fit: contain;
}

.home-hero-title-text-overlay {
    display: block;
    color: white;
    text-align: center;
    font-family: 'Montserrat', 'Corbel', sans-serif;
    font-weight: bolder; /* Makes the text bold */
    font-size: 2.6vw;
}

.home-hero-caption {
    display: block;
    color: white;
    top: 37%;
    left: 28%;
    width: 100%;
    text-align: center;
    font-size: 1.3vw; /* Adjust size as needed */
}

.home-hero-problems-caption-black {
    display: block;
    color: black;
    top: 37%;
    left: 28%;
    width: 80%;
    text-align: left;
   
    font-size: 1.4vw; /* Adjust size as needed */
   
}

.hero-problems-caption-black {
    display: block;
    color: black;
    top: 37%;
    left: 28%;
    width: 90%;
    text-align: left;
    font-size: 1.4vw; /* Adjust size as needed */
}

.Industry-Spectrum-Challenges-caption-black {
    display: block;
    color: black;
    padding: 3% 10% 3% 10%;
    width: 100%;   
    text-align: left;
    font-size: 1.4vw; /* Adjust size as needed */
}


.center-button {
    padding-left: 0%;
}

.home-register-button {
    
    background-color: white;
    color: black;
    border-color: white;
    padding: 1vw 2vw;
    text-align: center;
    border: solid;
    cursor: pointer;
    text-decoration: none; /* Remove underline */
}

    .home-register-button:hover {
        background-color: transparent; /* Change hover background color */
        border-color: white;
        border: solid;
        border-width: medium;
        color: white; /* Ensure text color remains white */
        text-decoration: none; /* Ensure underline is not added on hover */
    }



    .home-register-button-white-bkg {
        background-color: white;
        color: black;
        border-color: white;
        padding: 1vw 2vw;
        text-align: center;
        border: solid;
        cursor: pointer;
        text-decoration: none; /* Remove underline */
    }

        .home-register-button-white-bkg:hover {
            background-color: #07073e; /* Change hover background color */
            border-color: black;
            border: solid;
            border-width: medium;
            color: white;
            text-decoration: none; /* Ensure underline is not added on hover */
        }

    /* Start Home Page 2nd */

.full-width-Background {   
    width: 100%;
    height: 45%; /* Adjust height as needed */
   
}

.home-hero-top {
    display: inline-block;
    color: black;
    text-align: center;
    font-size: 3vw;
    font-family: 'Montserrat', 'Corbel', sans-serif;
    font-weight: bolder; /* Makes the text bold */
    width: 100%;
}

.home-hero-top-text {
    display: inline-block;
    width: 100%;
}

.home-hero-text2 {
    display: inline-block;
    width: 58%;
    padding: 1% 3% 0 3%;
}

.Left-text {
    text-align: left;
}

.home-hero-2column {
    display: flex;
    color: black;
    text-align: center;
   
   width: 100%;
}

.home-hero-caption2 {
    display: block;
    color: black;
    padding: 0 15% 0 15%;
    width: 100%;
    text-align: center;
    font-family: 'Montserrat', 'Corbel', sans-serif;
    font-weight: bolder; /* Makes the text bold */
    font-size: 1.2vw; /* Adjust size as needed */
}

.home-hero-title-text2 {
    display: block;
    color: black;
    text-align: center;
    font-family: 'Montserrat', 'Corbel', sans-serif;
    font-weight: bolder; /* Makes the text bold */
    font-size: 2.3vw;
}

.home-hero-title-text2-with-padding {
    display: block;
    color: black;
    padding: 0 10% 0 10%;
    text-align: center;
    font-family: 'Montserrat', 'Corbel', sans-serif;
    font-weight: bolder; /* Makes the text bold */
    font-size: 2.3vw;
}


.hero-title-text2-white-with-padding {
    display: block;
    color: white;
    padding: 0 10% 0 15%;
    text-align: center;
    font-family: 'Montserrat', 'Corbel', sans-serif;
    font-weight: bolder; /* Makes the text bold */
    font-size: 2.3vw;
}

.home-hero-banner2-image {
    display: inline-block;
    height: 96%;
    flex: 2;
    max-width: 38%;
    padding: 1% 0 1% 0;
}


.home-hero-problems-banner-image {
    display: inline-block;    
    max-height: 96%;
    flex: 2;
    max-width: 38%;
    padding: 1% 0 1% 0;
}


/* start Flexible Expertise */
.Link-to-full-project {
    display: inline-block;
    background-image: url('/Images/_Full project 2.jpg');
    height: 100%;
    width: 100%;
    background-size: cover; /* Ensures the image covers the entire container */
    background-position: center; /* Centers the image */
    border: none;
    cursor: pointer;
    text-decoration: none; /* Remove underline */
}

    .Link-to-full-project:hover {
        background-image: url('/Images/_Full project 2.jpg');
    }


.Link-to-augment-team {
    display: inline-block;
    background-image: url('/Images/_Augment your team 2.jpg');
    height: 100%;
    width: 100%;
   
    background-size:cover; /* Ensures the image covers the entire container */
    background-position: center; /* Centers the image */
    border: none;
    cursor: pointer;
    text-decoration: none; /* Remove underline */
}

    .Link-to-augment-team:hover {
        background-image: url('/Images/_Augment your team 2.jpg');
    }


.Link-to-a-la-carte {
    display: inline-block;
    background-image: url('/Images/_A la Cart 2.jpg');
    height: 100%;
    width: 100%;
   
    background-size: cover; /* Ensures the image covers the entire container */
    background-position: center; /* Centers the image */
    border: none;
    cursor: pointer;
    text-decoration: none; /* Remove underline */
}

    .Link-to-a-la-carte:hover {
        background-image: url('/Images/_A la Cart 2.jpg');
    }

.image-link-choose {
    flex: 1 1 25%;
    margin-left: 15px;
    margin-right: 15px;
    text-align: center; /* Center the text */
}

.image-container-choose {
    width: 25vh;
    height: 40vh;
  
}


ul.custom-diamond2 {
    list-style: none; /* Remove default bullets */
}
ul.custom-diamond2 li::before {
    content: "♦"; /* Unicode diamond character */
    color: black; /* Customize color */
    display: inline-block;
    width: 2em;
    margin-left: -2em;
}


ul.custom-diamond {
    list-style: none; /* Remove default bullets */
    width: 80%;
    padding-left: 12%;
    font-size: 1.4vw; /* Adjust size as needed */
    font-weight: 500;
    text-align: left;
    color: black;
}

    ul.custom-diamond li::before {
        content: "♦"; /* Unicode diamond character */
        color: black; /* Customize color */
        display: inline-block;
        width: 2em;
        margin-left: -2em;
        
    }


.row {
    display: flex;
    gap: 2px;
    width: 90%;
    padding-left: 9%;
}

.row-antiqueWhite {
    display: flex;
    gap: 2px;
   
    width: 90%;
    padding-left: 9%;
    background-color: antiquewhite;
}

.column {
    flex: 1;
  
    background-color: #ddd;
    
    border: 1px solid #aaa;
    width: 100%;
}
.column p {
    font-size: 1vw;
    color: black;
}


.WhiteText {
    color:white;
    font-size: 1.4vw;
}

.DarkText {
    color: darkblue;
    font-size: 1.4vw;
}

.Center-Title-Black {
    font-size: 1.8vw;
    text-align: center;
    font-weight: bolder;
}


/*  */

.custom-diamond {
    display: inline-block;
    color: darkblue;
    text-align: center;
    font-size: 1.6vw;
    width: 30%;
    margin-left: 13%;
    font-family: 'Montserrat', 'Corbel', sans-serif;
    font-weight: bolder; /* Makes the text bold */
}

.Background-LightAntiqueWhite {
    background-color: antiquewhite;
    
}
.Background-FloralWhite {
    background-color:floralwhite;
}


.Background-LightAntiqueWhite-rounded {
    background-color: antiquewhite;
    border-radius: 15px;
   
}

.Background-DarkBlue-Left {
    background-color: #012a4f;
    border-top-left-radius: 15px;  

}

.Background-DarkBlue-Right {
    background-color: #012a4f;
  
    border-top-right-radius: 15px;
}

.home-hero-title-text-black-38 {
    display: inline-block;
    color: black;
    text-align: center;
    font-size: 2.4vw;
    width: 38%;
    font-family: 'Montserrat', 'Corbel', sans-serif;
    font-weight: bolder; /* Makes the text bold */
}
.home-hero-title-text-black-58 {
    display: inline-block;
    color: black;
    text-align: center;
    font-size: 2vw;
    width: 58%;
}

.home-hero-caption-black {
    display: block;
    color: black;
    top: 37%;
    left: 28%;
    width: 100%;
    text-align: left;
    font-size: 1.3vw; /* Adjust size as needed */
    padding-left: 2%;
}

.full-width-Background2 {
    width: 100%;
    height: 55%; /* Adjust height as needed */
}

.full-width-Background3 {
    width: 84vw;
    height: 55%; /* Adjust height as needed */
    padding-left: 8vw;
}

/*    */
.home-hero-3column {
    display: flex;
    color: white;
   /* text-align: center;*/
    width: 100%;
    padding: 0 0 2% 0;
}

.home-hero-title-text-white-29 {
    display: inline-block;
    color: white;
    text-align: center;
    font-size: 2vw;
    width: 29%;
}

.home-hero-title-text-white- {
    display: inline-block;
    color: white;
    text-align: center;
    font-size: 2.2vw;
    font-weight: bolder;
    width: 100%;
    padding: 0 0 1% 0;
}

.home-hero-text3 {
    display: inline-block;
    width: 32%;
}

.home-hero-text4 {
    display: inline-block;

    width: 38%;
}


.home-hero-title-text-white-38 {
    display: inline-block;
    color: white;
    text-align: center;
    font-size: 2.3vw;
    width: 38%;
    font-family: 'Montserrat', 'Corbel', sans-serif;
    font-weight: bolder; /* Makes the text bold */
}

.home-hero-caption3 {
    display: inline-block;
    color: white;   
    width: 100%;
    text-align: left;
    font-size: 1.5vw; /* Adjust size as needed */
    padding: 15% 0 0 12%;
}

.home-hero-caption4 {
    display: inline-block;
    color: white;
    width: 100%;
    text-align: left;
    font-size: 1.5vw; /* Adjust size as needed */
    padding: 15% 10% 0 0;
}

.home-hero-banner4-image {
    display: inline-block;
    height: 92%;
    flex: 2;
    
    padding: 1% 0 1% 5%;
}






.Link-to-video {
    display: inline-block;
    background-image: url('/Images/iPaaS Central - Thumbnail 1-05 V2.jpg');
    width: 100%; /* Adjust as needed */
    height: 100%; /* Adjust as needed */
    background-size: cover; /* Ensures the image covers the entire container */
    background-position: center; /* Centers the image */
    border: none;
    cursor: pointer;
    text-decoration: none; /* Remove underline */
}
.Link-to-video:hover {
        background-image: url('/Images/iPaaS Central - Thumbnail 1-05 HOVER v2.jpg');       
        
    }


.Link-to-download-flow {
    display: inline-block;
    background-image: url('/Images/iPaaS CentralDownloadCode.jpg');
    width: 100%; /* Adjust as needed */
    height: 100%; /* Adjust as needed */
    background-size: cover; /* Ensures the image covers the entire container */
    background-position: center; /* Centers the image */
    border: none;
    cursor: pointer;
    text-decoration: none; /* Remove underline */
}

.Link-to-download-flow:hover {
        background-image: url('/Images/iPaaS Central - Thumbnail 2-05 HOVER.jpg');
    }


.Link-to-download-guide {
    display: inline-block;
    background-image: url('/Images/iPaaS Central - Thumbnail 3-05.jpg');
    width: 100%; /* Adjust as needed */
    height: 100%; /* Adjust as needed */
    background-size: cover; /* Ensures the image covers the entire container */
    background-position: center; /* Centers the image */
    border: none;
    cursor: pointer;
    text-decoration: none; /* Remove underline */
}

.Link-to-download-guide:hover {
    background-image: url('/Images/iPaaS Central - Thumbnail 3-05 HOVER.jpg');

}

.Flow-on-Monitor {
    display: inline-block;
    background-image: url('/Images/_About Us.jpg');
    width: 100%; /* Adjust as needed */
    height: 100%; /* Adjust as needed */
    background-size: cover; /* Ensures the image covers the entire container */
    background-position: center; /* Centers the image */
    border: none;
    cursor: pointer;
    text-decoration: none; /* Remove underline */
}

.cookie-consent-banner {
    position: fixed;
    bottom: 0;
    width: 100%;
    background-color: #d4edda;
    color: #155724;
    text-align: center;
    padding: 10px;
    z-index: 1000;
}

.cookie-consent-container {
    display: flex;
    justify-content: left;
    align-items: center;
}

.cookie-consent-container p {
    margin: 0;
}

.cookie-consent-container button {
    margin-left: 10px;
}

.full_width-Background-image {
    background-image: url('../Images/Bkg-darker Space with few faint stars.jpg');
    background-size: cover;
    background-position: center;
    width: 100%;
    height: 400px; /* Adjust height as needed */
    position: relative;
}

.full-width-about-background-image {
    background-image: url('../Images/iPaaS Central - About Us Page Hero Image.jpg');
    background-size: cover;
    background-position: center;
    width: 100%;
    height: 400px; /* Adjust height as needed */
    position: relative;
}

.full-width-Bottom-Background-image {
    background-image: url('../Images/iPaaS Central-HomeBanner-NoText1920.jpg');
    background-size: cover;
    background-position: center;
    width: 100%;
    height: 200px; /* Adjust height as needed */
    position: relative;
}

.centered-width-ContacttUs-background-image {
    background-image: url('../Images/iPaaS Central - Contact Us Banner.jpg');
    background-size: cover;
    background-position: center;
    
    width: 100%;
    height: 300px; /* Adjust height as needed */
    position: relative;
}

.centered-width-DownloadFiles-background-image {
    background-image: url('../Images/iPaaS Central - File Download Banner.jpg');
    background-size: cover;
    background-position: center;
   
    width: 100%;
    height: 300px; /* Adjust height as needed */
    position: relative;
}

.centered-width-DownloadGuides-background-image {
    background-image: url('../Images/iPaaS Central - Flow Guide and Instruction Banner.jpg');
    background-size: cover;
    background-position: center;
    
    width: 100%;
    height: 300px; /* Adjust height as needed */
    position: relative;
}

.centered-width-Videos-background-image {
    background-image: url('../Images/iPaaS Central - Training Video Banner.jpg');
    background-size: cover;
    background-position: center;
   
    width: 100%;
    height: 300px; /* Adjust height as needed */
    position: relative;
}


.centered-content {
    margin-left: 24%;
    width: 50%;
    position: relative;
}

.homehero-title-text-overlay {
    position: relative;
    top: 20%;
  
    left: 32%;
    width: 55%;
    transform: translate(-50%, -50%);
    color: white;
    text-align: left;
}

.homebottom-title-text-overlay {
    position: relative;
    top: 25%;  
    left: 32%;
    width: 55%;
    transform: translate(-50%, -50%);
    color: white;
    text-align: left;
}

.about-title-text-overlay {
    position: relative;
    top: 20%;
    left: 35%;
    width: 65%;
    transform: translate(-50%, -50%);
    color: white;
    text-align: left;
}

.download-title-text-overlay {
    position: relative;
    top: 25%;
    left: 37%;
    width: 60%;
    transform: translate(-50%, -50%);
    color: white;
    text-align: left;
    font-family: 'Montserrat', 'Corbel', sans-serif;
    font-weight: bolder; /* Makes the text bold */
  
    font-size: 4em; /* Adjust size as needed */
}

.download-guides-title-text-overlay {
    position: relative;
    top: 15%;
    left: 35%;
    width: 70%;
    transform: translate(-50%, -50%);
    color: white;
    text-align: center;
    font-family: 'Montserrat', 'Corbel', sans-serif;
    font-weight: bolder; /* Makes the text bold */

    font-size: 4em; /* Adjust size as needed */
}


.full-width-image img {
    width: 100%;
    max-width: 100%;
    height: auto;
}

.link-text {
    font-size: 1.2em; /* Adjust size as needed */
}


.homehero-caption {
    position: relative;
    transform: translate(-50%, -50%);
    color: white;
    top: 37%;
    left: 28%;
    width: 47%;
    text-align: left;
    font-size: 1.2em; /* Adjust size as needed */
}

.homebottom-caption {
    position: relative;
    font-size: 1.1em; /* Adjust size as needed */
    transform: translate(-50%, -50%);
    color: white;
    top: 32%;
    left: 40%;
    width: 70%;
    text-align: left;
}

.mid-page-title-block {
    padding-top: 3%;
    padding-left: 10%;
    padding-right: 10%;
    text-align: center; /* Center the text */
   
}





.register-button {
    background-color: white;
    color: black;
    border-color: white;
    padding: 1vw 2vw;
    border: solid;
    cursor: pointer;
    text-decoration: none; /* Remove underline */
}

.register-button:hover {
        background-color: transparent; /* Change hover background color */
        border-color: white;
        border: solid;
        border-width:medium;
        color: white; /* Ensure text color remains white */
        text-decoration: none; /* Ensure underline is not added on hover */
    }


.mid-page-row {
    margin-left: 3%;
    margin-right: 3%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  
}



.image-link {
    flex: 1 1 25%;
    margin-left: 15px;
    margin-right: 15px;
    text-align: center; /* Center the text */
}

.two-column {
    flex: 1 1 45%;
    margin-left: 15px;
    margin-right: 15px;
    text-align: center; /* Center the text */
}

.image-container {
    width: 100%;
    height: 30vh;
}

.image-container50 {
    width: 100%;
    height: 40vh;
}

.form-background {
    background-color: #07073e;
    color: white;
}

.form-two-column {
    flex: 1 1 45%;
    margin-left: 15px;
    margin-right: 15px;
    text-align: center; /* Center the text */
}

.left-column-25 {
    display: inline-block;   
    text-align:left;
    vertical-align: top;
    padding: 0 4% 0 0;
    font-size: 1.4vw;
    width: 30%;
    font-family: 'Montserrat', 'Corbel', sans-serif;
}

.right-column-55 {
    display: inline-block;   
    text-align: left;
    vertical-align: top;
    font-size: 1.4vw;
    width: 55%;
    font-family: 'Montserrat', 'Corbel', sans-serif;
}


.column-55 {
    display: inline-block;
    text-align: left;
    vertical-align: top;   
    width: 55%;
    font-family: 'Montserrat', 'Corbel', sans-serif;
}

/* .image-container img {
     width: 100%;
     height: auto;
    }*/

.text-container {
    padding-left: 7%;
    padding-right: 7%;
  
   
    text-align: center; /* Center the text */
}

.text-container2 {
    padding-left: 5%;
    padding-right: 0%;
    text-align: left; /* Center the text */
}

.small-caption {
    margin-top: 1px;
    padding-left: 17%;
    padding-right: 17%;
  
    text-align: center; /* Center the text */
}

.side-caption {
    margin-top: 1px;
    padding-left: 5%;
    padding-right: 0%;
    text-align: left; /* Center the text */
    font-size: 1.3em;
}

.side-caption-15 {
    margin-top: 1px;
    padding-left: 5%;
    padding-right: 0%;
    text-align: left; /* Center the text */
    font-size: 1.5em;
}

.mission {
    font-style: italic;
    font-size: 1.3em;
    margin-left: 25%;
    margin-right:25%;
}

.form-width {
   
    margin-left: 25%;
    margin-right: 25%;
}

.form-input-checkbox{
    display: flex;
    align-items: center;
}

.form-check-input {
    margin-right: 10px;
}


h1 {
    font-family: 'Montserrat', 'Corbel', sans-serif;
    font-weight: bolder; /* Makes the text bold */   
    margin-top: 20px; /* Add some top margin */
}

h2 {
    font-family: 'Montserrat', 'Corbel', sans-serif;
    font-weight: bolder; /* Makes the text bold */

    font-size: 1.7em; /* Adjust size as needed */

    text-align: center; /* Center the text */
    margin-top: 10px; /* Add some top margin */
}

h5 {
    font-family: 'Montserrat', 'Corbel', sans-serif;
    text-align: center; /* Center the text */
    font-size: 1.1em; /* Adjust size as needed */
    margin-top: 5px; /* Add some top margin */
}

.KnowledgeText {
    font-family: 'Montserrat', 'Corbel', sans-serif;
    text-align: left;
    font-size: 1em;
    width: 80%;
    padding: 0 0 0 20%;
}

