#graphTitle{
	text-align: left;
	color:white;
	margin-bottom: 4%;
}


/*.draggable {
    position: relative;
    z-index: 10;


	margin:2%;
    width:113.386px;
	height:28.347px;
   	background-color: #f4ac42;
   	color:#4d505b;
	text-align: center;
	line-height: 1.8em;
	font-family: 'Open sans', sans-serif;
	cursor: pointer;

    -ms-touch-action: none;
        touch-action: none;
}*/

.p {
	opacity: 0.8 !important; 

    font-family: 'Open Sans', sans-serif;
    color: #000;
}
	

.prayerDiv {
	 position: relative;
	  z-index: 5;
	background: rgba(255,255,255,2.9);
	width: 100%;
	 text-align:center; 
	
	  padding: 20px;
	  height: 670px;
	  
	
}
 .parag{
	  
	font-family: 'Open Sans', sans-serif;
	font-size:18px;
	font-weight:500;

    color: #fff;
	text-align:left;

	vertical-align: middle;
	padding: 1px;
	margin: 2px;
	height:20px;
	padding:10px;
	background:rgba(6,38,142,.7)
	/**background: rgba(255,255,255,.6);**/
	
	}
.prayerDiv  .bg{
	position: absolute;
	z-index: -1;
  	top: 0;
 	bottom: 0;
  	left: 0;
  	right: 0;

	background-image: url("../images/activity7/the-lords-prayer_bg.jpg");
	background-size: 100% 100%;
	background-repeat:no-repeat;
	opacity: .6;
      width: 100%;
    height: auto;

	/*opacity: 0.5;*/
    /*top: 2em;
    left: 170px;
    right: 0;*/

	margin-bottom: 120px;
}



.dropzone {
	float:right;
	margin:0 2px;
    overflow: hidden;
    /*padding: 7px 7px;*/
    color: #666;
    text-align: center;
    background: #ffffff;
    height: 100%;
	line-height: 16px;
	width:178px;
display:inline-block;
	
    transition: background .15s linear, border-color .15s linear;
}



/*
.dropzone1 {
	border: 1px;  border-color: #ffffff; border-style: solid;}
	.dropzone2 {
border: 0px;  border-color: #ffffff; border-style: solid;}

.dropzone3 {
	border: 0px;  border-color: #ffffff; border-style: solid;}
	
	.dropzone4 {
	border: 0px;  border-color: #ffffff; border-style: solid;}
		.dropzone5 {
	border: 0px;  border-color: #ffffff; border-style: solid;}
	
		.dropzone6 {
	border: 0px;  border-color: #ffffff; border-style: solid;}

		.dropzone7 {
	border: 0px;  border-color: #ffffff; border-style: solid;}
	
	*/

.dropzone.-drop-possible, .dropzone1.-drop-possible, .dropzone2.-drop-possible, .dropzone3.-drop-possible, .dropzone4.-drop-possible, .dropzone5.-drop-possible, .dropzone6.-drop-possible { background-color: #ff00ff;}

.dropzone.-drop-over, .dropzone1.-drop-over, .dropzone2.-drop-over, .dropzone3.-drop-over, .dropzone4.-drop-over, .dropzone5.-drop-over, .dropzone6.-drop-over{
    /*background: #999;*/
    color: #fff; }

.item {
	font-family: 'Open sans', sans-serif;
	font-size:16px;
	font-weight:500;
    position: relative;
    z-index: 10;
    width: 178px;
    margin: .25em;
    padding: 3px 0px;
    color: #ffffff;
    text-align: center;
    cursor:pointer;
    -ms-touch-action: none;
    touch-action: none;
	background:rgba(6,38,142,1.0)
}

#dragdocking{
	padding: 20px; border: thin; border-color:rgba(6,38,142,1.0); width:178px; border-style:dotted; margin-left:20px; background-color:#DDDBDB;
	}

h2.lp{	color:#fff;background:rgba(6,38,142,1.0); padding: 20px; margin-left:20px; border: thin; width: 200px; border-color:rgba(6,38,142,1.0);  border-style:dotted; margin-bottom:10px;margin-top:10px; }

#mbuttons{
	padding: 20px; margin-left:20px; border: thin; width: 178px; border-color:rgba(6,38,142,1.0);  border-style:dotted; margin-bottom:10px;margin-top:10px;
	}


#results {
  text-align: center;
  font-family: 'Open sans', sans-serif;
  color: white;
width: 179px;
  	background-color: #cf4858;
	padding:1.6% 0 1.6% 0;
	margin-top: 2%;

}
#checkBtn{
	cursor:pointer;
	text-align: center;
	font-family: 'Open sans', sans-serif;
	color:white;
	width:100%;

	
}
#resetBtn{
	cursor:pointer;
	text-align: center;
	font-family: 'Open sans', sans-serif;
	color:white;
	width:100%;

	
}



@media screen and (max-height: 800px) and (max-width:1280px) {
	.dropzone-wrapper {top:110px; }
	
	
}


@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) { 

.prayerDiv .bg {margin-bottom:240px;}

	.dropzone-wrapper {top:80px;
	}
#mbuttons { padding: 10px; margin-left:2px; border: thin; width:154px; border-color:rgba(6,38,142,1.0);  border-style:dotted; margin-bottom:10px;margin-top:10px;
	}
#dragdocking{
	padding: 10px; border: thin; border-color:rgba(6,38,142,1.0); width:160px; border-style:dotted; margin-left:1px; background-color:#DDDBDB;
	}


	  .draggable {width: 154px; 	font-size:14px;    padding: 4px 0px;}

#results {width:154px;}

.js-drop, .dropzone {width:152px;  height: 100%; }


 .parag{
	  
	font-family: 'Open Sans', sans-serif;
	font-size:13px;
	font-weight:500;

    color: #fff;
	text-align:left;

	vertical-align: middle;
	padding: 1px;
	margin: 2px;
	height:20px;
	padding:5px;
	background:rgba(6,38,142,.7)
	/**background: rgba(255,255,255,.6);**/
	
	}

	


}



@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) { 



#dragContainer {width:60%;}
.js-drag {display:inline-block}
	.dropzone-wrapper { top:250px;left:60px; }
	#mbuttons { padding: 10px; margin-left:2px; border: thin; width:140px; border-color:rgba(6,38,142,1.0);  border-style:dotted; margin-bottom:10px;margin-top:10px;
	}
#dragdocking{
	padding: 10px; border: thin; border-color:rgba(6,38,142,1.0); width:140px; border-style:dotted; margin-left:1px; background-color:#DDDBDB;
	}

 .draggable {width: 128px; 	height: 30px; font-size:14px;    padding: 3px 0px;}
 


.js-drop, .dropzone {width:128px;    height: 115%; vertical-align: middle;}

#results {width:140px;}

 .parag{
	  
	font-family: 'Open Sans', sans-serif;
	font-size:16px;
	font-weight:500;

    color: #fff;
	text-align:left;

	vertical-align: middle;
	padding: 1px;
	margin: 2px;
	height:30px;
	padding:5px;

	background:rgba(6,38,142,.7)
	/**background: rgba(255,255,255,.6);**/
	
	}
	
	   .prayerDiv {

	
	  padding: 2px;

	
}
.span_2_of_3{width:67.6%;}

.span_1_of_3 {width:25.3%;}
}