/*------------ General Page Rules ----------------------------------------------------------*/


body, html
{
margin: 0;
padding: 0;
width: 100%;
height: 100%;
}

body.iframe{ width:auto;height:auto;}

h1, h2, h3, h4, h5, p, ul, ol, li, form, hr
{
margin: 0;
padding: 0;
}

BODY, TABLE
{
font-family: 'Open Sans', sans-serif;
font-size:12px;
color:#3a3a3a;
}

/* ----------- Colours -------------------------*/

/*
font-family: 'Open Sans', sans-serif;
Light Grey: #cccccc
Dark Grey: #818285
Light Blue: #9bd1e5
Medium Blue: #65a8c1
Light Green: #c0cfa5
Medium Green: #7b8b38
Light Brown #d2c4a5
Medium Brown #D2C5A5
*/

/* ----------- General Page Rules -------------------------*/
#default img{
max-width:100%;
height:auto;
}

h1
{
margin: 15px 0px;
color: #cccccc;
font-size: 30px;
font-family: 'Open Sans', sans-serif;
}

h2
{
margin: 15px 0px;
color: #284b70;
font-size: 24px;
text-transform: none;
font-family: 'Open Sans', sans-serif;
font-weight:400;
}

h3
{
margin: 10px 0px;
color: #3a3a3a;
font-size: 18px;
font-family: 'Open Sans', sans-serif;
}

h4
{
margin: 8px 0px;
color: #7b8b38;
font-size: 14px;
text-transform: uppercase
font-family: 'Open Sans', sans-serif;
}

h5
{
margin: 8px 0px;
color: #65a8c1;
font-size: 14px;
text-transform: uppercase
font-family: 'Open Sans', sans-serif;
}

p,div#pageSource
{
line-height: 19px;
margin: 12px 0px;
}
div#pageSource{ text-align:left; }
ul
{
margin: 10px 0px;
padding: 0px 0px 0px 20px;
}

ol
{
margin: 10px 0px;
padding: 0px 0px 0px 20px;
}

li
{
margin: 3px 0px;
font-size:15px;
}

li p
{
margin: 0;
line-height: 19px;
}

hr
{
margin: 15px 0px;
border: none;
background: none;
border-bottom: 1px solid #f5f5f5;
}

a
{
color: #000;
}

a:hover
{
color: #818285;
}

td
{
vertical-align: top;
}

a img
{
border: none;
}


/* ----------- Site Wide Rules -------------------------*/

/*------------ Main Containers ---------------------------------------*/

.container
{
margin: 0px auto;
width: 100%;
text-align: left;
}

.bgContainer
{
width: 100%;
float: left;
position: relative;
height: auto;
}


/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 992px) {

.container
{
width: 1022px;
}

.bgContainer
{
width: 1022px;
}

}

body
{
/*background: 100% width tile here */
background: #F2F2F4 url(http://www.calarms.co.nz/images/style/kss_body_bg.png) top left repeat-x;
background-attachment:fixed;
}


/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 768px) {


}

/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 992px) {


}

/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 1200px) {



}

#wrap
{
position: relative;
z-index: 2;
min-height: 100%;
width: 100%;
/*background: 100% height tile here */
}

#main
{
overflow:hidden;
padding-bottom: 147px ; /* must be same height as the footer */
}

#header
{
float: left;
position: fixed;
z-index: 50;
width: 100%;
height: 151px;
background: url(http://www.calarms.co.nz/images/style/kss_header_bg.png) top left repeat-x;
z-index: 5000;
}

/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 544px) {

#header
{
width: 100%;
height: 151px;
}

}

/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 768px) {

#header
{
width: 100%;
height: 151px;
}

}

/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 992px) {

#header
{
width: 1022px;
height: 151px;
}

}

/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 1200px) {

#header
{
width: 1022px;
height: 151px;
}

}


#header.stuck
{
float: left;
position: fixed;
z-index: 5000;
width: 100%;
height: 157px;
background: url(http://www.calarms.co.nz/images/style/kss_header_bg.png) top left repeat-x;
}

/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 1200px) {

#header.stuck
{
width: 1022px;
height: 157px;
}

}


#content
{
float: left;
position: relative;
z-index: 40;
width: 100%;
min-height: 400px;
}


#centerCol
{
float: left;
position: relative;
width: 100%;
min-height: 400px;
}

#default #centerCol
{
float: left;
position: relative;
width: 100%;
min-height: 400px;
margin: 0px 0px 0px 0px;
}

#leftCol
{
float: left;
position: relative;
width: 214px;
border-right: 1px solid #ccc;
min-height: 400px;
margin: 25px 0px 0px 0px;
}

#rightCol
{
float: right;
position: relative;
width: auto;
min-height: 400px;
}

#footer
{
position: relative;
width: 100%;
clear: both;
margin: -147px 0px 0px 0px;
height: 147px;
background: #3A3A3A url(http://www.calarms.co.nz/images/style/kss_footer_bg.jpg) 0px 0px repeat-x;
border-bottom:5px solid #3A3A3A ;
overflow:hidden;
}

/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 544px) {



}

/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 768px) {



}

/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 992px) {



}

/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 1200px) {



}

#footer .container
{
margin: 0 auto;
width: 100%;
text-align: left;
}

#footer .bgContainer
{
float: left;
position: relative;
width: 100%;
height: 147px;
margin: 0px;
padding: 0px 0px 0px 0px;
background: none;
margin: 0px;
border-bottom:none;
}

/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 992px) {

#footer .container
{
width: 1022px;
}

#footer .bgContainer
{
width: 1022px;
}

}

/*------------ Module/Element Specific Rules ---------------------------------------*/


/******* Header Elements ***********/

#header a.logo
{
position:absolute;
left:20px;
top:55px;
margin: 0px 0px 0px 0px;
}

/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 544px) {

#header a.logo
{
position:absolute;
left:20px;
top:48px;
margin: 0px 0px 0px 0px;
}

}


/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 768px) {



}


/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 1042px) {

#header a.logo
{
top:48px;
left:0px;
margin: 0px 0px 0px 0px;
}

}

#header a.logo img
{

}

#topLeftNavigation
{
float: left;
position: relative;
margin: 6px 0px 0px 0px;
border:none;
color:#FFF;
font-size:13px;
width:auto;
font-weight:bold;
}




#topLeftNavigation a
{
color:#FFF;
font-family: 'Open Sans', sans-serif;
text-transform:uppercase;
text-decoration:none;
font-weight:600;
font-size:13px;
margin:0px 4px;
transition: all 0.5s ease-in;
}

#topLeftNavigation a:hover
{
color:#3a3a3a;
transition: all 0.5s ease-in;
}

#topRightNavigation
{
float: right;
position: relative;
margin: 0px 0px 0px 0px;
padding:0px 10px 0;
border:none;
background:#386a9d;
width:100%;
box-sizing:border-box;
font-family: 'Open Sans', sans-serif;

}


/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 544px) {

#topRightNavigation
{
margin: 5px 10px 0px 0px;
padding:0px 0px 0px 0px;
width:100%;
}

}


#topRightNavigation p
{
float: right;
position: relative;
margin: 0px 0px 0px 10px;
color:#FFF;
font-family: 'Open Sans', sans-serif;
text-transform:uppercase;
font-weight:bold;
font-size:16px;
line-height:22px;
}

#topRightNavigation p a
{
float: right;
position: relative;
margin: 0px 0px 0px 10px;
color:#FFF;
font-family: 'Open Sans', sans-serif;
text-transform:uppercase;
font-weight:bold;
font-size:16px;
line-height:22px;
text-decoration:none;
}

/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 544px) {



}


/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 768px) {



}


/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 992px) {



}

/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 1200px) {


}


#topRightNavigation p span
{
display:none;
}

/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 544px) {

#topRightNavigation p span
{
display:inline;
}

}




#topRightNavigation a:hover
{
color:#3a3a3a;
transition: all 0.5s ease-in;
}

a.newsletterLink
{
float: right;
position: relative;
margin: 23px 10px 0px 0px;
border:2px solid #616161;
padding:5px 10px;
text-transform:uppercase;
text-decoration:none;
font-weight:600;
color:#3a3a3a;
font-size:13px;
display:none;
}

/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 992px) {
a.newsletterLink
{
display:inline;
}

}

a.newsletterLink:hover
{
border:2px solid #3a3a3a;
color:#3a3a3a;
}

p.tagLine
{
float: right;
position: relative;
margin: 30px 0px 0px 630px;
font-size:24px;
font-style:italic;
color:#284b70;
display:none;
}


/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 768px) {


}


/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 992px) {
p.tagLine
{
display:inline;
margin: 30px 0px 0px 630px;
}

}

/* Header Navigation */


/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/

a#pull {
position: absolute;
top: 35px;
right: 10px;
width: 45px;
height: 45px;
background: #383838;
padding: 0;
display: block;
}

a#pull:after {
content:"";
background: url(http://www.contractmech.co.nz/images/style/nav-icon.png) center no-repeat;
background-size: 47% auto;
width: 45px;
height: 45px;
display: inline-block;
position: absolute;
right: 0px;
top: 0px;
}

#header #navigationMobile
{
float: left;
position: relative;
width:100%;
z-index:5000;
}

#header #navigationMobile ul
{
display:none;
}

#header #navigationMobile ul
{
background:#FFF;
margin-top:100px;
width:100%;
padding:0px 20px;
box-sizing:border-box;
text-align:right;
}

#header #navigationMobile ul li
{
list-style:none;
padding: 10px 0px 10px 3px;

margin: 0px 0px 0px 0px;
background:none;
border-bottom:1px solid #ccc;
}

#header #navigationMobile ul li:last-child
{
border:0px solid #ccc;
}


#header #navigationMobile ul li a
{
display: block;
padding: 0px 0px;
border-top:none;
margin: 0px;
list-style: none;
text-transform: uppercase;
letter-spacing: 0;
font-size: 20px;
color: #284b70;
text-decoration: none;
font-weight:bold;
transition: all 0.5s ease-in;
}

#header #navigation
{
display:none;
}

/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 992px) {

#header #navigationMobile
{
display:none;
}

#header #navigation
{
position: absolute;
top: 96px;
right: -10px;
width: auto;
height: 33px;
margin: 0px;
display:block;
}

}

#header #navigation ul
{
margin: 0 auto;
padding: 0px  0px 0px 5px;
list-style: none;
float: none;
position: relative;
}

#header #navigation ul li
{
float: left;
position: relative;
padding: 0px 0px 0px 3px;
height: 33px;
line-height: 33px;
margin: 0px 0px 0px 0px;
background:none;
}

#header #navigation ul li:first-child
{
background: none;
}

#header #navigation ul li a
{
display: block;
width: auto;
text-align: center;
height: 33px;
line-height: 33px;
padding: 0px 21px;
border-top:none;
margin: 0px;
list-style: none;
float: left;
text-transform: uppercase;
letter-spacing: 0;
font-size: 15px;
position: relative;
color: #284b70;
text-decoration: none;
font-weight:bold;
transition: all 0.5s ease-in;
}



#header #navigation ul li a:hover
{
color: #383838;
transition: all 0.5s ease-in;
}


#header #navigation ul li ul
{
display: none;
}

#header #navigation ul li:hover ul
{
display: block;
}

#header #navigation ul li ul
{
margin: 0px 0px 0px -2px;
padding: 0px 3px 0px 0px;
list-style: none;
float: none;
position: absolute;
top: 33px;
left: 3px;
width: 240px;
border-bottom: 4px solid #00b4e4;
}

#header #navigation ul li ul li
{
float: left;
position: relative;
padding: 0px 0px 0px 3px;
height: auto;
min-height: 20px;
width: 240px;
line-height: 19px;
margin: 0px 0px 0px 0px;
background: #9BD1E5;
}

#header #navigation ul li ul li:first-child
{
background: #9BD1E5;
}

#header #navigation ul li ul li a
{
display: block;
width: 210px;
text-align: left;
height: 33px;
line-height: 33px;
padding: 4px 10px 4px 17px;
border-top: none;
margin: 0px;
list-style: none;
float: left;
text-transform: uppercase;
letter-spacing: 0;
font-size: 12px;
position: relative;
color: #FFF;
text-decoration: none ;
}

#header #navigation ul li ul li ul
{
float: left;
position: relative;
margin: 0px 0px 0px -3px;
padding: 0;
top: auto;
left: auto;
border: none;
}

#header #navigation ul li ul li ul li
{
float: left;
position: relative;
padding: 0px 0px 0px 3px;
min-height: 33px;
width: 240px;
line-height: 19px;
margin: 0px 0px 0px 0px;
background: #daedf4;

}

#header #navigation ul li ul li ul li:first-child
{
background: #daedf4;
}

#header #navigation ul li ul li ul li a
{
display: block;
width: 210px;
text-align: left;
height: 33px;
line-height: 33px;
padding: 4px 10px 4px 17px;
border-top: none;
margin: 0px;
list-style: none;
float: left;
text-transform: uppercase;
letter-spacing: 0;
font-size: 12px;
position: relative;
color: #7093ae;
text-decoration: none ;
}

#header #navigation a.grandchildSelected,
#header #navigation a.childSelected,
#header #navigation a.menuSelected
{
color: #284b70;
}


/******* Home Slides ***********/

#homeSlides
{
float: left;
position: relative;
width: 100%;
height: 462px;
margin: -7px 0px 0px 0px;
z-index:1000;
}

#homeSlides a img
{
float: right;
}

#homeSlideNav
{
position: absolute;
top: 438px;
right: 22px;
z-index: 3000;
background: none;
}

#homeSlideNav a
{
margin: 0px 2px;
display: block;
float: left;
width: 8px;
height: 8px;
background: url(http://www.calarms.co.nz/images/style/progress_icon.png) 0px 0px no-repeat;
}

#homeSlideNav a.activeSlide
{
font-weight: bold;
color: #FFF;
background: url(http://www.calarms.co.nz/images/style/progress_icon.png) 0px -8px no-repeat;
}

#homeSlides .moduleComponentContainerhomeSlides
{
float: left;
position: relative;
width: 100%!important;
height: 462px!important;
}

.moduleComponentContainerhomeSlides h2.bannerTitle
{
display:none;
}

.moduleComponentContainerhomeSlides .bannerHtmlContent
{
position:absolute;
top:0px;
left:0px;
background: url(http://www.calarms.co.nz/images/style/kss_banner_text_bg.png) -5px -12px no-repeat;
color:#FFF;
max-width:100%;
width:437px;
height:463px;
box-sizing:border-box;
padding:60px 0px 0px 20px;
}

/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 544px) {

.moduleComponentContainerhomeSlides .bannerHtmlContent
{
top:0px;
left:0px;
max-width:100%;
width:437px;
height:463px;
padding:108px 0px 0px 24px;
box-sizing:border-box;
}

}


.moduleComponentContainerhomeSlides .bannerHtmlContent h2
{
text-transform:none;
color:#FFF;
font-size:36px;
font-weight:600;
margin:0px 0px 10px 0px;
padding:0px;
line-height:36px;
width:60%;
}

.moduleComponentContainerhomeSlides .bannerHtmlContent p
{
margin:0px 0px 0px 0px;
padding:0px;
font-size:18px;
font-weight:bold;
line-height:26px;
width:60%;
}

.moduleComponentContainerhomeSlides .bannerHtmlContent p br
{
display:none;
}


/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 544px) {

.moduleComponentContainerhomeSlides .bannerHtmlContent h2
{
font-size:46px;
margin:0px 0px 10px 0px;
line-height:46px;
width:100%;
}

.moduleComponentContainerhomeSlides .bannerHtmlContent p
{
font-size:21px;
line-height:26px;
width:80%;
}

}


/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 768px) {



}


/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 992px) {



}

/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 1200px) {


}

.moduleComponentContainerhomeSlides .bannerHtmlContent a
{
display:block;
width:238px;
text-transform:none;
color:#FFF;
text-decoration:none;
font-size:14px;
color:#284b70;
background:#FFF;
text-transform:uppercase;
text-align:center;
margin:0px 0px 10px 0px;
padding:7px 0px;
line-height:;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
position:absolute;
bottom:115px;
left:20pxpx;
transition: all 0.5s ease-in;
}

/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 544px) {

.moduleComponentContainerhomeSlides .bannerHtmlContent a
{
bottom:115px;
left:64px;
}

}


.moduleComponentContainerhomeSlides .bannerHtmlContent a:hover
{
color:#FFF;
background:#3a3a3a;
transition: all 0.5s ease-in;
}


.moduleComponentContainerhomeSlides .moduleComponent16 .bannerHtmlContent a.greyButton
{
position:absolute;
bottom:115px;
left:64px;
color:#FFF;
background:#3a3a3a;
}

.moduleComponentContainerhomeSlides .moduleComponent16 .bannerHtmlContent a.greyButton:hover
{
color:#284b70;
background:#FFF;

}


.moduleComponentContainerhomeSlides .moduleComponent16 .bannerHtmlContent a
{
position:absolute;
bottom:65px;
left:64px;
}

.moduleComponentContainerhomeSlides a.bannerLinkMask
{
display:none;
}


#bottomHeaderLinkContainer
{
position:absolute;
top:-7px;
right:0px;
width:365px;
height:30px;
z-index:1000;
border:none;
display:none;
}

/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 544px) {

#bottomHeaderLinkContainer
{
display:block;
}

}

/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 768px) {



}

/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 992px) {



}

/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 1200px) {



}

#bottomHeaderLinkContainer a
{
display:inline-block;
background:#383838;
color:#FFF;
text-decoration:none;
text-transform:uppercase;
font-weight:bold;
padding:7px 15px 7px 32px;
-webkit-border-radius: 0px 0px 4px 4px;
-moz-border-radius: 0px 0px 4px 4px;
border-radius: 0px 0px 4px 4px;
background: #383838 url(http://www.calarms.co.nz/images/style/whiteDownArrow.png) 12px 12px no-repeat;
}


#bottomHeaderLinkContainer a:hover
{
background:#FFF!important;
color:#383838!important;
background: #FFF url(http://www.calarms.co.nz/images/style/blackDownArrow.png) 12px 14px no-repeat!important;
transition: all 0.5s ease-in;
}

a.bottomHeaderLinkOne
{
float:right;
margin-right:10px;

}

a.bottomHeaderLinkTwo
{
}

a.bottomHeaderLinkTwo:hover
{

}

#homeBottomCallouts
{
float: left;
position: relative;
margin: 0px 0px 50px 0px;
width:100%;
background:#FFF;
padding:20px;
box-sizing:border-box;
}

#homeBottomCallouts .moduleComponent
{
float: left;
position: relative;
margin: 0px 0px 0px 0px;
width:100%;
}

#homeBottomCallouts .moduleComponent p
{
font-size:14px;
}


/******* Home Callouts Container ***********/

#homeCallouts
{
float: left;
position: relative;
margin: 20px 0px 20px 0px;
width:100%;
}

#default #homeCallouts
{
margin: 20px 0px 100px 0px;
}

#homeCallouts .moduleComponentContainercallouts
{
float: left;
position: relative;
margin: 0px 0px 0px 0px;
width:100%;
}

#homeCallouts .moduleComponentContainercallouts .moduleComponent
{
float: left;
position: relative;
margin: 0px 30px 30px 0px;
padding:20px 30px;
width:100%;
background:#FFF;
-webkit-border-radius: 0px 0px 4px 4px;
-moz-border-radius: 0px 0px 4px 4px;
border-radius: 0px 0px 4px 4px;
box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
box-sizing:border-box;
}


/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 544px) {

#homeCallouts .moduleComponentContainercallouts .moduleComponent
{
margin: 0px 0% 30px 0px;
padding:20px 30px;
width:100%;
}

}

/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 768px) {

#homeCallouts .moduleComponentContainercallouts .moduleComponent
{
margin: 0px 1% 0px 0px;
padding:20px 30px;
width:32.66%;
}


}

/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 992px) {

#homeCallouts .moduleComponentContainercallouts .moduleComponent
{
margin: 0px 1% 0px 0px;
padding:20px 30px;
width:32.66%;
}

}

/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 1200px) {

#homeCallouts .moduleComponentContainercallouts .moduleComponent
{
margin: 0px 2.5% 0px 0px;
padding:20px 30px;
width:31.66%;
}

}

#homeCallouts .moduleComponentContainercallouts .moduleComponent:nth-of-type(3)
{
margin: 0px 0px 0px 0px;
}

#homeCallouts .moduleComponentContainercallouts .moduleComponent23
{
margin: 0px 0px 0px 0px;
}

#homeCallouts .moduleComponentContainercallouts .moduleComponent .bannerTitle
{
display:none;
}

#homeCallouts .moduleComponentContainercallouts .moduleComponent h2
{
color:#284b70;
font-size:20px;
margin: 0px 0px 8px 0px;
background:#FFF;
line-height:22px;
font-weight:600;
text-transform:uppercase;
}

#homeCallouts .moduleComponentContainercallouts .moduleComponent p
{
color:#3a3a3a;
font-size:18px;
margin: 0px 0px 0px 0px;
line-height:22px;
font-style:italic;
}

#homeCallouts .moduleComponentContainercallouts .moduleComponent a.bannerLinkMask
{
float:right;
display:block;
color:#FFF;
font-size:13px;
margin: 15px -15px -5px 0px!important;
text-decoration:none;
background:#284b70;
padding:3px 30px 3px 10px;
font-style:italic;
font-weight:bold;
background: #284b70 url(http://www.calarms.co.nz/images/style/kss_findoutmoreArrow.png) 110px 6px no-repeat!important;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
transition: all 0.5s ease-in;
}


#homeCallouts .moduleComponentContainercallouts .moduleComponent a.bannerLinkMask:hover
{
transition: all 0.5s ease-in;
background: #284b70 url(http://www.calarms.co.nz/images/style/kss_findoutmoreArrow.png) 115px 6px no-repeat!important;
}

#logosContainer
{
float: left;
position: relative;
width:100%;
margin:0px 0px 30px 0px;
text-align:center;
}

#logosContainer span
{
float: left;
position: relative;
width:100%;
background:#FFF;
text-align:center;
}

#logosContainer p
{
display:inline-block;
background:#bababb;
font-size:14px;
text-transform:uppercase;
color:#FFF;
font-weight:bold;
padding:6px 20px;
margin:0px 0px 0px 0;
-webkit-border-radius: 4px 4px 0px 0px;
-moz-border-radius: 4px 4px 0px 0px;
border-radius: 4px 4px 0px 0px;
text-align:center;
width:260px;
}

#logosContainer a.logos
{
display:inline-block;
margin:10px 26px 8px 0px;
}

#logosContainer .logos#logoSix
{
margin:0px 0px 0px 0px;
}

#logosContainer a.logos:hover
{
display:inline-block;
margin:10px 26px 8px 0px;
opacity: 0.5;
}



/*------- Tabber Styles -----------------------------*/

#tabContainer
{
overflow: hidden;
}

.tabsContent
{
float: left;

position: relative;
width: 920px;
min-height: 100px;
margin: 10px 0px 0px 0px;
padding: 15px;
border: none;
}

.ui-tabs { position: relative; padding: 0em; zoom: 1; } /* position: relative prevents IE scroll bug (element with position: relative inside container with overflow: auto appear as "fixed") */
.ui-tabs .ui-tabs-nav { margin: 0; padding: 0; }
.ui-tabs .ui-tabs-nav li { list-style: none; float: left; position: relative; top: 0px; margin: 0; border-bottom: 0 !important; padding: 0; white-space: nowrap; }
.ui-tabs .ui-tabs-nav li a { float: left; padding: 0; text-decoration: none; }
.ui-tabs .ui-tabs-nav li.ui-tabs-selected { margin-bottom: 0; padding-bottom: 0px; font-weight: normal;}
.ui-tabs .ui-tabs-nav li.ui-tabs-selected a, .ui-tabs .ui-tabs-nav li.ui-state-disabled a, .ui-tabs .ui-tabs-nav li.ui-state-processing a { cursor: pointer; font-weight: normal;}
.ui-tabs .ui-tabs-nav li a, .ui-tabs.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-selected a { cursor: pointer; } /* first selector in group seems obsolete, but required to overcome bug in Opera applying cursor: text overall if defined elsewhere... */
.ui-tabs .ui-tabs-panel { display: block; border-width: 0; padding: 0; background: none; }
.ui-tabs .ui-tabs-hide { display: none !important; }

#tabs
{
float: left;
position: relative;
border-top: none;
width: 252px;
}


#tabs ul.ui-tabs-nav
{
margin: 0;
padding: 0;
float: left;
position: relative;
width: 100%;
list-style: none;
}

#tabs ul.ui-tabs-nav li
{
margin: 0;
padding: 0;
float: left;
position: relative;
display: inline-block;
height: 32px;
line-height: 32px;
background: #9bd1e5;
}

#tabs ul.ui-tabs-nav li:first-child
{
background: #9bd1e5;
}

#tabs ul.ui-tabs-nav li a
{
display: block;
height: 32px;
width: 84px;
text-align: center;
margin: 0px 0px 0px 0px;
padding: 0px 0px;
line-height: 32px;
text-decoration: none;
color: #FFF;
text-transform: uppercase;
}

#tabs ul.ui-tabs-nav li.ui-tabs-selected a,
#tabs ul.ui-tabs-nav li a:hover
{
color: #FFF;
background: #6fb3cc;
}

/******* Page Editor Container ***********/

#fullWidthHeading
{
float: left;
position: relative;
width:100%;
height:60px;
margin:-7px 0px 0px 0px;
background:#284b70;
}

#fullWidthHeading h1
{
color:#FFF;
margin:10px 0px 0px 45px;
font-weight:600;
font-size:28px;
}

#pageEditorContent
{
float: left;
position: relative;
width: 100%;
padding: 12px;
margin: 0px 0px 0px 0px;
border:none;
box-sizing:border-box;
}


#home #pageEditorContent,
#default #pageEditorContent
{
float: left;
position: relative;
width: 100%;
padding: 20px 15px;
margin: 0px 0px 0px 0px;
background:#FFF;
box-sizing:border-box;
}


#services #pageEditorContent
{
float: left;
position: relative;
width: 100%;
padding: 20px 15px;
margin: 0px 0px 0px 0px;
background:#FFF;
box-sizing:border-box;
}

#services #pageEditorContent img,
#home #pageEditorContent img,
#default #pageEditorContent img
{
height:auto!important;
max-width: 100%;
}

/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 544px) {


#services #pageEditorContent,
#home #pageEditorContent,
#default #pageEditorContent
{
width: 100%;
padding: 20px 45px;
}

}


/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 768px) {

#services #pageEditorContent,
#home #pageEditorContent,
#default #pageEditorContent
{
width: 100%;
padding: 20px 45px;
}

}


/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 992px) {

#services #pageEditorContent,
#home #pageEditorContent,
#default #pageEditorContent
{
width: 100%;
padding: 20px 45px;
}

}

/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 1200px) {

#services #pageEditorContent,
#home #pageEditorContent,
#default #pageEditorContent
{
width: 100%;
padding: 20px 45px;
}

}

#home #pageEditorContent p,
#services #pageEditorContent p,
#default #pageEditorContent p
{
font-size:16px;
line-height:22px;
}






/******* Footer Elements ***********/



/* Footer Menu  */

#topPanel
{
float: left;
position: relative;
width:100%;
background:#386a9d;
padding-bottom:10px;
}

#topPanel #topleft
{
float: left;
position: relative;
margin:8px 0px 0px 10px;
}

/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 544px) {

#topPanel #topleft
{
margin:9px 0px 0px 10px;
}

}

/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 768px) {

#topPanel #topleft
{
margin:6px 0px 0px 10px;
}

#topPanel #topleft a
{
display:inline;
}

}

#topPanel #topright
{
float: right;
position: relative;
margin:9px 0px 0px 0px;
display:none;
}

/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 544px) {

#topPanel #topright
{
margin:9px 20px 0px 0px;
display:inline;
}

}

#topPanel #topright p
{
float: left;
position: relative;
margin: 0px 0px 0px 0px;
color:#FFF;
font-family: 'Open Sans', sans-serif;
text-transform:uppercase;
font-weight:bold;
font-size:16px;
line-height:22px;
}


#topPanel #topright img
{
float: right;
position: relative;
margin: -5px 0px 0px 10px;

}

#topPanel #topleft p
{
float: left;
position: relative;
margin: 0px 10px 0px 0px;
color:#FFF;
font-family: 'Open Sans', sans-serif;
text-transform:uppercase;
font-weight:bold;
font-size:16px;
line-height:22px;
}




#topPanel #topleft p a
{
padding:0px 0px 0px 20px;
margin:0px 0px 0px 10px;
color:#FFF;
text-transform:lowercase;
text-decoration:none;
transition: all 0.5s ease-in;
}

#topPanel #topleft a:hover
{
color:#3a3a3a;
transition: all 0.5s ease-in;
}

#footerMenuOne
{
float: left;
position: relative;
width:100%;
margin:0px 0px 0px 10px;
}

/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 768px) {

#footerMenuOne
{
float: left;
position: relative;
width:48%;
margin:0px 0px 0px 10px;
}

}

/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 992px) {

#footerMenuOne
{
margin:0px 0px 0px 0px;
}

}


#footerMenuOne p
{
display:block;
margin:5px 0px 0px 0px;
color:#FFF;
font-size:16px;
}

#footerMenuOne a
{
display:block;
margin:20px 0px 0px 0px;
color:#FFF;
text-decoration:none;
font-size:16px;
}



#footerMenuTwo
{
float: left;
position: relative;
width:100%;
margin:30px 0px 0px 0px;
}


/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 768px) {

#footerMenuTwo
{
float: right;
width:48%;
margin:30px 0px 0px 0px;
}

}

/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 992px) {

#footerMenuTwo
{
float: right;
width:48%;
margin:30px 0px 0px 0px;
}

}

/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 1200px) {

#footerMenuTwo
{
float: right;
width:48%;
margin:30px 0px 0px 0px;
}

}

#footerMenuTwo a.newsletterLink
{
color:#FFF;
border:none;
margin:0px 0px 0px 0px;
padding:0px;
width:auto;
font-size:15px;
display:block;
}


/* Site Search*/

#footer .siteSearchContainer
{
float: right;
position: relative;
top:20px;
right:0px;
}

#footer .searchLabel
{
display: none;
}

#footer .siteSearchInput
{
width: 212px;
height: 11px;
font-size: 11px;
padding: 7px 25px 6px 5px;
border: 1px solid #FFF;
color: #9c9c9c;
text-align: left;
background: #FFF;

}

#footer .siteSearchSubmit
{
position: absolute;
top: 3px;
right: 5px;
}


.siteSearchContainer input.siteSearchSubmit
{
position: absolute;
top: 0;
right: 0;
bottom: 0;
width: 30px;
background: url(http://www.calarms.co.nz/images/style/submit_button.png) center no-repeat;
cursor:pointer;
border:none;
transition: all 0.5s ease-in;
}


#footer .siteSearchSubmit:hover
{
right: 1px;
transition: all 0.5s ease-in;
}




/* Newsletter Signup */


#newsletterSignup h2
{
margin: 15px 0px 8px;
color: #FFF;
font-size: 18px;
text-transform: uppercase;
font-weight: normal;
text-align: right;
}

#subscribeComponent
{

}

#subscribeComponent table#formTable
{
margin: 12px 0px 0px 0px;
color: #3684a0;
}

#subscribeComponent table#formTable .labelHorizontal
{

}

#subscribeComponent table#formTable .labelHorizontal span
{
float: left;
color: #3684a0;
}

#subscribeComponent table#formTable span.required
{

}

#subscribeComponent table#formTable .valueVertical
{

}

#subscribeComponent table#formTable .valueVertical input.fstxt
{
float: right;
width: 200px;
background: #ddf1f9;
border: 1px solid #72d0e9;
font-size: 11px;
color: #3684a0;
padding: 3px;
margin: 2px 0px 2px 15px;
}

#subscribeComponent input.fsubNewsletter
{
position: absolute;
bottom: 4px;
right: 0;
border: none;
background: none;
color: #1c677b;
font-size: 11px;
cursor: pointer;
}

/* Copyright */

#copyright
{
float: left;
position: relative;
width: 100%;
text-align: left;
color: #1c677b;
margin: 40px 0px 0px 0px;
box-sizing:border-box;
padding:0px 15px;
}

#copyright p
{
font-size:10px;
color:#757575;
}

#copyright p a
{
text-decoration:none;
color:#757575;
}

/* ----- Blog Styling ----------------------------*/



#pageEditorContent #navBar
{
float: left;
position: relative;
width: 100%;
padding:20px 25px;
background:#fbfbfb;
margin:23px 0px 0px 0px;
box-sizing:border-box;
}


/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 544px) {

#pageEditorContent #navBar
{
float: left;
width: 100%;
padding:20px 25px;
margin:23px 0px 0px 0px;
}

}

/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 768px) {

#pageEditorContent #navBar
{
float: right;
width: 25%;
padding:20px 25px;
margin:23px -45px 0px 0px;
}

}


#pageEditorContent .navRecentLinks span.navheaders
{
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
display: block;
text-transform: none;
font-size: 16px;
border-bottom:none;
color: #284b70;
}

#pageEditorContent .navRecentLinks ul
{
margin: 0;
padding: 17px 17px 0px 20px;
margin: 0px 0px 21px 0px;

}

#pageEditorContent .navRecentLinks ul li
{
color: #000000;
font-size: 14px;
text-decoration:none;
}

#pageEditorContent .navRecentLinks ul li a
{
color: #000000;
font-size: 14px;
text-decoration:none;
}

#pageEditorContent .navRecentLinks ul li a:hover
{
color: #284b70;
}

#pageEditorContent .navCategoryBlogLinks span.navheaders
{
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
display: block;
text-transform: none;
font-size: 16px;
border-bottom:none;
color: #284b70;
}

#pageEditorContent .navCategoryBlogLinks ul
{
margin: 0;
padding: 17px 17px 0px 20px;
margin: 0px 0px 21px 0px;

}

#pageEditorContent .navCategoryBlogLinks ul li
{
color: #000000;
font-size: 14px;
}

#pageEditorContent .navCategoryBlogLinks ul li a
{
color: #000000;
font-size: 14px;
text-decoration:none;
}

#pageEditorContent .navCategoryBlogLinks ul li a:hover
{
color: #D51839;
}

#pageEditorContent .navDateLinks span.navheaders
{
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
display: block;
text-transform: none;
font-size: 16px;
border-bottom:none;
color: #284b70;
}


#pageEditorContent .navDateLinks ul
{
margin: 0;
padding: 17px 17px 0px 20px;
margin: 0px 0px 21px 0px;

}

#pageEditorContent .navDateLinks ul li
{
color: #000000;
font-size: 14px;
}

#pageEditorContent .navDateLinks ul li a
{
color: #000000;
font-size: 14px;
text-decoration:none;
}

#pageEditorContent .navDateLinks ul li a:hover
{
color: #D51839;
}

#pageEditorContent #navBasicLinks
{
display: none;
float: left;
position: relative;
width: 100%;
}

#pageEditorContent .moduleItemsListingCaseStudiesAndNews
{
float: left;
position: relative;
width: 100%;
padding: 0px 21px 0px 0px;
}

/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 544px) {

#pageEditorContent .moduleItemsListingCaseStudiesAndNews
{
float: left;
position: relative;
width: 100%;
padding: 0px 0px 0px 0px;
}


}

/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 768px) {

#pageEditorContent .moduleItemsListingCaseStudiesAndNews
{
float: left;
position: relative;
width: 70%;
padding: 0px 21px 0px 0px;
}


}

#pageEditorContent .moduleItemsListingCaseStudiesAndNews .moduleItemsListingItem
{
border-bottom: 1px solid #f5f5f5;
margin: 0px 0px 25px 0px;
padding: 20px 20px 20px 0px;
}

#pageEditorContent .moduleItemsListingCaseStudiesAndNews .moduleItemsListingItem .moduleItemImage
{
float: left;
position: relative;
margin-right:25px;
}

#pageEditorContent .moduleItemsListingCaseStudiesAndNews .moduleItemsListingItem .moduleItemContent
{
line-height: 22px;
font-size:15px;
}

#pageEditorContent .moduleItemsListingCaseStudiesAndNews .moduleItemsListingItem .title
{
font-weight: bold;
font-size: 15px;
color: #3a3a3a;
text-transform: uppercase;
}

#pageEditorContent .moduleItemsListingCaseStudiesAndNews .moduleItemsListingItem .date
{
font-weight: bold;
font-size: 11px;
color: #ccc;
text-transform: uppercase;
margin: 0px 0px 5px 0px;
}

#pageEditorContent .moduleItemsListingCaseStudiesAndNews .moduleItemsListingItem .readMore a
{
font-weight: bold;
font-size: 13px;
color: #284b70;
text-transform: uppercase;
margin: 0px 0px 5px 0px;
text-decoration:none;
transition: all 0.5s ease-in;
}

#pageEditorContent .moduleItemsListingCaseStudiesAndNews .moduleItemsListingItem .readMore a:hover
{
color: #3a3a3a;
transition: all 0.5s ease-in;
}

#pageEditorContent .moduleItemCaseStudiesAndNews
{
float: left;
position: relative;
width: 100%;
margin-top:20px;
}

/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 768px) {

#pageEditorContent .moduleItemCaseStudiesAndNews
{
float: left;
position: relative;
width: 70%;
margin-top:20px;
}

}


#pageEditorContent .moduleItemCaseStudiesAndNews .moduleItemImage
{
float: right;
position: relative;
margin: 0px 0px 10px 10px;
}


#pageEditorContent .moduleItemCaseStudiesAndNews #moduleItemContent
{
float: left;
position: relative;
width: 700px;
}

#pageEditorContent .moduleItemCaseStudiesAndNews .title
{
font-weight: bold;
font-size: 18px;
color: #3a3a3a;
text-transform: uppercase;
}

#pageEditorContent .moduleItemsListingBlog .moduleItemsListingItem .date
{

}



/* Form Element (Email, newsletter, competition, survey) Styling ------------------------*/


#emailForm,
#subscribeForm,
#surveyTable,
#alertForm,
#registrationForm
{
float: left;
width: 97%;
background: #FFF;
border: 1px solid #FFF;
padding: 10px;
margin: 0px 0px 30px 0px;
}

#emailForm{
width: 100%;
box-sizing:border-box;
}



#emailForm td.labelHorizontal,
#subscribeForm td.labelHorizontal,
#surveyTable td.labelHorizontal,
#alertForm td.labelHorizontal,
#registrationForm  td.labelHorizontal
{
width: 100%;
vertical-align: top;
color: #3a3a3a;
padding: 0 5% 0 0 ;
font-size: 14px;
display:block;
}

#emailForm td.valueHorizontal,
#subscribeForm td.valueHorizontal,
#surveyTable td.valueHorizontal,
#alertForm td.valueHorizontal,
#registrationForm  td.valueHorizontal
{
width: 100%;
display:block;
vertical-align: top;
text-align: left;
}

/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 544px) {

#emailForm{
width: 55%;
}



}


/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 768px) {



}


#emailForm td.valueHorizontal .fgroup,
#subscribeForm td.valueHorizontal .fgroup,
#surveyTable td.valueHorizontal .fgroup,
#alertForm td.valueHorizontal  .fgroup,
#registrationForm  td.valueHorizontal  .fgroup
{
font-size: 14px;
}

span.fieldNumber
{
font-weight: bold;
margin: 0px 10px 0px 0px;
color:  #65a8c1;
}

span.required
{
font-weight: bold;
color:  #284b70;
}

table.ftable td{ vertical-align:top; padding:4px;}
table.ftable td.flabel{ text-align:right;padding-right:10px; }
table.ftable td.fvalue{ text-align:left; }
table.ftable td.fcolumn{ text-align:center; }

input.ftxt,
input.fmtxt,
input.fstxt,
input.fdate,
textarea.fmtxt
{
font-family:arial,helvetica,sans-serif;
background: #FFF;
border: 1px solid #ccc;
font-size: 14px;
width:100%;
padding: 4px;
background:#fbfbfb;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
}

input.ftxt:hover, input.ftxt:focus,
input.fmtxt:hover, input.fmtxt:focus,
input.fstxt:hover, input.fstxt:focus,
input.fdate:hover, input.fdate:focus,
textarea.fmtxt:hover, textarea.fmtxt:focus
{
border: 1px solid #3a3a3a;
background:#FFF;
}

input.fdate{width:150px; }
input.fstxt{width:50px; }

select.fsel,select.fseldate
{
background: #fff;
border: 1px solid #ccc;
font-size: 14px;
padding: 4px;
width:300px;
margin: 0px 3px 0px 0px;
}
select.fseldate{ width:auto; }

select.fseldate:hover,
select.fseldate:focus,
select.fseldate:hover,
select.fseldate:focus
{
border: 1px solid #65a8c1;
}

.buttonBar, .buttonPanel {text-align: right;padding: 15px 0px 0px 0px;}

.buttonBar input, input.fsub
{
background: #efefef;
border: 1px solid #ccc;
font-size: 14px;
padding: 4px;
width: 100px;
cursor: pointer;
background:#fbfbfb;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
}


.buttonBar input:hover,
input.fsub:hover
{
background: #3a3a3a;
color: #FFF;
border: 1px solid #3a3a3a;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
}

.msg
{
color: #FF0000;

margin: 10px 0px;
font-style: italic;
}

.finlinehelp
{
display: none;
}

#emailForm .reset,
#subscribeForm .reset,
#surveyTable .reset,
#alertForm .reset,
#registrationForm .reset
{
display: none;
}

/* Site Search ----------------------------------*/

.siteSearch span
{
font-size: 14px;
font-weight: bold;
}

.siteSearch input.fsub
{
border: 1px solid #ccc;
font-size: 11px;
margin: 0px 3px 10px;
padding: 2px 6px;
cursor: pointer;
}


.siteSearch input.textInput
{
font-size: 11px;
border: 1px solid #ccc;
padding: 3px 6px;
}

#searchResultDescription
{
margin: 0px 0px 10px;

}


#searchResultItems .searchResultItem
{
margin: 10px 0px 0px 0px;
}

#searchResultItems .title
{
font-weight: bold;
margin: 0px 0px 0px 10px;
}

#searchResultItems .description
{
margin: 8px 0px 0px 25px;
}

/* Social Media Icons */


#facebook
{
float: left;
position: relative;
margin-right:10px;
margin-top:30px;
}

#twitter
{
float: left;
position: relative;
margin-top:30px;
}

.pinterest
{
float: left;
position: relative;
margin-right:10px;
margin-top:30px;
}

#plusone
{
float: left;
position: relative;
margin-right:10px;
margin-top:30px;
margin-bottom:30px;
}


#socialMediaIcons
{
position: absolute;
top: -25px;
left: -2px;
}

a.twitterIcon
{
display: block;
float: left;
position: relative;
width: 20px;
height: 20px;
margin: 0px 2px;
background: url(http://www.calarms.co.nz/images/icons/icon_pinterest.png) top left no-repeat;
}

a.facebookIcon
{
display: block;
float: left;
position: relative;
width: 20px;
height: 20px;
margin: 0px 2px;
background: url(http://www.calarms.co.nz/images/icons/icon_facebook.png) top left no-repeat;
}

a.pintrestIcon
{
display: block;
float: left;
position: relative;
width: 20px;
height: 20px;
margin: 0px 2px;
background: url(http://www.calarms.co.nz/images/icons/icon_twitter.png) top left no-repeat;
}

#socialMediaIcons a:hover
{
background-position: 0 100%;

}

/*****************Services*************************/

#servicesContainer
{
float: left;
position: relative;
width:100%;
}

#servicesContainer a.leadInImageLink
{
float: left;
position: relative;
display:block;
width:100%;
height:143px;
}



#servicesContainer h3
{
float: left;
position: relative;
height:auto;
margin-top:0px;
width:100%;
background:#FFF;
padding:20px 0px 5px;
}


#servicesContainer h3 a
{
display:block;
color:#3a3a3a;
font-size:20px;
text-decoration:none;
text-transform:uppercase;
transition: all 0.5s ease-in;
}

#servicesContainer h3 a:hover
{
color:#284b70;
transition: all 0.5s ease-in;
}

.security-for-remote-properties #servicesContainer #forBusiness h3,
.security-for-remote-properties #servicesContainer #forHome h3,
.security-for-your-business #servicesContainer #forHome h3,
.security-for-your-business #servicesContainer #forRemote h3,
.security-for-the-home #servicesContainer #forBusiness h3,
.security-for-the-home #servicesContainer #forRemote h3
{
padding:20px 0px 20px;
background: #eaeaeb url(http://www.calarms.co.nz/images/style/bottomShadow.jpg) 0px 53px repeat-x;
}


.security-for-the-home #servicesContainer #forHome h3 a,
.security-for-your-business #servicesContainer #forBusiness h3 a,
.security-for-remote-properties #servicesContainer #forRemote h3 a
{
color:#284b70;
}

#services #pageEditorContentMain
{
float: left;
position: relative;
width: 100%;
padding: 20px 0px;
margin: 0px 0px 30px 0px;
background:#FFF;
min-height:400px;
}

#services #pageEditorContentMain table
{
padding: 0px 0px 0px 85px;
margin: 0px 0px 0px 0px;
border:none;
}

.security-for-your-business #forHome,
.security-for-your-business #forBusiness,
.security-for-your-business #forRemote,
.security-for-remote-properties #forHome,
.security-for-remote-properties #forBusiness,
.security-for-remote-properties #forRemote,
.security-for-the-home #forHome,
.security-for-the-home #forBusiness,
.security-for-the-home #forRemote
{
height:207px;
overflow:hidden;
}

#services #pageEditorContentMain table td
{
display:inline-block;
}

#services #pageEditorContentMain table td:nth-of-type(1)
{
width:7%;
}

#services #pageEditorContentMain table td:nth-of-type(2)
{
width:90%;
}

#services #pageEditorContentMain table td:nth-of-type(3)
{
width:100%!important;
box-sizing:border-box;
margin:0px;
}


/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 768px) {

#services #pageEditorContentMain table td
{
display:inline-block;
}

#services #pageEditorContentMain table td:nth-of-type(1)
{
width:7%;
}

#services #pageEditorContentMain table td:nth-of-type(2)
{
width:60%;
}

#services #pageEditorContentMain table td:nth-of-type(3)
{
width:30%!important;
}

}

#default #pageEditorContent table#productInfo
{
padding: 0px 0px 0px 0px;
margin: 10px 0px 0px 0px;
border:none;
}

#default #pageEditorContent table#productInfo td
{
display:block;
}


#default #pageEditorContent table#productInfo td:nth-of-type(1)
{
width:100%!important;
}

#default #pageEditorContent table#productInfo td:nth-of-type(2)
{
width:100%!important;
}

/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 544px) {


#default #pageEditorContent table#productInfo td:nth-of-type(1)
{
width:100%!important;
}

#default #pageEditorContent table#productInfo td:nth-of-type(2)
{
width:100%!important;
}

}

/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 768px) {

#default #pageEditorContent table#productInfo td
{
display:inline-block;
}


#default #pageEditorContent table#productInfo td:nth-of-type(1)
{
width:69%!important;
}

#default #pageEditorContent table#productInfo td:nth-of-type(2)
{
width:30%!important;
}

}

/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 992px) {



}

/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 1200px) {



}


#services #pageEditorContentMain table img
{
padding: 0px 0px 0px 0px;
margin: 20px 40px 0px 0px;
}

#services #pageEditorContentMain table h2
{
font-weight:600;
}

#default #pageEditorContent table#productInfo h3,
#services #pageEditorContentMain table h3
{
color:#284b70;
font-size:16px;
font-weight:400;
margin-left:8px;
margin-top:18px;
}

#services #pageEditorContentMain table #servicesRightCol
{
float: left;
position: relative;
background:#fbfbfb;
margin:26px 0px 0px 40px!important;
padding:10px 20px 20px 20px;
min-height:200px;
width:71.4%;
}





#default #pageEditorContent table#productInfo #servicesRightCol
{
float: left;
position: relative;
background:#fbfbfb;
margin:15px 0px 0px 65px!important;
padding:10px 30px 20px 30px;
min-height:200px;
width:71.4%;
}

#default #pageEditorContent table#productInfo p,
#services #pageEditorContentMain table p
{
font-size:14px;
color:#000000;
}

#default #pageEditorContent table#productInfo ul,
#services #pageEditorContentMain table ul
{
font-size:14px;
color:#284b70;
}

#default #pageEditorContent table#productInfo li,
#services #pageEditorContentMain table li
{
font-size:14px;
color:#000000;
}



#servicesContainer p
{
font-size:16px;
font-style:italic;
padding:0px 0px;
color:#3a3a3a;
}

#servicesContainer p#link
{
border-top:1px solid #e9eaf4;
margin-top:20px;
padding:18px 0px 5px;
background: url(http://www.calarms.co.nz/images/style/serviceDownArrow.jpg) top center no-repeat;
}

#servicesContainer p#link a
{
color:#284b70;
font-size:13px;
font-style:normal;
text-decoration:none;
text-transform:uppercase;
line-height:16px;
font-weight:600;
transition: all 0.5s ease-in;
}

#servicesContainer p#link a:hover
{
color:#3a3a3a;
transition: all 0.5s ease-in;
}



#servicesContainer #forHome
{
float: left;
position: relative;
width:32.7%;
margin-right:10px;
text-align:center;
background:#FFF;
}

#servicesContainer #forBusiness
{
float: left;
position: relative;
width:32.7%;
margin-right:9px;
text-align:center;
background:#FFF;
}

#servicesContainer #forRemote
{
float: left;
position: relative;
width:32.7%;
margin-right:0px;
text-align:center;
background:#FFF;
}

#servicesContainer #forRemote,
#servicesContainer #forBusiness,
#servicesContainer #forHome
{
float: left;
position: relative;
margin: 0px 30px 30px 0px;
width:100%;
background:#FFF;
box-sizing:border-box;
 padding:0px 5%;
}

#servicesContainer #forRemote
{
margin-right:0px;
}


/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 544px) {

#servicesContainer #forRemote,
#servicesContainer #forBusiness,
#servicesContainer #forHome
{
margin: 0px 0% 30px 0px;
width:100%;
 padding:0px 25%;
}

}

/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 768px) {

#servicesContainer #forRemote,
#servicesContainer #forBusiness,
#servicesContainer #forHome
{
margin: 0px 2.5% 0px 0px;
width:31.66%;
 padding:0px 0%;
}

#servicesContainer #forRemote
{
margin: 0px 0 0px 0px;
}
}

/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 992px) {

#servicesContainer #forRemote,
#servicesContainer #forBusiness,
#servicesContainer #forHome
{
margin: 0px 2.5% 0px 0px;
width:31.66%;
}

#servicesContainer #forRemote
{
margin: 0px 0 0px 0px;
}

}


.security-for-remote-properties #servicesContainer #forHome a.leadInImageLink:hover,
.security-for-your-business #servicesContainer #forHome a.leadInImageLink:hover,
.security-for-the-home #servicesContainer #forHome a.leadInImageLink,
.services #servicesContainer #forHome a.leadInImageLink
{
background: url(http://www.calarms.co.nz/images/style/forHome.jpg) top left no-repeat;
}

.security-for-remote-properties #servicesContainer #forHome a.leadInImageLink,
.security-for-your-business #servicesContainer #forHome a.leadInImageLink,
.services #servicesContainer #forHome a.leadInImageLink:hover
{
background: url(http://www.calarms.co.nz/images/style/forHome.jpg) 0px -143px no-repeat;
}



.security-for-remote-properties #servicesContainer #forBusiness a.leadInImageLink:hover,
.security-for-the-home #servicesContainer #forBusiness a.leadInImageLink:hover,
.security-for-your-business #servicesContainer #forBusiness a.leadInImageLink,
.services #servicesContainer #forBusiness a.leadInImageLink
{
background: url(http://www.calarms.co.nz/images/style/forBusiness.jpg) top left no-repeat;
}

.security-for-remote-properties #servicesContainer #forBusiness a.leadInImageLink,
.security-for-the-home #servicesContainer #forBusiness a.leadInImageLink,
.services #servicesContainer #forBusiness a.leadInImageLink:hover
{
background: url(http://www.calarms.co.nz/images/style/forBusiness.jpg) 0px -143px no-repeat;
}



.security-for-your-business #servicesContainer #forRemote a.leadInImageLink:hover,
.security-for-the-home #servicesContainer #forRemote a.leadInImageLink:hover,
.security-for-remote-properties #servicesContainer #forRemote a.leadInImageLink,
.services #servicesContainer #forRemote a.leadInImageLink
{
background: url(http://www.calarms.co.nz/images/style/forRemote.jpg) top left no-repeat;
}

.security-for-your-business #servicesContainer #forRemote a.leadInImageLink,
.security-for-the-home #servicesContainer #forRemote a.leadInImageLink,
.services #servicesContainer #forRemote a.leadInImageLink:hover
{
background: url(http://www.calarms.co.nz/images/style/forRemote.jpg) 0px -143px no-repeat;
}


/*****************Products*************************/

/*****************Product Cat Lising*************************/

.products #pageEditorContent
{
min-height:440px;
}

#pageEditorContent #pageSource
{
margin-bottom:40px;
}

.productListingItem a.image
{
float: left;
position: relative;
margin-bottom:20px;
  display:none;
}

.productListingItem
{
float: left;
position: relative;
width:100%;
border:1px solid #ebebeb;
margin-top:20px;
margin-right:20px;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;
background: #FFF;
padding:0px 0px 0px 0px;
background: -webkit-gradient(linear, 0 0, 0 bottom, from(#FFF), to(#fefefe));
background: -webkit-linear-gradient(#FFF, #fefefe);
background: -moz-linear-gradient(#FFF, #fefefe);
background: -ms-linear-gradient(#FFF, #fefefe);
background: -o-linear-gradient(#FFF, #fefefe);
background: linear-gradient(#FFF, #fefefe);

}

/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 544px) {

.productListingItem a.image
{
float: right;
position: relative;
margin-bottom:20px;
display:block;
}

.productListingItem
{
width:100%;
margin-top:20px;
margin-right:20px;
}

}


/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 992px) {

.productListingItem
{
width:47%;
margin-top:20px;
margin-right:20px;
}

.productListingItem a.image
{
float: right;
position: relative;
margin-bottom:0px;
}


}

/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 1200px) {

.productListingItem
{
width:47%;
margin-top:20px;
margin-right:20px;
}


}




.productListingItem a.image img.productListingThumb
{
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;
}

.productListingItem h2.categoryName
{
margin-top:35px;
text-transform:uppercase;
font-weight:600;
font-size:20px;
line-height:0px;


}


.productListingItem h2.categoryName a
{
text-decoration:none;
color:#3a3a3a;
padding-left:40px;
background: url(http://www.calarms.co.nz/images/style/productLisingArrow.jpg) 0px 2px no-repeat;
}


.productListingItem p.findOutMore
{
line-height:10px;

}


.productListingItem p.findOutMore a
{
text-decoration:none;
text-transform:uppercase;
font-size:14px;
font-weight:600;
color:#284b70;
padding-left:40px;
transition: all 0.5s ease-in;
}


.productListingItem p.findOutMore a:hover
{
transition: all 0.5s ease-in;
color:#3a3a3a;
}


/**********************************/

.siteSearch
{
float: left;
position: relative;
width:100%;
padding: 30px 0px 0px 0px;
}


.siteSearch span
{
font-size: 14px;
font-weight: bold;
}

.siteSearch input
{

}

#searchResultDescription
{
margin: 10px 0px 10px;
}


#searchResultItems .searchResultItem
{
margin: 15px 0px 0px 0px;
padding: 0px 0px 10px 0px;
border-bottom:1px solid #ccc;
}

#searchResultItems .searchResultItem a
{
color:#3a3a3a;
text-decoration: none;
}

#searchResultItems .title
{
font-weight: bold;
margin: 0px 0px 0px 10px;
font-size:16px;
text-transform:none;
}



#searchResultItems .title:hover
{
color: #284b70;
}

#searchResultItems .description
{

margin: 8px 0px 0px 10px;
padding:0px 0px 0px 0px;
}

table#brands
{

}

table#brands td
{

display:block;
}

/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 544px) {


table#brands td
{
display:block;
width:100%;
box-sizing:border-box;
}

}

/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 768px) {

table#brands td
{
display:inline-block;
width:33%;
box-sizing:border-box;
}


}

/*----------------------------------------------------------*/


#faqItems
{
width: 100%;
float: left;
position: relative;
}

#faqItems .faqItem
{
width: 100%;
float: left;
position: relative;
padding:5px 0px;
border-bottom:1px solid #c5d6e8;
}

#faqItems .faqItem a
{
font-size:16px;
text-decoration:none;
color:#284b70;
}

#faqItems .faqItem a:before
{
content:"\00bb";
margin-right:10px;
color:#284b70;
}


#faqItems .answer
{
width: 100%;
float: left;
position: relative;
padding-left:20px;
box-sizing:border-box;
}


/*********************/


.kss-links table td
{
display:block;
width:100%;
  text-align:center;
}

.kss-links table td img
{
max-width:100%!important;
height:auto!important;
}


/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 544px) {

.kss-links table td
{
display:block;
width:100%;
}

}


/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 768px) {

.kss-links table td
{
display:inline-block;
width:49.5%;
padding:20px;
box-sizing:border-box;

}

}


/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 992px) {




}

/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 1200px) {



}


/********************/

.kss-size-options table tr:nth-child(odd)
{
background:#e1f0ff;
}

.kss-size-options table tr:nth-of-type(1)
{
background:#284b70;
color:#FFF;
font-weight:600;
}

.kss-size-options table td
{
width:33.33%;
box-sizing:border-box;
padding:10px 10px;
}

.kss-size-options table td:nth-of-type(4)
{
width:55%;
}

.kss-size-options table td.hideTD
{
display:none;
}

/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 544px) {

.kss-size-options table td
{
width:15%;
box-sizing:border-box;
padding:10px 10px;
}

.kss-size-options table td:nth-of-type(4)
{
width:55%;
}



}


/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 768px) {

.kss-size-options table td.hideTD
{
display:inline-block;
width:55%!important;
}


.kss-size-options table td
{
width:15%!important;
box-sizing:border-box;
padding:10px 10px;
}

.kss-size-options table td:nth-of-type(4)
{
width:100%!important;
}

}


/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 992px) {




}

/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@media screen and (min-width: 1200px) {





}
