/* Colors ---


Yellow #FEE700
R:	255
G:	232
B:	0

Purple #A8288C
R:	168
G:	40
B:	140

Red #EF4136
R:	239
G:	65
B: 	54

Blue #23BBB8
R: 	35
G: 	187
B: 	184

Green #44B549
R:	68
G:	181
B:	73


--- */

body {
    width: 100%;
    height: 100%;
    font-size: 30px;
    font-family: 'Calibre', Helvetica, Arial, sans-serif;
    line-height: normal;
    font-weight: bold;
    padding-right: 25%;

    -webkit-transition: padding-right 0.5s ease;
    -moz-transition: padding-right 0.5s ease;
    -o-transition: padding-right 0.5s ease;
    transition: padding-right 0.5s ease;
}

html {
    width: 100%;
    height: 100%;
}

body.toggled {
  padding-right: 0!important;
}

@font-face {
  font-family: 'Calibre';
  src: url('../fonts/vllg-Klim-Calibre-Semibold+SemiboldItalic-WebFonts/CalibreWeb-Semibold.woff2') format('woff2'),
       url('../fonts/vllg-Klim-Calibre-Semibold+SemiboldItalic-WebFonts/CalibreWeb-Semibold.woff') format('woff'),
       url('../fonts/vllg-Klim-Calibre-Semibold+SemiboldItalic-WebFonts/CalibreWeb-Semibold.eot') format('embedded-opentype'),
       url('../fonts/vllg-Klim-Calibre-Semibold+SemiboldItalic-WebFonts/CalibreWeb-Semibold.eot');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'Calibre';
  src: url('../fonts/vllg-Klim-Calibre-Semibold+SemiboldItalic-WebFonts/CalibreWeb-SemiboldItalic.woff2') format('woff2'),
       url('../fonts/vllg-Klim-Calibre-Semibold+SemiboldItalic-WebFonts/CalibreWeb-SemiboldItalic.woff') format('woff'),
       url('../fonts/vllg-Klim-Calibre-Semibold+SemiboldItalic-WebFonts/CalibreWeb-SemiboldItalic.eot') format('embedded-opentype'),
       url('../fonts/vllg-Klim-Calibre-Semibold+SemiboldItalic-WebFonts/CalibreWeb-SemiboldItalic.eot');
  font-weight: normal;
  font-style: italic;
}

img {
  max-width: 100%;
  height: auto;
}

.video iframe {
  max-width: 100%;
}

video {margin: 36px 0 18px 0 ;}

section{
  overflow: hidden;
  z-index: 2;

}

main  {
  background: url(../images/background.svg) repeat-y top center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;

  padding-bottom: 1000px;
}
/* ---- intro-section ---- */

h1 {font-size: 1.5em;}

h1, h2, h3  {
  font-weight: bold;
}

h2  {
  font-size: 1.25em;
  font-weight: bold;
}

h3  {
  font-size: 1.1em;
  font-weight: 800;
}

p {
  margin-bottom: 18px 0;
  line-height: 1.1em;
}

p a, ol a, h1 a {color: #44B549; text-decoration: none;} h1 a:hover, p a:hover, p a:visited, p a:focus, ol a:hover, ol a:visited, ol a:focus, ol a:visited {text-decoration: none; color: #FEE700;}

ul li, ol {list-style-position: outside;}

.row  {padding: 36px;}

.content, .child-content {
  height: 100%;
  background-color: #fff;
  padding: 15px 36px 36px 36px;
  text-align: left;
}

.about-content  {
  height: 100%;
  background-color: #fff;
  padding-top: 18px;
  text-align: left;
}
.about-content figure {
  display: inline-block; padding: 72px 18px;
  width: 49%; vertical-align: middle; text-align:center;
}


.child-content  {
  color: #000!important;
}

/* ---- intro-section ---- */
.intro-section {
    position: relative;
    height: 100vh;
text-align: center;
/* display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-ms-flex-align: center;
-webkit-align-items: center;
-webkit-box-align: center;
align-items: center;*/

    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
    background-color: rgb(239,65,54);
    z-index: 1000;
}

div#hero_logo {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 40%;
}

div#hero_logo img {
  max-width: 100%;
}

.intro-scroll {
  position: absolute;
  bottom: 0;
  left: 0; right: 0;
  color: #fff;
  padding-bottom: 10px;
}

.blurb-section {
    padding: 72px 0;
    text-align: center;
    /* background: url(../images/content-pages/Background-01.svg) repeat-y top center scroll;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover; */
}

.default-section {
    padding: 72px 0;
    text-align: center;
    /* background: url(../images/content-pages/Background-01.svg) repeat-y top center scroll;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover; */
}

.success-section {
    padding: 72px 0;
    text-align: center;
    /* background: url(../images/content-pages/Background-01.svg) repeat-y top center scroll;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover; */
}

.events-section {
    padding: 72px 0;
    text-align: center;
    /* background: url(../images/content-pages/Background-02.svg) repeat-y top center scroll;
    background-size: contain;
    -webkit-background-size: contain;
    -moz-background-size: contain;
    background-size: contain;
    -o-background-size: contain; */
}

.map-section {
    padding: 72px 0;
    text-align: center;
    /* background: url(../images/content-pages/Background-03.svg) repeat-y top center scroll;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover; */
}

.storymap-section {
    padding: 72px 0;
    text-align: center;
    /* background: url(../images/content-pages/Background-03.svg) repeat-y top center scroll;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover; */
}

.news-section {
    padding: 72px 0;
    text-align: center;
    /* background: url(../images/content-pages/Background-04.svg) repeat-y top center scroll;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;*/
}

.about-section {
    padding: 72px 0;
    text-align: center;
    /*background: url(../images/content-pages/Background-05.svg) repeat-y top center scroll;
    background-size: contain;
    -webkit-background-size: contain;
    -moz-background-size: contain;
    background-size: contain;
    -o-background-size: contain;*/
}

.contact-section {
    padding: 72px 0;
    text-align: center;
    /* background: url(../images/content-pages/Background-06.svg) repeat-y top center scroll;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover; */
}

/* Toggle Styles */

nav {
        position: fixed;
        top: 0;
        left: auto;
        right: 0!important;
        -webkit-transition: right 0.5s ease;
        -moz-transition: right 0.5s ease;
        -o-transition: right 0.5s ease;
        transition: right 0.5s ease;

        width: 25%;
        height: 100%;
        padding: 115px 0 115px 0;
        border: none;
        text-align: center;
        background-color: #fff;
        overflow: auto;
    }
nav.navbar.navbar-default.navbar-fixed-top  {z-index: 900;}
nav.toggled {
        right: -25%!important;
}

.navbar-nav>li  {
      float: center!important;
      text-align: center;
      font-size: 1.5em;
    }

.navbar-nav>li.social-icons a  {
          float: center!important;
          display: inline-block!important;
          text-align: center;
          font-size: 1.5em;
          padding: 0;
        }

#nav-logo img {
    max-width: 400px; width: 80%;
    margin-bottom: 115px;
}

#menu-toggle  {position: fixed; right: 0; width: 50px; height: 50px; z-index: 2000;}
#menu-toggle:hover, #menu-toggle:active, #menu-toggle:focus {text-decoration: none;}
.glyphicon-right.toggled {cursor: pointer; background-image: url(http://intersectionatthejunction.com/assets/images/Arrow-02.svg);}
.glyphicon-right {cursor: pointer; background-image: url(http://intersectionatthejunction.com/assets/images/Arrow-01.svg);}
.glyphicon-close {position: absolute; cursor: pointer; background-image: url(http://intersectionatthejunction.com/assets/images/Close-01.svg);}
#listing-toggle  {position: fixed; bottom: 50vh; right: 0; width: 50px; height: 50px; z-index: 2000;}
#listing-toggle:hover, #listing-toggle:active, #listing-toggle:focus {cursor: default!important; text-decoration: none;}


.register-button p a {
  display: inline-block;
  background-color: #45B549;
  color: #FFF;
  /*box-shadow: 5px 5px 10px #FFF;*/
  text-decoration: none;
  text-align: center;
  padding: 36px;
  min-height: 35px;
  margin: 36px 0 18px 0;
}

.register-button p a:hover {
  background-color: #ffe800; color: #FFF;
}

.contact-button ul {
  display: block;
  position: relative;
  margin-top: 36px;
  background-color: #FFF;
  list-style-type: none!important; padding-left: 0!important;
  text-align: center!important;
}

.contact-button ul li:hover   {
  background-color: #ffe800;
}

.contact-button ul li  {
  vertical-align: top;
  display: inline-block;
  float: left;
  background-color: #45B549;

  margin: 0 10px 36px 0;
  padding: 20px 5px 20px 5px;

  width: 31%;
  min-width: 200px;
  min-height: 177px;

  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -webkit-box-align: center;
  align-items: center;

}

.contact-button ul li a{
  color: #FFF;
  text-decoration: none;
}

.hashtag  {display: block; float: left; width: 100%;}

@media(max-width:800px){
  body {font-size: 18px; padding-right: 0; overflow-wrap: break-word;word-wrap: break-word;word-break: break-word;-ms-hyphens: auto;-moz-hyphens: auto;-webkit-hyphens: auto;hyphens: auto;}
  .row {padding: 18px;}
  .content, .child-content {padding: 5px 18px 18px 18px;}
  .about-content figure {width: 100%; display: block!important; padding: 36px;}
  nav {z-index: 1500!important; width: 100%; height: auto; padding: 36px 0 0 0; -webkit-transition: top 0.5s ease; -moz-transition: top 0.5s ease; -o-transition: top 0.5s ease; transition: top 0.5s ease;}
  nav.toggled {display: static; top:-700px; height: auto; right: 0!important;}
  #nav-logo img {width: 200px; margin-bottom: 36px!important;}
  nav.navbar.navbar-default.navbar-fixed-top {overflow: auto; z-index: 900;}
  nav.navbar  {padding: 72px 0;}
  .navbar-nav > li > a  {font-size: 1em; line-height: 1em;}
  #menu-toggle  {z-index: 2000!important;}
  .glyphicon-right {cursor: pointer; background-image: url(http://intersectionatthejunction.com/assets/images/Arrow-04.svg);}
  .glyphicon-right.toggled {background-image: url(http://intersectionatthejunction.com/assets/images/Arrow-03.svg);}
  img.aboutimg {display: block; max-width: 100%!important; height:auto!important;}
  .contact-button ul {margin: 18px 0;}
  .contact-button ul li {display: block!important; float: none; width: 31%; height: auto; min-height: inherit; margin: 10px 0;}
  h1 {font-size: 1.25em;} h2 {font-size: 1em;}
  div#hero_logo {width: 50%;}
  .register-button p a {padding: 18px; min-height: 35px; margin: 18px 0 5px 0px;}
  .hashtag  {float:none;}

}

@media(min-width:1643px){
  .navbar-nav > li > a  {font-size: 1.5em; line-height: 1em;}
  #nav-logo img {width: 100%;}
}
