//----Content style----//

//--variables

// p
$p_fontSize         : 18;
$p_fontFamily       : $font_primary;
$p_fontStyle        : normal;
$p_fontWeight       : 400;
$p_textTransform    : none;
$p_lineHeight       : 1.5;
$p_opacity          : 1;
$p_color            : rgba($black, $p_opacity);

// a
$a_fontSize         : $p_fontSize ;
$a_fontFamily       : $font_primary;
$a_fontStyle        : normal;
$a_fontWeight       : 600;
$a_color            : $black;
$a_colorHover       : $white;
$a_textTransform    : none;
$a_textDecoration   : none;
$a_transition       : transform .3s $easeOutQuart;

//small //date post
$small_fontSize     : $p_fontSize ;
$small_fontFamily   : $font_primary;
$small_fontStyle    : normal;
$small_fontWeight   : 600;
$small_textTransform: none;
$small_opacity      : .5;
$small_color        : rgba($black, $small_opacity);

//strong & b
$strong_fontSize     : $p_fontSize ;
$strong_fontFamily   : $font_primary;
$strong_fontStyle    : normal;
$strong_fontWeight   : 600;
$strong_color        : $black;
$strong_textTransform: none;

//em & i
$em_fontSize         : $p_fontSize;
$em_fontFamily       : $font_primary;
$em_fontStyle        : italic;
$em_fontWeight       : 400;
$em_color            : $black;
$em_textTransform    : none;

//blockquote
$blockquote_fontSize         : $p_fontSize ;
$blockquote_fontFamily       : $font_primary;
$blockquote_fontStyle        : italic;
$blockquote_fontWeight       : 400;
$blockquote_color            : $black;
$blockquote_textTransform    : none;

//code
$code_fontSize         : 14;
$code_background       : rgba($lightgrey, .5);
$code_color            : $black;
$code_padding          : 20px;

//address
$address_fontSize      : $p_fontSize ;
$address_fontFamily    : $font_primary;
$address_fontStyle     : normal;
$address_fontWeight    : 400;
$address_color         : $black;
$address_textTransform : none;

// time

$time_fontSize         : $p_fontSize ;
$time_fontFamily       : $font_primary;
$time_fontWeight       : 600;
$time_fontStyle        : normal;
$time_color            : rgba($black, .5);
$time_textTransform    : none;
//----Content style----//

//--tags

// p
%p{
  //font-size
  @include rem-size($p_fontSize);

  font-family:     $p_fontFamily;
  font-style:      $p_fontStyle;
  font-weight:     $p_fontWeight;
  // opacity:         $p_opacity;
  color:           $p_color;
  // text-transform:  $p_textTransform;
  line-height:     $p_lineHeight;
}
p, li{ @extend %p; }


// a
%a{
  //font-size
  // @include rem-size($a_fontSize);

  font-family:     $a_fontFamily;
  font-style:      $a_fontStyle;
  font-weight:     $a_fontWeight;
  color:           $a_color;
  text-transform:  $a_textTransform;

}

a{ @extend %a; }


// small
%small{
  //font-size
  // @include rem-size($small_fontSize);

  font-family:     $small_fontFamily;
  font-style:      $small_fontStyle;
  font-weight:     $small_fontWeight;
  color:           $small_color;
  text-transform:  $small_textTransform;
  // opacity:         $small_opacity;

}
.small, small{
  @extend %small;
}


// strong & b
%strong{
  //font-size
  // @include rem-size($strong_fontSize);

  font-family:     $strong_fontFamily;
  font-style:      $strong_fontStyle;
  font-weight:     $strong_fontWeight;
  color:           $strong_color;
  text-transform:  $strong_textTransform;

}

strong, b, cite{
  @extend %strong;
}


// em & i
%em{
  //font-size
  // @include rem-size($em_fontSize);

  font-family:     $em_fontFamily;
  font-style:      $em_fontStyle;
  font-weight:     $em_fontWeight;
  color:           $em_color;
  text-transform:  $em_textTransform;

}

em, i, .em{
  @extend %em;
}


// blockquote
%blockquote{
  //font-size
  @include rem-size($blockquote_fontSize);

  font-family:     $blockquote_fontFamily;
  font-style:      $blockquote_fontStyle;
  font-weight:     $blockquote_fontWeight;
  color:           $blockquote_color;
  text-transform:  $blockquote_textTransform;

}

blockquote, q{
  @extend %blockquote;
  // &:before, &:after{
  //   content:'« ';
  //   font-style:      $blockquote_fontStyle;
  //   font-family:     $blockquote_fontFamily;
  //   font-size:       $blockquote_fontSize;
  //   // opacity: .5;
  //   line-height: 0;
  // }
  // &::after{
  //   content: " »";
  // }
  & > * {
    display: inline;
    font-size:       $blockquote_fontSize;
    font-family:     $blockquote_fontFamily;
  }
}


// code
%code{
  //font-size
  @include rem-size($code_fontSize);
  color:           $code_color;
  background:      $code_background;
  padding:         $code_padding;

}
code{
  @extend %code;
}


%hr{
  height: 1px;
  background: rgba($black,.1);
  margin-top: 10px;
  margin-bottom: 20px;
}
hr{
  @extend %hr;
}

%address {
  font-family:    $address_fontFamily;
  font-weight:    $address_fontWeight;
  font-style:     $address_fontStyle;
  color:          rgba($black, 1);
  text-transform: $address_textTransform;
}

address {
  @extend %address;
}

%time {
  font-family:    $time_fontFamily;
  font-weight:    $time_fontWeight;
  font-style:     $time_fontStyle;
  color:          $time_color;
  text-transform: $time_textTransform;
}

time {
  @extend %time;
}

.m_content{

  p{
    @extend %p;
    // font-weight: 800;
    margin-bottom: 30px;
  }
  a{
    @extend %p;
    text-decoration: underline;
    color: $darkred;
    &:hover,
    &:focus {
      color: $black;
    }

    &.btn {
      color: $white;
      text-decoration: none;
      font-size: 12px;
      font-stretch: normal;
      font-weight: bold;
      line-height: 1;
    }
  }

  ul, ol{
    max-width: 750px;
    padding-left: 2%;
    margin: 25px 0;
  }
  li{
    margin-bottom: 10px;
  }
  h1, h2, h3, h4, h5, h6{
    margin-bottom: 20px;
    max-width: 750px;
  }
  p + h1, p + h2,p + h3,p + h4,p + h5,p + h6{
    margin-top: 50px;
  }

  blockquote{
    margin: 30px 0;
    color: rgba($black, .75);
  }
}
u{
  text-decoration: underline;
}
s, del{
  text-decoration: line-through;
}
img{
  width: 100%; height: 100%;

  max-width: 100%;

  display: block;

}