/* @import url('http://example.com/example_style.css'); */

@import url('//fonts.googleapis.com/css?family=Roboto:100,100i,300,300i,400,400i,500,500i,700,700i,900,900i');

@font-face {
  font-family: "ETmodules";
  font-style: normal;
  font-weight: normal;
  src: url("//cdn2.hubspot.net/hubfs/2336109/01-Learning-Jan2017-Image/font/modules.eot") format("embedded-opentype"),
  url("//cdn2.hubspot.net/hubfs/2336109/01-Learning-Jan2017-Image/font/modules.woff") format("woff"),
  url("//cdn2.hubspot.net/hubfs/2336109/01-Learning-Jan2017-Image/font/modules.ttf") format("truetype");
}

/**
 * CSS @imports must be at the top of the file.      
 * Add them above this section.                             
 */
 

 
 
/* ==========================================================================
   Navigation                                                
   ========================================================================== */
 
.lcom-acdmy-menu {
    margin:0 auto;
    text-align:center;
    margin-top:15px;
    
  
}

.menu-wrapper {
  float:left !important}

.lcom-acdmy-menu .hs-menu-wrapper > ul > li{
    margin:15px 10px;
    float:none !important;
    display:inline-block;
    font-size:17px;
}


.lcom-acdmy-menu .hs-menu-wrapper > ul > li > a{
    color:#999999;
    font-weight:700;
    position: relative;
    padding-bottom:3px;
    
}

.lcom-acdmy-menu .hs-menu-wrapper > ul > li > a:hover {
    color:#cccccc;
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
}

.lcom-acdmy-menu .hs-menu-wrapper > ul > li > a:before {
  content: "";
  position: absolute;
  width: 100%;
  height: 2px;
  bottom: 0;
  left: 0;
  background-color: #00a5e5;
  visibility: hidden;
  -webkit-transform: scaleX(0);
  -moz-webkit-transform: scaleX(0);
  transform: scaleX(0);
  -webkit-transition: all 0.3s ease-in-out 0s;
  -moz-webkit-transition: all 0.3s ease-in-out 0s;
  transition: all 0.3s ease-in-out 0s;
}

.lcom-acdmy-menu .hs-menu-wrapper > ul > li > a:hover:before {
  visibility: visible;
  -webkit-transform: scaleX(1);
  -moz-webkit-transform: scaleX(1);
  transform: scaleX(1);
}


/* Child List */
.hs-menu-children-wrapper {
    left:-100% !important;
}



.lcom-acdmy-menu .hs-menu-wrapper > ul ul{
    padding: 12px 0;
    background: #fff;
    -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}


.lcom-acdmy-menu .hs-menu-wrapper > ul ul li{
    padding: 0 12px;
    background:#fff;
    margin:0 auto;
}

.lcom-acdmy-menu .hs-menu-wrapper > ul ul li a{
    color:#999999;
    text-transform:uppercase;
    letter-spacing:1px;
    font-weight:700;
    font-size:14px;
    padding: 6px 12px;
    margin: 0;
    text-decoration: none;
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
}

.lcom-acdmy-menu .hs-menu-wrapper > ul ul li a:hover{
    background-color: rgba(0, 0, 0, 0.03);
    color:#00a5e5;
}

/* ==========================================================================
   Body/Content                                            
   ========================================================================== */
.main-content {
    margin-top:40px;
}

.resource-card {
    padding:20px 15px 20px;
    box-shadow: 0px 0px 15px #E5E5E5;
    border-radius: 5px;
    margin-top:12px;
    margin-bottom:12px;
    min-height: 375px !important;
}

.video-container {
    max-width:800px;
    margin:0 auto;
}

.embed-container {
    position: relative;
    padding-bottom: 56.25%;
    height: 0;
    overflow:auto;
    margin:0 auto;}
    
.embed-container iframe, .embed-container object, .embed-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    }
    
#leadinModal-176280 .leadin-button-primary {
    display:none !important;
    }


/* ==========================================================================
   Module Styling                                               
   ========================================================================== */
   
.blue-wrapper {
    width:100%;
    background:#00A5E5;
    padding:30px 0 30px;
    text-align:center;
}

.grey-wrapper {
    width:100%;
    background:#F4F4F4;
    padding:30px 0 30px;
    text-align:center;
}

.blue-wrapper::selection {
    color: #fff;
    background: #37C6FD !important;
    text-shadow: none;
}

.cta-center {
    text-align:center;
    margin:15px 0 15px;
}

.cta-content {
    margin:0 auto !important;
    max-width:600px;
    width:100% !important;
    float:none !important;
}


/* ==========================================================================
   Form                                           
   ========================================================================== */

.lcom-acdmy-form .input {
    margin-bottom:20px;
    font-weight:600 !important;
    border-radius:0;
    -webkit-appearance: none;
}

.hs-button.primary, body input[type="submit"] {
    width:100%;
    font-weight:bold !important;
    background:#00a5e5 !important;
    color:#fff !important;
    border-radius:0;
    -webkit-appearance: none;
    border-bottom: 6px solid #0d91bf !important;
    
}

.hs-button.primary:hover {
    border-bottom: 6px solid #00a5e5 !important;
    -webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    transition: all 0.2s;
}




/* ==========================================================================
   Typography                                              
   ========================================================================== */
 
h1, h2, h3, h4 {
     padding: 0 0 5px !important;
     margin: 0 0 2px !important;
 }
 
 /* ==========================================================================
   Media Queries                                            
   ========================================================================== */
 
 @media (max-width: 480px) {
     #login-cta {
         display:none;
     }
     
 }
 
 @media (max-width: 767px) {
     
    .resource-card {
        max-width:400px;
        margin:25px auto !important;
    }
    
    .lcom-acdmy-menu {
        max-width:350px;
        margin:0 auto !important;
        padding-top:25px;
    }
    
    .lcom-acdmy-menu .hs-menu-wrapper > ul > li{
        margin:10px 0px;
    }
    
    
    /* Child List */


    .lcom-acdmy-menu .hs-menu-wrapper > ul ul{
    background:none;
    -webkit-box-shadow: 0 0px 0px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 0 0px 0px rgba(0, 0, 0, 0.1);
    box-shadow: 0 0px 0px rgba(0, 0, 0, 0.1);
    }


    .lcom-acdmy-menu .hs-menu-wrapper > ul ul li{
        background:none;
    }

    .lcom-acdmy-menu .hs-menu-wrapper > ul ul li a{
    color:#C3C3C3;
    text-transform:uppercase;
    letter-spacing:1px;
    font-weight:700;
    font-size:14px;
    padding: 6px 12px;
    margin: 0;
    text-decoration: none;
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
    }

    .lcom-acdmy-menu .hs-menu-wrapper > ul ul li a:hover{
        background-color:none;
        color:#00a5e5;
    }
     
 }