/* Site url: www.computing.co.uk */
/* Site type: Desktop */
/* Author: Puneet Udasi */
/* Last updated: 29/07/2015 */
/* Last updated by: Louise Walker */
/* Update reason: Boxout styling and inline image with caption styles updated */

/* GPT TAGS CSS */
#wrapper {position:relative !important;}
#otdm-gptad-wallpaper {position: fixed !important; width: 100%; text-align: center;}
.closeButton {display: none;}

@import url(http://fonts.googleapis.com/css?family=Ubuntu+Condensed|Roboto+Condensed|Lobster|Codystar);
#quickquestions{
	text-align:center;
	display:none;
	position:fixed;
	z-index:8888;
	right:30px;
	bottom:30px;
	width:350px;
	background:#fff;
	box-shadow: 5px 5px 2px rgba(0, 0, 0, 0.45);
}
#answers{
	padding:15px;
	display:block;
	min-height:70px;
}
.answer{
	width:40%;
	border-radius:5px;
	background:#fff;
	border:1px solid #ccc;
	padding:5px;
	padding-top:20px;
	padding-bottom:20px;
	margin-bottom:15px;
	font-size:20px;
	cursor:pointer;
	background:#ffffff;
}
.answer:hover{
	background:#C6E3FA;
	border:1px solid #004F8D;
	color:#0072BD;
}
.asub{
	font-size:13px;
	display:block;
	color:black;
}
.qqtitle {
	background:#074C83;
	height:15px;
	padding:5px;
}
.qqtitle a {
	font-size:12px;
	font-weight:bold;
	color:#FFF !important;
}
#yes{float:left;}
#no{float:right;}
.tooltip{
	margom-top:-5px;
	font-size:12px;
	margin:auto;
	cursor:pointer;
	display:block;
	z-index:9999999;
}
#tooltip:hover{
	cursor:pointer;
	text-decoration:underline;
}
#ttcontent{
	bottom:25px;
	right:205px;
	font-size:12px;
	width:400px;
	position:fixed;
	z-index:9999;
	padding:12px;
	margin:1em 0 3em;
	color:#000;
	background:#f2f2f2;
	border:2px solid #004F8D;
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
	border-radius:10px;
	display:none;
	box-shadow:5px 5px 2px rgba(0, 0, 0, 0.45);
}
#close{
	float:right;
	cursor:pointer;
	color:#ffffff !important;
	margin-right:10px;
}
.blogs_block h2 {
	padding-top:10px;
	color:#074C83;
	font-family:Georgia, "Times New Roman", Times, serif;
	font-weight:normal;
	font-size:18px
}
.tooltip_link {
	padding:0px 10px 10px 10px;
}
.tooltip_link a {
	color:#074C83;
	font-weight:normal;
	font-size:12px;
}

.make_align_center {
	margin-bottom:10px !important;
}

/* CIO static page */
.contentcio {margin-bottom:10px;}
.contentcio .intro ul,.contentcio .intro ol,.contentcio .text ul,.contentcio .text ol,.meta ul,.meta ol{margin:0 0 22px 22px}
.contentcio .intro li,.contentcio .text li,.meta li{padding:3px 0}.image-link,.image-link:hover{border:0}
.image-info-meta{overflow:hidden; padding-bottom:10px;}
.image-info-meta .image{width:21%;float:left;margin-right:4%}
.image-info-meta .image img{border-radius:50%; height:180px; width:180px;}
/*.image-info-meta .image img{margin-top:5px;width:100%;height:auto;*/
.image-info-meta .info{width:62%;float:left;margin-right:5%}
.image-info-meta .meta{width:8%;float:left;}
.image-info-meta dt{font-family:"Proxima Nova Bold","Helvetica Neue",Arial,Helvetica,sans-serif;font-style:normal;font-weight:bold}

.meta dt{font-family:"Proxima Nova Bold","Helvetica Neue",Arial,Helvetica,sans-serif;font-style:normal;font-weight:bold}
.meta dd{padding-bottom:11px}
.meta dd.link{white-space:nowrap;text-overflow:ellipsis;overflow:hidden;color:#003366}

.image-info-meta-list{border-top:1px solid #f0f0f0;margin-top:10px;padding-top:10px}
.image-info-meta-list li{list-style:none;clear:both;border-bottom:1px solid #f0f0f0;margin-bottom:12px;padding-bottom:12px;overflow:hidden;}
.image-info-meta-list.fat-separated{border-top:5px solid #d4f7ff}
.image-info-meta-list.fat-separated li{border-bottom:5px solid #d4f7ff; background:none !important}

#num {display: table-cell; padding: 10px 15px 10px 0; vertical-align: middle;}
#num .rank {background-color:#1A79C1; border-radius:50%; color:#fff; font-size:14px; display:inline-block; font-weight:bold; height:50px; line-height:50px; text-align:center; vertical-align:middle; width:50px; font-size:24px;}
.interview_link {padding:10px 0px 0px 0px; }
.interview_link a {color:#168BCD !important; font-size:1.2em; font-weight:normal;font-family:Arial, Helvetica, sans-serif;}
.static_page_content img {padding:0 !important}

#menu100cios-mob {display: none; }   /* hide it elsewhere */

@media screen and (min-width: 0px) and (max-width: 499px) {
	.menu100cios {display: none; }  /* hide it on small screens */
}
@media screen and (min-width: 501px) and (max-width: 2024px) {
	.menu100cios{overflow:hidden; margin-bottom:30px; width:80%; margin:0 auto;} /* show it elsewhere */
	.menu100cios ul{padding:0px;text-align:center}
	.menu100cios li{list-style:none;float:left;text-transform:uppercase;border-right:1px solid #003366; background:none !important}
	.menu100cios li:last-child{list-style:none;float:left;text-transform:uppercase;border-right:none; background:none !important}
	.menu100cios li a {font-size:1.2em;padding:8px 10px 7px;letter-spacing:1px}
	.menu100cios li a:hover,.menu100cios li a.active,.menu100cios li a:hover strong,.menu100cios li a.active strong{color:#FF8E01;border:0}
	.menu100cios li a strong{color:#fff;font-family:"Proxima Nova Bold","Helvetica Neue",Arial,Helvetica,sans-serif;font-style:normal;font-weight:bold}	
}
@media screen and (min-width: 501px) and (max-width: 2024px) {
	#menu100cios-mob {display: none; }   /* hide it elsewhere */
}
@media screen and (min-width: 0px) and (max-width: 499px) {
	#menu100cios-mob {display: block; padding-bottom:10px; text-align:center; color:#1390C8;} /* show it on small screens */
	#menu100cios-mob a.nextpage {font-size:1.1em; font-weight:normal; color:#1390C8;}
	#menu100cios-mob a.homepage {font-size:1.1em; font-weight:normal; color:#cccccc;}
	#menu100cios-mob a.previouspage {font-size:1.1em; font-weight:normal; color:#1390C8;}   
}

/* Article content blockquote styles - START */
.block_left blockquote { margin:0 0 20px 0; padding:0; width:100%; border-top:4px solid #003366; border-bottom: 1px solid #999999; }
.block_left blockquote:before { content:"\201C"; font-size:130px; color:#1390c8; opacity:1; position:relative; left:30px; top:70px; line-height:0; vertical-align:top;}
.block_left blockquote p { position:relative; left:40px; top:0px; margin:0px 0px 10px 48px; width:75%; display:inline-block; font-size:20px; line-height:26px; color:#666; font-weight:bold; letter-spacing:0; }
.block_left blockquote p:nth-of-type(1) { margin:20px 0 0 0; }
.block_left blockquote p:last-child { font-size:14px; font-weight:normal; margin:0px 0px 10px 45px; }
/* Article content blockquote styles - END */

/* New inline image styles - figure/figcaption tags and caption display - START */
/* With p tags in code render*/
.block_left p.figure { padding:0; position:relative; width:-webkit-min-content; width:-moz-min-content; width:min-content; display:table !important; }
.block_left p.figure img { margin-bottom:0em; height:auto; }
.block_left p.figure span.figcaption { position:relative; bottom:0; left:0; width:auto; padding:4px 0 0 0; margin:0; color:#777; font-size:0.9em; line-height:1.2em; height:auto; text-align:left; caption-side:bottom; display:table-caption; }
.block_left p.figure.left { float:left; margin:0 15px 5px 0; padding-bottom:4px; }
.block_left p.figure.right { float:right; margin:0 0 5px 15px; padding-bottom:4px; }
.block_left p.figure.center { margin:10px auto; display:block; }
/* New inline image styles - figure/figcaption tags and caption display - END */

/* Boxout styling - START */
.boxout { background-color:#e9e7e7; width:90%; padding:2% 5% 1% 5%; margin-bottom:15px; }
.boxout p { margin-bottom:0.5em; }
.boxout ul { padding:5px 0 10px; }
/* Boxout styling - END */

#otdm-gptad-mpu_three {
	padding-bottom:20px;	
}


/* Survey popup added by Puneet */
#advert-once {
	position: fixed;
	top: 30%;
	left: 35%;
	display: inline-block;
	background-color: #333;
	padding: 1px;
	z-index: 99999;
}
 
#advert-once .advert-button {
	position: absolute;
	left: -10px;
	top: -10px;
	background-color: #ff4500;
/*	border-radius: 5px; */
	cursor: pointer;
	padding:10px;
	color:#FFF;
	font-size:14px;
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
}