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

html {
	height:100%;
	background: #fff; 
	margin:0; 
	padding:0; }
body {
	padding: 0 23px;
	margin:0;
	height:100%;
	text-align:center;
	font:14px 'Montserrat', sans-serif; }
	
p { line-height:22px;}	

footer { xbackground:#eee; color:#888; padding:0 10px; margin-bottom:20px; font-size:13px; }
footer a{ color:#888;} 

.titleimage { padding:10px 0 25px;} 

i {
	position: absolute;
	bottom: 40px;
	left:50%;
    border: solid black;
    border-width: 0 3px 3px 0;
    display: inline-block;
    padding: 3px;}

.right { transform: rotate(-45deg); -webkit-transform: rotate(-45deg);}
.left { transform: rotate(135deg); -webkit-transform: rotate(135deg);}
.up { transform: rotate(-135deg); -webkit-transform: rotate(-135deg);}
.down { transform: rotate(45deg); -webkit-transform: rotate(45deg);}

.hide { display:none;}		

h1 {
	font-size: 28px;
	margin: 20px 10px 10px ;
	line-height: 32px;
	text-transform:uppercase; 
	font-weight:300; 
	font-size:26px; 
	line-height:39px; }
h1::first-letter { font-size:30px;}
h1 span { padding:0 5px; font-size:30px;}
 
h2 {
	font-size: 21px;
	margin: 10px 10px 15px;
	line-height: 28px;
	text-transform:lowercase;
	letter-spacing:1px;
	text-transform:uppercase;
	font-weight:300;}
h3 {
	margin: 0 0 12px;  
	text-transform: uppercase;
	font: bold 14px "Open Sans", sans-serif;
	letter-spacing:1px;
	font-size:15px; 
	color:#d37c00; }	
h4 {
	font-size:14px; 
	margin:0;
	padding:0;
	font-weight:500; }
 	
ul { text-align:left; padding-left:28px;}
ul li {
	text-align:left; 
	margin-bottom:15px;
	line-height:22px;
	list-style:none;}
 
a { color:#000; text-decoration:none;}	

.wrap{
	position: relative;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-direction: column;
	flex-direction: column;
	-webkit-flex-wrap: nowrap;
	flex-wrap: nowrap;
	-webkit-align-items: flex-start;
	align-items: flex-start;
	-webkit-justify-content: center;
	justify-content: center;  
	height: 100vh;
	width: 100%;
	font-family: 'Montserrat', sans-serif;}
	
section {
	position:relative;
	background:#eee;
	margin:0;
	padding:23px 0; 
	margin-bottom:23px;  }

#intro {
	width:100%;
	height:100vh;
	margin-top:23px; 
	position: relative; 
	background:url(../img/cover-image2.jpg) no-repeat #dabc73;
	background-size: cover;
	background-position: center bottom;
	padding: 0 !important; }
	
.welcome {
	position: relative; 
	max-width:600px;
	margin:0 auto;
	color:#d36f2c;
	line-height:21px;}	
.welcome p { padding: 0 10px 5px;}
	
.intro-flex { 
    display: flex;
    flex-direction: column;
	flex-wrap:wrap;
	align-content: space-between;}
	
.intrologo {
	position:absolute;
	background: url(../img/logo1.png) no-repeat center 25px;
	width: 100%;
	height:125px;} 
 
.intro-flex.middle {
	height:60%;
	padding-top:130px;
	justify-content: center;
	align-content: center;}
.intro-flex.bottom {
	height:40%;
	justify-content: flex-end;
	align-content: center;}
.intro-flex.bottom img { xheight:100%; width:auto;}


@media (max-width: 750px){   
	.intro-flex.bottom img { height:auto; width:90%;}
}
@media (min-width: 1150px) and (min-height: 800px) {   
	.welcome {  font-size: 120%; } 
}

@media (min-height: 800px) {
	.welcome { padding-top:10px;}
	.welcome p { line-height:30px !important; padding: 10px;} 
}
@media (max-height: 800px) { 
	h1 { font-size:25px; line-height:33px;}  
}

#process {
	padding: 30px 0 50px;
	background:#f8f2e7;
	background:#000; }
#process img { display:block; width:75px; height:75px; margin:10px auto;}
#process ul { display:block; padding:0; margin:0; }
#process li{
	float:left;
	width:14%; 
	list-style-type:none; 
	margin:0; 
	padding:0;
	color:#999;  
	font-family: 'Montserrat', sans-serif; 
	text-transform:uppercase;
	text-align:center;
	font-size:15px;
	letter-spacing:1px;
	line-height:22px; }	
#process p { margin:0; }

#plannercontent { position:relative; background:#fff; padding: 9px 0 ; border-bottom:6px double #ccc; margin-bottom: 30px;}
#plannercontent h2{ position:relative; color:#555; letter-spacing:1px; font-weight:500;  line-height: 20px; font-size:33px; top:25px; display:inline; background:#fff; padding: 0 20px;  }

#goalsetter,
#construction,
#printables,
#agenda,
#lifetools { xborder-top: 16px solid #ddd;} 

#goalsetter ul { margin:0 ; padding:0;} 
#goalsetter ul img { width:90px; padding:10px 0;}
#goalsetter ul h3 { margin:5px 0 15px;}
#goalsetter li {
	xborder:2px solid #ddd;
	border-radius: 7px;
    -moz-border-radius: 7px;
    -webkit-border-radius: 7px;
	text-align:center;
	padding:20px 20px 0;
	background:#fafafa;  } 

#goalsetter h3 {
	padding-top:10px;
	color:#000; }

.subtitle {
	font-size:17px;
	padding-bottom: 0;
	line-height:28px;
	color:#999;}
	 
.logo { position:relative; width:70px; height:122px; background:url(../img/logo1.png) no-repeat center center; margin:0 auto;}


#agenda ul { padding:0;} 
#agenda li {
	xborder:2px solid #ddd;
	background:#fafafa;
	padding:22px;
	border-radius: 11px;
    -moz-border-radius: 11px;
    -webkit-border-radius: 11px;}
#agenda li h3 {
	text-align:center;}
#agenda li p {color:#ac873e;}
  
 
#lifetools h3 { margin:5px 0 15px; }
#lifetools ul { padding:0;} 
#lifetools ul img{
	float:left;
	margin:0 8px 0 0;
	height:30px;}
#lifetools ul li{   
	padding:22px;
	border-radius: 11px;
    -moz-border-radius: 11px;
    -webkit-border-radius: 11px;
    background: #ddd; 
	xborder:2px solid #ddd;
	background:#fafafa; }		
 
 	

#pictures { padding:0; background:#fff;}
#pictures ul,
#pictures li { margin:0; padding:0;}
#pictures img { width:99%; height:99%; position:relative; top:2px; } 
#pictures .two.columns { width: 16.66666666666%; }


#printables ul {
	margin:0 0 10px;
	width:32%; }  
#printables li a { 
    text-decoration: none;
    padding: 7px 0;
    text-align: center; 
    color: #000;
    width: 100%; 
    letter-spacing: 0;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    border-radius: 8px;
    background: #ddd;
	display:block;  }

#printables li a::first-letter { font-size:15px;}


#testimonials {background:#f8f2e7;}
#testimonials h1{ color:#b87e3a; margin-bottom:25px;}
#testimonials ul { padding: 0;}
#testimonials li {
	position:relative;
	border-radius: 7px;
    -moz-border-radius: 7px;
    -webkit-border-radius: 7px;
	background:#fff;  
	padding:20px 10px 15px 20px;
	box-shadow:0 0 6px #d9d9d9;}
#testimonials ul li:after {
    content: "";
    position: absolute;
    box-shadow: #e4e4e4 2px 2px 2px ;
    -moz-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    bottom: -10px;
    left: 50px;
    border-width: 10px;
    border-style: solid;
    border-color: transparent #FFF #FFF transparent;}	
#testimonials date { 
	font-size:12px;  
	padding:0 3px 0 6px;
	font-weight:normal;}
#testimonials p { margin-bottom:10px;} 
#testimonials em {
	font-style: normal;
	font-size:12px;
	font-weight:bold;
	margin:0;
	padding:0;
	color:#b87e3a;  
	text-align:right;
	display:block; }


*,
*::before,
*::after { margin: 0; padding: 0; box-sizing: border-box;}

.container-tabs {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  font: 14px/1.5 "Open Sans", sans-serif;
  color: #345; }

p:not(:last-child) { margin: 0 0 20px;}

.main {
	padding-bottom:30px;
	max-width: 819px; }
.main img { width:100%; max-width: 819px;}

.section {
  display: none;
  padding: 25px 0 0;
  border-top: 1px solid #ccc;}

input { display: none; }

label { 
  display: inline-block;
  margin: 0 0 -1px;
  padding: 15px 25px;  
  text-transform: uppercase;  
  font-size:15px; 
  letter-spacing:1px;
  font-weight:bold;
  text-align: center;
  color: #000;
  border: 1px solid transparent;}

label:hover { color: #9e6900; cursor: pointer;}

input:checked + label {
  color: #d37c00;
  border: 1px solid #ccc;
  border-top: 4px solid #d37c00;
  border-bottom: 1px solid #eee;}

#tab1:checked ~ #content1,
#tab2:checked ~ #content2,
#tab3:checked ~ #content3 { display: block;}

	

#construction ul { padding: 10px 0 0 50px;}
#construction li{ list-style-type: disc; margin-bottom:10px; } 
#construction img { width:100%; max-width: 500px;} 

#about { background:#f8f2e7; padding-bottom:0;}
#about p { text-align:left; color:#b87e3a; xpadding-left:430px }
#about h1{ color:#b87e3a;}	
#about .pic {text-align:center;}
#about .pic img {
	border:3px solid #dbc7a1;
	border-radius: 11px;
    -moz-border-radius: 11px;
    -webkit-border-radius: 11px;
	 width:100%;
	 max-width: 519px;
	 height:auto;  }
	 
.circle { 
	float: left;
    shape-outside: url(img/picsmall.png);
	shape-image-treshold:1;
    width: 420px;
    height: 314px;
	margin:0 20px 10px 0; }	 
.picsmall { 
	border:3px solid #dbc7a1;
	border-radius: 11px;
    -moz-border-radius: 11px;
    -webkit-border-radius: 11px;
	position:absolute;
	left:0;
	width:430px; 
	height:303px; }	

#buynow {
	background:#000;
	color:#999;} 	
	
.cta { height:50px;} 
.buy {
	border-radius: 4psx;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px; 
	background:#c57c42;
	color:#fff;  
	border:0;
	padding: 9px 20px;
	margin:5px;
	text-transform:uppercase; }	
.buy:hover { background:#000; color:#fff;} 
#buynow h1 { color:#ac873e; color:#fff;}
#buynow .buy { background:#cf8e42; color:#000;}
#buynow .buy:hover { background:#fff;}

.getnotified {
	border-radius: 4psx;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px; 
	background:#444;
	color:#fff;  
	border:0;
	padding: 9px 20px;
	margin-top:5px;
	text-transform:uppercase; }	
.getnotified:hover { background:#000; color:#fff;} 
	
@media (max-width: 1100px) { 
    #pictures .two.columns  { width: 33%;  } 
	
    #process { padding:20px 0 40px;}
    #process .two.columns { width: 18%;}
    #process .one.column { width: 5%;} 
	
	#process li{
		text-transform:uppercase;
		text-align:center;
		font-size:13px;
		letter-spacing:1px;
		line-height:20px; }	
}

@media (min-width: 1100px) { 
	#intro { background-size: 100% 100%; }		
}

@media (max-width: 755px) { 
	#printables li a {
		line-height: 60px;
		padding: 5px 10px;
        height: 60px;
		line-height: 1.5;
	    vertical-align: middle;}		
}


@media (max-width: 600px),
@media (max-height: 550px) {
	body { padding:0;} 
	section { padding:16px 0; margin-bottom:16px;}
    h1 { font-size: 16px; font-weight:500; line-height:21px; margin-bottom:10px; letter-spacing:0;}
	.row { margin-bottom:0;} 
    h1::first-letter { font-size:18px;}
    h1 span { padding:0 5px; font-size:18px;}
	
    p {  line-height:18px;}	
    .logo { background-size: 90%; height:90px;}
	.welcome p { line-height:17px; font-size:95%;}	
	
	#intro { margin:0; }	
	
	#goalsetter ul img { padding:15px 0 0; width:110px;}
    #goalsetterul ul h3 { margin:0;}
    #goalsetter li { padding:0 10px;} 
	
    #printables ul { padding-left:0;}
    #printables li { padding-left:5px;} 
    #printables li a{
		font: 15px "Source Sans Pro", sans-serif;  
		word-break: break-word; 
		line-height:17px;
		padding: 15px 5px; }
	
    #construction ul { padding: 0 0 0 15px;}
	
    .subtitle { font-size:14px; line-height:20px;}
	
    #process li img { width: 50px; height: 50px; margin:10px auto 0;}
    #process li p{ 
		font-family: "Source Sans Pro", sans-serif;
		font-size:12px; 
		text-transform:none; 
		letter-spacing:normal; 
		line-height:18px;}
    #process .two.columns { width: 19%;}
    #process .one.column { width: 2%;} 
	
    #pictures .two.columns { width: 50%;  } 
 
    label { font-size: 14px; padding: 15px 10px; letter-spacing:0; }
	#plannercontent h2{ font-size:22px; letter-spacing:0; padding:0 15px; }
}	
	
	

	