/*
Project: 16-17_3-10
Author: Richy Thomas
Pallette: Dark Blue: rgba(0,103,163,1) , Light Blue: rgba(0,105,165,1); , Orange: rgba(180,63,46,1);
*/

@import url('https://fonts.googleapis.com/css?family=Reenie+Beanie');


/* Screen #1 */

.column-header {
  background: #F5F5F5;
  border: 1px solid #CCC;
  padding: 20px;
}

.column-header h4 {
  margin: 0;
}

#activitySortableList div .swappableElement {
  background: #FFF;
  border: 1px solid #CCC;
  border-top: 0;
  cursor: move;
  display: block;
  font-size: 13px;
  height: 100%;
  margin-bottom: 15px;
  min-height: 462px;
  padding: 15px;
}

#activitySortableList div .swappableElement.ui-draggable-dragging {
  opacity: .8!important;
  border-top: 1px solid #CCC!important;
}

.activity-feedback p {
  display: none;
}

.activity-feedback .alert {
  margin: 20px 0 0 0;
}

#discussion-info {
  margin: 20px 0 0 0;
}

/* Screen #2 */

/* Clock */

.clock-container {
  margin-bottom: 20px;
}

.flip-clock-wrapper {
  width: 300px!important;
  margin: 0 auto!important;
}

.flip-clock-label {
  display: none;
}

.alert h4 {
  margin: 0;
  text-align: center;
}

#techniqeueCard, #extensionWord {
  margin: 20px 0 0 0
}


/* Notepad */

.notepad-wrapper {
  margin-top: 20px;
}

.notepad {
  background-color: #fff563;
  background-image: url("../../../images/lined-paper.png");
  border-radius: 6px;
  border: 1px solid #3d3c41;
}

.notepad header {
  background: #3d3c41;
  border-radius: 3px 3px 0 0;
  color: #FFF;
  padding: 10px;
  text-align: center;
  width: 100%;
}

.notepad header h3 {
  color: #FFF;
  font-size: 20px;
  margin: 0;
}

.notepad article {
  font-family: 'Reenie Beanie', cursive;
  font-size: 30px;
  padding: 15px;
}

.notepad article .note-entry {
  min-height: 400px;
}

.notepad article div:active, .notepad article div:focus {
   border: none;
   box-shadow: none;
   outline: none;
}

.active-note .notepad header h3 {
  font-size: 28px;
  line-height: 30px;
}

.active-note .notepad article {
  font-size: 60px;
}

#grid {
 width: 100%;
 height: 500px;
}

#grid .square {
width: 33.3%;
 height: 33.3%;
 float: left;
 background: #CCC;
 border: 1px solid #FFF;
}

#user-notes .notepad-container {
  margin-bottom: 20px;
}


/* Tablet */
@media(min-width: 768px){



}


/* Desktop */
@media(min-width:992px){

  #activitySortableList div .swappableElement {
    min-height: 300px;
  }

  .notepad-wrapper {
    margin-top: 0;
  }

}


/* Large Desktop */
@media(min-width:1200px){

  #activitySortableList div .swappableElement {
    min-height: 240px;
  }

}


/* Print */
@media print {


}