/* Move down content because we have a fixed navbar that is 50px tall */
body {
    padding-top: 50px;
    padding-bottom: 20px;
    background-color: #222;
    font-size: 20px;
}

div.ui-loader {
    display: none;
}

.navbar {
    opacity: 0.8;
    filter: alpha(opacity=80);
}

section {
    min-height: 560px;
}

.carousel {
    height: 100%;
    min-height: 560px;
}

.item .container .imagery {
    margin: auto;
    padding-top: 20px;
    opacity: 0.0;
    filter: alpha(opacity=0);
}

.background-one {
    color: whitesmoke;
}

.background-one p a, .background-one p a:hover, .background-one p a:focus, .background-one p a:visited {
    color: #79F2F2;
}

.background-two .carousel-indicators li {
    border: 1px solid #000;
}

.background-two .carousel-indicators .active {
    background-color: #000;
}

.background-two .carousel-control, .background-two .carousel-control:focus, .background-two .carousel-control:hover {
    color: #000;
}

.background-two .page-header {
    border-bottom: 1px solid #222;
}

.background-one {
    background-color: #2F2F2F;
}

.background-two {
    background-color: #EEF0F2;
}

#Landing {
    background-image: url("../img/background-grid.png");
}

#Landing .item a.btn {
  float: right;
  margin-top: 25px;
  color: #ddd;
  background-color: #0c0c0c;
  border-color: #c0c0c0;
  
}

#Landing .item a.btn:hover {
  color: #222;
  background-color: #c0c0c0;
  border-color: #0c0c0c;
}

#CaseStudies {
    background-image: url("../img/background-cube.png");
}

#CaseStudies .item .heading {
    font-size: 24px;
    font-weight: bold;
    margin-bottom: 10px;
}

#Process {
    background-image: url("../img/agile-diagram.png");
    background-repeat: no-repeat;
    background-size: cover;
}

#Process .diagram {
    margin: auto;
}

#landing-carousel .item .imagery {
    min-height: 560px;
}

#case-studies-carousel .item .imagery {
    min-height: 560px;
}

#landing-carousel .item.one .imagery {
    background: url("../img/cloudy.png") no-repeat center;
}

#landing-carousel .item.two .imagery {
    background: url("../img/geary.png") no-repeat center;
}

#landing-carousel .item.three .imagery {
    background: url("../img/phony.png") no-repeat center;
}

#landing-carousel .item.four .imagery {
    background: url("../img/brainy.png") no-repeat center;
}

#landing-carousel .item.five .imagery {
    background: url("../img/bulby.png") no-repeat center;
}

#case-studies-carousel .item.one .imagery {
    background: url("../img/ebook.png") no-repeat center;
}

#case-studies-carousel .item.two .imagery {
    background: url("../img/all-in-one.png") no-repeat center;
}

#case-studies-carousel .item.three .imagery {
    background: url("../img/custom-solution.png") no-repeat center;
}

#case-studies-carousel .item.four .imagery {
    background: url("../img/optimization.png") no-repeat center;
}

#case-studies-carousel .item.five .imagery {
    background: url("../img/training.png") no-repeat center;
}

#case-studies-carousel .item.six .imagery {
    background: url("../img/migration.png") no-repeat center;
}

#case-studies-carousel .item.seven .imagery {
    background: url("../img/big-data.png") no-repeat center;
}

#case-studies-carousel .item.eight .imagery {
    background: url("../img/medical.png") no-repeat center;
}

footer {
    background-color: #222;
    color: #f5f5f5;
}

footer a, footer a:hover, footer a:focus, footer a:visited {
    color: #79F2F2;
    text-decoration: none;
}

footer a:hover {
    text-decoration: underline;
}

footer nav {
    border-top: 2px solid #f5f5f5;
    border-bottom: 2px solid #f5f5f5;
    font-size: 28px;
}

footer nav ul {
    margin: 0;
    padding: 0;
    list-style: none;
    text-align: center;
}

footer nav li {
    display: inline;
    line-height: 20px;
}

footer nav li a, footer nav li a:visited, footer nav li a:hover, footer nav li a:focus {
    color: #f5f5f5;
    padding: 0 11px 0 6px;
    text-decoration: none;
}

footer nav li a:hover, footer nav li a:focus {
    color: #79F2F2;
}

footer nav li:after {
    content: '/';
}

footer nav li:last-child:after {
    content: '';
}

@media (min-width:768px){
	.container{
		width:750px
	}

}

@media (min-width:1120px){
	.container{
		width:970px
	}

}

@media (min-width:1350px){
	.container{
		width:1170px
	}
}

@media (max-width: 991px) {
    .item .imagery {
        min-height: 0px;
        background: none;
        display: none;
    }

    .item .text {
        min-height: 480px;
    }

    #landing-carousel .item.one .text {
        background: url("../img/cloudy-light.png") no-repeat center;
    }

    #landing-carousel .item.two .text {
        background: url("../img/geary-light.png") no-repeat center;
    }

    #landing-carousel .item.three .text {
        background: url("../img/phony-light.png") no-repeat center;
    }

    #landing-carousel .item.four .text {
        background: url("../img/brainy-light.png") no-repeat center;
    }

    #landing-carousel .item.five .text {
        background: url("../img/bulby-light.png") no-repeat center;
    }

    #case-studies-carousel .item.one .text {
        background: url("../img/new-markets-light.png") no-repeat center;
    }

    #case-studies-carousel .item.two .text {
        background: url("../img/all-in-one-solutions-light.png") no-repeat center;
    }

    #case-studies-carousel .item.three .text {
        background: url("../img/create-custom-solutions-light.png") no-repeat center;
    }

    #case-studies-carousel .item.four .text {
        background: url("../img/optimization-light.png") no-repeat center;
    }

    #case-studies-carousel .item.five .text {
        background: url("../img/training-light.png") no-repeat center;
    }

    #case-studies-carousel .item.six .text {
        background: url("../img/platform-migration-light.png") no-repeat center;
    }

    #case-studies-carousel .item.seven .text {
        background: url("../img/bulk-data-light.png") no-repeat center;
    }

    #case-studies-carousel .item.eight .text {
        background: url("../img/healthcare-light.png") no-repeat center;
    }
}

@media (max-width: 768px) {
    footer nav li {
        display: block;
        line-height: 48px;
    }

    footer nav li:after {
        content: '';
    }
}

@media (max-width: 490px) {
    #CaseStudies .page-header small {
        display: block;
    }
}

@media (max-width: 390px) {
    body {
        font-size: 16px;
    }

    h1 {
        font-size: 32px;
    }
}