/* ---------------------------------
----------------- Loading Fonts
--------------------------------- */

/*
font-family: 'Assistant', sans-serif;
font-weight: 400,600,700,800;
*/

@import url('https://fonts.googleapis.com/css?family=Assistant:400,600,700,800&display=swap');

/* ---------------------------------
----------------- Basic Reset
--------------------------------- */

html, body, div, hgroup, h1, h2, h3, h4, h5, h6, p, blockquote, address, time, span, em, strong, img, ol, ul, li {
   margin: 0px;
   padding: 0px;
   border: 0px;
}

header, section, footer, aside, nav, main, article, figure, canvas, video  {
   display: block;
   margin: 0px;
   padding: 0px;
   border: 0px;
}

/*================================
=============== WordPress Core Code
==================================*/

.alignnone {
   margin: 8px 0px 0px 0px;
}

.aligncenter,
div.aligncenter {
   display: block;
   margin: 10px auto 20px auto;
}

.alignright {
   float:right;
   margin: 10px 0px 5px 20px;
}

.alignleft {
   float: left;
   margin: 10px 20px 5px 0px;
}

.wp-caption {
   background: #fff;
   border: 1px solid #eaeaea;
   max-width: 96%; /* Image does not overflow the content area */
   /* width: auto !important; */
   padding: 10px 5px 5px 5px;
   text-align: center;
}

.wp-caption.alignnone {
   margin: 10px 20px 10px 0px;
}

.wp-caption.alignleft {
   margin: 10px 20px 10px 0px;
}

.wp-caption.alignright {
   margin: 10px 0px 10px 20px;
}

.wp-caption img {
   border: none;
   height: auto;
   margin: 0px 0px 0px 0px;
   max-width: 98%;
   padding: 0px 0px 0px 0px;
   width: auto;
}

.wp-caption p.wp-caption-text,
.gallery .gallery-caption,
.image-page-caption p {
   font-size: 13px;
   line-height: 17px;
   margin: 0px 0px 0px 0px;
   padding: 4px 5px 4px 5px;
   color: #767676;
}

.sticky {} /* sticky post style */

/*------ Text meant only for screen readers -------- */

.screen-reader-text {
   clip: rect(1px, 1px, 1px, 1px);
   position: absolute !important;
   white-space: nowrap;
   height: 1px;
   width: 1px;
   overflow: hidden;
}

.screen-reader-text:focus {
   background-color: #f1f1f1;
   border-radius: 3px;
   box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
   clip: auto !important;
   color: #21759b;
   display: block;
   font-size: 14px;
   font-size: 0.875rem;
   font-weight: bold;
   height: auto;
   left: 5px;
   line-height: normal;
   padding: 15px 23px 14px;
   text-decoration: none;
   top: 5px;
   width: auto;
   z-index: 100000; /* Above WP toolbar. */
}

/*------ IE older browsers support -------- */

img.size-large,
img.header-image,
img.wp-post-image,
img[class*="attachment-"] {
   height: auto;
   width: auto; /* Prevent stretching of full-size and large-size images with height and width attributes in IE8 */
}

/* ---------------------------------
----------------- Mobile
--------------------------------- */

@media only screen and (max-width: 768px) {

   .alignnone,
   .alignright,
   .alignleft,
   .aligncenter,
   a img.alignright,
   a img.alignleft {
      float: none;
      margin: 10px auto 15px !important;
      display: block;
   }

   .wp-caption.alignnone,
   .wp-caption.alignleft, 
   .wp-caption.alignright {
      margin: 15px auto 15px !important;;
   }

}

/*================================
=============== Theme Reset
==================================*/

h1, h2, h3, h4, h5, h6, p, span, 
object, blockquote, pre, address, cite, code, .contentdel, ul, ol,
small, strong, sub, sup, b, i, fieldset, label, legend, table {
   color: inherit;
}

h1, h2, h3, h4, h5, h6, p, ol, ul, table {
   color: #4a4949;
}

a,
a:visited,
a:active,
a:focus,
a:hover {
   color: #2020fe;
   text-decoration: none;
}

h1, h2, h3, h4, h5, h6 {
   display: block;
   padding: 4px 0px 4px 0px;
   font-weight: bold;
   font-family: 'Assistant', Tahoma, Geneva, Verdana, sans-serif;
   line-height: 1.1;
}

h1 {font-size: 40px;}
h2 {font-size: 30px;}
h3 {font-size: 25px;}
h4 {font-size: 23px;}
h5 {font-size: 21px;}
h6 {font-size: 19px;}

.single-post h1 {font-size: 40px;}
.single-post h2 {font-size: 27px;}
.single-post h3 {font-size: 21px; font-weight: normal; text-decoration: underline;}
.single-post h4 {font-size: 20px; font-weight: normal;}
.single-post h5 {font-size: 18px; font-weight: normal;}
.single-post h6 {font-size: 17px; font-weight: normal;}

.h1-class {font-size: 40px;}
.h2-class {font-size: 30px;}
.h3-class {font-size: 25px;}
.h4-class {font-size: 21px;}
.h5-class {font-size: 21px;}
.h6-class {font-size: 19px;}

button, input, select, textarea {
   max-width: 100%;
   font-family: 'Assistant', Arial, 'Helvetica Neue', Helvetica, sans-serif; 
   font-size: 15px;
   letter-spacing: 0.3px;
}

ol, ul {
   font-size: 18px;
   line-height: 29px;
   letter-spacing: 0.3px;
   font-weight: normal;
   display: block;
   padding: 0px 20px 0px 0px;
   margin: 10px 0px 10px 0px;
   color: #575757;
}

ol li,
ul li {
   padding: 5px 0px 5px 0px;
}

p {
   font-size: 18px;
   line-height: 31px;
   letter-spacing: 0.3px;
   font-weight: normal;
   padding: 6px 0px 6px 0px;
   color: #575757;
}

pre {
   padding: 10px 10px 10px 10px;; 
   margin: 0px;
   line-height: 1.2;
   background: #e1e0e0;
   border: 10px solid #f5f5f5;
   outline: 1px solid #cccccc;
   overflow: auto;
   color: #000;
   white-space: pre-wrap;
}

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

iframe,
embed {
   max-width: 100%;
}

fieldset {
   border: 1px solid #cccccc;
   color: #606060;
}

.table-warp {
   max-width: 100%;
   overflow: auto;
}

table {
   border-collapse:collapse;
   text-align: center;
}

table.full-size {
   width: 100%;
}

table tr th { 
   background: #5f5f5f;
   color: #fff;
   padding: 10px 20px 10px 20px;
   border: 1px solid #dedede;
}

table tr td { 
   padding: 15px 20px 15px 20px;
   border: 1px solid #dedede;
}

.clear {
   clear: both;
}

/* ---------------------------------
----------------- Mobile
--------------------------------- */

@media only screen and (max-width: 768px) {

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

   h1 {font-size: 35px;}
   h2 {font-size: 27px;}
   h3 {font-size: 23px;}
   h4 {font-size: 20px;}
   h5 {font-size: 18px;}
   h6 {font-size: 17px;}

   .single-post h1 {font-size: 35px;}
   .single-post h2 {font-size: 27px;}
   .single-post h3 {font-size: 23px;}
   .single-post h4 {font-size: 20px;}
   .single-post h5 {font-size: 18px;}
   .single-post h6 {font-size: 17px;}

   .h1-class {font-size: 35px;}
   .h2-class {font-size: 27px;}
   .h3-class {font-size: 23px;}
   .h4-class {font-size: 20px;}
   .h5-class {font-size: 18px;}
   .h6-class {font-size: 17px;}

}

/*================================
=============== Useful class
==================================*/

.yy-align-center {
   text-align: center;
}

.yy-align-right {
   text-align: right;
}

.yy-align-left {
   text-align: right;
}

.yy-direction-ltr {
   direction: ltr;
}

.direction-ltr-inline-block {
   direction: ltr;
   display: inline-block;
}

img.image-gray-border,
.image-gray-border img {
   border: 1px solid #cecdcd;
}

img.image-white-border,
.image-white-border img {
   border: 1px solid #fff;
}