/* //////////////////////////////////////////////////////////// */
/* General */
/* //////////////////////////////////////////////////////////// */

:root {
 --main-brand-color: #005B9D;
   --secondary-brand-color: #176691;
   --accent-brand-color:#FBB042;
  --accent-brand-hover-color: #cc8c2f;
}

/* ============================================================ */
/* START Base Structure */
/* ============================================================ */

/* === START HTML & Body === */
body {font: normal 14px "Open Sans", sans-serif; color: #333333; background-color: #FFF; -webkit-overflow-scrolling: touch;}
body, .modal-open {padding-right: 0 !important; overflow-y: scroll;}
/* === END HTML & Body === */



/* === START Scroll settings === */
html {-ms-overflow-style: scrollbar;}
html, body {overflow-x: hidden; height: 100%; width: 100%;}
/* === END Scroll settings === */



/* === START Elements with display: none; === */
#google_translate_element, .secondary-header-branding, .secondary-footer-branding, #footer .back-to-top, #footer ul#social span, .print-instructions {display: none !important;}
/* === END Elements with display: none; === */

/* ============================================================ */
/* END Base Structure */
/* ============================================================ */






/* ============================================================ */
/* START Links & Buttons */
/* ============================================================ */

/* === START Links === */
a {color: #1b75bb; text-decoration: none;}
a:hover {color: #1b75bb; text-decoration: underline;}

.forgot-link {font-size: 12px; margin: 5px 0 0 0; padding: 0; text-align: right;}

.bottom-forgot-links {font-size: 12px;}
.bottom-forgot-links p {margin: 0;}
/* === END Links === */



/* === START Buttons === */
.btn, .btn:hover, .btn.hover, .btn:focus, .btn.focus, .btn:active, .btn.active {color: #ffffff;}

.btn-main {margin-left: 5px; float: right;}

.btn .fa-check-circle {display: none;}
.btn.active .fa-check-circle {display: inline-block; margin-right: 5px;}

.btn-default {background-color: #eeeeee; border-color: #a0a0a0; color: #1c1c1c;}
.btn-default:hover, .btn-default.hover, .btn-default:focus, .btn-default.focus, .btn-default:active, .btn-default.active {background-color: #e2e2e2; border-color: #1c1c1c; color: #1c1c1c;}

.btn-primary {background-color: var(--accent-brand-color); border-color: var(--accent-brand-hover-color);}
.btn-primary:hover, .btn-primary.hover, .btn-primary:focus, .btn-primary.focus, .btn-primary:active, .btn-primary.active {background-color: var(--accent-brand-color); border-color: var(--accent-brand-hover-color);}

.btn-success {background-color: var(--secondary-brand-color); border-color: var(--secondary-brand-color);}
.btn-success:hover, .btn-success.hover, .btn-success:focus, .btn-success.focus, .btn-success:active, .btn-success.active {background-color: #125173; border-color: #125173;}

.btn-info {background-color: #7fccff; border-color: #254c66; color: #1c1c1c;}
.btn-info:hover, .btn-info.hover, .btn-info:focus, .btn-info.focus, .btn-info:active, .btn-info.active {background-color: #254c66; border-color: #254c66; color: #ffffff;}

.btn-warning {background-color: #999999; border-color: #999999;}
.btn-warning:hover, .btn-warning.hover, .btn-warning:focus, .btn-warning.focus, .btn-warning:active, .btn-warning.active {background-color: #666666; border-color: #666666;}

.btn-danger {background-color: #a81f1b; border-color: #801814;}
.btn-danger:hover, .btn-danger.hover, .btn-danger:focus, .btn-danger.focus, .btn-danger:active, .btn-danger.active {background-color: #801814; border-color: #801814;}

.btn-link {background-color: transparent; border-color: transparent; color: #0e76bc;}
.btn-link:hover, .btn-link.hover, .btn-link:focus, .btn-link.focus, .btn-link:active, .btn-link.active {background-color: transparent; border-color: transparent; color: #0e76bc; text-decoration: underline;}

.login-register-buttons {margin: 30px 0 0 0;}
.login-register-buttons .btn + .btn {margin-left: 20px;}
/* === END Buttons === */

/* ============================================================ */
/* END Links & Buttons */
/* ============================================================ */






/* ============================================================ */
/* START Wrappers & Containers */
/* ============================================================ */

.wrap {display: block; width: 100%; position: relative; min-height: 100%; height: auto;}

/* ============================================================ */
/* END Wrappers & Containers */
/* ============================================================ */






/* ============================================================ */
/* START Navigation */
/* ============================================================ */

#main-nav {background-color: #ffffff; color: #1b75bb; border: none; margin: 0; padding: 15px 0; border-radius: 0; min-height: inherit; z-index: 200; box-shadow: 0 2px 3px 1px rgba(0, 0, 0, 0.3);}

#main-nav .navbar-header {width: 100%; position: relative;}
#main-nav .navbar-brand {padding: 0; margin: 0; height: auto;}
#main-nav .navbar-brand + .navbar-brand {margin-left: 30px;}

.logo-mobile {max-width: 360px;}
#main-nav .logo-career-tech {margin-top: 10px;}

.navbar {margin: 0; border-radius: 0;}

#main-nav .nav > li, 
#main-nav .nav > li > a, 
#main-nav .nav > li > button {height: 30px; line-height: 30px;}

#main-nav .nav > li > a, 
#main-nav .nav > li > a:active, 
#main-nav .nav > li > a:hover, 
#main-nav .nav > li > a:focus, 
#main-nav .nav > li > button, 
#main-nav .nav > li > button:active, 
#main-nav .nav > li > button:hover, 
#main-nav .nav > li > button:focus {padding: 0px 8px; background-color: transparent; color: #1b75bb; border: none;}

#main-nav .nav > li > button {position: relative; top: -1px;}
#main-nav .nav > li > a:hover, #main-nav .nav > li > button:hover {text-decoration: underline;}

#main-nav .dropdown-menu > li {margin: 0; line-height: normal; height: auto;}
#main-nav .dropdown-menu > li > a {display: block; padding: 3px 20px; clear: both; font-weight: 400; line-height: 1.42857143; color: #333333; white-space: nowrap; height: auto;}
#main-nav .dropdown-menu > li > a:focus, #main-nav .dropdown-menu > li > a:hover {background-color: #caced0; color: #333333; text-decoration: none;}

#main-nav .dropdown-menu > .divider {height: 1px; margin: 9px 0;}

.navbar-toggle:focus, .dropdown-toggle:focus, .dropdown-toggle.active:focus {outline: dotted thin; outline: -webkit-focus-ring-color auto 5px; outline-offset: -2px;}

.landing-page-toggle {top: 50%; position: absolute; right: 0; transform: translateY(-50%); z-index: 200;}
.language-toggle {list-style: none;}
.language-select {top: 30px;}

/* ============================================================ */
/* END Navigation */
/* ============================================================ */






/* ============================================================ */
/* START Content Rows */
/* ============================================================ */

/* === START Top Row === */
/*.top-row {padding: 20px 0; background-color: transparent;}*/
/* === END Top Row === */



/* === START Center Row === */
.center-row {padding: 20px 0; margin: 120px 0;}
.center-row h1 {font-size: 40px; text-align: left; color: #ffffff; margin: 0; background-color: transparent; text-shadow: 1px 1px 0 #000000;}
.login-area .pull-right {
  background-color: rgba(0, 0, 0, .42);
  padding: 15px;
  border-radius: 4px;
}
/* === END Center Row === */



/* === START Bottom Row === */
.bottom-row {color: #ffffff; background-color: #000000; position: relative; padding: 0; margin-top: 0;}

.user-types {background-color: var(--main-brand-color);}
.user-types .nav-tabs {margin: 0; padding: 0; list-style-type: none; border: none; display: flex;}
.user-types .nav-tabs > li {display: inline-block; border-right: 1px solid #ffffff; text-align: center; width: auto; float: none; margin: 0; flex: 1 0 auto;}
.user-types .nav-tabs > li:first-child {border-left: 1px solid #ffffff;}
.user-types .nav-tabs > li > a {display: block; padding: 15px; color: #ffffff; font-size: 16px; border-radius: 0; border: none; margin: 0;}
.user-types .nav-tabs > li > a:hover, .user-types .nav-tabs > li > a:focus, .user-types .nav-tabs > li.active > a {background-color: #ffffff; color: var(--main-brand-color); text-decoration: none; border-radius: 0; border: none;}

.user-types-content {padding: 30px 0 70px 0;}
.user-types-content a {
  color: #2193D0;
  text-decoration: none;
  font-weight: bold;
}
.user-types-content a:hover, 
.user-types-content a:focus {
  color: #c5edfd;
  text-decoration: underline;
}


#welcome .lead {margin-top: 45px;}

.c2b-section {padding: 0;}
.c2b-section > :first-child {margin-top: 0;}
.c2b-section + .c2b-section {margin-top: 60px;}
.c2b-section .h4 > .fa {margin-right: 5px;}
.c2b-intro {padding: 60px 0 60px 0; border-bottom: 1px solid #444444; margin-top: -30px;}
.c2b-col {padding: 60px 15px 0 15px;}
.c2b-col-main {padding-right: 60px; border-right: 1px solid #444444;}
.c2b-col-sec {padding-left: 60px;}

.c2b-resources-section {margin: 30px 0;}
.c2b-resource-links {padding-left: 0; list-style: none; margin: 0;}
.c2b-resource-links > li + li {margin-top: 10px;}

.partners-container {background-color: #cccccc; color: #333333; position: relative;}

.partner-tabs .nav-tabs {position: absolute; top: -39px; border: none;}

.partner-tabs .nav-tabs > li > a {border: none; border-radius: 4px 4px 0 0; line-height: 1.42857; margin: 0 2px 0 0; background-color: #333333; color: #ffffff;}
.partner-tabs .nav-tabs > li > a:hover, .partner-tabs .nav-tabs > li > a:focus {color: #ffffff; background-color: #666666;}

.partner-tabs .nav-tabs > li.active > a {background-color: #cccccc; border: none; color: #333333; cursor: default;}

.partner-content .tab-pane {padding: 30px 0;}
.partner-content a {color: var(--main-brand-color); font-weight: bold;}
.partner-content a:hover, .partner-content a:focus {color: #333333;}

.partner-logo-section {text-align: center;}
.partner-logo {display: inline-block; vertical-align: middle;}
.partner-logo + .partner-logo {margin-left: 15px;}
.partner-logo > img {max-width: 100%;}

#training a:hover img {opacity: 0.6;}
.vid-overview {margin-top: 15px;}
.vid-overview:nth-child(-n+2) {margin-top: 0;}
.vid-overview:nth-child(odd) {clear: left;}

#admin-form, #journey-form {display: none;}
.login-forms {margin-top: 40px;	}
#links ul {margin-left: 0px; padding-left: 30px;}
/* === END Bottom Row === */

/* ============================================================ */
/* END Content Rows */
/* ============================================================ */






/* ============================================================ */
/* START Footer */
/* ============================================================ */

/* === START Footer Styles === */
#footer {color: #ffffff; padding: 0; background-color: #1B75BB; text-align: center; overflow: hidden;}
#footer a {text-decoration: none; color: #ffffff; -webkit-transition: .3s; -moz-transition: .3s; transition: .3s;}
#footer a path, #footer a circle {fill: #ffffff;}
#footer ul {margin: 0; display: block; line-height: 80px; height: 80px; padding: 0;}
#footer ul > li {list-style: none; display: inline-block; margin: 0; padding: 0; line-height: 80px; vertical-align: middle; height: 80px;}
#footer ul > li > a {display: block;}
/* === END Footer Styles === */



/* === START Powered by Kuder === */
#powered-by-kuder-logo {padding: 20px 0; margin: 0; max-width: 150px; height: 80px;}
/* === END Powered by Kuder === */



/* === START Kuder Links === */
#kuder-links a {font-size: 11px; margin: 0 10px; padding: 0; border-bottom: 1px dotted transparent; max-height: 80px;}
#kuder-links a:hover {border-bottom: 1px dotted #ffffff;}
/* === END Kuder Links === */



/* === START Social Footer Icons === */
#social > li > a {text-decoration: none; padding: 0; font-size: 16px;}
#social > li > a:hover {opacity: .5;}
#social > li > a > .fa {vertical-align: middle; width: 20px; line-height: 20px; height: 20px;}
#social > li > a > span:not(.sr-only) {display: none;}
/* === END Social Footer Icons === */

/* ============================================================ */
/* END Footer */
/* ============================================================ */






/* ============================================================ */
/* START Component Customization */
/* ============================================================ */

/* === START Enhancements Modal === */
#enhancementsModal .modal-body h4 {margin-top: 30px}
#enhancementsModal .modal-body > :first-child {margin-top: 0;}
/* === END Enhancements Modal === */



/* === START Slideshow Styles === */
#photodiv {display: block; position: absolute; padding: 0; width: 100%; height: 100%; z-index: -999;}
#supersized {display: block; position: fixed; left: 0; top: 0; overflow: hidden; z-index: -999; height: 100%; width: 100%; margin: 0; padding: 0;}
#supersized.speed img {-ms-interpolation-mode: nearest-neighbor; image-rendering: -moz-crisp-edges;}
#supersized.quality img {-ms-interpolation-mode: bicubic; image-rendering: optimizeQuality;}
#supersized img {width: auto; height: auto; position: relative; display: none; outline: none; border: none;}
#supersized li {display: block; list-style: none; z-index: -30; position: fixed; overflow: hidden; top: 0; left: 0; width: 100%; height: 100%; background-color: #111111;}
#supersized li.prevslide {z-index: -20;}
#supersized li.activeslide {z-index: -10;}
#supersized li.prevslide img, #supersized li.activeslide img {display: inline;}
/* === END Slideshow Styles === */



/* === START Form Behavior === */
.form-group + .error-message {margin: -10px 0 15px 0;}
.error-message {position: relative; margin: 5px 0 0 0; text-align: left; color: #a81f1b; font-size: 12px;}
.input-error {border-color: #a81f1b; outline: 0 none;}
.input-error:focus {border-color: #a81f1b; box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(186,65,65,.6);}
/* === END Form Behavior === */



/* === START 3rd Party Buttons === */
.btn-3rd-party, .btn-3rd-party:hover, .btn-3rd-party:active, .btn-3rd-party:focus {color: #ffffff;}
.btn-3rd-party > .fa, .btn-3rd-party > [class^='icon-'] {margin-right: .3em;}
.btn-clever {background-color: #1464FF; border-color: #1464FF;}
.btn-clever:hover, .btn-clever:focus {background-color: #2e51ac; border-color: #2e51ac;}
.icon-clever {display: inline; position: relative;}
.btn-3rd-party .icon-clever {width: 15px; top: -1px;}

.icon-clever {width: 14px; height: 14px; }
/* === END 3rd Party Buttons === */



/* === START Modal Styles === */
.mf-nested {margin: 0 -15px -15px -15px;}
.mf-content-right {float: right; text-align: right; padding-right: 0;}
.mf-content-left {float: left; text-align: left; padding-left: 0;}
/* === END Modal Styles === */

/* ============================================================ */
/* END Component Customization */
/* ============================================================ */

/* //////////////////////////////////////////////////////////// */
/* END General */
/* //////////////////////////////////////////////////////////// */













/* //////////////////////////////////////////////////////////// */
/* START Media Queries */
/* //////////////////////////////////////////////////////////// */

/* ============================================================ */
/* START Extra Large Screen Media Queries */
/* ============================================================ */

/* === START Screens >= 1200px === */
@media (min-width: 1200px) {
  .wrap {
    /*
    .wrap pushes footer down preventing footer from overlapping content
    height of the bottom-row (118px) div + footer height (80px)
    */
    padding-bottom: calc(118px + 80px);

    /* use negative values to pull the footer back up */
    margin-bottom: calc(-118px + -80px);
  }

  #footer {height: 80px;}

  .footer-links {width: 66%;}
  .footer-logo, .social-icons {width: 17%;}
}
/* === END Screens >= 1200px === */

/* ============================================================ */
/* END Extra Large Screen Media Queries */
/* ============================================================ */






/* ============================================================ */
/* START Large Screen Media Queries */
/* ============================================================ */

/* === START Screens >= 992px && <= 1199px === */
@media (max-width: 1199px) {
  #main-nav .nav > li > a, #main-nav .nav > li > button {font-size: 12px;}
}

@media (min-width: 992px) and (max-width: 1199px) {
  .wrap {
    /*
    .wrap pushes footer down preventing footer from overlapping content
    height of the bottom-row (118px) div + footer height (80px)
    */
    padding-bottom: calc(118px + 80px);

    /* use negative values to pull the footer back up */
    margin-bottom: calc(-118px + -80px);
  }

  #footer {height: 80px;}

  .links-container li a {font-size: 14px; padding: 11px 20px;}

  .center-row h1 {font-size: 33px;}

  #welcome .lead {margin-top: 0;}

  .partner-logo > img {max-width: 150px;}
}

@media (min-width: 992px) {
  .login-register-buttons .btn {padding: 10px 16px; font-size: 18px; line-height: 1.3333333; border-radius: 6px;}
}
/* === END Screens >= 992px && <= 1199px === */

/* ============================================================ */
/* END Large Screen Media Queries */
/* ============================================================ */






/* ============================================================ */
/* START Medium Screen Media Queries */
/* ============================================================ */

/* === START >= 768px && <= 991px === */
@media (max-width: 991px) {
  .login-register-buttons .btn, .login-register-buttons .btn-group {display: block; width: 100% !important;}
  .login-register-buttons .btn + .btn, .login-register-buttons .btn-group + .btn {margin: 10px 0 0 0 !important;}
  .login-register-buttons .btn {font-size: 14px;}

  .c2b-bridge-section + .c2b-bridge-section {margin-top: 15px;}
}

/* === START >= 768px && <= 991px === */
@media (min-width: 768px) and (max-width: 991px) {
  /*.wrap {padding-bottom: 480px; margin-bottom: -480px;} /* footer height + height of the bottom-row (400) div */
  .wrap {
    /*
    .wrap pushes footer down preventing footer from overlapping content
    height of the bottom-row (137px) div + footer height (65px)
    */
    padding-bottom: calc(137px + 65px);

    /* use negative values to pull the footer back up */
    margin-bottom: calc(-137px + -65px);
  }

  #main-nav li {margin: 0;}
  #main-nav a.navbar-brand img {/*max-width: 400px;*/}
  #main-nav a.navbar-brand-secondary img {max-width: 150px; margin-top: 25px;}

  .center-row h1 {font-size: 25px;}

  .links-container li a {font-size: 12px; padding: 11px 8px;}

  #welcome .lead {margin-top: 0;}
  #welcome .lead + p {margin-bottom: 30px;}

  .partner-logo > img {max-width: 120px;}
  .partner-tabs .nav > li > a {padding: 10px 8px;}

  #footer {height: 65px;}
  #footer ul {line-height: 65px; height: 65px;}
  #footer ul > li {line-height: 65px; height: 65px; top: -2px;}
  #powered-by-kuder-logo {height: 65px;}
  #powered-by-kuder-logo > a {margin-top: -11px;}
  #kuder-links a {max-height: 65px;}
}

@media (min-width: 768px) {
  
  #toTop {display: none !important;}

  .bottom-row .container [class^='col-'] > :last-child, .bottom-row .container [class^='col-'] > :only-child {margin-bottom: 0;}

}
/* === END >= 768px && <= 991px === */

/* ============================================================ */
/* END Medium Screen Media Queries */
/* ============================================================ */






/* ============================================================ */
/* START Extra Small Screen Media Queries */
/* ============================================================ */

/* === START <= 767px === */
@media (max-width: 767px) {
  body {background-color: #ffffff; background-image: none;}

  a, a:hover, a:focus {color: #1b75bb;}
  
  #toTop {
    position: fixed;
    bottom: 15px;
    right: 15px;
    z-index: 10000;
    display: block;
  }

  .wrap {
    min-height: auto;
    height: auto;
    /*
    .wrap pushes footer down preventing footer from overlapping content
    height of the bottom-row (147px) div + footer height (0)
    */
    padding-bottom: calc(0px + 147px);

    /* use negative values to pull the footer back up */
    margin-bottom: calc(-0px + -147px);  

  }
  
  h4, .h4 {font-size: 16px;}

  .logo-mobile {max-width: 300px; margin: auto;}

  .navbar-brand + .navbar-brand {display: none !important;}

  #main-nav {background-color: #ffffff; line-height: inherit; height: auto;}
  #main-nav .navbar-brand {margin: 0; position: relative; padding: 1rem 0; text-align: center; display: block; width: 100%; z-index: 198;}
  #main-nav .container {padding: 0 15px;}

  #main-nav .container > .navbar-collapse {border: none;}
  #main-nav .nav {background-color: #ffffff; padding: 0; margin: 0 -15px; border: none;}
  #main-nav .nav > li {background: transparent; margin: 0; height: auto; line-height: inherit !important; clear: both; display: block;}
  #main-nav .nav > li > a, #main-nav .nav > li > button {height: auto; line-height: inherit !important; padding: 7px 15px !important; text-align: center; font-size: 14px;}

  #main-nav .nav > li > button {top: 0px; display: block; width: 100%;}

  #main-nav .nav > .open .dropdown-menu {padding: 0; background-color: #ffffff; border-radius: 0; text-align: center;}
  #main-nav .nav > .open .dropdown-menu > li > a {color: #333333;}
  #main-nav .nav .dropdown-menu > li > a:active, #main-nav .nav .dropdown-menu > li > a:hover {background-color: #e2e2e2; color: #333333;}

  .navbar-header {margin: 0 !important; position: relative;}
  .navbar-toggle {background-color: #d1d1d1; margin-right: 30px; color: #333333; display: inline-block; border: none; position: absolute; top: 50%; z-index: 199; margin: 0; transform: translateY(-50%);}

  .center-row {padding: 60px 0; margin: 0; background-color: #000000;}
  .center-row h1 {font-size: 28px;}

  .user-types, .partner-tabs, .partner-logo-section > .lead {display: none !important;}
  .tab-pane, .partner-content .tab-pane {display: block !important; opacity: 1 !important; margin-top: 60px; padding-top: 60px; border-top: 1px solid transparent;}
  .partner-content .tab-pane {padding-bottom: 0; border-top-color: #333333;}
  .partner-content .tab-pane:first-child {margin-top: 0; border-top-color: transparent;}
  .tab-pane:first-child {margin-top: -30px;}
  .user-types-content, .partner-content {padding: 30px 0;}
  .user-types-content .tab-pane {border-top-color: #ffffff;}

  .tab-pane h2 {
    margin-top: 0 !important;
  }
  
  .c2b-section {margin: 30px 0 !important;}
  .c2b-intro {padding: 0; margin: 0 !important; border: none;}
  .c2b-col {padding: 0 15px; border: none;}
  .c2b-col + .c2b-col {margin-top: -30px;}
  
  .vid-overview + .vid-overview {margin-top: 30px;}

  .main-xs-form {background-color: #ffffff; margin: 0; padding: 0; color: #333333;}

  .secondary-header {background-color: #f7f7f7; border-bottom: 2px solid #dddddd; text-align: center; padding: 15px;}
  .partner-logo {display: block;}
  .partner-logo > img {max-width: 250px; padding: 15px; margin: auto;}

  .panel-heading, .panel-body {padding: 30px 15px; margin: 0; border-radius: 0; text-align: center;}
  .panel-heading > :first-child, .panel-body > :first-child {margin-top: 0;}
  .panel-heading > :last-child, .panel-body > :last-child {margin-bottom: 0;}

  .panel-heading {border-bottom: 1px solid #dadada;}

  .system-heading, .system-get-started {font-size: 24px;}

  .system-heading {padding: 0; color: #333333; text-align: center;}
  .system-description {}
  .system-get-started {text-align: center;}

  .or-line {border: none; margin: 15px 0; position: relative;}
  .or-line:before {content: ''; width: 100%; height: 1px; background-color: #dadada; position: absolute; top: 50%; left: 0;}
  .or-circle {background-color: #dadada; border-radius: 50%; height: 40px; line-height: 40px; margin: 0 auto; width: 40px; color: #333333; text-align: center; position: relative; z-index: 1;}

  .bottom-forgot-links {text-align: center; margin-top: 15px;}

  #footer {padding: 30px 0; min-height: 147px; overflow: inherit;}
  #footer ul, #footer ul > li {line-height: inherit; height: auto;}
  #powered-by-kuder-logo {margin: 0 auto; padding: 0; height: auto;}
  #powered-by-kuder-logo > a {top: 0; margin-top: 0;}
  #kuder-links a {margin: 0 5px;}
  .footer-links + .footer-links {margin-top: 15px;}
}
/* === END <= 767px === */

/* ============================================================ */
/* END Extra Small Screen Media Queries */
/* ============================================================ */






/* ============================================================ */
/* START Super Small Screen Media Queries */
/* ============================================================ */

/* === START >=0px && <= 500px === */
@media (max-width: 500px) {
  .wrap {
    /*
    .wrap pushes footer down preventing footer from overlapping content
    height of the bottom-row (166px) div + footer height (0)
    */
    padding-bottom: calc(0px + 166px);

    /* use negative values to pull the footer back up */
    margin-bottom: calc(-0px + -166px);  
  }

  .logo-mobile {max-width: 220px;}

  #footer {height: 166px;}
}
/* === END >=0px && <= 500px === */

/* === START >=0px && <= 360px === */
@media (max-width: 360px) {  
  .logo-mobile {max-width: 220px;}
}
/* === END >=0px && <= 360px === */

/* ============================================================ */
/* END Super Small Screen Media Queries */
/* ============================================================ */

/* //////////////////////////////////////////////////////////// */
/* END Media Queries */
/* //////////////////////////////////////////////////////////// */