﻿@media all{

    .slide {
        background: inherit
    }

    .nb-carousel-option0{
        background-image: url("images/IndexCarousel_Option0.jpg");
    }

    .nb-carousel-option1 {
        background-image: url("images/IndexCarousel_Option1.jpg");
    }

    .nb-carousel-option2 {
        background-image: url("images/IndexCarousel_Option2.jpg");
    }

    .nb-carousel-option3 {
        background-image: url("images/IndexCarousel_Option3.jpg");
    }

    .nb-carousel-option0, .nb-carousel-option1, .nb-carousel-option2, .nb-carousel-option3 {
        background-size : cover;
        background-repeat : no-repeat;
    }

    .paragraph-one {
        font-size: 18px;
    }

    .lightbox {
	    display: none;
        position: absolute;
	    z-index: 9999;
	    width: 90%;
	    margin-left: 5%;
	    height: 100%;
	    top: 0;
	    left: 0;
	    color:#333333;
    }

    .lightbox:target {
        display: block;
        outline: none;
    }

    .lightbox .box {
  	    width: -webkit-min-content;
  	    width: -moz-min-content;
  	    width: min-content;
 	    margin: 2% auto;
	    padding:10px 20px 15px 20px;
	    background-color:#FFF;
	    box-shadow: 0 1px 26px -3px #777777;
        margin-top: 10%;
    }

    .lightbox img {
        margin: auto;
    }

    .lightbox .title {
	    margin:0;
	    padding:0 0 10px 0;
	    font-size:22px;
    }

    .lightbox-textcenter {
        display: block;
        /*text-align: center;
        text-align: -moz-center;
        text-align: -webkit-center;
        text-align: -ms-center;
        text-align: -o-center;*/
    }

    .close-button {
	    float:right;
	    padding-bottom: 5px;
	    display: block;
	    text-decoration:none;
	    font-family:Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
	    font-size:22px;
	    color:#858585;
	    z-index: 100000;
    }

    .gap {
        line-height: 20px; 
        height: 20px;
    }

    .hr-thin {
        border-style: dotted;
        border-width: 1px;
        border-color: #d8d8d8;
        border-left: none;
        border-right: none;
        border-bottom: none;
    }

    .nb-diagram {
        background: url('images/Navibilling-Diagram.png');
        background-repeat: no-repeat;
        background-size : 100% 100%;
        height: 390px;
        width: 390px;
        
        /*/margin-bottom: 30px;
        background: url('images/Navibilling-Diagram.png');
        background-repeat: no-repeat;
        background-size : 100% 100%;
        height: 390px;*/
    }

    .nb-diagram-lg {
        background: url('images/Navibilling-Diagram-LG.png');
        background-repeat: no-repeat;
        background-size : 100% 100%;
        height: 900px;
        width: 900px;
    }

    .carousel-inner > div > .carousel-caption {
        text-shadow: 0 1px 6px rgb(0, 0, 0);
        text-shadow: 0 1px 6px rgba(0, 0, 0, 0.9);
        font-weight:600;
        font-size: 1.2em;
    }
}

/* Custom, iPhone Retina */
@media (min-width: 320px) {

    .nb-carousel-option0 {
        height: 310px;
    }

    .nb-carousel-option1 {
        height: 310px;
    }

    .nb-carousel-option2 {
        height: 310px;
    }

    .nb-carousel-option3 {
        height: 310px;
    }

    .nb-carousel-index {
        margin-top : -19px;
    }

    .nb-diagram {
        max-width: 300px;
        max-height: 300px;
    }
}

/* Extra Small Devices, Phones */
@media (min-width: 480px) {
    
}

/* Small Devices, Tablets */
@media (min-width: 768px) {
    
    .nb-carousel-option0 {
        height: 410px;
    }

    .nb-carousel-option1 {
        height: 410px;
    }

    .nb-carousel-option2 {
        height: 410px;
    }

    .nb-carousel-option3 {
        height: 410px;
    }

    .nb-carousel-index {
        margin-top : -19px;
    }

    .nb-diagram {
        max-width: 387px;
        max-height: 387px;
    }
}

/* Medium Devices, Desktops */
@media (min-width: 992px) {
    .nb-diagram {
        max-width: 390px;
        max-height: 390px;
    }

    .difference {
        background: url('images/H-Logo.png') bottom right no-repeat;
        padding: 20px;
        margin-bottom: 30px;
    }
}

/* Large Devices, Wide Screens */
@media (min-width: 1200px) {

}