@charset "UTF-8";
/* CSS Document */

/* roadmap css by Ryan McCoy */

@import url(http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300);

.clearBoth { clear: both; }

#roadmapPage #main.grid-8 {
/*width: 940px !important;*/
width: 1000px !important;
height: 1130px !important;
min-height: 1130px !important;
/*background: url('/wp-content/themes/mad/rmimages/gpic.jpg') no-repeat 0 0;*/
/*background: url('/wp-content/themes/mad/rmimages/roadpic.jpg') no-repeat 0 0;*/
background: url('/wp-content/themes/mad/imgs/roadpic2.jpg') no-repeat 0 0 !important;
position: relative;
}

#roadmapPage .main-inner {
padding: 10px 20px !important;
position: relative;
}

#CenterContent {
margin: 0;
/*padding: 0 30px;*/
/*width: 880px;*/
height: 600px;
position: absolute;
/*top: 265px;*/
padding: 0;
width: 940px;
top: 100px;
left: 0;
}

#InnerContentContainer {
position: relative;
}

#roadmapWheel {
/*float: right;*/
position: absolute;
top: 0;
left: 50%;
/*margin-left: -300px;*/
margin-left: -260px;
height: 600px;
width: 600px;
background: url('/wp-content/themes/mad/rmimages/roadmap600.jpg') no-repeat 0 0;
border: 0px;
     /* Safari 3-4, iOS 1-3.2, Android 1.6- */
    -webkit-border-radius: 300px; 
     /* Firefox 1-3.6 */
    -moz-border-radius: 300px; 
     /* Opera 10.5, IE 9, Safari 5, Chrome, Firefox 4, iOS 4, Android 2.1+ */
    border-radius: 300px;
    /* Prevent background color leak outs */
    -webkit-background-clip: padding-box; 
    -moz-background-clip: padding; 
    background-clip: padding-box;
-webkit-box-shadow: 0px 0px 30px rgba(255, 255, 255, 0.75);
-moz-box-shadow:    0px 0px 30px rgba(255, 255, 255, 0.75);
box-shadow:         0px 0px 30px rgba(255, 255, 255, 0.75);

}

#roadmapPage #boxes {
float: left;
display: none;
}

#topBox {
display: none;
position: absolute;
/*top: -190px;*/
bottom: -190px;
left: 50%;
background: #ddf2f7;
border: 4px solid #fff;
width: 600px;
height: 140px;
padding: 10px !important;
margin: 0 0 0 -300px;
font-size: 13px;
font-weight: 300;
font-family: 'Open Sans Condensed', sans-serif;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
-webkit-background-clip: padding-box;
-moz-background-clip: padding;
background-clip: padding-box;
-webkit-box-shadow: 0px 0px 10px rgba(107, 90, 90, 0.40), inset 0px 0px 10px rgba(90, 90, 90, 0.35);
-moz-box-shadow: 0px 0px 10px rgba(107, 90, 90, 0.40), inset 0px 0px 10px rgba(90, 90, 90, 0.35);
box-shadow: 0px 0px 10px rgba(107, 90, 90, 0.40), inset 0px 0px 10px rgba(90, 90, 90, 0.35);
}

#topBox span {
display: block;
margin-top: -5px;
}



#boxes ul {
margin: 34px 0 0 0;
padding: 0;
}

#boxes li {
background: #ddf2f7;
border: 4px solid #fff;
list-style: none;
width: 230px;
height: 90px;
padding: 10px !important;
margin-bottom: 20px;
font-size: 13px;
font-weight: 300;
font-family: 'Open Sans Condensed', sans-serif;
   /* Safari 3-4, iOS 1-3.2, Android 1.6- */
    -webkit-border-radius: 2px; 
     /* Firefox 1-3.6 */
    -moz-border-radius:    2px; 
     /* Opera 10.5, IE 9, Safari 5, Chrome, Firefox 4, iOS 4, Android 2.1+ */
    border-radius: 2px;
    /* Prevent background color leak outs */
    -webkit-background-clip: padding-box; 
    -moz-background-clip: padding; 
    background-clip: padding-box;

-webkit-box-shadow: 0px 0px 10px rgba(107, 90, 90, 0.40), inset 0px 0px 10px rgba(90, 90, 90, 0.35);
-moz-box-shadow:    0px 0px 10px rgba(107, 90, 90, 0.40), inset 0px 0px 10px rgba(90, 90, 90, 0.35);
box-shadow:         0px 0px 10px rgba(107, 90, 90, 0.40), inset 0px 0px 10px rgba(90, 90, 90, 0.35);

}

#boxes li.second {
padding-top: 17px !important;
width: 230px;
height: 83px;
}

#boxes li.fourth {
margin-bottom: 0px !important;
}

/* ****** modal action hover buttons ******* */
.HoverButton {
z-index: 70;
}

.HoverButton.UnderZ {
z-index: 65 !important;
}

.HoverButton.OverZ {
z-index: 75 !important;
}

/* Begin Here Button */

#BeginHereButton {
 position: absolute;
top: 2px;
left: 60px;
display: block;
 width: 128px;
height: 128px;


}

#BeginHereButton a {
 /*text-indent: -9999px;*/
 width: 120px;
height: 120px;
 display: table-cell;
background: #b7c9b7;
text-align: center;
vertical-align: middle;
cursor: pointer;
opacity: 1;
border: 4px solid #fff;
/*list-style: none;*/
/*padding: 10px !important;*/
text-align: center;
vertical-align: middle;
/*margin-bottom: 20px;*/
font-size: 18px;
line-height: 22px;
font-weight: bold;
color: #fff !important;
text-decoration: none;
text-shadow: 1px 1px 1px #888;
filter: dropshadow(color=#888, offx=1, offy=1);
font-family: 'Open Sans', sans-serif;
   /* Safari 3-4, iOS 1-3.2, Android 1.6- */
    -webkit-border-radius: 50%; 
     /* Firefox 1-3.6 */
    -moz-border-radius: 50%; 
     /* Opera 10.5, IE 9, Safari 5, Chrome, Firefox 4, iOS 4, Android 2.1+ */
    border-radius: 50%;
    /* Prevent background color leak outs */
    -webkit-background-clip: padding-box; 
    -moz-background-clip: padding; 
    background-clip: padding-box;

-webkit-box-shadow: 0px 0px 10px rgba(107, 90, 90, 0.40), inset 0px 0px 10px rgba(90, 90, 90, 0.35);
-moz-box-shadow:    0px 0px 10px rgba(107, 90, 90, 0.40), inset 0px 0px 10px rgba(90, 90, 90, 0.35);
box-shadow:         0px 0px 10px rgba(107, 90, 90, 0.40), inset 0px 0px 10px rgba(90, 90, 90, 0.35);

}

#BeginHereButton a:hover {
cursor: pointer;
background: #a6bca7;
opacity: 1;
-webkit-transition: background .25s ease-in-out;
-moz-transition: background .25s ease-in-out;
-o-transition: background .25s ease-in-out;
transition: background .25s ease-out;
}



/* New Story Button */
#NewStoryButton {
 position: absolute;
 width: 250px;
height: 99px;
background: transparent;
top: 18px;
/*left: 342px;*/
left: 382px;
}

#NewStoryButton a {
 text-indent: -9999px;
 width: 250px;
height: 99px;
 display: block;
cursor: pointer;
opacity: 0;
}

#NewStoryButton a:hover {
 width: 250px;
height: 99px;
 display: block;
cursor: pointer;
background: url('/wp-content/themes/mad/rmimages/NewStoryIcon.png') no-repeat 0 0;
opacity: 1;
-webkit-transition: opacity .25s ease-in-out;
-moz-transition: opacity .25s ease-in-out;
-o-transition: opacity .25s ease-in-out;
transition: opacity .25s ease-out;
}

/* Environment Button */
#EnviroButton {
 position: absolute;
 width: 140px;
height: 150px;
background: transparent;
top: 105px;
/*left: 210px;*/
left: 250px;
}

#EnviroButton a {
 text-indent: -9999px;
width: 140px;
height: 150px;
 display: block;
cursor: pointer;
opacity: 0;
}

#EnviroButton a:hover {
width: 140px;
height: 150px;
 display: block;
cursor: pointer;
background: url('/wp-content/themes/mad/rmimages/enviro_icon.png') no-repeat 0 25px;
opacity: 1;
-webkit-transition: opacity .25s ease-in-out;
-moz-transition: opacity .25s ease-in-out;
-o-transition: opacity .25s ease-in-out;
transition: opacity .25s ease-out;
}

/* Climate Protection Button */
#ClimateButton {
 position: absolute;
 width: 160px;
height: 200px;
background: transparent;
top: 305px;
/*left: 180px;*/
left: 220px;
}

#ClimateButton a {
 text-indent: -9999px;
width: 160px;
height: 200px;
 display: block;
cursor: pointer;
opacity: 0;
}

#ClimateButton a:hover {
width: 160px;
height: 200px;
 display: block;
cursor: pointer;
background: url('/wp-content/themes/mad/rmimages/climate_icon.png') no-repeat 18px 58px;
opacity: 1;
-webkit-transition: opacity .25s ease-in-out;
-moz-transition: opacity .25s ease-in-out;
-o-transition: opacity .25s ease-in-out;
transition: opacity .25s ease-out;
}

/* Economies Button */
#EconButton {
 position: absolute;
 width: 250px;
height: 99px;
background: transparent;
top: 500px;
/*left: 342px;*/
left: 382px;
}

#EconButton a {
 text-indent: -9999px;
 width: 250px;
height: 99px;
 display: block;
cursor: pointer;
opacity: 0;
}

#EconButton a:hover {
 width: 250px;
height: 99px;
 display: block;
cursor: pointer;
background: url('/wp-content/themes/mad/rmimages/econ_icon.png') no-repeat 0 0;
opacity: 1;
-webkit-transition: opacity .25s ease-in-out;
-moz-transition: opacity .25s ease-in-out;
-o-transition: opacity .25s ease-in-out;
transition: opacity .25s ease-out;
}

/* Democracy Protection Button */
#DemButton {
 position: absolute;
 width: 160px;
height: 200px;
background: transparent;
top: 305px;
/*left: 600px;*/
left: 640px;
}

#DemButton a {
 text-indent: -9999px;
width: 160px;
height: 200px;
 display: block;
cursor: pointer;
opacity: 0;
}

#DemButton a:hover {
width: 160px;
height: 200px;
 display: block;
cursor: pointer;
background: url('/wp-content/themes/mad/rmimages/dem_icon.png') no-repeat 58px 0px;
opacity: 1;
-webkit-transition: opacity .25s ease-in-out;
-moz-transition: opacity .25s ease-in-out;
-o-transition: opacity .25s ease-in-out;
transition: opacity .25s ease-out;
}

/* Peace Button */
#PeaceButton {
 position: absolute;
 width: 110px;
height: 150px;
background: transparent;
top: 95px;
/*left: 605px;*/
left: 645px;
overflow: visible !important;
-webkit-border-radius: 0 125px 0px 125px; 
-moz-border-radius:  0 125px 0px 125px; 
border-radius:  0 125px 0px 125px; 
}

#PeaceButton a {
 text-indent: -9999px;
width: 106px;
height: 150px;
 display: block;
cursor: pointer;
overflow: visible !important;
opacity: 0;
-webkit-border-radius: 0 100px 0px 125px; 
-moz-border-radius:  0 100px 0px 125px; 
border-radius:  0 100px 0px 125px; 
}

#PeaceButton a:hover {
width: 106px;
height: 150px;
 display: block;
cursor: pointer;
overflow: visible !important;
background: url('/wp-content/themes/mad/rmimages/peace_icon.png') no-repeat 10px 35px;
opacity: 1;
-webkit-transition: opacity .25s ease-in-out;
-moz-transition: opacity .25s ease-in-out;
-o-transition: opacity .25s ease-in-out;
transition: opacity .25s ease-out;
-webkit-border-radius: 0 100px 0px 125px; 
-moz-border-radius:  0 100px 0px 125px; 
border-radius:  0 100px 0px 125px; 
}

/* Personal Power Protection Button */
#PowerButton {
 position: absolute;
 width: 246px;
height: 246px;
background: transparent;
top: 177px;
/*left: 348px;*/
left: 388px;
-webkit-border-radius: 50%; 
-moz-border-radius: 50%; 
border-radius: 50%; 
}

#PowerButton a {
 text-indent: -9999px;
width: 246px;
height: 246px;
 display: block;
cursor: pointer;
opacity: 0;
-webkit-border-radius: 50%; 
-moz-border-radius: 50%; 
border-radius: 50%; 
}

#PowerButton a:hover {
width: 246px;
height: 246px;
 display: block;
cursor: pointer;
background: url('/wp-content/themes/mad/rmimages/power_icon.png') no-repeat center center;
opacity: 1;
-webkit-transition: opacity .25s ease-in-out;
-moz-transition: opacity .25s ease-in-out;
-o-transition: opacity .25s ease-in-out;
transition: opacity .25s ease-out;
-webkit-border-radius: 50%; 
-moz-border-radius: 50%; 
border-radius: 50%; 
}

/* Resistance Button */
#ResistButton {
 position: absolute;
 width: 303px;
height: 73px;
background: transparent;
top: 130px;
/*left: 553px;*/
left: 593px;
-webkit-transform: rotate(61deg); 
-moz-transform: rotate(61deg);
-o-transform: rotate(61deg);
/* legacy IE */
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
}

#ResistButton a {
 text-indent: -9999px;
 width: 303px;
height: 73px;
 display: block;
cursor: pointer;
opacity: 0;
}

#ResistButton a:hover {
width: 303px;
height: 73px;
 display: block;
cursor: pointer;
background: url('/wp-content/themes/mad/rmimages/resist_icon.png') no-repeat 0 0;
opacity: 1;
-webkit-transition: opacity .25s ease-in-out;
-moz-transition: opacity .25s ease-in-out;
-o-transition: opacity .25s ease-in-out;
transition: opacity .25s ease-out;
}

/* Constructive Button */
#ConstructButton {
 position: absolute;
 width: 204px;
height: 60px;
background: transparent;
top: 178px;
/*left: 532px;*/
left: 572px;
-webkit-transform: rotate(61deg); 
-moz-transform: rotate(61deg);
-o-transform: rotate(61deg);
/* legacy IE */
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
}

#ConstructButton a {
 text-indent: -9999px;
width: 204px;
height: 60px;
 display: block;
cursor: pointer;
opacity: 0;
}

#ConstructButton a:hover {
width: 204px;
height: 60px;
 display: block;
cursor: pointer;
background: url('/wp-content/themes/mad/rmimages/construct_icon.png') no-repeat 0 0;
opacity: 1;
-webkit-transition: opacity .25s ease-in-out;
-moz-transition: opacity .25s ease-in-out;
-o-transition: opacity .25s ease-in-out;
transition: opacity .25s ease-out;
}




/* ************ modal pop up ************** */
#mask {
    display: none;  /* set to 'none' ensures it’s invisible until it’s called */
    position: fixed;  /* makes the div go into a position that’s absolute to the browser viewing area */
    left: 0; /* makes the div span all the way across the viewing area */
    top: 0; /* makes the div span all the way across the viewing area */
    right: 0;
    bottom: 0;
    background-color: white;
    -moz-opacity: 0.8; /* makes the div transparent, so you have a cool overlay effect */
    opacity: .80;
    filter: alpha(opacity=80);
    width: 100%;
    height: 100%;
    z-index: 90; /* makes the div the second most top layer, so it’ll lay on top of everything else EXCEPT for divs with a higher z-index (meaning the #overlay ruleset) */

}

.guideBox {
margin: 15px auto !important;
border: 0px;
width: 100% !important;
height: auto !important;
}

.guideBox img
{
	width: 100%;
max-width: 332px;
display: block;
margin: 0 auto;
}

.beginLokaText {
margin-top: 10px;
}


.modalOuter {
    display: none; /* set to 'none' ensures it’s invisible until it’s called */
    position: absolute; /* makes the div go into a position that’s absolute to the browser viewing area */
opacity: 0;
    left: 50%; /* positions the div half way horizontally */
    /*top: 565px;*/ /* positions the div exactly in place vertically */
    /*top: 392px;*/
top: 342px;
    padding: 0px;
    margin: 0px 0 0 -474px;
    width: 940px;
    /*min-height: 500px;*/
    min-height: 350px;
    border: 4px solid #fff;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    -webkit-background-clip: padding-box;
    -moz-background-clip: padding;
    background-clip: padding-box;
    -webkit-box-shadow: 0px 0px 10px rgba(107, 90, 90, 0.50), inset 0px 0px 65px rgba(90, 90, 90, 0.35);
    -moz-box-shadow: 0px 0px 10px rgba(107, 90, 90, 0.50), inset 0px 0px 65px rgba(90, 90, 90, 0.35);
    box-shadow: 0px 0px 10px rgba(107, 90, 90, 0.50), inset 0px 0px 65px rgba(90, 90, 90, 0.35);
    z-index: 100; /* makes the div the top layer, so it’ll lay on top of the other content */
}

.modalOuter.Round {
  display: none; /* set to 'none' ensures it’s invisible until it’s called */
    position: absolute; /* makes the div go into a position that’s absolute to the browser viewing area */
opacity: 0;
    left: 50%; /* positions the div half way horizontally */
    /*top: 565px;*/ /* positions the div exactly in place vertically */
    /*top: 392px;*/
top: 300px;
    padding: 0px;
    margin: 0px 0 0 -370px;
    width: 740px;
    /*min-height: 500px;*/
    /*min-height: 350px;*/
    height: 740px;

    border: 4px solid #fff;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    -webkit-background-clip: padding-box;
    -moz-background-clip: padding;
    background-clip: padding-box;
    -webkit-box-shadow: 0px 0px 10px rgba(107, 90, 90, 0.50), inset 0px 0px 65px rgba(90, 90, 90, 0.35);
    -moz-box-shadow: 0px 0px 10px rgba(107, 90, 90, 0.50), inset 0px 0px 65px rgba(90, 90, 90, 0.35);
    box-shadow: 0px 0px 10px rgba(107, 90, 90, 0.50), inset 0px 0px 65px rgba(90, 90, 90, 0.35);
    z-index: 100; /* makes the div the top layer, so it’ll lay on top of the other content */
}
}

.temp { }


/* Start 2016-06-08 Changes by Nicholas Pavkovic */

.modalInner
{
	position: relative;
    padding: 24px !important;
}

.modalInner .modalHeader {
position: relative;
top: 0;
left: 0;
padding: 0;
margin-bottom: 12px;
min-height: 0 !important;
}

.modalInner .header-text
{
	width: calc(100% - 50px);
}

.modalInner .icon+.header-text
{
	display: inline-block;
	width: calc(100% - 120px);
	vertical-align: top;
}

.modalInner .text-content
{
    column-count: 2;
    column-gap: 24px;
}

.btnHeading
{
    break-before: column;
}

.modelInner .modalHeader
{
    margin-bottom: 24px;
}

.modalHeader .icon {
height: 99px;
width: 99px;
margin: 0 12px 0 0;
display: inline-block;
}

.modalHeader .heading {
position: static;
font-weight: bold;
font-style: italic;
font-size: 34px;
color: #fff;
text-shadow: 1px 1px 5px #808080;
filter: dropshadow(color=#808080, offx=1, offy=1);
line-height: 34px;
padding: 0;
margin: 0 0 6px 0;
}

.modalHeader .subheading {
font-weight: bold;
font-style: italic;
font-size: 26px;
text-shadow: 1px 1px 1px #ffffff;
filter: dropshadow(color=#ffffff, offx=1, offy=1);
line-height: 28px;
padding: 0 !important;
margin: 0;
}

.modalHeader .closeBtn {
width: 56px;
height: 52px;
position: absolute;
top: -18px;
right: -24px;
}

@media (min-width: 768px)
{
	.Round .modalInner
	{
		margin: 0 auto;
		width: 520px;
	}

.Round .modalInner .modalHeader
{
	margin: 0 auto;
	padding: 30px 0 10px 0;
	display: flex;
	justify-content: center;
	align-items: center;
}

.Round .modalHeader .icon
{
	margin: 0 6px 0 0;
}

.Round .heading { text-align: center; }

.Round .closeBtn
{
	left: 50%;
	margin-left: -25px;
}

.Round .infoButtons {
margin: 0 auto;
}

.Round .infoButtons ul {
margin: 0 0 0 -12px !important;
}

	/* #Power .modalInner { line-height: 130%; }
	#Power li.joinBtn a { padding-right: 40px }
	#Power li.joinBtn { display: inline-block; margin-left: 50%; transform: translate(-50%); }
	#Power .modalInner .modalHeader { padding: 20px 0 10px 0; } */
	#Construct .modalInner { width: 400px }

}

@media (max-width: 767px)
{
	.Round .closeBtn
	{
		width: 56px;
		height: 52px;
		position: absolute;
		top: -18px;
		right: -24px;
		left: auto;
	}

}

@media (max-width: 480px)
{
	.modalHeader .icon { 
		width:50px !important; 
		height:50px !important; 
		background-size:100% !important; 
	}
	.modalHeader .heading { font-size: 20px; line-height: 25px;}
	.modalHeader .icon+.header-text { width: calc(100% - 90px); }
	.modalInner .text-content { column-count: 1; }
	.btnHeading { break-before: auto; }
}

.modalHeader .closeBtn a {
display: block;
width: 56px;
height: 52px;
background: url('/wp-content/themes/mad/rmimages/closeBtnSprite.png') no-repeat 0 -8px;
text-indent: -9999px;
}

.modalHeader .closeBtn a:hover {
width: 56px;
height: 57px;
background-position: 0 -66px;
text-indent: -9999px;
}


.modalInner .quoteTop {
font-weight: bold;
font-size: 12px;
margin-bottom: 12px;
}

.modalInner .lrnMoreLnk a {
color: #222;
text-decoration: underline;
}

.modalInner .lrnMoreLnk a:hover {
color: #666;
text-decoration: underline;
}

.modalInner .btnHeading {
font-size: 18px;
font-weight: bold;
text-shadow: 1px 1px 1px #ffffff;
filter: dropshadow(color=#ffffff, offx=1, offy=1);
margin-bottom: 10px;
}

.exampleList ul{
margin-bottom: 15px !important;
}

.exampleList li {
list-style: circle;
font-weight: bold;
}

.modalInner .infoButtons {

}

.modalInner .infoButtons ul {
margin: 0;
padding: 0;
}

.modalInner .infoButtons li {
background: #fff;
line-height: 12px;
padding: 0;
margin: 10px 0 10px 0;
list-style-type: none !important;
border: 4px solid #fff;
-webkit-border-radius: 2px; 
/* Firefox 1-3.6 */
-moz-border-radius:    2px; 
/* Opera 10.5, IE 9, Safari 5, Chrome, Firefox 4, iOS 4, Android 2.1+ */
border-radius: 2px;
/* Prevent background color leak outs */
-webkit-background-clip: padding-box; 
-moz-background-clip: padding; 
background-clip: padding-box;
-webkit-box-shadow: 0px 0px 10px rgba(107, 90, 90, 0.40), inset 0px 0px 10px rgba(90, 90, 90, 0.35);
-moz-box-shadow:    0px 0px 10px rgba(107, 90, 90, 0.40), inset 0px 0px 10px rgba(90, 90, 90, 0.35);
box-shadow:         0px 0px 10px rgba(107, 90, 90, 0.40), inset 0px 0px 10px rgba(90, 90, 90, 0.35);
}

.modalInner .infoButtons li:hover {
background: #eee;
line-height: 12px;
padding: 0;
margin: 10px 0 10px 0;
list-type: none !important;
border: 4px solid #fff;
-webkit-border-radius: 2px; 
/* Firefox 1-3.6 */
-moz-border-radius:    2px; 
/* Opera 10.5, IE 9, Safari 5, Chrome, Firefox 4, iOS 4, Android 2.1+ */
border-radius: 2px;
/* Prevent background color leak outs */
-webkit-background-clip: padding-box; 
-moz-background-clip: padding; 
background-clip: padding-box;
-webkit-box-shadow: 0px 0px 10px rgba(107, 90, 90, 0.40), inset 0px 0px 30px rgba(90, 90, 90, 0.25);
-moz-box-shadow:    0px 0px 10px rgba(107, 90, 90, 0.40), inset 0px 0px 30px rgba(90, 90, 90, 0.25);
box-shadow:         0px 0px 10px rgba(107, 90, 90, 0.40), inset 0px 0px 30px rgba(90, 90, 90, 0.25);
}

.modalInner .infoButtons li.joinBtn {

}

.modalInner .infoButtons li a {
color: #222;
font-size: 12px;
line-height: 13px;
display: block;
text-decoration: none;
padding: 17px 30px 17px 17px;
background: url('/wp-content/themes/mad/rmimages/btnArrow.png') no-repeat calc(100% - 8px) center;
}

.modalInner .infoButtons li a span {
font-weight: bold !important;
}

.modalInner .infoButtons li a:hover {
text-decoration: none;


}

/* End 2016-06-08 Changes by Nicholas Pavkovic */

/* Modal Variations */


#NewStory { background: #bee7ed; }

#NewStory .icon { background: url('/wp-content/themes/mad/rmimages/NewStoryIcon.png') no-repeat 0 0; }

#NewStory .subheading {
color: #64b1c3;
font-size: 22px;
line-height: 22px;
}

#BeginHere { background: #d4dfd5; }

#BeginHere .modalInner .btnHeading { text-align: center; }

#Enviro { background: #b7c8b6; }

#Enviro .icon { background: url('/wp-content/themes/mad/rmimages/enviro_icon.png') no-repeat 0 0; }

#Enviro .subheading { color: #5b6a5a; }

#Climate { background: #edd4b6; }

#Climate .icon { background: url('/wp-content/themes/mad/rmimages/climate_icon.png') no-repeat 0 0; }

#Climate .subheading { color: #b07d63; }

#Econ { background: #e0bdb7; }

#Econ .icon { background: url('/wp-content/themes/mad/rmimages/econ_icon.png') no-repeat 0 0;
}

#Econ .subheading { color: #93726c; }

#Dem { background: #bebbd1; }

#Dem .icon { background: url('/wp-content/themes/mad/rmimages/dem_icon.png') no-repeat 0 0;
}

#Dem .subheading { color: #767190; }

#Peace { background: #a1c3e6; }

#Peace .icon { background: url('/wp-content/themes/mad/rmimages/peace_icon.png') no-repeat 0 0;
}

#Peace .subheading { color: #3887a5; }

#Resist { background: #bbd6dc; }

#Resist .icon {
/*background: url('/wp-content/themes/mad/rmimages/resist_icon.png') no-repeat 0 0;*/
}

#Resist .subheading { color: #6b8b92; }

#Construct { background: #bddde5; }

#Construct .icon {
/*background: url('/wp-content/themes/mad/rmimages/construct_icon.png') no-repeat 0 0;*/
}

#Construct .subheading { color: #69949e; }

#Power { background: #ddf2f7; }

#Power .icon { background: url('/wp-content/themes/mad/rmimages/power_icon.png') no-repeat center center; }

#Power .subheading { color: #10a1af; }

@media (max-width: 767px) {
.modalInner .infoButtons{ padding:0 5px;}
}