@font-face {font-family: 'Muli'; 
src: url('Muli.eot'); src: url('fonts/Muli.eot?#iefix') format('embedded-opentype'), url('fonts/Muli.woff2') format('woff2'), url('fonts/Muli.woff') format('woff'), url('fonts/Muli.ttf') format('truetype'), url('fonts/Muli.svg#Muli') format('svg'); font-weight: normal; font-style: italic; }

@font-face {font-family: 'Muli-Light'; 
src: url('Muli-Light.eot'); src: url('fonts/Muli-Light.eot?#iefix') format('embedded-opentype'), url('fonts/Muli-Light.woff2') format('woff2'), url('fonts/Muli-Light.woff') format('woff'), url('fonts/Muli-Light.ttf') format('truetype'), url('fonts/Muli-Light.svg#Muli-Light') format('svg'); font-weight: 300; font-style: normal; }

@font-face {font-family: 'Muli-LightItalic'; 
src: url('Muli-LightItalic.eot'); src: url('fonts/Muli-LightItalic.eot?#iefix') format('embedded-opentype'), url('fonts/Muli-LightItalic.woff2') format('woff2'), url('fonts/Muli-LightItalic.woff') format('woff'), url('fonts/Muli-LightItalic.ttf') format('truetype'), url('fonts/Muli-LightItalic.svg#Muli-LightItalic') format('svg'); font-weight: 300; font-style: italic; }

@font-face {font-family: 'Muli-Italic'; 
src: url('Muli-Italic.eot'); src: url('fonts/Muli-Italic.eot?#iefix') format('embedded-opentype'), url('fonts/Muli-Italic.woff2') format('woff2'), url('fonts/Muli-Italic.woff') format('woff'), url('fonts/Muli-Italic.ttf') format('truetype'), url('fonts/Muli-Italic.svg#Muli-Italic') format('svg'); font-weight: normal; font-style: italic; }

@font-face {font-family: 'Muli-BlackItalic'; 
src: url('Muli-BlackItalic.eot'); src: url('fonts/Muli-BlackItalic.eot?#iefix') format('embedded-opentype'), url('fonts/Muli-BlackItalic.woff2') format('woff2'), url('fonts/Muli-BlackItalic.woff') format('woff'), url('fonts/Muli-BlackItalic.ttf') format('truetype'), url('fonts/Muli-BlackItalic.svg#Muli-BlackItalic') format('svg'); font-weight: 900; font-style: italic; }

@font-face {font-family: 'Muli-Bold'; 
src: url('Muli-Bold.eot'); src: url('fonts/Muli-Bold.eot?#iefix') format('embedded-opentype'), url('fonts/Muli-Bold.woff2') format('woff2'), url('fonts/Muli-Bold.woff') format('woff'), url('fonts/Muli-Bold.ttf') format('truetype'), url('fonts/Muli-Bold.svg#Muli-Bold') format('svg'); font-weight: bold; font-style: normal; }

@font-face { font-family: 'Muli-SemiBold'; 
    src: url('Muli-SemiBold.eot'); src: url('fonts/Muli-SemiBold.eot?#iefix') format('embedded-opentype'), url('fonts/Muli-SemiBold.woff2') format('woff2'), url('fonts/Muli-SemiBold.woff') format('woff'), url('fonts/Muli-SemiBold.ttf') format('truetype'), url('fonts/Muli-SemiBold.svg#Muli-SemiBold') format('svg'); font-weight: 600; font-style: normal; }

body,html{font-family: 'Muli';color:#2c454a}

.Muli{font-family: 'Muli';}
.Muli-Light{font-family: 'Muli-Light'; }
.Muli-LightItalic{font-family: 'Muli-LightItalic'; }
.Muli-Italic{font-family: 'Muli-Italic'; }
.Muli-SemiBold{font-family: 'Muli-SemiBold';}
.Muli-Bold{font-family: 'Muli-Bold';}
.Muli-BlackItalic{font-family: 'Muli-BlackItalic';}

.size10{ font-size: 10px; }
.size11{ font-size: 11px; }
.size12{ font-size: 12px; }
.size13{ font-size: 13px; }
.size14{ font-size: 14px; }
.size16{ font-size: 16px; }
.size18{ font-size: 18px; }
.size20{ font-size: 20px; }
.size24{ font-size: 24px; }
.size30{ font-size: 30px; }
.size36{ font-size: 36px; }
.size48{ font-size: 48px; }
.size60{ font-size: 60px; }
.size72{ font-size: 72px; }
.size90{ font-size: 90px; }

a:hover{ text-decoration: none }
.animate{ transition: .5s all ease; -webkit-transition: .5s all ease; -moz-transition: .5s all ease; -o-transition: .5s all ease; -ms-transition: .5s all ease; }
 a:hover, a:focus, .btn:focus{box-shadow: none !important; outline: none !important}

h1, h2, h3, h4, h5, h6{font-family: 'Muli-SemiBold'; }

.bg_theme{background-color: #162136;}
.bg_light{background: #f0f0f0}
.bg_dark{background: #4d4d4d}

.txt_theme{color:#2c454a}
.txt_white{color:#fff}
.txt_blue{color: #359bff;}
.txt_red{color: #ca1d1d;}

.burger{ padding: 100px 0 }

.box_shadow{box-shadow: 0 6px 12px 0 rgba(138, 149, 151, 0.2); -webkit-box-shadow: 0 6px 12px 0 rgba(138, 149, 151, 0.2); -moz-box-shadow: 0 6px 12px 0 rgba(138, 149, 151, 0.2); -o-box-shadow: 0 6px 12px 0 rgba(138, 149, 151, 0.2); -ms-box-shadow: 0 6px 12px 0 rgba(138, 149, 151, 0.2);}

.btn{ border-radius: 30px !important; font-size: 13px; font-weight: bold;  letter-spacing: -0.02px; text-transform: uppercase; border: none !important; outline: none !important; padding: 12px 35px !important; display: inline-block !important;}
.btn-primary{background: #fff; color: #359bff !important;}
.btn-secondary{background: #359bff !important; color: #fff}
.btn.btn-outline-primary{border: 1px solid #359bff !important; color: #359bff !important; background: transparent; /*border: solid 1px transparent !important*/ }
.btn.btn-outline-primary:hover, .btn-primary:hover{color: #fff !important}
.btn-secondary:hover{ background: #2078ce !important;}
.btn.focus, .btn:focus, .btn.btn-outline-primary:focus {outline: 0 !important; box-shadow: 0 !important; }

label{ font-size: 13px; font-family: 'Muli-SemiBold'; }
input.form-control, select.form-control{ border: none !important; overflow: none !important; border-bottom: 2px solid #2c454a !important; border-radius: 0 !important; padding-left: 0 !important; padding: .2rem; height: auto; font-size: 14px}
.fomr-error{color: #ca1d1d;}
.form-control:focus{ box-shadow:none !important; overflow: none !important;}

.divider{ background: #ddd; height: 1px; width: 100%; margin: 10px 0 }

/*Common Css End*/

/*menu open*/
.top-menu { position: absolute; left: 0; top:0px; padding-top: 10px; width: 100%; height: auto; }
.top-menu:hover{ background: #fff }
.top-menu:hover .navbar-expand-lg .navbar-nav .nav-link{color: #111111; }
.top-menu:hover .btn-primary{ color: #fff !important; background: #359bff !important;}
.top-menu .navbar-light, .top-menu .bg-dark{ background-color: transparent !important}
.top-menu .navbar-brand img{ width: 160px; vertical-align: 1px; }
.top-menu .navbar-light .navbar-nav .nav-link{ color: #fff; font-size: 13px; padding: .5rem 1rem; }
.navbar-collapse{ z-index: 1; position: relative;}
/*menu close*/

/*body open*/
.demo_area{ padding:10rem 0 5rem 0 }
.screen_heading{ margin-bottom: 80px; font-size: 30px }
.screen_area{ border-radius: 13px; box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.45); background-color: #b2afaf; overflow: hidden; min-height: 760px; position: relative;}
.nav_area{ background: #fff; padding: 40px; width: 30%; box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.45); color: #38585f; position: relative; overflow: hidden; }
.nav_area>div.animate{ position: absolute; left: -250px; top: 40px; width: calc(100% - 80px); background: #fff }
.nav_area>div.animate.visible{left: 40px;}
.nav_area li{ margin-bottom: 10px}
.nav_area li:last-child{ margin-bottom: 0px}
.nav_area h6{font-family: 'Muli-Bold'; margin-bottom: 10px; font-size: 13px;}
.nav_area li h6{ margin-top: 20px; margin-bottom: 10px }
.nav_area a{ position: relative; display: flex; align-items: center;  justify-content: space-between; padding: 3px 10px; border-radius: 8px; border: 1px solid #697b7e; color: #3f636b; font-family: 'Muli-SemiBold'; font-size: 13px; min-height: 40px}
.nav_area a{ display: flex; }
.content_page a{border-color: #01d59b }
.poll a{border-color: #ff9805 }
.story a{border-color: #e91f63 }
.swiper a{border-color: #03bdd4 }
.teaser a{border-color: #b542c8 }
.nav_area .rounded-circle1 img{ width: 36px; margin-right: 5px }
.nav_area .icon_image{ width: 36px; height: 36px; line-height: 36px; text-align: center; display: inline-block; margin-right: 5px }
.nav_area .icon_image img{ height: 24px }
.nav_area .media_type .icon_image{ background: #359bff }
.nav_area .component .icon_image{ background: #697b7e }
.main_menu a i{ position: absolute; right: 10px; top: 50%; margin-top: -8px; }
.nav_area a .icon-item{position: absolute; right: -5px; top: 50%; margin-top: -21px; }
.nav_area a .option-item{/*position: absolute; right: 0px; top: 50%; margin-top: -19px;*/ background: #fff; color: #8a9597; position: relative; }
.main_menu a:hover .icon-item{ right: 10px;}
/*.main_menu a:hover{ opacity: .7 }*/
.nav_area .sub_txt{ /*line-height: 40px*/ }
.nav_area a .option-item span{ margin-right: 20px }
.nav_area a .option-item .img-svg{ position: absolute; right: -17px; top: 50%; margin-top: -20px}
.nav_area .sub_menu .active, .nav_area .sub_menu a:hover, .nav_area .sub_menu .active .option-item, .nav_area .sub_menu a:hover .option-item{border-color:#359bff !important; color: #359bff !important}
.nav_area .sub_menu .active .img-svg path, .nav_area .sub_menu a:hover .img-svg path{fill: #359bff !important}
/*.sub_menu{ display: none }*/
.sub_menu1{height: calc(100% - 110px);}
.sub_menu .btn{padding: 5px 20px !important; height: auto !important; min-height: auto !important;}
.sub_menu .btn:hover{ color: #fff !important }
.sub_menu .btn .img-svg{ width: 18px; margin-right: 5px; vertical-align: -7px; }
.sub_menu .btn .img-svg path{fill: #359bff !important}
.nav_area .sub_menu .btn.btn-outline-primary:hover{color:#fff !important;    background: #359bff !important;}
.nav_area .sub_menu .btn.btn-outline-primary:hover .img-svg path{fill: #fff !important;}
.nav_area .pagination li{ margin-bottom: 0 }
.nav_area .pagination li a{ min-height: auto !important; border-radius: 0 !important; border: 0; line-height: 23px; color: #2c454a!important}
.nav_area .pagination li a i{ font-size: 20px; vertical-align: -2px; }
.nav_area .page-item.disabled .page-link, .nav_area .page-item.disabled .page-link i{color: #ccc !important}
.nav_area .pagination li a:hover, .nav_area .pagination li a.active, .page-link:focus{ background:none !important; color: #359bff !important; box-shadow: none !important; outline: none !important }

.screen{ width: 70%; position: relative; min-height:800px }
.screen_icon{ position: absolute; left: 20px; top: 20px; background-image: linear-gradient(to bottom, #ffffff, #ffffff), linear-gradient(to bottom, rgba(0, 0, 0, 0.15), rgba(0, 0, 0, 0.5));border-radius: 4px; box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.45); padding: 5px; z-index: 1}
.screen_icon a{ display: block; }
.screen_icon .img-svg path {fill: #ccc !important;}
.screen_icon .active .img-svg path {fill:#359bff !important;}
.screen_icon img{ height:40px }

.mobile_nav{ position: absolute; left: 0; top: 0; background: #162136; width: 100%; display: none;}
.mobile_nav a{ color: #fff; padding:10px 15px; display: block; font-size: 20px;}
.mobile_nav a i{ margin-right: 10px; font-size: 24px; padding-left: 20px }

.device>.animate{ position: relative; }
.device .mobile-screen>img{ height: 650px; width: auto; margin: auto; }
.device .desktop-screen>img{ width: 100%; height: auto; margin: auto; }
.device .mobile-screen .iframe, .device .desktop-screen .iframe{ position: absolute; z-index: 1; border-radius: 2px !important; overflow: hidden;}
.device .mobile-screen .iframe{ left: 184px; top: 160px; width: 268px; height: 476px; }
.device .desktop-screen .iframe{left: 32px; top: 249px; width: 583px; height: 342px; }
.device .iframe iframe{ width: 100%; height: 100%; border: none !important; outline: none !important }
.device .iframe.iframe_include{ overflow-x: hidden; overflow-y: auto; }

.form-area h2{font-family: 'Muli-Bold'; font-size: 24px; margin-bottom: 30px}
.form-card{border-radius: 4px; box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.18); background-color: #ffffff; overflow: hidden;}
.form-card>div{}
.form-card h4{ font-size: 24px }
.form-msg{ background: url('../images/svg/form-bg-img.svg') no-repeat left top; background-size:  cover;  }
.form-msg h3{ padding: 50px;font-family: 'Muli-BlackItalic' !important; font-size: 50px; line-height: 150%; margin: 0}
.Oval {width: 7px; height: 7px; display: inline-block; vertical-align: baseline; margin-left: 5px; background-color: #359bff; }
.form-cnt{ padding:30px 50px }
.form-cnt form{ width: 80% }
/*body close*/

/*Footer open*/
.footer{color:#2c454a}
.home-newsletter {max-width: 650px; margin: 0 auto; text-align: center; position: relative; z-index: 2; } 
.home-newsletter h2 {font-size: 22px; color: white; text-transform: uppercase; margin-bottom: 40px; } 
.home-newsletter .form-control {height: 50px; background: rgba(255, 255, 255, 0.6); border-color: transparent !important; padding: .375rem .75rem !important; border-radius: 30px 0 0 30px !important; } 
.home-newsletter .form-control:focus {box-shadow: none; border-color: #243c4f; } 
.home-newsletter .btn {min-height: 50px; border-radius: 0 30px 30px 0 !important; background: #359bff; color: #fff !important; padding: 15px 20px; }

.socialmediaicons a {width: 50px; height: 50px; line-height: 42px; border-radius: 50%; text-decoration: none; margin: 5px 2px; color: #fff; text-align: center; display: block; border: 5px solid #fff }
.socialmediaicons.socialmediaicons1{ margin-top: -5px }
.socialmediaicons.socialmediaicons1 a{border: 8px solid #fff; background: #fff; line-height: 35px;}
.socialmediaicons.socialmediaicons1 a img{ width: 100% }
.socialmediaicons .fa{ margin: 0; padding: 0; font-size: 18px; }
.socialmediaicons .facebook {background: #3B5998; } 
.socialmediaicons .twitter {background: #55ACEE; } 
.socialmediaicons .linkedin {background: #007bb5; } 
.socialmediaicons .youtube {background: #bb0000;}
.socialmediaicons a:hover {color: white; opacity: 0.8; }

.footer_link a{color:#2c454a}
.footer_link a:hover{opacity: 0.8;}
.footer h4{font-family: 'Muli-Bold'; }
.footer-logo{ height: 100px; width: auto; }
.sub-logo{ width: 100px; height: auto; }
.copyright{font-size: 11px; color: #fff; padding: 15px; line-height: 100% }
.copyright span{ margin-right: 5px }
.copyright a{ color: #fff; border-left: 1px solid; padding: 0 5px }
.copyright a:hover{opacity: 0.8;}
/*Footer close*/