@charset "utf-8";

/*-- Hover-Effekt--*/
.box {
  cursor: pointer;
  height: 200px;
  position: relative;
  overflow: hidden;
}

.box img {
  position: absolute;
  left: 0;
  -webkit-transition: all 300ms ease-out;
  -moz-transition: all 300ms ease-out;
  -o-transition: all 300ms ease-out;
  -ms-transition: all 300ms ease-out;
  transition: all 300ms ease-out;
}

.box .overbox {
  background-color: #304562;
  position: absolute;
  top: 0;
  left: 0;
  color: #fff;
  z-index: 100;
  -webkit-transition: all 300ms ease-out;
  -moz-transition: all 300ms ease-out;
  -o-transition: all 300ms ease-out;
  -ms-transition: all 300ms ease-out;
  transition: all 300ms ease-out;
  opacity: 0;
  width: 100%;
  height: auto;
  padding: 30px 20px;
}

.box:hover .overbox { opacity: 1; }

.box .overtext {
  -webkit-transition: all 300ms ease-out;
  -moz-transition: all 300ms ease-out;
  -o-transition: all 300ms ease-out;
  -ms-transition: all 300ms ease-out;
  transition: all 300ms ease-out;
  transform: translateY(40px);
  -webkit-transform: translateY(40px);
}

.box .title {border-left: 1px solid #fff; padding-left: 10px;
  font-size: 1.0em; padding-bottom: 0.5em;
  text-transform: uppercase;
  opacity: 0;
  transition-delay: 0.1s;
  transition-duration: 0.2s;
      -ms-hyphens: auto;
        -moz-hyphens: auto;
        -webkit-hyphens: auto;
        hyphens: auto;
}
.box .title::after{
content: '';
display: block;
width: 70px;
height: 0;
margin-top: 5px;
margin-left: -25px;
border-top: 1px solid #fff;
}

.box:hover .title,
.box:focus .title {
  opacity: 1;
  transform: translateY(0px);
  -webkit-transform: translateY(0px);
}

.box .tagline {
  font-size: 0.9em;
  opacity: 0;
  transition-delay: 0.2s;
  transition-duration: 0.2s;
  padding: 10px 0 0 10px;
}

.box:hover .tagline,
.box:focus .tagline {
  opacity: 1;
  transform: translateX(0px);
  -webkit-transform: translateX(0px);
}

.box .tagline strong{
font-size: 25px; font-weight: 400;
}

/*Cookie Consent Begin*/
#cookieConsent {
border-top: 1px solid #fff;
background-color: #726f71;
min-height: 46px;
font-size: 16px;
color: #fff;
line-height: 46px;
padding: 8px 0 8px 30px;
font-family: "Trebuchet MS",Helvetica,sans-serif;
position: fixed;
bottom: 0;
left: 0;
right: 0;
display: none;
z-index: 9999;
}
#cookieConsent a {
color: #fff;
text-decoration: none;
}
#closeCookieConsent {
float: right;
display: inline-block;
cursor: pointer;
height: 20px;
width: 20px;
margin: -15px 0 0 0;
font-weight: bold;
}
#closeCookieConsent:hover {
color: #ccc;
}
#cookieConsent a.cookieConsentOK {
background-color: #726f71;
border: 1px solid #fff;
color: #fff;
display: inline-block;
padding: 0 20px;
cursor: pointer;
float: right;
margin: 0 60px 0 10px;
}
#cookieConsent a.cookieConsentOK:hover {
background-color: #726f71;
color: #ccc;
}
/*Cookie Consent End*/


/*Animation*/
       .slideInUp {
  -webkit-animation-name: slideInUp;
  animation-name: slideInUp;
  -webkit-animation-duration: 1.5s;
  animation-duration: 1.5s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  }
  @-webkit-keyframes slideInUp {
  0% {
  -webkit-transform: translateY(30%);
  transform: translateY(30%);
  visibility: visible;
  }
  100% {
  -webkit-transform: translateY(0);
  transform: translateY(0);
  }
  }
  @keyframes slideInUp {
  0% {
  -webkit-transform: translateY(30%);
  transform: translateY(30%);
  visibility: visible;
  }
  100% {
  -webkit-transform: translateY(0);
  transform: translateY(0);
  }
  }
  
body	{border-top: 1px solid #a5a2a4;
margin: 0 auto;
background: #fff;
font-family: 'Roboto', sans-serif;
/*font-family: 'Numans', sans-serif;*/
width: 100%;
min-height: 101%;
color: #726f71;
text-align: left;
}

img	{ /*border-radius: 10% 0 10% 0;*/
outline: none;
max-width: 100%;
height: auto;
border: none;
outline: none;
}

input{
float: left;
}

a	{
color: #404040;	
outline: none;
text-decoration: none;	
}

a:hover	{color: #273279;	
cursor: pointer;
}

a:active, a:focus{
outline: none;
text-decoration: none;
}

a.current	{
color: #273279 /*#0052cc*/;
}

p	{
font-weight: 300;
font-size: 110%;
color: #404040;
line-height: 1.4em;
    -ms-hyphens: auto;
        -moz-hyphens: auto;
        -webkit-hyphens: auto;
        hyphens: auto;
}

p.small	{
padding: 5px 0;
font-size: 14px;
text-align: left;
}

span{
font-size: 90%;	
}

p strong	{
font-size: 110%;	
font-weight: 500;	
}

h1	{
line-height: 1.2em;
text-align: left;
margin: 0;
padding: 18px 0% ;
font-size: 23px;
color: #726f71;
font-weight: 400;
}

h2.header	{
text-align: left;
margin: 0;
padding: 12px 0% 10px;
font-size: 1.2em;
color: #726f71;
font-weight: 300;
}

h2	{

}

h3.border-1	{
display: none;
}

h3.border-1, h3.border-2	{
text-transform: uppercase;
padding: 10px 0; 
margin: 0;
font-weight: 400;
font-size: 23px;
padding-left: 15px;
letter-spacing: 1px;
border-left: 1px solid #a5a2a4; 
}

h3.border-1::after, h3.border-2::after {
content: '';
display: block;
width: 70px;
height: 0;
margin-top: 10px;
margin-left: -25px;
border-top: 1px solid #a5a2a4; 
}

h3	{
text-align: left;
text-transform: none;
padding: 10px 0; 
margin: 0;
font-weight: 300;
font-size: 25px;
padding-left: 0px;
letter-spacing: 1px;
border-left: 0;
}

h4	{
text-transform: uppercase;
padding: 5px 0;
margin: 0 0 15px 0;
font-size: 120%;
font-weight: 400;
}

#footer h4{
color: #fff;
}

h5	{
background: #a5a2a4/*#726f71#89a02c*/;	
color: #fff;
text-transform: uppercase;
padding: 5px 0;
margin: 0 0 0 0;
font-size: 120%;
font-weight: 400;
text-align: center;
}

h6	{
margin: 15px 0 0 0;
font-weight: normal;
font-size: 1.0em;
text-align: center;
}

hr	{
border: 0;
background: #a5a2a4; 
height: 1px;
margin: 20px auto;
}

table	{
width: 100%;
}

table tr td{
color: #fff;
font-weight: 300;
}

table tr td.left{
width: 15%;
}

#logo	a img	{
margin-bottom: 40px;
}

#clear{
clear: both;
}

#footer	{
background: #a5a2a4;
margin: 5em 0 0 0;
padding: 10px 0 20px 0;
}

#footer p	{
font-size: 100%;
padding: 0;
margin: 0;
color: #fff;
}

#footer ul.bottom {
padding: 5px 0 0 0 ;
margin: 0;	
}

#footer ul.bottom li{padding-bottom: 5px;
display: block;	
}

#footer .fa	{
font-size: 30px;
color:#fff; 
-webkit-transition: padding-left 0.5s; /* Safari */
transition: padding-left 0.5s;
padding-bottom: 3px;	
}

#footer p a		{
font-size: 23px;
color:#fff; 
-webkit-transition: padding-left 0.5s; /* Safari */
transition: padding-left 0.5s;
padding-bottom: 15px;	
}

#footer .col h6 a{
color:#fff; 
-webkit-transition: padding-left 0.5s; /* Safari */
transition: padding-left 0.5s;
padding-bottom: 15px;	
}

#footer ul li a	,#footer .col h6 {
color:#fff; 
-webkit-transition: padding-left 0.5s; /* Safari */
transition: padding-left 0.5s;	
}

#footer ul li a:hover, #footer p a:hover,#footer .col h6 a:hover 	{
padding-left: 10px;
}

#footer ul li a:hover:after, #footer .col h6 a:hover:after	{
content: '';
}

#footer p.img a:hover	{
padding-left: 0;
color: #788c27; 
-o-transition: color .5s ease-out;
-ms-transition:color .5s ease-out;
-moz-transition:color .5s ease-out;
-webkit-transition:color  .5s ease-out;
/* ...and now override with proper CSS property */
transition:color .5s ease-out;
}

#left-con p, #mid-con p, #right-con p{
margin: 0 10px;	
}

/*Back to top button*/
#back-top {
position: fixed;
bottom: 0px;
right: 49%; 
}

#back-top a {opacity: 0.9;
width: 2.0em;
display: block;
text-align: center;
text-decoration: none;
color: #bbb;
/* background color transition */
}

#back-top a:hover {
opacity: 1.0;
}
/* arrow icon (span tag) */
#back-top span {
width: 3.5em;
height: 3.5em;
display: block;
background:  #a5a2a4 url(../img/up-arrow2.png) no-repeat center center;
border-radius: 100% 100%;
}

/*Media queries*/
@media (max-width: 1600px) {
h1	{
text-align: left;
font-size: 21px;
}
}

@media (max-width: 1440px) {
p	{
font-size: 105%;
}	
.box {
cursor: pointer;
height: 170px;
position: relative;
overflow: hidden;
}
}

@media (max-width: 1280px) {
h1	{
text-align: left;
font-size: 19px;
}	
#footer p	a	{
font-size: 22px;
}	
.box {
cursor: pointer;
height: 160px;
position: relative;
overflow: hidden;
}
h3.border-1, h3.border-2	{
font-size: 22px;
}
}

@media (max-width: 1024px) {
h1	{
font-size: 16px;
font-weight: 500;
}
.box .title {
-ms-hyphens: auto;
	-moz-hyphens: auto;
	-webkit-hyphens: auto;
	hyphens: auto;
}
}

@media (max-width: 980px) {
h3.border-1	{
display: block;
padding: 25px 0 15px 15px;
}	
h3.border-2{
display: none;
}
#image{
display: none;
}
#logo	a img	{
margin-bottom: 0px;
}
h1	{
font-size: 25px;
}
}

@media (max-width: 768px) {
h6	{
padding-bottom: 0em;
margin-top: 0em;
}
#footer p	a	{
font-size: 25px;
}
#footer p {
font-size: 110%;
}
#footer ul.bottom li {
padding-bottom: 15px;
}
table tr td {
font-weight: 400;
font-size: 110%;
padding: 5px 0;
}
}

@media (max-width: 500px) {
h3.border-1, h3.border-2	{
font-size: 20px;
}
}

@media (max-width: 340px) {
h3.border-1, h3.border-2	{
font-size: 18px;
}
}
