@charset "utf-8";
/* CSS Document */
.clear { clear:both; }
#clear { clear:both; }
h4 {margin:0; padding:0;}
*
{  box-sizing: border-box; }

body { font-family: 'Philosopher', sans-serif, 'Arial Unicode MS'; background-color: #f1f4f9; margin:0;	padding:0; font-size: 1vw; color:#FFF;}

header { width:100%; float:left;  height:auto;   background:#006699; position:fixed;  -webkit-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.8);
-moz-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.8); box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.8); z-index:400;  }
.top { width:80%; margin:2% auto; float:left;}
.top h1 { text-align:center; padding:0 0 10px 0; margin:0;  }
.top h3 { text-align:center; margin:0;}
.logo { float:left; margin:0; }
.logo img { width:80%; margin:5px 0 0 0; }

#banner {
  width: 100%; height:auto; -webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.8);
-moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.8); box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.8);
}
#banner img { width:100%; height:auto;}

.pictxt { text-align:center; color:#333;}
.pictext img { float:left;}

#wrapper { width:80%; margin:0 auto;}
.left {width:18%; margin-right:2%; margin-top:4%; padding:1%; float:left; height:auto; background:#FFF; 
-webkit-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.5); -moz-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.5);  box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.5);}
.left h3{padding:5px !important; margin: 2%; text-align:center;  height:auto; background-color:#02203c;  }
.left li { list-style:none; border-bottom:1px dotted #000;  margin: 5%; padding-bottom:5px; }
.left li a { text-decoration:none; color:#333; font-weight:bold; }
.left li a:hover { text-decoration:none; color:#d25e39;}
.left .ig { width:60%; height:auto; border:1px solid red;}




#middle {width:60%;  float:left; height:auto; margin-top:4%; padding:2%; background:#FFF; color:#333; text-align:justify; line-height:1.5vw;
-webkit-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.5); -moz-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.5);  box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.5);}
#middle h2 {padding:10px !important; text-align:left; color:#fff; height:auto; background-color:#02203c;  }
#middle .scroller {width:100%; margin:0 auto; background-color:#02203c; color:#fff; text-align:justify;}
#middle .scroller a {color:#fff; text-decoration:none; font-weight:bold;}

.rslides {
  margin: 0 auto 40px;
  }

#slider2,
#slider3 {
  box-shadow: none;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  margin: 0 auto;
  }
.rslides {
  position: relative;
  list-style: none;
  overflow: hidden;
  width: 100%;
  padding: 0;
  margin: 0; -webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.8);
-moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.8); box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.8); border:1px solid #333;
  }

.rslides li {
  -webkit-backface-visibility: hidden;
  position: absolute;
  display: none;
  width: 100%;
  left: 0;
  top: 0;
  }

.rslides li:first-child {
  position: relative;
  display: block;
  float: left;
  }

.rslides img {
  display: block;
  height: auto;
  float: left;
  width: 100%;
  border: 0;
  }


.right {width:18%; margin-left:2%; margin-top:4%; padding:1%; float:left; height:auto; background:#FFF; color:#333;
-webkit-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.5); -moz-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.5);  box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.5);}
.right h3{padding:5px !important; margin: 2%; text-align:center;  height:auto; background-color:#02203c; color:#FFF;  }
.right li { list-style:none; border-bottom:1px dotted #000;  margin: 5%; padding-bottom:5px; }
.right li a { text-decoration:none; color:#333; font-weight:bold; }
.right li a:hover { text-decoration:none; color:#d25e39;}

#footer { width:100%; color:#fff; height:auto; text-align:center; background-color:#02203c; position: relative; margin-top:3%; }
.tabs {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  border:1px dotted #000;
}

.tabs label {
  -webkit-box-ordinal-group: 2;
  -webkit-order: 1;
  -ms-flex-order: 1;
  order: 1;
  display: block;
  padding: 0.5rem 2rem;
  margin-right: 0.2rem;
  cursor: pointer;
  background: #0361ab;
  font-weight: bold;
  -webkit-transition: background ease 0.2s;
  transition: background ease 0.2s;
  border:1px #000 solid;
  color:#FFF;
}
.tabs label span {
	background-color:#000; padding:0 5px 0 5px; border:0 solid #000; -moz-border-radius: 10px;
-webkit-border-radius: 10px; border-radius: 10px; -khtml-border-radius: 10px;}

.tabs .tab {
  -webkit-box-ordinal-group: 100;
  -webkit-order: 99;
  -ms-flex-order: 99;
  order: 99;
  -webkit-box-flex: 1;
  -webkit-flex-grow: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  width: 100%;
  display: none;
  padding: 1rem;
  color:#000;
  text-align:justify;
}

.tabs input[type="radio"] {
  position: absolute;
  opacity: 0;
}

.tabs input[type="radio"]:checked + label { background: #930; }

.tabs input[type="radio"]:checked + label + .tab { display: block; }
 @media (max-width: 45em) {

.tabs .tab,  .tabs label {
  -webkit-box-ordinal-group: NaN;
  -webkit-order: initial;
  -ms-flex-order: initial;
  order: initial;
}

.tabs label {
  width: 100%;
  margin-right: 0;
  margin-top: 0.2rem;
}
}