@charset "utf-8";
/* CSS Document */

/* SOF Universal Styling */
a {text-decoration:none;border:none; color:#222; outline: 0;}
a:hover{text-decoration:none}
ul{margin:0; padding:0;}
li{margin:0; padding:0;}
.clr{clear:both;}
body{font-weight:300; font-family:"Roboto Condensed"; font-size:13px; background-image: url(images/fader1.jpg);background-color: #FAFAFA; border-top:2px solid #000;
background-position: center center;
background-repeat: no-repeat;
background-attachment: fixed;}
#body_home{background:none!important}
p {margin: 15px 0;  font: 300 14px/20px "Roboto Condensed"; }
h1, h2, h3, h4, h5, h6 {font-weight:300; margin:0; padding:0}
h1 {font-size:36px;	color:#111;}
h2 {font-size:32px;	color:#222;}
h3 {font-size:28px; color:#fff;}
h4 {font-size:24px; color:#444;}
h5 {font-size:20px;	color:#555;}
h5 {font-size:20px;	color:#666;}
.blue{color:#0070c0}
.yellow{color:#ffff73}
.fullwidth{width:100%;}
.small{margin:15px 0!important; font-size:20px!important}
img {max-width:100%;}
.yel {color:#fcd253;}
.readmore a {color:#fcd253;}
/* EOF Universal Styling */

/*SOF Mobile Top Bar*/
.topbar{display:none;width:100%; background-color:#ffffff;border-bottom:1px solid #dddddd; position:relative; z-index:2; box-sizing:content-box}
.topphone{float:left; margin:10px 0 0 15px}
.topphone span{font-size:18px;}
.topphoneno{float:left; display:inline; margin: 0 0 0 5px}
/*SOF Mobile Top Bar*/

/*SOF Header*/
header {
    width: 100%;
    background: rgba(255,255,255,0.9);
    position: relative;
    padding: 15px 0 0;
    border-top: 5px solid #444;
}
.mainmenu{}
.logo{margin:0 0 15px; }

.contact{float:right!important; text-align:right; font-size:16px; line-height:32px;}
.contact .tel{font-size:28px; color:#666; font-weight:300;}
.contact .red {color:#800000;}
.contact a{color:#999}
.email{color:#111; padding:5px 0; margin:0 0}
.email a {color:#0070c0;}
.phone{margin:0 0; padding:0 0; color:#999;}
.phone span{color:#333; font-size:26px;}
.servicenavwrap{margin:0 0 10px; text-align:right}
.servicenav{float:right}
.servicenav li{border-right:1px solid #ddd;}
.servicenav li:last-child{border-right:none;} 
.servicenav li a{padding:5px 25px!important}
.navbar-nav > li { border-right: 1px solid #d9d9d9;}
.navbar-nav > li > a {
    padding: 5px 27px;
    font-size: 16px;
   
}
.navbar-nav { float:right;}
.navbar-nav li:last-child {border-right:none !important;}
.servicesheader{float:left; padding:5px 15px; font-size:16px;}
#body_cctv #cctv, #body_security_guards #security-guards, #body_event_security #event-security, #body_cleaning #cleaning, #body_catering #catering, #body_maintenance #maintenance{background:#eee; border-left:3px solid #000}
.parallax-mirror{margin-top:-11px}
.navbar-default {background-color:transparent !important; border:none;margin:0px !important; text-align:right !important;}
.navbar {min-height:40px !important;}
#body_home li#home a{color:#913025 !important;} 
.nav .open > a{
    border-color: #913025 !important;
}
/*EOF Header Styling*/

.mainmenu{float:left;}

/*SOF Social Media Icons*/
.socialtop{float:right; list-style:none; margin:4px 15px 4px 0; height:32px;; display:inline; box-sizing:content-box}
.socialtop:after{content: "";  display: table;  clear: both;}
.socialtop li{float:left; margin-left:10px}
.socialtop li.facebooktop a span { background: url(images/smspritetop.png) 0 -0px;}
.socialtop li.twittertop a span { background: url(images/smspritetop.png) 0 -32px;}
.socialtop li.googleplustop a span { background: url(images/smspritetop.png) 0 -64px;}
.socialtop li.linkedintop a span { background: url(images/smspritetop.png) 0 -96px;}
.socialtop li.emailtop a span { background: url(images/smspritetop.png) 0 -128px;}
.socialtop li a span {display: block; width: 32px; height: 32px; position: relative; z-index: 10; -webkit-transition: -webkit-transform 0.5s ease-out; -moz-transition: -moz-transform 0.5s ease-out; transition: transform 0.5s ease-out;}
.socialtop li a:hover span {-webkit-transform: rotateZ(360deg); -moz-transform: rotateZ(360deg); transform: rotateZ(360deg);}
.social{margin:0; padding:0; position: fixed;left:-10px;top:165px; z-index:100;list-style:none;}
.social li.facebook a span { background:url(images/ssmsprite.jpg) 0 -0px;}
.social li.twitter a span { background:url(images/ssmsprite.jpg) 0 -44px;}
.social li.googleplus a span { background:url(images/ssmsprite.jpg) 0 -88px;}
.social li.linkedin a span { background:url(images/ssmsprite.jpg) 0 -132px;}
.social li a span {display: block; width: 54px; height: 44px; margin-bottom:0px;position: relative; z-index: 10; -webkit-transition: -webkit-transform 0.5s ease-out; -moz-transition: -moz-transform 0.5s ease-out; transition: transform 0.5s ease-out;}
.social li a:hover span {-webkit-transform:translate(10px);-moz-transform:translate(10px);-o-transform:translate(10px);-ms-transform:translate(10px);}
/*EOF Social Media Icons*/

/*SOF Footer Styling*/
footer{width:100%; margin:0 0 0; position:relative; float:left; background-color:#fff;}
footer p{font-size:15px;padding:0; margin:0 0 10px}
.logofooter{float:left;}
.footerbar a{color:#dff34b;}
.copyright{color:#eee}
.credit{text-align:right; color:#eee}
.footeraddress{padding:15px 0 25px;}
.footerphone{padding-bottom:5px}
.footerbar{background:#333; float:left; width:100%; padding:8px 15px; font-size:15px; font-weight:normal !important;}
.flogo {
    position: absolute;
    bottom: -32px;
    width: 80px;
    right: 48%;
}
/*EOF Footer Styling*/

/*SOF Body Styling*/
.container-fluid{margin:0px 250px; position:relative}

.imgright{margin:0 0 25px 25px; float:right;}
.imgleft{margin:0 25px 25px 0; float:right;}
.carouselwrapper{width:100%; max-height:395px;z-index:1; margin-top:0; position:relative; z-index:1;}
.fadershadow{width:100%; height:70px; background-image:url(images/shadow.png); background-size:100% 100%}
.nomargin{margin:0!important}
.banner{width:100%; position: relative; z-index:-1;}
.content{background:rgba(0,0,0,0.8); width:100%; color:#fff; min-height:250px; padding:10px 0 35px}
.content p, .content ul {font-size:15px;}
.content ul {margin-left:30px;}
.content p a{color:#fff}
.content h2, .rbanner h2{border-left:3px solid #fcd253; font-size:22px; margin:15px 0; padding:0 0 0 15px; color:#fff; font-variant: small-caps}
.content h3 {font-size:18px; margin:40px 0px 20px 0px;color:#fcd253;}
.rbanner h2{font-variant: normal !important;}
.midservice{list-style:none; text-align:right; margin:0 0 25px;}
.midservice li a{color:#fcd253; font-size:16px; font-weight:normal;}
.services{list-style:none;  margin:0 0 0px;}
.services li{margin-top:5px;}
.services li a{color:#ffffff; font-size:16px; font-weight:normal;}
.fom{float:right; padding-left:15px; border-left:3px solid #fcd253; }
.fom a{color:#eee}
.banner .container-fluid{height:100%;}
.homebanner h1{position:absolute; font-size:28px; right:20%; top:40%; color:#fff; text-shadow: 1px 1px 2px rgba(0,0,0,1); border-left:3px solid #000; padding-left:15px; text-transform: uppercase}
.bannerh3{padding:11px 25px; line-height:28px; font-size:22px;color:#fff; text-shadow:1px 1px 2px #000; position:absolute; right:0; bottom:0;/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+0,000000+100&0+0,0.7+100 */
background: -moz-linear-gradient(left,  rgba(0,0,0,0) 0%, rgba(0,0,0,0.7) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(0,0,0,0)), color-stop(100%,rgba(0,0,0,0.7))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(left,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.7) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(left,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.7) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(left,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.7) 100%); /* IE10+ */
background: linear-gradient(to right,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.7) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#b3000000',GradientType=1 ); /* IE6-9 */
 width:100%; text-align:right; }
.banner h3 b{font-weight:300; color:#fcd253}
.parallax-mirror{height:1300px!important}
.productstbl img {width:95%; display:block; margin:10px auto 0; transition:All 1s ease;
    -webkit-transition:All 1s ease;
    -moz-transition:All 1s ease;
    -o-transition:All 1s ease;
    transform:scale(0.9) ;
    -webkit-transform:scale(0.9) ;
    -moz-transform:scale(0.9) ;
    -o-transform:scale(0.9) ;
    -ms-transform:scale(0.9) ;}
.productstbl img:hover{
    transform:scale(1.1) ;
    -webkit-transform:scale(1.1) ;
    -moz-transform:scale(1.1) ;
    -o-transform:scale(1.1) ;
    -ms-transform:scale(1.1) ;}
.homebanner{height:50vh; }
.general{height:33vh}
.content h1{margin:20px 0 20px; color:#fff; font-size:28px; border-left:3px solid #ffff83; padding-left:20px;}
.margintop25{margin-top:25px!important}
.rightimg{width:100%; margin:25px 0}
.lf8{max-width:120px!important; margin-top:7px!important}
.margintop{margin-top:45px}
.content h2{margin-top:40px}
.mbanner {background-color:#f9f9f9; padding:30px 0px; background-image:url('images/mbannerbg.png'); background-repeat:no-repeat;background-position:right;}
.h2note {font-size:12px !important; color:#666;}
.tagline {position:absolute; right:22%; top:40%; border-left:3px solid #913126; padding-left:10px; font-size:25px; color:#fff;text-shadow:1px 1px 3px #000;}
.tagline a {color:#fff;}
.mbanner h2 { border-left:3px solid #913126; padding-left:10px; font-size:20px; margin-bottom:30px;}
.mbanner .red {color:#913126;}
.rbanner {background-color:#913126; padding:30px 0px;}
.hows {font-size:16px; font-weight:normal;}
/*EOF Body Styling*/

/*SOF Content Slider*/
.products {
	text-align:center;
	margin:20px 0px;
}
a {
	color:#666;
}

.slideimage{position: relative; float:left; overflow:hidden; z-index:2;margin-bottom:23px}
.slideimage:hover img{cursor:pointer;}
.slideimage:hover .box{-webkit-transform:translate(100%);-moz-transform:translate(100%);-o-transform:translate(100%);-ms-transform:translate(100%); padding:20px;}
.slideimage .box{position:absolute; bottom:0%; padding:10px; left:-100%; width:100%; text-align:center; margin:0;-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;transition: opacity 0.35s, transform 0.35s;background:rgba(0,0,0,0.8) 0%;height:50%;}
.slideimage .box h2{ border-bottom:1px solid #D3840B;}
a .box{ color:#fff;}
.prod.slideimage {padding:0px !important;}
.trans {background-color:rgba(0,0,0,0.5); color:#fff; position:absolute; bottom:50%; font-weight:normal !important; text-align:center; width:100%; padding:5px;}
/*EOF Content Slider*/

/*SOF K2 Styling*/
/*EOF K2 Styling*/

@media (max-width: 1800px) {.container-fluid{margin:0px 200px}}
@media (max-width: 1700px) {.container-fluid{margin:0px 150px}}
@media (max-width: 1600px) {.container-fluid{margin:0px 100px}}
@media (max-width: 1500px) {.container-fluid{margin:0px 80px}}

@media (max-width: 1200px) {}
@media (max-width: 992px) {.fullwidth{margin-top:30px;} .mbanner {background-image:none !important;}.slideimage .box {display:none !important;}}
@media (min-width: 768px) {.lg-hidden{display:none;}}
@media (max-width: 768px) {.topbar, .lg-hidden{display:block}.copyright, .credit{text-align:center; line-height:30px}.footeraddress{text-align:center} .social, .tagline {display:none;}}
@media print {p{font-size:12px;} }