footer
        {
            clear: both;
            margin-bottom: 0px;
            position: relative;
            background-color: #EC9454;
            background-color: #f8f8f8;
            color: maroon;
            border-top: 1px solid #000;
            width: 100%;
        }
        .navbar-default
        {
            background-color: #f8f8f8;
            border-color: #e7e7e7;
        }
        .navbar-default .navbar-nav > li > a
        {
            color: #777;
            color: #6f6f6f;
            display: block;
            font-weight: bold;
        }
        
        .slide-center-out
        {
            text-decoration: none;
            display: block;
            color: red;
        }
        .navbar-default .navbar-brand
        {
            color: #0000b3;
            font-weight: bolder;
        }
        /* add a empty string after the elment with class .slide-center-out  */
        .slide-center-out:after
        {
            content: '';
            display: block;
            height: 2px;
            width: 0;
            background: transparent;
            transition: width .5s ease, background-color .5s ease;
            -webkit-transition: width .5s ease, background-color .5s ease;
            -moz-transition: width .5s ease, background-color .5s ease;
            margin: auto; /* center the cotent so it will sliding from the midddle to the left and right */
        }
        
        /* Change the width and background on hover, aka sliding from the middle to the left and right */
        .slide-center-out:hover:after
        {
            width: 100%;
            background: red;
        }
        .span1
        {
            width: 18em;
            height: 18em;
            margin: 0 auto;
            margin-bottom: -120px;
            position: relative;
            background-color: transparent;
            padding-top: 15px;
            line-height: 15px;
            min-height: 120px;
        }
        
         .span2
        {
            
           
           
            padding-top: 35px;
            position: relative;
            background-color: transparent;            
            line-height: 15px;
            min-height: 120px;
        }
        .jumbotron .h2, .jumbotron h2
        {
            text-shadow: 6px 6px 0px rgba(0,0,0,0.2);
            color: #fff !important;
            font-weight: bolder;
            padding-top: 15px;
            font-size: 3em;
        }
        p.lead
        {
            color: #f3f3f3;
        }
        
        .slider-size
        {
            height: 862px; /* This is your slider height */
            width: 1000px;
        }
        
         .slider-size  img
         {
             height:600px;
         }
        
        .carousel
        {
            width: 100%;
            margin: 0 auto; /* center your carousel if other than 100% */
        }
        .nav > li
        {
            position: relative;
            display: block;
            font-size: 12px;
        }