/* CSS Document */
body {
	font-size:12px;
	line-height:18px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	margin:0px;
	padding:0px;
	background-image:url(images/fadedbg.gif);
	background-position:bottom left;
	background-repeat:repeat-x;
}
#background {
	background-image:url(images/bg.gif);
	background-position:top center;
	background-repeat:no-repeat;
}
#container {
	width:740px;
	margin-left:auto;
	margin-right:auto;
	padding-top:9px;
}
#left {
	float:left;
	width:261px;
	padding-right:2px;
	color:#464646;
}
#logo {
	width:261px;
	height:137px;
}
.nopad {
	padding:0px;
	margin:0px;
}
.bullet {
	margin-top:0px;
	margin-left:20px;
	padding:0px;
}
#left h1 {
	font-size:18px;
	padding-left:12px;
	padding-bottom:8px;
	margin:0px;
}
#left .feature {
	margin-left:11px;
	margin-bottom:11px;
}
#right {
	float:left;
	width:459px;
	padding:20px 10px 10px 8px;
}
#bb1000 {
	position:relative;
	margin-bottom:22px;
	width:461px;
	height:429px;
	background-image:url(images/bb-1000-background.jpg);
	background-position:top left;
	background-repeat:no-repeat;
	z-index:0;
}
#bb1000 h2 {
	position:absolute;
	z-index:1;
	top:19px;
	left:219px;
	width:141px;
	height:47px;
	padding:0px;
	margin:0px;
	color:#FFFFFF;
	background-color:#72d4fa;
	font-family:Eurostile, Verdana, Arial;
	font-size:36px;
}
#bb1000product {
	position:absolute;
	z-index:1;
	top:66px;
	left:162px;
	width:245px;
	height:278px;
}
#bb1000content {
	position:absolute;
	z-index:2;
	top:16px;
	left:17px;
	line-height:16px;
	width:153px;
	height:303px;
	color:#626262;
	text-align:justify;
}
#bb800 {
	position:relative;
	margin-bottom:22px;
	width:461px;
	height:407px;
	background-image:url(images/bb-800-background.jpg);
	background-position:top left;
	background-repeat:no-repeat;
	z-index:0;
}
#bb800 h2 {
	position:absolute;
	z-index:1;
	top:9px;
	left:216px;
	width:157px;
	height:69px;
	padding:0px;
	margin:0px;
	color:#FFFFFF;
	background-color:#a5fda4;
	font-family:Eurostile, Verdana, Arial;
	font-size:36px;
}
#bb800product {
	position:absolute;
	z-index:1;
	top:78px;
	left:162px;
	width:245px;
	height:278px;
}
#bb800content {
	position:absolute;
	z-index:2;
	top:14px;
	left:17px;
	width:153px;
	line-height:15px;
	height:284px;
	color:#626262;
	text-align:justify;
}
.demonstrationlinks {
	position:absolute;
	z-index:1;
	top:22px;
	left:407px;
	width:54px;
	height:112px;
}
.wrasapproved {
	position:absolute;
	z-index:3;
	top:299px;
	left:22px;
	width:160px;
	height:50px;
}
.visituk {
	position:absolute;
	z-index:2;
	top:362px;
	left:16px;
	width:167px;
	height:25px;
}
.bbdemonstrationlink {
	position:absolute;
	z-index:1;
	top:407px;
	left:156px;
	width:242px;
	height:17px;
}
.bbwrasapproved {
	position:absolute;
	z-index:3;
	top:322px;
	left:22px;
	width:160px;
	height:50px;
}
.bbvisituk {
	position:absolute;
	z-index:2;
	top:385px;
	left:16px;
	width:167px;
	height:25px;
}
#bb800content h3, #bb1000content h3 {
	padding:0px 0px 0px 5px;
	margin:0px;
	font-family:Futura Bk BT, Verdana, Helvetica, sans-serif;
	font-size:18px;
	color:#ff8601;
}
#demonstration {
	position:static;
	width:638px;
	height:405px;
	padding-top:12px;
	margin:16px 25px 39px 25px;
	background-image:url(images/demonstration-background.jpg);
	background-position:top left;
	background-repeat:no-repeat;
	background-color:#003466;
}
#footer {
	width:688px;
	height:32px;
	padding-top:5px;
	color:#000000;
	line-height:12px;
	margin-bottom:24px;
}
#footer a {
	text-decoration:none;
	color:#0084b5;
}
#footer a:hover {
	text-decoration:underline;
}
.clear {
	clear:both;
}
img {
	border:0px;
}
#basic-modal-content {
	display:none;
}
#simplemodal-overlay {
	background-color:#000;
}
#simplemodal-container {
	height:500px;
	width:620px;
	color:#bbb;
	background-color:#333;
	border:4px solid #444;
	padding:12px;
}
#simplemodal-container .simplemodal-data {
	padding:8px;
}
#simplemodal-container code {
	background:#141414;
	border-left:3px solid #65B43D;
	color:#bbb;
	display:block;
	font-size:12px;
	margin-bottom:12px;
	padding:4px 6px 6px;
}
#simplemodal-container a {
	color:#ddd;
}
#simplemodal-container a.modalCloseImg {
	background:url(images/x.png) no-repeat;
	width:25px;
	height:29px;
	display:inline;
	z-index:3200;
	position:absolute;
	top:-15px;
	right:-16px;
	cursor:pointer;
}
#simplemodal-container h3 {
	color:#84b8d9;
}

#demo-page-link {
    max-width: calc(100% - 20px);
    margin: 0 auto;
    background-color: #F9F9F9;
    padding: 10px;
    border-radius: 15px;
    box-sizing: border-box;
}

@media all and (max-width: 750px) {
    #background {
        background-position: left top;
    }
    
    #container {
        width: auto;
    }
    
    #left, #right {
        float: none;
        width: auto;
        padding: 0 20px;
        box-sizing: border-box;
    }
    
    #footer {
        width: auto;
        padding: 0 20px;
    }
}

@media all and (min-width: 451px) and (max-width: 750px) {
    #bb1000, #bb800 {
        margin-left: auto;
        margin-right: auto;
    }
}
 
@media all and (max-width: 450px) { 
    #bb1000, #bb800 {
        width: auto;
        height: auto;
        background-size: cover;
        padding: 10px;
    }
    
    #bb1000 h2, #bb1000product, #bb1000content, .bbvisituk,
    #bb800 h2, #bb800product, #bb800content, .visituk {
        position: static;
        width: auto;
        height: auto;
    }
    
    #bb1000 h2, #bb800 h2 {
        background-color: transparent;
    }
    
    #bb1000product, #bb800product {
        margin-bottom: 10px;
    }
    
    .demonstrationlinks {
        top: 0;
        left: auto;
        right: 0;
    }
    
    
    #demonstration {
        width: auto;
        height: auto;
    }
    
    #swiffycontainer {
        width: auto !important;
    }
}