/* CSS Document */

.ig-controls { background-color: #ededed; padding-top: 30px; padding-bottom: 40px }
.infographic .col-sm-7 { padding-bottom: 0 }
.infographic .form-inline .form-group { margin-bottom: 15px; display: block }
.ig-term-options { width: 100% }
.ig-term-spacer { width: 2.5%; float: left; height: 20px }
.ig-img, .ig-img img { width: 100% }
.ig-coverage, .ig-totalcoverage { width: 100% }
.ig-coverage-spacer { width: 6px; float: left; display: inline-block; height: 20px }
.ig-cover { float: left; display: inline-block }
.ig-shortfall { float: left; display: inline-block }
#ig-cover-info { clear: both }
#ig-cover-info-small { display: inline-block; font-size: 12px; text-align: center; width: 100% }
#ig-cover-info, #ig-shortfall-info { display: inline-block; font-size: 14px; text-align: center; width: 100%; margin-top: 8px; line-height: 1.2 }
.infographic .pricegwrap { overflow: auto; padding: 10px 0 15px 0 !important }
.infographic .pricegtxt { width:80%; padding-right:5px; font-size:16px; font-weight: 300; line-height: 1.42857143 }
.infographic .priceg { float:right; width:20% }

.infographic .tooltip {
	opacity: 1;
}
.infographic .tooltip.top {
    padding: 10px 0;
}
.infographic .tooltip-arrow {
	border-top-color: #B2B2B1 !important;
	/*bottom: 0;*/
	margin-left: -10px !important;
	border-width: 10px 10px 0 !important;
	top: auto !important;/* intermittent fix */
}
.infographic .tooltip-inner {
	background-color: #B2B2B1;
	font-weight: 500;
	font-size: 15px;
	line-height: 19px;
	padding: 10px 15px 15px 15px;
	max-width: 220px;
}

/* Font Styles */

.infographic h1 { font-size:38px; margin-bottom:15px }
.infographic h1 span { color:#e30613 }
#ig-vehicle-value { font-size:19px }
#ig-term { font-size:17px }
.infographic .form-control { font-size:19px; padding: 0 0 0 6px }
.ig-coverage .fa { font: normal normal normal 22px/1 FontAwesome !important; vertical-align: text-top }

/* End Font Styles */

/* Button Styles */

.infographic .btn {
    display: inline-block;
    margin: 0;
    font-weight: 400;
    line-height: 1.42857143;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    border: none }
.infographic .btn-ig-term {
    color: #fff !important;
    background-color: #b2b2b1;
    padding: 2px 12px;
    font-size: 25px;
	width: 18%;
	float: left }
.infographic .btn-ig-term:hover, .infographic .btn-ig-term:focus, .infographic .btn-ig-term:active, .infographic .btn-ig-term.active, .open>.dropdown-toggle.infographic.btn-ig-term, .infographic .btn-ig-term-active {
    color: #fff;
    background-color: #00b4ff;
	outline: 0 }
.infographic .btn-ig-cover {
    color: #fff !important;
    background-color: #00b4ff;
    padding: 5px 0 5px 0;
    font-size: 22px;
	width: 100%;
	float: left;
	clear: both;
	cursor: default }
.infographic .btn-ig-cover:hover, .infographic .btn-ig-cover:focus, .infographic .btn-ig-cover:active, .infographic .btn-ig-cover.active, .open>.dropdown-toggle.infographic.btn-ig-cover {
    color: #fff;
    background-color: #00b4ff;
	outline: 0 }
.infographic .btn-ig-shortfall {
    color: #fff !important;
    background-color: #e30613;
    padding: 5px 0 5px 0;
    font-size: 22px;
	width: 100%;
	float: left;
	clear: both;
	cursor: default }
.infographic .btn-ig-shortfall:hover, .infographic .btn-ig-shortfall:focus, .infographic .btn-ig-shortfall:active, .infographic .btn-ig-shortfall.active, .open>.dropdown-toggle.infographic.btn-ig-shortfall {
    color: #fff;
    background-color: #e30613;
	outline: 0 }
.infographic .btn-ig-totalcover {
    color: #00b4ff !important;
    background-color: #fff;
	border: 2px solid #ccc;
    padding: 5px 12px;
    font-size: 22px;
	width: 100%;
	float: left;
	clear: both;
	cursor: default;
	background: url(../images/infographic/caret-left.png) left 8px center no-repeat,  url(../images/infographic/caret-right.png) right 8px center no-repeat }
.infographic .btn-ig-totalcover:hover, .infographic .btn-ig-totalcover:focus, .infographic .btn-ig-totalcover:active, .infographic .btn-ig-totalcover.active, .open>.dropdown-toggle.infographic.btn-ig-totalcover {
    color: #00b4ff;
    background-color: #fff;
	border: 2px solid #ccc;
	outline: 0 }
	
/* End Button Styles */

#withoutcar {
	position:absolute;
	z-index:1;
	width:0;
	overflow:hidden;
}

.v-without1 { display: none }
.v-without2 { display: none }
.v-with-figure { display: none }

/* Media Queries */

/* Tablet Landscape Upwards */
@media only screen and (min-width: 1200px) {
.mob-quotewrap { display: none }
.ig-coverage .fa { display: none }
.infographic .col-sm-7 { padding-left: 40px }
.infographic .priceg { margin-top: 0 !important }
}

/* Tablet Landscape */
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.infographic h1, .infographic .ig-head { font-size:31px }
#ig-vehicle-value { font-size:17px }
#ig-term { font-size:14px }
.infographic .form-control { font-size:17px }
.infographic .pricegtxt { width:70% }
.infographic .priceg { width:30%; margin-top:5px !important }
.mob-quotewrap { display: none }
.ig-coverage .fa { display: none }
.infographic .col-sm-7 { padding-left: 30px }
}

/* Tablet Portrait Upwards */
@media only screen and (min-width: 768px) {
.mob-quotewrap { display: none }
.ig-coverage .fa { display: none }
.infographic .tooltip { display: none !important }
.infographic.slim .tooltip { display: block !important }
}

/* Tablet Portrait */
@media only screen and (min-width: 768px) and (max-width: 991px) {
.infographic .form-inline .form-group { margin-bottom: 10px }
.infographic h1, .infographic .ig-head { font-size:31px; margin-bottom:10px }
#ig-vehicle-value { font-size:15px }
#ig-term { font-size:13px }
.infographic .form-control { font-size:15px }
.infographic .pricegtxt { width:80%; font-size:13px }
.infographic .priceg { width:20% }
.mob-quotewrap { display: none }
.ig-coverage .fa { display: none }
}

/* Mobile Landscape Up To Tablet Portrait */
@media only screen and (min-width: 480px) and (max-width: 991px) {
}


/* Mobile Portrait & Landscape */
@media only screen and (max-width: 767px) {
.infographic .col-sm-5 { padding-bottom: 0 }
.infographic .col-sm-7 { padding-top: 0; padding-bottom: 0 }
.ig-controls { background: none; padding-top: 0 }
.infographic h1, .infographic .ig-head { font-size:25px }
#ig-vehicle-value { font-size:18px }
#ig-term { font-size:15px }
.infographic .form-control { font-size:18px }
.fbreak, .infographic .pricegwrap, .ig-totalcoverage, #ig-cover-info, #ig-cover-info-small, #ig-shortfall-info, .quotewrap { display: none }
.infographic .tooltip-inner { font-size: 15px; line-height: 19px; padding: 12px !important; max-width: 150px }
/*.infographic .pricegtxt { width:90%; font-size:17px }
.infographic .priceg { width:10%; margin-top: 0 }
.infographic .tooltip, .infographic .tooltip.top, .infographic .tooltip-arrow, .infographic .tooltip-inner { display: none !important }*/
}

/* Mobile Portrait */
@media only screen and (max-width: 479px) {
.infographic .tooltip-inner { font-size: 14px; line-height: 18px; padding: 10px !important; max-width: 120px }
.infographic .btn-ig-cover, .infographic .btn-ig-shortfall { font-size: 19px }
/*.infographic .pricegtxt { width:80% }
.infographic .priceg { width:20% }*/
}

/* End Media Queries */