@charset 'utf-8';
@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,600,300,800);
@import url(normalize.css);
@import url(foundation.min.css);


/*------------------------------------------------
General
-------------------------------------------------*/
html {
    -ms-text-size-adjust: none;
    -webkit-text-size-adjust: none;
    text-size-adjust: none;
    box-sizing: border-box;
}

body {
    height: 100%;   
    font-weight: 400;
    color: #000;
    font-size: 16px;
	font-family: 'Open Sans', sans-serif;
    font-weight: 300;
    overflow-x: hidden;
	position: relative;
    background-color:#fff;
}

*, h1, h2, h3 {
    padding: 0;
    margin: 0;
    outline: none;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.clearfix:after {
    content: "";
    clear: both;
    display: block;
}

img {
    display: block;
    border: 0;
    max-width: 100%;
}

 ul, li {
	 margin:0;
	 padding:0;
 }

/*------------------------------------------------
Common
-------------------------------------------------*/

.center {
	text-align:center;
}

a {
	text-decoration:none;
}

p, a {
	font-size: 22px;
	text-align:left;
	padding-bottom: 0.5em;
}

h1, .h1{
	font-weight:300;
	font-size: 64px;
	margin-bottom: 10px;
	line-height: 1em;
	display:block;
	text-align:center;
	padding-bottom:0;
}



h2{
	font-weight:300;
	font-size: 45px;
	margin-bottom: 10px;
	line-height: 1em;
}

h3{
	font-weight:400;
	font-size: 27px;
	display:inline-block;
	color: #ffed00;
	background-color: #000;
	padding: 4px 20px;	
}

/*------------------------------------------------
Header
-------------------------------------------------*/
header {
	background-color: rgba(0,0,0,0.8);
	height:86px;
	line-height:86px;	
	position: fixed;
    top: 0;
    left: 0;    
    width: 100%;    
    z-index: 100;
	font-weight:600;
	font-weight:400;	
	color: #fff;
}

header a {
	color: #fff;
	display:block;
	font-size: 31px;
}

header a.logo {
    background: url(../images/logo_taxi_bueyuek.png) no-repeat center left;    
	padding: 0 0 0 150px;	
}

header a.hotline {
	text-align: right;
	color: #ffed00;
}


/*------------------------------------------------
Keyvisual
-------------------------------------------------*/
#keyvisual{
	background: url(../images/Taxi_7_Schloss_Bensberg_Guenther_Ortmann_Fotografie_keyvisual.jpg) no-repeat center top;
	background-size: cover;
	height:75%;	
}

/*------------------------------------------------
Intro
-------------------------------------------------*/
#intro{
	padding-top: 30px;
	padding-bottom: 35px;
}

#intro  h1 {
	display:inline-block;
	color: #ffed00;
	background-color: #000;
	padding: 12px 20px;
	text-align:center;
	font-size: 22px;
	line-height: 1.5em;
}

/*------------------------------------------------
Services
-------------------------------------------------*/
#services{
	padding-top: 80px;
	padding-bottom: 90px;
}

#services h3{	
	display:block;
	margin-bottom: 6px;	
}

#services .light h3{	
	color:#fff;	
}

#services p {
	font-size: 18px;
	display:block;
	padding: 10px;
	background-color: #ECECEC;
	margin-top: 6px;	
}

/*------------------------------------------------
About
-------------------------------------------------*/
#about{
	padding-top: 80px;
	padding-bottom: 90px;
	background-color: #ECECEC;
}

#about h2{	
	color: #5A5A5A;
	margin-bottom: 45px;
}

#about img{		
	margin-bottom: 40px;
}

/*------------------------------------------------
Fleet
-------------------------------------------------*/
#fleet{
	padding-top: 80px;
	padding-bottom: 90px;
	background-color: #424242;
	color:#fff;
}

#fleet h2{		
	margin-bottom: 45px;
	color:#fff;
}

#fleet img{		
	margin-bottom: 40px;
}

/*------------------------------------------------
Trigger
-------------------------------------------------*/
#trigger{
	padding-top: 70px;
	padding-bottom: 80px;	
}

#trigger-image{
	background: url(../images/Taxi-Bueyuek_Bergisch-Gladbach_Limousine.jpg) no-repeat top center;	
	background-size: cover;
	height:600px;	
}




/*------------------------------------------------
Onlineorder
-------------------------------------------------*/
#onlineorder{
	padding-top: 70px;
	padding-bottom: 80px;
	background-color: #ECECEC;
}

#onlineorder h3{
	margin-bottom:40px;
}

#onlineorder p{
	padding:0 0 0 0;
}

#onlineorder input{
	margin:0 0 15px 0;
	padding:5px;
	width:100%;
}

#onlineorder .submit{
	margin-top: 30px;
	background-color: #ffed00;
	background-color: #ECECEC;
	font-size: 22px;
	border: 2px solid #000;
}


/*------------------------------------------------
Phone
-------------------------------------------------*/
#phone{
	padding-top: 70px;
	padding-bottom: 80px;
	background-color: #ffed00;	
}

#phone a{		
	margin-top: 30px;	
	color:#000;
	display:block;
	font-size:45px;
	font-weight:400;
	text-align:center;
}

/*------------------------------------------------
Contact
-------------------------------------------------*/
#contact{
	padding-top: 80px;
	padding-bottom: 90px;	
}

#contact h2  {
	margin-bottom: 30px
}

#contact p, #contact a {
	text-align:center;
	font-size: 26px;
	margin-bottom: .2em;
}

#contact a {
	color: #4785cc;
}

#contact a:hover {
	text-decoration: underline;
}

#contact .small {
	font-size: 22px;
	margin-top: 80px;
}

#contact a.gplus {
    display: inline-block;
    background: url(../images/gplus.png) no-repeat;
    width: 105px;
    height: 105px;
    vertical-align: top;
	margin: 5px;
}

#contact a.fb {
    display: inline-block;
    background: url(../images/fb.png) no-repeat;
    width: 105px;
    height: 105px;
    vertical-align: top;
	margin: 5px;
}

/*------------------------------------------------
Response
-------------------------------------------------*/
#response{
	padding-top: 170px;
	padding-bottom: 80px;	
}

#response-image{
	background: url(../images/Taxi-Bueyuek_Bergisch-Gladbach_Limousine.jpg) no-repeat top center;	
	background-size: cover;
	height:600px;	
}


/*------------------------------------------------
Legal
-------------------------------------------------*/
#legal .legal, #legal .privacy {
	margin-top: 120px;
}

#legal article {
	padding-top:45px;
	padding-bottom:50px;
}

#legal  h1{	
	margin-bottom: 20px;
}

#legal  h2{	
	margin-bottom: 20px;	
}

#legal  h3{			
	font-size: 23px;
	margin-bottom: 20px;
	margin-top: 20px;
}

#legal article p, #legal article a {
	font-size: 18px;
}

#legal article a {
	color: #4785cc;
}

#legal article a:hover {
	text-decoration: underline;
}

#legal article h2 {
	margin-bottom: .2em;
}

#legal .privacy h2 {
	padding-top: 95px;
}

.disclaimer-link {
	display: block;
    height: 100px;
    margin-top: -100px;
    visibility: hidden;
}

/*------------------------------------------------
Footer
-------------------------------------------------*/
footer {
    background: #313131;    
    height: 86px;
    text-align: center;
	line-height:84px;
}

footer ul {
	list-style:none;
	text-align: center;
	margin:0;
	padding:0;
}

footer nav ul li {
	display: inline-block;
	padding-left: 70px;
	padding-bottom:0;
	
}

footer nav ul li:first-child {
	padding-left: 0px;
}

footer nav ul li a {
	color: #fff;
	font-size:16px;
}


/*------------------------------------------------
Responsive
-------------------------------------------------*/
@media only screen and (max-width: 1024px) {

	header a {		
		font-size: 26px;
	}
	
	#services p {
		font-size: 16px;		
	}
	
	h3 {		
		font-size: 22px;		
	}
	
}

@media only screen and (max-width: 825px) {
	header a.logo {
		background-size: 90px;
    	padding: 0 0 0 110px;
	}
}

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

	header a {		
		font-size: 20px;
	}
	
	#services p {
		font-size: 14px;		
	}
	
	h3 {		
		font-size: 15px;		
	}
	
	#about, #services, #contact, #fleet {
		padding-top: 70px;
		padding-bottom: 80px;
	}
	
	#onlineorder, #trigger, #phone{
		padding-top: 60px;
		padding-bottom: 70px;
	}
	
	
	#intro{
		padding-top: 25;
		padding-bottom: 30px;
	}
	
	p, a {
		font-size: 20px;
	}
	
	#intro p, #about .big, #contact p, #contact a {
		font-size: 24px;
	}
	
	#contact .small {
		font-size: 20px;
		margin-top: 40px;
	}
}

@media only screen and (max-width: 640px) {
	header {
	    height: 110px;
		line-height: 50px;
	}		
	
	header a.hotline {
		font-size: 20px;
		text-align: center;		
	}
	
	header a.logo {
		background-position: 10px 10px;
		background-size: 90px;
		padding-top: 6px;
		padding-right: 10px;
		font-size: 20px;
		text-align: right;
	}

	#services{
		padding-top: 30px;
		padding-bottom: 30px;
	}
	
	#about, #contact, #fleet,
	#onlineorder, #trigger, #phone{
		padding-top: 50px;
		padding-bottom: 60px;
	}
	
	#trigger-image {    
		height: 350px;
	}
	
	h1 {		
		font-size: 54px;	
	}
	
	h2 {
		font-size: 38px;		
	}
	
	h3 {		
		font-size: 26px;		
	}
	
	p, a {
		font-size: 18px;
	}	
	
	#services p {
		margin-bottom: 30px;
	}
	
	#intro p, #about .big, #contact p, #contact a {
		font-size: 20px;
	}
	
	#contact .small {
		font-size: 18px;
		margin-top: 40px;
	}
	
	#contact a.gplus, #contact a.fb  {		
		width: 80px;
		height: 80px;
		background-size:cover;	
	}
	
	footer nav ul li {
		padding-left: 20px;		
	}
	
	footer nav ul li a {
		font-size: 14px;		
	}
}

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

	h2 {
		font-size: 32px;
		margin-bottom: 20px;		
	}
	
	#phone a {   
		font-size: 36px;   
	}
}

@media only screen and (max-width: 460px) {	
	
	#phone a {   
		font-size: 30px;   
	}
}

@media only screen and (max-width: 380px) {
	
	h1 {		
		font-size: 48px;	
	}
	
	h2 {		
		font-size: 21px;
		margin-bottom: 20px !Important;	
	}
	
	h3, #legal h3 {		
		font-size: 18px;		
	}
	
	p, a {
		font-size: 16px;
	}
	
	#phone a {   
		font-size: 21px;   
	}
	
	#intro p, #about .big, #contact p, #contact a {
		font-size: 16px;
	}
	
	#about, #service, #contact, #fleet,
	#onlineorder, #trigger, #phone{
		padding-top: 30px;
		padding-bottom: 25px;
	}
	
	
	#contact .small {
		font-size: 14px;
		margin-top: 40px;
	}
	
	#contact a.gplus, #contact a.fb {
		background-size:cover;	
	}
	
	footer nav ul li {
		padding-left: 20px;
	}
	
	footer nav ul li a {
		font-size: 12px;		
	}

	#legal .privacy a, #legal .privacy h1 {
		word-break: break-all;
		-ms-word-break: break-all;
	}

	#legal .privacy h1 {
		-webkit-hyphens: auto;
	  	-moz-hyphens: auto;
		hyphens: auto;
	}

	.disclaimer-link {
		height: 115px;
		margin-top: -115px;
	}
}

@media only screen and (max-width: 340px) {
	
	header {
	    height: 110px;
		line-height: 50px;
	}		
	
	header a.hotline {
		font-size: 17px;
		text-align: center;		
	}
	
	header a.logo {
		background-position: 5px 10px;
		background-size: 90px;
		padding-top: 6px;
		padding-right: 5px;
		font-size: 17px;
		text-align: right;
	}

}