/* --- GLOBAL STYLES AND GENERAL CLASSES--- */
.clear { clear:both; height:0; font-size:1px; line-height:0px; }

#article_headlines h3 { margin-top:0px; }
.introText { font-size:16px; }

/* Calculator button (top of header) plus 'add to phone' button */
.fancybox-skin{ padding:15px 15px 25px 15px !important; }

.leftColSearch { width:980px; padding-left:20px; }

.faqicon { width:auto; position:relative; float:left; margin:0px 20px 10px 0px; margin-bottom:10px; }
.faqicon img { width:73px; height:70px; }

/* Disclaimer */
.disclaimer, .disclaimer2 { float:right; width:240px; padding-left:10px; margin-left:15px; border-left:1px dotted #aaa; }
.disclaimer, .disclaimer2 { width:260px; margin-left:10px; border-left:0px; }
.disclaimer_fw { margin-top:20px;  margin-bottom: 30px; }
.disclaimer h4, .disclaimer2 h4 { font-size:12px; padding-bottom:5px; font-weight:bold; margin-top:15px; }
.disclaimer_fw h4 { font-size:13px; padding-bottom:5px; font-weight:bold; margin-top:25px; }
.disclaimer .printpage, .disclaimer_fw .printpage { font-size:12px; width:70px; position:relative; float:right; margin-top:12px; }
.disclaimer p, .disclaimer_fw p { font-size:12px !important; line-height:14px !important; }
.disclaimer2 p { font-size:13px !important; line-height:15px !important; }

/* Form ReCaptcha (used in feedback.php page */
.reCaptcha { position:relative; float:right; margin-bottom:10px; display:inline !important; }
.reCaptcha label { float:none; }
.feedbackRCP { display:none; }

/* Other Main Layout */
.descriptions h2 { margin-bottom:0px; }
.grey { color: #666666; }
.spellingBox, .roundBox { max-width:170px; text-align:left; margin-top:30px; padding:5px 20px; background:#666; color:#eee; }
.spellingBox a:link, .roundBox a:link { color:#ccc; text-decoration:underline; }
.roundBox label { font-size:11px; width:auto; margin-bottom:0; height:12px; }
.roundBox select { font-size:12px; height:auto; margin-bottom:0; margin-top:4px; }
.roundBoxMultiTab { position:relative; top:95px; z-index:5; }

.spellinghighlight { color:#ff0; }
.spellinghighlight a:link { color:#ff0; text-decoration:none; }
.smalltext { font-size:11px; line-height:13px; text-decoration:none; }
.smalltext a, .smalltext a:visited { color:#f0942d; text-decoration:none; }
.smalltext a:hover, .smalltext a:focus { color:#f0942d; text-decoration:underline; }
.justify { font-weight: normal; text-decoration: none; text-align: justify; }

/* block quotes, pull-quotes, full-quotes */
blockquote, .pullquote, .fullquote { background:var(--highlight-bg); border-left: 10px solid; border-color:var(--border-dark); margin: 1.5em 5px; padding: 0.5em 15px; quotes: "\201C""\201D"; }
blockquote:before { color: var(--border-dark); content: open-quote; font: 4em italic Times, serif; line-height: 0.1em; margin-right: 0.25em; vertical-align: -0.4em; }
blockquote p { display: inline; }
.pullquote { float: right; margin-left: 25px; margin-top:8px; width:180px; padding: 1em 15px;  }
#mainContent .pullquote, #mainContent .pullquote p { font-size: 18px; line-height: 20px; }
.fullquote { margin-left: 0px; margin-top:8px; padding: 1em 10px 10px 30px; }
#mainContent .fullquote, #mainContent .fullquote p { font-size: 24px; line-height: 27px; }

hr { color: var(--border-light); height: 1px; padding: 3px 0px 4px 0px; border-style: solid; border-width: 1px 0 0 0; }
hr.home { clear:left; width:83%; }
.divider { clear:both; border-bottom:var(--border-full-med); margin:10px 0 20px 0; }
.white { color:#fff; }

/* form elements CSS */
textarea { FONT-SIZE: 12px; FONT-FAMILY: Arial, Helvetica; BACKGROUND-COLOR: #ffffff; border: 1px solid #999999; line-height:1.5; }

/* From http://www.youtube.com/watch?v=jzvRue8pS-U */
select.styled { opacity:0; }
.selWrap { background:url("/images/select_bg.png") right;   /* image file not present */ height:24px; width:100%; position:relative; border-left:1px solid #bbb; }
.selWrap span { position:absolute; top:4px; left:10px; }

.box { background-color: #f4f4ff; border: 1px solid #dddddd; padding: 5px 5px 5px; margin: 10px 0px 0px 0px; text-align:left; }

.linkbox { background-color: #fff; border: 1px solid #aaa; border-style:dotted; padding: 10px; margin: 5px 0px 0px 0px; text-align:left; font-size:11px; }

.address { width:32%; position:relative; float:right; margin:0px 0px 15px 15px; padding-left:15px; }
.whitebox { border:1px solid #cccccc; padding: 5px 5px 5px 8px; }
.answers { color:#f60; font-weight:bold; }

.bmiLink { width:240px; position: relative; float:right; text-align:right; }

/* Photo borders */
.photobox_left, .iconbox_left { width:auto; position:relative; float:left; margin:0px 20px 10px 0px;  }
.photobox_right, .feedback_icon { width:auto; position:relative; float:right; margin:20px 0px 20px 15px; }
.photobox_main  { width: auto; margin:20px 0px 20px 0px; }
.photobox_right img, .photobox_left img, .photobox_main img { width: 100%; height: auto; }
.photoborder { border:1px solid #ddd; padding:10px; }
.photobox_left a img, .iconbox_left a img, .iconbox_left a svg { -webkit-box-shadow:  0px 0px 2px 2px #ddd; box-shadow:  0px 0px 2px 2px #ddd; }
.photobox_left a:hover img, .iconbox_left a:hover img, .iconbox_left a:hover svg { -webkit-box-shadow:  0px 0px 2px 2px #999; box-shadow:  0px 0px 2px 2px #999; }
#leftCol .iconbox_left .icon { width:75px; height:75px; }
#leftColCalc .iconbox_left .icon { width:90px; height:90px; -webkit-box-shadow:none; box-shadow:none; }
#leftCol .iconbox_left svg { width:70px; padding:10px; }
#leftCol .iconbox_left a { position:relative; color: #bbb; }

/* Lists */
ul.faq-bullets { padding-left:10px; margin-left:15px; margin-top:5px; margin-bottom:15px; }
ul.faq-bullets li { margin-bottom:7px; }
ol.faq-bullets { padding-left:10px; margin-left:15px; margin-top:5px; margin-bottom:5px; }
ol.faq-bullets li { margin-bottom:7px; }

/* Custom ordered lists */
ol.cList { counter-reset:li; padding-left:0 !important; margin:30px 0px !important; }
ol.cList > li { position:relative; margin:0 0 16px 0em; padding:4px 8px; list-style:none; border-top:2px solid #666; border-right:1px solid #ccc; background:var(--highlight-bg); }
ol.cList li { position: relative; font-size:18px; padding: 7px 10px 10px 50px !important; min-height:40px; }
ol.cList li:before { content:counter(li); counter-increment:li; position: absolute; left: 5px; top: 5px; font: bold 50px/1 Sans-Serif; }
ol.cList > li ul { counter-reset:li; list-style-type: square; }
ol.cList > li ul li:before { content:none; }
ol.cList > li ul li { padding: 5px 0 5px 20px !important; min-height:20px; }

/* Video containers */
.video-container { position: relative; padding-bottom: 56.25%; padding-top: 30px; height: 0; overflow: hidden; margin-top:15px; margin-bottom:30px; }
.video-container iframe,  
.video-container object,  
.video-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

/* ==== Mobile Landscape size from 480px up to 767px and Tablet Portrait (Galaxy Tab is 800) ==== */
@media
only screen and (max-width: 767px),
only screen and (max-device-width: 767px),
only screen and (-webkit-min-device-pixel-ratio: 2) and (max-device-width: 767px) {

	#pagetitle, .leftColNews .photo, #headersearchbox, #leftCol .icon { display:none; }
	
	/* Set leaderboard ad to be 5 pixels to the left  and min-height */
	.leaderboardAd { min-height:0 !important; margin-left:-5px; }
	.leaderboardAd .adtester-container::before { margin-left:5px; }
	.mainAd { width:auto; float:none; margin-bottom:30px; margin-top:10px; padding:0; }
	#cookieHeaderLink { top:13px; right:10px; }
	.articlesText { margin-left:60px; margin-right:60px; }
	#pagetitle, #headersearchbox, #leftCol .icon { display:none; }
	#leftColCalc h2 { padding-top:0px; font-weight:500; }
	.disclaimer h4, .disclaimer2 h4, .disclaimer .printpage { font-size:12px; margin-top:20px; }
	#rightCol { margin-top:20px; }
	#rightCol h2 { font-size:17px; font-weight:500; border-top:1px solid #999; margin-top:20px; padding-top:15px; }
	#rightColSocial { width:150px; font-size:10px; }
	
	.smalltext { font-size:10px !important; line-height:13px; text-decoration:none; margin-top:5px; }
	.smalltext p { font-size:10px !important; line-height:13px; text-decoration:none; }

	/* CSS for listings index pages (/finance/, etc) */
	#calculator_listings h2 { font-size:15px; position:relative;}
	#calculator_listings p { display:none; }
	#calculator_listings p.mobile_show { display:block; }
	#calculator_listings .iconbox_left { width:45px;}
	#calculator_listings .iconbox_left svg { width:35px; padding:5px; }
	#calculator_listings .divider { margin-top:0px; margin-bottom:15px; }
	#calculator_listings img { width:45px; height:45px;}
	
	#leftColCalc .iconbox_left, #leftColCalc .iconbox_left .icon  { width:60px; height:60px; }
	.article_thumb { width:75px; }
	.article_thumb img { width:100%; }

	#bmiFormula { display:none; }

	.graph { width:auto; height:187px; }
	.photobox_right, .articlesText .photobox_left { width:auto; float:none; margin:15px 0px 20px 0; }

	form table.box { font-size:11px; }
	form table.box textarea { width:160px; }
	#leftColCalc .address p { font-size:10px !important; }

	#feedbackForm textarea { width:260px; }
	#feedbackForm .spamnotice { display:none; }
	.feedback_icon img { width:100px; height:100px; }

	.boxLeft, .boxRight { width:100%; float:none; }
	.boxRight { margin-top:15px; }
	.boxLeft h4, .boxRight h4 { margin:0 0 8px 0; }
	.substances h4 { margin:4px 15px 10px 0; float:none; }
	.fixed {position: fixed !important;top:0;width: 100%;z-index: 999;}
	
	.roundBoxMultiTab { top:82px; }
	#feedbackForm textarea { width:230px; }

}

/* ==== Mobile Portrait for standard 320px - portrait on an iPhone, but not landscape ==== */
@media
only screen and (max-width: 479px) {

	/* Styles */
	#rightColSocial { display:none; }
	.disclaimer_fw { border-top:none; }
	.roundBoxMultiTab { top:95px; }

	#feedbackForm textarea { width:260px; }
	
	.fixed {position: fixed !important;top:0;width: 100%;z-index: 999;}
	.fancybox-wrap{left:1px !important; width:99% !important;}
	.fancybox-inner{width:99% !important; /*height:365px !important;*/}
	.fancybox-close{top:0 !important;right:0 !important;}
	.fancybox-skin{padding:35px 0 25px 0 !important;}
	.head-sm strong{font-size: 19px;}
	.close-sm {right:7px; top: -30px;}
	
	/* Add margin to the bottom of cookie 'agree' button on cookie pop-up message */
	#cookiescript_accept { margin-bottom:5px !important; }
}