/*
Theme Name: OpenSCAD 2020
Theme URI: http://openscad.com
Description: Theme for OpenSCAD
Author: maxwell.codes
Author URI: http://maxwell.codes/
Version: 1.0
*/

html, body {
  margin: 0;
  padding: 0;
}
body {
  font-family: 'Montserrat', sans-serif;
  color: #535353;
  font-size: 16px;
  font-weight: 400;
  letter-spacing: 0;
  background: #f4f4f4;
}

nav {
  //min-height: 5rem;
  line-height: 1rem;
}

.navbar-brand {
  font-weight: 400;
  //font-size: 1rem;
  font-size: 1.4rem;
}

.nav-link {
  font-size: 0.9rem;
}

.nav-tabs .nav-item {
  padding-bottom:0px;
  line-height:1.5;
}

.nav-tabs .nav-link {
  font-weight: 400;
  background: rgba(255,255,255,0.5);
  color: #000;
  text-transform: uppercase;
  border-radius: 2px;
  margin: 0px 0.25rem;
}


#navbar li.hover .nav-link span, #navbar li .nav-link:hover span {
  border-bottom:2px solid #fff;
}

#navbar li.hover.active .nav-link span, #navbar li.active .nav-link:hover span {
  border-bottom:2px solid #ffea4f;
}

#sub-navbar li:hover .nav-link span {
  border-bottom:2px solid #fff;
}

#navbar li.accent {
  padding-left: 20px;
}

#navbar li.accent .nav-link:hover span {
  border-bottom:none;
}


#navbar li.accent .nav-link {
}

#navbar li.accent .nav-link span {
  background: #fff;
  color: #2ac87c;
  text-transform: uppercase;
  border-radius: 2px;
  padding-left: 20px;
  padding-right: 20px;
  font-weight: 700;
  transition: all 0.43s;
  padding-top:10px;
  padding-bottom:10px;
}

#navbar .accent:hover .nav-link span {
  box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.18);
  cursor: pointer;
}

#navbar li.accent.active .nav-link span {
  background:#ffea4f;
  color:#000;
}

ul.sub-menu {
  display: none;
}

.nav-container {
  position: relative;
}


#sub-navbar ul.nav {
  position: absolute;
  left: 0;
  bottom: -30px;
  padding: 0px;
  margin: 0px;
  display: block;
  text-align: right;
}

#sub-navbar ul.nav li, #sub-navbar ul.nav li a {
  display: inline;
  background: #11a060;
  margin-left: -5px;
}

#sub-navbar ul.nav li a {
  padding: 10px 15px;
  margin: 0px;
  font-size: 14px;
  color: #fff;
}

.page-numbers {
  padding-right:0.5rem;
  font-weight:600;
}

.page-numbers.current {
  font-weight:300;
}


.page h2 {
  line-height:1.5;
  color: #535353;
  font-size: 1.25rem;
  font-weight: 700;
  letter-spacing: 1.12px;
  margin-bottom: 1.25rem;
  margin-top: 2rem;
  text-transform: uppercase;
}

.page h3, .page h4 {
  padding-bottom: 1rem;
}

.menu h3 {
  padding-bottom: 0px;
}


.page p {
  color: #535353;
  font-family: Montserrat;
  font-size: 1rem;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.75rem;
}

.page .entry p {
  font-weight:300;
}

.box p {
  line-height:1.5rem;
}

.box ul li {
  font-weight:300;
  line-height: 1.25rem;
  padding-bottom: 0.5rem;
}

small, p.small {
  font-size: 80%;
  font-weight: 400;
  line-height: 1rem;
}

.arrow-up {
  width: 10px;
  height: 10px;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-bottom: 10px solid #11a060;
}


.bg-grey .arrow-up {
  width: 15px;
  height: 15px;
  border-left: 15px solid transparent;
  border-right: 15px solid transparent;
  border-bottom: 15px solid #f4f4f4;
  text-shadow: 0 0 20px black;
}

.arrow-down {
  width: 5px;
  height: 5px;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 5px solid #2ac87c;
}

.bg-green .arrow-down {
  width: 15px;
  height: 15px;
  border-left: 15px solid transparent;
  border-right: 15px solid transparent;
  border-top: 15px solid #2ac87c;
  text-shadow: 0 0 20px black;
}

a {
  color: #2ac87c;
}
a:hover {
  color: #2ac87c;
}

.hyphen {
  display: none;
}

.navbar-default .navbar-nav .nav-link {
  color: #fff;
  font-weight: 400;
}

.navbar-default .navbar-nav .active>.nav-link, .navbar-default .navbar-nav .nav-link.active, .navbar-default .navbar-nav .nav-link.show, .navbar-default .navbar-nav .show>.nav-link {
  color: #ffe94f;
}

.navbar-expand-md .navbar-nav .nav-link, .navbar-expand-lg .navbar-nav .nav-link {
  padding-right: 1rem;
  padding-left: 1rem;
}

.box {
  //box-shadow: 0 5px 20px 0 rgba(0, 0, 0, 0.33);
}

.shadow {
  box-shadow: inset 0 5px 0px 0 rgba(0, 0, 0, 0.18);
}

.line-height-1 {
  line-height: 1;
}

.line-height-1-2 {
  line-height: 1.2;
}

.superbold {
  font-weight: 900;
}

.bg-green a {
  color: #fff;
}

.bg-green p {
  color: #000;
}

.bg-green hr {
  border-top: 1px solid #ffea4f;
}

.bg-green a button {
  color: #fff;
}

.bg-green a button:hover span, .bg-green a button:focus span {
  color: #fff;
  border-bottom: 1px solid #fff!important;
}

.bg-green .navbar-toggler {
  color: rgba(255,255,255,1);
  border-color: rgba(255,255,255,0);
}

.bg-green .navbar-toggler-icon {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255,255,255, 1)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}

.bg-black {
  background: #1d1e21;
  color: #fff;
}
.bg-black a {
  color: #fff;
}

.bg-black a button {
  color: #fff;
}
.bg-black a button:hover span {
  color: #fff;
  border-bottom: 1px solid #fff!important;
}

.content {
  background: #fff;
  //margin-bottom: 30px;
  //padding-top: 100px;
}

.content.page {
  //padding-top: 100px;
}

.ad {
  margin: 40px 0px;
}

.sidebar, .sidebar a {
  color: #555;
}
.page hr, .sidebar hr {
  padding: 0px;
  border: 1px solid #2ac87c;
}
.page hr {
  margin: 0px 0px 30px 0px;
}

.sidebar ul {
  padding-bottom:0px; margin-bottom:0px;
}

.sidebar hr {
  width: 100%;
  margin: 0px 0px 1rem 0px;
}
.sidebar li {
  font-size:1.125rem;
  line-height:1.75rem!important;
}

.sidebar h2 {
  padding:0px;
  margin:0px;
}

h1, h2, h3, h4, h5 {
  font-weight: 400;
  color: #231f20;
}
.bg-black h1, .bg-black h2, .bg-black h3, .bg-black h4, .bg-black h5 {
  color: #fff;
}

h1 {
  color: #333333;
  font-size: 2.5rem;
  font-weight: 700;
}


.home h1 {
  font-weight: 300;
  font-size: 40px;
  padding-top: 0px;
  padding-bottom: 20px;
  font-size: 3rem;
  font-weight: 900;
}

.home h1 strong {
  font-weight: 900;
  color: #2ac87c;
}


strong.green {
  color: #2ac87c;
}

strong.yellow {
  color: #ffea4f;
}

p.lead {
  letter-spacing: 100%;
  font-weight: 400;
  line-height: 150%;
  font-size: 1.2rem;
}

p.lead strong {
  color: #2ac87c;
}


.page h1 {
  font-size: 46px;
}
.page h2 {
  padding-bottom: 0px;
}

h2 {
  font-size: 36px;
  padding-bottom: 15px;
}
h3 {
  font-size: 25px;
  padding-bottom: 0px;
}


h4 {
  font-size: 22px;
  //text-transform: uppercase;
  //padding-top: 20px;
}

#page-learn h4 {
  color: #2ac87c;
}

#page-learn .tutorials h4 {
  color: #535353;
  font-size:1.2rem;
  font-weight:700;
}

#page-learn .tutorials a:hover {
  text-decoration:none;
}

#page-learn .tutorials section {
  height:300px;
}


#page-learn .tutorials section .img {
  opacity:0.8;
  transition: all 0.43s;
}

#page-learn .tutorials section:hover .img {
  opacity:1;
}

#page-learn .tutorials section:hover {
  box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.18);
}


#page-learn .tutorials p {
  font-weight:400;
  color:#2ac87c;
}

#page-learn .tutorials p.strong {
  font-weight:700;
}

h5 {
  font-size: 16px;
  color: #535353;
  font-weight: bold;
}

h6 {
  font-size:14px;
  color: #535353;
  font-weight: bold;
}

h5, h6 {
  margin-top: 1rem;
}

.subsection {
  margin-bottom: 2rem;
}

h2 {
  font-weight: 700;
  color: #535353;
}

hr {
  width: 50%;
  max-width: 200px;
}

hr.left {
  margin-left: 0px;
  margin-right: 0px;
}

section a:hover {
  text-decoration: none;
}



section p a:hover, section ul a:hover, section ol a:hover {
  text-decoration: underline;
}


#about h4 {
  color: #2ac87c;
  font-weight: 700;
  font-size: 1.2rem;
  text-transform: uppercase;
  padding-top: 10px;
}



.entry ul {
  padding-left: 0px;
  list-style-type: none;
}

.entry ul > li:before {
  content: "- ";
  text-indent: -5px;
}

.page p a, .page li a {
  font-weight: 400;
}

section.box {
  margin-bottom: 30px;
  padding: 2.25rem;
  background-color: #fff;
  box-shadow: 0 3px 8px 0 rgba(0,0,0,0.33);
  transition: all 0.43s;
}

.page section, .page .subsection {
  margin-bottom: 3rem;
}

section.box h2 {
  color: #535353;
  font-weight: 700;
}



nav.bg-green h1 {
  color: #fff;
}

.bg-green {
  background-color:#2ac87c!important;
  color: #333333;
}


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

.bg-green p.lead, .bg-black p.lead {
  letter-spacing: 1.5px;
  font-weight: 700;
}

strong {
  font-weight: 700;
}

h3 strong {
  font-weight: 800;
}

p strong {
  font-weight: bold;
}



.btn {
  width: 100%;
  //height: 4rem;
  border-radius: 3px;
  border: none;
  text-transform: uppercase;
  font-size: 14px;
  padding: 0.75rem 1.5rem;
  font-weight: 700;
  letter-spacing: 0;
  text-align: center;
  transition: all 0.43s;
  min-width: 220px!important;
  word-wrap: break-word;
}

#page-downloads .btn {
  margin-bottom: 0.75rem;
  margin-right: 0.5rem;
}

#page-downloads section.box h2 {
  color: #333;
}


.btn.yellow-fill {
  background-color: #ffea4f;
  color: #333333;
  border: 1px solid #ffea4f;
}

footer .btn {
  box-shadow: 0 3px 8px 0 rgba(0,0,0,0.33);
}

.btn.green-fill {
  background-color: #2BC87D;
  color: #333333;
  border: 1px solid #2BC87D;
}

.btn.white-fill {
  background-color: #fff;
  color: #333333;
  border: 1px solid #fff;
}

.btn.green-text {
  border: 1px solid #2BC87D;
  background-color: none;
  color: #2BC87D;
}

.btn.grey-text.active {
  background-color: #2BC87D;
  color: #fff;
  border: 1px solid #2BC87D;
}


.btn.grey-text {
  border: 1px solid #2BC87D;
  background-color: none;
  color: #333333;
}


.btn:hover {
  box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.18);
  cursor: pointer;
}

.btn.green-text:hover {
  background-color: #2BC87D;
  color: white;
}

.btn.grey-text:hover {
  background-color: #2BC87D;
  color: #333;
}


#page-downloads section .btn {
  min-width: 275px!important;
  width: auto;
}

#page-downloads .bg-green {
  color: #000;
}


#page-home footer {
  margin-top: -150px!important;
  padding-top: 150px!important;
}

#page-home footer .container {
  padding-top: 1rem!important;
  padding-bottom: 3rem!important;
}

#page-home footer .container .row {
  margin-bottom: 1.5rem!important;
  margin-top: 0px!important;
}



footer ul {
  padding-left: 0;
  list-style: none;
}

footer ul li {
  line-height: 1rem;
  padding-bottom: 1rem;
}


samp {
}

pre {
  padding: 15px;
  background: #f6f6f6;
  border: 1px solid #979797;
  border-radius: 3px;
  margin-bottom: 1rem;
}
pre code {
  font-size:0.75rem;
}
pre small code {
  font-size: 12px;
}

.instructions p {
  font-size: 12px;
}
.instructions ul {
  font-size: 12px;
  list-style: none;
  padding: 0px;
  margin: 0px;
  line-height: 160%;
}

/* FIXME: This was disabled to make links on the Community page green. Not sure why it was here (kintel) */
/* .page li a {
color: #6b747a;
}
*/

.page h1 a, .page h2 a, .page h4 a {
  color: #535353;
}
.page a:hover h1, .page a:hover h2, .page a:hover h4, .page a:focus h1, .page a:focus h2, .page a:focus h4 {
  color: #535353!important;
}

.page ol {
  padding: 0px;
  margin-bottom:0px;
  font-size:0.9rem;
}
.page ul {
   font-size:0.9rem;
}
.page ol li {
  font-weight: 400;
  line-height: 160%;
  padding-left: 20px;
  margin-left: 20px;
  color: #2ac87c;
  line-height:1.25;
  padding-bottom:0.75rem;
}
.page ol li a {
  color: #535353;
}
.page ol li i {
  color: #2ac87c;
}


.mobile {
  display: none;
}

.bg-green .btn, .bg-black .btn {
  border: 1px solid #fff;
}

.download-button {
  background: #2ac87c;
  color: #fff;
  text-transform: uppercase;
  border: 1px solid #2ac87c;
  padding: 10px;
  height: 59px;
  width: 245px;
  letter-spacing: 1px;
  margin-bottom: 20px;
  margin-right: 20px;
}
.download-button small {
  font-size: 10px;
  letter-spacing: 0.25px;
}


.shadow-box {
  padding: 2.25rem;
  background-color: #fff;
  box-shadow: 0 3px 8px 0 rgba(0,0,0,0.33);
  transition: all 0.43s;
}


.sidebar.box {
  padding: 1rem 1.5rem;
  background-color: #fff;
  box-shadow: 0 3px 8px 0 rgba(0,0,0,0.33);
  transition: all 0.43s;
}


.shadow-box h2 {
  color: #2ac87c;
}

.bg-yellow {
  background: #ffea4f;
  color: #333;
}

.bg-yellow h2 {
  color: #333;
}

.shadow-box p {
  font-weight: 400;
}

.shadow-box p strong {
  font-weight: 800;
}

.button-container {
  margin: 20px 0px;
}


.buttons {
  margin-bottom: 60px;
}

.buttons button, .buttons p {
  width: 100%;
  max-width: 275px;
  text-align: center;
}

#page-learn .buttons, #gallery .buttons {
  margin-bottom:inherit;
}

#page-learn .buttons button {
  max-width: 175px;
  min-width: 150px!important;
  margin-right:0.75rem;
  margin-bottom:0.5rem;
}

#page-downloads .button-container button.btn {
  width:100%!important; max-width:100%; min-width:auto!important;
}


#page-learn .tutorial-info {
  position:relative;
}

#page-learn .tutorial-info-inner {
  position:absolute; top:50%;
}

#gallery .buttons button {
  max-width: 200px;
  min-width: 150px!important;
  margin-right:0.75rem;  
  margin-bottom:0.5rem;
}

#gallery p {
  font-weight:400;
  line-height:1.25rem;
}

#gallery .gallery-info {
  position:absolute;
  width:100%;
  height:100%;
  background:rgba(0,0,0,0.7);
  top:0px;
  left:0px;
  opacity:0;
  transition: all 0.43s;
}

#gallery .gallery-info-inner {
  position:relative; top:50%;
}

#gallery .gallery-info p {
  color:#fee85d;
}

#gallery .gallery-info a {
  color:#fee85d;
}

#gallery .gallery-info a:hover {
  text-decoration:none;
}

#gallery .gallery-info a:hover u {
  text-decoration:none;
}

#gallery .gallery-item {
  position:relative;
}

#gallery .gallery-item:hover .gallery-info {
  opacity:1;
  text-decoration:none;
  cursor:pointer;
}


.buttons .text-left button {
  margin-right: 0px;
}
.buttons .right-left button {
  margin-left: 0px;
}

.buttons p.accent {
  font-weight: 300;
  font-size: 14px;
  letter-spacing: 1px;
  margin-bottom: 0px;
  padding-bottom: 0px;
}
.bg-green .buttons p.accent {
  color: #ffe94f;
}


.buttons button.accent {
  font-weight: normal;
}
.bg-green .buttons button.accent {
  background: #ffe94f;
  border: 1px solid #ffe94f;
  color: #8d7e17;
}


#samples {
  padding-bottom: 150px;
}

.bg-grey {
  background: #f4f4f4;
  color: #333333;
}

.bg-black .container .row {
  margin-top: 0px;
}

.bg-black .container .row h2 {
  margin-top: 120px;
}



.no-padding {
  padding: 0px;
}

div.subsection {
  //margin: 40px 0px;
}

span.link:hover, span.link.active, span.link:focus {
  text-decoration: underline;
  cursor: pointer;
}

footer {
  background: #d7d7d7;
  font-size: 0.9rem;
  font-weight: 700;
  color: #6b6b6b;
}

footer .social-icons {
  margin-bottom: 40px;
  font-weight: 700;
  font-size: 16px;
  color: #323232;
}

footer a {
  color: #323232;
}

#search-menu {
  position: absolute;
  right: 0px;
  top: -20px;
  padding-right: 0px;
}

#search-menu.active {
  display: block;
}
#search-menu.inactive {
  display: none;
}

.sidebar {
  font-weight: 400;
  padding-top: 10px;
  margin-top: 10px;
}

.stuck {
  margin-top: 20px;
  position: fixed;
  top: 0;
}


.icon-envelop:before {
  content: "\e945";
}
.icon-facebook:before {
  content: "\ea90";
}
.icon-twitter:before {
  content: "\ea96";
}
.icon-github:before {
  content: "\eab0";
}

.github-ribbon {
  position: relative;
  right: -47px;
  float: right;
  margin-bottom: -59px;
}

.entry h5 span.icon {
    padding: 5px;
    margin-right: 5px;
    border-radius: 2px;
    background: #2ac87c;
    color: #fff;
}

@font-face {
  font-family: 'icomoon';
  src: url('./_/fonts/icomoon/icomoon.eot?mhmeyr');
  src: url('./_/fonts/icomoon/icomoon.eot?mhmeyr#iefix') format('rembedded-opentype'),
  url('./_/fonts/icomoon/icomoon.ttf?mhmeyr') format('truetype'),
  url('./_/fonts/icomoon/icomoon.woff?mhmeyr') format('woff'),
  url('./_/fonts/icomoon/icomoon.svg?mhmeyr#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
}

[class^="icon-"], [class*=" icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'icomoon' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}


@media only screen and (max-width : 1025px) {
  .navbar-expand-md .navbar-nav .nav-link, .navbar-expand-lg .navbar-nav .nav-link {
    padding-right: 0.8rem;
    padding-left: 0.8rem;
  }
}


@media only screen and (max-width : 992px) {
  
  .stuck {
    margin-top: 20px;
    position: relative;
    top: 0;
  }
  
  
  #navbar ul {
    margin-top:1rem;
    margin-left:-0.5rem
  }
  
  #page-learn .tutorials section {
    height:400px;
  }
  #sub-navbar ul, #sub-navbar .arrow-up {
    display: none!important;
  }
  
  #navbar li.accent {
    padding-left:0px;
    margin-top:1.5rem;
    margin-bottom:1rem;
  }
  
  /*
  #navbar .nav-link {
    font-size:0.9rem;
    padding-left:0.8rem;
    padding-right:0.8rem;
  }
    
  #navbar li.accent .nav-link span {
    padding-left: 0.5rem;
    padding-right: 0.5rem;
  }
  
  #navbar li.accent {
    padding-left:0px;
  }
  
  .navbar-brand {
    font-size:1.2rem;
  }
  */

}
/*

@media only screen and (max-width : 876px) {
  .navbar-expand-md .navbar-nav .nav-link {
    padding-left:0.75rem;
    padding-right:0.75rem;
  }
}

@media only screen and (max-width : 815px) {
  .navbar-expand-md .navbar-nav .nav-link {
    padding-left:0.6rem;
    padding-right:0.6rem;
  }
}

@media only screen and (max-width : 785px) {
  .navbar-expand-md .navbar-nav .nav-link {
    padding-left:0.5rem;
    padding-right:0.5rem;
  }
}

*/

@media only screen and (max-width : 767px) {

  #page-learn .tutorials section {
    height:auto;
    padding-bottom:2rem!important;
  }
  
  #page-learn .tutorial-info-inner {
    position:relative;
    top:0px;
    margin-top:0px!important;
  }
  
  .navbar-expand-md .navbar-nav .nav-link {
    padding-right:0;
    padding-left:0;
  }
  
  
  #navbar li.accent .nav-link {
    margin-top:5px;
    margin-bottom:5px;
  }
  
  #navbar li.accent .nav-link span {
    padding-left: 10px;
    padding-right: 10px;
    margin-top: 10px;
  }
  
  .shadow-box {
    //box-shadow: none;
    margin-left: 30px;
    margin-right: 30px;
  }
  
  
  .navbar-default .navbar-brand {
    //padding: 15px;
  }
  
  img.mobile {
    display: inline;
    margin-bottom: 20px;
  }
  .bg-black .container .row {
    text-align: center;
    padding-bottom: 80px;
    margin-top: 40px;
  }
  .bg-black .container .row h2 {
    margin-top: 20px;
  }
  .bg-black .container .row img.macbook {
    display: none;
  }
  .sidebar {
    //display: none;
  }
	
  .nav>li>a {
    position: relative;
    display: block;
  }
	
  .navbar-nav>li>a {
    line-height: 100%;
  }
	
  #search-menu {
    position: absolute;
    right: 20px;
    top: -30px;
    padding-right: 0px;
  }
  #navbar li.search {
    display: none;
  }

}

@media only screen and (max-width : 600px) {
  .buttons div.text-right {
    text-align: center;
  }
  .buttons div.text-left {
    text-align: center;
  }
  .buttons div {
    margin-bottom: 20px;
    display: block;
    float: none;
    clear: both;
    width: 100%;
  }
  .buttons p.accent {
    margin: 0px auto;
  }

}

@media only screen and (max-width : 380px) {
  .navbar-default .navbar-brand {
//    font-size: 20px;
  //  height: 80px;
  //  padding-top: 15px;
    //padding-bottom: 15px;
  }

}

@media only screen and (max-width : 352px) {
  .navbar-default .navbar-brand {
//    font-size: 20px;
  //  height: 70px;
    //padding-top: 25px;
    //padding-bottom: 25px;
  }

}