/*Default | Phone Size */
*,*:before,
*:after{
  -moz-box-sizing:border-box; 
  -webkit-box-sizing:border-box;
  box-sizing:border-box }

 html,body { 
    font-size:19px;
    margin: 0;
    padding: 0;}

  body{
    background:#fff;
    color:#4B4B4B;
    padding-top: 60px;
    padding-bottom: 40px;
  
    padding: 0;
    margin:0;
  
    font-family: 'Raleway', sans-serif;
    font-weight: 300;
    line-height:1;

    position:relative;
    height: 100%}


  #container{
    min-height:100%;
   position:relative;}




/*TEXT & HEADERS*/
  p{ 
     font-family: 'Raleway', sans-serif;
     font-weight: 400;
     font-size: 19px;
     line-height: 1.6;
     margin: 0 0 .5em 0;
     text-rendering: optimizeLegibility; }

  h1, h2, h3 {
    font-family: 'Raleway', sans-serif;
    font-weight: 300;
    color: #4B4B4B;
    text-rendering: optimizeLegibility;
    margin: 0em;
    padding: 0em;}
  
  h1 {
    font-size: 1.8em;
    position: relative;
    color: #46A5BC;
    padding: 0em 0em .125em 0em;
    margin: 0em;}

  h2 {
    font-size: 1.125em;
    font-weight: 600;
    margin: 0em;
    padding: .5em 0 0em 0;}

  h3 {
    font-size: 1.125em;}





/* a LINKS*/ 
  a {
    color: #46A5BC;
    font-family: 'Raleway', sans-serif;
    text-decoration: none;
    line-height: inherit;
    cursor: pointer;
    font-size: 100%; }

  a:hover, a:focus {
    color: #9AD3D8;}

  a.button {
    background: #46A5BC;
    padding: 15px 30px;
    color: white;
    border-radius: 4px;
    margin-top: 2em;}

  a.button:hover, a:focus{
    background: #9AD3D8;}

  p.appt-button{
    margin: 1em 0em 2em 0;
    float: left;}

  a.non-blue-link{
    color: #4B4B4B;}

  a.non-blue-link:hover, a:focus{
    color: #9AD3D8;}


/*STRUCTURE ROWS & COLUMNS CLEARS & DIVIDERS*/
  .row {
    width: 100%;
    margin-left:auto;
    margin-right: auto;
    margin-top: 0em;
    margin-bottom: 0;
    max-width: 62.5em;
    padding: 0em;}

  .column, .columns {
    position: relative;
    width: 100%;
    padding-left: 1em;
    padding-right: 1em;
    float: left;}  
 
  .hrclear {
    clear: both;
    margin: 0px;
    padding: 0px;
    visibility: hidden;}
 
  .gold-line{
    width: 100%;
    height: 4px;
    background: #D9AA68;}





/*SECTION BREAKS*/
 
  .section{
   padding: 2em 0em;}

  .gray-section{
    background: #eee;
    padding: 2em 0 50em 0;
    margin-top: 2em;
    width:100%;}

  .intro-section{
    margin: 10em 0em 0em 0em;} 

  #patient-forms{
    background: #eee;
    padding: 2em 2em 2em 2em;}

  #contactform{
    background: #eee;
    padding: 2em 0 840px 0;
    margin-top: 2em;
    width:100%;}

  .coupon-section{
    padding: 2em 2em 0em 2em;}

  .meet-section{
    padding-left: 0em;}

  .space{
    padding: 0em 0em 2em 0em;}  






/*IMAGES*/

  .img-responsive {
    max-width: 100%;
    height: auto;}

  @media \0screen {
  img { 
    width: auto; /* for ie 8 */}

  }

  img#matt-mobile {
    padding: 1.5em 0em 1em 0em;}

   img#matt-desktop {
    display: none;
    padding: .3em 0 0 0;}

  img#brainmd.img-responsive{
    display: block;
    margin: auto;
    width: 80%;}

  img#office-image {
    padding: 1em 0em 1em 0em;}  



/*LISTS UL LI*/
  ul { 
    list-style-type: none;
    display: block;
    margin:0;
    padding: 0;}
  
  ul li {
    display: block;
    margin: 0;
    padding: .7em 0 .7em 0;}

  ul.social-media {
    display: inline-block;
    float: none;
    margin: 0em .5em}

  ul.social-media li{
    display: inline-block;
    padding: 0em;}

  li.space-hours{
    padding: .25em 0em 0em 0em;}

  li.space-hours-friday{
    padding: 1em 0em 0em 0em;}

  li.specialize {
    padding: .5em 0 .6em 0;
  }

  .form-icon{
    width: 14px;
    margin-right: 2px;}

  .list-icon{
    margin-top: 5px;}

  ul.contact-list li{
    padding: 0em;
    margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    padding-inline-start: 0px;}




 
/*BRAINMD SPECIFIC*/

  .coupon {
      background-color: #D9AA68;
      height: 165px;
      margin: .25em 0 0 0;
      padding:  0em;}

  #supplements {
    padding-top: 2em;}

  #brain{
      background: #FDF6F0;
      width: 100%;
      margin-top: 2em;}






/*CONTACT SPECIFIC*/

  .contact{
    padding-top: 2em;}

  .large-7.columns.map {
    padding-bottom: 5em;}

  img#map{
    padding: 1.5em 0em 0em 0em;}
    
  p.code {
    text-align: center;
    color:#4B4B4B;
    line-height: 1.5em;}

  h2.code{
    margin: 0em;
    text-align: center;}

  .border {
    border-style: dashed;
    border-color: #fff;
    border-width: 2px;
    padding: 20px;
    margin: 10px;
    height: 145px;}

  iframe.map{
    display: none;}

/*BLOG SPECIFIC*/
  
 .card {
  border: 2px solid rgb(238, 238, 238);
  box-shadow: 0 4px 4px 0 rgba(0,0,0,0.2);
  transition: 0.3s;
  padding: 30px 60px 30px 60px;
  margin: 20px 0px 40px 0px;}

  .card:hover {
  box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2);}

  p.card-text{
    color: #000;
    margin-top: .5em;}

  h2.card-header{
    font-size: 1.5em;}

  p.end-blog{
    margin-bottom: 60px;}


/*-------------------TRANSITION SIZE---------------------------*/

@media only screen and (min-width: 600px){

  .gray-section{
    background: #eee;
    padding: 2em 0 44em 0;
    margin-top: 2em;
    width:100%;}

}


/*-------------------TABLET/DESTKOP---------------------------*/

/*TABLET/DESKTOP*/

@media only screen and (min-width: 920px){

/*STRUCTURE FOR TABLET/DESKTOP*/

  .large-1{
    position:relative;
    width:8.3333%}
  .large-2{
    position:relative;
    width:16.66667%}
  .large-3{
    position: relative;
    width:25%;}
  .large-4{
    position:relative;
    width:33.33333%}
  .large-5{
    position: relative;
    width:41.66666%;}
  .large-6{
    position:relative;
    width:50%}
  .large-7{
    position: relative;
    width:58.3333%;}
  .large-8{
    position:relative;
    width:66.66667%}
  .large-10{
    position:relative;
    width:83.33333%}
  .large-12{
    position:relative;
    width:100%}

  .column, .columns {
    padding-left: 0em;
    padding-right: 0em;}  

  .row {
    width: 960px;
    max-width: 100%;
    min-width: 768px;
    margin: 0 auto;}





/*NAVIGATION*/

  #logo {
    padding: 0em 0em 0em 2em;
    display: inherit;}  

  #logo-mobile{
    display: none;}






/*TEXT AND HEADERS*/

  p{ 
    font-size: 19px;
    text-rendering: optimizeLegibility; 
    line-height:1.7;}

  h1 {
    font-size: 2em;} 


  p.appt-button{
    margin: 2em 1em 3em 0;
    float: left;}


/*IMAGES*/
  #header-image{
    background:url('images/home-heroimage-desktop.jpg') no-repeat;
        webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover; 
    padding-top: 35%; }

  #about-image{
    background:url('images/about-image-desktop.jpg') no-repeat;
        webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover; 
    padding-top: 35%; }

   #aboutamanda-image{
    background:url('images/about-amanda-desktop.jpg') no-repeat;
        webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover; 
    padding-top: 35%; }

  #aboutjoshua-image{
    background:url('images/about-joshua-desktop.jpg') no-repeat;
        webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover; 
    padding-top: 35%; }
    
    
  #aboutmickie-image{
    background:url('images/about-mickie-desktop.jpg') no-repeat;
        webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover; 
    padding-top: 35%; }


  #brainmd-image{
    background:url('images/BrainMD-image-desktop.jpg') no-repeat;
        webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover; 
    padding-top: 35%; }

  #newpatient-image{
    background:url('images/newpatient-image-desktop.jpg') no-repeat;
        webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover; 
    padding-top: 35%; }

  #contact-image{
    background:url('images/contact-image-desktop.jpg') no-repeat;
        webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover; 
    padding-top: 35%; }

   #blog-image{
    background:url('images/blog-image-desktop.jpg') no-repeat;
        webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover; 
    padding-top: 35%; }

  img#matt-desktop {
    display: inherit;}

  img#matt-mobile {
    display: none;}

/*BLOG IMAGES*/ 

 #blog-panic-strikes-image{
    background:url('images/panic-strikes.jpg') no-repeat;
        webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover; 
    padding-top: 35%; }

 #blog-adoption-image{
    background:url('images/adoption.jpg') no-repeat;
        webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover; 
    padding-top: 35%; }

 #blog-control-image{
    background:url('images/control.jpg') no-repeat;
        webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover; 
    padding-top: 35%; }


/*SECTION BREAKS*/
  
  .gray-section{
    background: #eee;
    padding: 2em 0 26em 0;
    margin-top: 2em;
    width:100%;}

  .intro-section{
    margin: 2em 0em 0em 0em;}

  .left-column {
    margin: 2em 0em 0em 2em;}

  .large-8.columns.new-patient{
    padding: 0em 2em 60px 0em;}

  .coupon-section{
    padding: 0em;}

  .meet-section{
    padding-left: 2em;}

  .space{
    padding: .5em 1em 2em 0em;}






/*BRAIN MD*/

  .coupon {
    margin: 1em 1em 0em 0em;
    padding:0em;} 





/*CONTACT*/
  #contact-section{
    padding-top: 2em;}

  iframe.map{
    display: inherit;}

  img#map{
    display: none;}

  ul.social-media {
    display: inline-block;
    float: right;
    margin: 0em}

} /*END OF @Media Tablet and Desktop*/