.dragula-parent {
  background-color: rgba(255, 255, 255, 0.2);
  margin: 50px 0;
  padding: 20px;
}
.actSearch{
  display: flex;
  padding: 10px;
  color: white;
  height: 50px; 
  align-items: center;
  left: 0%;
  top: 16%;
}
.actBox{
    position: fixed;
    transform: translateX(2%);
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
}
.searchBox{
  margin-right: 10px;
}
.gh-fork {
  position: fixed;
  top: 0;
  right: 0;
  border: 0;
}

/* dragula-specific example page styles */
.practice-timeline-container .dragula-container{
  background-color: white;
  position: relative;
}
.dragula-practice-group-container{
  width: 200px;
}

.dragula-container {
  background-color: rgba(0, 0, 0, 0.3);
  min-height: 51px;
}
.dragula-activity-container {
  padding: 5px;
}
.practice-container{
  overflow-y: scroll;
  height: -webkit-fill-available;
}
.activity-container{
  height: 500px;
  overflow-y: scroll; 
}
/*
 * note that styling gu-mirror directly is a bad practice because it's too generic.
 * you're better off giving the draggable elements a unique class and styling that directly!
 */
.dragula-container .practice-dragula-item {
  padding: 10px;
  background-color: #0F4B61;
  color: white;
  transition: opacity 0.4s ease-in-out;

  position: absolute;
  z-index: 10;
  width: 100%;
}
.dragula-container .activity-dragula-item{
  margin: 5px;
  padding: 10px;
  background-color: #0F4B61;
  color: white;
  transition: opacity 0.4s ease-in-out;
  height: 50px;
}
.gu-mirror:not(.dragula-container) {
  padding: 10px;
  background-color: #0F4B61;
  color: white;
  transition: opacity 0.4s ease-in-out;
  height: 50px;
}
.activity-dragula-item.gu-transit{
  margin: 0px;
}
.dragula-container div {
  cursor: move;
  cursor: grab;
  cursor: -moz-grab;
  cursor: -webkit-grab;
}
.gu-mirror {
  cursor: grabbing;
  cursor: -moz-grabbing;
  cursor: -webkit-grabbing;
}
.dragula-container .ex-moved {
  background-color: #e74c3c;
}
.dragula-container.ex-over {
  background-color: rgba(255, 255, 255, 0.3);
}
.handle {
  padding: 0 5px;
  margin-right: 5px;
  background-color: rgba(0, 0, 0, 0.4);
  cursor: move;
}

.practice-dragula-item-left{
  width: 50%;
  float: left;
}
.practice-dragula-item-right{
  width: 50%;
  float: left;
}
.activity-dragula-item-left{
  width: 50%;
  float: left;
}
.activity-dragula-item-right{
  width: 50%;
  float: left;
}
.pt-time-label{
  height: 51px;
  border-bottom: 1px solid #cdcdcd;
  border-right: 1px solid #cdcdcd;
}
.practice-timeline-container{
  background-color: white;
  color: #0F4B61;
  margin-left: 245px;
}
.pt-practice-header-color-spot{
  height: 17px;
  width: 17px;
  border-radius: 100%;
  margin: 0 auto;
}
.pt-activity-color-spot{
  height: 10px;
  width: 10px;
  border-radius: 100%;
  float: left;
  margin-top: 5px;
}
.groupName{
  overflow: hidden;
}
.pt-group-row{
  border-bottom: 1px solid #cdcdcd;
}

.pt-group-col-1{
  width: 100%;
  float: left;
}
.pt-group-col-2{
  width: calc(50% - 1px);
  border-right: 1px solid #cdcdcd;
  float: left; 
}
.pt-group-col-3{
  width: calc(33.3% - 1px);
  border-right: 1px solid #cdcdcd;
  float: left;  
}
.pt-group-col-4{
  width: calc(25% - 1px);
  border-right: 1px solid #cdcdcd;
  float: left;   
}
.pt-group-col-5{
  width: calc(20% - 1px);
  border-right: 1px solid #cdcdcd;
  float: left;
}
.pt-group-col-6{
  width: calc(16.6% - 1px);
  border-right: 1px solid #cdcdcd;
  float: left;
}
.pt-group-col-6.pt-group-no-border{
  border-right-width: 0px;
}
.pt-group-col-7{
  width: calc(14.2% - 1px);
  border-right: 1px solid #cdcdcd;
  float: left;
}
.pt-group-col-8{
  width: calc(12.5% - 1px);
  border-right: 1px solid #cdcdcd;
  float: left; 
}
.pt-group-col-9{
  width: calc(11.1% - 1px);
  border-right: 1px solid #cdcdcd;
  float: left;
}
.pt-group-col-10{
  width: calc(10% - 1px);
  border-right: 1px solid #cdcdcd;
  float: left; 
}
.pt-group-col-11{
  width: calc(9.1% - 1px);
  border-right: 1px solid #cdcdcd;
  float: left; 
}
.pt-group-col-12{
  width: calc(8.3% - 1px);
  border-right: 1px solid #cdcdcd;
  float: left; 
}
.pt-group-col-13{
  width: calc(7.69% - 1px);
  border-right: 1px solid #cdcdcd;
  float: left; 
}
.pt-group-col-14{
  width: calc(7.16% - 1px);
  border-right: 1px solid #cdcdcd;
  float: left; 
}
.pt-group-col-15{
  width: calc(6.66% - 1px);
  border-right: 1px solid #cdcdcd;
  float: left; 
}
.pt-group-col-16{
  width: calc(6.3% - 1px);
  border-right: 1px solid #cdcdcd;
  float: left; 
}
.pt-group-col-17{
  width: calc(5.8% - 1px);
  border-right: 1px solid #cdcdcd;
  float: left; 
}
.pt-group-col-18{
  width: calc(5.5% - 1px);
  border-right: 1px solid #cdcdcd;
  float: left; 
}
.pt-group-col-19{
  width: calc(5.2% - 1px);
  border-right: 1px solid #cdcdcd;
  float: left; 
}
.pt-group-col-20{
  width: calc(5% - 1px);
  border-right: 1px solid #cdcdcd;
  float: left; 
}

/* height = (num_minutes / 5 * 50) + (num_minutes / 5 - 1)
   These classes assume times can only be a multiple of 5.
   The extra few pixels on the end are for the borders. */ 
.pt-item-height-5{
  height: 50px;
}
.pt-item-height-10{
  height: 101px;
}
.pt-item-height-15{
  height: 152px;
}
.pt-item-height-20{
  height: 203px;
}
.pt-item-height-25{
  height: 254px;
}
.pt-item-height-30{
  height: 305px;
}
.pt-item-height-35{
  height: 356px;
}
.pt-item-height-40{
  height: 407px;
}
.pt-item-height-45{
  height: 458px;
}
.pt-item-height-50{
  height: 509px;
}
.pt-item-height-55{
  height: 560px;
}
.pt-item-height-60{
  height: 611px;
}
.pt-item-height-65{
  height: 662px;
}
.pt-item-height-70{
  height: 713px;
}
.pt-item-height-75{
  height: 764px;
}
.pt-item-height-80{
  height: 815px;
}
.pt-item-height-85{
  height: 866px;
}
.pt-item-height-90{
  height: 917px;
}
.pt-item-height-95{
  height: 968px;
}
.pt-item-height-100{
  height: 1019px;
}
.pt-item-height-105{
  height: 1070px;
}
.pt-item-height-110{
  height: 1121px;
}
.pt-item-height-115{
  height: 1172px;
}
.pt-item-height-120{
  height: 1223px;
}
.pt-item-height-125{
  height: 1274px;
}
.pt-item-height-130{
  height: 1325px;
}
.pt-item-height-135{
  height: 1376px;
}
.pt-item-height-140{
  height: 1427px;
}
.pt-item-height-145{
  height: 1478px;
}
.pt-item-height-150{
  height: 1529px;
}
.pt-item-height-155{
  height: 1580px;
}
.pt-item-height-160{
  height: 1631px;
}
.pt-item-height-165{
  height: 1682px;
}
.pt-item-height-170{
  height: 1733px;
}
.pt-item-height-175{
  height: 1784px;
}
.pt-item-height-180{
  height: 1835px;
}
.pt-item-height-185{
  height: 1886px;
}
.pt-item-height-190{
  height: 1937px;
}
.pt-item-height-195{
  height: 1988px;
}
.pt-item-height-200{
  height: 2039px;
}
.pt-item-height-205{
  height: 2090px;
}
.pt-item-height-210{
  height: 2141px;
}
.pt-item-height-215{
  height: 2192px;
}
.pt-item-height-220{
  height: 2243px;
}
.pt-item-height-225{
  height: 2294px;
}
.pt-item-height-230{
  height: 2345px;
}
.pt-item-height-235{
  height: 2396px;
}
.pt-item-height-240{
  height: 2447px;
}
.pt-item-height-245{
  height: 2498px;
}
.pt-item-height-250{
  height: 2549px;
}
.pt-item-height-255{
  height: 2600px;
}
.pt-item-height-260{
  height: 2651px;
}
.pt-item-height-265{
  height: 2702px;
}
.pt-item-height-270{
  height: 2753px;
}
.pt-item-height-275{
  height: 2804px;
}
.pt-item-height-280{
  height: 2855px;
}
.pt-item-height-285{
  height: 2906px;
}
.pt-item-height-290{
  height: 2957px;
}
.pt-item-height-295{
  height: 3008px;
}
.pt-item-height-300{
  height: 3059px;
}
.pt-item-height-305{
  height: 3110px;
}
.pt-item-height-310{
  height: 3161px;
}
.pt-item-height-315{
  height: 3212px;
}
.pt-item-height-320{
  height: 3263px;
}
.pt-item-height-325{
  height: 3314px;
}
.pt-item-height-330{
  height: 3365px;
}
.pt-item-height-335{
  height: 3416px;
}
.pt-item-height-340{
  height: 3467px;
}
.pt-item-height-345{
  height: 3518px;
}
.pt-item-height-350{
  height: 3569px;
}
.pt-item-height-355{
  height: 3620px;
}
.pt-item-height-360{
  height: 3671px;
}
.pt-item-height-365{
  height: 3722px;
}
.pt-item-height-370{
  height: 3773px;
}
.pt-item-height-375{
  height: 3824px;
}
.pt-item-height-380{
  height: 3875px;
}
.pt-item-height-385{
  height: 3926px;
}
.pt-item-height-390{
  height: 3977px;
}
.pt-item-height-395{
  height: 4028px;
}
.pt-item-height-400{
  height: 4079px;
}
.pt-item-height-405{
  height: 4130px;
}
.pt-item-height-410{
  height: 4181px;
}
.pt-item-height-415{
  height: 4232px;
}
.pt-item-height-420{
  height: 4283px;
}
.pt-item-height-425{
  height: 4334px;
}
.pt-item-height-430{
  height: 4385px;
}
.pt-item-height-435{
  height: 4436px;
}
.pt-item-height-440{
  height: 4487px;
}
.pt-item-height-445{
  height: 4538px;
}
.pt-item-height-450{
  height: 4589px;
}
.pt-item-height-455{
  height: 4640px;
}
.pt-item-height-460{
  height: 4691px;
}
.pt-item-height-465{
  height: 4742px;
}
.pt-item-height-470{
  height: 4793px;
}
.pt-item-height-475{
  height: 4844px;
}
.pt-item-height-480{
  height: 4895px;
}
.pt-item-height-485{
  height: 4946px;
}
.pt-item-height-490{
  height: 4997px;
}
.pt-item-height-495{
  height: 5048px;
}
.pt-item-height-500{
  height: 5099px;
}
.pt-item-height-505{
  height: 5150px;
}
.pt-item-height-510{
  height: 5201px;
}
.pt-item-height-515{
  height: 5252px;
}
.pt-item-height-520{
  height: 5303px;
}
.pt-item-height-525{
  height: 5354px;
}
.pt-item-height-530{
  height: 5405px;
}
.pt-item-height-535{
  height: 5456px;
}
.pt-item-height-540{
  height: 5507px;
}
.pt-item-height-545{
  height: 5558px;
}
.pt-item-height-550{
  height: 5609px;
}
.pt-item-height-555{
  height: 5660px;
}
.pt-item-height-560{
  height: 5711px;
}
.pt-item-height-565{
  height: 5762px;
}
.pt-item-height-570{
  height: 5813px;
}
.pt-item-height-575{
  height: 5864px;
}
.pt-item-height-580{
  height: 5915px;
}
.pt-item-height-585{
  height: 5966px;
}
.pt-item-height-590{
  height: 6017px;
}
.pt-item-height-595{
  height: 6068px;
}
.pt-item-height-600{
  height: 6119px;
}
.pt-item-height-605{
  height: 6170px;
}
.pt-item-height-610{
  height: 6221px;
}
.pt-item-height-615{
  height: 6272px;
}
.pt-item-height-620{
  height: 6323px;
}
.pt-item-height-625{
  height: 6374px;
}
.pt-item-height-630{
  height: 6425px;
}
.pt-item-height-635{
  height: 6476px;
}
.pt-item-height-640{
  height: 6527px;
}
.pt-item-height-645{
  height: 6578px;
}
.pt-item-height-650{
  height: 6629px;
}
.pt-item-height-655{
  height: 6680px;
}
.pt-item-height-660{
  height: 6731px;
}
.pt-item-height-665{
  height: 6782px;
}
.pt-item-height-670{
  height: 6833px;
}
.pt-item-height-675{
  height: 6884px;
}
.pt-item-height-680{
  height: 6935px;
}
.pt-item-height-685{
  height: 6986px;
}
.pt-item-height-690{
  height: 7037px;
}
.pt-item-height-695{
  height: 7088px;
}
.pt-item-height-700{
  height: 7139px;
}
.pt-item-height-705{
  height: 7190px;
}
.pt-item-height-710{
  height: 7241px;
}
.pt-item-height-715{
  height: 7292px;
}
.pt-item-height-720{
  height: 7343px;
}
.pt-item-height-725{
  height: 7394px;
}
.pt-item-height-730{
  height: 7445px;
}
.pt-item-height-735{
  height: 7496px;
}
.pt-item-height-740{
  height: 7547px;
}
.pt-item-height-745{
  height: 7598px;
}
.pt-item-height-750{
  height: 7649px;
}
.pt-item-height-755{
  height: 7700px;
}
.pt-item-height-760{
  height: 7751px;
}
.pt-item-height-765{
  height: 7802px;
}
.pt-item-height-770{
  height: 7853px;
}
.pt-item-height-775{
  height: 7904px;
}
.pt-item-height-780{
  height: 7955px;
}
.pt-item-height-785{
  height: 8006px;
}
.pt-item-height-790{
  height: 8057px;
}
.pt-item-height-795{
  height: 8108px;
}
.pt-item-height-800{
  height: 8159px;
}
.pt-item-height-805{
  height: 8210px;
}
.pt-item-height-810{
  height: 8261px;
}
.pt-item-height-815{
  height: 8312px;
}
.pt-item-height-820{
  height: 8363px;
}
.pt-item-height-825{
  height: 8414px;
}
.pt-item-height-830{
  height: 8465px;
}
.pt-item-height-835{
  height: 8516px;
}
.pt-item-height-840{
  height: 8567px;
}
.pt-item-height-845{
  height: 8618px;
}
.pt-item-height-850{
  height: 8669px;
}
.pt-item-height-855{
  height: 8720px;
}
.pt-item-height-860{
  height: 8771px;
}
.pt-item-height-865{
  height: 8822px;
}
.pt-item-height-870{
  height: 8873px;
}
.pt-item-height-875{
  height: 8924px;
}
.pt-item-height-880{
  height: 8975px;
}
.pt-item-height-885{
  height: 9026px;
}
.pt-item-height-890{
  height: 9077px;
}
.pt-item-height-895{
  height: 9128px;
}
.pt-item-height-900{
  height: 9179px;
}
.pt-item-height-905{
  height: 9230px;
}
.pt-item-height-910{
  height: 9281px;
}
.pt-item-height-915{
  height: 9332px;
}
.pt-item-height-920{
  height: 9383px;
}
.pt-item-height-925{
  height: 9434px;
}
.pt-item-height-930{
  height: 9485px;
}
.pt-item-height-935{
  height: 9536px;
}
.pt-item-height-940{
  height: 9587px;
}
.pt-item-height-945{
  height: 9638px;
}
.pt-item-height-950{
  height: 9689px;
}
.pt-item-height-955{
  height: 9740px;
}
.pt-item-height-960{
  height: 9791px;
}
.pt-item-height-965{
  height: 9842px;
}
.pt-item-height-970{
  height: 9893px;
}
.pt-item-height-975{
  height: 9944px;
}
.pt-item-height-980{
  height: 9995px;
}
.pt-item-height-985{
  height: 10046px;
}
.pt-item-height-990{
  height: 10097px;
}
.pt-item-height-995{
  height: 10148px;
}
.pt-item-height-1000{
  height: 10199px;
}
.pt-item-height-1005{
  height: 10250px;
}
.pt-item-height-1010{
  height: 10301px;
}
.pt-item-height-1015{
  height: 10352px;
}
.pt-item-height-1020{
  height: 10403px;
}
.pt-item-height-1025{
  height: 10454px;
}
.pt-item-height-1030{
  height: 10505px;
}
.pt-item-height-1035{
  height: 10556px;
}
.pt-item-height-1040{
  height: 10607px;
}
.pt-item-height-1045{
  height: 10658px;
}
.pt-item-height-1050{
  height: 10709px;
}
.pt-item-height-1055{
  height: 10760px;
}
.pt-item-height-1060{
  height: 10811px;
}
.pt-item-height-1065{
  height: 10862px;
}
.pt-item-height-1070{
  height: 10913px;
}
.pt-item-height-1075{
  height: 10964px;
}
.pt-item-height-1080{
  height: 11015px;
}
.pt-item-height-1085{
  height: 11066px;
}
.pt-item-height-1090{
  height: 11117px;
}
.pt-item-height-1095{
  height: 11168px;
}
.pt-item-height-1100{
  height: 11219px;
}
.pt-item-height-1105{
  height: 11270px;
}
.pt-item-height-1110{
  height: 11321px;
}
.pt-item-height-1115{
  height: 11372px;
}
.pt-item-height-1120{
  height: 11423px;
}
.pt-item-height-1125{
  height: 11474px;
}
.pt-item-height-1130{
  height: 11525px;
}
.pt-item-height-1135{
  height: 11576px;
}
.pt-item-height-1140{
  height: 11627px;
}
.pt-item-height-1145{
  height: 11678px;
}
.pt-item-height-1150{
  height: 11729px;
}
.pt-item-height-1155{
  height: 11780px;
}
.pt-item-height-1160{
  height: 11831px;
}
.pt-item-height-1165{
  height: 11882px;
}
.pt-item-height-1170{
  height: 11933px;
}
.pt-item-height-1175{
  height: 11984px;
}
.pt-item-height-1180{
  height: 12035px;
}
.pt-item-height-1185{
  height: 12086px;
}
.pt-item-height-1190{
  height: 12137px;
}
.pt-item-height-1195{
  height: 12188px;
}
.pt-item-height-1200{
  height: 12239px;
}
.pt-item-height-1205{
  height: 12290px;
}
.pt-item-height-1210{
  height: 12341px;
}
.pt-item-height-1215{
  height: 12392px;
}
.pt-item-height-1220{
  height: 12443px;
}
.pt-item-height-1225{
  height: 12494px;
}
.pt-item-height-1230{
  height: 12545px;
}
.pt-item-height-1235{
  height: 12596px;
}
.pt-item-height-1240{
  height: 12647px;
}
.pt-item-height-1245{
  height: 12698px;
}
.pt-item-height-1250{
  height: 12749px;
}
.pt-item-height-1255{
  height: 12800px;
}
.pt-item-height-1260{
  height: 12851px;
}
.pt-item-height-1265{
  height: 12902px;
}
.pt-item-height-1270{
  height: 12953px;
}
.pt-item-height-1275{
  height: 13004px;
}
.pt-item-height-1280{
  height: 13055px;
}
.pt-item-height-1285{
  height: 13106px;
}
.pt-item-height-1290{
  height: 13157px;
}
.pt-item-height-1295{
  height: 13208px;
}
.pt-item-height-1300{
  height: 13259px;
}
.pt-item-height-1305{
  height: 13310px;
}
.pt-item-height-1310{
  height: 13361px;
}
.pt-item-height-1315{
  height: 13412px;
}
.pt-item-height-1320{
  height: 13463px;
}
.pt-item-height-1325{
  height: 13514px;
}
.pt-item-height-1330{
  height: 13565px;
}
.pt-item-height-1335{
  height: 13616px;
}
.pt-item-height-1340{
  height: 13667px;
}
.pt-item-height-1345{
  height: 13718px;
}
.pt-item-height-1350{
  height: 13769px;
}
.pt-item-height-1355{
  height: 13820px;
}
.pt-item-height-1360{
  height: 13871px;
}
.pt-item-height-1365{
  height: 13922px;
}
.pt-item-height-1370{
  height: 13973px;
}
.pt-item-height-1375{
  height: 14024px;
}
.pt-item-height-1380{
  height: 14075px;
}
.pt-item-height-1385{
  height: 14126px;
}
.pt-item-height-1390{
  height: 14177px;
}
.pt-item-height-1395{
  height: 14228px;
}
.pt-item-height-1400{
  height: 14279px;
}
.pt-item-height-1405{
  height: 14330px;
}
.pt-item-height-1410{
  height: 14381px;
}
.pt-item-height-1415{
  height: 14432px;
}
.pt-item-height-1420{
  height: 14483px;
}
.pt-item-height-1425{
  height: 14534px;
}
.pt-item-height-1430{
  height: 14585px;
}
.pt-item-height-1435{
  height: 14636px;
}