@charset "UTF-8";
@main_color: #bb0303;
@second_color: #669999;
@third_color: #FF9900;
@import (less) "../config.txt";
@grey: #333;
@white: #FFF;
@black: #000;
//public start
html {
	font-size: 62.5%;
}
body {
	background-image: url("/images/div_background_syty_logo.png");
	font-family: Microsoft YaHei;
	font-size: 1.4rem;
	color: @black;
	h3{ //Column title
		line-height: 40px;
	}
	a {
		color: @grey;
		&:focus,&:hover {
			color: @main_color;
			text-decoration: none;
		}
	}
	ul{
		li{
			list-style: none;
		}
	}
	.table th, .table td {
    	vertical-align: middle!important;
    }
	.breadcrumb {
		background-color: transparent;
		padding: 10px 0 0;
		margin-bottom: 0;
		>li {
			&+li {
				&:before {
					content: "›";
					padding: 0 5px;
				}
			}
			>a {
				color: lighten(@grey,40%);
			}
		}
	}
	.guide {
		position: fixed;
		right: 0;
		bottom: 0;
	}
	.summary{
		color: lighten(@grey,40%);
		overflow: hidden;
	}
	.date {
		font-size: 1.2rem;
		line-height: 30px;
		color: lighten(@grey,50%);
	}
	.more {
		float: right;
		font-size: 1.4rem;
		line-height: 40px;
		a {
			color: lighten(@grey,50%);
			&:hover{
				color: fade(@main_color,80%);
			}
		}
	}
	video{
		display: block;
	}	
}
#pager{
	.pager_btn{
		display: inline-block;
		padding: 6px 12px;
		margin: 3px;
		border: thin solid #ddd;
	}
	text-align: center;
	margin: 30px 0;
	input{
		.pager_btn;
		width: 40px;		
	}
	.p_fun_d,.p_no_d,.p_dot{
		.pager_btn;
		cursor: not-allowed;
	}
	.p_no_d{
		color: @white;
		background-color: @main_color;
	}
	.p_fun,.p_no,.p_goto{
		>a{
			.pager_btn;
			&:hover{
				background-color: @main_color;
				color: @white;
			}
		}
	}
}
//public end
//footer start
footer {
	color: lighten(@grey,70%);
	background: url("/images/footer.jpg") no-repeat;
	background-size: cover;
	bottom: 0;
	margin-bottom: 0;
	text-align: center;
	.subfooter{
		padding: 30px 0 10px;
		background-color: fade(darken(@main_color,5%),86%);
		.logo {
			padding: 30px 60px;
		}
		ul{
			padding: 10px 0;
			line-height: 230%;
			overflow: hidden;
			li {
				float: left;
			}
			>li {
				>a {
					color: @white;
					&:hover{
						text-decoration: underline;
					}
				}
			}
		}
	}
	.footer{
		background: fade(@black,86%);
		padding: 10px;
	}
}
.footer_nav{
	background-color: lighten(@grey,76);
	padding: 30px 0 30px;
	h4{
		font-weight: bold;
		&::before {
			content: "";
			position: absolute;
			top: 0;
			display: block;
			width: 10%;
			height: 2px;
			background: fade(@main_color,80%);
			transition: all .3s;
		}
	}
	ul{
		padding-left: 0;
		li{
			float: left;
			a{
				display: block;
				padding: 10px 30px 10px 0;
			}
		}
	}
}
//footer end
//menu start
#menu {
	position: absolute;
	top: 20px;
	.container {
		padding: 0;
	}
}
.navbar-fixed-top .navbar-collapse {
    max-height: 500px;
}
#logo {
	padding: 0;
	height: 100px;
	background-color: fade(@main_color,80%);
}
#nav {
	padding: 0;
}
#mainnav,#subnav {
	margin: 0;
}
#subnav {
	background-color: fade(@second_color,70%);
}
.navbar {
	border-radius: 0;
	border: none;
	min-height: 40px;
}
#snav {
	width: 100%;
	>li {
		>a {
			padding-top: 10px;
			padding-bottom: 10px;
			font-size: 12px;
		}
	}
}
#mnav {
	>li {
		>a {
			padding-top: 20px;
			padding-bottom: 20px;
		}
	}
}
.navbar-default {
	background-color: fade(@main_color,70%);
	.navbar-nav {
		>.open {
			>a {
				color: @white;
				background-color: fade(@main_color,50%);
				&:focus {
					color: @white;
					background-color: fade(@main_color,50%);
				}
				&:hover {
					color: @white;
					background-color: fade(@main_color,50%);
				}
			}
		}
		>li {
			>a {
				color: @white;
				&:hover {
					color: @white;
					background-color: fade(@main_color,50%);
				}
				&:focus {
					color: @white;
					background-color: fade(@main_color,50%);
				}
			}
		}
	}
	.navbar-brand {
		padding: 0;
		color: @white;
		&:hover {
			color: @white;
		}
		&:focus {
			color: @white;
		}
	}
	.navbar-toggle {
		&:hover {
			background-color: fade(@main_color,80%);
		}
		&:focus {
			background-color: fade(@main_color,80%);
		}
		border: none;
		.icon-bar {
			background-color: @white;
		}
	}
}
.dropdown-menu {
	padding: 0;
	background-color: fade(@main_color,70%);
	border: 1px solid fade(@main_color,80%);
	.divider {
		float: none;
		border: none;
		margin: 0;
		background-color: fade(@main_color,30%);
	}
	>li {
		float: none;
		padding: 0;
		>a {
			line-height: 40px;
			color: @white;
			&:hover {
				color: @white;
				background-color: fade(@main_color,50%);
			}
			&:focus {
				color: @white;
				background-color: fade(@main_color,50%);
			}
		}
	}

}
#scrollspy{
	z-index: 999;
	padding: 0 0 0 15px;
	&.left-15{
		margin: 30px 0 0 -15px;
	}
	&.right-15{
		margin: 30px -15px 0 0;
	}
	border-left: 2px solid fade(@second_color,30%);
	h4{
		color: fade(@main_color,90%);
	}
	&.affix{
		top: 0;
	}
	li{			
		a{
			margin: 0 0 0 -23px;
			padding: 8px 0;
			border-radius: 0;
			color: darken(@second_color,8%);
			&:hover{
				color: fade(@main_color,90%);
				background: none;
				span{
					color: fade(@main_color,90%);
				}
			}
			span{
				margin-right: 10px;
				color: fade(@second_color,30%);
			}
		}
		&.active a, &.active a:hover{
			color: fade(@main_color,90%);
			span{
				color: fade(@main_color,90%);
			}
		}
	}
}
#colnav {
	margin: -50px -15px 0 -15px;
	width: 270px;
	background-color: fade(@main_color,70%);
	.navbar-header {
		float: none;
		a {
			font-size: 2.4rem;
			line-height: 50px;
			padding-left: 30px;
		}
	}
	.navbar-nav {
		>li {
			>a {
				&:hover {
					color: @third_color;
					border-left: 5px solid rgba(255,153,0,1);
				}
				&:focus {
					color: @third_color;
					border-left: 5px solid rgba(255,153,0,1);
				}
				color: @grey;
				font-size: 1.5rem;
				background-color: @white;
				border-bottom: 1px dashed #E1E1E1;
			}
			>a.active {
				border-left: 5px solid rgba(255,153,0,1);
			}
		}
	}
}
#cnav {
	padding: 0 0 0 15px;
	float: none;
	>li {
		float: none;
	}
}
//menu end
//public function start
.border-radius(@radius: 5px) {
  -webkit-border-radius: @radius;
     -moz-border-radius: @radius;
          border-radius: @radius;
}
.gallery-item(@color: @white, @height: 333px){
	margin-bottom: 10px;
	min-height: @height;
	background: @color;
	.thumbnail {
		background: no-repeat;
		border: 0;
		border-radius: none;
		padding: 0;		
	}
	.caption{
		padding: 0 15px 10px;
		h4{
			a{
				display: block;
				width: 100%;
			}
		}
	}
}
.news_bottom_line{
	border-bottom: 1px solid #ddd;
}
.h6_icon{
	h6{
		color: lighten(@grey,40%);
		span{
			padding: 0 6px;
			&.glyphicon-time{
				color: @main_color;
			}
			//+span{
			//	margin-left: 20px;
			//}
		}
	}
}
//public function end
//slide show start
.slide-content {
	padding: 0 20px 20px;
	background-color: fade(@second_color,26%);
	&:hover {
		background-color: fade(@main_color,60%);
	}
	a {
		color: @white;
		&:hover{
			color: @white;
		}
		h3{
			line-height: normal;
		}
	}
}
#newsCarousel{
	.thumbnail {
		background: no-repeat;
		border: 0;
		border-radius: none;
		padding: 0;
		margin-bottom: 14px;
	}
	.carousel-indicators {
		bottom: 0;
		li {
			width: 6px;
			height: 6px;
			background-color: fade(@grey,20%);
			border: 1px solid fade(@grey,20%);

		}
		.active {
			width: 8px;
			height: 8px;
    		background-color: fade(@grey,50%);
		}
	}
	.carousel-inner{
		.caption{
			min-height: 100px;
			padding-bottom: 16px;
			.news_bottom_line;
		}
	}
	.carousel-control{
		background-image: none;
	}
}
#myCarousel1{
	margin-top: 20px;	
	.thumbnails {
		padding: 0;
		margin: 0 -15px;
		min-height: 1px;
		overflow: hidden;		
		.special-item{
			.gallery-item(@white);
		}
	}	
	.carousel-control{
		background-image: none;
	}
}
#myCarousel2,#myCarousel3,#myCarousel4{
	.item{
		.gallery-item(lighten(@grey,76));		
	}
}
#myCarousel2{
	.thumbnail{
		position:relative;
		>span{
			position: absolute;
			left: 15px;
			bottom: 15px;
		}
	}
}
#myCarousel3{
	.thumbnail{
		position:relative;
		>span{
			position: absolute;
			top: 50%;
			left: 50%;
			margin: -3.3rem 0 0 -3.3rem;
			padding: 6px;
			font-size: 6rem;
			color: fade(@white,50%);
			background-color: fade(@grey,60%);
			&:hover{
				color: fade(@white,60%);
			}
		}
	}
}
//slide show end
//list page start
.list{
	h3{
		margin-top: 0;
	}
	.media{		
		.news_bottom_line;
		padding-bottom: 15px;
		.media-body{
			.h6_icon;
		}
	}
}
.list_pic{
	.list;
	.media-left{
		padding-right: 15px;
		width: 30%;
		img{
			width: 100%;
		}
	}
}
.list_date{
	.list;
	.square_time {
		float: left;
		display: inline-block;
		padding: 7px;
		margin-right: 8px;
		color: fade(@main_color,70%);
		min-height: 35px;
		.d{
			font-size: 3.4rem;
			font-weight: bold;
			display: block;
			text-align: center;
		}
		.ym{
			white-space:nowrap;
			display: block;
			text-align: center;;
			float: left;
		}
	}
}
.list_gallery{
	h3{
		margin-top: 0;
	}
	>ul{
		overflow: hidden;
		padding: 15px 0;
		margin: 0 -15px;
		.item{		
			.gallery-item(lighten(@grey,76),260px);
			.h6_icon;
		}
	}	
}
.gallery{
	>div{
		overflow: hidden;
		padding: 15px 0;
		margin: 0 -15px;		
		font-size: 0;-webkit-text-size-adjust:none;
		>div{
			float: none;
			display: inline-block;
			vertical-align: top;
			font-size: 1.4rem;
			.item{
				.thumbnail{
					margin-bottom: 10px;
				}
				.gallery-item(lighten(@grey,76),180px);
			}
		}
	}	
}
.increase_height{
	margin-top: 30px;
}
.increase_height4{
	margin-top: 40px;
}
//list page end
//news page start
.post_title {
	margin-top: 14px;
	font-size: 2.5rem;
	font-weight: bold;
	line-height: 3.6rem;
}
article{
	padding: 0!important;
	margin: 20px 0 40px;
	font-size: 1.6rem;
	line-height: 30px;
	p{
		padding: 8px 0;
		img{
			max-width:100%;
			height:auto;
		}
	}
	a{
		color: darken(@second_color,8%);
	}
}
hr.col_list_hr{
	margin-bottom: 0;
}
a.item_block{
	display: block;
	overflow: hidden;
	.square_time {
		float: left;
		display: inline-block;
		padding: 7px;
		margin-right: 8px;
		background-color: fade(@main_color,70%);
		color: #FFF;
		min-height: 35px;
		&:hover{
			background-color: fade(@main_color,50%);
			color: #FFF;
		}
		.d{
			font-size: 2.4rem;
			display: block;
			text-align: center;
		}
		.ym{
			display: block;
			text-align: center;
			float: left;
		}
	}
	.hits{
		float: none;
		display: block;
		width: 100%;
		padding-top: 10px;
		font-size: 1.2rem;
		color: lighten(@grey,40%);
		span{
			padding: 0 6px;
		}
	}
}
//news page end
//search start
.modal-open {
	overflow-y: scroll;
	padding-right: 0 !important;
}
#mySearch{
	.modal-content{
		margin-top: 120px;
		background-color: fade(@second_color,55%);
		h4{
			font-weight: bold;
		}
		.modal-header {
			border-bottom: none;
		}
		.modal-footer {
			background-color: fade(@grey,55%);
			border-top: 1px solid fade(@second_color,55%);
		}
		input[type="text"],select {
			color: @white;
			background-color: fade(@grey,77%);
			border-color: fade(@second_color,66%);
		}
		.btn-success{
			background-color: fade(@grey,77%);
			border-color: fade(@grey,70%);
			&:hover{
				background-color: fade(@grey,66%);
			}
		}
		.btn-danger{
			background-color: fade(@main_color,44%);
			border-color: fade(@main_color,33%);
			&:hover{
				background-color: fade(@main_color,55%);
			}
		}
	}
}
.defmodal{
	.modal-content{
		margin-top: 80px;	
		padding: 0 15px;
		border-radius: 0;
		background-color: fade(@white,94%);
		border: thin solid fade(@main_color,94%);
		h4{
			font-weight: bold;
		}
		.close{
			color: @main_color;
		}
		.modal-header {
			border-bottom: none;
		}
		.media{
			margin-bottom: 15px;
		}
		.btn-danger{
			background-color: fade(@main_color,44%);
			border-color: fade(@main_color,33%);
			&:hover{
				background-color: fade(@main_color,55%);
			}
		}
	}
}
//search end
//other start
hr.title-line {
	margin: 0 auto;
	border: 0;
	border-bottom: thin solid @main_color;
}
.special{
	min-height: 10px;
	padding: 20px 0 50px;
	background: url("/images/special-bg.jpg") repeat-y;
	h3{
		color: @white;
		small{
			color: @white;
		}
		.more{
			float: none;
			a{
				color: @white;
				&:hover{
					color: fade(@main_color,80%);
				}
			}
		}
	}
}
.xxxw_l{
	padding: 24px 15px 0 0;
}
.xxxw_r{
	padding-right: 0;
}
.mtst{
	.media{
		min-height: 121px;
		&:first-child {
			margin-top: 15px;
		}
		.news_bottom_line;
		.media-left{
			padding-right: 15px;
			width: 40%;
			img{
				width: 100%;
			}
		}
	}
}
.list-group-item {
	padding: 13px 0;
	min-height: 103px;
	border-left: none;
	border-right: none;	
	&:first-child {
		border-top: none;
	}
	&:last-child {
		border-bottom-right-radius: 0;
		border-bottom-left-radius: 0;
	}
	.h6_icon;
}
.link{
	padding: 30px 0;
	ul{
		padding-left: 5px;
		li{
			float: left;
			margin: 10px;
			background-color: lighten(@grey,76%);
			a{
				display: block;
				padding: 10px 15px;
			}
			&:hover{
				background-color: fade(@main_color,80%);
				a{
					color: @white;
				}
			}
			&:last-child{
				background-color: fade(@main_color,86%);
				a{
					color: @white;
				}
				&:hover{
					background-color: fade(@main_color,66%);
				}
			}
		}
	}	
}
.airscape{
	.defmodal;
	.modal-content{
		.modal-header {
			border-bottom: 1px solid #e5e5e5;
		}
	}	
	width: 98%;
	img{
		max-width: 100%;
	}
}
.airscape_btn{
			background-color: fade(@main_color,44%);
			border-color: fade(@main_color,33%);
			&:hover{
				background-color: fade(@main_color,55%);
			}
		}
//other end
@media (min-width: 992px) {
	#lightgallery {
		column-count: 3;
		column-gap: 0;
		.col-md-4 {
			width:100%;
			break-inside: avoid;
			box-sizing: border-box;
		}
	}
}
@media screen and (max-width: 768px) {
	html {
		font-size: 68.8%;
	}
	//menu start
	body {
		margin-top: 50px;
	}
	#menu{
		position: fixed;
		top: 0;
	}
	footer{
		span{
			display: block;
			width: 100%;
		}
	}
	#subnav {
		min-height: 0;
	}
	.navbar-default {
		background-color: fade(@main_color,88%);
		.sbutton {
			.icon-bar {
				background-color: fade(@white,30%);
			}
			&:hover {
				background-color: fade(@second_color,20%);
			}
			&:focus {
				background-color: fade(@second_color,30%);
			}
		}
		.navbar-nav {
			margin-right: 0;
			.open {
				.dropdown-menu {
					>li {
						background-color: fade(@main_color,70%);
						>a {
							&:hover {
								color: @white;
								background-color: lighten(@main_color,30%);
							}
							color: @white;
						}
					}
				}
			}
		}
		.navbar-collapse {
			border-color: fade(@main_color,70%);
		}
		.navbar-form {
			border-color: fade(@main_color,70%);
		}
	}
	.sbutton {
		margin-right: 5px;
	}
	.navbar {
		li {
			float: none;
		}
	}
	.navbar-nav {
		.open {
			.dropdown-menu {
				>li {
					>a {
						line-height: 30px;
						background-color: fade(@main_color,30%);
						&:focus {
							color: @white;
							background-color: fade(@main_color,70%);
						}
					}
				}
			}
		}
	}
	#colnav {
		margin: -40px 0 0 0;
		width: 180px;
		background-color: fade(@main_color,30%);
		.navbar-brand {
			height: 40px;
		}
		.navbar-toggle {
			margin: 4px 5px 4px 0;
		}
		.navbar-header {
			a {
				font-size: 2rem;
				line-height: 40px;
				padding-left: 30px;
			}
		}
	}
	#cnav {
		margin: 0;
	}
	//menu end
	//slide show start
	.slide-content {
		padding: 10px;
		h3 {
			margin: 0;
			font-size: 1.4rem;
		}
	}
	#newsCarousel{
		.caption{
			min-height: 160px;
		}
	}
	//slide show end
	//other start
	#scrollspy{
		border-left: 1px solid fade(@second_color,30%);
		&.affix{
			position: static;
		}
		li{
			a{
				margin: 0 0 0 -23px;
			}
		}
	}
	.defmodal{
		.media-left{
			float: left;
		}
		.media-body{
			display: inline;
		}
	}
	.list_pic{
		.media-left{
			padding-right: 15px;
			width: 36%;
		}
	}
	.xxxw_l{
		padding: 15px 0 0;
	}
	.xxxw_r{
		padding: 0;
	}
	//other end
}