
/*------------------------------------------*/
/*	 Preload Animation 					   */
/*------------------------------------------*/

#preloader {
		position: fixed;
		top:0;
		right:0;
		bottom:0;
		left:0;
		z-index:99999; 
		background-color:#fff;
}

#status {
		position:absolute;
		top:50%; 
		left:50%; 
		margin:-60px 0 0 -60px;
		width:120px;
		height:120px;
		background-image:url(../images/loader.gif);
		background-position:center;
		background-repeat:no-repeat;
		background-size:125px 125px;
}  

/*------------------------------------------*/
/*	 HTML & Body
/*------------------------------------------*/

html { 
		/*-webkit-user-select:none;	*/
		width: 100%;
		height:100%;
}


body {
		width: 100%;
		height:100%;
		font: 14px Roboto, Arial, sans-serif;
		color: #4c473b;
		background:#ececec;
		-webkit-font-smoothing: antialiased;
}



hr {clear:both;}

main {
		width: 100%;
		padding: 70px 0px 20px 0px;
		background:#fff;
}



/*------------------------------------------*/
/*	 Headers
/*------------------------------------------*/

h1, h2, h3, h4, h5, h6 {
	margin-top: 0; 
	margin-bottom: 0px;
	font-weight:normal;
	line-height:1.4em;
}

h1 {color:#fff; border-bottom: solid 1px  #e0e0e0;}



h2 {color:#820c2c; border-bottom: solid 1px  #820c2c; margin-bottom: 20px; padding-bottom:5px;}
h3 {color:#820c2c;}
h4 {color:#820c2c;}

h2 {font-size:29px;}
p + h2 {margin-top: 20px; }
h3 + p {margin-top: 20px; }
p + h3 {margin-top: 20px; }
h4 + p {margin-top: 20px; }
p {line-height:1.6em; text-align:justify}


.header {
background:url(../images/nav/h1-bg-2.png) center center no-repeat;
width:100%;
margin-bottom:20px;
}

.header  h1 {border:none; padding:30px 0px 30px 0px;}


.intro {
	padding-top:100px;
	padding-bottom:40px;
	width: 100%;
	overflow: hidden; 
	background:  url('../../app/images/index-02_4.jpg') no-repeat center center;
	-webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
    text-align: center;
    color: #fff;
}


.intro h1 {
	color:#fff;
	width:100%;
	font-size:45px;
	border:0;
	text-shadow: 0px 0px 14px rgba(0, 0, 0, 1);
}

.intro h1 small{color:#fff;}

/*------------------------------------------*/
/*	 Link Setting
/*------------------------------------------*/

a, a:visited, a:focus {
	color:#a8263f;
	text-decoration: none;
	-webkit-transition: all 250ms ease-in-out;
	-moz-transition: all 250ms ease-in-out;
	-o-transition: all 250ms ease-in-out;
	-ms-transition: all 250ms ease-in-out;
	transition: all 250ms ease-in-out;
}

a:hover {
	color: #000;
	text-decoration: underline;
}


/*------------------------------------------*/
/*	 Lists
/*------------------------------------------*/

ul {

margin-left:10px;
  list-style: none;
padding-left:10px;
}


.list-style-circle {
margin:20px 30px 20px 30px;
list-style-type: square;
}

.read-more, .read-more-clicked, .read-more:visited, .read-more-clicked:visited , .read-more:focus, .read-more-clicked:focus {
background:none;
width:100%;
display:block;
border:dotted 2px  #fff;
padding:15px;
color:#fff;
font-weight:bold;
text-align:center;
}

.read-more:hover, .read-more-clicked:hover {
border:dotted 2px  #000;
color:#000;
text-decoration:none;
}



/*------------------------------------------*/
/*	 Navigation Menu    
/*------------------------------------------*/

.navbar {background:#9f0730 url(../images/nav/main-nav-bg.png) left top repeat-x;
	box-shadow:  0px 3px 5px rgba(00, 00, 00, 0.3);
	-webkit-box-shadow: 0px 2px 5px rgba(00, 00, 00, 0.3);
	-moz-box-shadow:    0px 3px 5px rgba(00, 00, 00, 0.3);	
	font-size:14px; 

	min-height: 70px;

}
.navbar-nav>li>a {color: #f7f3f6; min-height: 70px;}
.navbar-nav>li>a:hover {color: #000;background:none;}
.navbar-nav > li > a.active {color: #fff; background:url(../images/nav/main-nav-bg-over.png) left top;}
.navbar-nav > li.active {color: #fff; background:url(../images/nav/main-nav-bg-over.png) left top;}

.navbar-toggle {
	background: none;
	border: none;
}

 .navbar-toggle .icon-bar {background: #fff;}

 
 .nav .open>a, .nav .open>a:hover, .nav .open>a:focus {
background:#820c2c; color:#fff;
}

.dropdown-menu{
background:#9f0730;
border:0;
}

.dropdown-menu > li > a {color: #fff; padding: 10px 20px; }

.dropdown-menu > li > a:hover, .dropdown-menu>.active>a:hover {color: #fff; background:#820c2c;}
.dropdown-menu>.active>a, .dropdown-menu>.active>a:focus {
color: #fff;
text-decoration: none;
background:url(../images/nav/main-nav-bg-over) left top;
font-weight:bold;
}

@media (min-width: 768px) {
	.navbar-nav>li>a {padding-bottom:25px; padding-top:25px;}
	.navbar-nav>li>a.nopad {padding-bottom:20px; padding-top:20px; line-height:1;}
}


/*------------------------------------------*/
/*	 Responsive Menu    
/*------------------------------------------*/


.navbar-toggle .icon-bar {background-color: #fff;}
.navbar-toggle:hover  .icon-bar{background: #000;}

.navbar-toggle {
	position: relative;
	float: right;
	padding: 15px 10px;
	margin-top: 12px;
	margin-right: 15px;
	margin-bottom: 8px;
	background:none;
	border: none;
	background-color: none;
	background-color: transparent;
	background-image: none;
}

.navbar-brand {
	background:url(../images/nav/osn-logo-m.png) no-repeat;
	display:block;
	width:220px;
	height:70px;
}


.navbar-nav>li>a:focus {
	background:none;
}


 .navbar-nav>.active {
	background: url(../images/nav-bg-over.png) left top repeat-x;
}

/*------------------------------------------*/
/*	 Map
/*------------------------------------------*/

.mymap {margin:20px 0px 20px 0px;}

.relat {
position: relative;


}


/*-----------------------------------------------------------------------------------------------------------------------------------------------*/
/*	 Footer
/*-----------------------------------------------------------------------------------------------------------------------------------------------*/

footer {
    margin: 0;
    padding: 20px 0px 20px 0px;
    font-size: 0.8em;
    color: #b0b0b0;
	border-top:#e7e7e7 1px solid;
}

@media only screen and (max-width: 767px){

footer  ul {
	margin:5px 0px 0px 0px;
}

}


/*-----------------------------------------------------------------------------------------------------------------------------------------------*/
/*	 Tables
/*-----------------------------------------------------------------------------------------------------------------------------------------------*/

.table>tbody>tr>td {
	vertical-align: middle;
}

.table>tbody>tr>td:first-child {
	 text-align:right; 
}

.table>tbody>tr>td:last-child {
	 text-align:left;
}

.table>tbody>tr>td:last-child {
	/* text-align:right; */
}

.table>thead>tr>th {
	font-weight:normal;
	color:#fff;
	background:#01787c;
	border-bottom: 2px solid #005457;
}




/*-----------------------------------------------------------------------------------------------------------------------------------------------*/
/*	Responsive Styles
/*-----------------------------------------------------------------------------------------------------------------------------------------------*/

@media (min-width: 992px) {

	h1 { font-size: 44px;}

}


@media only screen and (max-width: 991px) {
	

}

@media only screen and (max-width: 767px){

	h1 { font-size: 30px;}
	.header  h1 {border:none; padding:30px 5px 30px 5px;}
	h2 { font-size: 22px;}
	
	.contact h3 { font-size: 25px;}

	.intro h1 {
    padding:120px 0px 120px 0px;
	color:#fff;
	width:100%;
	font-size:30px;
	border:0;
}
	
	.navbar-nav > li > a:hover, 
	.navbar-nav > li { text-align: center;}
	.navbar-nav > li > a { line-height: 40px; text-align: center; }	
	.navbar-nav>li>a.nopad {line-height:30px;}
	.navbar-nav > li > a:hover,.navbar-nav > li > a.selected-nav {color: #000;}
	.navbar-brand { margin-left:10px;}
	.navbar-nav>.active {background:#000;}
	.contact-logo {margin-bottom:20px;}
	
	.dropdown-menu > li > a {text-align: center; }
	



.research-group-images+.research-group-images {margin-top:15px}
h3 + p {margin-top: 15px; }

}

/*-----------------------------------------------------------------------------------------------------------------------------------------------*/
/* Others
/*-----------------------------------------------------------------------------------------------------------------------------------------------*/


.contact  .member-list {
    margin: 0 0 0 10px;
    padding: 0;
    list-style: none;
}

.contact  .member-list li {
    margin: 10px 0px 10px 0px;
    padding: 0;
}


.img-responsive { width:100%; height:auto; }

.table-dis {
display:table;
}

.table-dis-child {
display: table-cell;
vertical-align: middle;
}

ol, ul {
  margin-top: 0;
  margin-bottom: 10px;
}


/*-----------------------------------------------------------------------------------------------------------------------------------------------*/
/* breadcrumb
/*-----------------------------------------------------------------------------------------------------------------------------------------------*/

.breadcrumb {
  display: none;
  margin-top:45px;
  list-style: none;
  background: transparent;
  border:none;
}

.breadcrumb>.active {
  color: #e5d3e5;
}

.breadcrumb  a {
  color:#f7f3f6;
}

.breadcrumb  a:hover {color: #820c2c;}

@media (min-width: 992px) {
.breadcrumb {
  text-align: right;
}
}

@media (min-width: 768px) {
.breadcrumb {
  display: block;
}
}

/*-----------------------------------------------------------------------------------------------------------------------------------------------*/
/* group-members
/*-----------------------------------------------------------------------------------------------------------------------------------------------*/

.group-members  img { width:100%; height:auto;}
.member {
padding:10px 10px 10px 10px;
}

@media (max-width: 768px) {
.member-face {
  display: none;
}
}

.member img {margin-right:20px;}


/*-----------------------------------------------------------------------------------------------------------------------------------------------*/
/* representive-papers
/*-----------------------------------------------------------------------------------------------------------------------------------------------*/

.representive-papers  > a, .representive-papers  > a:visited {display:block;width:100%; padding:10px; color:#000;}
.representive-papers  > a:nth-child(even) {background:#fafafa;}
.representive-papers  > a:nth-child(odd) {background:#f5f5f5;}
.representive-papers  > a:hover{background:#e1e1e1;}


/*-----------------------------------------------------------------------------------------------------------------------------------------------*/
/* events
/*-----------------------------------------------------------------------------------------------------------------------------------------------*/

.workshop + .workshop {margin-top:20px;}
.workshop .workshop-date {background:#a8263f; color:#fff; padding:10px;}
.workshop .workshop-link { padding:10px;}

.seminar+ .seminar {margin-top:20px;}
.seminar .seminar-date {background:#a8263f; color:#fff; padding:10px;}
.seminar .seminar-speaker { padding:10px; font-weight:bold;}
.seminar .seminar-title { padding:10px;}

.archive-of-seminars a   {
    padding:10px;
}

.archive-of-seminars a > i   {
    font-size:2em;
	margin-right:5px;
}

.archive-of-seminars a + a  {

}

/*-----------------------------------------------------------------------------------------------------------------------------------------------*/
/* projects
/*-----------------------------------------------------------------------------------------------------------------------------------------------*/
.projects a {}
.project-link {}
.project-link td { vertical-align:middle; padding:15px;}
.project-link .logo {width:200px; }
@media only screen and (max-width: 767px){ 
 .project-link .logo{ display:none;}
}

.int-projects > div+div{margin-top:20px;}

/*-----------------------------------------------------------------------------------------------------------------------------------------------*/
/* equipment
/*-----------------------------------------------------------------------------------------------------------------------------------------------*/


.equipment img { margin-right:20px; text-align:left;}
@media only screen and (max-width: 500px){ 
 .equipment img { width:100%; margin: 0px 0px 20px 0px;}
}

/*-----------------------------------------------------------------------------------------------------------------------------------------------*/
/* cooperation
/*-----------------------------------------------------------------------------------------------------------------------------------------------*/


.cooperation a, .cooperation a:visited { margin-bottom:20px; padding:5px; color:#4c473b;}

.publications a  { color:#4c473b; }
.publications a:hover  {color:#a8263f;}


.mypic {
border:solid 1px #e4e4e4;
margin:10px 0px 10px 0px;
}

.mypic:hover {
border:solid 1px #a30932;
}

.pics {
font-size:12px;
}

/*-----------------------------------------------------------------------------------------------------------------------------------------------*/
/* vertical-menu
/*-----------------------------------------------------------------------------------------------------------------------------------------------*/


.vertical-menu {width:100%; font: 14px Roboto, Arial, sans-serif; margin-bottom:20px;}
.vertical-menu > ul {padding:0px; margin:0; list-style-image:none; }
.vertical-menu > ul > li {display:block;margin:0;  text-align:left; border-bottom:1px solid #e0e0e0;}
.vertical-menu > ul > li > a{ display:block; font-weight:normal; padding:7px;}
.vertical-menu > ul > li:hover > a {text-decoration:none; cursor:pointer; background: #ffcccc;}
.vertical-menu > ul > li.active > a {text-decoration:none; background: #820c2c; color:#fff;}

.onsite-menu {color:#000; margin:20px 0px 0px 0px; list-style:none; }
.onsite-menu > li { width:100%; display:block; background:#9f0730; margin:20px 0px 0px 0px;}
.onsite-menu > li > a, .onsite-menu > li > a:visited { color:#fff;  display:block; font-weight:normal; padding:10px;}
.onsite-menu > li > a:hover {cursor:pointer; background: #e52055; text-decoration:none;}

/*-----------------------------------------------------------------------------------------------------------------------------------------------*/
/* blocks
/*-----------------------------------------------------------------------------------------------------------------------------------------------*/

.gray {
background:#f5f5f5;
padding:20px 0px 20px 0px;
border:solid 1px #dbdbdb;
}

.white {
padding:20px 0px 20px 0px;
}

/*-----------------------------------------------------------------------------------------------------------------------------
windows
-----------------------------------------------------------------------------------------------------------------------------*/
.overlay {
  position:absolute;
   top: 0px;
   left: 0px;
  z-index: 9998;
  background:url(../images/overlay.png);
  }

.window { position:fixed; z-index:9999; background:#fff; width:100%; top: 0; left:0; display: none;}
.window.scroll { height:80%; top:10%;}
.window  .h1-panel { background:#820c2c; } 
.window  .h1-panel  h1 { margin:0px auto;  padding:15px 0 15px 0px; color:#f5f5f5; font-size:21px; border:none;} 
.window  .h1-panel  h1 button { border:0; float:right; width:25px; height:25px; padding:0; background:url(../images/cancel.png) no-repeat;} 
.window  .h1-panel  h1  button:hover {  background:url(../images/cancel.png) no-repeat;} 

.window  .wrapScroll { margin:20px auto;  height:78%; overflow: scroll; overflow-y:scroll;overflow-x:hidden;}
.window #adsCount {font-weight:bold;}


.back-win {cursor:pointer;}

.news {
	padding: 15px 0;
	background:#fff;
}

.news .ins {
	border-bottom: 1px #e1e1e1 solid;
    padding: 15px;

}

.links {
	padding: 15px 0;
	background:#c6c6c6;
}


.news .bi {
	font-weight:bold;
	font-style:italic;

}
