html {
font-size: 62.5%;
overflow-y: scroll;
-webkit-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
}
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,font,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td {
border: 0;
font-family: inherit;
font-style: inherit;
font-weight: inherit;
margin: 0;
outline: 0;
padding: 0;
vertical-align: baseline;
}
body {
font-family: 'Lato', sans-serif;
font-size: 14px;
line-height: 150%;
letter-spacing: 0.5px;
color: #000000;
}
article,aside,details,figcaption,figure,footer,header,main,nav,section {
display: block;
}
a {
color: #f7db44;
-webkit-transition: all 700ms;
transition: all 700ms;
cursor: pointer;
outline: 0;
}
a,a:hover,a:focus {
text-decoration: none;
}
a:hover,a:focus,a:active {
color: #f7db44;
}
::selection {
background: #f7db44;
color: #FFF;
}
::-moz-selection {
background: #f7db44;
color: #FFF;
}
*::-webkit-input-placeholder {
color: #333333 !important;
}
*:-moz-placeholder {
color: #333333 !important;
}
*::-moz-placeholder {
color: #333333 !important;
}
*:-ms-input-placeholder {
color: #333333 !important;
}
*,*:before,*:after {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
p {
margin-bottom: 1.5em;
}
b,strong {
font-weight: bold;
}
dfn,cite,em,i {
font-style: italic;
}
blockquote {
font-size: 18px;
font-style: italic;
font-weight: 300;
margin: 24px 40px;
quotes: """";
}
blockquote:before,blockquote:after {
content: "";
}
q {
quotes: "“""”""‘""’";
}
q:before {
content: open-quote;
}
q:after {
content: close-quote;
}
address {
margin: 0 0 1.5em;
}
pre {
background: #eee;
font-size: 15px;
font-size: 1.5rem;
line-height: 1.6;
margin-bottom: 1.6em;
max-width: 100%;
overflow: auto;
padding: 1.6em;
}
code,kbd,tt,var {
font: 15px Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
}
abbr,acronym {
border-bottom: 1px dotted #666;
cursor: help;
}
mark,ins {
background: #fff9c0;
text-decoration: none;
}
sup,sub {
font-size: 75%;
height: 0;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sup {
bottom: 1ex;
}
sub {
top: .5ex;
}
small {
font-size: 71.5%;
}
big {
font-size: 125%;
}
dl {
margin: 0 20px;
}
iframe,
object {
max-width: 100%;
margin-bottom: -5px;
}
h1,h2,h3,h4,h5,h6 {
margin: 10px 0px;
padding: 0;
border: 0;
font-size: 100%;
font-weight: 900;
vertical-align: baseline;
display: block;
clear: both;
line-height: 120%;
}
h1{
font-size: 2.2em;
}
h2 {
font-size: 2em;
}
h3 {
font-size: 1.8em;
}
h4 {
font-size: 1.6em;
}
h5 {
font-size: 1.4em;
}
h6 {
font-size: 1.2em;
}
hr {
background-color: #eaeaea;
height: 1px;
width: 100%;
-webkit-border-radius: 0px;
-moz-border-radius: 0px;
border-radius: 0px;
margin: 20px auto;
border: 0;
}
ul, ol {
margin: 0 0 1.5em 3em;
}
ul {
list-style: disc;
}
ol {
list-style: decimal;
}
li > ul,
li > ol {
margin-bottom: 0;
margin-left: 1.5em;
}
dt {
font-weight: bold;
}
dd {
margin: 0 1.5em 1.5em 0;
}
img {
height: auto;
max-width: 100%;
}
figure {
margin: 0;
}
table {
border-collapse: collapse;
border-spacing: 0;
font-size: 14px;
line-height: 2;
margin: 0 0 20px;
width: 100%; }
caption,th,td {
font-weight: normal;
text-align: left;
}
caption {
font-size: 16px;
margin: 20px 0;
}
th {
font-weight: bold;
text-transform: uppercase;
padding: 0px 10px;
}
td {
padding: 0px 10px;
border: 1px solid rgba(0,0,0,.1);
}
thead th {
border: 1px solid rgba(0,0,0,.1);
}
button,input,select,textarea {
font-size: 100%;
margin: 0;
vertical-align: baseline;
*vertical-align: middle;
}
button,input[type="button"],input[type="reset"],input[type="submit"] {
text-align: center;
padding: 10px 20px;
margin: 10px;
border: none;
box-shadow: none;
text-shadow: none;
font-weight: 400;
vertical-align: middle;
cursor: pointer;
white-space: nowrap;
color: #FFF;
}
input[type="button"]:hover,input[type="reset"]:hover,input[type="submit"]:hover {
color: #fff;
}
button:focus,
input[type="button"]:focus,
input[type="reset"]:focus,
input[type="submit"]:focus,
button:active,
input[type="button"]:active,
input[type="reset"]:active,
input[type="submit"]:active {
}
input[type="checkbox"],
input[type="radio"] {
padding: 0;
}
input[type="search"] {
-webkit-appearance: textfield;
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
}
input[type="search"]::-webkit-search-decoration {
-webkit-appearance: none;
}
button::-moz-focus-inner,
input::-moz-focus-inner {
border: 0;
padding: 0;
}
input[type="text"],
input[type="tel"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
textarea {
padding: 10px;
border: 1px solid #b1b1b1;
}
textarea {
overflow: auto;
vertical-align: top;
width: 100%;
}
.entry-content button,
.entry-content input[type="button"],
.entry-content input[type="reset"],
.entry-content input[type="submit"] {
padding: 5px 20px 5px 20px;
}
.entry-content button:hover,
.entry-content input[type="button"]:hover,
.entry-content input[type="reset"]:hover,
.entry-content input[type="submit"]:hover {} .input-box {
border: 0 !important;
width: 274px;
text-align: left;
text-transform: none;
padding: 9px;
min-height: 46px;
padding-left: 15px !important;
display: inline-block;
border-radius: 4px;
background: rgba(255, 255, 255, 0.95);
}
textarea:hover,
input:hover,
textarea:active,
input:active,
textarea:focus,
input:focus {} input:focus,
textarea:focus {
border: 1px solid rgba(0, 0, 0, 0.3);
outline: 0;
}
section {
padding: 80px 0px;
width: 100%;
}
.pink-bg {
background: #FFB0BF !important;
}
.red-bg {
background: #E4022D !important;
}
.green-bg {
background: #43AC34 !important;
}
.light-bg{
background: #f9f9f9 !important;
}
.blue-bg {
background: #484d9b !important;
}
.brown-bg {
background: #5D2C04 !important;
}
.yellow-bg {
background: #FFCF22 !important;
}
.purple-bg{
background: #92278f !important;
}
.orange-bg{
background: #ffbe52 !important;
}
.black-bg {
background: #000000 !important;
}
.grey-bg {
background: #94999F !important;
}
.white-bg {
background: #FFFFFF !important;
}
.fixed-bg {
background-size: cover !important;
background-position: center;
}
.parallax-bg {
background-attachment: fixed !important;
background-size: cover !important;
background-position: center;
}
.parallax-bg  .overlay{
padding: 100px 0px;
background: rgba(0, 0, 0, 0.3);
}
.static-bg {
background-size: cover !important;
background-position: center;
width: 100%;
}
.pink-text{
color: #FFB0BF !important;
}
.red-text {
color: #E4022D !important;
}
.green-text {
color: #43AC34 !important;
}
.purple-text {
color: #604A7B !important;
}
.blue-text {
color: #484d9b !important;
}
.yellow-text {
color: #FFCF22 !important;
}
.dark-text {
color: #404040 !important;
}
.white-text {
color: #FFFFFF !important;
}
.grey-text {
color: #95969A !important;
}
.black-text {
color: #404040 !important;
}
.brown-text{
color: #C5A47E !important;
}
.orange-text{
color: #ffbe52 !important;
}
.buttons {
text-align: center;
margin-top: 45px;
}
.button {
display: inline-block;
text-align: center;
text-transform: uppercase;
padding: 10px 35px 10px 35px;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
margin: 10px;
}
#submit-btn {
font-weight: 900;
text-transform: uppercase;
margin: 0 auto;
padding: 10px 40px;
vertical-align: middle;
cursor: pointer;
white-space: nowrap;
-webkit-border-radius: 50px;
-moz-border-radius: 50px;
border-radius: 50px;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
background: #000000;  border: 1px solid #000000;
width: auto;
outline: none;
-webkit-box-shadow: 0 3px 0 0 rgba(0,0,0,0.1);
-moz-box-shadow: 0 3px 0 0 rgba(0,0,0,0.1);
box-shadow: 0 3px 0 0 rgba(0,0,0,0.1);
letter-spacing: 1px;
}
#submit-btn:hover,#submit-btn:focus, #submit-btn:active {
color: #FFFFFF;
background: #000000;
border: 1px solid #000000;
}
.btn{
font-weight: 900;
text-transform: uppercase;
vertical-align: middle;
cursor: pointer;
white-space: initial;
padding: 10px 40px;
margin-top: 20px;
margin-bottom: 20px;
-webkit-border-radius: 50px;
-moz-border-radius: 50px;
border-radius: 50px;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-webkit-box-shadow: 0 3px 0 0 rgba(0,0,0,0.1);
-moz-box-shadow: 0 3px 0 0 rgba(0,0,0,0.1);
box-shadow: 0 3px 0 0 rgba(0,0,0,0.1);
}
.pink-btn, .pink-btn:hover, .pink-btn:focus, .pink-btn:active {
background: #FFB0BF;
color: #ffffff;
}
.brown-btn {
border: 1px solid #9c8424;
background: #9c8424;
color: #FFFFFF;
}
.brown-btn:hover, .brown-btn:focus , .brown-btn:active {
border: 1px solid #9c8424;
background: #9c8424;
color: #FFFFFF;
}
.purple-btn {
border: 1px solid #CA59B3;
background: #CA59B3;
color: #FFFFFF;
}
.black-btn {
border: 1px solid #333333;
color: #FFFFFF;
background: #333333;
}
.black-btn:hover, .black-btn:focus, .black-btn:active{
border: 1px solid #333333;
color: #FFFFFF;
}
.black-border-btn {
border: 1px solid #333333;
color: #333333;
background: transparent;
}
.black-border-btn:hover, .black-border-btn:focus{
border: 1px solid #333333;
color: #FFFFFF;
background: #333333;
}
.white-border-btn {
border: 1px solid #FFFFFF;
color: #FFFFFF;
background: transparent;
}
.white-border-btn:hover, .white-border-btn:focus{
border: 1px solid #FFFFFF;
color: #000000;
background: #FFFFFF;
}
.orange-btn, .orange-btn:hover, .orange-btn:focus, .orange-btn:active {
background: #ffbe52;
color: #000000;
}
.grey-btn {
background: transparent;
border: 1px solid #333333;
color: #333333;
}
.white-btn, .white-btn:hover, .white-btn:focus, .white-btn:active{
background: #FFFFFF;
border: 1px solid #FFFFFF;
color: #000000;
}
.red-btn, .red-btn:hover, .red-btn:active, .red-btn:focus {
color: #FFF;
background: #E4022D;
}
.green-btn, .green-btn:hover, .green-btn:active, .green-btn:focus {
color: #ffffff;
background: #43AC34;
}
.blue-btn {
background: #484d9b;
border: 1px solid #484d9b;
color: #ffffff !important;
}
.blue-btn:hover {
color: #484d9b !important;
border: 1px solid #484d9b;
background: #FFFFFF;
}
.yellow-btn, .yellow-btn:hover, .yellow-btn:active, .yellow-btn:focus {
color: #FFF;
background: #FFCF22;
}
.red-btn, .green-btn, .blue-btn, .yellow-btn {
-webkit-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}
.gradient-btn{
color: #FFFFFF;
background: #48dad9;
background:-webkit-linear-gradient(45deg, #988aeb 0%, #6cb7d8 ,#48dad9 100%) !important;
background:linear-gradient(45deg, #988aeb 0%, #6cb7d8 , #48dad9 100%) !important;
}
.gradient-btn:hover, .gradient-btn:focus, .gradient-btn:active{
color: #FFFFFF;
}
.button-wrapper{
}
.button-wrapper .btn{
margin: 0px 5px;
}
#loader {
min-height: 930px;
position: relative;
display: none;
}
#loader .loader-icon {
background: url(//www.beaugates.com.my/wp-content/themes/autogate/images/loading.gif) no-repeat center center;
background-color: #FFF;
margin: -22px -22px;
top: 50%;
left: 50%;
z-index: 10000;
position: fixed;
width: 44px;
height: 44px;
-webkit-background-size: 30px 30px;
background-size: 30px 30px;
border-radius: 5px;
}
.arrow-animate {
position: absolute;
z-index: 99;
left: 48%;
margin-top: -10%;
}
.row {
float: left;
width: 100%;
margin-right: 0;
margin-left: 0;
}
.row-eq-height{
display:-webkit-box;
display:-webkit-flex;
display:-ms-flexbox;
display:flex
}
.alignmiddle{
align-items:center
}
.panel-grid, .so-panel {
margin: 0px !important;
}
.panel-grid-cell {
padding: 0px !important;
margin: 0px !important;
}
.left{
float: left;
}
.right{
float: right;
}
.wrapper{
padding: 40px 0px 0px 0px;
}
.content {
padding: 50px 0px;
width: 100%;
display: inline-block;
}
.innercontent {
width: 80%;
padding: 20px;
margin: 0 auto;
}
.leftrightcontent{
padding: 0px 20px;
margin: 0 auto;
display: inline-block;
width: 90%;  
}
ul.displayinline{
list-style: none;
padding: 0 !important;
margin: 0 !important;
}
ul.displayinline li {
display: inline-block !important;
padding: 0px !important;
margin: 10px 10px 10px 0px !important;
vertical-align: middle !important;
}
ul.displayinline li:last-child{
margin-right: 0px !important;
}
ul.displayinline li .fa{
font-size: 20px;
background: #FFFFFF;
width: 40px;
height: 40px;
color: #293991;
padding: 10px 8px;
text-align: center;
border-radius: 50%;
}
#search-page .content {
padding: 0px;
width: 100%;
}
#search-page ul li {
width: 100%;
display: inline-block;
padding: 20px 0px 40px 0px;
margin-bottom: 10px;
border-bottom: 1px solid #dedede;
}
#search-page .content h2 {
font-size: 20px;
margin-bottom: 5px;
}
#search-page .content .desc, #search-page .content .desc a {
font-weight: 100;
color: #939393;
margin-bottom: 15px;
}
#search-page .content .caption {
line-height: 1.4em;
margin-bottom: 30px;
}
.metaslider .caption-wrap{
text-align: left !important;
color:#FFFFFF !important;
opacity: 1 !important;
padding: 20px !important;
margin: 0 auto !important;
display:block !important;
width:100% !important;
height:100% !important;
line-height:1.4em !important;
letter-spacing: 2px;
font-size: initial;
background: rgba(0, 0, 0, 0.5) !important;
}
.metaslider .caption {
text-align: left !important;
padding: 0px !important;
margin: 0px auto !important;
word-wrap: break-word;
position: absolute !important;
transform: translateY(-50%) !important;
-ms-transform: translateY(-50%) !important;
-webkit-transform: translateY(-50%) !important;
top: 50% !important;
left: 0;
right: 0;
width: 100% !important;
}
.metaslider .caption h1{
font-size: 3em;   
}
.metaslider .btn {
padding: 10px 30px;
margin: 10px 0px 5px 0px;
font-size: 13px;
border-radius: 0;
}
.metaslider small{
color: #DDDDDD;
letter-spacing: 0.1em;
}
.metaslider .flexslider{
margin: 0 !important;
}
.metaslider .flexslider .flex-direction-nav{
position: absolute;
bottom: 20px;
width: 100%;
height: 25px;
top: 50%;
left: 0;
display: inline-block;
z-index: 2;
}
.metaslider .flexslider .flex-direction-nav li a{
background-color: rgba(0, 0, 0, 0.6) !important;
background-image: url(//www.beaugates.com.my/wp-content/themes/autogate/images/bg_direction_nav.png) !important;
background-size: 80px;
opacity: 1 !important;
width: 40px !important;
height: 50px !important;
margin: 0 !important;
}
.flex-control-nav{
bottom: 20px !important;
}
.flexslider .flex-direction-nav a.flex-prev {
opacity: 1 !important;
left: 5% !important;
}
.flexslider .flex-direction-nav .flex-next {
opacity: 1 !important;
right: 5% !important;
}
.ms-theme-cubic{
padding: 0 !important;
}
@media only screen and (max-width: 1400px) {
}
@media only screen and (max-width: 1200px) {
.flexslider .flex-direction-nav a.flex-prev {
left: 43% !important;
}
.flexslider .flex-direction-nav .flex-next {
right: 43% !important;
}
}
@media only screen and (max-width: 1024px) {
}
@media only screen and (max-width: 991px) {
}
@media only screen and (max-width: 767px) {
.metaslider .caption-wrap {
position: initial !important;
bottom: 0 !important;
right: 0 !important;
left: 0 !important;
width: 100% !important;
color: #000000;
opacity: 1;
top: initial !important;
transform: initial !important;
-ms-transform: initial !important;
-webkit-transform: initial !important;
padding: 40px 10px !important;
background: #484d9b !important;
}
.metaslider .caption {
text-align: center !important;
width: 100% !important;
word-wrap: break-word;
position: initial !important;
top: 0% !important;
transform: initial !important;
-ms-transform: initial !important;
-webkit-transform: initial !important;
}
.metaslider .caption h1 {
font-size: 2.2em !important;
}
}
@media only screen and (max-width: 600px) {
}
@media only screen and (max-width: 480px) {
}
.heading {
width: 100%;
padding: 0px;
margin: 0 auto 40px auto;
}
.heading-small{
margin: 0 auto 30px auto;   
}
.title {
font-size: 2.6em;
font-weight: 900;
padding: 0px;
margin: 0px;
line-height: 120%;
}
.title-big{
font-size: 150%;
font-weight: 300;
letter-spacing: 3px;
}
.title span{
color: #e4022d;
}
.subtitle {
font-size: 1.2em;
padding: 10px 0px;
margin: 0px;
line-height: 1.2em;
letter-spacing: 0.5em;
text-transform: uppercase;
color: #a5a2a2;
}
.heading .caption {
font-size: 18px;
font-weight: 300;
padding: 10px 0px;
margin: 0;
}
#fixedleftbar{
position: fixed;
z-index: 9999;
left: 0;
top: 0;
width: 60px;
height: 100%;
background: #54667A;
}
#fixedleftbar ul{
list-style: none;
padding: 150px 0px 0px 0px;
margin: 0;
}
#fixedleftbar ul li{
display: inline-block;
width: 100%;
padding: 6px;
vertical-align: middle;
}
#fixedleftbar ul li a{
display: block;
color: #FFFFFF;
}
#fixedleftbar ul li img{
float: left;
display: inline-block;
-webkit-filter: brightness(0) invert(1);
filter: brightness(0) invert(1);
}
#fixedleftbar ul li span{
display: none;    
}
#fixedleftbar ul li:hover{
background: #333333;
width: 210px;
}
#fixedleftbar ul li:hover span{
display: inline-block; 
color: #FFFFFF;
padding: 12px 15px;
}
#homebannerwrapper ul{
list-style: none;
padding: 0;
margin: 0;
}
#homebannerwrapper ul li{
list-style: none;
padding: 0;
margin: 0;
}
#homebannerwrapper .owl-controls {
text-align: center;
padding: 20px 0px 0px 0px;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
left: 0;
opacity: 0.7;
z-index: 3;
overflow: hidden;
text-decoration: none;
height: 42px;
width: 100%;
display: inline-block;
position: relative;
bottom: 0;
display: none;
}
#homebannerwrapper .owl-carousel .owl-stage {
display: flex;
align-items: center;
}
#homebannerwrapper .owl-carousel .item {
float: none;
display: inline-block;
}
#homebannerwrapper .owl-controls .owl-dots .owl-dot {
display: inline-block;
zoom: 1;
}
#homebannerwrapper .owl-controls .owl-dots .owl-dot span {
display: block;
width: 20px;
height: 5px;
margin: 5px;
background: #ffffff;
border: 1px solid #ffffff;
}
#homebannerwrapper .owl-controls .owl-dots .owl-dot.active span {
display: block;
width: 20px;
height: 5px;
margin: 5px;
border: 1px solid #ffffff;
background: transparent;
}
#homebannerwrapper .owl-controls .owl-dots .owl-dot.active span, #homebannerwrapper .owl-controls .owl-dots .owl-dot:hover span{
background:#869791;
}
#homebannerwrapper #customNav {
text-indent: -9999px;
overflow: hidden;
text-decoration: none;
height: 33px;
width: 81px;
bottom: 33px;
left: 0;
right: 0;
margin: 0 auto;
position: relative;
}
#homebannerwrapper #customNav .owl-prev {
left: 0;
width: 40px;
height: 33px;
font-size: 12px;
outline: none;
position: absolute;
z-index: 99;
-webkit-border-radius: 0%;
-moz-border-radius: 0%;
border-radius: 0%;
background: rgba(0, 0, 0, 0.5) url(//www.beaugates.com.my/wp-content/themes/autogate/images/arrow-back.png) no-repeat center;
cursor: pointer;
}
#homebannerwrapper #customNav .owl-next {
right: 0%;
width: 40px;
height: 33px;
font-size: 12px;
outline: none;
position: absolute;
z-index: 99;
-webkit-border-radius: 0%;
-moz-border-radius: 0%;
border-radius: 0%;
background: rgba(0, 0, 0, 0.5) url(//www.beaugates.com.my/wp-content/themes/autogate/images/arrow-back.png) no-repeat center;
cursor: pointer;
-webkit-transform: scaleX(-1);
-moz-transform: scaleX(-1);
-ms-transform: scaleX(-1);
-o-transform: scaleX(-1);
transform: scaleX(-1);
}
#intro{
background: #fafafa;
}
#intro .overlay{
padding: 60px 0px;
}
#intro ul{
list-style: none;
padding: 0;
margin: 0;
}
#intro ul li{
list-style: none;
padding: 10px;
margin: 0px 10px 20px 10px;
display: inline-block; border-radius: 0 20px 0 20px;
height: 150px;
width: 150px;
text-align: center;
box-shadow: 0px 2px 6px #CCCCCC;
position: relative;
line-height: 160%;
}
#intro ul li strong{
text-decoration: underline;
}
#intro ul li:before{
content: "\f0a3";
font-family: FontAwesome;
font-style: normal;
font-weight: normal;
text-decoration: inherit; color: #3eba0a;
font-size: 14px;
position: absolute;
top: 6px;
left: 10px;
}
#intro ul li span{
position: absolute;
display: block;
width: 86%;
top: 50%;
right: 0;
left: 0;
margin: 0 auto;
transform: translateY(-50%);
-ms-transform: translateY(-50%);
-webkit-transform: translateY(-50%);
}
@keyframes swing {
0% { transform: rotate(3deg); }
100% { transform: rotate(-3deg); }
}
.swing {
animation: swing ease-in-out 1s infinite alternate;
transform-origin: center -20px; box-shadow: 5px 5px 10px rgba(0,0,0,0.5);
}
#about{
}
#about .overlay{
padding: 80px 0px;
background: rgba(255, 255, 255, 0.8);
}
#about .content{
}
#videobox-1 img {    margin: 10px auto;
padding: 10px;
display: block;
}
.video-wrapper{
position: relative;
overflow: hidden;
padding: 0;
margin: 0;
}
.video-wrapper .btn_videoPlay {
display: block;
width: 100%;
height: 100%;
}
.video-wrapper .btn_videoPlay:after {
position: absolute;
content: '';
width: 70px;
height: 70px;
top: 50%;
left: 0;
right: 0;
margin: 0 auto;
background: url(//www.beaugates.com.my/wp-content/themes/autogate/images/play-white.png) no-repeat;
background-size: 60%;
background-position: center;
transform: translateY(-50%);
-ms-transform: translateY(-50%);
-webkit-transform: translateY(-50%);
z-index: 2;
transition: 0.6s ease-out;
background-color: rgba(39, 39, 39, 0.5);
border-radius: 50%;
padding: 10px;
}
#contactform{
text-align: center;
}
#contactform .overlay{
padding: 100px 0px;
background: rgba(255, 253, 253, 0.9);
}
#contactform .contactform-wrapper{
padding: 0;
margin: 0 auto;
max-width: 900px;
width: 100%;
}
#contactform .price-wrapper{
}
.price-wrapper span {
right: 50%;
left: 50%;
margin: 0 auto;
display: inline-block;
letter-spacing: 0;
}
.price-wrapper h1 {
padding: 0px 8px;
display: inline-block;
}
#contactform #submit-btn{
margin-top: 30px;
color: #FFFFFF;
}
@keyframes textclip {
to {
background-position:200% center
}
}
.text-effect {
color: #fff;
font-weight: 700;
background: linear-gradient(to right,#697dff 10%,#fff 50%,#5bdaff 60%);
background-size: auto auto;
background-clip: border-box;
background-size: 200% auto;
color: #fff;
background-clip: text;
text-fill-color: transparent;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
animation: textclip 1.5s linear infinite;
display: inline-block;
}
#difference{
}
#difference .box{
padding: 5px;
border: 2px solid #484d9e;
}
#difference .box.special-box{
}
#difference .head{
background: #484d9e;
color: #FFFFFF;
font-size: 1.5em;
padding: 15px 20px;
}
#difference .image{
padding: 20px;
margin: 0;
height: auto;
}
#difference .content{
padding: 10px 5px;
font-size: 16px;
}
#difference .content ul{
list-style: none;
padding: 0;
margin: 0;
}
#difference .content ul li{
list-style: none;
padding: 10px 0px;
margin: 0;
line-height: 100%;
}
#difference .content ul li:nth-child(odd) {
background: #fbfbfb;
}
#difference .content ul li:nth-child(even) {
background: #f7db44;
}
#features{
}
#features [class*="col-"]{
padding: 0px 5px;
}
#features ul{
list-style: none;
padding: 0;
margin: 0;
}
#features ul li{
list-style: none;
padding: 0px 0px 0px 20px;
margin: 0px 0px 10px 0px;
position: relative;
}
#features ul li:before{
content: "\f00c";
font-family: FontAwesome;
font-style: normal;
font-weight: normal;
text-decoration: inherit;
color: #000;
font-size: 15px;
padding-right: 0.5em;
position: absolute;
top: 0;
left: 0;
}
#features .box{
border: 1px solid #DDDDDD;
padding: 10px 5px;
min-height: 250px;
}
#features .box .title {
font-size: 14px;
text-transform: uppercase;
padding: 8px 10px;
margin: 0px 0px 10px 0px;
color: #FFFFFF;
background: #484d9b;
}
#features .image{
padding: 0px;
margin-bottom: 0px;
height: auto;
}
#features .image img{
object-fit: initial;
align-items: initial;
margin: 0 auto;
display: block;
text-align: center;
width: initial;
height: initial;
}
#features .content{
padding: 0px;
min-height: 100px;
}
#features .content .caption{
padding: 0px;
font-size: 13px;
}
#usp{
padding-top: 0;
}
#usp .video-wrapper{
width: 100%;
max-width: 760px;
text-align: center;
margin: 0px auto 60px auto;
}
#usp ul{
list-style: none;
padding: 0;
margin: 0px auto;
text-align: center;
}
#usp ul li{
list-style: none;
padding: 10px;
margin: 0 auto 20px auto;
text-align: center;
display: inline-block;
width: 24%;
vertical-align: top;
font-size: 15px;
font-weight: 900;
position: relative;
text-transform: uppercase;
}
#usp ul li:before{
content: "";
width: 100%;
height: 100px;
background-image: url(//www.beaugates.com.my/wp-content/themes/autogate/images/listbg.png);
background-size: 160px;
background-position: center;
background-repeat: no-repeat;
opacity: 0.1;
position: absolute;
top: 0;
left: 0;
}
#usp ul li img{
width: 60px;
}
#usp ul li span{
font-size: 1.2em;
font-weight: 900;
line-height: 150%;
padding: 0px 8px;
margin: 5px;
display: inline-block;
background: #f7db44;
clear: both;
}
#interested{
overflow: hidden;
}
#interested .box .image {
height: 220px;
margin-bottom: 20px;
}
#interested ul{
list-style: none;
padding: 0;
margin: 0;
}
#interested ul li{
list-style: none;
padding: 0;
margin: 0;
}
#interested ul li .box{
text-align: center;
}
#interested ul li .box .image{
height: 250px;
}
#interested ul li .box .title{
font-size: 13px;
}
#testimonials {
position: relative;
}
#testimonials .overlay{
height: 100%;
padding: 80px 0px;
background: rgba(255, 255, 255, 0.8);
}
#testimonials .heading{
text-align: right;
display: inline-block;
color: rgba(232, 232, 232, 0.6);
font-size: 2em;
position: absolute;
right: 10%;
top: 30px;
}
#testimonials .testimonial-wrapper{
position: relative;
}
#testimonials .testimonial-wrapper:before{
}
#testimonials ul{
list-style: none;
padding: 0;
margin: 0;
}
#testimonials ul li{
list-style: none;
padding: 0;
margin: 0;  
}
#testimonials ul li .box {
padding: 0;
margin: 0 auto;
text-align: left;
display: inline-flex;
}
#testimonials ul li .box .image{
position: relative;
padding: 20px;
height: auto;
}
#testimonials ul li .box .image img{
position: relative;
z-index: 99;
}
#testimonials ul li .box .image:before {
content: "";
position: absolute;
border: 5px solid rgba(232, 232, 232, 0.6);
padding: 30px;
top: 0;
left: 0;
width: 90%;
height: 100%;
z-index: 0;
}
#testimonials ul li .box .image:after {
content: "";
position: absolute;
border: 5px solid #a8aac9;
padding: 30px;
bottom: -20px;
left: 50px;
width: 40%;
height: 40%;
z-index: 0;
background: #a8aac9;
}
#testimonials ul li .content{
padding: 20px 0px;
position: relative;
line-height: 150%;
color: #FFFFFF;
}
#testimonials ul li .content:before{
position: absolute;
content: "";
width: 100px;
height: 80px;
top: -50px;
left: -10px;
right: 0;
background-image: url(//www.beaugates.com.my/wp-content/themes/autogate/images/quote-1.png);
background-position: left;
background-size: 100px;
background-repeat: no-repeat;
opacity: 0.5;
}
#testimonials ul li .footernote{
padding: 20px 0px 0px 0px;
text-align: right;
display: block;
font-size: 12px;
font-style: italic;
color: #c7c7c7;
}
#testimonials .owl-controls {
text-align: right;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
left: 0;
opacity: 1;
z-index: 3;
overflow: hidden;
text-decoration: none;
width: 100%;
display: inline-block;
position: relative;
bottom: 0;
}
#testimonials .owl-controls .owl-dots .owl-dot {
display: inline-block;
zoom: 1;
}
#testimonials .owl-controls .owl-dots .owl-dot span {
display: block;
width: 10px;
height: 10px;
margin: 4px;
background: transparent;
border: 1px solid rgba(232, 232, 232, 0.6);
}
#testimonials .owl-controls .owl-dots .owl-dot.active span, #testimonials .owl-controls .owl-dots .owl-dot:hover span{
background: #a8aac9;
border: 1px solid #a8aac9;
width: 10px;
}
#testimonials #customNav {
text-indent: -9999px;
overflow: hidden;
text-decoration: none;
height: 40px;
width: 80%;
top: 50%;
left: 0;
right: 0;
margin: 0 auto;
position: absolute;
display: none !important;
}
#testimonials #customNav .owl-prev {
left: 0;
width: 40px;
height: 40px;
font-size: 12px;
outline: none;
position: absolute;
z-index: 99;
-webkit-border-radius: 0%;
-moz-border-radius: 0%;
border-radius: 0%;
background: url(//www.beaugates.com.my/wp-content/themes/autogate/images/arrow_back.png) no-repeat center;
cursor: pointer;
display: none !important;
}
#testimonials #customNav .owl-next {
right: 0%;
width: 40px;
height: 40px;
font-size: 12px;
outline: none;
position: absolute;
z-index: 99;
-webkit-border-radius: 0%;
-moz-border-radius: 0%;
border-radius: 0%;
background: url(//www.beaugates.com.my/wp-content/themes/autogate/images/arrow_back.png) no-repeat center;
cursor: pointer;
-webkit-transform: scaleX(-1);
-moz-transform: scaleX(-1);
-ms-transform: scaleX(-1);
-o-transform: scaleX(-1);
transform: scaleX(-1);
}
#sellingpoints{
}
#sellingpoints ul{
list-style: none;
padding: 0;
margin: 0px auto;
text-align: center;
}
#sellingpoints ul li{
list-style: none;
padding: 20px 10px;
margin: 0px 10px;
text-align: center;
display: inline-block;
width: 17%;
height: 260px;
vertical-align: middle;
border: 1px solid #ddd;
border-radius: 20px;
}
#sellingpoints ul li img{
width: 50px;
}
#sellingpoints ul li h4 {
font-size: 1.3em;
color: #484d9b;
}
#sellingpoints ul li span{
font-size: 12px;
line-height: 150%;
display: inline-block;
}
#gallery{
}
#gallery .bwg_load_btn{
display: none;
}
#gallery-nav{
list-style: none;
padding: 0;
margin: 0;
columns: 3;
-webkit-columns: 3;
-moz-columns: 3;
-webkit-column-gap: 0px;
-moz-column-gap: 0px;
column-gap: 0px;
font-size: 15px;
font-weight: bold;
border-bottom: 5px solid #f7db44;
}
#gallery-nav li{
list-style: none;
padding: 0;
margin: 0;
text-align: center;
}
#gallery-nav li a{
display: block;
padding: 15px 5px 10px 5px;
line-height: 150%;
}
#gallery-nav li a.accordion-toggle{
background: #f7db44;
color: #000000;
}
#gallery-nav li a.collapsed{
background: transparent;
color: #000000;
}
#gallery .gallery-wrapper{
clear: both;
}
.panel-group .panel {
padding: 0 !important;
margin: 0 !important;
border-radius: 0;
overflow: hidden;
border: none;
box-shadow: none;
border-bottom: 1px solid #f7db44;
}
.panel-group .panel-heading{
display: none;
}
.panel-group .panel-body{
border: none !important;
padding: 0px;
}
.panel-group .panel .collapse{
display: block;
opacity: 0;
height: 0;
}
.panel-group .panel .collapse.in{
display: block;
opacity: 1;
height: auto;
}
.productsFilter{
text-align: center;
display: block;
width: 100%;
position: relative;
background: #FAFAFA;
border: 1px solid #DDDDDD;
border-radius: 10px;
margin: 0 0 20px 0;
}
.productsFilter a {
padding: 6px 20px;
margin: 10px 5px;
font-weight: bold;
color: #000000;
display: inline-block;
box-shadow: 1px 1px 5px #DDDDDD;
}
.productsFilter a:hover, .productsFilter a.current{
color: #f7db44;
background: #333333;
border-radius: 10px;
}
.productsContainer{
margin: 0 auto;
text-align: center;
}
.productsContainer .col-xs-6 {
padding: 0px 5px;
}
.productsContainer .box{
position: relative;
margin-bottom: 10px !important;
}
.productsContainer .image{
padding: 0 !important;
margin: 0 !important;
height: auto !important;
}
.productsContainer ul{
margin: 0;
padding: 0;
}
.productsContainer ul li{
list-style: none;
margin: 0 auto;
padding: 0;
display: inline-block;
vertical-align: middle;
}
.fullideo{
object-fit: cover;
width: 100%;
height: 100%; }
#contactpage{
}
#contactpage #contactpageform{
max-width: 600px;
}
#contactinfo{
list-style: none;
padding: 50px 0px;
margin: 0;
}
#contactinfo li{
list-style: none;
padding: 20px;
margin: 10px 10px;
display: inline-block;
width: 25%;
height: 200px;
vertical-align: top;
border: 1px solid #e8e6e6;
background: #FFFFFF;
box-shadow: 0px 2px 10px #DDDDDD;
}
#contactinfo li .box{
position:relative;
display:table;
top:50%;
width:100%;
margin:0px;
padding:0px;
transform:translateY(-50%);
-ms-transform:translateY(-50%);
-webkit-transform:translateY(-50%);
}
#contactinfo li .fa{
font-size: 3em;
}
#contactinfo li a{
color: #000000;
}
#news-wrapper{
}
#news-wrapper ul{
list-style: none;
padding: 0;
margin: 0;
}
#news-wrapper ul li{
list-style: none;
padding: 0;
margin: 0;
}
#news-wrapper .box{
position: relative;
overflow: hidden;
margin: 0 auto;
}
#news-wrapper .box .image{
height: 200px;
}
#news-wrapper .box .desc{
font-size: 10px;
margin-bottom: 10px;
}
#news-wrapper .box .desc a{
color: #757575;
}
#news-wrapper .box .title{
font-size: 18px;
color: #000000;
}
#news-wrapper .box .content{
font-size: 14px;
padding: 20px 0px;
}      #news-wrapper .box .content .read-more{ }
.tabbable{
display: flex;
height: 100%;
}
.tabs-left > .nav-tabs {
float: left;
border-bottom: 0;
padding: 0px 3% !important;
width: 30%;
}
.tabs-left > .nav-tabs > li {
float: none;
padding: 0px 15px !important; }
.tabs-left > .nav-tabs > li > a {
min-width: 74px;
margin: 0;
padding: 0;
-webkit-border-radius: 0;
-moz-border-radius: 0;
border-radius: 0;
border: none;
background: transparent;
font-weight: 600;
}
.tabs-left > .nav-tabs > li > a:hover,.tabs-left > .nav-tabs > li > a:focus {
border: none;
background: transparent;
}
.tabs-left > .nav-tabs .active > a,.tabs-left > .nav-tabs .active > a:hover,.tabs-left > .nav-tabs .active > a:focus {
border: none;
}
.tab-content{
float: right;
width: 70%;
}
.tab-content > .tab-pane,.pill-content > .pill-pane {
display: none;
}
.tab-content > .active,.pill-content > .active {
display: block;
height: 100%;
}
.tab-content .image{
height: 100%;
}
.tab-content .image img{
object-fit: cover;
width: 100%;
height: 100%;
}
#navigation{
background:#FAFAFA;
padding:10px;
margin-bottom:50px;
}
#navigation .widget-title{
font-weight:600;
font-size:18px;
padding:15px 0px;
position:relative;
width:100%;
display:block;
background:#4c494a;
margin-bottom:10px;
color:#FFF;
text-align:center;
}
#navigation ul{
list-style:none;
padding:0;
margin:0;
}
#navigation ul li{
list-style:none;
padding: 5px 0px;
}
#navigation li.menu-item-has-children{
}
#navigation li.menu-item-has-children a{
font-weight:600;
font-size:18px;
padding:15px 0px;
position:relative;
width:100%;
display:block;
background:#EE3E36;
margin-bottom:10px;
text-align:center;
}
#navigation ul li.menu-item-has-children a:after{
content:"\f107";
font-family:FontAwesome;
font-style:normal;
font-weight:normal;
text-decoration:inherit;
font-size:18px;
padding:5px;
}
#navigation ul li a{
color:#2f2f2f;
}
#navigation ul li .sub-menu{
position:relative;
display:none;
top:0;
left:0;
width:auto;
border-left-width:0;
opacity:1;
-webkit-animation:none;
animation:none;
visibility:visible;
-webkit-box-shadow:none;
box-shadow:none;
background-color:#FFFFFF;
margin:10px 0px;
padding:10px;
-webkit-transition:none;
-o-transition:none;
transition:none;
}
#navigation ul li.current-menu-parent .sub-menu{
display:block;
}
#navigation ul li .sub-menu li{
list-style: disc;
padding: 5px 0px;
margin: 0px 0px 0px 20px;
}
#navigation ul li .sub-menu li a{
font-size:14px;
position:initial;
padding:2px 0px;
margin:0px;
background:none;
color:initial;
}
#navigation ul li .sub-menu li a:after{
display:none;
}
#navigation ul li .sub-menu li.current-menu-item a{
color:#EE3E36;
}
#floatcta{
position: fixed;
width: 100%;
bottom: 0;
left: 0;
z-index: 999;
}
#floatcta ul{
list-style: none;
padding: 0;
margin: 0;
columns: 3;
-webkit-columns: 3;
-moz-columns: 3;
-webkit-column-gap: 0px; -moz-column-gap: 0px; column-gap: 0px;
}
#floatcta ul li{
list-style: none;
padding: 10px 0;
margin: 0; 
}
#floatcta ul li .fa{
color: #FFFFFF;
font-size: 20px;
width: 32px;
height: 32px;
border-radius: 50%;
padding: 7px;
box-shadow: 0px 0px 8px #a1a1a1;
}
#floatcta ul li:hover{
background: #eeeeee;
}
#floatcta .phone{
background: #f5f5f5;
}
#floatcta .phone .fa{
background: #000000;
}
#floatcta .whatsapps{
background: #FFFFFF;
}
#floatcta .whatsapps .fa{
background: #25D366;
}
#floatcta .mobile{
background: #f5f5f5;
}
#floatcta .mobile .fa{
background: #ffbe52;
}
#floatcta a{
display:block;
color: #000000;
font-weight: 600;
}
#custom-pagination{
display: block;
margin: 0 auto;
text-align: center;
}
#custom-pagination .custom-page{
display: inline-block;
border: 1px solid #DBDBDB;
padding: 4px 15px;
}
#custom-pagination .custom-number{
display: inline-block;
margin-left: 5px;
}
#custom-pagination .custom-number .page-numbers{
border: 1px solid #DBDBDB;
padding: 6px 8px;
}
#custom-pagination .custom-number .page-numbers.current{
border: 1px solid #918F90;   
}
#custom-pagination .custom-number .page-numbers.prev{
margin-right: 2px;
padding: 3px 8px;
font-size: 14px !important;
}
#custom-pagination .custom-number .page-numbers.next{
margin-left: 2px;
padding: 3px 8px;
font-size: 14px !important;
}
.box {
width: 100%;
padding: 0px;
margin-bottom: 20px;
}
.box .image {
height: 300px;
margin-bottom: 20px;  
} 
.box .image img {
object-fit: cover;
align-items: center;
margin: 0 auto;
display: block;
text-align: center;
width: 100%;
height: 100%;
}
.box .content {
padding: 0px;
width: 100%;
}
.box .title {
font-size: 16px;
font-weight: 700;
padding: 0px 0px 10px 0px;
}
.box .subtitle{
font-weight: 300;
font-size: 13px;
color: #a0a0a0;
}
.box:hover img {
display: block;
filter: brightness(1.1) invert(0);
}
.navbar-collapse {
box-shadow: none; }
.navbar-inverse li.menu-item-open-left:hover > ul.sub-menu,
.navbar-inverse li.menu-item-open-left.link-focus > ul.sub-menu {
right: 0;
}
.navbar-inverse li.menu-item-open-left li:hover > ul.sub-menu,
.navbar-inverse ul ul li.link-focus > ul.sub-menu {
right: 100%;
left: auto;
}
.site-main .comment-navigation,
.site-main .paging-navigation,
.site-main .post-navigation {
margin: 0 0 1.5em;
overflow: hidden;
}
.comment-navigation .nav-previous,
.paging-navigation .nav-previous,
.post-navigation .nav-previous {
float: left;
clear: both;
padding: 10px;
}
.comment-navigation .nav-next,
.paging-navigation .nav-next,
.post-navigation .nav-next {
float: right;
text-align: right;
width: 50%;
padding: 10px;
}
.nav-links {
border-top: 1px solid #ACABAB;
}
.nav-links a {
color: #000000;
padding: 0px;
}
.nav-links a:hover {
color: #000000;
text-decoration: underline;
}
.prev {
padding: 15px 0 15px 60px;
display: inline-block;
margin-right: 10px;
border: none;
}
.next {
padding: 15px 60px 15px 0;
display: inline-block;
margin-left: 10px;
border: none;
}
.page-numbers {
padding: 0 5px 4px;
font-size: 14px;
}
span.page-numbers {
font-weight: bold;
text-decoration: underline;
}
.site-main .post-navigation {
float: left;
width: 100%;
}
.screen-reader-text {
clip: rect(1px, 1px, 1px, 1px);
position: absolute !important;
}
.screen-reader-text:hover,
.screen-reader-text:active,
.screen-reader-text:focus {
background-color: #f1f1f1;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
clip: auto !important;
color: #21759b;
display: block;
font-size: 14px;
font-weight: bold;
height: auto;
left: 5px;
line-height: normal;
padding: 15px 23px 14px;
text-decoration: none;
top: 5px;
width: auto;
z-index: 100000;
}
.alignleft {
display: inline;
float: left;
margin-right: 1.5em;
}
.alignright {
display: inline;
float: right;
margin-left: 1.5em;
}
.aligncenter {
clear: both;
display: block;
margin: 0 auto;
}
.clear:before,
.clear:after,
.entry-content:before,
.entry-content:after,
.comment-content:before,
.comment-content:after,
.site-header:before,
.site-header:after,
.site-content:before,
.site-content:after,
.site-footer:before,
.site-footer:after {
content: '';
display: table;
}
.clear:after,
.entry-content:after,
.comment-content:after,
.site-header:after,
.site-content:after,
.site-footer:after {
clear: both;
}
.singleblogtitle {
padding: 0px;
margin: 0px;
text-transform: uppercase;   }
.sidebar-wrap {
border-left: 1px solid rgba(0, 0, 0, 0.05);
}
.widget {} 
.widget .widget-title {
font-size: 24px;
margin-top: 20px;
margin-bottom: 40px;
text-transform: uppercase;
}
.widget h1.widget-title {
width: 100%;
color: #ffffff !important;
text-align: center;
margin-bottom: 10px !important;
}
.widget h3.widget-title {
font-size: 28px;
font-weight: 900;
padding: 0px;
margin: 0px;
line-height: 1.2em;
text-transform: uppercase;
}
.widget-area {
float: left;
width: 100%;
}
.widget-area .widget {
clear: both;
}
.widget-area .widget-title {
margin: 10px auto 10px auto;
}
.widget-area ul li {
margin: 0px;
line-height: 1.2em;
padding: 0px 0px 6px 0px;
}
.widget-area .widget-title,
.widget-area ul li {
text-align: left !important;
text-transform: capitalize;
font-weight: normal;
}
.widget-area .widget-title:before {} 
.widget_search .search-submit {
display: block;
width: 46px;
height: 46px;
position: absolute;
top: 0;
right: 0;
padding: 0;
margin: 0;
background: url(//www.beaugates.com.my/wp-content/themes/autogate/images/search_icon.png) no-repeat center center;
text-indent: -9999999px;
}
.widget_search label {
margin-bottom: 5px;
width: 100%;
position: relative;
}
.widget_search form {
position: relative;
}
.widget_search input {
width: 83%;
padding: 12px 15% 12px 2%;
}
.widget ul {
margin: 0 0 20px 0px;
padding: 0;
display: block;
}
.widget li {
margin: 0px 0px 10px 20px;
position: relative;
}
.widget ul.horizontal {
margin: 0;
padding: 0;
display: block;
}
.widget ul.horizontal li {
list-style: none;
margin: 0px 0px 3px 0px;
position: relative;
float: left;
}
.widget ul.menu {
padding: 0px 0px 10px 0px;
}
.widget ul.menu li {
list-style: none;
margin: 0px 0px 5px 0px;
padding: 0px 30px;
display: inline;
border-right: 1px solid #ffffff;
}
.widget ul.menu li:last-child {
margin-right: 0px;
border-right: 0px solid #ffffff;
}
.widget ul.menu li a {
color: #ffffff;
text-transform: uppercase;
font-size: 24px;
line-height: 1.5em;
margin: 0;
padding: 0;
display: inline-block;
}
.widget ul.menu li.current-menu-item a {
color: #c5a47e;
}
.widget ul.menu li a:hover {
color: #c5a47e;
}
.widget ul.product-categories{
}
.widget ul.product-categories li{
border-bottom: 1px solid;
list-style: none;
line-height: 3em;
margin: 0 0 0 20px;
}
.container>.navbar-header,
.container-fluid>.navbar-header,
.container>.navbar-collapse,
.container-fluid>.navbar-collapse {
margin-right: 0;
margin-left: 0;
}
.site-content {
background: #FFF;
min-height: 200px;
}
.home-content {
margin-top: 0px;
}
.sticky {} .hentry {} .byline,
.updated {
display: none;
}
.single .byline,
.group-blog .byline {
display: inline;
}
.entry-meta-large .byline,
.entry-meta-large .updated {
display: none;
}
.page-content,
.entry-summary {
margin: 1.5em 0 0;
line-height: 1.4em;
}
.page-links {
clear: both;
margin: 0 0 1.5em;
}
.page-header{
width:100%;
height:340px;
margin:0px;
padding:0px;
z-index:0;
border-bottom: 0px solid #F2F2F2;
background-color: #F2F2F2;
}
.page-header-small{
width:100%;
height:250px;
margin:0px;
padding:0px;
z-index:0;
}
.page-header .overlay{
width:100%;
height:100%;
background:rgba(0, 0, 0, 0.5);
}
.page-header-content{
position:relative;
display:table;
top:50%;
width:100%;
margin:0px;
padding:0px;
font-size:30px;
color:#FFFFFF;
transform:translateY(-50%);
-ms-transform:translateY(-50%);
-webkit-transform:translateY(-50%);
}
.page-header-content h3.page-title{
font-size: 40px;
font-weight: 300;
text-align: center;
letter-spacing: 8px;
text-transform: uppercase;
padding: 0;
margin: 0 auto;
left: 0;
right: 0;
width: 80%;
}
.page-header-content .caption{
font-size: 15px;
color: #000000;
letter-spacing: 0px;
text-transform: initial;
padding-top: 10px;
line-height: 1.4em;
}
article .page-header{
height: auto;
margin-bottom: 20px;
padding-bottom: 10px; 
border-bottom: 1px solid #e8e8e8;
background: transparent;
display: inline-block;
}
.breadcrumb{
width:90%;
margin:0 auto;
padding:15px 0;
line-height:1em;
font-size:15px;
font-weight:normal;
text-align:center;
list-style:none;
background-color:transparent;
}
.entry-title {
margin-top: 0;
padding-top: 0;
position: relative;
}
.entry-title:after {
position: absolute;
margin: auto;
z-index: 1;
content: "";
width: 10%;
height: 2px;
background: #c5a47e;
bottom: -10px;
left: 0;
}
.page-template-template-fullwidth .entry-title {
display: none;
}
.entry-meta {
padding-top: 10px;
font-weight: 100;
color: #939393;
margin-bottom: 15px;
}
.wp-caption {
border: 1px solid #ccc;
margin-bottom: 1.5em;
max-width: 100%;
}
.wp-caption img[class*="wp-image-"] {
display: block;
margin: 1.2% auto 0;
max-width: 98%;
}
.wp-caption-text {
text-align: center;
}
.wp-caption .wp-caption-text {
margin: 0.8075em 0;
}
.section-header {
padding: 0px;
}
.section-header .section-legend {
font-size: 16px;
margin-bottom: 0;
color: #808080;
padding-top: 0;
}
.preloader {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: #fefefe;
z-index: 99999;
height: 100%;
width: 100%;
overflow: hidden !important;
}
.status {
width: 200px;
height: 200px;
position: absolute;
left: 50%;
top: 50%;
background-image: url(//www.beaugates.com.my/wp-content/themes/autogate/images/loading.gif);
background-repeat: no-repeat;
background-position: center;
margin: -100px 0 0 -100px;
}
#parallax_move .layer {
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
width: 100%;
height: 100%;
background-position: top center;
}
.home-header-wrap {
overflow: hidden;
position: relative;
}
.header.header {
width: 100%; }
#info {
position: absolute;
float: right;
right: 30px;
padding: 0;
margin: 0;
text-align: center;
z-index: 2;
width: 100px;
line-height: 150%;
}
#info ul {
margin: 0;
padding: 0;
} 
#info ul li {
display: inline-block;
padding: 2px 10px;
margin: 0px;
vertical-align: middle;
background: #e4022d;
margin: 0px 0px 0px 1px;
}
#info ul li a{
color: #FFFFFF; 
font-size: 14px;
}
#top-search-form{
position: absolute;
background: #FFFFFF;
z-index: 1;
text-align: right;
width: 100%;
display: none;
}
#top-search-form input[type="submit"]:hover {
color: #fff;
border: 0px solid #c5a47e;
}
#top-search-form .panel-last-child{
display: inline-block;
position: absolute;
top: 22%;
right: 1%;
}
#top-search-form #close-btn{
font-size: 20px;
font-weight: normal;
color: #5dbaa9;
}
#site-navigation {
float: right;
margin: 0;
padding: 0;
clear: both;
width: 100%;
border-color: transparent;
}
.navbar {
background: transparent;
border: 0;
-webkit-border-radius: 0 !important;
-moz-border-radius: 0 !important;
border-radius: 0 !important;
text-align: left;
}
#main-nav {
z-index: 9999;
width: 100%;
margin-bottom: 0;
padding: 5px 0px;
background: #FFFFFF;
-webkit-transform: translate3d(0, 0, 0);
-moz-transform: translate3d(0, 0, 0);
-ms-transform: translate3d(0, 0, 0);
-o-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
-webkit-transition: -webkit-transform 0.4s, background 0.4s;
-moz-transition: -moz-transform 0.4s, background 0.4s;
-o-transition: -o-transform 0.4s, background 0.4s;
transition: transform 0.4s, background 0.4s;
}
#main-nav.fixed {
position: fixed;
top: 0;
padding: 20px 0px 5px 0px;
background: #fdfbfe;
-webkit-transform: translate(0, -1em);
-moz-transform: translate(0, -1em);
-ms-transform: translate(0, -1em);
-o-transform: translate(0, -1em);
transform: translate(0, -1em);
-webkit-transform: translate3d(0, -1em, 0);
-moz-transform: translate3d(0, -1em, 0);
-ms-transform: translate3d(0, -1em, 0);
-o-transform: translate3d(0, -1em, 0);
transform: translate3d(0, -1em, 0);
background-color: rgba(255,255,255,0.96);
box-shadow: 0px 2px 10px rgba(0,0,0,0.1);
}
#main-nav .container-fluid{
width: 90%;
margin: 0 auto;
}
.navbar-inverse .navbar-nav {
margin-left: 0;
margin-right: 0;
}
.navbar-inverse .navbar-nav >li {
display: inline-block;
float: initial !important;
}
.navbar-inverse .navbar-nav>li>a {
padding: 10px 15px;
display: table-cell;
vertical-align: middle;
text-align: center;
color: #000000;
}
.navbar-inverse .navbar-nav>li.has_children>a{
padding-right: 20px;
}
.navbar-inverse .navbar-nav>li:last-child {    }
.navbar-inverse .navbar-nav>li:last-child a, .navbar-inverse .navbar-nav>li:last-child a:hover{  }
.navbar-inverse .navbar-nav>li>a span {
font-weight: 600;
font-size: 12px;
color: #000000;
}
.navbar-inverse .main-navigation ul > li {
display: inline;
margin-top: 20px;
}
.navbar-inverse .main-navigation > ul > li:last-child {
margin-right: 0 !important;
}
.navbar-inverse .main-navigation > ul > li > a {
color: #404040;
padding: 0;
line-height: 35px;
}
.navbar-inverse .navbar-nav ul.sub-menu {
left: -999em;
position: absolute;
top: 100%;
background: #fff;
width: 220px;
box-shadow: 3px 3px 2px rgba(50, 50, 50, 0.08);
z-index: 9999;
padding: 10px;
}
.navbar-inverse .navbar-nav ul.sub-menu {
margin: 0;
}
.navbar-inverse .navbar-nav ul.sub-menu ul.sub-menu {
position: absolute;
top: 0;
}
.navbar-inverse .navbar-nav ul.sub-menu li {
float: none;
position: relative;
list-style: none;
padding: 5px ;
}
.navbar-inverse .navbar-nav ul.sub-menu li a {
color: #404040;
font-size: 95%;
padding: 8px 0px;
}
.navbar-inverse .navbar-nav ul.sub-menu li:hover > a,
.navbar-inverse .navbar-nav ul.sub-menu li.link-focus > a { }
.navbar-inverse ul ul {
left: -999em;
}
.navbar-inverse ul ul ul {
left: -999em;
top: 0;
}
.navbar-inverse ul li:hover > ul.sub-menu,
.navbar-inverse ul li.link-focus > ul.sub-menu {
left: 0;
}
.navbar-inverse ul ul li:hover > ul.sub-menu,
.navbar-inverse ul ul li.link-focus > ul.sub-menu {
left: 100%;
}
.navbar-inverse .navbar-toggle,
.navbar-inverse .navbar-toggle:hover,
.navbar-inverse .navbar-toggle:focus {
background-color: transparent;
filter: alpha(opacity=100);
opacity: 1;
box-shadow: none;
border-color: none;
border: 0px dotted black;
outline: none;
}
.navbar-inverse .navbar-toggle .icon-bar {
background-color: #000000;
}
.navbar-toggle.active {} 
.navbar-toggle.collapsed {
background-color: transparent !important;
}
#site-navigation > ul {
width: auto;
position: relative;
}
#site-navigation > ul ul {
text-align: left;
}
#site-navigation > ul > li {} 
.navbar-header {
position: relative;
float: initial;
}
.navbar-header-menu {
float: right;
}
.responsive-logo {
width: 250px; position: relative;
display: inline-block;
padding: 5px 0px;
margin: 0;
z-index: 999;
}
.responsive-logo img{
width: 100%;
max-width: 100%;  }
#main-nav.fixed .responsive-logo img{
width: 90%;  }
#main-nav.fixed .navbar-toggle .icon-bar {
background-color: #000000;
}
.navigation-wrapper {
width: 80%;
text-align: right;
margin: 0 auto;
float: right;
position: absolute;
display: table;
top: 50%;
right: 0;
left: 15%;
transform: translateY(-50%);
-ms-transform: translateY(-50%);
-webkit-transform: translateY(-50%);
}
.navbar-inverse .navbar-nav > li {
vertical-align: middle;
} 
.navbar-inverse .navbar-nav>li>a:hover, .navbar-inverse .navbar-nav>li>a:focus {
color: #484d9b;
}
.navbar-inverse .navbar-nav>li>a:hover span, .navbar-inverse .navbar-nav>li>a:focus span {
color: #000000;
}
.navbar-inverse .navbar-nav>li.current>a {
position: relative;
outline: none;
}
.navbar-right {
float: initial !important;
margin-right: 0px !important;
}
ul.nav > li.menu-item-home > a:before {
content: "";
display: none;
}
li.current>a:before {} 
ul.nav > li.current_page_item > a:before, ul.nav > li.current-menu-item > a {
outline: none; }
ul.nav > li.current_page_item > a:before,
ul.nav > li.current-menu-item > a:before {} ul.nav > li.current_page_item.menu-item-home > a:before {
content: "";
display: none;
}
ul.nav > li.current_page_item.current > a:before {}
ul.navbar-right li.lang-item {
display: inline-block;
background: #e4022d;
margin: 0px 0px 0px 1px;
}
ul.navbar-right li.lang-item a {
font-size: 12px;
text-transform: uppercase;
text-align: center;
color: #ffffff !important;
padding: 6px 10px;
}
.sitecontactlist {
position: relative;
padding: 0px;
margin: 10px 0px 20px 0px;
}
.sitecontactlist .sitelogo{
-webkit-filter: brightness(0) invert(1);
filter: brightness(0) invert(1);
}
.sitecontactlist ul {
margin: 0;
} 
.sitecontactlist ul li {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
align-items: center;
padding: 0px;
margin: 0px;
margin-bottom: 15px;
vertical-align: middle;
}
.sitecontactlist label{
display: inline-block;
width: 85%;
}
.sitecontactlist .icon{
width: 40px;
text-align: center;
margin: 0px 10px 0px 0px;
display: inline-block;
}
.sitecontactlist .fa{
font-size: 18px;
padding: 11px 10px;
margin: 0px;
width: 40px;
height: 40px;
text-align: center; background: #484d9b;
color: #FFFFFF;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
border-radius: 50%;
}
#footer {
position: relative;
background: #f2f2f2;
padding: 50px 0px 0px 0px;
}
#footer .title, #footer .subtitle{
letter-spacing: 5px;
color: #293991;
position: relative;
}
#footer .title{
font-size: 2em;
}
#footer .subtitle{
margin-bottom: 20px;
}
#footer .subtitle:before{
content: "";
background: #293991;
width: 30px;
height: 2px;
bottom: 0;
left: 0;
position: absolute;
}
#footer iframe{
height: 100%;
min-height: 280px;
margin-bottom: 40px;
}
#footer .widget ul.menu li {
margin: 0;
padding: 0;
border: none;
text-align: left;
display: block;
}
#footer .widget ul.menu li a {
color: #000000;
text-transform: capitalize;
margin: 0;
padding: 0;
display: inline-block;
}
#footer ul.social {
margin: 0 auto;
padding: 0;
text-align: center;
display: inline-block;
}
#footer ul.social li {
margin: 0;
padding: 0 5px;
display: inline-block;
width: 40px;
text-align: center;
}
#footer ul.social li .fa{
color: #FFFFFF;
text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
}
.copyright {
padding: 10px 0px;
margin: 40px 0px 0px 0px;
font-size: 12px;
color: #FFFFFF;
background: #000000;
text-align: center;
display: block;
width: 100%;
clear: both;
}
.footer-widget-wrap > .container {
text-align: left;
}
.footer-widget {
float: none;
display: inline-block;
vertical-align: top;
width: 100%;
margin-bottom: 20px;
}
.footer-widget ul#menu-menu-1 {
list-style: none;
}
.footer-widget ul {
margin-left: 0;
padding-left: 0;
}
.footer-widget li {
list-style: none;
margin-left: 0;
text-align: left;
}
.footer-widget li a {
color: #000000;
}
.footer-widget li a:hover {
color: #C5A47E;
}
.footer-widget-wrap {   }
.footer-widget-wrap .widget .widget-title {
font-size: 18px;
padding: 0px 0px 15px 0px;
}
.nopadding {
padding: 0 !important;
}
.nomargin {
margin: 0 !important;
}
#sociamediabar{
position: fixed;
left: 0;
top: 50%;
width: 50px;
height: auto;
}
#sociamediabar ul{
position: relative;
margin: 0;
padding: 0;
text-align: center;
}
#sociamediabar ul:before{
position: absolute;
content: "";
background: #5E5E5E;
top: -60px;
left: 0;
right: 0;
margin: 0 auto;
width: 1px;
height: 50px;
}
#sociamediabar ul li{
list-style: none;
margin: 0px 0px 10px 0px;
padding: 0;
font-size: 15px;
}
#sociamediabar .fa{
font-size: 140%;
}
#sociamediabar ul li a{
color: #5E5E5E;
}
div.wpcf7-validation-errors, div.wpcf7-acceptance-missing, div.wpcf7-response-output {
border: 0px solid #f7e700 !important;
margin: 5px 0px !important;
padding: 0 !important;
}
span.wpcf7-not-valid-tip{
font-size: 10px;
}
.formpadding {
padding: 0px;
margin: 0px;
} 
.formheader {
padding: 0px 0px 20px 0px;
font-size: 18px;
}
.formheader .font-big{
display: block;
font-size: 2em;
font-weight: 900;
line-height: 130%;
}
.formheader h1{
font-weight: 900;
text-shadow: 0px 1px 2px #000000;
}
.formheader h1 span.big-font{
font-size: 2.6em;
font-weight: bold;
line-height: 100%;
letter-spacing: 2px;
text-transform: uppercase;
display: block;
}
.formheader h2{
font-weight: 900;
margin: 0px 0px 10px 0px;
}
.formheader h6{
font-weight: 300;
letter-spacing: 1px;
}
.formcontent {
width: 100%;
display: inline-block;
}
.formcontent p{
margin: 0;
}
.form-label {
padding: 0px;
margin-bottom: 10px;
}
.form-label label {
width: 100%;
padding-bottom: 10px;
}
.form-label input, .form-label select {
width: 100%;
padding: 8px 10px;
background: #FFFFFF;
border: 1px solid #a2a2a2;
-webkit-border-radius: 0px;
-moz-border-radius: 0px;
border-radius: 0;
color: #000000;
outline: none;
}
.form-label textarea {
width: 100%;
padding: 8px 10px;
background: #FFFFFF;
border: 1px solid #a2a2a2;
-webkit-border-radius: 0px;
-moz-border-radius: 0px;
border-radius: 0;
color: #000000;
outline: none;
}
.single-project {
text-align: left;
margin-bottom: 25px;
}
.single-project .project-image {
width: 100%;
float: left;
text-align: left;
margin-bottom: 25px;
}
.single-project .project-description {
margin-bottom: 25px;
}
.single-project .button {
margin-left: 0;
}
.single-project .project-information {
margin-bottom: 10px;
}
.single-project .project-information ul li {
border-bottom: 1px dotted #dadada;
padding-bottom: 5px;
margin-top: 10px;
}
.single-project .project-information ul li span {
font-weight: 700;
margin-right: 5px;
}
.blog {
min-height: 175px;
position: relative;
overflow: hidden;
}
.blog-list {
background: #FFF;
}
article.hentry {
float: left;
width: 100%;
}
article.sticky {
background: #f9f9f9;
padding: 10px;
}
article {
text-align: left;
}
article .entry-meta a {
color: #888;
font-style: italic;
}
article .posted-on a:hover {
color: #C5A47E;
}
.entry-footer a {
color: #888;
font-style: italic;
}
.entry-footer a:hover {
color: #C5A47E;
}
.blogtitle {
display: block !important;
}
.blogtitle:after {
display: none !important;
}
.clear {
clear: both;
}
.sidebar-wrap.content-left-wrap {
margin-top: 50px;
padding-top: 0;
}
.debar-wrap {
margin-top: 50px;
}
.listpost-content-wrap h1.entry-title,
.list-post-top h1.entry-title {
float: none;
clear: none;
margin-top: 0;
}
.listpost-content-wrap .entry-title:before {
display: none;
content: "";
}
.listpost-content-wrap .entry-title a:after {
position: absolute;
margin: auto;
z-index: 1;
content: "";
width: 35%;
height: 2px;
background: #C5A47E;
bottom: -9px;
left: 0;
width: 50px;
display: none;
}
.post .entry-footer {
padding-top: 50px;
}
.listpost-content-wrap h1.entry-title a {
float: none;
position: relative;
}
.listpost-content-wrap-full {
width: 100%;
}
.listpost-content-wrap-full .list-post-top {
min-height: 1px;
}
.listpost-content-wrap .entry-content {
margin-top: 1em;
}
.listpost-content-wrap .entry-footer {
padding-top: 10px;
}
.listpost-content-wrap-full .entry-footer > span,
.listpost-content-wrap .entry-footer > span {
padding-right: 15px;
}
.listpost-content-wrap .entry-content p {
margin-bottom: 30px;
}
.entry-content {
margin: 0;
}
.list-post-top {
min-height: 130px;
display: inline-block;
width: 70%;
border-top: 2px solid #000000;
}
.search .list-post-top {
min-height: 1px;
}
.entry-footer {
background: transparent;
}
.entry-footer-large a {
color: #8b8b8b;
font-style: italic;
}
.entry-footer-large {
background: transparent;
padding: 0 0 20px 0px;
position: relative;
padding-right: 200px;
float: left;
width: 100%;
}
.entry-footer-large > span {
padding-right: 5px;
}
.entry-footer-large-left {
float: left;
}
.large-container .entry-content p {
margin: 4px 20px 0px 0px;
}
.entry-meta-large {
float: right;
position: absolute;
right: 0;
top: 0
}
.post-img-wrap-large a img {
max-width: 100%;
width: 100%;
height: auto;
-webkit-transform: scale(1);
-moz-transform: scale(1);
-o-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
-webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
-ms-transition: all 0.3s ease-out;
-o-transition: all 0.3s ease-out;
transition: all 0.3 ease-out;
}
.listpost-content-wrap-large {
position: absolute;
bottom: 0px;
background: rgba(255, 255, 255, 0.9) none repeat scroll 0% 0%;
min-height: 50px;
width: 100%;
padding: 15px 20px 0px 20px;
border-top: 2px solid #FFF;
}
.large-container {
background-color: #fff;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
margin: 0 0 35px 0;
position: relative;
width: 95%;
float: left;
}
.large-container .list-post-top {
min-height: 130px;
}
.dropdownmenu{
position: absolute;
display: block;
margin: 0;
padding: 0;
top: 10px;
right: 10px;
width: 10px;
height: 20px;
cursor: pointer;
display: block;
}
.dropdownmenu:before{position:absolute;color:#000000;content:"\f107";font-family:FontAwesome;font-style:normal;font-weight:normal;}
ul.sub-menu li .dropdownmenu{top: 5px;right:10px;}
ul.sub-menu li .dropdownmenu:before{color:#000000;content:"\f105";font-family:FontAwesome;font-style:normal;font-weight:normal;}
.mobile-bg-fix-wrap {
width: 100%;
overflow: hidden;
}
.mobile-bg-fix-wrap .mobile-bg-fix-img-wrap {
width: 100%;
height: 100%;
position: fixed;
top: 0;
left: 0;
z-index: 0;
}
.mobile-bg-fix-wrap .mobile-bg-fix-img {
position: absolute;
width: 100%;
height: 125%;
left: 0;
top: 0;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
.mobile-bg-fix-wrap .mobile-bg-fix-whole-site {
position: relative;
z-index: 1;
}
@media (max-width: 1680px) {
}
@media (max-width: 1400px) {
}
@media (max-width: 1200px) {
}
@media (max-width: 1024px) {
}
@media (max-width: 992px) {}
@media (min-width: 992px) {
#open-menu-products-container, #close-menu-products-container{
display: none;
}
#navigation .menu-products-container{
display: block !important;
}
#info{
display: none;
}
}
@media (max-width: 991px) {
.innercontent {
width: 100%;
}
.navbar-header-menu {
float:initial;
}
.navigation-wrapper {
float: initial;
position: absolute;
right: 0;
top: 100%;
left: 0;
width: 100%;
transform: initial;
-ms-transform: initial;
-webkit-transform: initial;
}
.navbar-toggle {
float: right !important;
right: 0 !important;
z-index: 3 !important;
padding: 10px 0px;
margin-right: 0px;
margin-top: 0px;
margin-bottom: 0px;
position: absolute;
}
.navbar-toggle.active span.icon-bar:nth-child(2){
display: none;
}
.navbar-toggle.active span.icon-bar:nth-child(1){
transform: rotate(45deg);
-ms-transform: rotate(45deg);
-webkit-transform: rotate(45deg);
margin-top: 5px;
margin-left: 2px;
width: 25px;
}
.navbar-toggle.active span.icon-bar:nth-child(3){
transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
-webkit-transform: rotate(-45deg);
margin-top: -2px;
margin-left: 2px;
width: 25px;
}
.navbar-inverse .navbar-nav {
line-height: normal;
text-align: center;
margin: 0px;
padding: 5px 0px;
background: #FFFFFF;
}
.navbar-inverse .navbar-nav > li {
display: inline-block;
margin-left: 0 !important;
margin-right: 0 !important;
width: 100%;
position: relative;
padding: 6px 0px;
}
.navbar-inverse .navbar-nav>li:last-child{
}
.navbar-inverse .navbar-nav > li a {
text-align: center;
height: auto;
display: block;
padding: 2px;
margin: 0px 15px;
color: #000000;
}
.navbar-inverse .navbar-nav>li.has_children>a{
padding-right: 0;
}
.navbar-inverse .navbar-nav>li>a:hover, .navbar-inverse .navbar-nav>li>a:focus {
background: transparent;
color: #000000;
}
.navbar-inverse .navbar-nav li.this-open > ul {
display: block !important;
}
.navbar-inverse .navbar-nav ul.sub-menu {
display: none !important;
position: relative;
top: 0;
box-shadow: none;
width: 100%;
}
.navbar-inverse .navbar-nav ul.sub-menu li {  margin: 0 10px;
padding: 0;
}
.navbar-inverse .navbar-nav ul.sub-menu li a {
margin: 0;  }
.dropdownmenu{
right: 40px;
width: 20px;
height: 15px;
background: #DDDDDD;
text-align: center;
}
.dropdownmenu:before {
position: absolute;
color: #000000;
content: "\f107";
font-family: FontAwesome;
font-style: normal;
font-weight: normal;
width: 100%;
height: 100%;
left: 0;
right: 0;
}
ul.sub-menu li .dropdownmenu {
top: 10px;
right: 40px;
}
ul.sub-menu li .dropdownmenu:before {
color: #000000;
content: "\f107";
font-family: FontAwesome;
font-style: normal;
font-weight: normal;
}
.navbar-nav.navbar-right:last-child {
margin-right: 0;
}
.navbar-inverse .navbar-nav ul.sub-menu li:last-child a {
border-bottom: none;
}
.navbar-inverse .navbar-nav ul.sub-menu ul.sub-menu {
position: relative;
left: 0;
top: 0;
}
.this-open > a {
color: #484d9b !important;
}
li.current>a:before {
content: "";
display: none !important;
}
#site-navigation{
max-height: 90vh;
}
#site-navigation > ul ul {
left: 0;
font-size: 12px;
padding: 0px 0px;
background: #DDDDDD;
}
ul.navbar-right li.lang-item {
display: none;
}
#fixedleftbar{
left: -50px;
}
#fixedleftbar:hover{
left: 0px;
-webkit-transition: all 0.3s ease-in-out;
transition: all 0.5s ease-in-out;
}
#open-menu-products-container, #close-menu-products-container{
display: block;
background: #f2f2f2;
color: #000000;
}
#open-menu-products-container{
margin-bottom: 20px;
}
#close-menu-products-container{
margin-top: 20px;
}
#usp ul li {
width: 44%
}
#testimonials .heading {
font-size: 1.6em;
}
#sellingpoints ul li {
margin: 0px 10px 20px 10px;
width: 29%;
height: 250px;
}
#contactinfo li {
width: 30%;
padding: 10px;
}
}
@media (max-width: 767px) {
h1{
font-size: 2em;
}
h2 {
font-size: 1.8em;
}
h3 {
font-size: 1.6em;
}
h4 {
font-size: 1.4em;
}
h5 {
font-size: 1.2em;
}
h6 {
font-size: 1.1em;
}
.header.header {
width: 100%;
position: initial;
}
.row-eq-height{
display: initial;
}
#main-nav .row-eq-height{
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
}
.formheader h2 {
display: block;
}
.formheader .font-big {
display: block;
}
.title {
font-size: 2.6em;
}
#testimonials .testimonial-wrapper {
padding: 50px 0px 0px 0px;
}
#testimonials ul li .box{
display: inline-block;
}
#testimonials ul li .content {
margin-top: 50px;
}
#gallery ul#gallery-nav{
display: none;
}
.panel-group .panel-heading {
display: block;
background: #f7db44;
color: #000000;
margin: 0px 0px 10px 0px;
}
.panel-group .panel-heading a{
color: #000000;
display: block;
position: relative;
font-size: 14px;
}
.panel-group .panel-heading a:after{
content: "\f106";
font-family: FontAwesome;
font-style: normal;
font-weight: normal;
text-decoration: inherit;
position: absolute;
top: 0;
right: 0;
}
.panel-group .panel-heading a.collapsed:after{
content: "\f107";
font-family: FontAwesome;
font-style: normal;
font-weight: normal;
text-decoration: inherit;
position: absolute;
top: 0;
right: 0;
}
#difference .col-sm-6{
float: left;
width: 50%;
padding: 0px 5px;
}
#difference .head {
font-size: 1.2em;
padding: 12px 10px;
}
#contactpageform{
margin-bottom: 50px;
}
#footer {
text-align: center;
}
#footer .widget ul.menu li {
text-align: center;
}
.sitecontactlist ul li {
display: block;
text-align: center;
}
.sitecontactlist .icon {
text-align: center;
margin: 0px auto;
display: block;
}
.sitecontactlist label {
display: block;
width: 100%;
padding: 10px 0px 0px 0px;
}
.footer-widget {
width: 100%;
text-align: center;
float: initial;
display: inline-block;
vertical-align: initial;
padding: 10px 0px;
}
.footer-widget li {
text-align: center;
}
}
@media (max-width: 650px) {
#contactinfo li {
width: 30%;
height: 160px;
padding: 10px;
margin: 5px;
font-size: 80%;
}
}
@media (min-width: 600px) {
.image-bg{
display: none;
}
}
@media (max-width: 600px) {
.page-header {
height: 250px;
}
.page-header-content{
font-size: 20px;
}
#contactform .contactform-wrapper {
padding: 20px 0px;
}
#difference .innercontent {
width: 100%;
padding: 0;
}
#usp iframe{
height: 300px;
}
#testimonials .heading {
right: 2%;
}
#sellingpoints ul li {
width: 44%;
height: 230px;
}
}
@media (min-width: 480px) {
}
@media (max-width: 480px) {
.heading {
margin: 0 auto 30px auto;
}
.title {
font-size: 2.2em;
}
.subtitle {
font-size: 1em;
}
.heading .caption{
width: 100%;
font-size: 18px;
}
.formheader {
font-size: 16px;
}
.page-header {
height: 200px;
}
.page-header-empty {
height: 100px;
}
.navbar-collapse {
padding-right: 0;
padding-left: 0;
}
.page-header-content .caption{
font-size: 13px;
}
.right {
float: initial;
}
#contactform {
padding: 40px 20px;
}
#difference .content {
font-size: 13px;
}
#usp iframe {
height: 220px;
}
#usp ul li{
font-size: 13px;
}
#usp ul li span {
font-size: 1em;
}
#features .col-xs-6{
width: 100%;
}
#features .box {
min-height: initial;
}
#sellingpoints ul li {
width: 95%;
max-width: 350px;
height: auto;
}
#sellingpoints ul li h4 {
font-size: 1.2em;
}
#contactpage .container-fluid{
padding-left: 5px;
padding-right: 5px;
}
#contactinfo h3 {
font-size: 1.4em;
}
#floatcta span {
padding-top: 5px;
display: block;
font-size: 12px;
}
#floatcta ul li {
padding: 15px 0px 10px 0;
}
.tabs-left > .nav-tabs {
padding: 0 !important;
width: 35%;
}
.flex-control-paging li a {
width: 8px;
height: 8px;
}
.flex-control-nav li a {
margin: 0 2px;
padding: 0;
}
.flex-direction-nav a {
width: 40px;
height: 40px;
margin: -25px 0 0;
background-size: 200%;
}
.widget h3.widget-title{
font-size: 22px;
}
.widget ul.menu li a {
font-size: 18px;
}
.post-img-wrap a {
float: none;
margin: 0 auto;
width: 250px;
height: 250px;
}
.post-img-wrap {
text-align: center;
margin-right: 0;
}
.post-img-wrap a img {
width: auto;
}
.list-post-top {
width: 90% !important;
}
#footer h4 small{
display: block;
}
.copyright {
margin: 0px 0px 80px 0px;
}
}
@media (max-width: 390px) {
#intro ul li {
width: 130px;
}
}
@media (max-width: 380px) {
#info ul.social li:first-child {
width: 100%;
}
.formheader .font-big {
font-size: 1.7em;
}
}
@media (max-width: 360px) {
.title {
font-size: 1.8em;
}
#intro ul li {
width: 130px;
margin: 0px 5px 20px 5px;
}
}
.cd-top {
z-index: 999;
display: inline-block;
height: 60px;
width: 60px;
position: fixed;
bottom: 25px;
right: 25px;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
border-radius: 50%;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
overflow: hidden;
text-indent: 100%;
white-space: nowrap;
background: #f7db44 url(//www.beaugates.com.my/wp-content/themes/autogate/images/cd-top-arrow.svg) no-repeat center 50%;
visibility: hidden;
opacity: 0;
-webkit-transition: opacity .3s 0s, visibility 0s .3s;
-moz-transition: opacity .3s 0s, visibility 0s .3s;
transition: opacity .3s 0s, visibility 0s .3s;
}
.cd-top.cd-is-visible,
.cd-top.cd-fade-out,
.no-touch .cd-top:hover {
-webkit-transition: opacity .3s 0s, visibility 0s 0s;
-moz-transition: opacity .3s 0s, visibility 0s 0s;
transition: opacity .3s 0s, visibility 0s 0s;
}
.cd-top.cd-is-visible {
visibility: visible;
opacity: 1;
}
.cd-top.cd-fade-out {
opacity: .5;
}
.no-touch .cd-top:hover {
background-color: #e86256;
opacity: 1;
}
@media (max-width: 767px) {
.cd-top {
bottom: 60px;
right: 20px;
}
}
@media (max-width: 480px) {
.cd-top {
height: 50px;
width: 50px;
bottom: 90px;
right: 10px;
}
}
#countdownimg{
position: relative;
}
#countdownwrapper{
position: absolute;
left: 35%;
bottom: 15%;
}
#main_countedown_3 .countdown {
margin-top: 0;
margin-bottom: 0;
}
.content_countdown .element_conteiner {
min-width: 50px !important; border: 1px solid rgba(254, 254, 254, 0.1); background: #484d9b !important;
padding: 5px !important;
margin: 5px !important;  }
.content_countdown .time_left {
border-radius: 0px;
background-color: transparent !important; 
font-size: 20px !important;
font-family: 'Hind', sans-serif !important;
color: #FFFFFF !important;
padding: 0 !important;
}
.content_countdown .time_description {
font-size: 10px !important;
font-weight: 100;
font-family: 'Hind', sans-serif !important;
color: #FFFFFF !important;
}
@media screen and (max-width: 767px) {
#countdownwrapper {
bottom: 20%;
}
.content_countdown .time_left{
font-size: 20px !important;
}
}
@media screen and (max-width: 600px) {
#countdownwrapper {
left: 0;
right: 0;
}
}
@media screen and (max-width: 480px) {
#countdownwrapper {
bottom: 0px;
}
.content_countdown .time_left{
font-size: 14px !important;
}
.content_countdown .time_description {
font-size: 8px !important;
}
}
.grecaptcha-badge{
display: none;
}