html, body {
    font-family: 'Roboto', 'Helvetica', sans-serif;
    margin: 0;
    padding: 0;
}
a {
    text-decoration: none;
}
table {
    border-bottom: 1px solid #ededed;
    border-collapse: collapse;
    border-spacing: 0;
    font-size: 14px;
    line-height: 2;
    margin: 0 0 20px;
    width: 100%;
}
th, td {
    font-weight: normal;
    text-align: left;
}
th {
    font-weight: bold;
    text-transform: uppercase;
}
td {
    border-top: 1px solid #ededed;
    padding: 6px 10px 6px 0;
}
figure {
    margin: 0px;
}
.mdl-button {
    text-transform: inherit;
}
.mdl-button--with-icon i {
    vertical-align: middle;
}
.site-width {
    max-width: 1080px;
}
.mdl-grid.full {
    max-width: 100%;
}
.mdl-card{
    min-height: auto;
}

/*common class*/

.clear {
    clear: both;
}
.hide {
    display: none;
}
.section-spacer {
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -ms-flex-positive: 1;
    /* flex-grow: 1; */
}
.required {
    color: rgb(222, 50, 38);
}
.text-center {
    text-align: center;
}
.text-right {
    text-align: right;
}
.text-left {
    text-align: left;
}
.alert__error, .alert__info, .alert__success, .alert__warning {
    background-color: #FFC107;
    padding: 0px 10px;
    vertical-align: middle;
    display: inline-block;
    line-height: 25px;
    height: auto;
    color: #000;
    padding: 15px 15px;
}
.alert__error {
    background-color: #F44336;
}
.alert__info {
    background-color: #2196F3;
}
.alert__success {
    background-color: #4CAF50;
}
.alert__error i, .alert__info i, .alert__success i, .alert__warning i {
    color: inherit;
    margin-right: 10px;
    vertical-align: middle;
    margin-top: -2px;
}


/*header*/

.site-header a {
    text-decoration: none;
    color: #fff;
}
.site-header .img-logo {
    height: 105px;
    max-height: 90%;
    margin-right: 15px;
    vertical-align: middle;
}
.small-header.site-header .img-logo {
    max-height: 56px;
}
.site-header .site-title {
    display: inline;
    vertical-align: middle;
}
.site-header .site-description {
    font-size: 12px;
    margin: 0px 0px 0px 80px;
    vertical-align: middle;
}
.make-touch-description {
    margin-top: -45px;
}
.mdl-layout__container {
    position: relative;
}
.mdl-menu__item.has-submenu:hover .mdl-menu {
    display: block;
}

#searchform .mdl-textfield {
    width: 80%;
    margin-left: 15px;
}


/*main part*/

#main > .mdl-grid {
    padding: 8px;
    padding-top: 48px;
}
.post.mdl-card, .page.mdl-card, .comments-area.mdl-card, .gm-card.mdl-card, .attachment.mdl-card {
    width: auto;
    margin-bottom: 15px;
}
.single .post.mdl-card.section--center.format-quote {
    margin-bottom: 0px;
    padding-bottom: 0px;
}
.single-post .post.mdl-card.section--center.format-quote .meta {
    border-bottom: 0px;
    padding-bottom: 0px;
    margin-bottom: 15px;
    padding-top: 15px;
}
.gm-card.mdl-card .mdl-card__supporting-text, .post.mdl-card .mdl-card__supporting-text {
    margin: 30px 30px 10px 30px;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    padding: 0;
    color: inherit;
    width: calc(100% - 60px);
    text-align: justify;
}
.gm-card.mdl-card .mdl-card__supporting-text h1, .post.mdl-card .mdl-card__supporting-text h1 {
    margin-top: 0;
    font-size: 24px;
    margin-bottom: 20px;
}
.gm-card.mdl-card .mdl-card__supporting-text + .mdl-card__actions, .post.mdl-card .mdl-card__supporting-text + .mdl-card__actions {
    border-top: 1px solid rgba(0, 0, 0, 0.12);
}
.gm-card.mdl-card .mdl-card__actions .material-icons, .post.mdl-card .mdl-card__actions .material-icons {
    vertical-align: middle;
}
.gm-card.mdl-card .mdl-card__actions span, .post.mdl-card .mdl-card__actions span {
    margin-right: 10px;
}
.gm-card.mdl-card .meta, .post.mdl-card .meta {
    padding: 5px 30px 5px;
}
.gm-card.mdl-card .meta a, .post.mdl-card .meta a {
    color: inherit;
    font-size: 14px;
    font-weight: 400;
}
.sticky-post-icon {
    position: absolute;
    right: 25px;
    top: 15px;
    z-index: 2;
}

/*widget*/

.widget {
    margin-bottom: 15px;
    min-height: auto;
    padding: 20px;
    width: auto;
}
.widget .widget-title {
    margin: -10px -20px 10px;
    font-size: 24px;
    padding-left: 15px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.12);
}
.widget ul, .widget ol {
    list-style-type: none;
    margin: 0;
    padding: 0;
}
.widget li > ul, .widget li > ol {
    margin-left: 20px;
}
.widget li {
    padding: 5px 0;
}
.widget_calendar table, .widget_calendar td {
    border: 0;
    border-collapse: separate;
    border-spacing: 1px;
}
.widget_calendar caption {
    font-size: 14px;
    margin: 0;
    font-weight: 600;
}
.widget_calendar th, .widget_calendar td {
    padding: 0;
    text-align: center;
}
.widget_calendar a {
    display: block;
}
.widget.widget_search #searchform {
    box-shadow: none;
    margin: -20px;
}
.widget.widget_search .widget-title + #searchform {
    margin: -10px -20px -20px;
}
.widget.widget_search #searchform .mdl-textfield {
    width: 73%;
}

/*footer*/
.mdl-mega-footer .footer-top a {
    color: inherit;
}
.mdl-mega-footer {
    padding: 0px;
}
.mdl-mega-footer .footer-con {
    padding: 16px 40px;
}
.mdl-mega-footer .widget_calendar td a {
    background-color: #000;
}
footer .social-icons {
    padding: 5px;
    height: 46px;
}
footer .social-icons a {
    display: inline-block;
    margin: 5px 0px;
    background-size: contain;
    background-color: transparent;
}
footer .social-icons a.hide {
    display: none;
}
footer .social-icons .social-btn.facebook {
    background-image: url('https://www.gstatic.com/images/icons/material/system/2x/post_facebook_white_24dp.png');
}
footer .social-icons .social-btn.gplus {
    background-image: url('https://www.gstatic.com/images/icons/material/system/2x/post_gplus_white_24dp.png');
}
footer .social-icons .social-btn.twitter {
    background-image: url('https://www.gstatic.com/images/icons/material/system/2x/post_twitter_white_24dp.png');
}
footer .social-icons .social-btn.linkedin {
    background-image: url('https://www.gstatic.com/images/icons/material/system/2x/post_linkedin_white_24dp.png');
}
footer .social-icons .social-btn.youtube {
    background-image: url('https://www.gstatic.com/images/icons/material/system/2x/post_youtube_white_24dp.png');
}
footer .social-icons .social-btn.blogger {
    background-image: url('https://www.gstatic.com/images/icons/material/system/2x/post_blogger_white_24dp.png');
}
footer .social-icons .social-btn.pinterest {
    background-image: url('https://www.gstatic.com/images/icons/material/system/2x/post_pinterest_white_24dp.png');
}
footer .social-icons .social-btn.instagram {
    background-image: url('https://www.gstatic.com/images/icons/material/system/2x/post_instagram_white_24dp.png');
}
footer .social-icons .social-btn.tumblr {
    background-image: url('https://www.gstatic.com/images/icons/material/system/2x/post_tumblr_white_24dp.png');
}
.page article, .single article {
    padding: 20px 20px 20px 25px;
}
.page article header h1, .single article header h1 {
    font-size: 30px;
    margin: 0px;
    margin-bottom: 10px;
}
.page .mdl-card .meta, .single .mdl-card .meta {
    padding: 0px;
}
.page .mdl-card .meta.bordered, .single .mdl-card .meta.bordered {
    padding: 5px 25px 5px 25px;
    margin: 0px -23px 15px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.12);
    border-top: 1px solid rgba(0, 0, 0, 0.12);
}
.page .mdl-card .meta a, .single .mdl-card .meta a {
    font-weight: 400;
    font-size: 14px;
}
.page .mdl-card .meta i.material-icons, .single .mdl-card .meta i.material-icons {
    vertical-align: middle;
    font-size: 20px;
    margin-right: 2px;
}
.page .mdl-card .meta > span, .single .mdl-card .meta > span {
    margin: 0px 5px;
}
.entry-thumb {
    margin-bottom: 15px;
}
.entry-thumb img {
    width: 100%;
    height: auto;
}
.navigation.post-navigation {
    margin-bottom: 15px;
}


/*comments*/

.comments-area {
    padding: 20px;
}
.comments-area .comments-title {
    font-size: 22px;
    margin: 0px 10px;
}
.comments-area .comments-title button.counter {
    margin-left: 10px;
    font-size: inherit;
    height: auto;
    min-width: auto;
    width: auto;
    box-shadow: none;
    font-size: 20px;
    padding: 4px 10px;
    border-radius: 15px;
}
.comments-area .comment-reply-title {
    margin: -10px -20px 10px;
    font-size: 24px;
    padding-left: 15px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.12);
}
.comments-area .mdl-textfield {
    width: 100%;
}
.comments-area .comment-list {
    padding: 0px 35px 30px 35px;
    margin: 10px -20px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.12);
}
.comments-area .comment-list li.comment,
.comments-area .comment-list > li {
    margin-bottom: 15px;
}
.comments-area .comment-list li.pingback p{
    margin: 0px;
}
.comments-area .comment-list > li{
    border-bottom: 1px dashed #ddd;
    padding-bottom: 15px;
}
.comments-area .comment-list .comment,
.comments-area .comment-list > li {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
}
.comments-area .comment-list .comment > .comment__header {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 16px;
}
.comments-area .comment-list .comment > .comment__header > .avatar {
    width: 48px;
    height: 48px;
    border-radius: 24px;
    margin-right: 16px;
}
.comments-area .comment-list .comment > .comment__header > .comment__author {
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
}
.comments-area .comment-list .comment > .comment__text {
    line-height: 1.5em;
}
.comments-area .comment-list .comment > .comment__text p {
    margin-bottom: 5px;
}
.comments-area .comment-list .comment > .comment__actions {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 0.8em;
    margin-top: 16px;
}
.comments-area .comment-list .comment > .comment__actions a {
    margin-right: 16px;
}
.comments-area .comment-list .children {
    padding-top: 32px;
    padding-left: 48px;
}
.comments-area .comment-list .comment .comment-respond {
    margin-top: 15px;
    border: 1px solid rgba(0, 0, 0, 0.12);
    padding: 19px;
}
.comments-area .comment-nav {
    list-style: none;
    margin: 0px -35px;
    padding: 10px 23px;
}
.comment.bypostauthor .comment__author strong:before {
    content: "\2605";
    margin: 0 2px 0 -2px;
    position: relative;
    top: -1px;
}
.post-navigation, .comment-navigation {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    color: white;
    font-weight: 500;
}


/*post navigation*/

.post-navigation a, .comment-navigation a {
    text-decoration: none;
    color: rgba(0, 0, 0, 0.54);
}
.post-navigation .mdl-button, .comment-navigation .mdl-button {
    color: rgba(0, 0, 0, 0.54);
    background-color: white;
}
.post-navigation > .previous .mdl-button, .comment-navigation > .previous .mdl-button {
    margin-right: 8px;
}
.post-navigation > .next .mdl-button, .comment-navigation > .next .mdl-button {
    margin-left: 8px;
}
.page-nav {
    text-align: right;
}
.page-nav .page-numbers {
    margin-left: 5px;
    width: auto;
    height: 30px;
    font-size: 18px;
    padding: 0px 12px;
    line-height: 30px;
    min-width: auto;
    border-radius: 5px;
}
.page-nav .page-numbers.mdl-button--icon .material-icons {
    position: relative;
}
.page-nav .page-numbers .mdl-button__ripple-container {
    border-radius: 5px;
}
.page-nav .page-numbers.current {
    background-color: rgba(0, 0, 0, .12);
    color: rgba(0, 0, 0, .26) !important;
    cursor: auto;
}
.page-nav .page-numbers.current .mdl-button__ripple-container {
    display: none
}
.archive-header .archive-title, .page-header .page-title {
    margin: 0px;
    text-align: center;
    padding: 20px;
    font-size: 34px;
}


/*gallery*/

.gallery {
    margin-bottom: 20px;
}
.gallery:after, .gallery:before {
    content: "";
    display: table;
    clear: both;
}
.gallery-item {
    float: left;
    margin: 0 4px 4px 0;
    overflow: hidden;
    position: relative;
}
.gallery-columns-1.gallery-size-medium, .gallery-columns-1.gallery-size-thumbnail, .gallery-columns-2.gallery-size-thumbnail, .gallery-columns-3.gallery-size-thumbnail {
    display: table;
    margin: 0 auto 20px;
}
.gallery-columns-1 .gallery-item, .gallery-columns-2 .gallery-item, .gallery-columns-3 .gallery-item {
    text-align: center;
}
.gallery-columns-4 .gallery-item {
    max-width: 23%;
    max-width: -webkit-calc(25% - 4px);
    max-width: calc(25% - 4px);
}
.gallery-columns-5 .gallery-item {
    max-width: 19%;
    max-width: -webkit-calc(20% - 4px);
    max-width: calc(20% - 4px);
}
.gallery-columns-6 .gallery-item {
    max-width: 15%;
    max-width: -webkit-calc(16.7% - 4px);
    max-width: calc(16.7% - 4px);
}
.gallery-columns-7 .gallery-item {
    max-width: 13%;
    max-width: -webkit-calc(14.28% - 4px);
    max-width: calc(14.28% - 4px);
}
.gallery-columns-8 .gallery-item {
    max-width: 11%;
    max-width: -webkit-calc(12.5% - 4px);
    max-width: calc(12.5% - 4px);
}
.gallery-columns-9 .gallery-item {
    max-width: 9%;
    max-width: -webkit-calc(11.1% - 4px);
    max-width: calc(11.1% - 4px);
}
.gallery-columns-1 .gallery-item:nth-of-type(1n), .gallery-columns-2 .gallery-item:nth-of-type(2n), .gallery-columns-3 .gallery-item:nth-of-type(3n), .gallery-columns-4 .gallery-item:nth-of-type(4n), .gallery-columns-5 .gallery-item:nth-of-type(5n), .gallery-columns-6 .gallery-item:nth-of-type(6n), .gallery-columns-7 .gallery-item:nth-of-type(7n), .gallery-columns-8 .gallery-item:nth-of-type(8n), .gallery-columns-9 .gallery-item:nth-of-type(9n) {
    margin-right: 0;
}
.gallery-columns-1.gallery-size-medium figure.gallery-item:nth-of-type(1n+1), .gallery-columns-1.gallery-size-thumbnail figure.gallery-item:nth-of-type(1n+1), .gallery-columns-2.gallery-size-thumbnail figure.gallery-item:nth-of-type(2n+1), .gallery-columns-3.gallery-size-thumbnail figure.gallery-item:nth-of-type(3n+1) {
    clear: left;
}
.gallery-caption {
    background-color: rgba(0, 0, 0, 0.7);
    box-sizing: border-box;
    color: #fff;
    font-size: 14px;
    line-height: 1.3;
    margin: 0;
    max-height: 50%;
    opacity: 1;
    padding: 2px 8px;
    position: absolute;
    bottom: 0;
    left: 0;
    text-align: left;
    -webkit-transition: opacity 400ms ease;
    transition: opacity 400ms ease;
    width: 100%;
}
.gallery-caption:before {
    box-shadow: 0 -10px 15px #000 inset;
    content: "";
    height: 100%;
    min-height: 49px;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
}
.gallery-item:hover .gallery-caption {
    opacity: 0;
}
.gallery-columns-7 .gallery-caption, .gallery-columns-8 .gallery-caption, .gallery-columns-9 .gallery-caption {
    display: none;
}


/*menu*/

.main-navigation {
    clear: both;
    margin: 0 auto;
    max-width: 1080px;
    min-height: 45px;
    position: relative;
}
.main-navigation .sub-dropdown {
    display: none;
}
.main-navigation .menu-toggle {
    margin: 0px auto;
    line-height: 50px;
    font-size: 27px;
}
.main-navigation .menu-toggle i {
    vertical-align: middle;
    margin-left: 15px;
    font-size: 33px;
}

ul.nav-menu, div.nav-menu > ul {
    margin: 0;
    padding: 0 40px 0 0;
    color: #fff;
}
.nav-menu li {
    display: inline-block;
    position: relative;
    border: 2px solid transparent;
}
.nav-menu li a {
    color: inherit;
    display: block;
    font-size: 15px;
    line-height: 1;
    padding: 15px 20px;
    text-decoration: none;
}
.nav-menu li:hover > a, .nav-menu li a:hover, .nav-menu li:focus > a, .nav-menu li a:focus {
    background-color: #000;
    color: #fff;
}
.nav-menu .sub-menu, .nav-menu .children {
    background-color: #000;
    border-top: 0;
    padding: 0;
    position: absolute;
    left: -2px;
    z-index: 99999;
    height: 1px;
    width: 1px;
    overflow: hidden;
    clip: rect(1px, 1px, 1px, 1px);
}
.nav-menu .sub-menu ul, .nav-menu .children ul {
    border-left: 0;
    left: 100%;
    top: -2px;
}

ul.nav-menu ul a, .nav-menu ul ul a {
    color: #fff;
    margin: 0;
    width: 200px;
}

ul.nav-menu ul a:hover, .nav-menu ul ul a:hover, ul.nav-menu ul a:focus, .nav-menu ul ul a:focus {
    background-color: #FFF;
    color: #000;
}
ul.nav-menu li > ul, .nav-menu ul li > ul {
    opacity: 0;
    transform: translateY(0px);
    transform: translateX(-50px);
    transition: all 0.4s ease-out;
}
ul.nav-menu li:hover > ul, .nav-menu ul li:hover > ul, ul.nav-menu .focus > ul, .nav-menu .focus > ul {
    opacity: 1;
    clip: inherit;
    overflow: inherit;
    height: inherit;
    width: inherit;
    transform: translateY(0px);
    transform: translateX(0px);
}
.nav-menu li:hover, .nav-menu li.current_page_item, .nav-menu li.current_page_ancestor, .nav-menu li.current-menu-item, .nav-menu li.current-menu-ancestor, .nav-menu .sub-menu li, .nav-menu .children li {
    border: 2px solid #000;
}
.nav-menu .current_page_item > a, .nav-menu .current_page_ancestor > a, .nav-menu .current-menu-item > a, .nav-menu .current-menu-ancestor > a {
    color: inherit;
    background-color: #000;
}
.site-info i {
    vertical-align: middle;
}

body.search .post.mdl-card .meta.mdl-card__actions, body.blog .post.mdl-card .meta.mdl-card__actions {
    min-height: 44px;
}
.post.mdl-card header .entry-thumbnail img, .page.mdl-card header .entry-thumbnail img, .comments-area.mdl-card header .entry-thumbnail img, .gm-card.mdl-card header .entry-thumbnail img, .attachment.mdl-card header .entry-thumbnail img {
    min-height: 250px;
    min-width: 100%;
    width: auto;
}

.main-navigation .sub-dropdown {
    position: absolute;
    right: 0px;
    font-size: 20px;
    color: rgb(255, 255, 255);
    display: inline-block;
    top: 0px;
    height: 50px;
    line-height: 43px;
}
.main-navigation.open .nav-menu {
    display: block;
    padding: 0px;
    width: 100%;
    border: 2px solid #000;
}
.main-navigation.open .sub-menu {
    display: none !important;
    position: relative;
}
.main-navigation.open .sub-menu .sub-menu {
    margin-left: 15px;
}
.main-navigation.open .sub-menu.open {
    display: block !important;
    clip: inherit;
    overflow: inherit;
    height: inherit;
    width: inherit;
    left: 0;
}
.main-navigation.open .nav-menu li {
    display: block;
    width: 100%;
}
@media (min-width: 840px) {
    /*only for desktop*/
    body.search .post.mdl-card, body.blog .post.mdl-card {
        max-height: 250px;
    }
}

@media (max-width: 840px) {
    .mdl-layout--large-screen-only{display: none;}
    .mdl-layout__header-row {
        padding: 0px 25px;
        text-align: center;
        height: auto;
        margin-top: 15px;
    }
    .mdl-layout__header-row .site-title-wrap {
        width: inherit;
    }
    .site-header .img-logo {
        max-height: 40px;
    }

}