body {font-family: 'Roboto', sans-serif; }

body * { scroll-margin-top: 190px; }

h1, h2, h3, h4, h5, h6, footer { font-family: 'Montserrat', sans-serif;}
h3.title {font-weight: 600;}
h3.grey {
  color: #bcbec0;
}

.text-blue {color: #149fda; }
.text-green {color: #86c551; }
.text-yellow {color: #fce300; }
.text-red {color: #ef3a43; }

h3.light {
  font-size: 24px;
  font-weight: 200;
}

hr {border-top: 2px solid #bcbec0;}

a {color: #149fda !important; text-decoration: none;}
a.yellow-link:hover,
a:hover {color: #86c551 !important;}
.dark-link a, a.dark-link {color: #414042 !important;}
.dark-link a:hover, .dark-link:hover  {color: #149fda !important;}

button.btn-steps {background-color: #fce300; border-radius: 5px; padding: 7px 15px; margin-bottom: 15px; float:right;}
button.btn-steps:hover {background-color: #86c551;}
#challenge-steps-expand[aria-expanded="true"] .label-opened,
#challenge-steps-expand[aria-expanded="false"] .label-closed,
#steps-expand[aria-expanded="true"] .label-opened,
#steps-expand[aria-expanded="false"] .label-closed {display: inline-block;}

#challenge-steps-expand[aria-expanded="false"] .label-opened,
#challenge-steps-expand[aria-expanded="true"] .label-closed,
#steps-expand[aria-expanded="false"] .label-opened,
#steps-expand[aria-expanded="true"] .label-closed {display: none;}


a.btn-piper {
  padding: 10px 20px;
  border: 1px solid #15a1db;
  background-color: #f5f6f5;
  border-radius: 20px;
  font-size: .9em;
  font-weight: bold;
  margin: 10px 0 15px 0;
  display: inline-block;
}

a.btn-piper:hover {
  border: 1px solid #86c551
}

a.btn-blue {
  padding: 10px 20px;
  background-color: #149fda;
  color: #fff !important;
  border-radius: 20px;
  font-size: .9em;
  font-family: "Montserrat"
}

a.btn-blue:hover {
  background-color: #86c551;
}

.bg-blue { background-color: #149fda; }

.piper-rounded {border-radius: 15px;}

a.yellow-link {color: #fce300 !important; }


/*
#title-banner::before {
  content: '';
  display: block;
  height:      190px;
  margin-top: -190px;
  visibility: hidden;
} */

#title-banner h4 {
  color: #149fda;
  font-size: 20px;
  margin-bottom: 2px;
}

#title-banner h2 {
  font-size: 30px;
  font-weight: 600;
  margin-bottom: 40px
}

#title-banner .tab-btn {
  position: absolute;
  bottom:0;
}

#title-banner .tab-btn,
#title-banner .tab-group-btn,
#pills-tab .nav-link {
  padding:15px 20px;
  border-radius: 6px 6px 0 0;
  background-color:#e8e9ec;
  color: #000 !important;
}

#pills-tab .nav-item { padding:0; }

#title-banner .tab-btn.wood-btn,
#title-banner .tab-group-btn.wood-btn,
#pills-tab .nav-item .active {
  background-image: url("/?originalUrl=https%3A%2F%2Fteach.playpiper.com%2Fimg%2Fbg-btn-wood.png");
  background-repeat: no-repeat;
  -webkit-box-shadow: 3px -1px 5px 0px rgba(176,176,176,1);
  -moz-box-shadow: 3px -1px 5px 0px rgba(176,176,176,1);
  box-shadow: 3px -1px 5px 0px rgba(176,176,176,1);
}

#title-banner .tab-group-btn {
  margin-left: 5px;
}

#title-banner .tab-btn:hover,
#title-banner .tab-group:hover
 {padding-top: 25px;}

.tab-group {
  position: absolute;
  bottom:4%;
 }

 #pills-tab .nav-link:hover {background-color: #86c551!important;}

 .kit-tile h4 a {color: #414042 !important;}
  .kit-tile h4 a:hover {color: #86c551 !important;}

#pills-tab .nav-item { margin-left: 5px; }

.main-content {margin-top: 185px;}

.bg-light-gray { background-color: #f5f6f5; }

.page-content {margin-top: 30px;}

.tab-content {margin-top: 60px;}

.product-tag {margin-bottom: 10px;}

.product-tag span {
  border: 1px solid #ef3a43;
  color: #ef3a43;
  font-size: 10px;
  padding: 4px 7px;
  border-radius: 10px;
}

.kit-tile a {
  color: #212529;
  font-weight: bold;
  font-family: 'Montserrat', sans-serif;
  font-size: 18px;
}

.form-check-input:checked {
    background-color: #005cb9;
    border-color: #005cb9;
}

.kit-tile  hr {margin-top: 15px;}

#missons-selected {display: inline;}
.mission-count {margin-bottom: 20px;}

#title-banner .isbn {
  margin-bottom: 40px;
  font-size: 12px;
  color: #666;
}

.box-btn {
  padding: 20px;
  border-radius: 10px;
  color: #fff;
  min-height: 160px;
}

a .red-box-btn {background-color: #ef3a43}
a .gray-box-btn {background-color: #414042}
a .green-box-btn {background-color: #86c551}
a .blue-box-btn {background-color: #149fda}

a:hover .box-btn {border: inset 3px #fff;}

.pc-info-links i {
  font-size: 44px;
  color: #fff;
  margin-bottom: 8px;
}


.piper-accordion,
#accordionFiveE,
#accordionSensors .accordion-item,
#accordionPhases .accordion-item {border-radius: 10px; margin-bottom: 20px;}

.piper-accordion .accordion-body,
#accordionFiveE .accordion-body,
#accordionSensors .accordion-body,
#accordionPhases .accordion-body {padding: 25px 20px 35px 20px;}

#accordionSensors h5,
#accordionPhases h5 {
  font-size: 14px;
  font-weight: 600;
}

.piper-accoridion .accordion-button,
#accordionSensors .accordion-button,
#accordionPhases .accordion-button {
  background-color: #f5f6f5;
  border-radius: 7px;
  border: none;
}

.accoridion-yellow .accordion-button:hover,
#accordionFiveE .accordion-button:hover,
#accordionSensors .accordion-button:hover,
#accordionPhases .accordion-button:hover {
  background-color: #fce300;
}

.accoridion-yellow .accordion-button:not(.collapsed),
#accordionFiveE .accordion-button:not(.collapsed),
#accordionSensors .accordion-button:not(.collapsed),
#accordionPhases .accordion-button:not(.collapsed) {
  background-color: #fce300;
}

.accoridion-green .accordion-button:hover,
.accoridion-green .accordion-button:not(.collapsed) { background-color: #86c551;}

.accoridion-blue .accordion-button:hover,
.accoridion-blue .accordion-button:not(.collapsed) { background-color: #149fda; color: #fff;}

.accordion-red .accordion-button:hover,
.accordion-red .accordion-button:not(.collapsed) { background-color: #ef3a43; color: #fff }


.accordion-button::after {
  background-image:url("/?originalUrl=https%3A%2F%2Fteach.playpiper.com%2Fimg%2Ficon%2Fplus-solid.svg");
  background-size: 60%;
  background-position: center;
}

.accordion-button:not(.collapsed)::after {
  background-image:url("/?originalUrl=https%3A%2F%2Fteach.playpiper.com%2Fimg%2Ficon%2Fminus-solid.svg");
}


/* --- NAV --- */

.fixed-top {background-color: #fff;}

.fixed-top .container {margin-bottom: 30px;}

a.link-to-main {color: #969696 !important; margin-top: 5px; display: block}
a.link-to-main:hover {color: #149fda !important; }

#logo {
  max-width: 50%;
  width: 225px;
  display: inline-block;
  margin:15px 10px 10px 0;
}

.logo-link + h1 {
  display: inline-block;
  vertical-align: bottom;
  margin-bottom: 15px
}

.beta-tag {
  background-color: #f5f6f5;
  padding: 7px;
  font-size: .65em;
  font-weight: 400;
  color: #666;
  border-radius: 10px;
  top: -3px;
  position: relative;}

.nav-links  {margin:43px 0 10px; }
.nav-links a {
  text-decoration: none;
  font-weight: 500;
  display: inline-block;
}
.nav-item { margin-left:40px;}
.dropdown-toggle {font-size: 18px; color:#414042;}

.dropdown-menu {
  border-radius: 1px !important;
  border: none;
  -webkit-box-shadow: 2px 2px 5px 0px rgba(143,143,143,1);
  -moz-box-shadow: 2px 2px 5px 0px rgba(143,143,143,1);
  box-shadow: 2px 2px 5px 0px rgba(143,143,143,1);
}

.nav-links .dropdown-mega img { height:75px; margin-bottom: 15px; }


.dropdown-mega {
    font-size: 13px;
    padding: 25px 30px 30px 30px;
 }
 .simple-menu {padding-bottom: 20px;}
 .simple-menu a {margin-left: 20px;}

.dropdown-mega .col-6 {padding: 0 20px;}
.dropdown-mega h5 { font-size: 16px; font-weight: 600;}
.dropdown-mega a, .dropdown-menu a {margin-top: 10px; font-size: 15px;}
.dropdown-mega .left-col {border-right: 2px solid #e6e7e8;}

.color-divider {
  background: rgb(239,58,67);
  background: linear-gradient(90deg, rgba(239,58,67,1) 25%, rgba(252,227,0,1) 25%, rgba(252,227,0,1) 50%, rgba(134,197,81,1) 50%, rgba(134,197,81,1) 75%, rgba(20,159,218,1) 75%);
  height: 10px;
}

.mainsidenav {color: #999;}

.mainsidenav a {margin-bottom: 10px;}
.mainsidenav .sidenav-padding {padding-right: 20px;}

.sidenav {
  height: 100%;
  width: 0;
  position: fixed;
  z-index: 10000;
  top: 0;
  right: 0;
  background-color: #414042;
  overflow-x: hidden;
  transition: 0.5s;
  padding-top: 10px;
}

.sidenav-padding {padding: 8px 8px 0 32px;}
ol.sidenav-padding li {margin-left: 20px;}


.sidenav h3,
.sidenav h5  {
  color: #fff !important;
}

.sidenav h4 a::after {
  content: '\f0da';
  font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    text-decoration: inherit;
}

.sidenav h4 a[aria-expanded='true']::after {
  content: '\f0d7';
}

.sidenav ol {color: #fff;}
.sidenav a {
  text-decoration: none;;
  display: block;
  transition: 0.3s;
  color: #fff !important;
}

.sidenav li.active, .sidenav li.active a {color: #ef3a43 !important;}

.collapse[aria-expanded='true'] .caretDownIcon {
    transform: rotate(180deg);
}

.caretDownIcon {
    transition: all .3s linear;
}

.sidenav a:hover {
  color: #f1f1f1;
}

.sidenav .closebtn {
  color: #15a1db !important;
  margin-bottom: 20px;
  font-size: .9rem;
}

@media screen and (max-height: 450px) {
  .sidenav {padding-top: 15px;}
  .sidenav a {font-size: 18px;}
}

.top-page-banner {
    min-height: 300px;
    margin:0;
    padding: 190px 0 0;
}
.panel {padding: 60px 0 70px;}

.bg-grid {
  background-image:url("/?originalUrl=https%3A%2F%2Fteach.playpiper.com%2Fimg%2Fgrid-bg-sm.png");
  color: #fff;
}

.green-txt {color: #86c551;}

/*  --- INDEX PAGE ---- */

#home-banner {
    background-image: url("/?originalUrl=https%3A%2F%2Fteach.playpiper.com%2Fimg%2Fyellow-curve.svg");
    background-repeat: no-repeat;
    background-position: right bottom;
    background-size:375px auto;

}

.fancy-text {
  background-image: url("/?originalUrl=https%3A%2F%2Fteach.playpiper.com%2Fimg%2Fblue-quote-shape.png");
  background-repeat: no-repeat;
  background-size: 18px auto;
  padding: 20px 0 70px 35px;
  width: 75%;
}

.first-accordian {margin-top: 50px;}

.accordion {margin-bottom: 15px;}

.accordion-button {
  color: #000;
  font-weight: 600;
}

.accordion-button:not(.collapsed) {
  background-color: #f5f6f5;
  color: #000;
}

.accordion-buttom:focus {
  box-shadow:none !important;
  border-color:transparent;
}

.ed-forum-panel img {width:100%; max-width: 715px;}


.xped-tile {
    margin-bottom: 30px;
}


.white-box,
.gray-box {
  background-color: #f5f6f5;
  border-radius: 15px;
  padding: 20px 0;
  margin-bottom: 30px;
}

.white-box {
  background-color: #fff;
  color: #000;
}

.xped-title-tile {
  border-radius: 15px;
  background-repeat: no-repeat;
  background-size: cover;
  background-color: #000;
  padding: 15px;
}

.xped-title-tile div {
  text-align: center;
  background: rgba(256, 256, 256, .95);
  border-radius: 15px;
  padding: 50px 0;
}

.xped-title-tile h6 {
  font-size: .9rem;
    letter-spacing: .5px;
    color:#808285;
    margin-bottom: 2px;
}

.xped-tile-info {
  margin: 20px;
}

.xped-tile-info ol {
  padding-left: 1rem;

}

.xped-tile-info ol li::marker { color: #149fda;}

/* --- MAIN LANDING PAGES --- */

.xped-jump {margin-bottom:60px;}
.xped-jump h5 {margin-bottom: 20px;}

.xped-jump a {
  background-color: #149fda;
  color: #fff !important;
  padding: 7px 20px;
  border-radius: 50px;
  margin-right: 10px;
}

.xped-jump a:hover { background-color: #86c551; }

.xped-tile-inner {
  margin: 20px;
}

.equal-height-col .project-tile,
.equal-height-col .bg-light-gray {  height: 100% !important; }


.xped-tile .bg-light-gray, .xped-tile img {
  border-radius: 15px;
 }

.xped-products {
  margin: 15px 0 5px;
  font-size: 14px;
  color: #ef3a43;
  text-transform: uppercase;
  }
  .xped-products span {margin: 0 4px; }

  .mission-icons {font-size: 14px;}

  .req-products {
    width: 90px;
    margin-bottom: 20px;}


.xped-details .accordion-button {
  color: #149fda;
  text-align: center;
  display: block;
}

.xped-details .accordion-button span:before {
  content: "+ View"
}
.xped-details .show+.accordion-button span:before {
  content: "- Hide"
}

ol.misson-list {
  padding-left: 17px;
  margin-top: 5px;
}

ol.misson-list li::marker { color: #149fda; }


/*  --- GUIDE PAGES ---- */

#title-banner {
    padding: 190px 0 0;
    position: relative;
}

#guide-banner {
  /*margin:130px 0 50px;
  padding: 40px 0;*/
  padding: 50px 0 0;
  background-image:url("/?originalUrl=https%3A%2F%2Fteach.playpiper.com%2Fimg%2Fgrid-bg.png");
  color: #fff;
}

#guide-banner .details {
  text-align: center;
  margin-top: 30px;
  margin-bottom: 30px;
  font-size: 14px;
}

#guide-banner .details img { width: 80px;}
#guide-banner i, #guide-banner img {margin-bottom: 15px;}

#xped-details {
  background-color: #86c551;
  padding: 25px;
  border-radius: 10px;
  min-height: 210px;
  position: relative;
  top:30px;
  margin-top: -30px;
 }

.project-img-bg {
    background-repeat: no-repeat;
    background-size: 30%;
    background-position: -50px 20px;
}

.lesson-img-bg {
    background-repeat: no-repeat;
    background-size: 25%;
    background-position: 0 50px;
}

.mission-info {
  padding: 50px 0;
  margin-bottom: 50px;
  min-height: 330px;
}

.space-top {margin-top:40px !important; }

.mission-characters img {
  width: 100px;
  margin: 10px 0;
}


a.circle-link {
  color: #fff !important;
  background-color: #15a1db;
  border-radius: 50px;
  width: 100px;
  height: 100px;
  display: block;
  padding:15px 10px;
  margin-top:10px;
}

a.circle-link:hover {
  background-color: #86c551;
}


.sticky {
  position: relative;
  position: -webkit-sticky;
  position: sticky;
  top: 155px;
  overflow-y: scroll;
  max-height: 700px;
}

.sidebar a { display: block;}

.guide-links a {margin: 3px 0;}

.top-links {
  background-color: #149fda;
  border-radius: 12px;
  padding: 10px 10px 10px 20px;
  margin-bottom: 40px;
}

.top-links a {
  display: block;
  color: #fff !important;
  text-decoration: none;
  margin: 10px 0;
}

.top-links a:hover {color: #414042 !important;}

hr.guide-divider {
  border-top: 3px solid #fee300;
  margin: 50px 0 30px;
}

.guide-content, .page-content {margin-bottom:60px;}

.guide-content h3 {margin-top: 60px !important;  }



.guide-content h3 + iframe {margin-top: 30px;}

.mission-materials img {
  max-width:100%;
  max-height: 100px;
  display: block;
  margin-bottom: 20px;
  margin: 0 auto 20px;
}

.double-row-materials {margin-bottom: 40px;}

.guide-content b
{display: block;
margin-top: 20px;
margin-bottom: 5px;
}

.guide-content b.border-top {
  padding-top: 15px;
}

.guide-content #glossary-list b
{display: inline !important;
}

.guide-content .standards-list a {
  display: block;
  margin-bottom: 5px;
}

.guide-content ol,
.guide-content ul {
 padding-left: 1.2rem;
}

.guide-content ol>li {
  margin-top: 20px;
}

.guide-content .condensed-list > li {
  margin-top: 5px;
}

p.list-title {margin-bottom:0;}

.guide-content ul  {
   list-style: none;
}

.guide-content ul li::before {
  content: "\2022";
  font-size: 30px;
  line-height: 1em;
  color: #fee300;
  font-weight: bold;
  display: inline-block;
  width: 0.55em;
  margin-left: -.7em;
  position: relative;
  top: 5px;
}

.guide-content ol li::before {
  content: " ";
}

.guide-content ul ol>li {
   margin-top: 10px;
}

h3 + .btn-piper {
  display: inline-block;
  margin: 20px 0;
}

.blueprint-preview {
  max-width: 100%;
}

/*
#tutorialChallenge-steps + iframe,
#tutorial-steps + iframe {height: 500px !important;} */

.materials-library #button_exploded {max-height: 200px;}

.materials-library img {margin: 20px 0;}
.materials-library span {
  display:flex;
  height:100%;
  align-items:center;
}

.career-videos iframe {
  margin: 30px 0 10px;
  display: block;
}

.expandable {position: relative;z-index: 100;
display: inline-block; vertical-align: top;}

.expandable .expand-control {
    width: 45px;
    height: 45px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-5 -5 90 90' width='30' height='30'%3E%3Ccircle fill='%23fff' stroke-width='6px' stroke='%23d8d8d8' cx='40' cy='40' r='40'%3E%3C/circle%3E%3Cpath d='M30 25L40 15 50 25M55 30L65 40 55 50M50 55L40 65 30 55M25 50L15 40 25 30' fill='none' stroke-width='6px' stroke='%23d8d8d8'/%3E%3C/svg%3E") no-repeat 50%;
}

.expandable  .expand-control:hover {
background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-5 -5 90 90' width='30' height='30'%3E%3Ccircle fill='%23eee' stroke-width='6px' stroke='%23d8d8d8' cx='40' cy='40' r='40'%3E%3C/circle%3E%3Cpath d='M30 25L40 15 50 25M55 30L65 40 55 50M50 55L40 65 30 55M25 50L15 40 25 30' fill='none' stroke-width='6px' stroke='%23d8d8d8'/%3E%3C/svg%3E") no-repeat 50%;
    cursor: pointer}

.shrink-control {
    width: 45px;
    height: 45px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 80' width='30' height='30'%3E%3Ccircle fill='%23fff' stroke-width='5.5px' stroke='%23d8d8d8' cx='40' cy='40' r='35'%3E%3C/circle%3E%3Cpath d='M30 20L40 30 50 20M60 30L50 40 60 50M50 60L40 50 30 60M20 50L30 40 20 30' fill='none' stroke-width='5.5px' stroke='%23d8d8d8'/%3E%3C/svg%3E") no-repeat 50%;
  }
.shrink-control:hover  {  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 80' width='30' height='30'%3E%3Ccircle fill='%23eee' stroke-width='5.5px' stroke='%23c5c5c5' cx='40' cy='40' r='35'%3E%3C/circle%3E%3Cpath d='M30 20L40 30 50 20M60 30L50 40 60 50M50 60L40 50 30 60M20 50L30 40 20 30' fill='none' stroke-width='5.5px' stroke='%23c5c5c5'/%3E%3C/svg%3E") no-repeat 50%;
cursor: pointer;}

.qr {height: 150px;margin: 20px auto 10px;}

#expedition-resources {text-transform: uppercase;}

.iCan-box {background-color: #f5f6f5; border-radius: 12px; padding: 15px 30px 0 30px;}
.iCan-box img {max-width: 60%; display: block; margin-left: auto;}

/* PC GUIDES */

h3.fw-light + p, h3.fw-light + ul {margin-top: 20px;}


.project-img {
  width: 100%;
  margin-bottom: 20px;
}

.project-img + i {color: #888;}

.step-intro {background-color: #7cc24d; font-weight: 500; padding:10px;font-size: 16px; color: #fff; border-radius: 10px; position:relative; top: -5px;}
.step-img {width:100%; margin-bottom: 20px;}

.disclaimer {color: #888; font-style: italic; }
.disclaimer-sm {font-size: 13px; display: block; margin-top: 7px;}

.sticky.sidebar {margin-bottom: 60px;}

.download-previews {text-align: center; margin-top: 15px;}
.download-previews img, .guide-img img {width: 100%; margin-top: 10px;}
.download-previews .btn {
  background-color: #f5f6f5;
  border: 1px solid #149fda;
  margin-top: -20px;
  border-radius: 50px;
  padding: 10px 20px;
}

.download-previews .btn:hover {
  border: 1px solid #86c551;
}

.guide-img img {width: 100%; margin: 20px 0;}

.gorg-preview {
  max-width: 100%;
  border: 2px solid #f5f6f5;
}

.standards-box {padding: 10px 20px;}
.standards-table, .standards-box {background-color:#fff;}
.standards-table thead {background-color: #fce300; }
.standards-table, .standards-table td {border: 2px solid #f5f6f5; padding: 10px;}

.standards-accordian {margin-top: 30px;}
.standards-accordian button {font-weight: normal;}
.standards-accordian button:hover {background-color: #fce300;}
.standards-accordian-- .accordion-body {background-color: #414042;}

.modal-header {background-color: #f5f6f5;}
.modal-body img {width: 100%;}
.modal-body .btn-piper {display:inline-block; margin-bottom: 20px; }
.modal-body h3 {margin-top: 5px;}
.modal-box {margin: 20px 30px 30px 30px;}

.mode-box {padding: 30px 30px 40px 30px; text-align: center; }
.mode-box p {margin: 10px 0 30px;}

/* --- FOOTER --- */

.exped-bg {
  margin-top: 50px;
}

.index-bg,
.glossary-bg {
  width: 550px;
  display: block;
  margin-left: auto;
  }
.guide-bg {width: 100%;}

.footer-top {
  font-size: .8em;
  padding:30px 0;
  background-image:url("/?originalUrl=https%3A%2F%2Fteach.playpiper.com%2Fimg%2Fnone-bkg.png");
  background-repeat:no-repeat;
  background-position: bottom right;
  background-size: 50%;
}

.footer-top h6 {font-size: 14px; }

footer {
  background-color: #414042;
  font-size: 12px;
  color: #fff;
  padding: 20px 0;
}

footer a {
  color: #fff !important;
  display: inline-block;
  margin-right: 20px;
}

* {
    -webkit-print-color-adjust: exact !important;   /* Chrome, Safari 6 – 15.3, Edge */
    color-adjust: exact !important;                 /* Firefox 48 – 96 */
    print-color-adjust: exact !important;           /* Firefox 97+, Safari 15.4+ */
}


/* ---------- GLOSSARY ---------- */



#glossary-filter button:hover {
  border: 1px solid #414042;
}

button.filter-active, button.filter-active:hover {
    background-color: #fce300; }


.search-active { opacity: 40%;}
.btn:disabled {border:none;}

#glossary-list {
  /*min-height: 450px; */
  color: #414042
}

.terms {margin: 30px 0;}

.guide-content .terms {margin: 15px 0;}
{display: inline !important;
}


#glossary-list b {
  color: #000;
}
#glossary-list i {color: #ccc;}



/* -------- INFO PAGES ------------ */

b.content-heading { margin-top: 35px; }

#p5emodel h3,
#tips h3,
#teachbestpractices h3,
#measuringimpact h3 {
  margin-bottom: 30px;
}

#teachbestpractices h6 {
  font-size: 20px;
  margin: 30px 0 20px;
  text-transform: capitalize;
}

#teachbestpractices img {
  width: 100%;
  border-radius: 10px;
}

#teachbestpractices hr {
  margin: 30px 0 10px;
}

#measuringimpact .border {padding: 20px !important;}
#measuringimpact a.btn-blue {position: relative; top:10px;}
#measuringimpact h5 {margin: 30px 0 20px;}
#measuringimpact h5.text-red {margin:0 0 .5rem;}

.lg-icon-list {margin-bottom: 30px;}
.lg-icon-list li {
  font-size: 24px;
}
.lg-icon-list li p {
  font-size: 16px;
}

ul.checklist {
  padding-left: 20px;
  margin: 20px 0;
}

ul.checklist li {
  margin-bottom: 10px;

}

.playlist-header {
  padding:10px 0 0;
  color: #fff;
}

.playlist-labels {
  padding:5px 0;
  font-weight: bold;
  font-size: 13px;
  background-color: #efefef;
}

.playlist-item {
  padding: 10px;
}

.border.playlist-item {
  border-color: #efefef !important;
}

h4.project-title {
  text-transform: uppercase;
  font-weight: 600;
  margin-bottom: 15px;
}

.project-tile {
  padding: 20px 20px 0 20px;

}

.tile-list .equal-height-col {
    margin-bottom: 30px;
}

#collapseSGLevels .project-image {
    height: 50px;
    margin: 30px 0 20px -10px;
  }

.session-row {
  background-color: #fce300;
  padding: 10px 12px;
}


/* ---------- MOBILE ---------- */

@media screen and (max-height: 450px) {
  .container {padding: 0 30px;}
  .sidenav {padding-top: 15px;}
  .sidenav a {font-size: 18px;}
}

@media (max-width: 992px) {
  #guide-banner {
    padding-top: 30px;
  }
 }

@media (max-width: 768px) {
  .container {padding: 0 30px;}

  .top-page-banner {padding-top: 225px;}

  .panel {padding-bottom: 50px; }

  #guide-banner, #home-banner {
    padding-bottom: 30px;
  }

  #guide-banner {text-align:center;}

  #home-banner + .bg-grid {margin-bottom: 30px;}

  #xped-details {
    min-height: 110px;
    position:inherit;
    margin-top: 0;
    margin-bottom: 30px;
   }
  .mission-info {
    padding-top: 250px;
    background-size: auto 200px;
  }

  .project-guide.mission-info, .computer-guide.mission-info {padding-top: 30px;}
    .project-guide.mission-info .col-sm-9 {margin-top: 30px;}
    .computer-guide.mission-info {background-image:none !important;}
    .computer-guide.mission-info img {width: 100%; margin-bottom: 30px;}

  .details .col-2, .mission-characters {width: 33%;}
    .details .col-3 {width: 50%;}

  .top-links {padding: 10px;}
  .sticky {margin-bottom: 50px;}

  .footer-top h6 {margin-top: 30px;}

 .footer-top { padding-bottom: 40px}

  #title-banner  {
      padding-bottom: 20px;
  }
  #title-banner.has-tab-menu {padding-bottom: 0 !important;}

  #title-banner.computer-guide,
  #title-banner.project-guide  {
      padding-top: 225px;
  }

  .xped-jump a {display: inline-block; margin-bottom: 10px;}
  .step-intro {display: block; text-align: center;margin-bottom: 10px;}
  .kit-tile a {display: block;}
  .kit-tile i {display: inline-block; margin-left:-16px;}
  .computer-guide .mission-materials .col-sm-3 {margin-bottom: 30px;}

  .box-btn { min-height: inherit; }
  .pc-info-links {margin-bottom: 50px;}
  .pc-info-links a {margin-bottom: 15px; display: block;}
  #accordionPhases, #accordionSensors {margin-top: 30px;}



 }


 @media (max-width: 576px) {
   .nav-links  {text-align: center;}
    .nav-links a  { margin-bottom: 10px}

  }

  /* ---------- PRINT ---------- */


  @media print {

    .pagebreak {
      clear: both;
      page-break-before: always;
    }

    .mission-info {min-height: auto;}

  .bg-light-gray {background-color: transparent;}

  .container {max-width: 90% !important;}
  .fixed-top {position: static;   z-index: 1000;}
  .fixed-top .col-8 {width: 100%;}
  .fixed-top .container { margin-bottom: 15px; }

  #title-banner {padding: 0 !important;}

  #logo { margin:0 10px 10px 0; width:100px; }

  #guide-banner .details {text-align: left;}
  #guide-banner {padding:0;  min-height: auto; background:none; color:#000;}
  #guide-banner .col-lg-3 {width:40%;}
  #guide-banner .col-lg-9 {width:60%;}
  #guide-banner .col-lg-9 .details .col-2 {width:33%;}
  .mission-info {
    padding-top:185px;
    background-size: auto 140px;
    background-position-x: 40px;
  }

  .mission-info .text-center {text-align: left}

  .space-top {margin-top:20px !important; }
  .mission-characters img {width: 75px;}

  .guide-content ol>li {margin-top: 10px;}
  .guide-content h3 {margin-top: 45px !important;}

/*  #tutorial-steps + iframe {height: 800px !important;}   */

  /* #make-code-display { width: 200px; -webkit-transform:scale(0.5); -moz-transform-scale(0.5); }
  #make-wiring-display { height: 600px; -webkit-transform:scale(0.5); -moz-transform-scale(0.5);} */

  #title-banner {padding:0 0 15px 0;  min-height: auto;}

  .project-guide.mission-info { padding-top:30px; }
  .mission-info .project-img {width: 100px;}



  }