/*
Theme Name: Rajawali Marketing
Version: 1.0
Text Domain: rjmonline
*/

/*  Normalize
--------------------------------------------------------------*/
body {margin: 0; -webkit-font-smoothing: auto;}
article,
aside,
details,
figcaption,
figure,
footer,
header,
main,
menu,
nav,
section,
summary {display: block;}
audio,
canvas,
progress,
video {display: inline-block; vertical-align: baseline;}
audio:not([controls]) {display: none; height: 0;}
[hidden],
template {display: none;}
a {background-color: transparent;}
a:active,
a:hover {outline: 0;}
dfn {font-style: italic;}
mark {background: #ff0; color: #000;}
small {font-size: 80%;}
sub,
sup {font-size: 75%; line-height: 0; position: relative; vertical-align: baseline;}
sup {top: -0.5em;}
sub {bottom: -0.25em;}
img {border: 0;}
svg:not(:root) {overflow: hidden;}
figure {margin: 1em 2.5rem;}
hr {box-sizing: content-box; height: 0;}
button {overflow: visible;}
button,
select {text-transform: none;}
button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {appearance:button; -webkit-appearance: button; cursor: pointer;}
button[disabled],
html input[disabled] {cursor: default;}
button::-moz-focus-inner,
input::-moz-focus-inner {border: 0; padding: 0;}
input {line-height: normal;}
input[type="checkbox"],
input[type="radio"] {box-sizing: border-box; padding: 0;}
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {height: auto;}
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {-webkit-appearance: none;}
fieldset {border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em;}
legend {border: 0; padding: 0;}
textarea {overflow: auto;}
optgroup {font-weight: bold;}
table {border-collapse: collapse; border-spacing: 0;}
td,
th {padding: 0;}

/*Elements
--------------------------------------------------------------*/
body {background: #f2f2f2; color:#2c2d2f; font-family:'Roboto', sans-serif; font-size:16px; line-height:26px}
img {height: auto; max-width: 100%;}
figure {margin: 1em 0;}
table {margin: 0 0 1.5em; width: 100%;}
h1, 
h2, 
h3, 
h4, 
h5, 
h6 {clear: both; color: #2c2d2f; font-family:'Noto Sans', sans-serif; font-weight:700; margin-bottom: 15px;}
h1 {font-size: 32px;}
h2 {font-size: 24px; line-height: 1.25;}
h3 {font-size: 18px; line-height: 25px;}
h4 {font-size: 16px; line-height: 20px;}
h5 {font-size: 14px; line-height: 17.5px;}
p {margin-bottom: 1.5em;}

a{color:#f79420; transition: all 0.5s ease;}
a:hover{text-decoration:none}

.btn-primary{background: rgb(23,174,224); border:0; color:#fff; font-family:'Noto Sans', sans-serif; font-weight:700; padding:10px 50px; background: -moz-linear-gradient(180deg, rgba(23,174,224,1) 0%, rgba(0,116,152,1) 100%); background: -webkit-linear-gradient(180deg, rgba(23,174,224,1) 0%, rgba(0,116,152,1) 100%); background: linear-gradient(180deg, rgba(23,174,224,1) 0%, rgba(0,116,152,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#17aee0",endColorstr="#007498",GradientType=1);}

/* Header
--------------------------------------------------------------*/
header#masthead {margin-bottom: 0; padding:15px 0; background: rgb(35,37,40); background: -moz-linear-gradient(180deg, rgba(35,37,40,1) 0%, rgba(53,52,54,1) 100%); background: -webkit-linear-gradient(180deg, rgba(35,37,40,1) 0%, rgba(53,52,54,1) 100%); background: linear-gradient(180deg, rgba(35,37,40,1) 0%, rgba(53,52,54,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#232528",endColorstr="#353436",GradientType=1);}

.navbar-brand{padding:0}
.navbar-brand img{height:30px}

/* Menus
--------------------------------------------------------------*/
#masthead nav {padding-left: 0; padding-right: 0;}
#masthead .navbar-nav > li{margin:0 0 0 40px}
#masthead .navbar-nav > li > a {color: #fff; padding:0; font-size:16px; font-weight:400; }
#masthead .navbar-nav > li > a:hover,
#masthead .navbar-nav > li.active > a {color: #f79420; font-weight:400;}

.navbar-brand {height: auto;}

.navbar-toggler{padding:5px 0; border-radius:0;}
.navbar-toggler:focus{outline:0}
.navbar-toggler .navbar-toggler-icon{height:auto; width:auto}
.navbar-toggler .navbar-toggler-icon img{height:24px}

.dropdown-menu .dropdown-toggle::after {border-bottom: 0.3em solid transparent; border-left: 0.3em solid; border-top: 0.3em solid transparent;}
.dropdown.menu-item-has-children .dropdown.menu-item-has-children {position: relative;}
.dropdown.menu-item-has-children .dropdown.menu-item-has-children>.dropdown-menu {top: 0; left: 100%; margin-top: -6px; margin-left: -1px; -webkit-border-radius: 0 6px 6px 6px; -moz-border-radius: 0 6px 6px; border-radius: 0 6px 6px 6px;}
.dropdown.menu-item-has-children .dropdown.menu-item-has-children:hover>.dropdown-menu {display: block;}
.dropdown.menu-item-has-children .dropdown.menu-item-has-children>a:after {display: block; content: " "; float: right; width: 0; height: 0; border-color: transparent; border-style: solid; border-width: 5px 0 5px 5px; border-left-color: #ccc; margin-top: 5px; margin-right: -10px;}
.dropdown.menu-item-has-children .dropdown.menu-item-has-children:hover>a:after {border-left-color: #fff;}
.dropdown.menu-item-has-children .dropdown.menu-item-has-children.pull-left {float: none;}
.dropdown.menu-item-has-children .dropdown.menu-item-has-children.pull-left>.dropdown-menu {left: -100%; margin-left: 10px; -webkit-border-radius: 6px 0 6px 6px; -moz-border-radius: 6px 0 6px 6px; border-radius: 6px 0 6px 6px;}

/* Small menu. */
.menu-toggle,
.main-navigation.toggled ul {display: block;}

.dropdown-item {line-height: 1.2; padding-bottom: 0.313rem; padding-top: 0.313rem;}
.dropdown-menu {min-width: 12.500rem;}
.dropdown .open .dropdown-menu {display: block; left: 12.250em; top: 0;}
.dropdown-menu .dropdown-item {white-space: normal; background: transparent; line-height: 1.6;}
.dropdown-menu .dropdown-item:hover {background: transparent;}

@media screen and (min-width: 37.5em) {
  .menu-toggle {display: none;}
}
@media screen and (min-width: 769px) {
  .dropdown-menu li > .dropdown-menu {right: -9.875rem; top: 1.375rem;}
}
@media screen and (max-width: 991px) {
  .navbar-nav .dropdown-menu {border: medium none; margin-left: 1.250rem; padding: 0;}
  .dropdown-menu li a {padding: 0;}
  #masthead .navbar-nav > li > a {padding-bottom: 0.625rem; padding-top: 0.313rem;}
  .navbar-light .navbar-toggler {border: medium none; outline: none;}
}

.site-main .comment-navigation,
.site-main .posts-navigation,
.site-main .post-navigation {margin: 0 0 1.5em; overflow: hidden;}

.comment-navigation .nav-previous,
.posts-navigation .nav-previous,
.post-navigation .nav-previous {float: left; width: 50%;}

.comment-navigation .nav-next,
.posts-navigation .nav-next,
.post-navigation .nav-next {float: right; text-align: right; width: 50%;}
.comment-content.card-block {padding: 20px;}
.navigation.post-navigation {padding-top: 1.875rem;}

.post-navigation .nav-previous a,
.post-navigation .nav-next a {border: 1px solid #ddd; border-radius: 0.938rem; display: inline-block; padding: 0.313rem 0.875rem; text-decoration: none;}
.post-navigation .nav-next a::after {content: " \2192";}
.post-navigation .nav-previous a::before {content: "\2190 ";}
.post-navigation .nav-previous a:hover,
.post-navigation .nav-next a:hover {background: #eee none repeat scroll 0 0;}

/* Alignments
--------------------------------------------------------------*/
.alignleft {display: inline; float: left; margin-right: 1.5em;}
.alignright {display: inline; float: right; margin-left: 1.5em;}
.aligncenter {clear: both; display: block; margin-left: auto; margin-right: auto;}

a img.alignright {float: right; margin: 0.313rem 0 1.25rem 1.25rem;}
a img.alignnone {margin: 0.313rem 1.25rem 1.25rem 0;}
a img.alignleft {float: left; margin: 0.313rem 1.25rem 1.25rem 0;}
a img.aligncenter {display: block; margin-left: auto; margin-right: auto;}

.wp-caption.alignnone {margin: 0.313rem 1.25rem 1.25rem 0;}
.wp-caption.alignleft {margin: 0.313rem 1.25rem 1.25rem 0;}
.wp-caption.alignright {margin: 0.313rem 0 1.25rem 1.25rem;}

/* Clearings
--------------------------------------------------------------*/
.clear:before,
.clear:after,
.section:before,
.section:after,
.site-header:before,
.site-header:after,
.site-content:before,
.site-content:after,
.site-footer:before,
.site-footer:after {content: ""; display: table; table-layout: fixed;}

.clear:after,
.sectiont:after,
.site-header:after,
.site-content:after,
.site-footer:after {clear: both;}

/* Content
--------------------------------------------------------------*/
.section{padding:60px 0;}
.section .section-title{color:#383838; font-family:'Noto Sans', sans-serif; font-size:40px; font-weight:700; margin:0 0 40px} 

#page-title{background:url('images/bg-page-title.jpg') center center no-repeat; padding:120px 0; background-size:cover; -moz-background-size:cover; -webkit-background-size:cover;}
#page-title h1{color:#fff; font-size:70px; font-weight:700}

#page-thumbnail {padding:0}
#page-thumbnail img{width:100%}

#page-content{min-height:1100px; position:relative}
#page-content .container{position:relative}
#page-content .page-meta{float:left; margin:0 0 30px; width:100%}
#page-content .page-meta p{color:#f79420; font-family:'Noto Sans', sans-serif; font-size:18px; font-weight:700; margin:0; text-align:center; width:100%}
#page-content .page-share{color:#18b0e2; font-weight:700; display:inline-block; margin:30px 0 0; text-align:center; width:100%}
#page-content .page-share span{display:inline-block; font-size:20px; margin:0 10px 0 0;}
#page-content .page-share .addtoany_shortcode{display:inline-block}

#page-content .products-sidebar{float:left; width:100%}
#page-content .products-sidebar ul{list-style:none; margin:0; padding:0}
#page-content .products-sidebar ul li{border-bottom:1px solid #000; float:left; width:100%}
#page-content .products-sidebar ul li a{color:#000; float:left; font-weight:600; padding:10px 0; width:100%}
#page-content .products-dropdown{display:none; margin:0 0 30px; text-align:center}
#page-content .products-dropdown select{padding:10px 15px;}

@media (max-width:991px){
  #page-content .products-sidebar{display:none}
  #page-content .products-dropdown{display:block}
}

/* Home */
#hero .slider{padding:140px 0}
#hero .slider h1{color:#fff; font-family: 'noto_sansextrabold', 'Noto Sans', sans-serif; font-size:72px; margin:0 0 40px; text-align:center;}
#hero .slider p{color:#fff; font-size:26px; line-height:36px; margin:0 0 20px; text-align:center;}

#intro{background:#fff url('images/bg-intro.jpg') center center no-repeat; background-size:cover; -moz-background-size:cover; -webkit-background-size:cover;}
#intro h2{color:#383838; font-family:'Poppins', sans-serif; font-size:44px; font-weight:600; margin:0 0 30px; text-align:center}
#intro p{color:#383838; font-size:22px; line-height:32px; text-align:center}

#latest-news .news{float:left; margin:0 0 30px; width:100%}
#latest-news .news .thumbnail{float:left; margin:0 0 20px; overflow:hidden; width:100%}
#latest-news .news .thumbnail img{margin:0; width:100%}
#latest-news .news h2{font-family:'Noto Sans', sans-serif; font-size:32px; font-weight:700; margin:0 0 20px}
#latest-news .news h2 a{color:#383838}
#latest-news .news h2 a:hover{color:#f79420}
#latest-news .news .date{color:#f79420; float:left; font-family:'Noto Sans', sans-serif; font-size:20px; font-weight:700; margin:0 0 20px; width:100%}
#latest-news .news p{margin:0}

/* About */
#tagline{background:#fff url('images/bg-tagline.jpg') right center no-repeat; padding:80px 0 60px; position:relative; background-size:cover; -moz-background-size:cover; -webkit-background-size:cover;}
#tagline h2{color:#383838; font-family:'Poppins', sans-serif; font-size: 64px; font-weight:600; line-height: 64px; margin:0 0 30px;}
#tagline p{color:#383838; font-size:22px; line-height:32px;}

#features .feature{text-align:center}
#features .feature img{margin:0 auto 30px; height:200px; max-width:80%; width:auto}
#features .feature p{font-size:20px; line-height:30px; text-align:center}

/* Products */
#products .product{margin:0 0 40px}
#products .product .thumbnail{float:left; margin:0 0 10px; position:relative; width:100%}
#products .product .thumbnail img{margin:0; width:100%}
#products .product .thumbnail .brands{background:#fff; display:flex; justify-content:center; height:auto; padding:100px 20px 30px; position:absolute; left:0; bottom:0; width:100%; background: rgb(255,255,255); background: -moz-linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%); background: -webkit-linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%); background: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff",endColorstr="#ffffff",GradientType=1);}
#products .product .thumbnail .brands .brand{display:flex; flex:3; max-width:33%; padding:0 10px; align-items: center;}
#products .product .thumbnail .brands .brand img{display: block; height:auto; margin: 0 auto; max-width:100%; width:100%;}
#products .product h2{font-family:'Noto Sans', sans-serif; font-size:22px; font-weight:700; text-align:center}
#products .product h2 a{color:#383838}

.table-product thead{background:#383838; color:#fff;}
.table-product thead th{color:#fff; text-align:center;}

/* Downloads */
#downloads .download {margin:0 0 40px}
#downloads .download .cover{height:auto; margin:0 0 20px; width:100%}
#downloads .download .download img{display:block; margin:0 auto; width:90%}
#downloads .download h2{border-bottom:1px solid #5e5e5e; color:#f79420; font-family:'Noto Sans', sans-serif; font-size:28px; font-weight:700; margin:20px 0 15px; padding:0 0 15px}

/* News */
#news .news{float:left; margin:0 0 30px; width:100%}
#news .news .thumbnail{float:left; margin:0 0 20px; overflow:hidden; width:100%}
#news .news .thumbnail img{margin:0; width:100%}
#news .news h2{font-family:'Noto Sans', sans-serif; font-size:26px; font-weight:700; margin:0 0 20px}
#news .news h2 a{color:#383838}
#news .news h2 a:hover{color:#f79420}
#news .news .date{color:#f79420; float:left; font-family:'Noto Sans', sans-serif; font-size:18px; font-weight:700; margin:0 0 20px; width:100%}
#news .news p{margin:0}

.wp-pagenavi{margin:30px 0; text-align:center;}
.wp-pagenavi a, 
.wp-pagenavi span{border:0; color:#2c2d2f; font-size:24px; font-weight:700; margin:0 5px; padding:0;}
.wp-pagenavi a:hover,
.wp-pagenavi span.current{color:#f79420; font-weight:700;}
.wp-pagenavi span.pages{display:none}

/* Careers */
#careers h2.section-title{color:#383838; font-size:50px; margin:100px 0 30px;}
#careers p{color:#383838; font-size:20px; line-height:30px; text-align:center}

/* Contact */
#contact h3{font-size:22px; font-weight:700;}
#contact table{margin:0 0 30px}
#contact table td{vertical-align:top}
#contact table td:first-child{padding:0 10px 0 0; width:30px}
#contact table td img{height:15px; width:auto}
#contact table td img.icon-mail{height:11px}
#contact ul.social{float:left; list-style:none; margin:0; padding:0}
#contact ul.social li{display:inline-block; margin:0 10px 0 0;}
#contact ul.social a{color:#18b0e2; font-size:26px; width:auto}
#contact ul.social a:hover{color:#f79420;}
#contact .wpcf7-form {margin:0 0 30px}
#contact .wpcf7-form .form-control{margin:0 0 20px}
#contact .wpcf7-form .btn-primary{text-align:center; width:100%}
#contact div.wpcf7-response-output{margin:0}

/* Call to Action */
#cta{background:#e9e9e9; padding:50px 0 40px;}
#cta h3{ font-size:36px; font-family:'Poppins', sans-serif; margin:0}
#cta .btn-primary{float:right; margin:-12px 0 0}

/* Infinite scroll
--------------------------------------------------------------*/
/* Globally hidden elements when Infinite Scroll is supported and in use. */
.infinite-scroll .posts-navigation,
.infinite-scroll.neverending .site-footer {display: none;}

/* When Infinite Scroll has reached its end we need to re-display elements that were hidden (via .neverending) before. */
.infinity-end.neverending .site-footer {display: block;}

/* Media
--------------------------------------------------------------*/
.wp-smiley {border: none; margin-bottom: 0; margin-top: 0; padding: 0;}

/* Make sure embeds and iframes fit their containers. */
embed,
iframe,
object {max-width: 100%;}

/*  Captions
--------------------------------------------------------------*/
.wp-caption {background: #f1f1f1 none repeat scroll 0 0; border: 1px solid #f0f0f0; max-width: 96%; padding: 0.313rem 0.313rem 0; text-align: center;}
.wp-caption img[class*="wp-image-"] {border: 0 none; height: auto; margin: 0; max-width: 100%; padding: 0; width: auto;}
.wp-caption .wp-caption-text {font-size: 0.688rem; line-height: 1.063rem; margin: 0; padding: 0.625rem;}
.wp-caption-text {text-align: center;}

/* Galleries
--------------------------------------------------------------*/
.gallery {margin-bottom: 1.5em;}
.gallery-item {display: inline-block; text-align: center; vertical-align: top; width: 100%;}
.gallery-item .gallery-columns-2 {max-width: 50%;}
.gallery-item .gallery-columns-3 {max-width: 33.33333%;}
.gallery-item .gallery-columns-4 {max-width: 25%;}
.gallery-item .gallery-columns-5 {max-width: 20%;}
.gallery-item .gallery-columns-6 {max-width: 16.66667%;}
.gallery-item .gallery-columns-7 {max-width: 14.28571%;}
.gallery-item .gallery-columns-8 {max-width: 12.5%;}
.gallery-item .gallery-columns-9 {max-width: 11.11111%;}
.gallery-caption {display: block;}

/* Footer
--------------------------------------------------------------*/
footer#colophon #footer-top{background:#303032 url('images/bg-footer.jpg') top left no-repeat; color:#fff; padding:60px 0 60px; background-size:cover; -moz-background-size:cover; -webkit-background-size:cover;}
footer#colophon #footer-top .logo-footer{height:100px; margin:40px 0 20px;}
footer#colophon #footer-top h3{color:#fff; font-family:'Roboto', sans-serif; font-size:30px; font-weight:700; margin:0 0 20px}
footer#colophon #footer-top p{margin:0}
footer#colophon #footer-top table{margin:0}
footer#colophon #footer-top table td{vertical-align:top}
footer#colophon #footer-top table td:first-child{padding:0 10px 0 0; width:30px}
footer#colophon #footer-top table td img{height:15px; width:auto}
footer#colophon #footer-top table td img.icon-mail{height:11px}
footer#colophon #footer-bottom{background:#353436; color:#fff; padding:30px 0;}
footer#colophon #footer-bottom p{margin:0}
footer#colophon #footer-bottom ul.social{float:right; list-style:none; margin:0; padding:0}
footer#colophon #footer-bottom ul.social li{display:inline-block; margin:0 0 0 10px}
footer#colophon #footer-bottom ul.social a{color:#18b0e2; font-size:26px; width:auto}
footer#colophon #footer-bottom ul.social a:hover{color:#f79420;}

/* Responsive
--------------------------------------------------------------*/
@media (max-width: 991.98px) {
  header#masthead{padding:10px 0}
  .navbar-brand img{height:25px}
  #masthead .navbar-nav {margin:20px 0;}
  #masthead .navbar-nav > li{margin:0}
  #masthead .navbar-nav > li > a{text-align:center}
  #page-title{padding:60px 0}
  #page-title h1{font-size:36px}
  #hero h1{font-size:52px}
  #hero p{font-size:24px}
  #intro h2{font-size:34px;}
  #features .feature img{height:120px}
  #latest-news .news h2{font-size:26px}
  #latest-news .news .date{font-size:18px}
  #cta{padding:50px 0}
  #cta h3{font-size:26px}
  #cta .btn-primary{margin:0}
  footer#colophon #footer-top .logo-footer{height:auto; width:100%}
}
@media (max-width: 767.98px) {
  .section .section-title{font-size:30px}
  #page-title{padding:40px 0}
  #page-title h1{font-size:30px}
  #hero h1{font-size:34px}
  #hero p{font-size:20px; line-height:30px}
  #intro h2{font-size:24px}
  #features .feature img{height:160px}
  #latest-news .news h2{font-size:26px}
  #latest-news .news .date{font-size:18px}
  #cta{text-align:center}
  #cta h3{font-size:26px; margin:0 0 20px; text-align:center}
  #cta .btn-primary{float:none; margin:0}
  #tagline:before{background:rgba(255,255,255,0.6); content:''; display:block; height:100%; left:0; position:absolute; top:0; width:100%}
  footer#colophon #footer-top {background-position:right top;}
  footer#colophon #footer-top .logo-footer{display:inherit; margin:0 auto 40px; max-width:200px;}
  footer#colophon #footer-top table{margin:0 0 30px}
  footer#colophon #footer-bottom .order-1{order:2}
  footer#colophon #footer-bottom .order-2{order:1}
  footer#colophon #footer-bottom ul.social{margin:0 0 20px; text-align:center; width:100%}
  footer#colophon #footer-bottom ul.social li{margin:0 5px}
  footer#colophon #footer-bottom ul.social img{height:30px}
  footer#colophon #footer-bottom p{margin:0; text-align:center}
}
@media (max-width: 575.98px) {
  #downloads .download .download img{width:240px}
}

