/* RESET */

body {
	margin: 0;
	padding: 0;
	font-size: 65%;
	font-family: Newsfont, Arial, Verdana, 'Helvetica Neue', Helvetica;
}

form, ul {
	margin: 0;
	padding: 0;
}
h1,h2, h3 { margin: 0px; margin-bottom: 10px; }
h2 { font-size: 19px; }
a { color: black; text-decoration: none; }
li { list-style-type: none; }

/* UNIVERSAL CLASSES */

.left {
	float: left;
}

.right {
	float: right;
}

.container {
	max-width: 950px;
	margin: 0 auto;
	overflow: hidden;
	padding: 0 20px;
}

.highlight {
	color: black !important;
	border-bottom: 1px dotted black !important;
	text-decoration: none !important;	
}

.highlight:hover {
	color: #C00000 !important;
}

.highlight2 {
	color: #C00000 !important;
	border-bottom: 1px dotted black !important;
	text-decoration: none !important;	
}

.highlight2:hover {
	color: #008000 !important;
}

.highlight3 {
	color: #C00000 !important;
}

.highlight3:hover {
	color: #008000 !important;
}



/* SPECIFIC STYLING */

.topbar {
	background-color: black;
	height: 35px;
	color: #ffffff;
	font-size: 14px;
	line-height: 32px;
}


.topbar i {
	position: absolute;
	left: 0px;
	top: 6px;
}

.topbar span { 
	text-indent: 27px;
	position: relative;
	display: block;
	float: left;	
}

.topbar span:first-of-type {
	margin-right: 8px;
}

.topbar i.sport {
	background: #000 url('ico_sport.gif') no-repeat 0 0;
	width: 21px;
	height: 20px;
	display: inline-block;
}

.topbar i.traffic {
	background: #000 url('ico_traffic.gif') no-repeat 0 0;
	width: 21px;
	height: 20px;	
	display: inline-block;
}

.topbar a { 
	color: #fff; 
	-webkit-transition: .2s color;
	-moz-transition: .2s color;
	-ms-transition: .2s color;
	-o-transition: .2s color;
	transition: .2s color;
	margin-left: 8px;
}

.topbar a:hover { 
	color: #2fccff;
}

.header {
	height: 151px;
	background: #f4f4f4 url('header_bg.jpg') repeat-x 0 0;
}

.header .container {
	height: 151px;
}

.header .logo {
	margin: auto auto;
	width: 290px;
	height: 87px;
	display: block;
	padding-top: 25px;
	position: relative;
}

.header .logo .logo-text {
	position: absolute;
	bottom: 0px;
	color: #FFF;
	text-align: center;
	width: 287px;
	left: 2px;
	height: 28px;
	/* background-color: #F00; */
	font-family: Arial;
	font-size: 14px;
	line-height: 35px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	padding: 0 0px;
}

.menu {

}

.menu .container {
	text-align: center;
	border-bottom: 1px solid #EAEAEA;

}

.menu .container ul {
	text-align: center;
	display: inline-block;

	margin-top: 3px;
	margin-bottom: -4px;
}
.menu .container li {
	float: left;	
	font-size: 15px;
	margin: 0 6px;
}
.menu .container li a {
	position: relative;
	padding: 0px;
	line-height: 32px;
	display: block;
	-webkit-transition: .2s all;
	-moz-transition: .2s all;
	-ms-transition: .2s all;
	-o-transition: .2s all;
	transition: .2s all;
	border-bottom: 1px solid transparent;
	z-index: 3;
	cursor: pointer;
}
.menu .container li a:hover {
	border-bottom: 1px solid #000;
}

.article {
	font-size: 14px;

}

.article .container {
	padding-top: 20px;
}

.article .left {
	width: 70%;
	padding-right: 5%;
}

.article .right { 
	width: 25%;
}

.article .left .img-container {
	width: 100%;	
	margin-bottom: 10px;
	overflow: hidden;
	padding-bottom: 1px;
}

.article .left .img-container .source {
	float: right;
	clear: both;
}

.article .left .img-container img {
	width: 100%;
}

.article .left p {
	line-height: 23px;
	text-align: justify;
	margin: 0px;
	margin-bottom: 10px;
	color: #3F3F3F;
}

.article .left ul {
	margin-bottom: 10px;
}

.article .left  br {
	margin-bottom: 2px;
	display: block;
	height: 10px;
	width: 100px;
	content: '';
}

.article .left a {
	color: #FF2F7E;
	text-decoration: underline;
}

.article .left li {
	list-style-type: square;
	margin-left: 15px;
	line-height: 23px;
}

.article .left .text-box {
	background: #F2F2F2;
	padding: 30px;
	width: 40%;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	float: right;
	display: block;
	margin-left: 20px;
	margin-bottom: 10px;
	color: #565656;
	font-weight: bold;
	line-height: 23px;
	position: relative;
}

.article .left .text-box:after {
	content: '”';
	font-family: Georgia, "Times New Roman", Times, serif;
	position: absolute;
	bottom: 0px;
	right: 14px;
	font-size: 97px;
	opacity: 0.2;
}

.article .left .img-box {
	width: 100%;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	float: right;
	display: block;
	margin-left: 30px;
	margin-bottom: 10px;
	font-style: italic;
	line-height: 23px;
	overflow: hidden;
}

.article .left .img-box a > span {
	width: 19%;
	display: block;
	float: left;
	margin-right: 5.3%;
	padding: 1%;
	background-color: #C00000;
	border-radius: 4px;
}

.article .left .img-box a > span:nth-of-type(4n) {
	margin-right: 0px;
}

.article .left .img-box a > span img {
	width: 100%;
	margin-bottom: 0px;
}

.article .left .img-box a > span > span {
	background-color: #000000;
	display: block;
	text-align: center;
	color: #FFF;
	margin-top: -6px;
}

.article .left p.quote {
	padding: 37px;
	text-align: justify;
	font-style: italic;
	position: relative;
	z-index: 2;
	line-height: 23px;
	margin-bottom: 10px;
	background: transparent url(quote_open.jpg) no-repeat left top;
}

.article .left p.quote:after {
	content: '';
	width: 98px;
	height: 72px;
	z-index: -1;
	position: absolute;
	bottom: 0;
	right: 0;
	background: transparent url(quote_close.jpg) no-repeat right bottom;
}

.article .left span.button {
	color: #C00000;
	text-decoration: underline;
	text-transform: uppercase;
	margin-bottom: 10px;
	display: inline-block;
}

.article .left p.important {
	font-style: italic;
}

/* Right column*/

.article .right h3 {
	border-bottom: 1px solid #E4E4E4;
	padding-bottom: 10px;
	margin-bottom: 5px;
}

.article .right p {
	text-align: justify;
	line-height: 21px;
}
.article .right li {
	margin-bottom: 10px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.article .right li span {
	font-size: 11px;
	display: block;
}

.article .right a:hover {
	color: #FF2F7E;
	text-decoration: underline;
}
.article .right img {
	float: left;
	width: 82px;
	display: inline-block;
	margin-right: 10px;
}

/* Social media */

.socialmedia {
	padding: 10px 0;	
}

hr {
	border: none;
	border-bottom: 1px solid #CACACA;
	height: 1px;
	font-size: 1px;
	margin-bottom: 10px;
	margin-top: 15px;
}

.socialmedia .top {
	font-size: 12px;
	font-family: helvetica, arial, 'lucida grande', sans-serif;
	font-weight: bold;
	color: #3B5998!important;
	margin-bottom: 20px;
	overflow: hidden;
}

.socialmedia .top .left {
	font-size: 12px;
}

.socialmedia .top .right {
	font-size: 14px;
	text-align: right;
}

.socialmedia .comment {
	overflow: hidden;
	padding: 20px 0 20px;
	border-bottom: 1px solid #cacaca;
	width: 100%;
}

.socialmedia .comment.indent {
	width: 87%;
	float: right;
	clear: both;
}


.socialmedia .comment .profile-image {
	width: 10%;
	float: left;
	margin-right: 3%;
}

.socialmedia .comment .profile-image img {
	width: 100%;
}

.socialmedia .comment .content {
	float: left;
	width: 87%;
}

.socialmedia .comment .content .name {
	font-size: 12px;
	font-family: helvetica, arial, 'lucida grande', sans-serif;
	font-weight: bold;
	color: #3B5998!important;
	line-height: 16.07px;
}

.socialmedia .comment .content .message {
	color: #1A1A1A;
	line-height: 14px;
	font-size: 11px;
	font-family: Tahoma;
	margin-bottom: 5px;
}

.socialmedia .comment .content .info {
	color: #1A1A1A;
	line-height: 14px;
	font-size: 11px;
	font-family: Tahoma;
}

.socialmedia .comment .content .info .reply {
	color: #3B5998!important;
	margin-right: 5px;
}

.socialmedia .comment .content .info .likes {
	margin: 0 2px 0 5px;
	color: #3B5998!important;
}
.socialmedia .comment .content .info .time {
	color: #808080;
	border-bottom: 1px dotted #808080;
}

.socialmedia .bottom {
	font-size: 11px;
  font-family: helvetica, arial, 'lucida grande', sans-serif;
  font-weight: normal;
  color: #3B5998!important;
  margin-top: 10px;
  line-height: 18px;
}

.socialmedia .bottom img {
  float: left;
  margin-right: 4px;
}

/* Promotion */

.promotion {
	margin: 15px 0;
	padding: 15px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	border: 1px solid #324A7E;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	overflow: hidden;
}

.promotion .title {
	background-color: #324A7E;
	color: #FFF;
	margin: -15px -15px 15px;
	padding: 15px;
}

.promotion .left .imgbox {
	width: 133px;
	display: block;
	float: left;

}

.promotion .left {
	width: 50%;
	margin: none;
	padding: 0;
}

.promotion .right {
	width: 50%;
	font-size: 17px;
	text-align: center;
}

.promotion .right .button {
	background-color: #C00000;
	color: #FFF;
	text-decoration: none;
	padding: 10px 5px;
	border-radius: 5px;
	margin-top: 11px;
	display: block;
}

.promotion .right .button:hover {
	background-color: #404040;
	color: white;
	text-decoration: none;
}

.promotion .left .imgbox img {
	margin-bottom: 0px;
}

.promotion .left .imgbox > span {
	background-color: #252525;
	display: block;
	text-align: center;
	color: #FFF;
	margin-top: -6px;
}

/* Footer */

.footer {
	padding: 10px;
	font-size: 12px;
	background-color: #404040;
	color: white;
}


/* MOBILE */

@media (max-width: 800px) {
	
	.topbar .right {
		display: none;
	}
	
	.article .container > .left {
		width: 100%;
	}
	.article .container > .right {
		width: 100%;
	}
	.menu .container li {
		font-size: 13px;
	}
	.menu .container li a {
		line-height: 23px;
	}
	h1 {
		font-size: 22px;
	}
	h2 {
		font-size: 15px;
	}
	.article {
		font-size: 13px;
		line-height: 20px;
	}
	
	.article .left .text-box {
		padding: 13px;
		line-height: 19px;
		font-size: 12px;
	}
	
}

@media (max-width: 400px) {

	.promotion .title {
		font-size: 12px;
		padding: 10px;
	}
	
	.promotion .right {
		font-size: 14px;
	}
	
	.promotion .left .imgbox {
		width: auto;
		max-width: 133px;
	}
	.promotion .left .imgbox img {
		width: 100%;
	}
	.promotion .left {
		width: 45%;
	}
	
	.promotion .right .button {
		font-size: 14px;
	}
	
	.article .left .img-box > span > span {
		font-size: 10px;
	}
	
	.article .left .text-box {
		width: 100%;
	}
	
	.article .left p.quote {
		padding: 11px;
	}
	
}