/*  General Style Sheet for
    Babyin Babyout
    14 September 2014
    updated September 2020 Paul McKenzie
	
*/ 


/*------------------------------------------------------------------------- CONTAINERS */



	html,body {
		/* height: 100%; */
	}

	* { margin: 0px; padding: 0px; }

	a img { border:none; } 
	a { outline: none; }

	html {
		font-family: arial, helvetica, sans-serif;
		color: #333;
		font-size: 62.5%;
	}

	body {
		background-color: #ffffff;
		font-size: 14px; font-size: 1.4rem;
	}
	
	header {
        width: 100%;
        background: #F2FBF4 url('images/shadow-top.gif') repeat-x bottom left;
        padding: 20px 0 20px 0;
	}
    
    article {
        width: 100%;
        padding: 25px 0 50px 0;
        overflow: auto;
    }
    
    #body > main { width: 100%; }
    
    .wrapper-inner { width: 932px; margin: 0 auto; }
    
    
	footer {
        width: 100%;    
        padding: 40px 0 75px 0;
        background: #F2FBF4 url('images/shadow-bottom.gif') repeat-x top left;
	}
    
    header nav { width: 100%; clear: both; padding-top: 8px; }
    header nav ul { list-style-type: none;  background-color: #fff; display: inline-block; padding: 10px 24px 8px 0px; }
    header nav ul li { display: inline; list-style-type: none; padding: 0px 16px; }
	
    #header-left {  width: 700px; float: left; padding-top: 14px; }
    #header-right { width: 222px; float: right; padding-right: 8px; }
    #header-right img { float: right; margin-bottom: 19px; }
    #header-right p { font-size: 18px; font-size: 1.8rem; color: #00b089; text-align: right; clear: both; }
    
    .col1of2 { width: 594px; float: left; }
    .col2of2 { width: 302px; float: right; }
    .col1of1 { 
        width: 100%; 
        float: left; 
        clear: both;
        margin-bottom: 20px;
        background: #F2FBF4 /* for ie8 */
    }
    
    .sidebox { 
        background-color: #F2FBF4;
        border: 1px solid #E3F6EE;
        border-radius: 16px;
        -moz-border-radius: 16px;
        -webkit-border-radius: 16px;
        -o-border-radius: 16px;
        padding: 22px;
        margin-bottom: 28px;
    }
    .sidebox p { margin-bottom: 10px; color: #006f80; }
    .sidebox .button { margin-bottom: 0; }
    .sidebox img { display: block; }
    .sidebox img+p { padding-top: 10px; }
    .sidebox img+img { margin-top: 20px; }

    .sidebox2 { 
        background-color: #09a990;
        border: 1px solid #09a990;
        margin-bottom: 30px; padding: 20px;

    }
    .sidebox2 p { margin-bottom: 10px; color: #fff; }
    .sidebox2 .button { margin-bottom: 0; }
    .sidebox2 img { display: block; }
    .sidebox2 img+p { padding-top: 10px; }
    .sidebox2 h5 { color: #fff; font-weight:200; padding-top: 10px; margin-bottom: 4px; display: block; width: 100%; } 

    .sidebox3 { 
        background-color: #FFF5EE;
        border: 1px solid #FEE8D6;
        border-radius: 16px;
        -moz-border-radius: 16px;
        -webkit-border-radius: 16px;
        -o-border-radius: 16px;
        padding: 22px;
        margin-top: 16px; margin-bottom: 28px;
    }

.sidebox7 { 
        background-color: #09a990;
        border: 1px solid #09a990;
        margin-bottom: 30px; padding: 20px; }

    .sidebox7 p { margin-bottom: 10px; color: #fff; }
    .sidebox7 .button { margin-bottom: 0; }
    .sidebox7 img { display: block; }
    .sidebox7 img+p { padding-top: 10px; }
    .sidebox7 h5 { color: #fff; font-weight:200; padding-top: 10px; margin-bottom: 4px; display: block; width: 100%; } 

    .col1of1 .wrapper-inner { padding: 30px 0 45px 0; overflow: auto; }

    
    .col2of2.summary { width: 312px; }
    .summarybox { background: url('images/summary-panel.png') no-repeat top left; height: 240px; margin-top: 23px; padding: 29px 24px; color: #fff; }
    .summarybox p { margin-bottom: 0; }
    .summarybox h3 { color: #c6e3eb; margin-top: 7px; border-top: 1px dashed #fff; padding-top: 7px; display: block; width: 100%; }
   
    .summarybox2 { background-color: #F2FBF4; margin-top: 8px; padding: 28px 24px; color: #fff; border: 1px solid #09a990;
border-radius: 16px; 
        -moz-border-radius: 16px;
        -webkit-border-radius: 16px;
        -o-border-radius: 16px; }
    .summarybox2 p { color: #09a990; margin-bottom: 0; }
    .summarybox2 h3 { color: #006f80; margin-top: 12px; border-top: 1px dashed #09a990; padding-top: 4px; display: block; width: 100%; }

.line {
    border: 1px solid; 
    border-color: #dcefe7;
    margin-bottom: 15px;
    margin-top: 30px;
}
/*------------------------------------------------------------------------------ FIXES */

	
	/* Correct `block` display not defined in IE 6/7/8/9 and Firefox 3. */
	article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary {
		display: block;
	}

	
	/* Correct `inline-block` display not defined in IE 6/7/8/9 and Firefox 3. */
	audio, canvas, video { 
		display: inline-block;
		*display: inline;
		*zoom: 1;
	}

	
/*------------------------------------------------------------------------- BASIC TEXT */

	h1 { font-family: Nunito, reverie, arial, helvetica, sans-serif; font-size: 29px; font-size: 2.9rem; font-weight:normal; padding-bottom: 24px; line-height: 125%; }
    h2 { font-family: Nunito, arial, helvetica, sans-serif; font-weight: 600; font-size: 26px; font-size: 2.6rem; padding-bottom: 8px; }
    h3,h4 { font-family: Nunito, arial, helvetica, sans-serif; font-size: 18px; font-size: 1.8rem; font-weight:800; padding-bottom: 8px; }
h5 { font-family: Nunito, arial, helvetica, sans-serif; font-size: 22px; font-size: 2.2rem; font-weight:300; padding-bottom: 8px; }
    h1  { color: #09a990;}
    h2  { color: #09a990;}
    h3  { color: #006f80;}      
    h4 { color: #006f80; margin-bottom: 0; }
    .col1of1 h2 { font-size: 29px; font-size: 2.9rem; color: #006f80; }
    
    
    p, cite { margin-bottom: 20px; }
	p, li, ul a, cite { font-size: 16px; font-size: 1.6rem;   line-height: 140%; }
	
    cite { display: block; font-style: normal; }

    
    a.button { 
        clear: both; display: inline-block; margin-bottom: 25px; color: #fff !important; padding: 12px 15px; text-align: center; 
        background-color: #0ab08c;
        background:  linear-gradient(#71d4b8, #0ab08c);
        background: -moz-linear-gradient(#71d4b8, #0ab08c);
        background: -webkit-linear-gradient(#71d4b8, #0ab08c);
        background: -o-linear-gradient(#71d4b8, #0ab08c);
        border-radius: 10px;
        -moz-border-radius: 10px;
        -webkit-border-radius: 10px;
        -o-border-radius: 10px;
    }

    a.button-cta { 
        clear: both; display: inline-block; margin-bottom: 25px; color:mediumvioletred !important; padding: 12px 15px; text-align: center; font-weight: bold; width: 564px; 
        background-color: #f3f9eb;
        background:  linear-gradient(#f3f9eb, #e5ebde);
        background: -moz-linear-gradient(#f3f9eb, #e5ebde);
        background: -webkit-linear-gradient(#f3f9eb, #e5ebde);
        background: -o-linear-gradient(#f3f9eb, #e5ebde);
        border-radius: 10px;
        -moz-border-radius: 10px;
        -webkit-border-radius: 10px;
        -o-border-radius: 10px;
    }

    
    p.contact-panel {
        background: url('images/contact-panel.png') no-repeat top left;
        color: #db7d1e; text-align: center; font-weight: bold;
        width: 594px; height: 43px; padding-top: 21px;
    }
    
    
    ul+p.contact-panel { margin-top: 21px; }
    .testimonials  { margin-top: 50px; }
    .testimonials p { margin-bottom: 0; margin-top: 20px; font-style: italic; }
    .testimonials h3+p { margin-top: 0; }
    
    
/*------------------------------------------------------------------------ POSITIONING */


	.floatr { float: right; }
	.floatl { float: left; }
	.clearb { clear: both; }

    .mb0 { margin-bottom: 0; }
    .ml10 { margin-left: 10px; }
    

/*------------------------------------------------------------------------------ LISTS */


	article ul {
		/* Standard bullet list */
		list-style-type: disc;
		padding-bottom: 0px;
	}


	article ul li {
		padding-left: 20px;
		margin-left: 18px;
	}


/*-------------------------------------------------------------------- LINKS & COLOURS */


	a:link, a:visited, a:hover, a:active {
		color: #006f80;
		text-decoration: none;
	}
	a:hover { color: #e04b83; }
    a.active { color: #00b089; }


/*-------------------------------------------------------------------------------- END */