/* General Styles
--------------------------------------------------------------------------------------*/
@import url('https://fonts.googleapis.com/css?family=Titillium+Web&display=swap');

/* form updates */
.form-control {height: auto}
.input-group {position: relative;display: flex;flex-wrap: wrap;align-items: stretch;width: 100%}
.input-group .form-control {display: flex;align-items:center}
.input-group-addon, .input-group-btn {width: auto}
.label-add-on .input-group-addon {font-size: inherit}
.input-group .input-group-btn.input-group-append {display:flex}
.input-group-addon {display: flex;align-items: center;line-height: 1.5;text-align: center;white-space: nowrap;border-radius: 4px}
.input-group>.form-control, .input-group>.form-select {position: relative;flex: 1 1 auto;width: 1%;min-width: 0}
.input-group .input-group-btn div.btn {display: flex}
.input-group>.file-input.file-input-new {display: flex;flex: 1 1 auto}
.input-group > .file-input:not(.file-input-new) {display: flex;flex-wrap: wrap;flex: 1}
.input-group > .file-input .kv-upload-progress {width: 100%}
.input-group-addon~.file-input.file-input-new .form-control {border-top-left-radius: 0;border-bottom-left-radius: 0}
.swoogo-reg-summary .responsive-table .buttons .btn-group.btn-group-sm {min-width: 100px}
.btn-group.btn-group-sm>.btn {font-size: 12px !important}
/* end form updates */

body {
    font-family: 'Titillium Web', sans-serif;
    font-size: 14px;
    color: #454545;
    background:#232323;
    min-height: 100%;
}

/* structure update for bg overlay */
#header-wrap.site-background > #nav-wrap {
    z-index: 3 !important;
}

/* Logos
--------------------------------------------------------------------------------------*/
.text-logo a {
    color:#FFF;
    text-decoration:none;
}

.desktop-logo .text-logo {
    font-size: 36px;
    max-width:400px;
}

.mobile-logo .text-logo {
    font-size: 30px;
}

.desktop-logo img {
    max-height:50px;
    max-width:200px;
}

/* Backgrounds
--------------------------------------------------------------------------------------*/
.landing-page::before,
.standard-page::before {
    /*background: transparent url('menu-bg.png') repeat scroll left top;*/
  	/*background: linear-gradient(180deg, rgba(0,0,0,.65), transparent 90%);
    content: "";
    height: 130px;
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1;*/
}

.landing-page .site-background,
.standard-page .site-background {
    /*background: url('main-bg.jpg') no-repeat fixed center top auto;*/
    background-image: url('main-bg.jpg');
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-position: center top;
    background-size: cover;
  	color: #fff;
}

@media (min-width: 768px) {
  	.site-background #site-nav::before {
        content: "";
        background: linear-gradient(180deg, rgba(0,0,0,.8) 0%, rgba(0,0,0,.8) 100%);
        display: block;
        position: absolute;
        z-index: 1;
        top: 0;
        left: 0;
        right: 0;
        height: 100%;
        transition: 300ms opacity ease;
      	opacity: 0;
    }
    .site-background #site-nav.navbar-solid::before {
        opacity: 1;
    }
}

nav#site-nav > * {
    position: relative;
    z-index: 2;
}

/*for logo content area*/
#site-nav > .container .swoogo-logo > .container {
    width: 400px;
    max-width: 100%;
}

.landing-page #header-wrap {
    height: 600px;
    overflow: hidden;
    max-height:400px;
}

.standard-page #header-wrap {
    height: 300px;
    overflow: hidden;
    max-height:250px;
}
.landing-page #header-wrap,
.standard-page #header-wrap {
    margin-top: 40px;
  	z-index: 2;
}

.short-header-page #header-wrap {
    background: #232323;
    padding-bottom: 0px;
}

@media (min-width: 768px) {
    .landing-page #header-wrap,
    .standard-page #header-wrap {
        margin-top: 0;
        padding-top: 40px;
    }
    .landing-page #header-wrap {
        max-height:450px;
    }
    .standard-page #header-wrap {
        max-height:none;
    }
    .short-header-page #header-wrap {
        /*padding-bottom:15px;*/
    }
}

@media (min-width: 992px) {
    .landing-page #header-wrap {
        max-height:none;
    }
}

/* Navigation
--------------------------------------------------------------------------------*/
.navbar {
    margin-bottom:0px;
    padding-top: 0px;
    background: #232323;
}

.container > .navbar-header {
    margin-left:0px;
    margin-right:0px;
}

.swoogo-nav {
    border-bottom: 0px;
    float: none;
}

.swoogo-nav > li > a {
    background:none !important;
    color: #fff;
    font-size: 13px;
    font-weight: bold;
    text-transform: uppercase;
    border: 2px solid transparent;
    margin: 2px;
}

.swoogo-nav > li > a:hover,
.swoogo-nav > li > a:active,
.swoogo-nav > li > .active a,
.swoogo-nav > li.active > a,
.swoogo-nav > li.open > a {
    border: 2px solid #fff !important;
    border-radius: 6px;
}

.swoogo-nav .dropdown-menu > .active > a,
.swoogo-nav .dropdown-menu > .active > a:hover,
.swoogo-nav .dropdown-menu > .active > a:focus {
    background-color: #666;
}

.swoogo-nav .dropdown-menu > li > a {
    color: #FFF;
}

.navbar-toggle {
    margin-right:0px;
    border: 1px solid transparent;
}

.navbar-toggle span.icon-bar {
    background: #fff;
}

@media (max-width: 768px) {
    .mobile-logo a img {
        padding: 5px 0;
    }
}

@media (max-width: 767px) {
    .dropdown-menu>li>a:focus, .dropdown-menu>li>a:hover {
        background-color: #454545;
    }
}

@media (min-width: 768px) {

    .swoogo-nav .dropdown-menu > .active > a,
    .swoogo-nav .dropdown-menu > .active > a:hover,
    .swoogo-nav .dropdown-menu > .active > a:focus {
        background-color: #ccc;
        color: #333;
    }

    .navbar {
        padding-top: 15px;
        transition: 300ms all ease;
      	padding-bottom: 15px;
    }
  	.site-background nav#site-nav {
        background: linear-gradient(180deg, rgba(0,0,0,.65) -25%, transparent 85%);
        border: none;
    }
  	.site-background nav#site-nav.navbar-solid {
      	background: transparent;
  	}

    .swoogo-nav {
        float: right;
    }

    .swoogo-nav > li > a {
        margin: 0px 10px 0px 0px;
    }

    .swoogo-nav .dropdown-menu > li > a {
        color: #333;
    }

    .navbar.navbar-solid {
        padding-bottom: 15px;
        /*background-color: rgba(0,0,0,.8);*/
    }

    #site-nav > .container {
        display: flex;
        flex-flow: row nowrap;
        align-items: center;
    }
    #site-nav > .container > .navbar-header {
        flex: 0 0 auto;
    }

    #site-nav > .container > #navbar {
        flex: 1 1 auto;
    }

    #site-nav > .container > #navbar > .swoogo-nav {
        display: flex;
        flex-flow: row wrap;
        justify-content: flex-end;
        align-items: center;
    }

}

/***
Registration progress
***/
.swoogo-reg-progress .steps > li.active > a.step .number {
    background-color: #666666;
    color: #fff;
}
.swoogo-reg-progress .steps > li.active > a.step .desc {
    color: #333;
}
.swoogo-reg-progress .steps > li.done > a.step .number {
    background-color: #232323;
    color: #fff;
}

/* Banner
--------------------------------------------------------------------------------*/
#banner h2 {
    color: #FFF;
    font-size: 28px;
    font-weight: 300;
    text-transform: uppercase;
    text-shadow: 2px 2px #333;
}

#banner .paragraph {
    color: #FFF;
    font-size: 20px;
    text-shadow: 2px 2px #333;
}

.standard-page #banner h2 {
    font-size: 40px;
}

.landing-page #banner {
    text-align: center;
}

.standard-page #banner {
    text-align: left;
}

.landing-page #header-wrap,
.standard-page #header-wrap {
    display: table;
    width: 100%;
}

.landing-page #nav-wrap,
.standard-page #nav-wrap {
    display: table-row;
    height: 1px;
}

.tr-wrapper {
    display: table-row;
    height: 100%;
}

.td-wrapper {
    display: table-cell;
    vertical-align: middle;
}

.header .paragraph a,
.header .paragraph a:hover {
    color:#FFF;
}

@media (min-width: 768px) {
    #banner h2 {
        font-size: 48px;
    }

    #banner .paragraph {
        font-size: 24px;
    }
}

/* Buttons
--------------------------------------------------------------------------------*/
.btn-standard {
    border: 2px solid transparent;
    color: #fff;
    background-color:#666;
    text-transform:uppercase;
}

.btn-standard:hover,
#btn-standard_hover {
    border-color:#666;
    background-color: #fff;
    color:#000 !important;
}

.btn-alternate,
.header .btn-alternate {
    border: 2px solid #666;
    background:#fff;
    color: #000;
}

.btn-alternate:hover,
.header .btn-alternate:hover,
#btn-alternate_hover {
    background:#666;
    color: #FFF !important;
}

/***
Main content
***/
#main-wrap {
    background-color: #fff;
    padding: 15px 0 10px;
  	position: relative;
  	z-index: 1;
}

.content h2 {
    font-size: 1.75em;
    font-weight: 700;
}

@media (min-width: 768px) {
    #main-wrap {
        padding: 30px 0 25px;
    }
}

/***
Footer
***/
#footer-wrap {
    background-color: #232323;
    color: #fff;
    font-size: 13px;
    padding: 30px 0;
}

#footer-wrap h2 {
    border-bottom: 1px solid #3b3b3b;
    font-size: 20px;
}

#footer-wrap .paragraph {
    font-size: 14px;
}

#footer-wrap a:not(.btn):not([data-toggle]) {
    color:#FFF;
}

#footer-wrap a:not(.btn):not([data-toggle]):hover {
    text-decoration:underline;
}