/*
======================================================================

         Copyright (C) 2016 Luke Froeb
         All rights reserved

         filename: lineRegressionMechanics
         description :  The first page for the Click&Learn Regression website.

         created by Shiming Xue at  08/12/2016 16:44:15

 ======================================================================
*/
html{
    background-color: #EAEAEE;
}
a,
a:hover,
a:focus {
  text-decoration: none;
  transition: all 0.3s;
}

.navbar {
  padding: 15px 10px;
  background: #fff;
  border: none;
  border-radius: 0;
  margin-bottom: 40px;
  box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.1);
}

.correct{
  color: Green;
}

.incorrect{
  color: Red;
}

.navbar-btn {
  box-shadow: none;
  outline: none !important;
  border: none;
}

.line {
  width: 100%;
  height: 1px;
  border-bottom: 1px dashed #ddd;
  margin: 40px 0;
}

#show_mean_line_checkbox {
  position: absolute;
  right: 0;
  z-index: 9999;
}


/* ---------------------------------------------------
    SIDEBAR STYLE
----------------------------------------------------- */

.wrapper {
  display: flex;
  align-items: stretch;
  height:100%
}

#sidebar {
  min-width: 380px;
  max-width: 380px;
  background: #696969;
  color: #fff;
  overflow-y: scroll hidden;
  overflow-x: hidden;
  top: 0;
  bottom: 0;
  transition: all 0.3s;
  margin-left: -380px;
  box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.2), 0 5px 5px 0 rgba(0, 0, 0, 0.24);
}

#sidebar a,
#sidebar a:hover,
#sidebar a:focus {
  color: inherit;
}

#sidebar.active {
  margin-left: 0px;
}

#sidebar .sidebar-header {
  padding: 20px;
  background: #808080;
}

#sidebar ul.components {
  padding: 20px 0;
  /* border-bottom: 1px solid #808080; */
}

.lesson-progress {
  float: right;
}

.exercise{
  color: #fff;
  padding: 10px;
  background: #808080;
  font-size: .9em;
}

#sidebar ul li a {
  padding: 10px;
  font-size: 1.5em;
  font-weight: 600;
  text-align: left;
  display: block;
  padding-left: 30px;
  text-decoration: none;
  border-bottom: 5px solid #808080;
  cursor:pointer;
}

#sidebar .instructions {
  text-align: center;
  font-size: 1.5em;
  font-weight: 600;
  margin: 10px;
}

#sidebar .lh {
  font-size: 1.5em;
  font-weight: 600;
}

#sidebar .text {
  padding: 15px;
}


#sidebar ul li p a {
  display: inline-flex;
  padding: 0px;
  padding-left: 0px;
  background: #778899;
  font-size: 1em;
  right:-20px;
}

#preface {
  background: #696969;
  padding: 15px;
  padding-top: 20px;
}

#preface div{
  margin-bottom: 10px;
}

#sidebar ul li a:hover {
  color: #7386D5;
  background: #fff;
}


a[data-toggle="collapse"] {
  position: relative;
}


ul ul a {
  font-size: 0.9em;
  padding-left: 20px;
  background: #808080;
}



ul.CTAs {
  padding: 20px;
}

ul.CTAs a {
  text-align: center;
  font-size: 0.9em !important;
  display: block;
  border-radius: 5px;
  margin-bottom: 5px;
}

a.download {
  background: #fff;
  color: #7386D5;
}

a.article,
a.article:hover {
  background: #778899 !important;
  color: #fff !important;
}

.tooltip {
    position: relative;
    display: inline-block;
    border-bottom: 1px dotted black;
}

.tooltip .tooltiptext {
    visibility: hidden;
    width: 120px;
    background-color: black;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 5px 0;

    /* Position the tooltip */
    position: absolute;
    z-index: 1;
}

.tooltip:hover .tooltiptext {
    visibility: visible;
}

.canvas-contianer {
    height: 400px;
    border: 1px solid #ddd;
}

.canvas-container {
    height: 400px;
    border: 1px solid #ddd;
}


.borderdiv-radio {
    border: 1px solid #ddd;
    margin-bottom: 2px;
}


.centerEverything{
    text-align: center;
}


.borderdiv{
    border: 1px solid #ddd;
}

.btn{
  background: #337ab7;
  color: #fff;
  font-size:12px !important;
  font-weight:400;
}
.btn:hover{
  color:#fff !important;
  background-color:#286090;
  border-color:#204d74;
}

.btn-active{
  color:#fff !important;
  background-color:#286090;
  border-color:#204d74;
}

/* button{
   color:#428bca;background-color:#fff;
} */

fieldset.scheduler-border {
    border: 1px groove #ddd !important;
    padding: 0 1.4em .5em 1.4em !important;
    margin: 0 0 1.5em 0 !important;
    -webkit-box-shadow:  0px 0px 0px 0px #000;
            box-shadow:  0px 0px 0px 0px #000;
}
legend{
  margin-bottom: 5px!important;
}
legend.scheduler-border {
    font-size: 1.2em !important;
    font-weight: bold !important;
    text-align: left !important;
    width:auto;
    padding:0 10px;
    border-bottom:none;
}
#cbxAltLineEqua{
  /* margin-left:10px; */
}
body > div > div.container.left-container > div:nth-child(3) > div.col-xs-3.column > div:nth-child(5) > div > fieldset > label{
  margin-left:15px;
  font-weight:400;
}
.btn-group a{
  height:65px;
}

#sr, #du{
  padding-top: 15px
}
.form-select{
  border: 1px groove #ddd;
  padding: 25px 1px 15px 15px;
}
.form-select-label{
  position:relative;
  top:10px;
  left:10px;
  background:white;
  width:fit-content;

  font-size: 1.2em !important;
  font-weight: bold !important;
  text-align: left !important;
  padding:0 10px;
  border-bottom:none;

}
#announcement{
  position:fixed;
  display:none;
  width:400px;
  left: calc(50% - 200px);
  text-align:center;
  height: 150px;
  line-height: 150px;
  top: calc(50% - 150px);
  background:white;
  border: 1px solid black;
  z-index:10;
  font-size:22px;
  border-radius: 4px;
  box-shadow:0 3px 15px 2px;
}


#userStatsTable {
  border-collapse: separate;
  border-spacing: 0;
  border: none;
  width: 100%;
}
#userStatsTable th, #userStatsTable td {
  border: none;
  padding: 5px 10px 5px 10px !important;
  width: 50%;
  text-align: left !important;
}
#userStatsTable th {
  padding-bottom: 10px;
  border-bottom: 1px solid #ccc;
  margin-bottom: 10px;
}

#userStatsButton {
  position: absolute;
  right: 0px;
  top: -50px;
  width: 100px;
}