﻿@charset "utf-8";

/*
------------------------------------------------------------
Project Name : Sample Project;
------------------------------------------------------------
*/

/* Must import all other css files here instead of HTML Pages */
@import url("bootstrap.min.css");


@font-face {
	font-family: 'AvenirLTStd-Heavy';
	src: url('../fonts/AvenirLTStd-Heavy.eot');
	src: local('☺'), url('../fonts/AvenirLTStd-Heavy.woff') format('woff'), url('../fonts/AvenirLTStd-Heavy.ttf') format('truetype'), url('../fonts/AvenirLTStd-Heavy.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'AvenirLTStd-Light';
	src: url('../fonts/AvenirLTStd-Light.eot');
	src: local('☺'), url('../fonts/AvenirLTStd-Light.woff') format('woff'), url('../fonts/AvenirLTStd-Light.ttf') format('truetype'), url('../fonts/AvenirLTStd-Light.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'AvenirLTStd-Medium';
	src: url('../fonts/AvenirLTStd-Medium.eot');
	src: local('☺'), url('../fonts/AvenirLTStd-Medium.woff') format('woff'), url('../fonts/AvenirLTStd-Medium.ttf') format('truetype'), url('../fonts/AvenirLTStd-Medium.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'AvenirLTStd-Roman';
	src: url('../fonts/AvenirLTStd-Roman.eot');
	src: local('☺'), url('../fonts/AvenirLTStd-Roman.woff') format('woff'), url('../fonts/AvenirLTStd-Roman.ttf') format('truetype'), url('../fonts/AvenirLTStd-Roman.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}


/* Reset 
--------------------------------------------------------------------------------------------------------*/

/* 
http://meyerweb.com/eric/tools/css/reset/
v2.0 | 20110126
License: none (public domain)
*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; }

strong {font-weight:bold}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
body { line-height: 1; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }
table { border-collapse: collapse; border-spacing: 0; }

/* Css Clearfix */
.clearfix:before, .clearfix:after { content: " "; display: table; }
.clearfix:after { clear: both; }
.clearfix { *zoom: 1; }

/* General */
* { outline: none !important; }

.bloga, .blogcontainer, .bloglogo img { transition: all 0.3s; -o-transition: all 0.3s; -ms-transition: all 0.3s; -moz-transition: all 0.3s; }
.bloghtml, .blogbody { height: 100%; }
.blogbody {font-family: 'AvenirLTStd-Light', arial; font-size: 14px; line-height: 18px; -ms-overflow-style: scrollbar; color: #384050;}
.blogwrapper { min-height: 100%; }
.bloga { color: #000; text-decoration: none!important; }
.bloga:hover { text-decoration: none; color: #999 }
.blogh1, .blogh2, .blogh3, .blogh4, .blogh5, .blogh6 { line-height: 1.2em; padding: 0 0 20px; }
.blogh1 span, .blogh2 span, .blogh3 span, .blogh4 span, .blogh5 span, .blogh6 span { display: block; }
.blogh1{font-size: 48px; line-height: 52px; font-family: "AvenirLTStd-Heavy";}
.blogh2{font-size: 26px; line-height: 28px; font-family: "AvenirLTStd-Heavy";margin-top:50px;margin-bottom:20px;border-bottom:1px solid #ccc;}
.blogh3{font-size: 20px; line-height: 24px; font-family: "AvenirLTStd-Heavy";}
.blogp { padding: 0 0 20px; }
.bloginput[type=text], .bloginput[type=email], .bloginput[type=password], .blogtextarea { -webkit-appearance: none; appearance: none; }
::-webkit-input-placeholder { color: #acbbc6; }
::-moz-placeholder { color: #acbbc6; }
:-ms-input-placeholder { color: #acbbc6; }
:-moz-placeholder { color: #acbbc6; }
::-moz-focus-inner { border: 0; outline: none; }
select:-moz-focusring { color: transparent; text-shadow: 0 0 0 #000; }
option:not(:checked) { color: black; }
.blogform-control, .blogbtn{border-radius: 2px;}
.blog-description td {padding:10px;border-bottom:1px solid #f1f3f5}
.blog-description th {background:#f1f3f5;font-weight:bold;padding:10px}


/* Submenu Block
--------------------------------------------------------------------------------------------------------*/
.submenu-block{background: #3b9dd6}
.submenu-block .submenu-outer{position: relative; padding-right: 60px;}
.submenu-block .submenu{overflow: auto;}
.submenu-block .submenu ul{white-space: nowrap;}
.submenu-block .submenu ul li{display: inline-block;}
.submenu-block .submenu ul li a{display: block; font-size: 13px; line-height: 14px; padding: 17px 12px; color: #fff;}
.submenu-block .submenu ul li a:hover{background: #2f5d9c;text-decoration:none;font-weight:normal}
.submenu-block .submenu ul li a:focus {font-weight:normal;}
.submenu-block .submenu ul li.active a{background: none; color: #1c97d4;}
.submenu-block .search-btn{position: absolute; right: 0; top: 0; padding: 18px;}
.submenu-block .search-btn:hover{background: #e1e2e2;}
.submenu-block .search-btn img{display: block;width: 20px; height: 20px;}

.submenu-block .submenu-dropdown .dropdown-toggle{display: inline-block; font-size: 18px; line-height: 22px; padding: 17px 12px; color: #384050;}
.submenu-block .submenu-dropdown .dropdown-toggle span{display: inline-block; padding-right: 15px; position: relative;}
.submenu-block .submenu-dropdown .dropdown-toggle span:before{position: absolute; right: 0; top: 7px; border-right: solid 2px #384050; border-bottom: solid 2px #384050; width: 6px; height: 6px; content: ""; transform: rotate(45deg);}
.submenu-block .submenu-dropdown ul li a{display: block; font-size: 16px; line-height: 20px; padding: 10px 12px; color: #384050;text-align: left;}
.submenu-block .submenu-dropdown ul li a:hover{background: none; color: #3b9dd6;}
.submenu-block .submenu-dropdown ul li.active a{background: none; color: #1c97d4;}
.submenu-block .submenu-dropdown .dropdown-menu{margin: 0; float: none; padding: 0; position: static; box-shadow: none; border:0; border-radius: 0; background: none;}
.submenu-block .submenu-dropdown .dropdown-backdrop{display: none!important;}

/* Hero Banner
--------------------------------------------------------------------------------------------------------*/
.hero-banner{padding: 72px 0; color: #fff;}
.hero-banner-inner{display: table; width: 100%; height: 300px;}
.hero-banner-inner > div{display: table-cell; vertical-align: middle;}
.hero-banner-inner .hero-img{width: 500px; padding: 0 50px;}
.hero-banner-inner .hero-img img{width: 100%; display: block;}
.hero-banner .hero-banner-content span.keywords{font-size: 18px; line-height: 22px; display: block; padding-bottom: 7px;}
.hero-banner .hero-banner-content .author{font-size: 22px; line-height: 26px; font-family: "AvenirLTStd-Heavy"; position: relative; padding:5px 0 5px 66px;}
.hero-banner .hero-banner-content .author .author-img{position: absolute; left: 0; top: 0; width: 56px; height: 56px; border-radius: 56px;}
.hero-banner .hero-banner-content .author em{display: block; font-size: 16px; line-height: 20px; font-family: "AvenirLTStd-Light";}

/*Blog Description-----------------------------------------------------------------*/
.blog-description h1{font-size: 48px; line-height: 52px; font-family: "AvenirLTStd-Heavy"}
.blog-description h2{font-size: 24px; line-height: 28px; font-family: "AvenirLTStd-Heavy"}
.blog-description h3{font-size: 20px; line-height: 24px; font-family: "AvenirLTStd-Heavy"}
.blog-description h4{font-size: 16px; line-height: 20px; font-family: "AvenirLTStd-Heavy"}
.blog-description h5{font-size: 12px; line-height: 18px; font-family: "AvenirLTStd-Heavy"}
.blog-description h6{font-size: 12px; line-height: 18px; font-family: "AvenirLTStd-Heavy"}
.blog-description p{font-size: 18px; line-height: 22px; padding-bottom: 25px;}
.blog-description b{font-weight: bold;font-size: 18px; line-height: 22px; padding-bottom: 25px;}
.blog-description div{font-size: 18px; line-height: 22px; }
.blog-description i{font-style: italic;}
.blog-description ol {display: block;list-style-type: decimal;}
.blog-description ul {display: block;list-style-type: disc;}
.blog-description{font-size: 18px; line-height: 22px;margin-bottom:40px;}
.blog-description a {color: #fff;background: #3b9dd6;padding: 0.5%;}
.blog-description a:hover {background:#333;color:#fff;text-decoration:none;font-weight:normal}
/* Blog Detail
--------------------------------------------------------------------------------------------------------*/
.blog-detail, .blog-listing{padding: 80px 0;}
.blog-detail-inner{display: table; width: 100%; table-layout: fixed;}
.blog-detail-inner > div{display: table-cell; vertical-align: top;}
.blog-post h2:first-of-type {margin-top:0px;}
.blog-post p{font-size: 18px; line-height: 27px;}
.blog-post figure{margin-bottom: 30px;}
.blog-post figure picture img{display: block; max-width: 100%;}
.blog-detail .social-icons-outer{width: 98px;}
.blog-detail .social-icons{position: sticky; top: 40px; padding-bottom: 20px;}
.blog-detail .social-icons li + li{padding-top: 10px;}
.blog-detail .social-icons li a{display: block; width: 46px; height: 46px; background: #f1f3f5; border-radius: 46px; overflow: hidden;}
.blog-detail .social-icons li a:hover{background: #e1e2e2;}
.blog-detail .social-icons li a img{display: block; width: 46px; height: 46px;}

/* Blog Artilce
--------------------------------------------------------------------------------------------------------*/
.related-blogs{padding:20px 0 30px;}
.related-blogs h2{padding-bottom: 15px;}
.article{background: #f1f3f5; transition: all 0.3s; margin-bottom: 30px;}
.article:hover{box-shadow: 0 0 20px rgba(0,0,0,0.2);}
.article figure picture img{ width:90%;
	margin: 0 auto;
	align-items:center;
	align-content:center;
    padding: 28px;}
.article .article-body{padding: 15px 20px;}
.article .article-body .article-body-text{margin-bottom: 15px; min-height: 71px;}
.article .article-body h3{color: #333333; padding: 0; max-height: 48px; overflow: hidden; margin-bottom: 5px;}
.article .article-body p{color: #666666; font-size: 16px; padding-bottom: 0;}
.article .article-body .date{font-size: 14px; background: url(../../_images/Blog/calendar.svg) left center no-repeat; -webkit-background-size: 14px; background-size: 14px; padding-left: 22px; color: #384050;}

.view-all-outer{padding: 10px 0 60px;}
.view-all-btn.btn{height: 46px; font-size: 16px;}
.view-all-btn.btn-primary{background: #1c97d4!important; border-color: #1c97d4!important; color: #fff!important; box-shadow: none!important; padding: 6px 20px;}
.view-all-btn.btn-primary:hover{background: #1882b7!important;}


/* Subscribe block
--------------------------------------------------------------------------------------------------------*/
.subscribe-block{border-top: solid 3px #1c97d4; background: #f1f3f5; padding: 45px; margin-top:60px;}
.subscribe-block .subscribe-block-inner{max-width: 550px; margin: 0 auto;}
.subscribe-block .subscribe-block-inner p{font-size: 16px;}
.subscribe-block .input-group{margin: 0 20px;}
.subscribe-block .form-control{font-family: "AvenirLTStd-Light"; font-size: 16px; box-shadow: none!important; height: 46px;}
.subscribe-block .form-control:focus{border-color: #1c97d4;}
.subscribe-block .btn{height: 46px; font-size: 16px;}
.subscribe-block .btn-primary{background: #1c97d4!important; border-color: #1c97d4!important; color: #fff!important; box-shadow: none!important; padding: 6px 20px;}
.subscribe-block .btn-primary:hover{background: #1882b7!important;}
rect{
	fill:none;
}


/* Search Block
--------------------------------------------------------------------------------------------------------*/
.search-block{position: fixed; left: 0; top: 0; width: 100%; height: 100%; background: #fff; z-index: 99; padding-top: 70px; display: none;}
.search-block .close-search{position: absolute; right: 10px; top: 10px; padding: 14px; border-radius:50px;}
.search-block .close-search:hover{background: #f1f3f5;}
.search-block .close-search img{display: block; width: 22px;}
.search-block .search-result{max-height: calc(100vh - 185px); overflow: auto;}
.search-form{position: relative; margin-bottom: 60px;}
.search-form .search-input{width: 100%; border:0; border-bottom: solid 1px #acbbc6; font-family: "AvenirLTStd-Roman"; font-size: 28px; padding: 10px 50px 10px 0;}
.search-form .search-input:focus{border-bottom-color: #384050;}
.search-form .search-submit{position: absolute; right: 0; top: 0; border:0; background: none; height: 100%;}
.search-form .search-submit img{display: block; width: 24px;}
.show-search-block{overflow: hidden;}
.show-search-block .search-block{display: block;}

/* Responsive Media Queries
--------------------------------------------------------------------------------------------------------*/
@media (max-width:1199px) { }
@media (max-width:1025px) {
    .blog-detail-content .blog-post img {
        width: 100%;
    }
}
@media (min-width:768px) {
	.submenu-dropdown{display: none;}
}
@media (max-width:991px) {
    .submenu{display: none;}
	.blogh1{font-size: 36px; line-height: 40px;}
	.hero-banner-inner{height: auto;}
	.hero-banner-inner .hero-img{width:323px; padding: 30px;}
    .blog-detail-content .blog-post img {
        width: 100%;
    }
}
@media (max-width:767px) {
	.blogh1{font-size: 32px; line-height: 36px;}
	.blogh2{font-size: 24px; line-height: 26px;}
	.hero-banner{padding: 50px 0;}
	.hero-banner-inner{display: block;}
	.hero-banner-inner > div{display: block;}
	.hero-banner-inner .hero-img{width: auto; padding:30px 0 0;}
	.hero-banner-inner .hero-img img{width: auto; max-width: 100%; margin: 0 auto;}
    .blog-detail-content .blog-post img {
        width: 100%;
    }
	.blog-detail .social-icons-outer{width: 58px;}
	.blog-detail .social-icons li a, .blog-detail .social-icons li a img{width: 36px; height: 36px;}
	.blog-post .blogp{font-size: 16px; line-height: 20px;}	

	.subscribe-block{padding: 20px;}	

	.search-form{margin-bottom: 30px;}
	.search-block .search-result{max-height: calc(100vh - 155px);}
}
@media (max-width:560px) { 
	.subscribe-block .input-group{margin: 0; display: block;}
	.subscribe-block .input-group .form-control,  .subscribe-block .input-group-addon, .subscribe-block .input-group-btn{display: block; white-space: normal; width: 100%; margin: 0;}
	.subscribe-block .input-group .form-control{border-radius: 2px 2px 0 0;}
	.subscribe-block .input-group-btn .btn{width: 100%; border-radius: 0 0 2px 2px; margin: -1px 0 0;}
}
@media (max-width:412px)
{
	
	.hero-img picture lottie-player {width:100% !important;}
    .hero-banner-content .bloga {
        font-size: 28px;
    }
    .hero-banner-inner .hero-img img {
        display: block;
        margin-left: auto;
        margin-right: auto;
        width: 100%;
    }
    .blog-detail-content .blog-post img{
        width:100%;
    }
    .blog-detail-content .blog-post iframe {
        width: 100%;
    }
	.article figure picture img{ width:100%;
	
	margin: 0 auto;
	align-items:center;
	align-content:center;
    padding: 28px;}
}
