﻿:root {
    --main-color: #f21010;
    --main-secondary-color: #cfcfcf;
    --main-secondary-Text-color: #00000050;
    --btn-text: #ffffff;
    --btn-color: #f21010;
    --btn-hover: #555555;
    --link-text: #555555;
    --link-hover: #f21010;
    --blue: #5e50f4;
    --indigo: #6610f2;
    --purple: #6a008a;
    --pink: #e91e63;
    --red: #f21010;
    --orange: #f2a654;
    --yellow: #f6e84e;
    --green: #46c35f;
    --teal: #58d8a3;
    --cyan: #57c7d4;
    --white: #ffffff;
    --gray: #6c757d;
    --gray-background1: #cfcfcf;
    --gray-dark: #0f1531;
    --gray-light: #aab2bd;
    --gray-lighter: #e8eff4;
    --gray-lightest: #e6e9ed;
    --black: #000000;
    --primary: #46c35f;
    --secondary: #3a3a3a;
    --success: #3e8177;
    --info: #4d7cff;
    --warning: #f5a623;
    --danger: #fc5661;
    --light: #f8f9fa;
    --dark: #000;
    --breakpoint-xs: 0;
    --breakpoint-sm: 576px;
    --breakpoint-md: 768px;
    --breakpoint-lg: 992px;
    --breakpoint-xl: 1200px;
    --font-family-sans-serif: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    --font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}
.btn-primary {
    background-color: var(--btn-color);
    color: var(--btn-text);
    border:0px;
}
    .btn-primary:hover {
        background-color: var(--btn-hover);
        color: var(--btn-text);
        border: 0px;
    }
    .btn-primary:focus {
        background-color: var(--btn-color);
       
        color: var(--btn-text);
        border: 0px;
    }
/* Sticky footer styles
-------------------------------------------------- */
html {
    position: relative;
    font-family: var(--font-family-sans-serif);
    min-height: 100%;
}

body {
    /* Margin bottom by footer height */
    margin-bottom: 210px;
    font-family: -apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
/*    font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
*/    font-size: .9375rem;
    font-weight: normal;
    line-height: 1.5;
    color: #393f46;
    text-align: left;
   
    padding-top: 15px;
    padding-bottom: 40px;

/*    background-color: var(--gray-background) !important;
 
    box-sizing: border-box;
*/    /*    background-image: url('../img/thestormred.jpg');*/
/*    background-image: url('../img/servers.jpg');  
    background-repeat: no-repeat;
    background-size: cover;*/
}

.container {
/*    background-color: var(--gray-background1) !important;
*/
}

.footer {
    position: absolute;
    bottom: 0;
    width: 100%;
    /* Set the fixed height of the footer here */
    height: 210px;
    line-height: 20px;
    /*  Vertically center the text there */
    /*background-color: #333;*/
}

footer-bottom {
    padding-bottom: 210px;
}

.footer-bottom-wrapper {
    /*  background-color: #9ca8b4;
    width: 100%;*/
}

/* Wrapping element */
/* Set some basic padding to keep content from hitting the edges */
.body-content {
    padding-left: 0px;
    padding-right: 0px;
}



#scrolltotop {
    background-color: var(--link-hover);
    bottom: 20px;
    color: #ffffff;
    display: none;
    height: 40px;
    line-height: 35px;
    position: fixed;
    right: 20px;
    width: 40px;
    text-align: center;
    font-size: 16px;
    border-radius: 3px;
    cursor: pointer;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

#scrolltotop {
    display: none;
}

    #scrolltotop:hover,
    #scrolltotop:focus,
    #scrolltotop:active {
        color: #ffffff;
        border-radius: 100%;
    }


.form-select {
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.5;
    color: var(--link-hover);
}

.form-floating > .form-control, .form-floating > .form-select {
    height: calc(3.5rem + 20px);
    line-height: 1.35;
    color: var(--link-hover);
}

.navbar-toggler:focus {
    text-decoration: none;
    outline: 0;
    box-shadow: none;
}

.navbar-toggler-icon:active:focus {
    box-shadow: none;
    outline: 0;
}

.navbar-toggler-icon:active {
    box-shadow: none;
    outline: 0;
}

navbar-light {
    color: var(--link-text);
}

    navbar-light:hover {
        color: var(--link-hover);
    }

.nav-link {
    color: var(--link-text);
    font-weight: 600;
}

    .nav-link:focus {
        color: var(--link-hover);
    }

    .nav-link:hover {
        color: var(--link-hover);
    }

.nav-pills
.nav-link.active {
    color: #fff;
    background-color: var(--link-hover);
}
a {
    color: var(--link-text);
    text-decoration: none;
    font-weight: 600;
}
a:hover {
    color: var(--link-hover);
}

.form-group-lg, .form-group {
    margin: 1.1em;
}

/* case study image */ 
.force-height {
    height: 500px;
    max-height: 250px;
    background-position-y:bottom;
    background-size:100%;
}


.check-list,
.list-style {
    list-style-type: none; /* Remove bullets */
    padding: 0; /* Remove padding */
    margin: 0; /* Remove margins */
}

a{
    text-decoration:none;
}
/* Override the default bootstrap behavior where horizontal description lists 
   will truncate terms that are too long to fit in the left column 
*/
.dl-horizontal dt {
    white-space: normal;
}

/* Set widths on the form inputs since otherwise they're 100% wide */
input[type="text"],
input[type="password"],
input[type="email"],
input[type="tel"],
input[type="select"] {
    max-width: 100%;
    padding-left: 15px;
}

/* Responsive: Portrait tablets and up */
@media screen and (min-width: 320px) {
    .jumbotron {
        margin-top: 20px;
    }

    .body-content {
        padding: 0;
    }
    /* Move down content because we have a fixed navbar that is 50px tall */
    body {
        padding-top: 10px;
    }

    
}
    /* Responsive: Portrait tablets and up */
    @media screen and (min-width: 768px) {
        .jumbotron {
            margin-top: 20px;
        }

        .body-content {
            padding: 0;
        }
      /*   Move down content because we have a fixed navbar that is 50px tall */
        body {
           padding-top: 60px;
        }

        .container-fluid {
            top: -125px;
        }
    }

    /* Responsive: Portrait tablets and up */
    @media screen and (min-width: 991px) {
        .jumbotron {
            margin-top: 20px;
        }

        .body-content {
            padding: 0;
        }
       /*  Move down content because we have a fixed navbar that is 50px tall */
        body {
            padding-top: 20px;
        }

        .container-fluid {
            top: 0px;
        }

        .banner {
            top: -50px;
        }
    }

    /* Responsive: Portrait tablets and up */
    /*@media screen and (min-width: 1023px) {
        .jumbotron {
            margin-top: 20px;
        }

        .body-content {
            padding: 0;
        }*/
        /* Move down content because we have a fixed navbar that is 50px tall */
        /*body {
            padding-top: 200px;
        }

        .container-fluid {
            top: 0px;
        }

        .banner {
            top: -80px;
        }
    }

    @media screen and (min-width: 1123px) {*/
        /* Move down content because we have a fixed navbar that is 50px tall */
        /*body {
            padding-top: 170px;
        }

        .container-fluid {
            top: -0px;
        }

        .banner {
            top: -70px;
        }
    }

    @media screen and (min-width: 1480px) {*/
        /* Move down content because we have a fixed navbar that is 50px tall */
        /*body {
            padding-top: 150px;
        }

        .container-fluid {
            top: -20px;
        }

        .banner {
            top: -70px;
        }
    }*/