img.imageStretch
{
  width:100%;
}

a
{
  color:inherit;
  outline:none; /*remove outline on image links, looks nicer.  If its needed for accessibility we can put it back in later*/

  cursor:pointer; /*for when <a doesn't have href, ie onclick="javascript*/
}
a:hover,
a:focus
{
  color:inherit;
  text-decoration:none;
  outline:none; /*remove outline on image links, looks nicer.  If its needed for accessibility we can put it back in later*/
}

h1, h2, h3, p
{
  padding:0px;
  margin:0px;
}

h1
{
  font-family:'Oswald', sans-serif;
  font-size:25px;
  letter-spacing:1px;
  margin-bottom:15px;
}

p
{
  margin-bottom:25px;
}

ul
{
  padding:0px;
  margin:0px;
  padding-left:15px;
}

.container
{
  -webkit-transition:all 0.25s;
  transition:all 0.25s;
}

.section
{
  margin-bottom:1px;
}

/* Style adjustments for viewports 320px and over go here, anything smaller than 320 treat it as 320 */
@media all and (min-width: 0px)
{
  html, body
  {
    margin:0;
    padding:0;
    /*height:100%;*/
    
    font-family:'Roboto', sans-serif;
    font-size:14px;
    color:#333333;
    
    -webkit-text-size-adjust: none; /* Prevent font scaling on iOS devices */
  }

  .header .logo
  {
    width:105px;
  }

  .tmodal .logo
  {
    width:200px;
  }

  .card-holder {
    position: relative;

    /* 9:12.5 Aspect Ratio */
    width:100%;
    padding-top:138.89%;  /*900 / 1250*/
    margin-bottom:30px;

    cursor:alias;
  }
  .card-holder:hover .card.-front {
    /*transform: rotateY(-0.5turn);*/
    z-index:-1;
  }
  .card-holder:hover .card.-back {
    /*transform: rotateY(0turn);*/
    z-index:0;
  }

  .card {
    position: absolute;
    top:0px;
    /*width:100%;*/

    transition: transform 0.75s ease;
    backface-visibility: hidden;
    -webkit-backface-visibility:hidden;
  }

  .-flipped {
    /*transform: rotateY(0.5turn);*/
    z-index:0;
  }

  .footer
  {
    background-color:#333333;
    color:white;
    padding-top:25px;
    padding-bottom:15px;

    text-align:center;
  }

  .footerTerms
  {
    padding-top:15px;
    font-size:10px;
    text-align:center;
  }
}


/*iPhone 6 or iPhone 5 sideways*/
@media all and (min-width: 375px)
{
  html, body
  {
    margin:0;
    padding:0;
    /*height:100%;*/
    
    font-family:'Roboto', sans-serif;
    font-size:14px;
    color:#333333;
    
    -webkit-text-size-adjust: none; /* Prevent font scaling on iOS devices */
  }
}


/* Small devices (tablets, 768px and up) */
@media all and (min-width: 768px)
{
  html, body
  {
    margin:0;
    padding:0;
    /*height:100%;*/
    
    font-family:'Roboto', sans-serif;
    font-size:14px;
    color:#333333;
    
    -webkit-text-size-adjust: none; /* Prevent font scaling on iOS devices */
  }

  .header .logo
  {
    width:160px;
  }

  .tmodal .logo
  {
    width:320px;
  }

  .card-holder {
    position: relative;

    /* 9:12.5 Aspect Ratio */
    width:100%;
    padding-top:138.89%;  /*900 / 1250*/
    margin-bottom:30px;

    cursor:alias;
  }
  .card-holder:hover .card.-front {
    /*transform: rotateY(-0.5turn);*/
    z-index:-1;
  }
  .card-holder:hover .card.-back {
    /*transform: rotateY(0turn);*/
    z-index:0;
  }

  .card {
    position: absolute;
    top:0px;
    /*width:100%;*/

    transition: transform 0.75s ease;
    backface-visibility: hidden;
    -webkit-backface-visibility:hidden;
  }

  .-flipped {
    /*transform: rotateY(0.5turn);*/
    z-index:0;
  }

  .footer
  {
    background-color:#333333;
    color:white;
    padding-top:25px;
    padding-bottom:15px;

    text-align:left;
  }

  .footerTerms
  {
    padding-top:0px;
    font-size:10px;
    text-align:right;
  }
}


/* Medium devices (desktops, 992px and up) */
@media all and (min-width: 992px)
{
  html, body
  {
    margin:0;
    padding:0;
    /*height:100%;*/
    
    font-family:'Roboto', sans-serif;
    font-size:14px;
    color:#333333;
    
    -webkit-text-size-adjust: none; /* Prevent font scaling on iOS devices */
  }

  .header .logo
  {
    width:160px;
  }

  .tmodal .logo
  {
    width:320px;
  }

  .card-holder {
    position: relative;

    /* 9:12.5 Aspect Ratio */
    width:100%;
    padding-top:138.89%;  /*900 / 1250*/
    margin-bottom:30px;

    cursor:alias;
  }
  .card-holder:hover .card.-front {
    /*transform: rotateY(-0.5turn);*/
    z-index:-1;
  }
  .card-holder:hover .card.-back {
    /*transform: rotateY(0turn);*/
    z-index:0;
  }

  .card {
    position: absolute;
    top:0px;
    /*width:100%;*/

    transition: transform 0.75s ease;
    backface-visibility: hidden;
    -webkit-backface-visibility:hidden;
  }

  .-flipped {
    /*transform: rotateY(0.5turn);*/
    z-index:0;
  }

  .footer
  {
    background-color:#333333;
    color:white;
    padding-top:25px;
    padding-bottom:15px;

    text-align:left;
  }

  .footerTerms
  {
    padding-top:0px;
    font-size:10px;
    text-align:right;
  }
}


/* Large devices (large desktops, 1200px and up) */
@media all and (min-width: 1200px)
{
  html, body
  {
    margin:0;
    padding:0;
    /*height:100%;*/
    
    font-family:'Roboto', sans-serif;
    font-size:14px;
    color:#333333;
    
    -webkit-text-size-adjust: none; /* Prevent font scaling on iOS devices */
  }

  .card-holder {
    position: relative;

    /* 9:12.5 Aspect Ratio */
    width:100%;
    padding-top:138.89%;  /*900 / 1250*/
    margin-bottom:30px;
    
    cursor:alias;
  }
  .card-holder:hover .card.-front {
    transform: rotateY(-0.5turn);
    -webkit-transform: rotateY(-0.5turn);
    
    z-index:auto;
  }
  .card-holder:hover .card.-back {
    transform: rotateY(0turn);
    -webkit-transform: rotateY(0turn);
             
    z-index:auto;
  }

  .card {
    position: absolute;
    top:0px;
    /*width:100%;*/

    transition: transform 0.75s ease;
    backface-visibility: hidden;
    -webkit-backface-visibility:hidden;
  }

  .-flipped {
    transform: rotateY(0.5turn);
    z-index:auto; 
  }
}


@media all and (min-width: 1600px)
{
  .container
  {
    width: 1570px;
  }

  #evolveAcademy
  {
    /* Create the parallax scrolling effect, only on realy big screens */
    background-attachment:fixed;
  }
}

body
{
  padding-right:0px!important;
}
body.noscroll
{
  position:fixed;
  overflow:hidden;
  width:100%;
}


.tmodal {
  display: flex;
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  z-index: 9;
  background-color: rgba(110, 63, 145, 0.99);

  transition: clip-path 500ms ease-out;

  justify-content: center;
  align-items: center;
  clip-path: polygon(100% -50%, 150% 0%, 130% 0%, 150% -20%);
  visibility:hidden;

  color:white;
}

.modal-active {
  clip-path: polygon(50% -50%, 150% 50%, 50% 150%, -50% 50%);
  visibility:visible;
}

nav {
  opacity: 0;
  transition: opacity 200ms linear;
  padding: 35px;
  /*
  background-color: #000;
  box-shadow: 0 0 30px 15px #000;
  */
}
nav ul {
  text-align: center;
  list-style-type: none;
  font-weight:bold;
  padding:0px;
  margin:0px;
}
nav ul li {
  display: block;
  margin-bottom: 14px;
  opacity: 0;
  transform: translateY(-5px);
  transition: all 400ms ease-in-out;
}
nav ul li:nth-child(1) {
  transition-delay: 0.3s;
}
nav ul li:nth-child(2) {
  transition-delay: 0.6s;
}
nav ul li:nth-child(3) {
  transition-delay: 0.9s;
}
nav ul li:nth-child(4) {
  transition-delay: 1.2s;
}
nav ul li a {
  font-size: 1.5em;
  text-transform: uppercase;
  color: white!important;
  text-decoration: none;
  position: relative;
}
nav ul li a::before, nav ul li a::after {
  content: '';
  display: block;
  border-radius: 1.5px;
  height: 3px;
  width: 0;
  background-color: white;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  transition: width 250ms ease-in-out;
}
nav ul li a:hover::before, nav ul li a:hover::after {
  width: 20px;
}
nav ul li a::before {
  right: calc(100% + 10px);
  transform-origin: 100% 50%;
}
nav ul li a::after {
  left: calc(100% + 10px);
  transform-origin: 0% 50%;
}


.nav-active {
  opacity: 1;
}
.nav-active ul li {
  opacity: 1;
  transform: translateY(0);
}

.menu-toggle {
  z-index: 10;
  position: fixed;
  /*position:static;*/
  top: 20px;
  right: 4px;
  height: 40px;
  width: 40px;
  transition: all 250ms ease-in-out;
  /*background-color:red;*/
}
.menu-toggle:hover {
  cursor: pointer;
  /*
  background-color: rgba(0, 0, 0, 0.4);
  box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5);
  */
  transform: scale(1.05);
}

.menu-toggle-active {
  transform: rotate(45deg);
  border-radius: 50%;
}
.menu-toggle-active:hover {
  transform: rotate(45deg);
}
.menu-toggle-active .hamburger {
  width: 0;
  background-color:white!important;

}
.menu-toggle-active .hamburger::before {
  transform: translate(-11px, -10px) rotate(-90deg);
  background-color:white!important;
}
.menu-toggle-active .hamburger::after {
  transform: translate(2px, 0px);
  background-color:white!important;
}

.hamburger {
  margin-left:0px;
  margin-top: 15px;
  height: 3px;
  width: 26px;
  border-radius: 1px;
  background-color: #333333;
  transition: all 250ms ease-in-out;
}
.hamburger::before, .hamburger::after {
  content: '';
  display: block;
  height: 3px;
  width: 26px;
  border-radius: 1px;
  background-color: #333333;
  transition: all 250ms ease-in-out;
  transform-origin: 100% 50%;
}
.hamburger::before {
  transform: translateY(-10px);
}
.hamburger::after {
  transform: translateY(7px);
}


.tmodal .fa
{
  font-size:28px;
  padding-left:10px;
  padding-right:10px;
}


#evolveAcademy
{
  background-image:url('../images/bgTriangles.jpg');
  
  background-repeat:no-repeat;
  background-position:center center;
  background-size:cover;
}

.logoFullScreen
{
  padding-top:5px;
  width:100%;
}

.scroll-explore-invite
{
  position:relative;
  top:21vh;
  padding-top:30px;
  padding-bottom:60px;
  z-index:0;

  text-align:center;
  font-family:'Oswald', sans-serif;
  font-size:22px;
  color:white;
  text-shadow:2px 2px 2px rgba(0, 0, 0, 0.40);
}

.header
{
  background-color:white;
  background-color:rgba(255, 255, 255, 0.98);
  position:-webkit-sticky;
  position:sticky;
  top:0px;
  z-index:3;
  
  margin-bottom:20px;

  box-shadow:0px 2px 2px rgba(0, 0, 0, 0.20);

  padding-top:20px;
  padding-bottom:20px;
  font-size:26px;
}

.header .fa
{
  padding-right:11px;
}

.panelFrontTitle
{
  font-family:'Oswald', sans-serif;
  font-size:46px;
  color:white;
  text-align:center;
  text-shadow:2px 2px 5px rgba(0, 0, 0, 0.75);

  position:absolute;
  bottom:25px;
  width:100%;

  box-sizing:border-box;
  -moz-box-sizing:border-box;
  box-sizing:border-box;
  padding-right:15px;
  padding-left:15px;
}

.panelBackText
{
  position:absolute;
  top:30%;
  width:100%;
  text-align:center;

  box-sizing:border-box;
  -moz-box-sizing:border-box;
  box-sizing:border-box;
  padding-right:30px;
  padding-left:30px;
}

.footer a
{
  display:inline-block;
  margin-bottom:10px;
}

.footer .fa
{
  /*padding-right:6px;*/
  width:20px;
  font-size:110%;
}


#formLearner,
#formEmployer
{
  display:none;
}

input.text
{ 
  width:100%;
  height:45px;
  
  padding-left:12px;
  padding-right:12px;
  padding-bottom:0px;
  
  border:1px solid #DADADA;
  
  font-family:'Roboto', sans-serif;
  font-size:14px;

  margin-top:0px;
  margin-bottom:12px;
  
  -webkit-appearance:none;
  border-radius:0px 0px 0px 0px;
  -moz-border-radius:0px 0px 0px 0px;
  -webkit-border-radius:0px 0px 0px 0px;
}

select
{
  width:100%;
  height:45px;
  
  padding-left:12px;
  padding-right:12px;
  
  border:1px solid #DADADA;

  font-family:'Roboto', sans-serif;
  font-size:14px;
  
  margin-top:0px;
  margin-bottom:12px;

  -webkit-appearance:none;
  -moz-appearance:none;
  -ms-appearance:none;
  appearance:none;
  border-radius:0px 0px 0px 0px;
  -moz-border-radius:0px 0px 0px 0px;
  -webkit-border-radius:0px 0px 0px 0px;
  
  background-image:url("../images/arrow-select.svg");
  background-repeat:no-repeat;
  background-position:95% center;
  background-size:20px 20px;
}

input[type="submit"]
{
  cursor:pointer;
  display:inline-block;

  padding-top:8px;
  padding-bottom:8px;

  padding-left:30px;
  padding-right:30px;
  
  margin-bottom:15px;
    
  border-width:0px;
  
  font-family:'Oswald', sans-serif;
  font-size:16px;

  text-align:center;
  
  -webkit-appearance:none;
  border-radius:1px 1px 1px 1px;
  -moz-border-radius:1px 1px 1px 1px;
  -webkit-border-radius:1px 1px 1px 1px;

  transition:all 0.3s;
}
input[type="submit"]:hover
{
  color:white;

  opacity:0.95;
  filter:alpha(opacity=95); /* For IE8 and earlier */

  -webkit-box-shadow:0px 0px 10px rgba(0, 0, 0, 0.27);
  -moz-box-shadow:0px 0px 10px rgba(0, 0, 0, 0.27);
  box-shadow:0px 0px 10px rgba(0, 0, 0, 0.27);

  border-radius:5px 5px 5px 5px;
  -moz-border-radius:5px 5px 5px 5px;
  -webkit-border-radius:5px 5px 5px 5px;
}

textarea
{
  border:1px solid #DADADA;
  
  width:100%;
  height:150px;
  resize:none;

  padding-left:12px;
  padding-right:12px;
  padding-top:12px;
  padding-bottom:12px;

  margin-top:0px;
  margin-bottom:12px;  

  -webkit-appearance:none;
  border-radius:0px 0px 0px 0px;
  -moz-border-radius:0px 0px 0px 0px;
  -webkit-border-radius:0px 0px 0px 0px;
}

.button
{
  display:inline-block;
  
  padding-top:9px;
  padding-bottom:9px;
  
  padding-left:32px;
  padding-right:32px;
  
  margin-bottom:12px;
  
  color:white;
  
  font-family:'Oswald', sans-serif;
  font-size:17px;
  text-align:center;
  
  -webkit-appearance:none;
  border-radius:1px 1px 1px 1px;
  -moz-border-radius:1px 1px 1px 1px;
  -webkit-border-radius:1px 1px 1px 1px;
  
  transition:all 0.3s;
}
.button:hover
{
  color:white;

  opacity:0.95;
  filter:alpha(opacity=95); /* For IE8 and earlier */

  -webkit-box-shadow:0px 0px 10px rgba(0, 0, 0, 0.27);
  -moz-box-shadow:0px 0px 10px rgba(0, 0, 0, 0.27);
  box-shadow:0px 0px 10px rgba(0, 0, 0, 0.27);

  border-radius:5px 5px 5px 5px;
  -moz-border-radius:5px 5px 5px 5px;
  -webkit-border-radius:5px 5px 5px 5px;
}
.button:focus
{
  color:white;
}

.buttonOutline
{
  display:inline-block;
  
  padding-top:10px;
  padding-bottom:10px;
  
  padding-left:35px;
  padding-right:35px;
  
  margin-bottom:12px;
  
  color:white;
  
  font-family:'Oswald', sans-serif;
  font-size:22px;
  text-align:center;
  
  -webkit-appearance:none;

  border:2px solid white;
  border-radius:1px 1px 1px 1px;
  -moz-border-radius:1px 1px 1px 1px;
  -webkit-border-radius:1px 1px 1px 1px;
  
  transition:all 0.0s;
}
.buttonOutline:hover
{
  color:white;

  opacity:0.95;
  filter:alpha(opacity=95); /* For IE8 and earlier */

  -webkit-box-shadow:0px 0px 10px rgba(0, 0, 0, 0.27);
  -moz-box-shadow:0px 0px 10px rgba(0, 0, 0, 0.27);
  box-shadow:0px 0px 10px rgba(0, 0, 0, 0.27);

  border-radius:5px 5px 5px 5px;
  -moz-border-radius:5px 5px 5px 5px;
  -webkit-border-radius:5px 5px 5px 5px;
}
.buttonOutline:focus
{
  color:white;
}


.black
{
  color:#333333;
}

.blue
{
  color:#47BFDF;
}

.green
{
  color:#C6D54F;
}

.orange
{
  color:#EC6625;
}

.pink
{
  color:#E7428F;
}

.purple
{
  color:#6E3F91;
}

.red
{
  color:#D4232C;
}

.yellow
{
  color:#FFD518;
}


.bgBlack
{
  background-color:#161414;
  color:white;
}

.bgGreyED
{ 
  background-color:#EDEDED;
}
.bgGreyF6
{ 
  background-color:#F6F6F6;
}

.bgBlue
{
  background-color:#47BFDF;
  color:white;
}

.bgGreen
{
  background-color:#C6D54F;
  color:white;
}

.bgOrange
{
  background-color:#EC6625;
  color:white;
}

.bgPink
{
  background-color:#E7428F;
  color:white;
}

.bgPurple
{
  background-color:#6E3F91;
  color:white;
}

.bgRed
{
  background-color:#D4232C;
  color:white;
}

.bgYellow
{
  background-color:#FFD518;
  color:white;
}

.bgWhite
{
  background-color:white;
  color:#333333;
}


.display-table
{
  display:table;
}

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


img.center
{
  display:block;
  margin-left:auto;
  margin-right:auto;
}
.center
{
  text-align:center;
}
.leftText
{
  text-align:left;
}
.rightText
{
  text-align:right;
}


.no-gutter > [class*='col-']
{
  padding-right:0;
  padding-left:0;
}

.nopadding
{
  padding: 0 !important;
}

.padding15
{
  padding:15px;
}



.dcsns-toolbar
{
  margin-bottom:25px;
  font-size:15px;
}
.dcsns-toolbar .filter li a
{
  box-sizing:content-box;
  -moz-box-sizing:content-box;
  -webkit-box-sizing:content-box;
} 
.dcsns-toolbar .filter .link-all
{
  height:auto;
}
#social-stream
{
  margin-bottom:25px;
}

.stream li
{
  margin:0px 10px 20px 10px !important;
}