/* To use these Rainbow Module Presets click Edit, Select All, Edit Copy. Then paste this file into your custom.css file. Then add the class to the Module Class box on the custom module advanced tab. */ 
/* Rainbow Module Presets are designed for the Helix Template. */ 
/* They includes 12 Preset Background Color options. */ 
/* The CSS for our Rainbow Module CSS Presets is divided into 8 groups of custom styles (also called classes). */ 
/* These classes can be copied and pasted into the custom.css file of the Helix Template.*/ 
/* Feel free to copy and change any settings you want to create your own custom classes. */ 
/* The first section has general code changes */ 
/* The second section has our 6 light and 6 medium background color classes */ 
/* The third section has our 6 linear and 6 radial background color classes */ 
/* The fourth section has our 6 square and 6 round border background classes */ 
/* The fifth section has our 6 button round classes, 6 button round hover classes, 6 button square classes and 6 button square hover classes. */ 
/* You should add a button class and a button hover class although just the button class will work to display the button. */ 
/* We will use the round buttons with our round borders and the square buttons with our square borders to create our fully styled modules*/ 
/* The sixth section has our 6 simple module classes to style just the module h3 and p tags */ 
/* The seventh section has our 6 fully styled round module classes. */ 
/* These full module classes are simple module classes with a background color, border and button color added. */ 
/* Our round modules have round borders, round buttons and a radial gradient background. */ 
/* The eighth section has our 6 fully styled square module classes. */ 
/* These full module classes are simple module classes with a background color, border and button color added. */ 
/* Our square modules have square borders, square buttons and a linear gradient background. */ 
/* The first section has general code changes */ 
@font-face {
    font-family: 'arimobold';
    src: url('../fonts/arimo-bold.woff2') format('woff2'),
         url('../fonts/arimo-bold.woff') format('woff');
    font-weight: normal;
    font-style: normal;}
@font-face {
    font-family: 'arimobold_italic';
    src: url('../fonts/arimo-bolditalic.woff2') format('woff2'),
         url('../fonts/arimo-bolditalic.woff') format('woff');
    font-weight: normal;
    font-style: normal;}
@font-face {
    font-family: 'arimoitalic';
    src: url('../fonts/arimo-italic.woff2') format('woff2'),
         url('../fonts/arimo-italic.woff') format('woff');
    font-weight: normal;
    font-style: normal;}
@font-face {
    font-family: 'arimoregular';
    src: url('../fonts/arimo-regular.woff2') format('woff2'),
         url('../fonts/arimo-regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;}

h1, h2, h3, h4, h5 { font-family: "Arimo", sans-serif, arial; }
h3 {font-family: 'Arimo', sans-serif;font-size: 22px;font-weight: 700;color: #9d1ec7;text-decoration: none;}
#sp-header .sp-module {margin-left: 0px;}
#sp-main-body {padding: 20px 60px; max-width: 920px;}
.layout-boxed .body-innerwrapper {max-width: 960px;} 
.articleBody {max-width: 920px;  padding-left: 20px;}
#sp-menu .sp-column {height: 30px;}
.sp-megamenu-parent > li > a, .sp-megamenu-parent > li > span {
    line-height: 30px;}
.menu-with-offcanvas {display: none:}
.container-sm  {padding-right: 0 !important; padding-left 0 !important;}

.sp-megamenu-parent > li > a, .sp-megamenu-parent > li > span, .sp-megamenu-parent .sp-dropdown li.sp-menu-item > a{font-family: 'Arimo', sans-serif; font-size: 18px; text-decoration: none;}</style>
.container { padding-top: 10px; padding-right: 10px; padding-bottom: 10px; padding-left: 10px;}

.col-lg-6 {flex: 1 1 auto;}
.sp-module {flex: 1 1 auto;}
.sp-module {font-size: 20px;}
.sp-module-content {
text-align: center;}
#sp-top-row-1{ background-color:#DDFFDD;color:#FF0000;padding:10px;margin:10px; }

.burger-icon {font-weight: bold; background-color: #77cc77; width: 55px; height: 45px !important;}

.offcanvas-menu .offcanvas-inner ul.menu > li > ul li a { display: block; font-size: 18px; padding 20px 0; margin: 20px 0;}

.sp-column  {display: flex; height: 100%; justify-content: space-evenly;}

.sp-module.fullroundpurple  {
display: flex; flex-direction: column; height: 100%; }
.sp-module.fullroundblue  {
display: flex; flex-direction: column; height: 100%; }
.sp-module.fullroundgreen  {
display: flex; flex-direction: column; height: 100%; }
.sp-module.fullroundgray  {
display: flex; flex-direction: column; height: 100%; }
.sp-module.fullroundyellow  {
display: flex; flex-direction: column; height: 100%; }
.sp-module.fullroundpink  {
display: flex; flex-direction: column; height: 100%; }
.sp-module.fullsquarepurple  {
display: flex; flex-direction: column; height: 100%; }
.sp-module.fullsquareblue  {
display: flex; flex-direction: column; height: 100%; }
.sp-module.fullrsquaregreen  {
display: flex; flex-direction: column; height: 100%; }
.sp-module.fullsquaregray  {
display: flex; flex-direction: column; height: 100%; }
.sp-module.fullsquareyellow  {
display: flex; flex-direction: column; height: 100%; }
.sp-module.fullsquarepink  {
display: flex; flex-direction: column; height: 100%; }

.my-module {
font-family: arimo, sans-serif; 
margin: 0; 
display: block;
text-align: center; 
min-height: 250px;
background: #eeeeFF;
background: radial-gradient(circle farthest-corner at center center, #eeeeFF 0%, #77AAFF 100%);}
.my-module h3 {
font-size: 24px; 
color: #ff0000; 
font-weight: bold; 
line-height: 1.3;
padding: 5px;
background-color: #eeeeff;} 
.my-module p {

color: #770077;
font-size: 18px; 
font-weight: normal;
line-height: 1.2;
padding: 5px;} 

.borderroundblue {
border-style: solid;
border-width: 3px;
border-color: #333399;
border-radius: 12px;}

.my-module a {
background-color: #333399; 
border-radius: 10px; 
color: #ddddff;
font-size: 14px; 
font-weight: bold;
line-height: 1.3;
padding: 5px;
display: inline-block;
vertical-align: middle;}

/* The second section has our 6 light and 6 medium background color classes */ 
.lightpurple{background-color:#f1e6ff;}
.lightblue{background-color:#eeeeff;}
.lightgreen{background-color:#ccffcc;}
.lightgray{background-color:#eeeeee;}
.lightyellow{background-color:#ffffaa;}
.lightpink{background-color:#ffccff;}
.mediumpurple{background-color:#ccaaff;}
.mediumblue{background-color:#ccccff;}
.mediumgreen{background-color:#00ff00;}
.mediumgray{background-color:#dddddd;}
.mediumyellow{background-color:#ffff33;}
.mediumpink{background-color:#ff99ff;}
/* The third section has 6 linear and 6 radial background color classes */ 
.radialpurple {
background-image: radial-gradient(#f1e6ff, #ccaaff);}
.linearpurple {
background-image: linear-gradient(#f1e6ff, #ccaaff);}
.radialblue {
background-image: radial-gradient(#eeeeFF, #66aaFF);}
.linearblue {
background-image: linear-gradient(#eeeeFF, #66aaFF);}
.radialgreen {
background-image: radial-gradient(#CCFFCC, #00ee00);}
.lineargreen {
background-image: linear-gradient(#CCFFCC, #00EE00);}
.radialgray {
background-image: radial-gradient(#FFFFFF, #CCCCCC);}
.lineargray {
background-image: linear-gradient(#FFFFFF, #CCCCCC);}
.radialyellow {
background-image: radial-gradient(#FFFFCC, #FFFF00);}
.linearyellow {
background-image: linear-gradient(#FFFFCC, #FFFF00);}
.radialpink {
background-image: radial-gradient(#FFDDFF, #FF77FF);}
.linearpink {
background-image: linear-gradient(#FFDDFF, #FF77FF);}

/* The fourth section has 6 square and 6 round border background classes */ 
.borderroundpurple {
border-radius: 10px; 
border: 3px solid #7744AA;}
.bordersquarepurple {
border: 3px solid #7744AA;}
.bordersquareblue {
border: 3px solid #1144AA;}
.borderroundblue {
border-radius: 10px; 
border: 3px solid #1144AA;}
.borderroundgreen {
border-radius: 10px; 
border: 3px solid #009900;}
.bordersquaregreen {
border: 3px solid #009900;}
.borderroundgray {
border-radius: 10px; 
border: 3px solid #999999;}
.bordersquaregray {
border: 3px solid #999999;}
.borderroundyellow {
border-radius: 10px; 
border: 3px solid #BBBB00;}
.bordersquareyellow {
border: 3px solid #BBBB00;}
.borderroundpink {
border-radius: 10px; 
border: 3px solid #CC55CC;}
.bordersquarepink {
border: 3px solid #cc55cc;}
/* The fifth section has 6 button round classes, 6 button round hover classes, 6 button square classes and 6 button square hover classes. */ 
/* You should add a button class and a button hover class although just the button class will work to display the button. */ 
/* We will use the round buttons with our round borders and the square buttons with our square borders to create our fully styled modules*/ 
.buttonroundpurple {
display: inline-block;
line-height: 1.3;
vertical-align: middle;
margin-top: 5px;
margin-bottom: 10px;
margin-left: auto;
margin-right: auto;
font-family: arial;
font-weight: bold;
color: #EECCFF;
font-size: 14px;
box-shadow: 1px 1px 1px #000000;
padding: 10px 20px;
border-radius: 10px;
border: 2px solid #441177;
  background: #8855BB;
  background: linear-gradient(#8855BB,  #552288);}

.buttonroundpurple:hover {
 display: inline-block;
line-height: 1.3;
vertical-align: middle;
margin-top: 5px;
margin-bottom: 10px;
margin-left: auto;
margin-right: auto;
color: #EECCFF;
background: #552288;
background: linear-gradient(#552288,  #8855bb);}

.buttonroundblue {
 display: inline-block;
line-height: 1.3;
vertical-align: middle;
margin-top: 5px;
margin-bottom: 10px;
margin-left: auto;
margin-right: auto;
 font-family: arial;
font-weight: bold;
color: #DDDDEE;
font-size: 14px;
box-shadow: 1px 1px 1px #000000;
padding: 10px 20px;
border-radius: 10px;
border: 2px solid #114477;
background: #8888ff; background: linear-gradient(#8888FF,  #1144AA);}

.buttonroundblue:hover {
display: inline-block;
line-height: 1.3;
vertical-align: middle;
margin-top: 5px;
margin-bottom: 10px;
margin-left: auto;
margin-right: auto;
color: #DDDDEE;
background: #1144AA;
background: linear-gradient(#1144AA,  #8888FF);}

.buttonroundgreen {
display: inline-block;
line-height: 1.3;
vertical-align: middle;
margin-top: 5px;
margin-bottom: 10px;
margin-left: auto;
margin-right: auto;
font-family: arial;
font-weight: bold;
color: #CCFFCC;
font-size: 14px;
box-shadow: 1px 1px 1px #111111;
padding: 10px 20px;
border-radius: 10px;
border: 2px solid #005500;
background: #00BB00;
background: linear-gradient(#00BB00,  #007700);}

.buttonroundgreen:hover {
display: inline-block;
line-height: 1.3;
vertical-align: middle;
margin-top: 5px;
margin-bottom: 10px;
margin-left: auto;
margin-right: auto;
color: #CCFFCC;
background: #007700;
background: linear-gradient(#007700,  #00bb00);}

.buttonroundgray {
display: inline-block;
line-height: 1.3;
vertical-align: middle;
margin-top: 5px;
margin-bottom: 10px;
margin-left: auto;
margin-right: auto;
font-family: arial;
font-weight: bold;
color: #EEEEEE;
font-size: 14px;
box-shadow: 1px 1px 1px #111111;
padding: 10px 20px;
border-radius: 10px;
border: 2px solid #444444;
background: #999999;
background: linear-gradient(#999999, #555555);}

.buttonroundgray:hover {
display: inline-block;
line-height: 1.3;
vertical-align: middle;
margin-top: 5px;
margin-bottom: 10px;
margin-left: auto;
margin-right: auto;
color: #EEEEEE;
background: #555555;
background: linear-gradient(#555555, #999999);}

.buttonroundyellow {
display: inline-block;
line-height: 1.3;
vertical-align: middle;
margin-top: 5px;
margin-bottom: 10px;
margin-left: auto;
margin-right: auto;
font-family: arial;
font-weight: bold;
color: #FF0000;
font-size: 14px;
box-shadow: 1px 1px 1px #222222;
padding: 10px 20px;
border-radius: 10px;
border: 2px solid #666600;
background: #eeee00;
background: linear-gradient(#EEEE00,  #CCCC00);}

.buttonroundyellow:hover {
display: inline-block;
line-height: 1.3;
vertical-align: middle;
margin-top: 5px;
margin-bottom: 10px;
margin-left: auto;
margin-right: auto;
color: #FF0000;
background: #cccc00;
background: linear-gradient(#cccc00,  #eeee00);}

.buttonroundpink {
display: inline-block;
line-height: 1.3;
vertical-align: middle;
margin-top: 5px;
margin-bottom: 10px;
margin-left: auto;
margin-right: auto;
font-family: arial;
font-weight: bold;
color: #FFDDFF;
font-size: 14px;
box-shadow: 1px 1px 1px #552222;
padding: 10px 20px;
border-radius: 10px;
border: 2px solid #881188;
background: #BB66BB;
background: linear-gradient(#BB66BB,  #993399);}

.buttonroundpink:hover {
display: inline-block;
line-height: 1.3;
vertical-align: middle;
margin-top: 5px;
margin-bottom: 10px;
margin-left: auto;
margin-right: auto;
color: #FFDDFF;
background: #993399;
background: linear-gradient(#993399,  #bb66bb);}

/* SQUARE BUTTONS*/ 
.buttonsquarepurple {
display: inline-block;
line-height: 1.3;
vertical-align: middle;
margin-top: 5px;
margin-bottom: 10px;
margin-left: auto;
margin-right: auto;
font-family: arial;
font-weight: bold;
color: #EECCFF;
font-size: 14px;
box-shadow: 1px 1px 1px #000000;
padding: 10px 20px;
border: 2px solid #441177;
background: #8855BB;
background: linear-gradient(#8855BB, #552288);}

.buttonsquarepurple:hover {
 display: inline-block;
line-height: 1.3;
vertical-align: middle;
margin-top: 5px;
margin-bottom: 10px;
margin-left: auto;
margin-right: auto;
color: #EECCFF;
background: #552288;
background: linear-gradient(#552288, #8855bb);}

.buttonsquareblue {
 display: inline-block;
line-height: 1.3;
vertical-align: middle;
margin-top: 5px;
margin-bottom: 10px;
margin-left: auto;
margin-right: auto;
font-family: arial;
font-weight: bold;
color: #DDDDEE;
font-size: 14px;
box-shadow: 1px 1px 1px #000000;
padding: 10px 20px;
border: 2px solid #114477;
background: #8888ff;
background: linear-gradient(#8888FF,  #1144AA);}

.buttonsquareblue:hover {
display: inline-block;
line-height: 1.3;
vertical-align: middle;
margin-top: 5px;
margin-bottom: 10px;
margin-left: auto;
margin-right: auto;
color: #DDDDEE;
background: #1144AA;
background: linear-gradient(#1144AA,  #8888FF);}

.buttonsquaregreen {
display: inline-block;
line-height: 1.3;
vertical-align: middle;
margin-top: 5px;
margin-bottom: 10px;
margin-left: auto;
margin-right: auto;
font-family: arial;
font-weight: bold;
color: #CCFFCC;
font-size: 14px;
box-shadow: 1px 1px 1px #111111;
padding: 10px 20px;
border: 2px solid #005500;
background: #00BB00;
background: linear-gradient(#00BB00,  #007700);}

.buttonsquaregreen:hover {
display: inline-block;
line-height: 1.3;
vertical-align: middle;
margin-top: 5px;
margin-bottom: 10px;
margin-left: auto;
margin-right: auto;
color: #CCFFCC;
background: #007700;
background: linear-gradient(#007700,  #00bb00);}

.buttonsquaregray {
display: inline-block;
line-height: 1.3;
vertical-align: middle;
margin-top: 5px;
margin-bottom: 10px;
margin-left: auto;
margin-right: auto;
font-family: arial;
font-weight: bold;
color: #EEEEEE;
font-size: 14px;
box-shadow: 1px 1px 1px #111111;
padding: 10px 20px;
border: 2px solid #444444;
background: #999999;
background: linear-gradient(#999999,  #555555);}

.buttonsquaregray:hover {
display: inline-block;
line-height: 1.3;
vertical-align: middle;
margin-top: 5px;
margin-bottom: 10px;
margin-left: auto;
margin-right: auto;
color: #EEEEEE;
background: #555555;
background: linear-gradient(#555555,  #999999);}

.buttonsquareyellow {
display: inline-block;
line-height: 1.3;
vertical-align: middle;
margin-top: 5px;
margin-bottom: 10px;
margin-left: auto;
margin-right: auto;
font-family: arial;
font-weight: bold;
color: #FF0000;
font-size: 14px;
box-shadow: 1px 1px 1px #222222;
padding: 10px 20px;
border: 2px solid #666600;
background: #eeee00;
background: linear-gradient(#EEEE00,  #CCCC00);}

.buttonsquareyellow:hover {
display: inline-block;
line-height: 1.3;
vertical-align: middle;
margin-top: 5px;
margin-bottom: 10px;
margin-left: auto;
margin-right: auto;
color: #FF0000;
background: #cccc00;
background: linear-gradient(#cccc00,  #eeee00);}

.buttonsquarepink {
display: inline-block;
line-height: 1.3;
vertical-align: middle;
margin-top: 5px;
margin-bottom: 10px;
margin-left: auto;
margin-right: auto;
font-family: arial;
font-weight: bold;
color: #FFDDFF;
font-size: 14px;
box-shadow: 1px 1px 1px #552222;
padding: 10px 20px;
border: 2px solid #881188;
background: #BB66BB;
background: linear-gradient(#BB66BB,  #993399);}

.buttonsquarepink:hover {
display: inline-block;
line-height: 1.3;
vertical-align: middle;
margin-top: 5px;
margin-bottom: 10px;
margin-left: auto;
margin-right: auto;
color: #FFDDFF;
background: #993399;
background: linear-gradient(#993399,  #bb66bb);}

/* The sixth section has 6 simple module classes to style just the module h3 and p tags */ 
.simplepurple {
font-family: arial, helvetica, sans-serif; 
margin: 0; 
display: block;
min-height: 200px;}

.simplepurple h3 {
/* MODULE HEADER STYLE */ 
font-size: 22px; 
color: #441177; 
font-weight: bold; 
line-height: 1.3;
padding: 10px;
background-color: #f1e6ff ;} 

.simplepurple p {
/* MODULE DESCRIPTION STYLE */ 
color: #330055;
font-size: 18px; 
font-weight: normal;
line-height: 1.2;
padding: 5px;}

.simpleblue {
font-family: arial, helvetica, sans-serif; 
margin: 0; 
display: block;
min-height: 200px;}

.simpleblue h3 {
/* MODULE HEADER STYLE */ 
font-size: 22px; 
color: #114499; 
font-weight: bold; 
line-height: 1.3;
padding: 10px;
background-color: #eeeeff;} 

.simpleblue p {
/* MODULE DESCRIPTION STYLE */ 
color: #113355;
font-size: 18px; 
font-weight: normal;
line-height: 1.2;
padding: 5px;}

.simplegreen {
font-family: arial, helvetica, sans-serif; 
margin: 0; 
display: block;
min-height: 200px;}

.simplegreen h3 {
/* MODULE HEADER STYLE */ 
font-size: 22px; 
color: #006600; 
font-weight: bold; 
line-height: 1.3;
padding: 10px;
background-color: #eeffee;} 

.simplegreen p {
/* MODULE DESCRIPTION STYLE */ 
color: #003300;
font-size: 18px; 
font-weight: normal;
line-height: 1.2;
padding: 5px;}

.simplegray {
font-family: arial, helvetica, sans-serif; 
margin: 0; 
display: block;
min-height: 200px;}

.simplegray h3 {
/* MODULE HEADER STYLE */ 
font-size: 22px; 
color: #444444; 
font-weight: bold; 
line-height: 1.3;
padding: 10px;
background-color: #eeeeee;} 

.simplegray p {
/* MODULE DESCRIPTION STYLE */ 
color: #222222;
font-size: 18px; 
font-weight: normal;
line-height: 1.2;
padding: 5px;}

.simpleyellow {
font-family: arial, helvetica, sans-serif; 
margin: 0; 
display: block;
min-height: 200px;}

.simpleyellow h3 {
/* MODULE HEADER STYLE */ 
font-size: 22px; 
color: #996600; 
font-weight: bold; 
line-height: 1.3;
padding: 10px;
background-color: #ffffdd;} 

.simpleyellow p {
/* MODULE DESCRIPTION STYLE */ 
color: #333300;
font-size: 18px; 
font-weight: normal;
line-height: 1.2;
padding: 5px;}

.simplepink {
font-family: arial, helvetica, sans-serif; 
margin: 0; 
display: block;
min-height: 200px;}

.simplepink h3 {
/* MODULE HEADER STYLE */ 
font-size: 22px; 
color: #772277; 
font-weight: bold; 
line-height: 1.3;
padding: 10px;
background-color: #ffddff;} 

.simplepink p {
/* MODULE DESCRIPTION STYLE */ 
color: #550055;
font-size: 18px; 
font-weight: normal;
line-height: 1.2;
padding: 5px;}

/* The seventh section has 6 fully styled round module classes. */ 
/* These full module classes are simple module classes with a background color, border and button color added. */ 
/* Our round modules have round borders, round buttons and a radial gradient background. */ 

.fullroundpurple {
font-family: arial, helvetica, sans-serif; 
margin: 0; 
display: block;
min-height: 200px;

/* RADIAL BACKGROUND STYLE */ 
background-image: radial-gradient(#f1e6FF, #ccaaf3);

/* MODULE BORDER ROUND STYLE */ 
border-radius: 10px; 
border: 3px solid #7744AA;}

.fullroundpurple h3 {
/* MODULE HEADER STYLE */ 
font-size: 22px; 
color: #441177; 
font-weight: bold; 
line-height: 1.3;
padding: 10px;
background-color: #f1e6ff;}

.fullroundpurple p {
/* MODULE DESCRIPTION STYLE */ 
text-align: center; 
color: #330055;
font-size: 18px; 
font-weight: normal;
line-height: 1.2;
padding: 5px;}

.fullroundpurple a {
display: inline-block;
line-height: 1.2;
vertical-align: middle;
margin-top: 5px;
  margin-bottom: 10px;
  margin-left: auto;
  margin-right: auto;
font-family: arial;
font-weight: bold;
color: #EECCFF;
font-size: 14px;
box-shadow: 1px 1px 1px #000000;
padding: 10px 20px;
border-radius: 10px;
border: 2px solid #441177;
background: #8855BB;
background: linear-gradient(#8855BB,  #552288);}

.fullroundpurple a:hover {
 display: inline-block;
line-height: 1.2;
vertical-align: middle;
margin-top: 5px;
  margin-bottom: 10px;
  margin-left: auto;
  margin-right: auto;
color: #EECCFF;
background: #552288;
background: linear-gradient(#552288,  #8855bb);}

.fullroundblue {
font-family: arial, helvetica, sans-serif; 
margin: 0; 
display: block;
min-height: 200px;

/* RADIAL BACKGROUND STYLE */ 
background-image: radial-gradient(#eeeeFF, #66aaFF);

/* MODULE BORDER ROUND STYLE */ 
border-radius: 10px; 
border: 3px solid #1144AA;}

.fullroundblue h3 {
/* MODULE HEADER STYLE */ 
font-size: 22px; 
color: #114499; 
font-weight: bold; 
line-height: 1.3;
padding: 10px;
background-color: #eeeeff;} 

.fullroundblue p {
/* MODULE DESCRIPTION STYLE */ 
color: #113355;
font-size: 18px; 
font-weight: normal;
line-height: 1.2;
padding: 5px;}

.fullroundblue a {
/* BUTTON ROUND STYLE */ 
 display: inline-block;
line-height: 1.2;
vertical-align: middle;
margin-top: 5px;
  margin-bottom: 10px;
  margin-left: auto;
  margin-right: auto;
font-family: arial;
font-weight: bold;
color: #DDDDEE;
font-size: 14px;
box-shadow: 1px 1px 1px #000000;
padding: 10px 20px;
border-radius: 10px;
border: 2px solid #114477;
background: #8888ff;
background: linear-gradient(#8888FF,  #1144AA);}

.fullroundblue a:hover {
/* BUTTON ROUND HOVER STYLE */ 
display: inline-block;
line-height: 1.2;
vertical-align: middle;
margin-top: 5px;
  margin-bottom: 10px;
  margin-left: auto;
  margin-right: auto;
color: #DDDDEE;
background: #1144AA;
background: linear-gradient(#1144AA,  #8888FF);}

.fullroundgreen {
font-family: arial, helvetica, sans-serif; 
margin: 0; 
display: block;
min-height: 200px;
background-image: radial-gradient(#CCFFCC, #00ee00);

/* MODULE BORDER ROUND STYLE */ 
border-radius: 10px; 
border: 3px solid #009900;}

.fullroundgreen h3 {
/* MODULE HEADER STYLE */ 
font-size: 22px; 
color: #006600; 
font-weight: bold; 
line-height: 1.3;
padding: 10px;
background-color: #ddffdd;} 

.fullroundgreen p {
/* MODULE DESCRIPTION STYLE */ 
color: #003300;
font-size: 18px; 
font-weight: normal;
line-height: 1.2;
padding: 5px;}

.fullroundgreen a {
display: inline-block;
line-height: 1.2;
vertical-align: middle;
margin-top: 5px;
  margin-bottom: 10px;
  margin-left: auto;
  margin-right: auto;
 font-family: arial;
 font-weight: bold;
color: #CCFFCC;
font-size: 14px;
box-shadow: 1px 1px 1px #111111;
padding: 10px 20px;
border-radius: 10px;
border: 2px solid #005500;
background: #00BB00;
background: linear-gradient(#00BB00,  #007700);}

.fullroundgreen a:hover {
display: inline-block;
line-height: 1.2;
vertical-align: middle;
margin-top: 5px;
  margin-bottom: 10px;
  margin-left: auto;
  margin-right: auto;
color: #CCFFCC;
background: #007700;
background: linear-gradient(#007700,  #00bb00);}

.fullroundgray {
font-family: arial, helvetica, sans-serif; 
margin: 0; 
display: block;
min-height: 200px;
background-image: radial-gradient(#FFFFFF, #CCCCCC);

/* MODULE BORDER ROUND STYLE */ 
border-radius: 10px; 
border: 3px solid #999999;}

.fullroundgray h3 {
/* MODULE HEADER STYLE */ 
font-size: 22px; 
color: #444444; 
font-weight: bold; 
line-height: 1.3;
padding: 10px;
background-color: #eeeeee;} 

.fullroundgray p {
/* MODULE DESCRIPTION STYLE */ 
color: #222222;
font-size: 18px; 
font-weight: normal;
line-height: 1.2;
padding: 5px;}

.fullroundgray a {
display: inline-block;
line-height: 1.2;
vertical-align: middle;
margin-top: 5px;
  margin-bottom: 10px;
  margin-left: auto;
  margin-right: auto;
 font-family: arial;
 font-weight: bold;
color: #EEEEEE;
font-size: 14px;
box-shadow: 1px 1px 1px #111111;
padding: 10px 20px;
border-radius: 10px;
border: 2px solid #444444;
background: #999999;
background: linear-gradient(#999999,  #555555);}

.fullroundgray a:hover {
display: inline-block;
line-height: 1.2;
vertical-align: middle;
margin-top: 5px;
  margin-bottom: 10px;
  margin-left: auto;
  margin-right: auto;
color: #EEEEEE;
background: #555555;
background: linear-gradient(#555555,  #999999);}

.fullroundyellow {
font-family: arial, helvetica, sans-serif; 
margin: 0; 
display: block;
min-height: 200px;
background-image: radial-gradient(#FFFFCC, #FFFF00);

/* MODULE BORDER ROUND STYLE */ 
border-radius: 10px; 
border: 3px solid #BBBB00;}

.fullroundyellow h3 {
/* MODULE HEADER STYLE */ 
font-size: 22px; 
color: #996600; 
font-weight: bold; 
line-height: 1.3;
padding: 10px;
background-color: #ffffdd;} 

.fullroundyellow p {
/* MODULE DESCRIPTION STYLE */ 
color: #333300;
font-size: 18px; 
font-weight: normal;
line-height: 1.2;
padding: 5px;}

.fullroundyellow a {
display: inline-block;
line-height: 1.2;
vertical-align: middle;
margin-top: 5px;
  margin-bottom: 10px;
  margin-left: auto;
  margin-right: auto;
font-family: arial;
font-weight: bold;
color: #775500;
font-size: 14px;
box-shadow: 1px 1px 1px #222222;
padding: 10px 20px;
border-radius: 10px;
border: 2px solid #666600;
background: #eeee00;
background: linear-gradient(#EEEE00,  #CCCC00);}

.fullroundyellow a:hover {
display: inline-block;
line-height: 1.2;
vertical-align: middle;
margin-top: 5px;
  margin-bottom: 10px;
  margin-left: auto;
  margin-right: auto;
color: #775500;
background: #cccc00;
background: linear-gradient(#cccc00,  #eeee00);}

.fullroundpink {
font-family: arial, helvetica, sans-serif; 
margin: 0; 
display: block;
min-height: 200px;
background-image: radial-gradient(#FFDDFF, #FF77FF);

/* MODULE BORDER ROUND STYLE */ 
border-radius: 10px; 
border: 3px solid #CC55CC;}

.fullroundpink h3 {
/* MODULE HEADER STYLE */ 
font-size: 22px; 
color: #772277; 
font-weight: bold; 
line-height: 1.3;
padding: 10px;
background-color: #ffddff;} 

.fullroundpink p {
/* MODULE DESCRIPTION STYLE */ 
color: #550055;
font-size: 18px; 
font-weight: normal;
line-height: 1.2;
padding: 5px;}

.fullroundpink a {
display: inline-block;
line-height: 1.2;
vertical-align: middle;
margin-top: 5px;
  margin-bottom: 10px;
  margin-left: auto;
  margin-right: auto;
font-family: arial;
font-weight: bold;
color: #FFDDFF;
font-size: 14px;
box-shadow: 1px 1px 1px #552222;
padding: 10px 20px;
border-radius: 10px;
border: 2px solid #881188;
background: #BB66BB;
background: linear-gradient(#BB66BB,  #993399);}

.fullroundpink a:hover {
display: inline-block;
line-height: 1.2;
vertical-align: middle;
margin-top: 5px;
  margin-bottom: 10px;
  margin-left: auto;
  margin-right: auto;
color: #FFDDFF;
background: #993399;
background: linear-gradient(#993399,  #bb66bb);}

/* The eighth section has 6 fully styled square module classes. */ 
/* These full module classes are simple module classes with a background color, border and button color added. */ 
/* Our square modules have square borders, square buttons and a linear gradient background. */ 

.fullsquarepurple {
font-family: arial, helvetica, sans-serif; 
margin: 0; 
display: block;
min-height: 200px;
background-image: linear-gradient(#f1e6ff, #ccaaf3);

/* MODULE BORDER SQUARE STYLE */ 
border: 3px solid #7744AA;}

.fullsquarepurple h3 {
/* MODULE HEADER STYLE */ 
font-size: 22px; 
color: #441177; 
font-weight: bold; 
line-height: 1.3;
padding: 10px;
background-color: #f1e6ff;
border-bottom: 2px solid #7744aa;}

.fullsquarepurple p {
/* MODULE DESCRIPTION STYLE */ 
color: #330055;
font-size: 18px; 
font-weight: normal;
line-height: 1.2;
padding: 5px;}

.fullsquarepurple a {
display: inline-block;
line-height: 1.3;
vertical-align: middle;
margin-top: 5px;
  margin-bottom: 10px;
  margin-left: auto;
  margin-right: auto;
font-family: arial;
font-weight: bold;
color: #EECCFF;
font-size: 14px;
box-shadow: 1px 1px 1px #000000;
padding: 10px 20px;
border: 2px solid #441177;
background: #8855BB;
background: linear-gradient(#8855BB,  #552288);}

.fullsquarepurple a:hover {
 display: inline-block;
line-height: 1.3;
vertical-align: middle;
margin-top: 5px;
  margin-bottom: 10px;
  margin-left: auto;
  margin-right: auto;
color: #EECCFF;
background: #552288;
background: linear-gradient(#552288,  #8855bb);}

.fullsquareblue {
font-family: arial, helvetica, sans-serif; 
margin: 0; 
display: block;
min-height: 200px;
background-image: linear-gradient(#eeeeFF, #66aaFF);

/* MODULE BORDER SQUARE STYLE */ 
border: 3px solid #1144AA;}

.fullsquareblue h3 {
/* MODULE HEADER STYLE */ 
font-size: 22px; 
color: #114499; 
font-weight: bold; 
line-height: 1.3;
padding: 10px;
background-color: #eeeeff;
border-bottom: 2px solid #1144aa;} 

.fullsquareblue p {
/* MODULE DESCRIPTION STYLE */ 
color: #113355;
font-size: 18px; 
font-weight: normal;
line-height: 1.2;
padding: 5px;}

.fullsquareblue a {
/* BUTTON ROUND STYLE */ 
 display: inline-block;
line-height: 1.3;
vertical-align: middle;
margin-top: 5px;
  margin-bottom: 10px;
  margin-left: auto;
  margin-right: auto;
font-family: arial;
font-weight: bold;
color: #DDDDEE;
font-size: 14px;
box-shadow: 1px 1px 1px #000000;
padding: 10px 20px;
border: 2px solid #114477;
background: #8888ff;
background: linear-gradient(#8888FF,  #1144AA);}

.fullsquareblue a:hover {
/* BUTTON ROUND HOVER STYLE */ 
display: inline-block;
line-height: 1.3;
vertical-align: middle;
margin-top: 5px;
  margin-bottom: 10px;
  margin-left: auto;
  margin-right: auto;
color: #DDDDEE;
background: #1144AA;
background: linear-gradient(#1144AA,  #8888FF);}

.fullsquaregreen {
font-family: arial, helvetica, sans-serif; 
margin: 0; 
display: block;
min-height: 200px;
background-image: linear-gradient(#CCFFCC, #00EE00);

/* MODULE BORDER SQUARE STYLE */ 
border: 3px solid #009900;}

.fullsquaregreen h3 {
/* MODULE HEADER STYLE */ 
font-size: 22px; 
color: #006600; 
font-weight: bold; 
line-height: 1.3;
padding: 10px;
background-color: #ddffdd;
border-bottom: 2px solid #009900;} 

.fullsquaregreen p {
/* MODULE DESCRIPTION STYLE */ 
color: #003300;
font-size: 18px; 
font-weight: normal;
line-height: 1.2;
padding: 5px;}

.fullsquaregreen a {
display: inline-block;
line-height: 1.3;
vertical-align: middle;
margin-top: 5px;
  margin-bottom: 10px;
  margin-left: auto;
  margin-right: auto;
font-family: arial;
font-weight: bold;
color: #CCFFCC;
font-size: 14px;
box-shadow: 1px 1px 1px #111111;
padding: 10px 20px;
border: 2px solid #005500;
background: #00BB00;
background: linear-gradient(#00BB00,  #007700);}

.fullsquaregreen a:hover {
display: inline-block;
line-height: 1.3;
vertical-align: middle;
margin-top: 5px;
  margin-bottom: 10px;
  margin-left: auto;
  margin-right: auto;
color: #CCFFCC;
background: #007700;
background: linear-gradient(#007700,  #00bb00);}

.fullsquaregray {
font-family: arial, helvetica, sans-serif; 
margin: 0; 
display: block;
min-height: 200px;
background-image: linear-gradient(#FFFFFF, #CCCCCC);

/* MODULE BORDER SQUARE STYLE */ 
border: 3px solid #999999;}

.fullsquaregray h3 {
/* MODULE HEADER STYLE */ 
font-size: 22px; 
color: #444444; 
font-weight: bold; 
line-height: 1.3;
padding: 10px;
background-color: #eeeeee;
border-bottom: 2px solid #999999;} 

.fullsquaregray p {
/* MODULE DESCRIPTION STYLE */ 
color: #222222;
font-size: 18px; 
font-weight: normal;
line-height: 1.2;
padding: 5px;}

.fullsquaregray a {
display: inline-block;
line-height: 1.3;
vertical-align: middle;
margin-top: 5px;
  margin-bottom: 10px;
  margin-left: auto;
  margin-right: auto;
font-family: arial;
font-weight: bold;
color: #EEEEEE;
font-size: 14px;
box-shadow: 1px 1px 1px #111111;
padding: 10px 20px;
border: 2px solid #444444;
background: #999999;
background: linear-gradient(#999999,  #555555);}

.fullsquaregray a:hover {
display: inline-block;
line-height: 1.3;
vertical-align: middle;
margin-top: 5px;
  margin-bottom: 10px;
  margin-left: auto;
  margin-right: auto;
color: #EEEEEE;
background: #555555;
background: linear-gradient(#555555,  #999999);}

.fullsquareyellow {
font-family: arial, helvetica, sans-serif; 
margin: 0; 
display: block;
min-height: 200px;
background-image: linear-gradient(#FFFFCC, #FFFF00);

/* MODULE BORDER SQUARE STYLE */ 
border: 3px solid #bbbb00;}

.fullsquareyellow h3 {
/* MODULE HEADER STYLE */ 
font-size: 22px; 
color: #996600; 
font-weight: bold; 
line-height: 1.3;
padding: 10px;
background-color: #ffffdd;
border-bottom: 2px solid #bbbb00;} 

.fullsquareyellow p {
/* MODULE DESCRIPTION STYLE */ 
color: #333300;
font-size: 18px; 
font-weight: normal;
line-height: 1.2;
padding: 5px;}

.fullsquareyellow a {
display: inline-block;
line-height: 1.3;
vertical-align: middle;
margin-top: 5px;
  margin-bottom: 10px;
  margin-left: auto;
  margin-right: auto;
font-family: arial;
font-weight: bold;
color: #775500;
font-size: 14px;
box-shadow: 1px 1px 1px #222222;
padding: 10px 20px;
border: 2px solid #666600;
background: #eeee00;
background: linear-gradient(#EEEE00,  #CCCC00);}

.fullsquareyellow a:hover {
display: inline-block;
line-height: 1.3;
vertical-align: middle;
margin-top: 5px;
  margin-bottom: 10px;
  margin-left: auto;
  margin-right: auto;
color: #775500;
background: #cccc00;
background: linear-gradient(#cccc00,  #eeee00);}

.fullsquarepink {
font-family: arial, helvetica, sans-serif; 
margin: 0; 
display: block;
min-height: 200px;
background-image: linear-gradient(#FFDDFF, #FF77FF);

/* MODULE BORDER SQUARE STYLE */ 
border: 3px solid #cc55cc;}

.fullsquarepink h3 {
/* MODULE HEADER STYLE */ 
font-size: 22px; 
color: #772277; 
font-weight: bold; 
line-height: 1.3;
padding: 10px;
background-color: #ffddff;
border-bottom: 2px solid #cc55cc;} 

.fullsquarepink p {
/* MODULE DESCRIPTION STYLE */ 
color: #550055;
font-size: 18px; 
font-weight: normal;
line-height: 1.2;
padding: 5px;}

.fullsquarepink a {
display: inline-block;
line-height: 1.3;
vertical-align: middle;
margin-top: 5px;
  margin-bottom: 10px;
  margin-left: auto;
  margin-right: auto;
font-family: arial;
font-weight: bold;
color: #FFDDFF;
font-size: 14px;
box-shadow: 1px 1px 1px #552222;
padding: 10px 20px;
border: 2px solid #881188;
background: #BB66BB;
background: linear-gradient(#BB66BB,  #993399);}

.fullsquarepink a:hover {
display: inline-block;
line-height: 1.3;
vertical-align: middle;
margin-top: 5px;
  margin-bottom: 10px;
  margin-left: auto;
  margin-right: auto;
color: #FFDDFF;
background: #993399;
background: linear-gradient(#993399,  #bb66bb);}

/* This new section has classes for our side-by-side modules. */ 
.newroundblue {
font-family: arial, helvetica, sans-serif; 
margin: 0; 
display: block;
min-height: 200px;
/* RADIAL BACKGROUND STYLE */ 
background-image: radial-gradient(#DDDDFF, #3366FF);
/* MODULE BORDER ROUND STYLE */ 
border-radius: 20px; 
border: 3px solid #1144AA;}
.newroundblue h3 {
/* MODULE HEADER STYLE */ 
font-size: 22px; 
color: #114499; 
font-weight: bold; 
line-height: 1.3;
padding: 10px;
background-color: #eeeeff;} 

.newroundblue img {
float: left;
padding: 10 px;
height: 150px;
display: inline-block;}

.newroundblue p {
/* MODULE DESCRIPTION STYLE */ 
color: #113355;
font-size: 18px; 
font-weight: normal;
line-height: 1.2;
padding: 5px;}

.newroundblue a {
/* BUTTON ROUND STYLE */ 
 display: inline-block;
line-height: 1.3;
vertical-align: middle;
margin-top: 5px;
  margin-bottom: 10px;
  margin-left: auto;
  margin-right: auto;
font-family: arial;
font-weight: bold;
color: #DDDDEE;
font-size: 14px;
box-shadow: 1px 1px 1px #000000;
padding: 10px 20px;
border-radius: 10px;
border: 2px solid #114477;
background: #8888ff;
background: linear-gradient(#8888FF,  #1144AA);}

.newroundblue a:hover {
/* BUTTON ROUND HOVER STYLE */ 
display: inline-block;
line-height: 1.3;
vertical-align: middle;
margin-top: 5px;
  margin-bottom: 10px;
  margin-left: auto;
  margin-right: auto;
color: #DDDDEE;
background: #1144AA;
background: linear-gradient(#1144AA,  #8888FF);}