strong, b {font-weight:700}

* {
  padding: 0;
  margin:  0;
    box-sizing: border-box;
}



@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

    .msPurple {
	 color:#8536ad;
}


.delayedShow5s{
   opacity: 0;
    
    animation: fadeIn 5s;
    animation-delay: 5s;
    animation-fill-mode: forwards;}

.delayedShow30s{
   opacity: 0;
    
    animation: fadeIn 10s;
    animation-delay: 30s;
    animation-fill-mode: forwards;}


input[name=d_Home_page_IF_NOT_BLANK_PROBABLY_JUNKMAIL]
{
display:none;}  ;}  /* for SPAM detection  We hide this form field from Humans. Bots fill it in. */


.big-text  { font-size: 2em;}
.text-gray {
	color:gray;
}

.UnusedSelector {
	 background: yellow;
}
.vertical-middle {display:inline-block; vertical-align:middle; padding-bottom:0; padding-top:0; margin-top::0; margin-bottom:0}

body {
  font-family: 'open Sans';
  font-size: 19px;
  font-weight: 400;
  line-height: 1.5;
  color: #333;
  background-color: #FFF;
}

hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #E35643;
  margin: 1em 0;
  padding: 0;
}

.section {
  color: #E35643;
  border-top-style: solid;
  border-top-color: #E35643;
  font-weight:normal;
  margin-bottom:.25em;
}


/* COLORS */

.orange-bright  {
	
	color: #F16000;
}
.orange-dark {
	
	color:#D35400
}

.yellow-canary {
	
	color:#ffffcc
}
.bg-yellow-canary {
	
	background-color:#F4F4C1;
}



/* fonts */
h1, h2, h3, h4, h5, .subheader, .logo-text, .logo-text-sub, .tmenu {
  font-family: "Open Sans";
}

ol.list-narrow, ul.list-narrow {
	
margin-top:1em;
}
ol.list-narrow > li, ul.list-narrow > li {
margin-top:0px;
margin-bottom:.5em;
line-height: 1.2em;
	
}
.small.font,.text-small {
  font-size: 0.8em;
}


.text-center {
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}


.deepmhasize.font {
  color: silver;
}

.background-emphasis {
  border: thin solid #C0C0C0;
  background-color: #FFFFCC;
  border-radius: 9px;
  padding: 20px;
}

.ImageCaption {
  font-size: 0.75em;
  /*font-style:italic;      too tough to read if it's small AND italic*/
  margin-bottom: 0em;
  margin-top: 0em;
  text-align: center;
  background-color: #EBEBEB;
}

/*  imported from bungalow style.css */
/* .numberCircle {
    border-radius: 50%;
    behavior: url(PIE.htc); 
    
    width: 36px;
    height: 36px;
    padding: 8px;

    background: #666;
    border: 2px solid #666;
    color: #fff;
    text-align: center;

    font: 32px Arial, sans-serif;
}
*/
@media screen and (max-width: 860px) {
  body {
    font-size: 19px;
      margin:  0 10px 0 10px;
  }
}

@media screen and (max-width: 650px) {
  body {
    font-size: 17px;
     margin:  0 5px 0 5px;

  }
}

/*-- stuff ported from old css - bungalow2.css, etc */
.RightFigure320 {
  width: 320px;
  /*changed from 30% 11-17-05*/
  float: right;
  /*Set martin-top to zero so right column is aligned with left*/
  margin: 0 10px 10px;
  padding: 0px 25px 5px 12px;
  border-left: none;
  text-align: center;
}

.RightFigure410 {
  /*[disabled]text-align:center;*/
  float: right;
  margin: 15px 10px 5px;
  width: 410px;
  padding: 0;
}

.RightFigure {
  float: right;
  margin: 15px 10px 5px;
  padding: 0;
}

.ScreenShot {
}
div.ScreenShot  {
	display:inline-block;  /* forces div to be width of contents (our screenshot)*/
	margin:10px;
}

/*Try to use only .ScreenShot P, others are deprecated*/
table .orderform-item {
  /*[disabled]border:1px dashed #BFBFBF;*/
  margin-top: 15px;
}

.ScreenShot p, .RightFigure410 p, .RightFigure320 p, .RightFigure p {
  background-color: #FFFFCC;
  border: 1px dotted #666666;
  color: #333333;
  font-size: 0.8em;
  line-height: normal;
  margin: 2px 0pt 15px;
  /*5-2-2010  disabled this b/c it causes bckground color to apply to  image in .Screenshot p .*/
  padding: 2px 0px 2px 5px;
  text-align: center;
}







.dropshadow + p {
	margin-top: 15px; 
	

}
.dropshadow {
  box-shadow: 5px 10px 30px gray;
  border: 1px silver solid;
  margin-top:20px;
 
 
}

/* ---- Grid ---- */
.row {
  width: 100%;
}

.row:before, .row:after, .header:before, .footer:before, .body:before, .header:after, .body:after, .block:before, .block:after {
  content: '\0020';
  display: block;
  overflow: hidden;
  visibility: hidden;
  width: 0;
  height: 0 !important;
}

.row:after, .header:after, .footer:after, .body:after, .block:after {
  clear: both;
  /*margin-bottom: 1.5em;*/
}

.block, .col, .col980 {
  margin: 0 auto;
  width: 100%;
}

.block, .col {
  max-width: 800px;
}

.col980 {
  max-width: 980px;
}

.padded {
  padding: 0.85em;
}

.ph {
  padding: 0 0.85em;
}

.col1-2, .col1-3, .col2-3 {
  float: left;
  padding-right: 0.5em;
  /* padding-left: 0.5em; */
}

.col1-2 + .col1-2, .col1-3 + .col1-3 {
  padding-left: 2em;
}

/*
.col, .col980, .col1-2, .col1-3, .col2-3 {padding: 0.5em 0.85em}
.header .col {padding-top: 0; padding-bottom: 0}
*/
.col1-2:first-child, .col1-3:first-child, .col2-3:first-child {
  padding-left: 0;
}

.col1-2:last-child, .col1-3:last-child, .col2-3:last-child {
  padding-right: 0;
}

.col1-2 {
  width: 49%;
}

.col1-3 {
  width: 31%;
}

.col2-3 {
  width: 66.66%;
}

@media screen and (max-width: 800px) {
  .col980 .col1-2, .col980 .col1-3, .col980 .col2-3, .col980 .col1-2:first-child, .col980 .col1-3:first-child, .col980 .col2-3:first-child,
  .col980 .col1-2:last-child, .col980 .col1-3:last-child, .col980 .col2-3:last-child {
    float: none;
    width: 100%;
    padding: 0;
    /*padding: 1em;*/
    margin-bottom: 1em;
  }
}

@media screen and (max-width: 680px) {
  .col1-2, .col1-3, .col2-3, .col1-2:first-child, .col1-3:first-child, .col2-3:first-child, .col1-2:last-child, .col1-3:last-child,
  .col2-3:last-child {
    float: none;
    width: 100%;
    padding: 0;
    margin-bottom: 1em;
  }
}

/* ---- Layout ---- */
.header, .footer, .body {
  width: 100%;
}

.header {
  background-color: #F8F8F8;
  border-bottom: 2px solid #E8E8E8;
  height: 60px;
  position: relative;
}

.header-fixed {
  position: fixed;
  opacity: 0.95;
  top: 0;
  z-index: 9;
}

.body {
  margin-top: 0;
}

.header-fixed + .body {
  margin-top: 3em;
}

.footer {
  background-color: #5B657C;
  font-size: 0.9em;
  color: #DDD;
  padding-bottom: 50px;
}

.footer h2 {
  color: #DDD;
margin-bottom:0;

}


.clear {
  display: table;
  clear: both;
  height: 0;
}

/* ---- Top Menu and Logo ---- */
.tmenu {
  float: right;
  font-size: 0.60em;
  line-height: 60px;
  font-weight: normal;
  position: static;
}

#hamburger {
  display: none;
  position: relative;
}

.hamburger-close {
  position: absolute;
  margin-left: 3.5em;
  font-weight: 400;
  font-size: 0.8em;
}

.tmenu ul {
  list-style: none;
  margin: 0;
  display: block;
  /*margin-right: 1em;*/
}

.tmenu li {
  margin-bottom: 0;
  display: inline-block;
}

.tmenu a, a:visited {
  display: inline-block;
  text-decoration: none;
  color: #4B2E83;
  margin-left: 1em;
}

.tmenu a:hover {
  text-decoration: underline;
}

.logo, .logo-text {
  position: relative;
  float: left;
}

.logo-text, .logo-text:visited {
  top: 11px;
  line-height: 0.8;
  color: #F16000;
  font-size: 1.25em;
  font-weight: 700;
  text-decoration: none;
}

.logo-text-sub {
  font-size: 0.6em;
  font-weight: 400;
  color: #000;
}

.logo img {
  border: none;
  margin-top: 8px;
}

@media screen and (max-width: 650px) {
  .tmenu {
    font-size: 1em;
    position: absolute;
    background: #DDD;
    z-index: 9;
    top: 0;
    right: 0;
  }
  
  .tmenu li, .tmenu a {
    display: block;
    width: 100%;
    padding-right: 1em;
  }
  
  .tmenu ul {
    display: none;
  }
  
  #hamburger {
    display: block;
    overflow: hidden;
  }
}

/* ---- Content ---- */
/* 
Typography

styleguide 1
*/
/*
Headers

H1-H4 headers

Markup: 
<h1>Header1</h1>
<h2>Header2</h2>
<h3>Header3</h3>
<h4>Header4</h4>

Styleguide 1.1
*/
h1, .color-h1 {
  color: #F16000;
}

h2, h3, h4 {
  color: black;
}

h1, h2, h3, h4 {
  line-height: 1.2;
}

h2, h3, h4 {
  margin: 1.75em 0 1em 0;
}

h1, .size-h1 {
  font-size: 1.85em;
  font-weight: 700;
}

h2 {
  font-size: 1.45em;
}

h3 {
  font-size: 1.2em;
  /*margin-bottom: 0.3em*/
}

h4 {
  font-size: 1em;
}

h2:first-child, h3:first-child, h4:first-child {
	margin-top: 0;
	padding-top: 0;
}

/*
Subheader

Markup: 
<p class="subheader">This is a subheader</p>

Styleguide 1.2
*/
.subheader, .subtitle {
  font-size: 1.1em;
}

h1 + .subheader, h1 + .subtitle {
  margin-top: 0.5em;
  margin-bottom: 1em;
  font-size: 1.3em;
  line-height: 1.3em;
  font-weight: 600;
  color:    #444444;
}

/* blog.css  
h1  + .subheader {
  margin-top: -0.5em;
  margin-bottom: 1.8em;
}
*/
h2 + .subheader, h2 + .subtitle {
  margin-top: -0.75em;
  margin-bottom: 1em;
  font-size: 1.3em;
  line-height:1.2em;
  font-weight: 400;
  color: #333333;
}

/* blog.css  
h2  + .subheader {
  margin-top: -1em;
}
*/
/*
Paragraph

.accent - paying user's attention
.quote-long - quote without author, or long quote

Markup:
<p class="{{modifier_class}}">At one point scientists believed the brain stopped growing new neural 
pathways as we grew older. While certainly the first years of childhood 
are developmentally dynamic, the latest research shows you can grow new 
pathways at any point in your life.</p> 

styleguide 1.3
*/
p {
  margin-bottom: 1.5em;
}

p:last-child {
  margin-bottom: 0;
}

/*
Lists

Markup:
<ol>
<li>Item 1
<li>Item 2
<li>Item 3
</ol>
<ul>
<li>Item 1
<li>Item 2
<li>Item 3
</ul>

styleguide 1.5
*/
ol, ul {
  margin-bottom: 1em;
  margin-left: 1.5em;
}

li {
  margin-bottom: 1em;
}

.accent, .quote, .quote-long {
  line-height: 1.6;
  margin: 1.5em 0;
  padding: 1em;
  font-size: 1em;
  color: #000;
}

.quote-long {
  border-left: 3px solid #CCC;
  background-color: #F8F8F8;
}

.accent {
  border-left: 3px solid #FFD061;
  background-color: #FCF6C8;
}

/*
Quote

Use quote for max 3 lines. The next paragraph (author) is formatted automatically.

Markup:
<p class="quote">At one point scientists believed the brain stopped 
growing new neural pathways as we grew older.</p> 
<p><b>Person</b>, Organization and title </p> 

styleguide 1.4
*/
.quote {
  border-radius: 7px;
  font-family: georgia;
  background-color: #DEDEDE;
  letter-spacing: 0.3px;
  position: relative;
  font-size: 1.2em;
  top: 0px;
  left: 0px;
}

.quote:after {
  content: '';
  position: absolute;
  display: block;
  bottom: -20px;
  width: 0;
  height: 0;
  border-right: 30px solid #DEDEDE;
  border-left: 0px solid transparent;
  border-top: 20px solid transparent;
  border-bottom: 20px solid transparent;
}

.quote + p {
  display: inline-block;
  position: relative;
  font-size: 0.9em;
  top: -24px;
  padding-left: 90px;
  color: #666;
}

@media screen and (max-width: 460px) {
  .quote + p {
    top: -5px;
    padding-left: 2em;
  }
}

/* ---- Media ---- */
img {
  max-width: 100%;
}

.img-right, .img-left {
  max-width: 35%;
}

.img-right {
  float: right;
  margin: 0 0 1em 1em;
  clear: right;
}

.img-left {
  float: left;
  margin: 0 1em 1em 0;
}
.img-center {
  max-width: 100%;
  margin: 1em auto 1.5em;
  display: block;
  clear: both;
}

.img-round {
  border-radius: 50%;
  border: 2px solid #8536AD;
}

.img-big {
  max-width: 50%;
  width: 50%;
}

.img-small {
  max-width: 130px;
}

.img-medium {
  max-width: 250px;
}

.img-micro {
  max-width: 80px;
}

.img-border {
  border: 1px solid #CCC;
}


@media screen and (max-width: 600px) {
  .img-right, .img-left {
    float: none;
    display: block;
    text-align: center;
    margin: 0.5em auto 1.5em;
    width: 100%;
    max-width: 100%;
  }
  
  .img-big {
    width: 100%;
  }
  
  .img-small {
    max-width: 50%;
  }
  
  .img-medium {
    max-width: 80%;
  }
}

.img-micro {
  max-width: 80px;
}

/* ---- CTA  button---- */
/*
CTA

.cta-primary - primary CTA
.cta-full.cta-primary - 100% width CTA
.cta-mid.cta-primary - .
.cta-small.cta-primary - .

Markup:
<a class="cta  {{modifier_class}}">Click Me</a>

styleguide 3
*/
.cta {
  background-position: 0% 0%;
  padding: 1em 2em;
  display: inline-block;
  font-weight: 700;
  border-radius: 4px;
  cursor: pointer;
  text-decoration: none;
  font-size: 1em;

  border: 1px solid #D35400;
  box-shadow: 0 0 5px 0 #D35400;
  background-image: linear-gradient(0, #FEE1CD 20%, #FFF);
  background-color: #FEE1CD;
  background-repeat: repeat;
  background-attachment: scroll;
}



.cta,  .cta:link, .cta:visited{
box-shadow: 2px 3px 10px 0px #8f3b03;
color:   #AF4600;
}
/* .cta-primary must come AFTER .cta so -primary color "overrides" .cta */
.cta-primary, .cta-primary:link, .cta-primary:visited, .cta-primary:focus {
      border: 1px solid #6a2b01;
  background-color: #F16000;
  color: #FFF;
    background-image: linear-gradient(0, #d95702 65%, #fec39b);
    
    }




.cta:hover {
  background-color: #FEE1CD;
 
  background-image: none;
  box-shadow: 2px 3px 16px 0px #8f3b03;
}


.cta-full {
  text-align: center;
  width: 100%;
}

/* .cta-small:visited, cta-mid:visited {
	
color: #AF4600;;
} 
*/
.cta-small {
  padding: 0.25em 0.5em;
  font-size: 0.75em;
  font-weight: 600;
}

.cta-mid {
  padding: 0.45em 1.25em;
  font-size: 0.9em;
  font-weight: 600;
}



.cta-primary:hover {
  background-color: #D35400;
 background-image: linear-gradient(0, #d95702 30%, #fec39b);
 box-shadow: 3px 4px 20px 0px #8f3b03;}



}

/* ---- Utils ---- */
/*.pb-0    {   padding-bottom: 0; }*/
.pb-0 {
  padding-bottom: 0;
}

.pb-1 {
  padding-bottom: 0.85em;
}

.mb-0 {
  margin-bottom: 0;
}

.mb-03 {
  margin-bottom: 0.3em;
}

.mb-05 {
  margin-bottom: 0.5em;
}

.mb-1 {
  margin-bottom: 1em;
}

.mb-2 {
  margin-bottom: 2em;
}

.mb-3 {
  margin-bottom: 3em;
}

.mt-0 {
  margin-top: 0;
}

.mt-05 {
  margin-top: 0.5em;
}

.mt-1 {
  margin-top: 1em;
}

.mt-2 {
  margin-top: 2em;
}

.mt-3 {
  margin-top: 3em;
}

b {
  font-weight: 700;
}

.rad7 {
  border-radius: 7px;
}


/*
Utils

.text-small - reduces font size for secondary blocks
.text-center - centers content within block
.padded - adds padding to a block
.pb-0 - padding bottom 0
.pb-1 - padding bottom ~1em
.mb-0 - margin bottom 0
.mb-03 - margin bottom 0.3em
.mb-05 - margin bottom 0.5em
.mb-1 - margin bottom 1em
.mb-2 - margin bottom 2em
.mb-3 - margin bottom 3em
.mt-0 - margin top 0
.mt-03 - margin top 0.3em
.mt-05 - margin top 0.5em
.mt-1 - margin top 1em
.mt-2 - margin top 2em
.mt-3 - margin top 3em

styleguide 5
*/
/*

*/
/* ---- Visuals ---- */
.bg-gray {
  background-color: #EFEFEF;
  color: #212121;
}

.bg-gray h1, .bg-gray h2, .bg-gray h3, .bg-gray h4 {
  color: #333;
}

.bg-attention {
  background-color: #FFD061;
}

.bg-attention h4, .bg-attention h3, .bg-attention h2, .bg-attention h1 {
  color: #333;
}

.bg-attention .subheader, .bg-attention .subtitle {
  color: #444;
}

/* First section on index page */
.orange {
  font-size: 1.2em;
  line-height: 1.2;
}

.orange h1 {
  color: #F16000;
}

.orange .text-small {
  font-size: 0.8em;
}

/* --- Forms ---- */
form {
  /*max-width: 550px;*/
  width: 100%;
}

.form-field {
  margin: 1em 0;
}

.form-field label {
  font-weight: 400;
  font-size: 1em;
  display: block;
  margin-bottom: 0.2em;
  vertical-align: top;
  line-height: 1.2;
  cursor: pointer;
}

textarea {
  width: 100%;
  font-size: 1.12em;
  padding: 0.5em;
  font-family: 'open sans', 'sourse sans pro', sans-serif;
  background: #F6F6F6;
  border-radius: 4px;
  border: 2px inset rgb(238, 238, 238);
  border-collapse: separate;
}

textarea {
  height: 180px;
}

label.check {
  margin-left: 2em;
}

label.check input {
  width: 1.2em;
  height: 1.2em;
  top: 0.2em;
  position: relative;
  margin: 0 0.3em 0 -1.8em;
  display: inline-block;
  border: 1px solid rgb(238, 238, 238);
  padding: 0.1em;
}

input:active {
  background: #FFF;
}

input:focus, textarea:focus {
  outline: 2px solid #F16000;
}

/* ---- Therapy Advisor ---- */

/* Results page */
.skill
{
	
}

div.program {
border-top: 1px solid #e35643;
margin-top:2em	;
}
div.program >p:first-child { /* Description of program*/
	color: #e35643;
	margin-bottom:0px;
	padding-bottom:0px;
	font-style:italic;
	text-transform:none;
	
	
}
div.program > p +p {
	color: #e35643;
	margin-top:0px;
	padding-top:0px;
	font-weight:bolder;
	
}


/* custom checkbox */
.therapy-item [type=checkbox] {
  width: 30px;
  height: 30px;
  padding: 0;
  border: 2px solid #999;
  background-color: #EEE;
  display: inline-block;
  float: left;
  margin-left: 8px;
  margin-top: 0.75em;
}

.therapy-item [type="checkbox"]:checked, .therapy-item [type="checkbox"]:not(:checked) {
  left: -9999px;
  position: absolute;
}

.therapy-item label {
  display: block;
  padding: 0.75em 0.5em 0.75em 45px;
  cursor: pointer;
  position: relative;
}

.therapy-item [type="checkbox"]:checked + label, .therapy-item [type="checkbox"]:not(:checked) + label {
}

.therapy-item [type="checkbox"]:checked + label:before, .therapy-item [type="checkbox"]:not(:checked) + label:before {
  content: '';
  position: absolute;
  top: 12px;
  left: 7px;
  width: 30px;
  height: 30px;
}

.therapy-item [type=checkbox]:checked + label:before {
  background-image: url('../images/check_on.png');
}

.therapy-item [type="checkbox"]:not(:checked) + label:before {
  background-image: url('../images/check_off.png');
}

.therapy-skill {
  margin-bottom: 0.5em;
  /*margin-top: 1.5em;*/
}

.therapy-item {
  /*padding: 0.75em 0.5em 0.75em 45px;*/
  /*cursor: pointer;*/
  border-top: 1px solid #E5E5E5;
}

.therapy-skill + .therapy-item {
  border-top: 1px solid transparent;
}

.therapy-item:hover {
  color: #000;
  background: #F5F5F5;
  box-shadow: 0 0 5px 1px #BBB;
  border-top: 1px solid transparent;
}

.therapy-item:hover .therapy-check {
  /*transform: scale(1.08);*/
}

.therapy-issue {
  font-size: 1em;
  font-weight: 700;
  padding: 0.3em 0;
  display: inline;
}

.th-example {
  display: inline-block;
  position: relative;
  background-color: #FFE361;
  color: #000;
  font-size: 15px;
  padding: 7px;
  line-height: 16px;
  font-weight: 400;
  /*top: -45px;*/
  border-radius: 3px;
  left: 7px;
  top: 1px;
}

.th-example:after {
  content: ' ';
  display: block;
  position: absolute;
  width: 0;
  height: 0;
  border-left: 7px solid transparent;
  border-right: 7px solid transparent;
  border-top: 10px solid #FFE361;
  top: 100%;
  left: 8px;
}

.therapy-med {
  font-size: 0.9em;
  color: #666;
  margin-top: -5px;
  margin-bottom: 10px;
  display: none;
}

.therapy-details {
}

.therapy-test {
  font-size: 0.85em;
  margin-top: 0.5em;
  display: none;
}

.therapy-test p {
  margin: 0.5em 0;
}

.right {
  float: right;
  margin: 0 0 1em 1em;
}

/*
@media screen and (max-width: 400px) {
  .right {
    float: none;
    display: block;
    margin: 0.5em 0;
    width: 100%;
    text-align: center;
  }
}
*/
/* ---- Team widget ---- */
.team {
  float: left;
  width: 26%;
  /*150px;*/
  min-width: 160px;
  margin-bottom: 1em;
  /*margin: 1px 2em 1em 0;*/
  text-align: center;
  padding: 0.3em;
}

.team-img {
  width: 150px;
  height: 150px;
  margin-bottom: 0.5em;
  border: 1px solid #DDD;
  border-radius: 50%;
}

.team-name {
  font-size: 0.8em;
  font-weight: 700;
}

/* ---- Expander ----*/
.hidden {
 display: none; 

}

a.expander {
	font-weight: 600;
  font-size: 0.7em;
}
a.expander, .link-dashed {
  
  border-bottom: 1px dashed;
  text-decoration: none;
}

a.expander:after, {
  font-family: sans-serif;
  content: ">";
  display: inline-block;
  padding-left: 4px;
  vertical-align: middle;
}

/* ---- Accordion widget ---- */
.accordion {
  width: 100%;
}

.accordion-item {
  /*margin-bottom: 1.5em;*/
}

.accordion-item-header {
  border-top: 1px solid #DDD;
  padding: 1em;
  cursor: pointer;
  margin-bottom: 0.5em;
}

.accordion-item:last-child {
  border-bottom: 1px solid #DDD;
}

.accordion-item-header:hover, .accordion-item-header-isselect {
  background-color: #F5F5F5;
  /*#efefef;*/
}

.accordion-item-header {
  margin: 0;
  line-height: 1;
  -webkit-user-select: none;
}

.accordion-item-header p, .accordion-item-header h4 {
  margin: 0 0 0.5em;
  line-height: 1;
  color: #333;
}

.accordion-item-header p {
  margin-bottom: 0;
}

.accordion-item-header .fa {
  float: right;
  /*margin-right: 0.5em;*/
  position: relative;
  op: 0.6em;
  transform: translateY(-2px) rotateX(0);
  transition: all 0s;
}

.accordion-item-header:hover .fa {
  transform: translateY(0);
  transition: all 0.3s;
}

.fa.rot.rot {
  transform: translateY(0) rotateX(180deg);
  transition: all 0.3s;
}

.accordion-item-body {
  padding-left: 1em;
  margin-top: 1em;
  /*border-bottom: 1px solid #ddd;  */
}

/* ---- Pricing Page ---- */
.pricing-item {
  padding: 0.5em 0;
  border-bottom: 1px solid #DDD;
  /*max-width: 600px;
  width: 66%;*/
}

@media screen and (max-width: 600px) {
  .pricing-item {
    width: 100%;
    max-width: 100%;
  }
}

.pricing-item h3 {
  margin: 0.5em 0;
  color: #333;
}

.pricing-item p, ul {
  margin-bottom: 0.3em;
}

.pricing-item li {
  margin-bottom: 0;
}

.pricing-price {
  float: right;
  font: 0.9em;
  margin-left: 1em;
  text-align: right;
  line-height: 1.2;
}

.pricing-price-num {
  font-size: 1.85em;
  font-weight: 600;
}

.pricing-tag {
  padding: 0.3em;
  border-radius: 3px;
  font-size: 0.9em;
  font-weight: 400;
}

.black {
  color: #FFF;
  background-color: #333;
}

.orange {
  color: #FFF;
  background-color: #F16000;
}

.orange-fore {
  color: #F16000;
}

/* ---- Reveal Widget ---- */
.reveal {
  display: block;
  height: 160px;
  overflow: hidden;
  position: relative;
  margin-bottom: 1em;
  outline: 1px solid red;
}

.reveal-more {
  position: absolute;
  /*height: 2em;*/
  /*opacity: 0.9;*/
  background-image: linear-gradient( 0deg rgba(255,255,255,0.2), #ddd 10% );
  bottom: 0;
  z-index: 2;
  padding: 0.5em;
}

/* --------------- new Testimonial style ------- */
.q-body {
  margin: 1em auto;
  max-width: 55em;
}

/* narrow layout */
.q-narrow .q-voice {
  border-left: none;
  border-top: none;
}

.q-narrow .q-voice-image {
  float: none;
}

.q-narrow .q-voice-content {
  margin: 0;
}

.q-narrow .q-voice-cite {
  text-align: center;
}

.q-voice {
  margin-bottom: 1em;
  max-width: 45em;
  /* optimal line width */
}

.q-clearfix {
  display: table;
  height: 0;
  clear: both;
}

.q-voice-image {
  padding: 1em;
  text-align: center;
  float: left;
  width: 160px;
}

.q-voice-image img {
  border-radius: 50%;
  border: 2px solid #8536AD;
}

.q-voice-image-name {
  font-weight: 600;
}

.q-voice-image-place {
  font-size: 0.8em;
}

.q-voice-content {
  padding: 1em;
  margin-left: 150px;
}

.q-voice-cite {
  font: 400 1.3em georgia;
  line-height: 1.6;
  font-style: italic;
  text-align: left;
}

.q-long-cite

{
  font: 400 1em georgia;
  line-height: 1.6;
  font-style: italic;
  text-align: right;
}

.q-voice-cite:first-letter {
  padding-left: 1.25em;
}

.q-voice-cite-s {
  font-size: 2.45em;
  font-weight: 600;
  color: #CCC;
  padding-right: 0.15em;
  padding-top: 0.35em;
  line-height: 0;
  float: none;
}

.q-voice-text {
  padding-top: 1em;
}

@media screen and (max-width: 540px) {
  .q-voice {
    border-left: none;
    border-top: none;
  }
  
  .q-voice-image {
    float: none;
    text-align: center;
    margin: auto;
  }
  
  .q-voice-content {
    margin: 0;
  }
  
  .q-voice-cite {
    text-align: center;
  }
}