/*
Theme Name: HSS
Theme URI: http://www.hyperionsecurity.com.au
Description: Custom wordpress theme Developed by Mandip Luitel
Author: Mandip Luitel
Author URI: https://mandipluitel.com
Text Domain: hss
Version: 1.0
*/
html, body {height: 100%; width: 100%; -webkit-overflow-scrolling: touch;}
body {margin: 0; padding: 0; clear: both; color: #000000; background: #FFFFFF; font-family: 'Montserrat', sans-serif; font-size: 20px; line-height: 1.8em; font-weight: 300; overflow-x: hidden;}
body.admin-bar header {margin-top: 32px;}
h1, h2, h3, h4, h5, h6 {font-weight: 500;}
p {padding: 0; color: #000000;}
p:empty {display: none;}
p:last-of-type {margin-bottom: 0;}
p a, ul li a, ol li a {color: #CEA50D;}
ul, li {margin: 0; padding: 0; list-style: none;}
a {text-decoration: underline;}
a:link, a:visited {text-decoration: none;}
:-webkit-input-placeholder {color: #666666; font-style: italic;}
::-moz-placeholder {color: #666666; font-style: italic;}
::-moz-placeholder {color: #666666; font-style: italic;}
:-ms-input-placeholder {color: #666666; font-style: italic;}
:-ms-input-placeholder {color: #666666; font-style: italic;}
::selection {background-color: #CEA50D; color: #FFFFFF;}

.clr {clear: both; margin: 0; padding: 0;}
.spacer-10 {height: 10px; clear: both; margin: 0; padding: 0;}
.spacer-20 {height: 20px; clear: both; margin: 0; padding: 0;}
.spacer-30 {height: 30px; clear: both; margin: 0; padding: 0;}
.alignleft {float: left; margin: 0 21px 21px 0;}
.alignright {float: right; margin: 0 0 21px 21px;}

/* Buttons */
.btn-default {color: #FFFFFF; font-size: 21px; display: inline-block; position: relative; font-weight: 300; background-color: #CEA50D; padding: 9px 45px; text-transform: uppercase; box-shadow: 0 .125rem .25rem rgba(0,0,0,.075)!important; letter-spacing: 1px;}
.btn-default:hover {color: #FFFFFF; background-color: #AD8218;}

/* Header */
.header {background: #FFFFFF; padding: 18px 0; box-shadow: 0 .125rem .25rem rgba(0,0,0,.075)!important;}
.logo {width: 160px; display: block; position: absolute; -webkit-transition: width 0.1s; transition: width 0.1s;}
.smaller {padding: 15px 0;}
.smaller .logo {width: 124px;}
ul.main-menu {padding-top: 29px;}
.smaller ul.main-menu {padding-top: 15px;}
ul.main-menu li {display: flex; margin-left: 48px; text-transform: uppercase; font-size: 15px; letter-spacing: 0.5px; font-weight: 400; align-items: flex-end;}
ul.main-menu li:last-child {position: relative; padding-left: 24px;}
ul.main-menu li:last-child:before {content: '\f095'; font-family: FontAwesome; color: #464646; position: absolute; left: 0; font-size: 24px;}
ul.main-menu li a {color: #464646;}
ul.main-menu li:hover a {color: #CEA50D;}

/* Menu */
.hamburger, .slidemenu {display: none;}

/* Banner */
.banner-info {padding: 99px 0 0;}
.banner-info .item {display: flex; align-items: center; position: relative;}
.banner-info .item .container {position: absolute; left: 0; right: 0;}
.banner-info .item .banner-text {margin-top: 27px;}
.banner-info .item h2 {font-size: 45px; color: #000000; position: relative; margin-bottom: 12px !important; font-weight: 600;}
.banner-info .item a.bannerbtn {color: #FFFFFF; font-size: 14px; border: 1px solid #5A5D17; padding: 8px 33px; background: #AA9A2F; text-transform: uppercase; font-weight: 500;}
.banner-info .item a.bannerbtn:hover {background-color: #5A5D17; border: 1px solid #AA9A2F;}
.banner-info .owl-dots {position: absolute; bottom: 30px; left: 0; right: 0; text-align: center;}
.banner-info .owl-dot span {width: 15px !important; height: 15px !important; background-color: #FFFFFF; margin: 0 3px !important; outline: none; border: 3px solid transparent; display: inline-block; border-radius: 50%;}
.banner-info .owl-dot.active span {background-color: #5A5D17 !important; border: 3px solid #CEA50D;}
.banner-info .owl-theme .owl-dots .owl-dot{outline: unset;}
.banner-info .banner-1, .banner-info .banner-2 {justify-content: flex-end;}
.banner-info .banner-3 .banner-text {margin-left: 180px;}

.about-block {padding: 60px 0;}
.about-block h2 {font-size: 36px; color: #CEA50D; margin-bottom: 24px;}

.client-block {padding: 0 0 15px;}
.client-block h2 {font-size: 36px; color: #474708; margin-bottom: 15px;}

.service-block {background: #E1E4E5; padding: 60px 0;}
.service-block h2 {font-size: 36px; color: #474708; margin-bottom: 15px;}
.service-block h3 {font-size: 27px; font-weight: 300; color: #000000; margin-bottom: 0;}
.service-hold {margin-top: 30px;}
.service-hold .row>[class*=col-] {margin-bottom: 36px;}
.service-hold .row>[class*=col-] h6 {margin: 12px 15px 0; font-size: 18px;}
.service-box {background: #FFFFFF; display: flex; align-items: center; justify-content: center; margin: 0 15px; padding: 30px;}
.service-box img {height: 180px;}

.brand-block {padding: 60px 0;}
.brand-block h2 {font-size: 36px; color: #CEA50D; margin-bottom: 15px;}
.brand-hold {display: block;}
.brand-img {width: 20%; padding: 0 3px; float: left; margin-bottom: 9px;}

.consultation-block {background: rgb(206,165,13); background: linear-gradient(90deg, rgba(206,165,13,1) 0%, rgba(252,243,127,1) 100%); padding: 45px 0;}
.consultation-block h2 {font-size: 36px; color: #FFFFFF; margin-bottom: 15px;}
.consultation-block p {color: #FFFFFF;}

.team-block {padding: 60px 0;}
.team-block h2 {font-size: 36px; color: #CEA50D; margin-bottom: 24px;}

.contact-block {background: rgb(206,165,13); background: linear-gradient(90deg, rgba(206,165,13,1) 0%, rgba(252,243,127,1) 100%); padding: 60px 0;}
.contact-block h2 {font-size: 36px; color: #FFFFFF; margin-bottom: 15px;}
.contact-block h3 {font-size: 27px; color: #FFFFFF; margin-bottom: 6px;}
.contact-block p {color: #FFFFFF;}
.contact-block ul {margin-bottom: 30px;}
.contact-block ul li {position: relative; padding-left: 30px; color: #FFFFFF;}
.contact-block ul li a {color: #FFFFFF;}
.contact-block ul li.pobox:before {content: '\f015'; font-family: FontAwesome; color: #FFFFFF; position: absolute; left: 0; font-size: 25px;}
.contact-block ul li.phone:before {content: '\f095'; font-family: FontAwesome; color: #FFFFFF; position: absolute; left: 0; font-size: 24px;}
.contact-block ul li.email:before {content: '\f0e0'; font-family: FontAwesome; color: #FFFFFF; position: absolute; left: 0; font-size: 19px;}
.contact-input {border: 1px solid #707070; padding: 5px 15px; font-size: 16px; width: 100%;}
.contact-textarea {height: 120px; border: 1px solid #707070; padding: 5px 15px; font-size: 16px; width: 100%;}
.contact-submit {color: #FFFFFF; font-size: 18px; border: none; display: inline-block; font-weight: 300; background-color: #CEA50D; padding: 6px 21px; text-transform: uppercase; box-shadow: 0 .125rem .25rem rgba(0,0,0,.075)!important; letter-spacing: 1px;}

.default-content {padding-top: 120px;}

/* Footer */
.footer {background-color: #E1E4E5; padding: 45px 0;}
.footer h2 {font-size: 39px; color: #474708; font-weight: 300; margin-bottom: 18px;}
.footer h2 a {font-weight: 500; color: #474708;}

@media (max-width : 1199px) {
.banner-info .item h2 {font-size: 39px;}
.banner-info .item a.bannerbtn:hover {background-color: #5A5D17; border: 1px solid #AA9A2F;}
.about-block h2, .client-block h2, .service-block h2, .brand-block h2, .consultation-block h2, .team-block h2, .contact-block h2 {font-size: 30px;}
.service-block h3, .contact-block h3 {font-size: 24px;}
.footer h2 {font-size: 30px;}
}

@media (max-width : 991px) {
body {font-size: 16px;}
.header {height: 101px;}
.smaller {height: 81px;}
.hamburger {cursor: pointer; display: block; right: 15px; margin-top: 3px; position: absolute; z-index: 100;}
.line {width: 36px; height: 4px; background: #CEA50D; margin-bottom: 5px;}
.hamburger-close {font-size: 24px; color: #FFFFFF; text-shadow: none; box-shadow: none; position: absolute; top: 9px; right: 15px; margin: 0; padding: 0; cursor: pointer;}
.slidemenu {display: block; width: 320px; height: 100%; background: #CEA50D; position: fixed; top: 0; right: -320px; transition: right .1s; overflow-y: auto; padding: 52px 0; z-index: 10000;}
.slidemenu--open {right: 0;}
.slidemenu ul.mobile-menu {padding: 0 24px;}
.slidemenu ul.mobile-menu li {position: relative; font-size: 16px; padding: 0 0 5px; font-weight: 400;}
.slidemenu ul.mobile-menu li a {color: #FFFFFF;}
.slidemenu ul.mobile-menu li a:hover {text-decoration: underline;}
.slidemenu ul.mobile-menu li:last-child {position: relative; padding-left: 24px;}
.slidemenu ul.mobile-menu li:last-child:before {content: '\f095'; font-family: FontAwesome; color: #FFFFFF; position: absolute; left: 0; font-size: 18px;}

.banner-info .banner-3 .banner-text {margin-left: 0;}
.banner-info .item h2 {font-size: 36px;}
.banner-info .item a.bannerbtn {font-size: 14px; padding: 7px 27px;}

.about-block h2, .client-block h2, .service-block h2, .brand-block h2, .consultation-block h2, .team-block h2, .contact-block h2 {font-size: 27px;}
.service-block h3, .contact-block h3 {font-size: 21px;}
.service-hold .row>[class*=col-] h6 {font-size: 16px;}
.footer h2 {font-size: 27px;}
.logo {width: 130px;}
.smaller .logo {width: 120px;}
}
@media (max-width : 782px) {
body.admin-bar header {margin-top: 46px;}
.banner-info .owl-dots {bottom: 6px;}
.banner-info .owl-dot span {width: 7px !important; height: 7px !important; background-color: #FFFFFF; margin: 0 2px !important; border: 1px solid transparent;}
.banner-info .owl-dot.active span {border: 1px solid #CEA50D;}
.logo {width: 115px;}
.smaller .logo {width: 110px;}
}
@media (max-width : 767px) {
.banner-info .item h2 {font-size: 24px;}
.about-block h2, .client-block h2, .service-block h2, .brand-block h2, .consultation-block h2, .team-block h2, .contact-block h2 {font-size: 24px;}
.service-block h3, .contact-block h3 {font-size: 20px;}
.footer h2 {font-size: 24px;}
}