@import 'bodystyle.css' screen;


@font-face {font-family: "Noteworthy Light";
  src: url("/font-face/016f50054d487d421dc18257a191a3ad.eot"); /* IE9*/
  src: url("/font-face/016f50054d487d421dc18257a191a3ad.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */
  url("/font-face/016f50054d487d421dc18257a191a3ad.woff2") format("woff2"), /* chrome、firefox */
  url("/font-face/016f50054d487d421dc18257a191a3ad.woff") format("woff"), /* chrome、firefox */
  url("/font-face/016f50054d487d421dc18257a191a3ad.ttf") format("truetype"), /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
  url("/font-face/016f50054d487d421dc18257a191a3ad.svg#Noteworthy Light") format("svg"); /* iOS 4.1- */
}

a:link, a:visited {text-decoration: none; color: #ddd;}
a:hover {text-decoration: underline;}
body, div {margin: 0; }
body {
	position: relative;
	float: left;
	width: 100%;
	height: 100%;
}
html {  width: 100%; height: 100%;
  box-sizing: border-box;}

 p {opacity: 0;}

#bodybg {
background: url('/files/bg.jpg');
background-repeat:no-repeat;
-webkit-background-size:cover;
-moz-background-size:cover;
-o-background-size:cover;
background-size:cover;
background-position:center;
	width: 100%;
	height: 100%;
	position: fixed;
	z-index: -1;
}
.padding15 {padding: 15px; float: left; width: 100%;}
.padding25 {padding: 25px; float: left; width: 100%;}
.padding5p {padding: 80px 40px 20px 40px; float: left; width: 100%;}
.padding45 {padding: 45px; float: left; width: 100%;}

.TDblockSite {position: absolute; left: 50%; margin-left: -217px; width: 435px; margin-top: 150px;}
/* WHITEFIELD LOADING */
.td_whitefield {width: 100%; height: 100%; display: block; background-color: rgba(0,0,0,0.9); position: fixed; top: 0; left: 0; z-index: 100000;}
.td_loading {position: absolute; top: 50%; left: 50%; z-index: 100000; transform: translate(-50%,-50%);}

.centered {width: 1200px; float: left; position: relative; margin-left: 50%; transform: translate(-50% ,0);}
.centeredMain {width: 100%; float: left; position: relative; min-height: 100%; padding: 0 0 25px 0;}
.marginTop {margin-top: 170px;}
.td_slick {width: 100%; float: left;}
.td_slick img {width: 100%; float: left;}
.td_slick span.texty {background: rgba(255,255,255,0.9);  padding: 25px; font-size: 20pt; color: #555; position: absolute; z-index: 50; left: 50%; bottom: 85px; transform: translate(-100%, 0); border-bottom: 3px solid #4a8bc1; border-top: 3px solid #fff}
.searchbar {width: 25%;float: right; padding: 25px;}
.subMenuBar {width: 85%;float: right; padding: 10px 15px; color: white;  font-size: 24pt; font-weight: normal; }
.searchbutton {width: 40px; margin-top: 12px; float: right; opacity: 0.8; cursor: pointer;}
.searchbutton:hover {opacity: 1;}
.searchbox {width: 0px; background: rgba(0,0,0,0.5); opacity: 0; color: white; padding: 20px 0; font-size: 16pt;  float: right; margin-right: 7px;}
.langBar { background: url('/files/patternb.png'), rgba(0,0,0,0.5); position: relative; width: 100%;  float: left;}
.bottomBar {background-color: #4a8bc1; border-top: 3px solid white; position: relative; width: 100%;  float: left; padding: 25px 0;}
nav { background-color: rgba(0,0,0,0.3);position: fixed; height:auto; top: 0; left: 0; width: 100%;  float: left; z-index: 50; transition: 0.5s;  }
.mainLink { overflow: hidden; float: left; width: 33%; position: relative; margin: 0; padding: 0; height: auto; margin-right: 10px; max-width: 300px;}
.flags {position: relative; float: right;}
.flags img {float: left; width: 25px; margin: 5px 2px; opacity: 0.5;}
.flags img:hover {opacity: 1;}
.flags img.activeFlag {opacity: 1;}

.mainCaption {position: absolute; bottom: 0; padding: 10px;  font-size: 14pt;  width: 100%; transition: 0.15s; background-color: rgba(255,255,255,0.7); color: #000; border-top: 2px solid #4a8bc1;}
.mainCaption strong {text-transform: uppercase;}
.mainLink img {width: 100%; height: 100%; float: left; position: relative; transition: 0.15s;}
.mainLink:hover img {transform: scale(1.1);}
.mainLink:hover .mainCaption {padding: 20px 10px; background-color: rgba(0,0,0,0.7); color: #fff;}

.linkBoxMaster {width: 100%; float: left; padding-bottom: 10px;}
a.linkBox:link,a.linkBox:visited {width: calc(25% - 14px); border: 1px solid #fff; float: left; margin: 7px; padding: 25px; text-align: center; color: #fff;  transition: 0.5s; background-color: rgba(0,0,0,0.7); position: relative; padding-bottom: 65px;}
a.linkBox:hover {text-decoration: none; background: #000; border: 1px solid #fff;}
.linkBox img {width: 170px; transition: 0.15s;}
.bodyMarginLeft {margin-left: 17%; float: left; width: 100%;}
.linkBoxHeader {width: 100%; float: left; text-align: center; font-size: 18pt;  margin-top: 10px; color: #888;}
.linkBoxBody {width: 100%; float: left; text-align: center; margin-top: 10px; color: #fff;}
.linkBoxLink {width: 80%; position: absolute; bottom: 15px; left: 50%; transform: translate(-50%, 0) scale(1); padding: 10px; background-color: #fff; color: #4a8bc1; transition: 0.15s; text-align: center;}
a.linkBox:hover img {transform: scale(1.15);}
a.linkBox:hover .linkBoxLink {background-color: #4a8bc1; color: #fff;}

.news {float: left; width: calc(30% - 30px); margin-right: 30px;}
.mainRight {float: left; width: calc(30%);}

.newsBox { margin: 3px 0; float: left; background-color: rgba(0,0,0,0.7); border: 1px solid #fff; padding: 15px 15px;  border-bottom: 1px solid #ddd; }
.newsBox p {color: #fff;}
.newsBox h3 { font-size: 14pt; color: #4a8bc1; float: left; width: 100%;}
.newsBox .date { font-size: 10pt; color: #fff; float: left; width: 100%; margin-bottom: 7px;}

#logo {position: relative; float: left; width: 28%; background-color: rgba(0,0,0,0.9); margin: 0; transform: translate(0px, 0px); transform-origin: 50% 0%; transition: 0.15s; padding: 25px 35px; margin-bottom: -20px; margin-top: -10px;}
#logo:hover {transform: translate(0px, 5px);}
.logo {float: left; width: 100%; position: relative;}
.fb {float: right; width: 40px; height: 40px; margin: 10px 0; opacity: 0.7;}
.fb:hover {opacity: 1;}


.desktop {display: block; float: left; width: 100%;}
.mobile {display: none; float: left; width: 100%;}


footer {position: relative; width: 100%; background-color: #eee; color: white; padding: 5px 15px; float: left; width: 100%; box-sizing: border-box; border-top: 7px solid white; }
footer .centered, footer a:link,footer a:visited {color: #333; text-align: center;}

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

@media only screen and (max-width: 1023px) {
.centered {width: 100%; float: left; transform: translate(0,0); margin: 0; position: static; transform: none;}
nav {height: auto; position: relative; top: auto; left: auto; bottom: auto; right: auto;}
.flags  {right: 15px;}
.fbM {margin-right: 15px;}
.flags img {width: 40px; margin: 5px 3px;}
.centeredMain {padding: 25px 25px;}
#logo {position: relative; width: 35%; background: none; margin: 15px 0;}
.mobile {display: block;}
.menuMobile {position: absolute; width: 20%; right: 15px; bottom: 15px; transition: 0.15s; }
.menuComplete .menuMobile {position: relative; width: 40%; right: 0; bottom: 0; top: 0; left: 0; transform: translate(-50%, 0); float: left; margin: 25px; margin-left: 50%;}
.menuComplete .menuMobile:hover {transform: translate(-50%, 5px);}
.menuMobile:hover {transform: translate(0px, 5px);}
.texty {display: none;}
a.linkBox:link,a.linkBox:visited {margin-top: 15px; width: calc(50% - 14px);}
.marginTop {margin-top: 0;}
.fb {margin: 15px;}
}



@media only screen 
and (min-device-width : 200px) 
and (max-device-width : 700px) 
and (orientation : portrait) { 
.newsImg {width: 100%; max-width: none;}
.fb {display: none;}
#logo {width: 50%;}
.menuMobile {width: 35%;  }
a.linkBox:link,a.linkBox:visited {width: calc(100% - 30px); margin: 5px 15px;} 
.news, .mainRight {width: 100%;}


}