@charset "utf-8";
	
	/* CSS Document */
	
	/* theme for hypnospa to modify original bootstrap theme  */
	

.body {
	font-family: Barlow, sans-serif;
	font-size: 150%;
	font-weight: bold;
}

	.navbar {
		background-color: #FFF;		
		margin-bottom:0px;
		border: #FFF;
		}
	
	.navbar-default .navbar-nav > li > a {
	  font-family: Barlow, sans-serif;
	  font-weight: bold;
	  color: #000;	
	}
	
	.navbar-default .navbar-nav > li > a:hover,	
	.navbar-default .navbar-nav > li > a:focus {
	 font-family: Barlow, sans-serif;
	 background-color: #FFF;
	 font-weight: bold;
	 text-decoration: none;
	 }
	
	.navbar-default .navbar-nav > .active > a,	
	.navbar-default .navbar-nav > .active > a:hover,	
	.navbar-default .navbar-nav > .active > a:focus {
	 font-family: Barlow, sans-serif;
     color: #A20190;
	 font-weight: bold;
	 background-color: #FFF;
	 }
	  

 .dropdown-menu {
	width: auto;
font-family: Barlow, sans-serif;
     color: #A20190;
	 font-weight: bold;
	 background-color: #FFF;	
}

.navbar-default .navbar-nav > .dropdown-menu a:hover, a:focus {
font-family: Barlow, sans-serif;
     color: #0392A5;
	 font-weight: bold;
	 background-color: #FFF;
}
	  
	 .navbar-brand {
	
		background-image: url("../../../images/hypno-spa_646.jpg");
		
		background-repeat:no-repeat;
		
		background-size:contain;
		
		background-position: left;
		
		} 
	  
.bluebox {	
	background-color: #0392A5;
	width: auto;
	height: auto;
	font-family: Barlow, sans-serif;
	font-weight: bold;
	font-size: 175%;
	color: #FFF;
	padding-bottom: 15px;
	padding-top: 15px;
	padding-left: 20px;
	padding-right: 20px;
}


.bluebox a:link {
	background-color: #0392A5;
		color: #FFF;		
		text-decoration:none;	
	}
	
 .bluebox a:visited {
	 background-color: #0392A5;
		color: #FFF;		
		text-decoration:none;
		}

 .bluebox a:active{
	 background-color: #0392A5;
		color: #FFF;
	    text-decoration:none; 
		}

 .bluebox a:hover {
	 background-color: #0392A5;
		color: #FFF;
	    text-decoration: none; 
		}

.bluebox-narrow {	
	background-color: #0392A5;
	width: auto;
	height: auto;
	font-family: Barlow, sans-serif;
	font-weight: bold;
	font-size: 125%;
	text-align: right;
	color: #FFF;
	padding-bottom: 15px;
	padding-top: 15px;
	padding-right: 25px;
	}


.purplebox {	
	background-color: #8437A0;
	width: auto;
	height: auto;
	font-family: Barlow, sans-serif;
	font-weight: bold;
	font-size: 175%;
	color: #FFF;
	padding-bottom: 15px;
	padding-top: 15px;
	padding-left: 0px;
	padding-right: 0px;
}


.purplebox a:link {
	background-color: #8437A0;
		color: #FFF;		
		text-decoration:none;	
	}
	
 .purplebox a:visited {
	 background-color: #8437A0;
		color: #FFF;		
		text-decoration:none;
		}
	
 .purplebox a:active{
	 background-color: #8437A0;
		color: #FFF;
	    text-decoration:none; 
		}
	
 .purplebox a:hover {
	 background-color: #8437A0;
		color: #FFF;
	    text-decoration: none; 
		}



.purplebox-narrow {	
	background-color: #8437A0;
	width: auto;
	height: auto;
	font-family: Barlow, sans-serif;
	font-weight: bold;
	font-size: 125%;
	text-align: center;
	color: #FFF;
	padding-bottom: 15px;
	padding-top: 15px;
	}


.purplebox-narrow a:link {
	background-color: #8437A0;
		color: #FFF;		
		text-decoration:none;	
	}
	
 .purplebox-narrow a:visited {
	 background-color: #8437A0;
		color: #FFF;		
		text-decoration:none;
		}
	
 .purplebox-narrow a:active{
	 background-color: #8437A0;
		color: #FFF;
	    text-decoration:none; 
		}
	
 .purplebox-narrow a:hover {
	 background-color: #8437A0;
		color: #FFF;
	    text-decoration: none; 
		}



.burgundybox {	
	background-color: #A20190;
	width: auto;
	height: auto;
	font-family: Barlow, sans-serif;
	font-weight: bold;
	font-size: 175%;
	color: #FFF;
	padding-bottom: 15px;
	padding-top: 15px;
	padding-left: 0px;
	padding-right: 0px;
}


.burgundybox a:link {
	background-color: #A20190;
		color: #FFF;		
		text-decoration:none;	
	}
	
 .burgundybox a:visited {
	 background-color: #A20190;
		color: #FFF;		
		text-decoration:none;
		}
	
 .burgundybox a:active{
	 background-color: #A20190;
		color: #FFF;
	    text-decoration:none; 
		}
	
 .burgundybox a:hover {
	 background-color: #A20190;
		color: #FFF;
	    text-decoration: none; 
		}

.lilacbox {
	background-color: #F3EBF8;
	padding: 20px;
}


.skybox {
	background-color: #EBF3F5;
	padding: 20px;
}

.pinkbox {
	background-color: #FAF0F9;
	padding: 20px;
}



 a:link {
		color: #8437A0;		
		text-decoration:none;	
	}
	
 a:visited {	
		color: #8437A0;		
		text-decoration:none;
		}
	
 a:active{
		color: #8437A0;
	    text-decoration:none; 
		}
	
 a:hover {
		color: #0392A5;
	    text-decoration: none; 
		}

	
	li a:link {	
		color: #8437A0;
		text-decoration:none;
		}
	
	li a:visited{	
		color: #8437A0;
		text-decoration:none;
		}
	
	li a:active{
		color: #8437A0;
	    text-decoration:none; 
		}
	
	li a:hover {	
		color: #0392A5;
		text-decoration: none; 
		}
		
	strong a:link {	
		color: #8437A0;
		text-decoration:none;
		}
	
	strong a:visited {	
		color: #8437A0;
		text-decoration:none;
		}
	
	strong a:active {
		color: #8437A0;
	    text-decoration:none; 
		}
	
	strong a:hover {	
		color: #0392A5;
		text-decoration: none; 
		}	
		
	
		
	.row h1{	
		font-family: Barlow, sans-serif;		
		color:  #8437A0;	
		font-size: 500%;
	    font-weight: bold;
	    letter-spacing: 0.20em;		
		margin-top: 10px;
		margin-bottom: 0px;		
		padding-top: 0px;
		}
	
.row	h2{	
		font-family: Barlow, sans-serif;		
		color:  #8437A0;		
		font-size: 300%;		
		margin-top:5px;		
	}
	
.row	h3{
		font-family: Barlow, sans-serif;	
		color:  #8437A0;		
		font-size: 200%;
	    letter-spacing: 0.10em;			
		margin-top:3px;
		margin-bottom:0px;		
	}
	
.row	h4{
		font-family: Barlow, sans-serif;		
		color:  #8437A0;		
		font-size: 150%;
		font-weight: bold;
		letter-spacing: 0.05em;			
		margin-top:3px;
		margin-bottom:0px;				
	}


.red{
	border-left: 4px solid #F00;
	padding-left: 5px;	
}
	
			
	.banner {
		width: 100%;
		margin-bottom: 15px;
	}
		
	.small {
		font-size: 85%;
		color: #0F70B7;
	}
	
	
em {
color: #952B2F;
}

	
	ul {
		list-style-image: url("../../../.gif");
		vertical-align:middle;
		text-align:left;
		line-height:130%;
		}


	li {	
		margin-bottom: 5px;
		text-align: justify;
		}
		
	
	
	h1{	
		font-family: 'Andada Pro', serif;		
		color:  #0F70B7;	
		font-size: 250%;
		letter-spacing: 0.05em;		
		margin-top: 10px;
		margin-bottom: 0px;		
		padding-top: 0px;
		}
	
	h2{	
		font-family: 'Andada Pro', serif;		
		color:  #0F70B7;		
		font-size: 125%;		
		margin-top:5px;		
	}
	
	h3{
		font-family: 'Andada Pro', serif;		
		color:  #0F70B7;		
		font-size: 140%;
		letter-spacing: 0.05em;			
		margin-top:3px;
		margin-bottom:0px;		
	}
	
	h4{
		font-family: 'Andada Pro', serif;		
		color:  #0F70B7;		
		font-size: 140%;
		margin-bottom:0px;		
	}
	
	
		
	h2 a:link {	
		color: #0F70B7;
		text-decoration:none;
		}
	
	h2 a:visited {	
		color: #0F70B7;
		text-decoration:none;
		}
	
	h2 a:active {
		color: #0F70B7;
	    text-decoration:none; 
		}
	
	h2 a:hover {	
		color: #F5B130;
		text-decoration: none; 
		}		
	
	
	.heading {	
		font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;		
		color:  #0F70B7;		
		font-size: 125%;
		font-weight: bold;
		margin-top:5px;		
	}	
	
		
	.break { 
		margin-bottom: 5px;
		margin-top: 5px; 
		border-bottom : 1px dotted #8437A0; 
		clear : both; 
		}
		
	.dmxtooltipcontent { 
 overflow: hidden !important; 
}
	

	.piccyleft { 
		float : left; 
		padding-right : 10px;
		margin-bottom: 0px; 
		}
	
	.piccyright {
    float:right ;
    padding-left : 3px;
	vertical-align: middle;
	}
	
	
	index footer {	
		color: #FFF;
		font-size: 85%;
		background-color: #666;
		padding-top: 0px; 
		height: auto;
		text-align: left;
		}
		
		
	index footer .row a:link {
		background-color: #8437A0;
		color: #FFF;
		text-decoration:none;
		}
	
	
	index footer .row a:visited {
		color: #FFF;
		text-decoration:none;
		}
	
	index footer .row a:active {
		color: #FFF;
		text-decoration:none; 
		}
	
	index footer .row a:hover {
		color: #FFF;
		text-decoration: underline; 
	}
	
	
	footer {	
		color: #FFF;
		font-size: 90%;
		background-color: #8437A0;
		padding: 25px;
		height: auto;
		}
		
	
	footer.row ul {
		color: #FFF;
		vertical-align:middle;
		text-align:left;
		line-height:130%;
		}
	
	footer.row li {
		color: #FFF;
		margin-bottom: 5px;
		}
	
		
	footer .row a:link {
		background-color: #8437A0;
		color: #FFF;
		text-decoration:none;		
	}
	
	
	footer .row a:visited {
		background-color: #8437A0;
		color: #FFF;
		text-decoration:none;		
	}
	
	footer .row a:active {
		background-color: #8437A0;
		color: #FFF;
		text-decoration:none; 
		}
	
	footer .row a:hover {
		background-color: #8437A0;
		color: #0392A5;
		text-decoration: none; 
	}
		
		
	.img-center {
			margin: 0 auto;
		}
		
	.img-responsive {
				width: contain;
		}

	strong {
			color: #8437A0;
		}
		
		.large {
font-size: 200%;
color: #0F70B7;
font-weight: bold;
}


	 .shadow { 	
			background:#CCCCCC; /* shadow color */
			border:1px solid #CCCCCC; /* darker border color */
			margin: 5px;
			position: relative;
		}
	
		.frame {	
			text-align: center; 
			background: #FFFFFF; 
			border: 1px solid #999999; /* lighter border color */
			position: relative; 
			padding: 5px;
			left:-4px; /* you can change this to change the amount of shadow */
			top:-4px; /* you can change this to change the amount of shadow */
		}

.container {
	height: auto; 
}

				
	
@media (max-width: 767px) {
		
	/* for small screens, make the padding at the top of the jumbotron picture */
	
	.jumbotron {
		height: 100%;
		width: 100%; 
		}
		
		.jumbotron .well {
		margin-top: 150px;
		}
			
	.img {
		width: contain;
	}
	
	.postit {
		background-position: left;
	}
	
	.well h1 {
		font-size: 150%;
		}
		
	.well h3 {
		font-size: 90%;
	}
	
	.postit {
		padding-top: 60px;
	}
		
		/* for small screens, make the heading at the top of the jumbotron picture */
		
		.jumbotron {
		background-image: contain;
		padding-top: 120px;
		padding-bottom: 0px;
		margin-bottom: 2px;
		}
	
	.jumbotron  h2 {
		font-size:195%;
		}
	
	.xs-align-left  {
		text-align:left !important ;
	}	
	
	.xs-align-center {
		text-align:center !important ;
	}
		
	.xs-align-center img {
		margin-left:auto;
		margin-right:auto;
	}
		
	.xs-align-right  {
		text-align:right !important ;
	}

}
	
@media (min-width: 768px) and (max-width: 991px) {
	
	/* for MEDIUM screens, set the padding at the top of the jumbotron picture */
	
	.jumbotron {
		height: 100%;
		width: 100%; 
		}

	.img {
		width: contain;
		}
		
	.backgound-image {
		width: contain;
	}
	
	.well h1{
		font-size: 175%;
		}
	
	.well h3{
		font-size: 100%;
		}
	
/*	.col-lg-3{
		width: 100%;
	}
*/
	
	.postit {
		padding-top: 60px;
		text-align: center;
	}

	.jumbotron {
		padding-top: 120px;
		padding-bottom: 0px;
		margin-bottom: 2px;
		}
	
		
	/* for MEDIUM screens, set H2 the heading at the top of the jumbotron picture */
	
	.jumbotron {
		height: 100%;
		width: 100%; 
		}

	.jumbotron  h2 {
		font-size:260%;
		}


	.sm-align-left  {
		text-align:left !important ;
	}
	
  .sm-align-center {
		text-align:center !important ;
	}			

	.sm-align-center > img {
		margin-left:auto;
		margin-right:auto;
	}

	.sm-align-right {
		text-align:right !important ;
	}

	.sm-align-right > img {
		float:right;
	}
/*
	.col-lg-4 {
		width: 100%;
	}
*/
	
}
	
@media (min-width: 992px) and (max-width: 1199px) {
	
	/* for LARGE screens, set the padding at the top of the jumbotron picture */
	
	.jumbotron {
		height: 100%;
		width: 100%; 
		}

	.img {
		width: contain;
	}
	
	.well h1{
		font-size: 175%;
		}
	
	.well h3 {
		font-size: 100%;
		}
		
	
	.col-lg-3{
		width: 100%;
	}
	
	.postit {
		padding-top: 50px;
		text-align: center;
	}
		
		
	.jumbotron {
		padding-top: 150px;
		margin-bottom: 2px;
	}

		
	/* for LARGE screens, set the heading at the top of the jumbotron  */
		
	.jumbotron  h2 {
		font-size:300%;
		}
	
	.md-align-left  {	
		text-align:left !important ;
	}
	
	.md-align-center {
		text-align:center !important ;
	}
	
	.md-align-center img {
		margin-left:auto;
		margin-right:auto;	
	}

	.md-align-right {
		text-align:right !important ;
	}
	
	.md-align-right > img {	
		float:right;	
	}
	
	.col-lg-3{
		width: 100%;
	}
	
}
	
@media (min-width: 1200px) {
	
	  .lg-align-left  {
	    text-align:left !important ;	
	  }
	
	  .lg-align-center {
	    text-align:center !important ;
	  }
	
	  .lg-align-center img {
			margin-left:auto;
			margin-right:auto;
		}
	
	  .lg-align-right {
	    text-align:right !important ;
	  }
	
	  .lg-align-right > img {
			float:right;
		}

}