html,body{
height:100%;
width:100%;
}


/* header social links */
.social {
   margin: 24px 0;
   padding: 0;
   font-size: 30px;
   text-shadow: 0px 1px 2px rgba(0, 0, 0, .8);
}
.social li {
   display: inline-block;
   margin: 0 15px;
   padding: 0;
}
.social li a { color: #fff; }
.social li a:hover { color: #ee7036; }

a, a:visited {
    color: #fff;
    outline: 0 none;
    text-decoration: none;
    transition: color 0.3s ease-in-out 0.2s;
}

a {text-decoration:none;}
a:hover{text-decoration:none;}
a :visited{text-decoration:none;}

a.phone{text-decoration:none; color: #fff;
    outline: 0 none;
    text-decoration: none;
    transition: color 0.3s ease-in-out 0.2s;}
a.phone:hover{text-decoration:none;color: #ee7036;
    outline: 0 none;
    text-decoration: none;
    transition: color 0.3s ease-in-out 0.2s;}
a.phone:visited{text-decoration:none;}


.navbar-inverse .navbar-nav > .active > a, .navbar-inverse .navbar-nav > .active > a:focus, .navbar-inverse .navbar-nav > .active > a:hover {
    background: rgb(226,200,139); /* Old browsers */
background: -moz-linear-gradient(top, rgba(226,200,139,1) 0%, rgba(191,169,118,1) 50%, rgba(204,179,126,1) 51%, rgba(226,200,139,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(226,200,139,1)), color-stop(50%,rgba(191,169,118,1)), color-stop(51%,rgba(204,179,126,1)), color-stop(100%,rgba(226,200,139,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, rgba(226,200,139,1) 0%,rgba(191,169,118,1) 50%,rgba(204,179,126,1) 51%,rgba(226,200,139,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, rgba(226,200,139,1) 0%,rgba(191,169,118,1) 50%,rgba(204,179,126,1) 51%,rgba(226,200,139,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, rgba(226,200,139,1) 0%,rgba(191,169,118,1) 50%,rgba(204,179,126,1) 51%,rgba(226,200,139,1) 100%); /* IE10+ */
background: linear-gradient(to bottom, rgba(226,200,139,1) 0%,rgba(191,169,118,1) 50%,rgba(204,179,126,1) 51%,rgba(226,200,139,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e2c88b', endColorstr='#e2c88b',GradientType=0 ); /* IE6-9 */
    color: #fff;
	-moz-transition: all 1s ease-in;
    /* WebKit */
    -webkit-transition: all 1s ease-in;
    /* Opera */
    -o-transition: all 1s ease-in;
    /* Standard */
    transition: all 1s ease-in;
}

.rabstand{margin-right:10px;}

.navbar-inverse {
    background-color: rgba(25,25,25,0.75);
    border-color: #383838;
}

.main-section{
padding-top: 50px;
height:auto !important;
min-height:100%;
overflow:hidden;
background: #ccc;
background-size:cover;
}

.portfolio-section{
padding-top: 50px; 
height:auto !important;
min-height:100%;
overflow:hidden;
background: #000;
background-size:cover;
}


.content-portfolio {
min-height: 100vh;
overflow: hidden;
}


.portfolio-logo-center{
margin: auto;

}







.agb-section{
padding-top: 50px;
height:auto !important;
min-height:100%;
overflow:hidden;
background: #000;
background-size:cover;
}


.contact-section{
padding-top: 50px;
height:auto !important;
min-height:100%;
width:100%;
overflow:hidden;
background: rgba(0, 0, 0, 1);
display: block;
position: relative;
color:#fff;
font: 16px/32px 'opensans-light', sans-serif;
text-shadow: 0px 0px 5px rgba(0, 0, 0, 1);
display: -webkit-flex;
display: flex;
}

.contact-section:before {
    content: ' ';
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: 0.3;
    background-image: url('../img/low/stpeter.jpg');
    background-repeat: no-repeat;
    background-position: 50% 0;
    -ms-background-size: cover;
    -o-background-size: cover;
    -moz-background-size: cover;
    -webkit-background-size: cover;
    background-size: cover;
}


.datenschutz-section{
padding-top: 50px;
height:auto !important;
min-height:100%;
overflow:hidden;
background: #000;
background-size:cover;
}


.contact{
position: relative;
padding:0;
margin: 0 auto;
padding-bottom:125px;
text-align:  center;
height:100%;
/* background-color:rgba(0, 0, 0, 0.5); */
}

 .contacthead{
 margin:  0;
 padding: 50px 0 50px 0;
 }

.ccrow{
text-align:  center;
align-items: stretch;
height:auto !important;
min-height:90%;
}

.footing{position:absolute;bottom:50px;width:100%}

.flexit{
display: -webkit-flex;
display: flex;
-webkit-align-items: center;
align-items: center;  
justify-content: center;
}

.single-contact{
margin: 0 auto;
}

.headline-contact{
margin:0;}


h1 {font-family: 'opensans-bold', sans-serif;}

h1.agbhead{
color:#fff;
}

p.agb{color:#fff;
 font: 16px/32px 'opensans-light', sans-serif;
 padding-bottom:50px;
}

div.datenschutz{color:#fff;
 font: 16px/32px 'opensans-light', sans-serif;
 padding-bottom:50px;
}


.content {
    padding: 75px 15px;
    text-align: center;
}







.logo{
padding-top:75px;
width:100%;
max-width:500px;
}

.rvv{
color:#fff;
font-size:24px; /*fallback*/
font-size:7.5vw;

text-transform:uppercase;
text-shadow: 1px 1px 2px rgba(0, 0, 0, 1);
}

.navbar-brand {
text-transform:uppercase;
}

	.scrollToTop{
	
	position:fixed;
	bottom:20px;
	right:20px;
	display:none;
	
}

a.scrollToTop, a.scrollToTop:visited {
    color: #FFF;
	font-size:3em;
    outline: 0 none;
    text-decoration: none;
    transition: color 0.3s ease-in;
}

a.scrollToTop:hover {
    color: #ee7036;
    transition: color 0.3s ease-in-out 0.2s;
}



 div.datenschutz h4{margin-top:25px;}








@keyframes example {
   0% { transform: scale(1.0); }
   50%   { transform: scale(1.5); }
   100%  { transform: scale(1.0); }
}


.social{   
   animation-name: example;
   animation-duration: 1s;
   animation-timing-function: ease-in-out; 
   animation-delay: 2s;            
 }
 

 
 #preloading{
 width:1px;height:1px;
 overflow:hidden;
 }
 
 
 /* Preloader  */ 

 #loader-wrapper {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1000;
	}
	
	#schaf {
        display: block;
        position: absolute;
        left: 50%;
        top: 50%;
        width: 150px;
        height: 150px;
        margin: -75px 0 0 -75px;
 
       
        z-index: 1500;
		background:url(../img/schaf.png);
    }
	
    #loader {
        display: block;
        position: relative;
        left: 50%;
        top: 50%;
        width: 150px;
        height: 150px;
        margin: -75px 0 0 -75px;
 
        border: 3px solid #ee7036;
        z-index: 1500;
    }
	
	
	/* nested Elements*/
	#loader:before {
    content: "";
    position: absolute;
    top: 5px;
    left: 5px;
    right: 5px;
    bottom: 5px;
    border: 3px solid #e0c78a;
	}
	#loader:after {
		content: "";
		position: absolute;
		top: 15px;
		left: 15px;
		right: 15px;
		bottom: 15px;
		border: 3px solid #9d9d9d;
	}
	
	/* change border to transparent and set only border-top to a solid color */
	#loader {
		border: 3px solid transparent;
		border-top-color: #ee7036;
	}
	#loader:before {
		border: 3px solid transparent;
		border-top-color: #e0c78a;
	}
	#loader:after {
		border: 3px solid transparent;
		border-top-color: #9d9d9d;
	}
	
	#loader {
    border-radius: 50%;
}
#loader:before {
    border-radius: 50%;
}
#loader:after {
    border-radius: 50%;
}

/* copy and paste the animation inside all 3 elements */
/* #loader, #loader:before, #loader:after */
-webkit-animation: spin 1.5s linear infinite;
animation: spin 1.5s linear infinite;
 
/* include this only once */
@-webkit-keyframes spin {
    0%   {
        -webkit-transform: rotate(0deg);  /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: rotate(0deg);  /* IE 9 */
        transform: rotate(0deg);  /* Firefox 16+, IE 10+, Opera */
    }
    100% {
        -webkit-transform: rotate(360deg);  /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: rotate(360deg);  /* IE 9 */
        transform: rotate(360deg);  /* Firefox 16+, IE 10+, Opera */
    }
}
@keyframes spin {
    0%   {
        -webkit-transform: rotate(0deg);  /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: rotate(0deg);  /* IE 9 */
        transform: rotate(0deg);  /* Firefox 16+, IE 10+, Opera */
    }
    100% {
        -webkit-transform: rotate(360deg);  /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: rotate(360deg);  /* IE 9 */
        transform: rotate(360deg);  /* Firefox 16+, IE 10+, Opera */
    }
}

#loader {
    -webkit-animation: spin 2s linear infinite;
    animation: spin 2s linear infinite;
}
#loader:before {
    -webkit-animation: spin 3s linear infinite;
    animation: spin 3s linear infinite;}
	
#loader:after {
    -webkit-animation: spin 2.5s linear infinite;
    animation: spin 2.5s linear infinite;

}

#loader-wrapper .loader-section {
    position: fixed;
    top: 0;
    width: 51%;
    height: 100%;
    background: #222222;
    z-index: 1000;
}
 
#loader-wrapper .loader-section.section-left {
    left: 0;
}
 
#loader-wrapper .loader-section.section-right {
    right: 0;
}

#loader {
    z-index: 1001; /* anything higher than z-index: 1000 of .loader-section */
}
h1 {
    color: #EEEEEE;
}

.loaded #loader-wrapper {
        -webkit-transform: translateY(-100%);
            -ms-transform: translateY(-100%);
                transform: translateY(-100%);
 
        -webkit-transition: all 0.3s 1s ease-out; 
                transition: all 0.3s 1s ease-out;
}

/* Loaded */
.loaded #loader-wrapper .loader-section.section-left {
    -webkit-transform: translateX(-100%);  /* Chrome, Opera 15+, Safari 3.1+ */
    -ms-transform: translateX(-100%);  /* IE 9 */
    transform: translateX(-100%);  /* Firefox 16+, IE 10+, Opera */
}
 
.loaded #loader-wrapper .loader-section.section-right {
    -webkit-transform: translateX(100%);  /* Chrome, Opera 15+, Safari 3.1+ */
    -ms-transform: translateX(100%);  /* IE 9 */
    transform: translateX(100%);  /* Firefox 16+, IE 10+, Opera */
}

.loaded #loader {
    opacity: 0;
}

.loaded #schaf {
    opacity: 0;
}

.loaded #loader-wrapper {
    visibility: hidden;
}

.loaded #loader {
    opacity: 0;
    -webkit-transition: all 0.3s ease-out; 
            transition: all 0.3s ease-out;
}

.loaded #schaf {
    opacity: 0;
    -webkit-transition: all 0.3s ease-out; 
            transition: all 0.3s ease-out;
}


.loaded #loader-wrapper .loader-section.section-right,
.loaded #loader-wrapper .loader-section.section-left {
 
    -webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000); 
                transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
}
	 
 
 /* Preloader ende */
 
 
 

 
 
 @media only screen 
and (max-device-height: 360px) 
and (max-device-width: 640px) 
and (orientation: landscape) {

.logo{
padding-top:0px;
width:100%;
max-width:300px;
}

.rvv{font-size:20px; /*fallback*/
font-size:4.5vw;
padding:0;margin:5px 0;}

.social{margin:0;}
.social li{font-size:18px;}

}

/* Media query height 360 width 640 END*/


@media (min-width: 767px) {
	.rvv{
	color:#fff;
	font-size:36px; /*fallback*/
	font-size:2.0vw;


	text-transform:uppercase;
	text-shadow: 1px 1px 2px rgba(0, 0, 0, 1);
	}
	
	.social{margin-top:50px;}


	.contact-section:after {
	 
		background-image: url('../img/stpeter.jpg');
	  
	}

}


    .video_wrapper {
    	background-image: url( 'bg_image.jpg' );
    	background-size: cover;
    	position: relative;
    	box-shadow: 0px 3px 5px #333;
    	height: 400px;
    	width: 100%;
    }
    .video_wrapper .video_trigger:before {
    	content: '\f04b';
    	font-family: 'FontAwesome';
    	position: absolute;
    	z-index: -1;
    	font-size: 120px;
    	color: rgba( 255, 255, 255, .2 );
    	width: 120px;
    	height: 120px;
    	line-height: 120px;
    	text-align: center;
    	top: -webkit-calc( 50% - 60px );
    	top: calc( 50% - 60px );
    	left: -webkit-calc( 50% - 60px );
    	left: calc( 50% - 60px );
    }
    .video_wrapper .video_trigger {
    	padding: 130px 30px;
    	
    	height: -webkit-calc( 100% - 260px );
    	height: -moz-calc( 100% - 260px );
    	height: -o-calc( 100% - 260px );
    	height: calc( 100% - 260px );
    	
    	width: -webkit-calc( 100% - 60px );
    	width: -moz-calc( 100% - 60px );
    	width: -o-calc( 100% - 60px );
    	width: calc( 100% - 60px );
    	
    	position: absolute;
    	bottom: 0;
    	z-index: 9;
    	background-color: rgba( 0, 0, 0, .6 );
    	color: #fff;
    }
    .video_wrapper .video_layer {
    	position: relative;
    	display: none;
    	height: inherit;
    	width: inherit;
    	margin: auto;
    }
    .video_wrapper .video_layer iframe {
    	border: 0px none transparent;
    	height: inherit;
    	width: inherit;
    }
	
	
	    .issuu_wrapper {
    	    background-image: url( 'bg_image.jpg' );
    background-size: cover;
    position: relative;
	top:0;
   
    height: 100vh;
    width: 100%;
    }
    .issuu_wrapper .issuu_trigger:before {
    	content: '\f04b';
    	font-family: 'FontAwesome';
    	position: absolute;
    	z-index: -1;
    	font-size: 120px;
    	color: rgba( 255, 255, 255, .2 );
    	width: 120px;
    	height: 120px;
    	line-height: 120px;
    	text-align: center;
    	top: -webkit-calc( 50% - 60px );
    	top: calc( 50% - 60px );
    	left: -webkit-calc( 50% - 60px );
    	left: calc( 50% - 60px );
    }
    .issuu_wrapper .issuu_trigger {
    	padding: 130px 30px;
    	
    	
    	height: 100%;
    	
    	
    	width: 100%;
    	
    	position: absolute;
    	bottom: 0;
    	z-index: 9;
    	background-color: rgba( 0, 0, 0, .6 );
    	color: #fff;
    }
    .issuu_wrapper .issuu_layer {
    	position: relative;
    	display: none;
    	height: inherit;
    	width: inherit;
    	margin: auto;
    }
    .issuu_wrapper .issuu_layer iframe {
    	border: 0px none transparent;
    	height: inherit;
    	width: inherit;
    }

	.btn{background-color:green;}