@import url('./font-awesome.css');

#singleviewlocationlogo img {
/*border: 2px red solid;*/
width: 300px !important;
height: 100% !important;
margin:-5px 0 25px 0;
}



.navbar-header .navbar-brand {
float:left;
font-weight: bold;
color:#ff0000;    
}


header .hero {
    
    background: #45494d url("/typo3conf/ext/demotemplate/Resources/Public/Images/introbg.jpg") no-repeat scroll center center / cover ;
    color: #ffffff;
/*    padding: 0 !important;*/
    text-shadow: 0 0 5px #666;
}



#f1_container {
  position: relative;
  margin: 10px auto;
  width: 450px;
  height: 281px;
  z-index: 1;
}
#f1_container {
  perspective: 1000;
}
#f1_card {
  width: 100%;
  height: 100%;
  transform-style: preserve-3d;
  transition: all 1.0s linear;
}
#f1_container:hover #f1_card {
  transform: rotateY(180deg);
  box-shadow: -5px 5px 5px #aaa;
}
.face {
  position: absolute;
  width: 100%;
  height: 100%;
  backface-visibility: hidden;
}
.face.back {
  display: block;
  transform: rotateY(180deg);
  box-sizing: border-box;
  padding: 10px;
  color: white;
  text-align: center;
  background-color: #aaa;
}




.view {
   margin: 10px;
   float: left;
/*   border: 10px solid #fff;*/
   overflow: hidden;
   position: relative;
   text-align: center;
/*   -webkit-box-shadow: 1px 1px 2px #e6e6e6; */
/*   -moz-box-shadow: 1px 1px 2px #e6e6e6; */
/*   box-shadow: 1px 1px 2px #e6e6e6; */
   cursor: default;
   background: #fff url(../images/bgimg.jpg) no-repeat center center;
}
.view .mask,.view .content {
   position: absolute;
   overflow: hidden;
   top: 0;
   left: 0;
}
.view img {
   display: block;
   position: relative;
}
.view h2 {
   text-transform: uppercase;
   color: #fff;
   text-align: center;
   position: relative;
   font-size: 17px;
   padding: 10px;
   background: rgba(0, 0, 0, 0.8);
   margin: 30px 0 15px 0;
}

.view h1 {
   text-transform: uppercase;
   color: #fff;
   text-align: center;
   position: relative;
   font-size: 17px;
   padding: 10px;
   background: rgba(0, 0, 0, 0.8);
   margin: 30px 0 15px 0;
}
.view p {
   font-family: Georgia, serif;
   font-style: italic;
   font-size: 12px;
   position: relative;
   color: #fff;
   padding: 10px 20px 0px;
   text-align: center;
}
.view a.info {
   display: inline-block;
   text-decoration: none;
   padding: 3px 14px;
   background: #999;
   color: #fff;
   text-transform: uppercase;
   -webkit-box-shadow: 0 0 1px #000;
   -moz-box-shadow: 0 0 1px #000;
   box-shadow: 0 0 1px #000;
}
.view a.info: hover {
   -webkit-box-shadow: 0 0 5px #000;
   -moz-box-shadow: 0 0 5px #000;
   box-shadow: 0 0 5px #000;
}




.view-third img {
   -webkit-transition: all 0.2s ease-in;
   -moz-transition: all 0.2s ease-in;
   -o-transition: all 0.2s ease-in;
   -ms-transition: all 0.2s ease-in;
   transition: all 0.2s ease-in;
}
.view-third .mask {
   background-color: rgba(0,0,0,0.6);
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   width: 98%;
   -webkit-transform: translate(460px, -100px) rotate(180deg);
   -moz-transform: translate(460px, -100px) rotate(180deg);
   -o-transform: translate(460px, -100px) rotate(180deg);
   -ms-transform: translate(460px, -100px) rotate(180deg);
   transform: translate(460px, -100px) rotate(180deg);
   -webkit-transition: all 0.2s 0.4s ease-in-out;
   -moz-transition: all 0.2s 0.4s ease-in-out;
   -o-transition: all 0.2s 0.4s ease-in-out;
   -ms-transition: all 0.2s 0.4s ease-in-out;
   transition: all 0.2s 0.4s ease-in-out;
}
.view-third h2 {
   -webkit-transform: translateY(-100px);
   -moz-transform: translateY(-100px);
   -o-transform: translateY(-100px);
   -ms-transform: translateY(-100px);
   transform: translateY(-100px);
   -webkit-transition: all 0.2s ease-in-out;
   -moz-transition: all 0.2s ease-in-out;
   -o-transition: all 0.2s ease-in-out;
   -ms-transition: all 0.2s ease-in-out;
   transition: all 0.2s ease-in-out;
}
.view-third p {
   -webkit-transform: translateX(300px) rotate(90deg);
   -moz-transform: translateX(300px) rotate(90deg);
   -o-transform: translateX(300px) rotate(90deg);
   -ms-transform: translateX(300px) rotate(90deg);
   transform: translateX(300px) rotate(90deg);
   -webkit-transition: all 0.2s ease-in-out;
   -moz-transition: all 0.2s ease-in-out;
   -o-transition: all 0.2s ease-in-out;
   -ms-transition: all 0.2s ease-in-out;
   transition: all 0.2s ease-in-out;
}
.view-third a.info {
   -webkit-transform: translateY(-200px);
   -moz-transform: translateY(-200px);
   -o-transform: translateY(-200px);
   -ms-transform: translateY(-200px);
   transform: translateY(-200px);
   -webkit-transition: all 0.2s ease-in-out;
   -moz-transition: all 0.2s ease-in-out;
   -o-transition: all 0.2s ease-in-out;
   -ms-transition: all 0.2s ease-in-out;
   transition: all 0.2s ease-in-out;
}
.view-third:hover .mask {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
   -webkit-transition-delay: 0s;
   -moz-transition-delay: 0s;
   -o-transition-delay: 0s;
   -ms-transition-delay: 0s;
   transition-delay: 0s;
   -webkit-transform: translate(0px, 0px);
   -moz-transform: translate(0px, 0px);
   -o-transform: translate(0px, 0px);
   -ms-transform: translate(0px, 0px);
   transform: translate(0px, 0px);
}
.view-third:hover h2 {
   -webkit-transform: translateY(0px);
   -moz-transform: translateY(0px);
   -o-transform: translateY(0px);
   -ms-transform: translateY(0px);
   transform: translateY(0px);
   -webkit-transition-delay: 0.5s;
   -moz-transition-delay: 0.5s;
   -o-transition-delay: 0.5s;
   -ms-transition-delay: 0.5s;
   transition-delay: 0.5s;
}
.view-third:hover p {
   -webkit-transform: translateX(0px) rotate(0deg);
   -moz-transform: translateX(0px) rotate(0deg);
   -o-transform: translateX(0px) rotate(0deg);
   -ms-transform: translateX(0px) rotate(0deg);
   transform: translateX(0px) rotate(0deg);
   -webkit-transition-delay: 0.4s;
   -moz-transition-delay: 0.4s;
   -o-transition-delay: 0.4s;
   -ms-transition-delay: 0.4s;
   transition-delay: 0.4s;
}
.view-third:hover a.info {
   -webkit-transform: translateY(0px);
   -moz-transform: translateY(0px);
   -o-transform: translateY(0px);
   -ms-transform: translateY(0px);
   transform: translateY(0px);
   -webkit-transition-delay: 0.3s;
   -moz-transition-delay: 0.3s;
   -o-transition-delay: 0.3s;
   -ms-transition-delay: 0.3s;
   transition-delay: 0.3s;
}

.navbar-header{
color:#ff0000;    
}

h5 {
  font-size: 2em;
  margin: -20px 0 10px 0;
}

/***********************     CSS Applicator search  ****************/
#searchform td {
padding: 7px 0 5px 0;
}

input[type="radio"],
input[type="checkbox"] {
  margin: 4px 4px 0 10px;
  margin-top: 1px \9;
  line-height: normal;
}

#searchform .address{
width: 100px;}


.news-list-view {
padding: 10px;
background-color: rgba(255, 255, 255, 0.75);;
}

.home #content .hero P{
    text-shadow: none;
 color:#000000;
}

.home #content .hero A{
    text-shadow: none;
}

.home #content .hero {
    padding-bottom: 140px;
    padding-top: 40px;
    text-align: left;
}







@media (min-width: 1200px) {
header .hero {
    background: #45494d url("/typo3conf/ext/demotemplate/Resources/Public/Images/introbg.jpg") no-repeat scroll center center / cover ;
    color: #ffffff;
    height: 100px !important;
    padding-top: 10px !important;
    text-shadow: 0 0 5px #666;
}

}

@media (min-width: 240px) and (max-width:767px) {
#callnowbutton {
    background: #1e73be url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2aWV3Qm94PSIwIDAgNjAgNjAiPjxwYXRoIGQ9Ik03LjEwNCAxNC4wMzJsMTUuNTg2IDEuOTg0YzAgMC0wLjAxOSAwLjUgMCAwLjk1M2MwLjAyOSAwLjc1Ni0wLjI2IDEuNTM0LTAuODA5IDIuMSBsLTQuNzQgNC43NDJjMi4zNjEgMy4zIDE2LjUgMTcuNCAxOS44IDE5LjhsMTYuODEzIDEuMTQxYzAgMCAwIDAuNCAwIDEuMSBjLTAuMDAyIDAuNDc5LTAuMTc2IDAuOTUzLTAuNTQ5IDEuMzI3bC02LjUwNCA2LjUwNWMwIDAtMTEuMjYxIDAuOTg4LTI1LjkyNS0xMy42NzRDNi4xMTcgMjUuMyA3LjEgMTQgNy4xIDE0IiBmaWxsPSIjMDA0MThjIi8+PHBhdGggZD0iTTcuMTA0IDEzLjAzMmw2LjUwNC02LjUwNWMwLjg5Ni0wLjg5NSAyLjMzNC0wLjY3OCAzLjEgMC4zNWw1LjU2MyA3LjggYzAuNzM4IDEgMC41IDIuNTMxLTAuMzYgMy40MjZsLTQuNzQgNC43NDJjMi4zNjEgMy4zIDUuMyA2LjkgOS4xIDEwLjY5OWMzLjg0MiAzLjggNy40IDYuNyAxMC43IDkuMSBsNC43NC00Ljc0MmMwLjg5Ny0wLjg5NSAyLjQ3MS0xLjAyNiAzLjQ5OC0wLjI4OWw3LjY0NiA1LjQ1NWMxLjAyNSAwLjcgMS4zIDIuMiAwLjQgMy4xMDVsLTYuNTA0IDYuNSBjMCAwLTExLjI2MiAwLjk4OC0yNS45MjUtMTMuNjc0QzYuMTE3IDI0LjMgNy4xIDEzIDcuMSAxMyIgZmlsbD0iI2ZmZiIvPjwvc3ZnPg==") no-repeat scroll center 2px / 58px 58px;
    border-bottom-right-radius: 40px;
    border-top: 2px solid #4ba0eb;
    border-top-right-radius: 40px;
    bottom: -20px;
    box-shadow: 0 0 5px #888;
    display: block;
    height: 80px;
    left: 0;
    position: fixed;
    text-decoration: none;
    width: 100px;
    z-index: 9999;
}

}




/********************************************/
/* ipad hoch */
/********************************************/


@media (min-width: 768px) and (max-width:991px) {
header .hero {
    background: #45494d url("/typo3conf/ext/demotemplate/Resources/Public/Images/introbg.jpg") no-repeat scroll center center / cover ;
    color: #ffffff;
    height: 190px !important;
    padding-top:110px;
    text-shadow: 0 0 5px #666;
}

}


/********************************************/
/* ipad quer */
/********************************************/

@media (min-width: 992px) and (max-width:1199px) {
header .hero {
    background: #45494d url("/typo3conf/ext/demotemplate/Resources/Public/Images/introbg.jpg") no-repeat scroll center center / cover ;
    color: #ffffff;
    height: 130px !important;
    padding-top: 50px !important;
    text-shadow: 0 0 5px #666;

}

}

/********************************************/
/* iphone hoch */
/********************************************/

@media (min-width: 240px) and (max-width:479px) {
header .hero {
    background: #45494d url("/typo3conf/ext/demotemplate/Resources/Public/Images/introbg.jpg") no-repeat scroll center center / cover ;
    color: #ffffff;
    height: 90px !important;
    padding-top: 10px !important;
    text-shadow: 0 0 5px #666;
}
h1 {
font-size: 22px;
}
}


/********************************************/
/* iphone quer */
/********************************************/

@media (min-width: 480px) and (max-width:767px) {
header .hero {
    background: #45494d url("/typo3conf/ext/demotemplate/Resources/Public/Images/introbg.jpg") no-repeat scroll center center / cover ;
    color: #ffffff;
    height: 70px !important;
    padding-top: 10px !important;
    text-shadow: 0 0 5px #666;
}
h1 {
font-size: 22px;
}
}