﻿/*Sets an image as the background and stretches it to fill the screen.*/
body {
    background-image: url('BackgroundImage.jpg');
    background-size: cover;
}

h1 a {
    color: #fff;
}

h1 a:hover {
    color: #fff;
    text-decoration:none;
}

a {
    color: #d08e18;
}

a:hover {
    color: #d08e18;
    text-decoration:underline;
}

hr {
    border-color: #000;
    margin-top:0px;
}
/*Style main title text*/
.titleMain {
    color: #fff;
    /*text-align: right;*/
   
}

.logo {
    padding-top:6px;
    
    
}

.navbar-toggler {
    border-color: rgba(0, 0, 0, 1);
}

/*Hamburger menu button - Draw the 3 hamburger menu lines in white*/
.navbar-toggler-icon {
    background-color: rgba(255, 255, 255, 0);
    border-color: rgba(0, 0, 0, 1);
      background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3e%3cpath stroke='rgba(255, 255, 255, 1)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");  
      
}   

h2, h3 {
    color: #598331;
}


/*Set the background color and opactity of the main container*/
.jumbotron {
    background-color: rgba(255, 255, 255, 0.85);
    /*Remove the gap between jumbotron div and footer*/
    margin-bottom: 0px;
    margin-top: 110px;
    
    padding-top:10px;
    
}

/*Remove rounded corners on containers*/
.container .jumbotron, .container-fluid .jumbotron {
    border-radius: 0px;
}

/*Set the background color and opactity of the top bar*/
.navbar-inverse {
    background-color: rgba(89, 131, 49, 0.85);
    border-color: rgba(89, 131, 49, 0.85);
        
}

/*Set the margin on the left side and on the top of the logo in the top bar*/
.container > .navbar-header, .container-fluid > .navbar-header, .container > .navbar-collapse, .container-fluid > .navbar-collapse {
    margin-left: 100px;
    margin-top: 5px;
   
}

/*Set the menu bar text to white*/
.navbar-inverse .navbar-nav > li > a {
    color: #fff;
}

/*Adjust the text size in the jumbotron container for paragraphs*/
.jumbotron p {
    font-size: 15px;
    /*font-weight: 200;*/
    /*Add some space between the paragraph and the content below*/
    margin-bottom: 10px;
    
}

.jumbotron h1 {
    color:#598331;
    font-size:30px;
}
/*Style the vertical menu*/
.verticalMenu {
    font-size: 24px;
    padding-top:20px;
    
}

.verticalMenu a {
    color: #390;
}

.verticalMenu a:hover {
    color: #205c02;
    text-decoration:none;
}

.verticalMenu a:active {
   color: #000;
}

/*Adjust and the footer*/
footer {
    background-color: rgba(236, 237, 175, 0.9);
    font-size: 13px;
    text-align: center;
    min-height: 70px;
    padding-top: 7px;
}

/*Sets the margins of the images in the portfolio*/
.imgPortfolioMargin {
    margin:5px 0px 5px 0px;
}

/*this min-width setting apply to devices bigger than 992px */
@media (min-width: 992px) {
    .titleMain {
        /*This ensures that the title text does not wrap*/
        float:left;
    }
    .logo {
        /*This ensures that the title text is not placed below the logo*/
        float:left;
        padding-right:30px;
    }
    .horizontalMenu {
        display:none;
    }

    h1 {
        margin-top:5px;
        
    }

    .navbar-inverse {
    
    height:110px;
    width:940px;
    margin-left:auto;
    margin-right:auto;
    padding-top:20px;
    
}
}

@media (min-width: 768px) and (max-width: 991px) {
   .titleMain {
        /*This ensures that the title text does not wrap*/
        float:right;
    }
   .logo {
        /*This ensures that the title text is not placed below the logo*/
        float:left;
        padding-right:30px;
    }
    .horizontalMenu {
        display:none;
    }
   .verticalMenu {
       font-size:20px;
   }

   .jumbotron h1 {
        font-size:24px;
    }
    
    h1 {
        margin-top:10px;
        font-size:27px;
        
    }

    h2 {
        font-size: 22px;
    }

    h3 {
        font-size: 19px;
    }
    .navbar-inverse {
        height:110px;
        width:720px;
        margin-left:auto;
        margin-right:auto;
        padding-top:20px;
    }
   }

/*@media (min-width: 992px) {
    .navbar-inverse {
        width: 940px;
    }

    
}*/
/*this max width setting applies to devices up to 768px*/
@media (max-width: 767px) {
    .verticalMenu {
        display:none;
    }

    .logo {
        /*This ensures that the title text is not placed below the logo*/
        float:right;
        padding-right:0px;
    }
    
    .jumbotron h1 {
        font-size:23px;
    }
    
    h1 {
        margin-top:10px;
        font-size:23px;
        
    }

    h2 {
        font-size: 22px;
    }

    h3 {
        font-size: 20px;
    }

    .jumbotron {
        margin-top: 140px;
/*        margin-left:-10px;*/
/*        margin-right:-10px;*/
/*        padding-left:5px;*/
/*        padding-right:5px; */
    }
    
    footer {
/*        margin-left:-10px;*/
/*        margin-right:-10px;*/
/*        padding-left:5px;*/
/*        padding-right:5px; */
    }
}



@media (min-width: 1200px) {
    .navbar-inverse {
        width: 1110px;
    }
}