.buttonlarge {
	border-radius:3px;
	background-color: #1c87c9;
	border: none;color: white;
	padding: 20px 34px;
	text-align: center;
	text-decoration: none;
	display: inline-block;
	font-size: 20px;
	margin: 4px 2px;
	cursor: pointer;
}



.gridcontainer .title--preview {

    /*uncomment the next line to make all grid titles pink */
    /*color: pink;  */    

}



/* Text Styling */

.subheaders {
	padding-top:70px !important;
	font-size: 2.5em !important;
	padding-bottom:1px !important;
	line-height: 1.1em !important;
	color: rgb(80,80,80) !important;
}


.body-text {
padding-top:1px !important;
font-size:1.3em;
}




@media (max-width:670px) {

.subheaders {
	font-size: 28px !important;
	line-height: 1.1em !important;
	padding-top:10px !important;
	}
	
.body-text {
	padding-top:1px !important;
	font-size:1.2em !important;
	line-height:1.3 !important;;
	padding-left:3% !important;
	padding-right:3% !important;
	}

}




/* Header Styling */

#tophat-container1 {
	position:fixed !important;
	background-color : rgba(0, 0, 0, 0.86) !important;
}


.soundcite-loaded {
padding: 15px 15px 15px 15px !important;
}






/* Amr Table of Contenent Styling */

#toc_container {
    background: rgba(255, 250, 250, 0.88) none repeat scroll 0 0;
    border: 1px solid #aaa;
    display: table;
    font-size: 85%;
    font-family: arial;
    margin-bottom: 1em;
    width: auto;
    border-radius: 5px;
    padding:15px;
    position: fixed;
    top:100px;
    right:40px;
    display:none;
    

}


.toc_title {
    font-weight: 700;
    text-align: center;
}




#toc_container li, #toc_container ul, #toc_container ul li{
    list-style: outside none none !important;
}







/* Menu Styling */

.cbp-spmenu {
	/*background: #d9dad3;  */   /*commented by mhk on dec 25, 2018*/
	background:#67513bfa; /*with this change both internal and folder based links can live side by side... */
}


.cbp-spmenu h3 {
	background: #67513bfa;
	color: #efc5a4fa;
	padding-left:29px;
	font-family: "Benton Gothic Regular", "Helvetica Neue", Helvetica, Arial, sans-serif;
}


.menu-toc-item {
	background-color: #9a7958fa !important;
}


.cbp-spmenu a{

font-size:1.9em !important;

}






/*p .my-style medium left | Test */


.my-style {
    text-decoration:underline !important;
}



.love {
	/*padding: 0 .4rem !important;*/
	/*padding-right: 6rem !important;
	padding-top: 10px !important;  */
	padding-right: 5.9rem !important;
    padding-top: 11px !important;	
	animation: 5s heartThrob infinite !important;;
  }
  
  .love svg{
	height:1.2rem !important;
  }
  
  @-moz-keyframes heartThrob{
	10%{
		transform:scale(1.15)
	}
	20%{
		transform:scale(1)
	}
	40%{
		transform:scale(1.15)
	}
	60%{
		transform:scale(1);
		opacity: 0.5;
	}
  }
  @-webkit-keyframes heartThrob{
	10%{
		transform:scale(1.15)
	}
	20%{
		transform:scale(1)
	}
	40%{
		transform:scale(1.15)
	}
	60%{
		transform:scale(1);
		opacity: 0.5;
	}
  }
  @-o-keyframes heartThrob{
	10%{
		transform:scale(1.15)
	}
	20%{
		transform:scale(1)
	}
	40%{
		transform:scale(1.15)
	}
	60%{
		transform:scale(1);
		opacity: 0.5;
	}
  }
  @keyframes heartThrob{
	10%{
		transform:scale(1.15)
	}
	20%{
		transform:scale(1)
	}
	40%{
		transform:scale(1.15)
	}
	60%{
		transform:scale(1);
		opacity: 0.5;
	}
  }
  



/* Pull Quotes */

.sp_left-quote {
	/* color */
	border-top: 1px solid #dcc488;border-bottom: 1px solid #ddc489;color: #c8b27b;
	/* left/right & numbers */
	float: left !important;width: 20%;margin-left: 25%;margin-bottom: 1%;margin-top: 3%;margin-right: 2%;padding-bottom: 1%;padding-left: 2%;padding-right: 2%;padding-top: 1%;
	line-height: 2.3rem;text-align: left;
	font-weight: 500;
	font-size: 140%;
	font-family: Roboto, sans-serif;
}

.sp_right-quote {
	/* color */
	border-top: 1px solid #dcc488;
	border-bottom: 1px solid #ddc489;
	color: #c8b27b !important;
	/* left/right & numbers */
	float: right !important;
	width: 20%;
	margin-right: 25%;
	margin-bottom: 1%;
	margin-top: 3%;
	margin-left: 2%;
	padding-bottom: 1%;
	padding-left: 2%;
	padding-right: 2%;
	padding-top: 1%;
	line-height: 2.3rem;
	text-align: left;
	font-weight: 500;
	font-size: 140%;
	font-family: Roboto, sans-serif;
}

.sp_nofloat-quote {
	/* color */
	border-top: 1px solid #dcc488;
	border-bottom: 1px solid #ddc489;
	color: #c8b27b !important;
	/* left/right & numbers */

	width: 30%;
	margin-right: 35%;
	margin-left: 35%;
	padding-bottom: 1%;
	padding-top: 1%;
	padding-left: 1%;
	padding-right: 1%;
	line-height: 2.3rem;
	text-align: left;
	font-weight: 500;
	font-size: 140%;
	font-family: Roboto, sans-serif;
}


@media (max-width:670px) {

	.sp_left-quote {
	width: initial;
	margin-left:6%;
	margin-right:6%;
	}

	.sp_right-quote {
	width: initial;
	margin-left:6%;
	margin-right:6%;
	}
	
	.sp_nofloat-quote {
	width: initial;
	margin-left:6%;
	margin-right:6%;
	}

}


.quote-cite {
	padding-top:5px;
	opacity:0.6;
	font-size:80%
}
  
  
  
/* Inline Spans used in FMP */  
 
.sp_inline_span {
background:rgb(221, 217, 217);
padding:10px;
border-radius:5px;
display:block;
}

.sp_inline_span_arabic {
background:rgb(221, 217, 217);
padding:10px;
border-radius:5px;
display:block;
font-family:amiri;
direction:rtl;
line-height:2em;
}

.sp_inline_quote {
display: block;
width: 100%;
margin-left: initial;
margin-right: initial;
margin-top: 3%;
margin-bottom: 3%;
padding-top: 2%;
padding-bottom: 2%;
border-top: 1px solid #dcc488;
border-bottom: 1px solid #ddc489;
color: #c8b27b !important;
padding-left: 2%; 
padding-right: 2%; 
font-weight: 400; 
font-size: 100%;
line-height: 1.6rem; 
text-align: left;
font-family: Roboto, sans-serif;
font-style:italic;
}

.sp_inline_quote_arabic {
display: block;
width: 100%;
margin-left: initial;
margin-right: initial;
margin-top: 3%;
margin-bottom: 3%;
padding-top: 2%;
padding-bottom: 2%;
border-top: 1px solid #dcc488;
border-bottom: 1px solid #ddc489;
color: #c8b27b !important;
padding-left: 2%; 
padding-right: 2%; 
font-weight: 400; 
font-size: 100%;
line-height: 3.6rem;
text-align: right;
font-family: Roboto, sans-serif;
font-family:amiri; 
direction:rtl;
}

.sp_inline_verse {
display: block;width: 100%;margin-left: initial;margin-right: initial;margin-top: 3%;margin-bottom: 3%;padding-top: 2%;padding-bottom: 2%;border-top: 1px solid #9e9e9e36;border-bottom: 1px solid #9e9e9e36;color: #117b24b8 !important;padding-left: 2%; padding-right: 2%; line-height: 1.6rem; text-align: left; font-weight: 400; font-style:italic; font-size: 1em; font-family: Roboto, sans-serif;
}

.sp_inline_verse_arabic {
display: block;width: 100%;margin-left: initial;margin-right: initial;margin-top: 3%;margin-bottom: 3%;padding-top: 2%;padding-bottom: 2%;border-top: 1px solid #9e9e9e36;border-bottom: 1px solid #9e9e9e36;color: #117b24b8 !important;padding-left: 2%; padding-right: 2%; line-height: 2.1em; text-align: right; font-weight: 400; font-size: 0.95em; font-family:amiri; direction:rtl;
}



