/*--- Practitioners Styles ---*/

body {
	background:#bfcde3;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:11pt;
	line-height:1.7;
	margin: 0px;

}

#container {background-color: #ffffff;
max-width: 1080px; width:90%; height: 100%; margin: auto; display:block; overflow:hidden;
}

#nav-shell {
    width: 96.3%;
    text-align: right;
    float: left;
    padding: 5px 20px 5px 20px;
}

/*--- Top Nav Bar -- */
.topnav {
	background-color: #95b3c9;
	color:#ffffff;
	padding-top:5px; 
	padding-bottom:5px; 
	padding-right:20px;
	font-size:10pt;
}
 .topnav a:link, .topnav a:visited {
    color: #ffffff;
    font-weight: normal;
    text-decoration: none;
	font-size:10pt;

}

.topnav a:hover, .topnav a:active {
    text-decoration: underline;
    color: #ffffff;
	font-size:10pt;
}


/* Logo */

#buttons {
    width: 96.6%;
    padding: 10px 30px 10px 30px;
    float: left;
    background: #ffffff;
}

#logo {
    width: 23%;
    float: left;
    padding: 0px 4% 0px 2%;
    max-height: 141px;
}

.logo-img {
    height: fit-content;
    margin: 0px;
    display: block;
}

/* Rollover navigation images */
    .rollover {
        width: 14%;
        height: 100%;
        position: relative;
        display: inline-block;
		float:left;
    }
    .rollover .img-top {
        display: none;
        position: absolute;
        top: 0;
        left: 0;
        z-index: 99;
    }
    .rollover:hover .img-top {
        display: inline;
    }

/*--- Page Title bar ---*/

#search-box {
	float:left; 
	padding:8px 0px 8px 0px;
}
#page-heading {
  float:right;
}

.title-home {
	background-color:#deda7f;
	color:#345420;
	padding-top:5px; 
	padding-bottom:5px; 
	padding-right:20px;
	font-size:10pt;
}

/*--- Left Menu Box ---*/
	
#mainnav {
    float: left;
    padding: 10px 0px 10px 0px;
    width: 215px;
    margin: 10px 0 0 2%;
}	
	
	
.arrow ul { margin:0; padding:0; list-style:none;}
.arrow li { background:url(images/gen_list_bg.gif) no-repeat 0 7px; line-height:18px; margin:0px; padding-left:25px; margin-left:25px; color: #595959 ; font-size:10pt;}
.arrow li a { color:#608d4f;}

/*--- Aweber Form ---*/

#af-form-1365576691 .af-header {
	padding-top: 0px!important;
	padding-right: 0px!important;
	padding-bottom: 0px!important;
	padding-left: 0px!important;
}

#af-form-1365576691 .bodyText p {
    margin-top: 0px!important;
}

/*--- Page content div ---*/

#maincontent {
    float: right;
    width: 72%;
    padding: 20px 3% 20px 3%;
}

#maincontent img
{
	position: relative;
	max-width: 90%;
	height:auto;
	top: 10%;
	margin-left: 5%;
	margin-right: 5%;
	border-radius: 3px;
	box-shadow: 0 3px 6px rgba(0,0,0,0.9);
}

/* Home page Video Section */

#vid-container {
    width: 87%;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 30px;
    padding: 0px 0px 4% 0px;
    display: block;
    overflow: hidden;
    border: 1px solid #cccccc;
	background-image: linear-gradient(#ffffff, #deda7f);
}

#vid-title {
width:100%;
background-color: #6c945d;
background-image: linear-gradient(to right, #deda7f 5%, #608d4f 50%, #deda7f);
text-align: center;
padding: 0px;
margin:0px;
}

#vid-title h2 {
    color: #ffffff;
	margin: 0px;
    padding: 5px;
	font-weight:normal;
}

#home-vid1 {
    width: 25.5%;
    float: left;
    margin: auto;
    padding: 5% 0 0 6%;
}

#banner-container {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 20px;
    padding: 0px 0px 0px 0px;
    display: block;
    overflow: hidden;
    background-image: linear-gradient(#321b52, #5748a3);
}
#banner-image {
    width: 260px;
    height: 75px;
    float: left;
    padding: 0 4% 0 0%;
}


.hybrid-kit {
	background-image: linear-gradient(#751e67, #f241d5)!important;
}

.basic-img img {
    width: 100%!important;
	max-width: 100%!important;
	top: 0%!important;
	margin-left: 0%!important;
	margin-right: 0%!important;
	border-radius: 0px!important;
	box-shadow: 0 0 0 0!important;
}

/*--- Footer ---*/

#ft-box1 h2, #ft-box2 h2, #ft-box3 h2 {
    color: #123b59;
}

#ft-box1, #ft-box2, #ft-box3 {
	float:left;
	width:30%;
	text-align:left!important;
	padding: 10px 15px;
}

#ft-box1 p, #ft-box2 p, #ft-box3 p, #ft-box1 td, #ft-box2 td, #ft-box3 td {
    font-size: 11pt;
    color: #ffffff;
}
#ft-box1 a, #ft-box2 a, #ft-box3 a {
    font-size: 11pt;

}

/*--- Typography ---*/

h1, h2, h3 {
font-family: Calibri, Arial, Helvetica, sans-serif;
margin: 10px 5px 5px 5px;
line-height:1.3;	
}

h1 {
    font-size: 24pt;
    color: #345420;
    font-weight: 500;
}

h2 {
    font-size: 20pt;
    color: #3c6482;
    font-weight: 400;
}

h3 {
	font-size: 16pt;
	color:#1A6600;
}

h4{font-family:Verdana, Arial, Helvetica, sans-serif;
	color:#000 ;
	font-size:14px;
	font-weight: bold; 
	line-height: 12pt;
	margin-bottom:8pt }
	
p, td {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:11pt;
	color: #595959;
	line-height:1.7;
	padding:8px;
}

a:link, a:visited {
    color: #608d4f;
    font-weight: bold;
    text-decoration: none;
	font-size:10pt;

}

a:hover, a:active {
    text-decoration: underline;
    color: #cec740;
	font-size:10pt;
}

h1 a:hover, h1 a:active {
	color: #345420;	
    font-size: 24pt;
	    font-weight: 500;
}

h1 a:link, h1 a:visited {
	color: #345420;
    font-size: 24pt;
	font-weight: 500;
}

h2 a:hover, h2 a:active {
	color: #3c6482;
    font-size: 20pt;
	font-weight: 400;
}

h2 a:link, h2 a:visited {
	color: #3c6482;
    font-size: 20pt;
	font-weight: 400;
}

h3 a:hover, h3 a:active {
	color:#1A6600;
    font-size: 16pt;
	font-weight: 400;
}

h3 a:link, h3 a:visited {
	color:#1A6600;
    font-size: 16pt;
	font-weight: 400;
}

h4 a:hover, h4 a:active {
	color:#000000;
    font-size: 14pt;
	font-weight: 400;
}

h4 a:link, h4 a:visited {
	color:#000000;
    font-size: 14pt;
	font-weight: 400;
}

#banner-text h1 {
	color:#ffffff!important;
	text-align:center;
	margin-top: 18px;
}

#banner-text h1 a:link, #banner-text h1 a:visited, #banner-text h1 a:hover, #banner-text h1 a:active {
    color: #ffffff!important;
}

.hybrid-kit2 {
	margin-top: 8px!important;
}

#banner-text h2 {
	color:#ffffff!important;
	text-align:center;
	margin-top: 0px;
}

#banner-text h2 a:link, #banner-text h2 a:visited, #banner-text h2 a:hover, #banner-text h2 a:active {
    color: #ffffff!important;
}

/*--- General Classes ---*/

.content {
	width: 950px;
	text-align: left;	
}



 .bottomnav a:link, .bottomnav a:visited {
    color: #608d4f;
    font-weight: bold;
    text-decoration: none;
	font-size:10pt;

}

.bottomnav a:hover, .bottomnav a:active {
    text-decoration: underline;
    color: #cec740;
	font-size:10pt;
}


.gen {
	color:#FFF;
	padding-left:20px;
	
}


.footnote, .footnote a {
    color: #504B56;
}


.border {
    border: 2px solid #5c8727;
}

#but-nav {width: 100%; max-height: 163px; float:left; padding: 5px;}


#navbut{
    max-width:14%;
    position: relative;
    display:block;
    margin:0 auto;
	float:left;
}
.navbut-img{
    width:100% !important;
    display:block;
	padding: 5px;
}


#ddsidemenubar {float:left; padding: 10px 0px 10px 0px;}



#menu {
    width:210px;
	display:inline;
}

.toggle, [id^=drop] {
 display: none;
}

nav {
  margin: 0;
  float:left;
  width:205px;
  display:inline;
  padding: 0px 0px 0px 10px;
}

nav:after {
  content: "";
  display: table;
  clear: both;
}

nav ul {
  float: right;
  padding: 0;
  margin: 0;
  list-style: none;
  position: relative;
  font-family: Arial, Verdana;
  line-height:22px;
  text-align:left;
  color: #ffffff;
}

nav ul li {
    margin: 0px;
    display: block;
    float: left;
    position: relative;
    color: #ffffff;
    background: #608d4f;
    background-image: linear-gradient(to right, #608d4f, #deda7f);
    border-bottom: 1px solid #ffffff;
}

nav a {
    display: block;
    color: #ffffff!important;
    font-size: 14px!important;
    font-weight: 400!important;display: block;
    text-decoration: none;
    padding:0px 10px 0px 10px;
    width:195px;
    line-height:33px;
}

nav ul li ul li:hover { }

nav a:hover { }

nav ul ul {
  display: none;
  position: absolute;
  top: 60px;
  width:200px;
  float:right;
  margin-left:205px;
  margin-top:-53px;
  z-index:100;
}

nav ul li:hover > ul { display: block; }

nav ul ul li {
  width: 170px;
  float: none;
  display: list-item;
  position: relative;
  font-size: 12px;
}

nav ul ul ul li {
  position: relative;
  top: -60px;
  left: 170px;
}



#otherside {clear:both;}


#member-login td {padding: 5px 0px 5px 0px;}

#mem-log, #aweber {display: none;}

#menu-icon {
	display: none;
	width: 40px;
	height: 45px;
	margin: -63px 0px 0px 10px;
	border:none;
	float: left;
}

.main-container {
	margin-top: 30px;
	margin-left: 10%;
	margin-right: 10%;
	max-width: 80%;
			}
			
.video-container {
	position: relative;
	padding-bottom: 55%;
	overflow: hidden;
}

.video-container iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.product-list{margin-top:20px}
.product-list .product-item{width:185px;height:415px;padding:20px;float:left;display:inline-block;margin:10px 0px 30px 0px;}
.product-list .product-item h3 {text-align:center;}
.product-list .product-item .product-image img{display:block!important; margin-left:auto!important; margin-right:auto!important; max-width:100%;max-height:100px;min-height:100px; border:0;border-radius: 0px!important; box-shadow: 0 0px 0px 0px !important;}
.product-list .product-item .product-image {text-align:center!important;}
.product-item .price{font-size:16px;margin:5px 0 10px; color:#000000;}
.product-item h3{color:#608D4F;font-size:16px;font-weight:normal; min-height:42px;}
.product-item .product-description{height:180px;display:block;overflow:scroll; overflow-x:hidden; margin:0px 0px 10px 0px; position:relative;}
.product-item .price-rrp-tag{font-size:10px;font-weight:normal;}
.product-item input[type=submit] {padding:10px 15px; width:100%; background:#608D4F; border:0 none;
cursor:pointer; -webkit-border-radius: 5px; border-radius: 5px; color:#FFFFFF; }
.product-item input[type=submit]:hover {background:#0E7D62;}
.product-item .pendant-description{height:140px;display:block;overflow:scroll; overflow-x:hidden; margin:0px 0px 10px 0px; position:relative;}

.noshadow {border-radius: 0px!important; box-shadow: 0 0px 0px 0px !important;}
.pendant-list{margin-top:20px; width:100%; clear:both;}
.pendant-list .pendant-item {max-height:160px;padding:10px;float:left;display:inline-block;margin:10px 0px 10px 0px;}
.pendant-list .pendant-item img{display:block!important; margin-left:auto!important; margin-right:auto!important; border:0;border-radius: 0px!important; box-shadow: 0 0px 0px 0px !important;}
.pendant-list .pendant-item h3 {text-align:center;}





#feat-cont {
	width: 100%;
	text-align: center;
}

.feature { 
	float: left;
	margin: 20px 0px 20px 0px;
    min-width: 24%;
	}

/* Classes for Cookie Permissions Pop Up */
.cookieconsent { position:fixed; display:table; left:20%; bottom:5%; width:60%; background-color: #000000; z-index:99 }
.cookieconsent p, .cookieconsent span { display:table-cell; vertical-align:middle; color: #ffffff; padding: 15px; width:80% } 
.cookieconsent button { float:right; }
.cookieconsent { -webkit-animation:fadeBar 1s 1s both; animation:fadeBar 1s 1s both }
@-webkit-keyframes fadeBar {
	0% { opacity:0; -webkit-transform:translateY(100%) }
	100% { opacity:1; -webkit-transform:none }
	}
@keyframes fadeBar {
	0% { opacity:0; transform:translateY(100%) }
	100% { opacity:1; transform:none }
	}

/*MEDIA QUERY*/
@media only screen and (max-width : 1200px) {

#otherside {display:none;}

#maincontent {
	width:92.5%; 
	padding: 20px 4% 20px 0%;
}

.title-home {
	font-size:14pt;
}


p {
	font-size: 12pt;
	line-height: 18pt;
	text-align:center;
	}

a:link, a:visited, a:hover, a:active {font-size:12pt;}

#mem-log {display:inline-block;
		width: 75%;
		font-size: 12pt;
		clear:both;}

#mem-log table td {font-size: 12pt;}
		
#aweber {display:inline-block;
		width: 75%;
		font-size: 12pt;
		clear:both;}

@media all and (max-width : 768px) {

.cookieconsent { position:fixed; display:table; left:0; bottom:0; width:100%; background-color: #000000; z-index:99 }

#menu-icon {display:block; font-size:16px; font-weight:bold; border: 2px solid #ffffff; color:#608D4F!important; background-color:#DEDA7F;}

nav { margin: 0;}

.toggle + a,
 .menu { display: none;}

.toggle {
  display: block;
  /*background-color: #254441;*/
  padding: 0 10px;
  color: #FFF;
  font-size: 13px;
  line-height: 25px;
  /*text-decoration: none;*/
  border: none;
}

.toggle:hover { text-decoration: underline;/*background-color: #000000;*/ }

[id^=drop]:checked + ul { display: block; float:left; }

nav ul li {
  display: block;
  width: 100%;
}

/*nav ul ul .toggle,*/
 nav ul ul a { padding: 0 10px; color:#608D4F!important; background-color:#DEDA7F; font-weight:bold!important; width:185px; line-height:33px!important; }

nav ul ul ul a { padding: 0 20px;  }

nav ul ul a:hover { color:#ffffff!important; background-color: #608D4F; }

nav ul ul a {}

nav ul ul {
  display: none;
  position: relative;
  float: none;
  color: #000000;
  margin-left:0px;
  margin-top:0px;
  left:0px;
  top: 0px;
}

nav ul ul li:hover > ul,
nav ul li:hover > ul { display: none; }

nav ul ul li {
  display: block;
  width: 100%;
}

nav ul ul ul li { position: static;}

nav a {width:185px;}

nav { padding: 0px 0px 0px 0px;}

.title-home {
    font-size: 10pt!important;
}

#menu-icon {
    
	font-size: 12px!important;
	height: 25px!important;
    margin: -57px 0px 0px 15px!important;
}
#search-box {
float:right;
}
#page-heading {
text-align:center;
}

#page-heading {
    text-align: center;
    width: 94.5%;
    padding: 0px;
}


#container {
	width: 100%;
}

	

.topnav {
    line-height: 1;
	padding-right: 20px;
}

#logo {
    display: none;
}

#buttons {
    padding: 1% 2% 1% 2%;
}

#search-box {
    display: none;
}

.rollover {
    float: none;
	width: 18.8%;
}

.rollover img {
	width:100%;
}

h1 {
    font-size: 20pt;

}

h2 {
    font-size: 18pt;

}

p {
    font-size: 11pt;

}

#vid-title h2 {
    font-size: 13pt;

}

#home-vid1 {
    width: 40.5%;
}
#nav-shell {
    width: 91.5%;
}
#ft-box1, #ft-box2, #ft-box3 {
	float:left;
	width:90%;
	text-align:left!important;
	padding: 10px 15px;
}

#maincontent {
    padding: 0px 3% 20px 3%;
}

h1 a:hover, a:active {
	
    font-size: 20pt;
}

h1 a:link, a:visited {
	color: #345420;
    font-size: 20pt;
}

h2 a:hover, a:active {
    font-size: 18pt;
}

h2 a:link, a:visited {
	color: #3c6482;
    font-size: 18pt;
}

h3 a:hover, a:active {
    font-size: 16pt;
}

h3 a:link, a:visited {
	color:#1A6600;
    font-size: 16pt;
}

h4 a:hover, a:active {
    font-size: 14pt;
}

h4 a:link, a:visited {
	color:#000000;
    font-size: 14pt;
}

#banner-image {
    width: 150px;
    height: 43px;
}

#banner-text h1 {
	margin-top: 10px;
}

#banner-text h1 a:link, #banner-text h1 a:visited, #banner-text h1 a:hover, #banner-text h1 a:active {
    	font-size:18px!important;
}
#banner-container {
    margin-top: 0px;
    margin-bottom: 5px;
}
#banner-text h2 a:link, #banner-text h1 a:visited, #banner-text h1 a:hover, #banner-text h1 a:active {
    	font-size:16px!important;
}
}

@media all and (max-width : 330px) {

nav ul li {
  display: block;
  width: 94%;
}



}