body {
    	min-width: 320px;
		font-family: Montserrat;
    }

	.nav-container {
	    width: 98%;
	    margin: 0 1% 0 1%;
	}

	.navbar-brand {
	    width:10%;
	}

	.navbar-list {
	    width:95%;
	    height:70px;
	}

    .g2aging-logo {
	    background-image: url("../images/facepage-logo.png");
	    height:80px;
	    width:80px;
	    background-size: contain;
	    background-repeat: no-repeat;	
	}

	.nav-item {
	    margin-top:2em;
	    /*margin-right:1%;*/
	    float:left;
	    display:inline-block !important;
	}

	.nav-g2g {
	    width:100%;
	}

	.left-nav {
	    width:85%;
	    float:left;
	}

	.right-nav {
	    width:5%;
	    float:right;
	}

	.user-dropdown-menu {
        margin-left:-5rem;
	    min-width:100px;
    }

	.g2g-container {
	    width:90%;
	    margin-left:5%;
	    margin-right:5%;
	}

	.g2g-collpase-toggle {
	    display:none;
	}

	.side-box {
	    margin-bottom:1.4rem;
	    background-color:rgba(94,115,172,1);
	    width:100%;
	    /*min-height:30%;*/
	    /*height:31%;*/
	    border-radius:1em;
	    color:#fff;
	    font-weight:bold;
	    line-height:2em;
	}

	.bottom-box hr,
    .side-box hr {
	    margin:1% 0 2% 0;
	    color:#fff;
	}

	.bottom-box p.title,
	.side-box p.title{
	    padding:2% 0 0 4%;
	}

	.side-box p.content {
	    font-size:1.5rem;
	    color:#fff;
	    font-weight:normal;
	    line-height:2.5rem;
	    padding:2% 4% 2% 4%;
	}

	.bottom-box {
	    margin-bottom:5rem;
	}

	#chartcontainer,
	#chartcontaineryears {
        box-shadow: 0 2px 4px 0 rgba(94, 115, 172, 0.1), 0 3px 10px 0 rgba(94, 115, 172, 0.3);
	    height:35rem;
        border-radius:1em;
        color:#fff;
        font-weight:bold;
        line-height:2em;
	    /*background-color:rgba(94,115,172,0.8);*/
	    margin-bottom:8px;
	}

	.bottom-box .content-title p {
	    color: #000;
	    margin:2rem 0 0 1rem;
	    font-family: Montserrat;
	    font-size:2rem;
	}

    .bottom-box .content-title .subtitle{
	    font-size:1.5rem;
	    margin:0 0 0 1rem;
	}

    .bottom-box:hover .content-title p {
	    text-decoration: underline;
	}

    .whatsnew ul.content {
	    margin-left:-3%;
	    margin-right:1%;
	    padding-bottom:3%;
	    font-weight: normal;
	}

    .whatsnew ul.content a {
	    color:#fff;
	}

    .website-title {
	    background-color:rgba(94,115,172,0.8);
	    border-radius:0 1em 1em 0;
	    position:absolute;
	    width:auto;
	    margin-top:-10rem;
	    height:70px;
	    color:#fff;
	    font-size: 2.8rem;
	    padding:1.5rem 2.5rem 1rem 1.5em;
	}

    .navbar {
        -webkit-transition:all 0.4s ease-in-out;
	    transition:all 0.4s ease-in-out;
	}

    .navbar.shrink {
	    min-height:70px;
	    height:70px;
	}

    .nav li a {
	    font-size:1.5rem;
	    padding: .5em 1em;
	}

    .nav li a:hover {
	    background-color:rgba(238,238,238,0.2);
	}

    #searchbar {
        background-color: rgba(238,238,238,0.2);
	    height: 4em;
	    width: 100%;
	    display:none;
	    padding:1rem 0 0 20%;
	    margin-bottom:2rem;
	}

    #searchbar-mini {
        background-color: rgba(238,238,238,0.2);
        height: 4em;
	    padding-left:4em;
    }

    .g2gsearch {
	    width:60%;
	    margin-top:1rem;
	    height:3em;
	    z-index:10;
	    border: 1em #D8D8D8;
	    background-color:#fff;
	    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1), 0 3px 10px 0 rgba(0, 0, 0, 0.1);
	    padding:0 1% 0 0;
	}

    #searchbar input,
	#searchbar-mini input {
	    height:100%;
	    width:90%;
	    float:left;
	    border:0;
	    outline-style:none;
        box-shadow:none;
	    border-color:transparent;
	}

    .searchbutton {
        float:right;
	    min-width:24px;
	    width:10%;
	    height:100%;
	    background:#fff;
	    border:0;
	    outline-style:none;
	    box-shadow:none;
	    border-color:transparent;
	}

	#navbar-list-toggle {
        width:100%;
	    height:auto;
        margin-top:80px;
	    display:none;
	}

	#navbar-list-toggle ul {
        list-style-type: none;
	}

	#navbar-list-toggle hr {
        margin-top:10rem;
	    border-top: 1px solid #eee;
    }

	#navbar-toggle-user {
        display:none;
	}

	.facepage-middle-image {
        width:100%;
        margin-bottom:2em;
	}

	.facepage-middle-image img {
        width: 100%;
        height: auto;
	}

	#bottomdiv {
        width:100%;
        height:auto;
  	    background-color:#eee;
  	    padding-left:5%;
	}

	#bottomdiv #sitecontent {
  	    width:100%;
	}

	#bottomdiv .sub-sitecontent ul {
  	    list-style: none;
	}

	#bottomdiv .sub-sitecontent ul li {
  	    margin-left: -3rem;
	}

	#bottomdiv .sub-sitecontent a,
	#bottomdiv .sub-sitecontent ul li a{
  	    color: #555555;
  	    font-size:1.4rem;
	}

	.g2g-container .row:before,
	.g2g-container .row:after, 
	#bottomdiv .row:before,
	#bottomdiv .row:after {
   	    content:none;
	}

@media all and (max-width:1280px) {
    @-ms-viewport { width: 1200px; }
    .g2g-container {
       width:98%;
        margin-left:1%;
    }
    .website-title {
	padding-left:1rem;
	padding-right:1rem;
    }
    .nav-container .nav-g2g .nav-item {
       font-size:1.5rem;
       padding: 0.5rem;
    }
    .nav-item .nav-link {
	padding:0.5rem;
    }
    .nav-item {
	margin-right:0;
    }
    .user-dropdown-menu {
	margin-left:-7rem;
    }
    .g2gsearch {
	width:80%;
    }
    .bottomdiv {
	padding-left:1%;
    }
    .side-box p.content {
	line-height:2rem;
    }
}

@media(max-width:1150px) {
     /*@-ms-viewport { width: 1000px; }*/
    .nav-container .nav-g2g .nav-item {
       font-size:1.4rem;
       padding:0.2rem;
    }
    .nav-item .nav-link {
       padding:0.3rem; 
    }
    .nav-item {
        margin-right:1%;
    }
    .whatsnew ul.content {
        line-height:1.8rem;
    }
    .whatsnew ul.content a {
        font-size:1.4rem;
    }
    .navbar-list {
        width:100%;
    }
    .side-box {
        margin-bottom:1.5rem;
    }
    .website-title {
    	font-size: 2.5rem;
    }
}
@media (max-width: 1050px){
    .side-box {
	height:auto;
    }
    .nav-container .nav-g2g .nav-item {
       font-size:1.4rem;
       padding:0.1rem;
    }
    .nav-item .nav-link {
        padding:0.1rem;
    }
    #navbar-list-toggle {
	display:none;
    }
    .navbar-toggleable-md .navbar-toggler {
        display:none;
    }
    .side-box p.content {
        line-height:2.5rem;
    }
    .whatsnew ul.content {
        line-height:2.5rem;
	margin-left:0;
    }
    .whatsnew ul.content a {
        font-size:14px;
    }
}
@media (max-width:990px) {
    .navbar-list {
	display:none;
    }
    .navbar-brand {
    	float:left;
	margin-left:40%;
    }
    #g2g-collpase-toggle {
	display:inline-block;
    }
    .g2gsearch{
	margin-top:2rem;
	width:60%;
    }
    .nav-container {
        width:100%;
    }
    #searchbar-mini {
	width:100%;
    }
    #navbar-toggle-user {
        display:inline-block;
	float:left;
    }
}
@media (max-width:700px){
    .website-title {
        width:auto;
        min-width:280px;
        height:40px;
        color:#fff;
        font-size: 1.5rem;
	margin-top:-5rem;
        padding:1rem 1rem 1rem 1rem;
    }
    .navbar-brand {
        float:left;
        margin-left:30%;
    }
}
@media (max-width:400px) {
   .website-title {
        width:auto;
        min-width:280px;
        height:40px;
        color:#fff;
        font-size: 1.2rem;
        margin-top:-5rem;
        padding:1rem 1rem 1rem 1rem;
    }
}