/* http://www.jqueryscript.net/menu/jQuery-CSS3-Off-canvas-Push-Menu-For-Bootstrap-3.html */

#push-menu-wrapper {font-family: "Ubuntu", "Roboto Condensed", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif;}

/* Sticky footer */
#site-wrapper {min-height: calc( 100vh - 3rem );}
#site-footer  {height: 3rem;}

#content-footer {display: none;}

#site-header 						{max-height: 250px;}
#site-header #site-title 			{}
#site-header #site-logo				{vertical-align: middle; padding-top: 26px;}
#site-header #site-logo img			{height:50px;}
#site-header .site-avatar         	{vertical-align: middle; padding-right: 10px;}
#site-header .site-avatar img		{height:50px; border-radius: 50%;}

#site-header.scrolled #site-logo img		{height:40px;}
#site-header.scrolled .site-avatar img		{height:40px;}

#content-wrapper {
	padding-top: 5rem;
}
	
#content-wrapper, #site-header, #site-header #site-navbar, #site-header #site-navbar h1 {
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    transition: all 0.5s ease; }

#site-header {
    position: fixed;
    z-index: 10;
    width: 100%;
    height: 5rem;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

#site-header.scrolled {
    height: 3rem;
}
#site-header #site-navbar {
    height: 100%; 
	width: 100%;
    float: left; 
}

#site-header #site-navbar {
	padding-left: 5rem;
    border-radius: 0;
}
@media only all and (max-width: 59.938em) {
    #site-header #site-navbar {
        padding-left: 4rem !important;
    } 
}
@media only all and (max-width: 47.938em) {
    #site-header #site-navbar {
        padding-left: 1rem !important;
    } 
	#site-header .site-avatar {display:none;}
}

#site-header #site-navbar h1 {
    font-size: 2rem;
    line-height: 2rem;
    margin: 0;
}
#site-header #site-navbar h1 a .logo0 {
    letter-spacing: 0.3rem;
    text-transform: uppercase;
    padding: 0px 7px 1px 11px;
    margin-right: 4px;
    border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%;
}
#site-header #site-navbar h1 a .logo {
    letter-spacing: 0.3rem;
    text-transform: uppercase;
}
#site-header a {text-decoration: none;}

#site-header #site-navbar h1, #site-header .site-avatar {
    position: relative;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%); 
}

#site-footer {
    position: absolute;
    right: 0;
    left: 0;
    text-align: center;
}
#site-footer .totop {
    position: absolute;
    bottom: 2rem;
    text-align: center;
    left: 0;
    right: 0; 
}
#site-footer .totop span {
    font-size: 1.7rem;
    line-height: 2.5rem;
    width: 3rem;
    height: 2rem;
    display: inline-block;
    border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px;
}
#site-footer p {
    font-size: 1.1rem;
    bottom: -3rem;
    margin: 0; }
#site-footer a {text-decoration: none;}
#site-footer .onleft {
    position: absolute;
    bottom: 2rem;
    text-align: left;
    left: 0;
    float: left;
}
#site-footer .onright {
    position: absolute;
    bottom: 2rem;
    text-align: right;
    right: 0;
    float: right;
}
#site-footer .copyright {
     letter-spacing: 2px;
     text-transform: uppercase;
     line-height: 2rem;
     font-size: .8rem;
     text-align: center;
     position: absolute;
     bottom: 0.2rem;
     text-align: center;
     left: 0;
     right: 0;	 
}
#site-footer .socialicons {
    letter-spacing: 2px;
    margin: 10px 0 5px;
    font-size: 1.5rem;
}


/*-------------------------------*/
/*           Wrappers            */
/*-------------------------------*/

#site-wrapper {
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
    padding-left: 0;
	padding-bottom: 20px;
    -webkit-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

/* resize the header and content on open */
#site-wrapper.toggled {  padding-left: 250px; }
@media only all and (max-width: 47.938em) {
	/* push the header and content on open */
	#site-wrapper.toggled {  margin-right: -250px; }
}

#site-wrapper.toggled #push-menu-wrapper { width: 250px; }

#push-menu-wrapper {
    transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
    height: 100%;
    left: 250px;
    margin-left: -250px;
    overflow-x: hidden;
    overflow-y: auto;
    width: 0;
    z-index: 1000;
}

#push-menu-wrapper {font-size: 1.1rem;}

#push-menu-wrapper::-webkit-scrollbar {
    display: none;
}

/*-------------------------------*/
/*     push-menu-nav             */
/*-------------------------------*/

.push-menu-nav {
    list-style: none;
    margin: 0;
    padding: 12px 0;
    position: absolute;
    top: 0;
    width: 250px;
}

.push-menu-nav li {
    display: inline-block;
    line-height: 20px;
    position: relative;
    width: 100%;
}

.push-menu-nav li:before {
    transition: width 0.2s ease-in;
    -moz-transition: width 0.2s ease-in;
    -ms-transition: width 0.2s ease-in;
    -webkit-transition: width 0.2s ease-in;
    content: '';
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 3px;
    z-index: -1;
}

.push-menu-nav li:hover:before {
    -webkit-transition: width 0.2s ease-in;
    transition: width 0.2s ease-in;
    width: 100%;
}

.push-menu-nav li a {
    display: block;
    padding: 10px 15px 10px 30px;
    text-decoration: none;
}

.push-menu-nav li span a {
    padding-bottom: 5px;
}

.push-menu-nav li.open:hover before {
    -webkit-transition: width 0.2s ease-in;
    transition: width 0.2s ease-in;
    width: 100%;
}

.push-menu-nav .dropdown-menu {
    border-radius: 0;
    border: none;
    box-shadow: none;
    margin: 0;
    padding: 0;
    position: relative;
    width: 100%;
	font-size: 1.0rem; 
	line-height: 1.6rem;
}

.push-menu-nav .dropdown-menu li a {
	padding-top: 2px;
    padding-bottom: 2px;
    padding-left: 45px;
}

.push-menu-nav li > a > .fa-angle-left,
.push-menu-nav li > a > .pull-right-container > .fa-angle-left {
  width: auto;
  height: auto;
  padding: 0;
  -webkit-transition: transform 0.5s ease;
  -o-transition: transform 0.5s ease;
  transition: transform 0.5s ease;
}

.push-menu-nav .open > a > .fa-angle-left,
.push-menu-nav .open > a > .pull-right-container > .fa-angle-left {
  -webkit-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
  -o-transform: rotate(-90deg);
  transform: rotate(-90deg);
}

.push-menu-nav li a:hover, .push-menu-nav li a:active, .push-menu-nav li a:focus, .push-menu-nav li.open a:hover, .push-menu-nav li.open a:active, .push-menu-nav li.open a:focus {
    text-decoration: none;
}

.push-menu-nav > .push-menu-brand {
    font-size: 20px;
    height: 65px;
    line-height: 44px;
	text-transform: uppercase;
}

.push-menu-nav .fa, .push-menu-nav .fas {
    font-size: 1.1em;
    width: 2em;
}

.push-menu-nav .pull-right-container {
	text-align:right;
}

/*-------------------------------*/
/*   Push Menu Stack             */
/*-------------------------------*/

.pm-stack {
     display: block;
     height: 32px;
     margin-left: 15px;
     top: 25px;
     position: fixed;
     width: 32px;
     z-index: 999;
     /* right: 20px; */ /* justifies menu to right of header */
 }
@media only all and (max-width: 767px) {
    .pm-stack {
        right: 20px; } }

.pm-stack:hover { outline: none; }

.pm-stack:focus { outline: none; }

.pm-stack:active { outline: none; }

.pm-stack.is-closed:before {
    -webkit-transform: translate3d(0, 0, 0);
    -webkit-transition: all 0.35s ease-in-out;
    content: '';
    display: block;
    font-size: 14px;
    line-height: 32px;
    opacity: 0;
    text-align: center;
    width: 100px;
}

.pm-stack.is-closed:hover before {
    -webkit-transform: translate3d(-100px, 0, 0);
    -webkit-transition: all 0.35s ease-in-out;
    display: block;
    opacity: 1;
}

.pm-stack.is-closed:hover .pm-stack-top {
    -webkit-transition: all 0.35s ease-in-out;
    top: 0;
}

.pm-stack.is-closed:hover .pm-stack-bottom {
    -webkit-transition: all 0.35s ease-in-out;
    bottom: 0;
}

.pm-stack.is-closed .pm-stack-top {
    -webkit-transition: all 0.35s ease-in-out;
    top: 5px;
}

.pm-stack.is-closed .pm-stack-middle {
    margin-top: -2px;
    top: 50%;
}

.pm-stack.is-closed .pm-stack-bottom {
    -webkit-transition: all 0.35s ease-in-out;
    bottom: 5px;
}

.pm-stack.is-closed .pm-stack-top, .pm-stack.is-closed .pm-stack-middle, .pm-stack.is-closed .pm-stack-bottom, .pm-stack.is-open .pm-stack-top, .pm-stack.is-open .pm-stack-middle, .pm-stack.is-open .pm-stack-bottom {
    height: 4px;
    left: 0;
    position: absolute;
    width: 100%;
}

.pm-stack.is-open .pm-stack-top {
    -webkit-transform: rotate(45deg);
    -webkit-transition: -webkit-transform 0.2s cubic-bezier(0.73, 1, 0.28, 0.08);
    margin-top: -2px;
    top: 50%;
}

.pm-stack.is-open .pm-stack-middle {
    display: none;
}

.pm-stack.is-open .pm-stack-bottom {
    -webkit-transform: rotate(-45deg);
    -webkit-transition: -webkit-transform 0.2s cubic-bezier(0.73, 1, 0.28, 0.08);
    margin-top: -2px;
    top: 50%;
}

.pm-stack.is-open:before {
    -webkit-transform: translate3d(0, 0, 0);
    -webkit-transition: all 0.35s ease-in-out;
    content: '';
    display: block;
    font-size: 14px;
    line-height: 32px;
    opacity: 0;
    text-align: center;
    width: 100px;
}

.pm-stack.is-open:hover before {
    -webkit-transform: translate3d(-100px, 0, 0);
    -webkit-transition: all 0.35s ease-in-out;
    display: block;
    opacity: 1;
}

#pancake {
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    transition: all 0.5s ease;}
#pancake.scrolled {
    top: 8px;}

/*-------------------------------*/
/*          Dark Overlay         */
/*-------------------------------*/

.pm-overlay {
    position: fixed;
    display: none;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 100;
}

/****************************/
/* Colors                   */
/****************************/
#site-header {background: rgba(255, 255, 255, 0.9); box-shadow: 0 0.05rem 1rem rgba(0, 0, 0, 0.15);}
#site-header.scrolled {background: rgba(255, 255, 255, 0.8) !important; }
#site-header.scrolled #site-navbar h1,
#site-header.scrolled #site-navbar a {color: #000 !important;}

#site-header #site-navbar h1 a .logo0 {background: #589277; color: #fff;}
#site-header #site-navbar h1 a .logo {color: #589277;}

#site-footer {background: #589277; color: #fff;}
#site-footer a {color: #fff;}
#site-footer a:hover, #site-footer a:focus { color: #eee;}
#site-footer .totop span {background: #589277;}
#site-footer p {text-indent: 0em;}
#site-footer p .fa {color: #fff; display: inline;}
#site-footer .copyright {color: #666; color:white;}
#site-footer .socialicons a {color: #666;}
#site-footer .socialicons a:hover {color: #589277}

#push-menu-wrapper {background: #33547e;}

.pm-overlay { background: rgba(0, 0, 0, 0.4);}

.pm-stack {background: transparent; border: none;}
.pm-stack.is-closed:before {color: #589277;}
.pm-stack.is-closed .pm-stack-top,
.pm-stack.is-closed .pm-stack-middle,
.pm-stack.is-closed .pm-stack-bottom {background: #589277;}
.pm-stack.is-open:before {color: #fff;}
.pm-stack.is-open .pm-stack-top,
.pm-stack.is-open .pm-stack-middle,
.pm-stack.is-open .pm-stack-bottom {background: #fff;}

.push-menu-nav .dropdown-menu {background: #1a4871;}

.push-menu-nav li:before {background: #1c1c1c;}
.push-menu-nav li a {color: #dddddd;}
.push-menu-nav li a:hover,
.push-menu-nav li a:active,
.push-menu-nav li a:focus,
.push-menu-nav li.open a:hover,
.push-menu-nav li.open a:active,
.push-menu-nav li.open a:focus {background: transparent; color: #fff;}
.push-menu-nav li.open>a, .push-menu-nav li.open>a:hover, .push-menu-nav li.open>a:focus {background-color: inherit;}
.push-menu-nav li:nth-child(1):before  { background: #286895; }
.push-menu-nav li:nth-child(2):before  { background: #286B99; }
.push-menu-nav li:nth-child(3):before  { background: #2A6F9E; }
.push-menu-nav li:nth-child(4):before  { background: #2A72A4; }
.push-menu-nav li:nth-child(5):before  { background: #2A75A8; }
.push-menu-nav li:nth-child(6):before  { background: #2C78AC; }
.push-menu-nav li:nth-child(7):before  { background: #2D7BB1; }
.push-menu-nav li:nth-child(8):before  { background: #2E80B7; }
.push-menu-nav li:nth-child(9):before  { background: #2F83BD; }
.push-menu-nav li:nth-child(10):before { background: #3087C2; }
.push-menu-nav li:nth-child(11):before { background: #318BC9; }
.push-menu-nav li:nth-child(12):before { background: #3390D0; }
.push-menu-nav li:nth-child(13):before { background: #3494D7; }
.push-menu-nav li:nth-child(14):before { background: #318BC9; }
.push-menu-nav li:nth-child(15):before { background: #3390D0; }
.push-menu-nav li:nth-child(16):before { background: #3494D7; }
.push-menu-nav li:nth-child(17):before { background: #3494D7; }
.push-menu-nav li:nth-child(18):before { background: #3494D7; }
.push-menu-nav li:nth-child(19):before { background: #3494D7; }
.push-menu-nav li:nth-child(20):before { background: #3494D7; }
.push-menu-nav li:nth-child(21):before { background: #3494D7; }
.push-menu-nav li:nth-child(22):before { background: #3494D7; }
.push-menu-nav li:nth-child(23):before { background: #3494D7; }
.push-menu-nav li:nth-child(24):before { background: #3494D7; }
.push-menu-nav li:nth-child(25):before { background: #3494D7; }
.push-menu-nav li:nth-child(26):before { background: #3494D7; }
.push-menu-nav li:nth-child(27):before { background: #3494D7; }
.push-menu-nav li:nth-child(28):before { background: #3494D7; }
