/*
 * HTML5 Boilerplate
 *
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 */

/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */

html,
button,
input,
select,
textarea {
    color: #222;
}

body {
    font-size: 1em;
    line-height: 1.4;
}

/*
 * Remove text-shadow in selection highlight: h5bp.com/i
 * These selection rule sets have to be separate.
 * Customize the background color to match your design.
 */

::-moz-selection {
    background: #b3d4fc;
    text-shadow: none;
}

::selection {
    background: #b3d4fc;
    text-shadow: none;
}

/*
 * A better looking default horizontal rule
 */

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}

/*
 * Remove the gap between images and the bottom of their containers: h5bp.com/i/440
 */

img {
    vertical-align: middle;
	max-width: 100%; /* JDL addition: fix responsive images */
}

/*
 * Remove default fieldset styles.
 */

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

/*
 * Allow only vertical resizing of textareas.
 */

textarea {
    resize: vertical;
}

/*
 * Box sizing (JDL addition) - apply a natural box layout model to all elements
 */

*, *:before, *:after {
  -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
 }


/* ==========================================================================
   Chrome Frame prompt
   ========================================================================== */

.chromeframe {
    margin: 0.2em 0;
    background: #ccc;
    color: #000;
    padding: 0.2em 0;
}

/* ==========================================================================
   TC custom styles
   ========================================================================== */

/* --------------------------------------------------------------------------
BASE: TRANSITIONS
----------------------------------------------------------------------------- */

body {
	transition:all .2s linear;
    -o-transition:all .2s linear;
    -moz-transition:all .2s linear;
    -webkit-transition:all .2s linear;
}

/* --------------------------------------------------------------------------
BASE: BUTTONS
----------------------------------------------------------------------------- */

a.button, a:link.button, input#submit {
	display: inline-block; /* fixes IE padding bug in naturally inline elements */
	color: white;
	padding: 0.3em 0.4em;
	text-decoration: none;
	border-bottom: none;
	background: #aaa;
}

/* --------------------------------------------------------------------------
BASE: TYPOGRAPHY
----------------------------------------------------------------------------- */

body {
	font-family: 'Merriweather', Georgia, serif;
	text-rendering: optimizeSpeed;
	font-size: 1em;
	-webkit-text-size-adjust: 100%; /* Stops Mobile Safari from auto-adjusting font-sizes */
	line-height: 1.4;
	color: #333;
	margin: 0 auto;
	min-height: 100%;
	height: 100%;
	position: relative; /* IE fix */
	width: 100%; /* Float & clear fix */
}

h1, h2, h3, h4, h5, h6 {
	font-family: 'Source Sans Pro', sans-serif;
}

h1 {
	color: #389b48;
	text-rendering: optimizeLegibility;
}

h2, h3, h4, h5, h6 {
	color: #384da1;
}

h1 {
	font-size: 2.25em;
	line-height: 1.1;
	letter-spacing: -.01em;
	margin: .5em 0 1em;
}

h2 {
	font-size: 1.75em;
	line-height: 1.2;
	letter-spacing: -.01em;
	margin: 1em 0 .2em;
}

h3 {
	font-size: 1.5em;
	line-height: 1.2;
	margin: 1em 0 0;
}

h4, h5 {
	font-size: 1.2em;
	line-height: 1.4;
}

a, a:link {
	color:#389b48;
	text-decoration: none;
	border-bottom: 1px solid #389b48;
}

ul {
	padding-left: 1em;
}

/* --------------------------------------------------------------------------
BASE: LAYOUT
----------------------------------------------------------------------------- */

.container {
	margin: 0 auto;
	position: relative;
	width: 1200px;
}


/* --- HEADER --- */

header[role="banner"] {
	margin-bottom: .1em;
	font-family: 'Source Sans Pro', sans-serif;
}

#header-content {
	padding: .5em .5em 0;
	background: #384da1;
}

a.home {
	float:left;
	display: block;
	width: 100px;
	height: 126px;
	border: none;
	margin-bottom: 1em;
	background: url(../img/tc-mark-stacked-rev.svg) no-repeat 0 0;
	background-size: 100px 126px;
}

.no-svg a.home { /* Modernizr adds this class to IE, older versions of Android, etc */
  background-image: url(#);
}

a.home span {display: none}

/* MAIN NAV */

#main-nav {
	background: #152254;
	padding: .5em;
}

#main-nav ul {
	list-style-type: none;
	padding: 0;
	margin: 0;
}

.sticky-nav {
	z-index: 9999;
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	border-bottom: 1px solid white;
}

#main-nav li {
	float: left;
	margin: 0 .5em .1em 0;
}

#main-nav li:nth-child(1) {
	color: white;
	background: #86A020;
}

#main-nav li:nth-child(2) {
	clear: both;
}

#main-nav a, #main-nav a:link, #main-nav a:hover{
	border: none;
}

#main-nav a, #main-nav a:link {
	display: inline-block; /* fixes IE padding bug in naturally inline elements */
	color: white;
	font-size: 1.1em;
	line-height: 1;
	padding: .5em .5em .5em;
	text-decoration: none;
}

/* CTAS */

#header-cta {
	text-align: right;
	list-style-type: none;
	padding: 0;
	margin: 0;
}

#header-cta li {
	margin-bottom: .5em;
}

#header-cta a, #header-cta a:link, #header-cta a:hover{
	color: white;
	background: #6A85ED;
	border: none;
}

#header-cta li:first-child { /* Phone */
	font-size: 1.6em;
	line-height: 1.1;
}

/* --- BODY --- */

#content {
	padding: 0 .5em 0 .5em;
	min-height: 400px;
}

#underwriters {
	padding: 0 6%;
}

/* --- FOOTER --- */

footer[role="contentinfo"] {
	font-family: 'Source Sans Pro', sans-serif;
	padding: .25em .5em .5em;
	margin-top: 2.5em;
	background: #ccc;
}

footer[role="contentinfo"] h4{
	margin: 0;
}

footer[role="contentinfo"] a,
footer[role="contentinfo"] a:link{
	color: #666;
	border-color: #666;
}

footer[role="contentinfo"] ul {
	padding-left: 0;
	list-style-type: none;
}


#footer-social a{
	font-size: 1.75em;
	line-height: 1.2;
	font-weight: bold;
}

#footer-nav-class-1 {
	font-weight: bold;
}

footer[role="contentinfo"] #small-print {
	padding-top: 1em;
	color: #666;
	font-size: .7em;
}

.go-top {
	position: fixed;
	bottom: 1.25em;
	right: 0;
	text-decoration: none;
	color: white !important;
	background-color: rgba(0, 0, 0, 0.5);
	font-size: .8em;
	border: none !important;
	padding: .75em;
	display: none;
}

.go-top:hover {
	background-color: rgba(0, 0, 0, 0.6);
}

#zsiq_float {
	border: white 1px solid;
    border-radius: 30px;
}

/* --- SHARED --- */

/* GENERIC */

.stand-first {
	font-size: 1.5em;
	line-height: 1.3;
}

/* CTA */

.generic-cta {
	margin-bottom: 1em;
}

.cta-quote a {
	font-size: 2em;
	background: #86A020 !important;
}

.cta-tel {
	font-size: 1.2em;
	line-height: 1.3;
}

.cta-tel{
	color: #389b48;
}

.cta-tel a{
	font-family: 'Source Sans Pro', sans-serif;
	font-weight: bold
}

.cta-tel span {
	display: block;
	font-size: 2em;
	line-height: 1;
}

/* SECURITY */

.security {
	display: block;
	background: #FFFFCC;
	padding: .5em .5em 0;
	margin-bottom: 1.5em;
	list-style-type: none;
}

.security li {
	padding-bottom: .5em;
}

.security h4{
	font-size: .9em;
	color: #333;
	margin: 0 0 .4em;
}

.security p{
	font-size: .8em;
	margin: 0;
}

/* --------------------------------------------------------------------------
PAGE-SPECIFIC: HOME
----------------------------------------------------------------------------- */

.home-content {
	padding: 0 !important;
}

/* --- HEADLINE --- */

#headline {
	padding-top: .4em;
}

#headline h1 {
	font-size: 1.9em;
	margin-bottom: .5em;
}

#headline h1 span {
	font-size: 1.3em;
	letter-spacing: -.03em;
	line-height: 1;
	color: #384da1;
}

#headline-img {
	width: 100%;
	height: 10em;
	background: black;
}

/* --- LEAD-IN --- */

#lead-in {
	font-size: 1.2em;
	line-height: 1.3;
	color: white;
	padding: .5em;
	margin: 0 0 1.25em;
	background-color: #389b48;
	font-weight: normal;
}

#lead-in p{
	margin: 0;
}

/* --- SELL --- */

#home-interest {
	padding: 1em 0 0 1.75em;
}

#home-interest li {
	margin-bottom: 1.75em;
	list-style-type: none;
}

#home-interest li:last-child {
	margin-bottom: 0;
}

#home-interest>*:before {
	content: "";
	display: block;
	background: #389b48;
	width: 1.5em;
	height: 1.5em;
	border-radius: 4.5em;
	margin: -1.35em -1.75em;
}

/* --- CTA --- */

#test-us {
	font-size: 1.2em;
	line-height: 1.3;
	margin-bottom: .5em;
}

#renewal-not-due {
	color: #666;
	font-style: italic;
	margin-top: 0;
}

/* --------------------------------------------------------------------------
PAGE-SPECIFIC: QUOTE
----------------------------------------------------------------------------- */

#cta-assurance {
	float: right;
}
#cta-assurance {
	font-family: 'Source Sans Pro', sans-serif;
	font-size: 1.1em; /* Compensate for small font */
	background: #384da1;
	padding: .5em;
	margin-bottom: 1em;
}

#cta-assurance h2 {
	margin-top: 0;
}

#cta-assurance h2, #cta-assurance li{
	color: white;
}

#cta-assurance ul {
	list-style-type: none;
	padding: 0;
}

#cta-assurance ul li:before {
	content: "\2713 \00a0";
	color: #6A85ED;
	font-weight: bold;
}

#cta-assurance .read-more {
	font-size: 1.2em;
	line-height: 1.2;
	background: #6A85ED;
}

/* --------------------------------------------------------------------------
PAGE-SPECIFIC: QUOTE FORM
----------------------------------------------------------------------------- */

.quoteForm .hide {
	display: none;
}

.quoteForm .errors {
    display: none;
}

.quoteForm input.error {
	border: 1px dotted #FF0000;
}

.quoteForm label.error {
	display: none;
}

/*
 * ROB - TEMP STYLE FOR FORM
 */
.quoteForm {
	margin-bottom: 30px;
}
.quoteForm label {
	display: block;
	margin: 10px 0;
}
.quoteForm label .inline {
    display: inline !important;
}
.quoteForm .inner_inline-block label, .quoteForm .inner_inline-block input {
	display: inline-block !important;
	margin: 5px 10px;
}
.quoteForm input:not([type='radio']):not([type="checkbox"]), .quoteForm select {
	display: block;
}
.quoteForm fieldset {
	border: 1px dashed #152254;
	margin: 15px;
	padding: 15px;
}
.quoteForm fieldset legend h4 {
    margin: 0 10px;
}
.quoteForm button[type="submit"] {
    background: #86A020;
    color: white;
    font-size: 1.1em;
    line-height: 1;
    padding: .5em;
    margin: 15px 0;
    min-width: 200px;
    max-width: 100%;
    border: 0;
}
.quoteForm .full-width {
    width: 100%;
}
@media only screen and (max-width: 450px) {
	.quoteForm button[type="submit"] {
		width: 100%;
	}
}

/*
 * ROB - END TEMP STYLE FOR FORM
 */

/* --------------------------------------------------------------------------
PAGE-SPECIFIC: ABOUT
----------------------------------------------------------------------------- */

#usp-list, #about-service ul {
	list-style-type: none;
	padding: 0;
}

#usp-list, #about-service {
	margin-bottom: 2em;
}

#usp-list li h3:before {
	content: "\2713 \00a0";
	color: #389b48;
	font-weight: bold;
}

#about-service {
	padding: .5em;
	background: #333;
}

#about-service h2 {
	margin-top: 0;
}

#about-service h3, #about-service li strong {
	color: #86A020;
}

#about-service h2, #about-service li {
	color: white;
}

/* --------------------------------------------------------------------------
PAGE-SPECIFIC: CONTACT
----------------------------------------------------------------------------- */



/* --------------------------------------------------------------------------
PAGE-SPECIFIC: PRIVACY
----------------------------------------------------------------------------- */

table.cookies {
	width: 100%;
}
table.cookies th {
	text-align: left;
}

table.cookies th, table.cookies td {
	vertical-align: top;
    padding: 10px 10px 10px 0;
    border-bottom: solid 1px #bfc1c3;
}



/* ==========================================================================
   Helper classes
   ========================================================================== */

/*
 * Image replacement
 */

.ir {
    background-color: transparent;
    border: 0;
    overflow: hidden;
    /* IE 6/7 fallback */
    *text-indent: -9999px;
}

.ir:before {
    content: "";
    display: block;
    width: 0;
    height: 150%;
}

/*
 * Hide from both screenreaders and browsers: h5bp.com/u
 */

.hidden {
    display: none !important;
    visibility: hidden;
}

/*
 * Hide only visually, but have it available for screenreaders: h5bp.com/v
 */

.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

/*
 * Extends the .visuallyhidden class to allow the element to be focusable
 * when navigated to via the keyboard: h5bp.com/p
 */

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
}

/*
 * Hide visually and from screenreaders, but maintain layout
 */

.invisible {
    visibility: hidden;
}

/*
 * Clearfix: contain floats
 *
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    `contenteditable` attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that receive the `clearfix` class.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */

.clearfix:before,
.clearfix:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.clearfix:after {
    clear: both;
}

/*
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */

.clearfix {
    *zoom: 1;
}

/* ==========================================================================
   EXAMPLE Media Queries for Responsive Design.
   These examples override the primary ('mobile first') styles.
   Modify as content requires.
   ========================================================================== */

@media only screen and (max-width: 1200px) {
	.container {
		width: auto;
	}
}

@media only screen and (min-width: 450px) {

	#header-content {
		padding-top: 1em;
	}

	a.home {
		width: 160px;
		height: 85px;
		background: url(../img/tc-mark-linear-rev.svg) no-repeat 0 0;
		background-size: 160px 85px;
	}

}

@media only screen and (min-width: 600px) {

body {
	text-rendering: optimizeLegibility;
	line-height: 1.45;
	margin: 0 auto !important;
}

a, a:link {
	-webkit-transition: .2s; -moz-transition: .2s; transition: .2s;
}

#header-content, #main-nav, #content, footer[role="contentinfo"] {
	padding-left: 1.5em;
	padding-right: 1.55em;
}

#content {
	padding-right: 8em;
}

@media only screen and (min-width: 750px) {

	/*		Actual grid size: 1160px
			Columns: 50px
			Gutters: 40px
			(Even numbered coloumns 'true')

			Formula to calculate fluid grid: target � context x 100 = result

	Cols	Px

	1		10
	2		60

	3		110
	4		160

	5		210
	6		260

	7		310
	8		360

	9		410
	10		460

	11		510
	12		560

	13		610
	14		660

	15		710
	16		760

	17		810
	18		860

	19		910
	20		960

	21		1010
	22		1060

	23		1110
	24		1160 */

	body {
		width: 100% /* Float & clear fix */;
	}

	#header-content, #main-nav, #content, footer[role="contentinfo"] {
		padding-left: 6% !important;
		padding-right: 6% !important;
	}

	#main-nav li:nth-child(2) {
		clear: none;
	}

	.footer-nav {
		width: 33.33%;
		display: inline-block;
		float: left;
	}

	h1 {
		font-size: 3em;
	}

	h2 {
		font-size: 2.25em;
	}

	h3 {
		font-size: 1.75em;
	}


	/* --------------------------------------------------------------------------
	PAGE-SPECIFIC: HOME
	----------------------------------------------------------------------------- */

	#headline h1 {
		font-size: 2.25em;
		margin-bottom: 1em;
	}

	#headline h1 span {
		font-size: 1.5em;
	}

	#lead-in {
		font-size: 1.5em;
		margin-left: -200px;
		padding: .5em 10% .5em 200px;
	}

	#home-interest, #cta-assurance {
		width: 48.27%;
	}
	#home-interest, #home-sell #cta-assurance {
		float: left;
	}
}

	#home-interest {
		margin-right: 3.44%;
	}

	#cta-assurance h2 {
		font-size: 1.75em;
	}

}



@media print,
       (-o-min-device-pixel-ratio: 5/4),
       (-webkit-min-device-pixel-ratio: 1.25),
       (min-resolution: 120dpi) {
    /* Style adjustments for high resolution devices */
}

/* ==========================================================================
   Print styles.
   Inlined to avoid required HTTP connection: h5bp.com/r
   ========================================================================== */

@media print {
    * {
        background: transparent !important;
        color: #000 !important; /* Black prints faster: h5bp.com/s */
        box-shadow: none !important;
        text-shadow: none !important;
    }

    a,
    a:visited {
        text-decoration: underline;
    }

    a[href]:after {
        content: " (" attr(href) ")";
    }

    abbr[title]:after {
        content: " (" attr(title) ")";
    }

    /*
     * Don't show links for images, or javascript/internal links
     */

    .ir a:after,
    a[href^="javascript:"]:after,
    a[href^="#"]:after {
        content: "";
    }

    pre,
    blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }

    thead {
        display: table-header-group; /* h5bp.com/t */
    }

    tr,
    img {
        page-break-inside: avoid;
    }

    img {
        max-width: 100% !important;
    }

    @page {
        margin: 0.5cm;
    }

    p,
    h2,
    h3 {
        orphans: 3;
        widows: 3;
    }

    h2,
    h3 {
        page-break-after: avoid;
    }
}