@charset "UTF-8";

/************************************************************************************
*
* Theme Name: 		WP Theme für UYC
* Theme URI:		http://www..de
* Description: 		WP-Theme für Urban Yellow Cab
* Author:			13-6 DESIGNSTUDIO und Philipp Lindermeir
* Author URI:		https://13-6.de
* Version:			1.0
* License:          13-6
* License URI:      https://13-6.de
*
************************************************************************************/

/************************************************************************************
*
* Table of Contents
*
************************************************************************************/

/************************************************************************************
*
* RESET
*
************************************************************************************/

* {
    list-style: none outside none;
    border: none;
    margin: 0;
    padding: 0;
    outline: none;
    text-decoration: none;
    box-sizing: border-box;
}

form,
fieldset {
    margin: 0;
    padding: 0;
    border-style: none;
    color: #ffff
}

button::-moz-focus-inner,
input::-moz-focus-inner {
    border: 0;
    padding: 0
}

button,
input[type="button"],
input[type="reset"],
input[type="file"],
input[type="submit"] {
    -webkit-appearance: none;
    border-radius: 0;
    cursor: pointer;
    background: none
}

input[type="text"],
input[type="tel"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
textarea {
    -webkit-appearance: none;
    border-radius: 0;
}

article,
aside,
figcaption,
figure,
footer,
header,
main,
nav,
section {
    display: block
}

html,
body {
    height: 100vh
}

html {
    font-family: 'sans-serif';
    font-weight: normal;
    font-size: 100%;
    font-size: 16px/1.875;
    font-size: 1rem;
    color: #000;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
    vertical-align: baseline;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    overflow: hidden;
}

body {
    position: relative;
    background: none repeat scroll 0% 0% #fff;
    -moz-osx-font-smoothing: grayscale;
    -webkit-overflow-scrolling: touch;
    transition: all ease-in-out .25s;
}

*:before,
*:after {
    -o-box-sizing: border-box;
    box-sizing: border-box
}

*::before {
    box-sizing: border-box
}

.clearfix:before,
.clearfix:after {
    content: "";
    display: table
}

.clearfix:after {
    clear: both
}

.clearfix {
    zoom: 1
}

img {
    display: block;
    border: none;
    border-style: none;
    -ms-interpolation-mode: bicubic
}


a {
    cursor: pointer;
    margin: 0;
    outline: none;
    text-decoration: none
}

a:visited,
a:hover,
a:focus,
a:active {
    text-decoration: none;
    outline: none;
    cursor: pointer
}

::-moz-selection {
    background: #eaa823;
    color: #1d1d1d;
}

::selection {
    background: #eaa823;
    color: #1d1d1d;
}



.mainContainer {
    position: relative;
    display: block;
	overflow:hidden
}


.bg-image {
    width: 100%;
    height: 100vh;
    background: url(bg_image/uyc__bg.jpg)no-repeat center center;
    background-size: cover;
    margin: 0
}


.logo img {
    position: absolute;
    width: 300px;
    height: 300px;
    top: 2rem;
    left: calc(50% - 150px);
    margin: 0;
}

.textbox-wrapper {
    position: absolute;
    display: -webkit-box;
    display: flex;
    width: 100%;
    margin: 0 auto;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    -webkit-box-pack: end;
    justify-content: flex-end;
    padding: 0;
	bottom:4rem;
	left: auto;
	right:auto
}

.textbox h1 {
    font-size: calc(.5rem + 5vmin);
    line-height: 1;
    text-align: center;
    color: #f8f8f8;
    font-family: TTBerlinerins-Grotesk;
    font-weight: normal;
    font-style: normal;

}


.textbox p {
    font-size: calc(.5rem + 1.2vmin);
    line-height: 1.4;
    text-align: center;
    color: #f8f8f8;
    font-family: TTMussels-Medium;
    font-weight: normal;
    font-style: normal;
}

.textbox p a{
	color: #f8f8f8;
	text-decoration: underline
}

.textbox p a:hover{
	color: #f8f8f8;
	text-decoration: none
}
/************************************************************************************
*
* Flickity Slider
*
************************************************************************************/

/*! Flickity v2.0.8
http://flickity.metafizzy.co
---------------------------------------------- */

.flickity-enabled {
    position: relative
}

.flickity-enabled:focus {
    outline: 0
}

.flickity-viewport {
    overflow: hidden;
    position: relative;
    height: 100%
}

.flickity-slider {
    position: absolute;
    width: 100%;
    height: 100%
}

.carousel-cell {
    width: 100%;
    position: relative;
}

.background-image-1 {
    width: 100%;
    height: 100vh;
    background-image: url(bg_image/uyc__bg_1.jpg);
    background-size: cover;
    background-position: center center;
}

.background-image-2 {
    width: 100%;
    height: 100vh;
    background-image: url(bg_image/uyc__bg_2.jpg);
    background-size: cover;
    background-position: center center;
}

.background-image-3 {
    width: 100%;
    height: 100vh;
    background-image: url(bg_image/uyc__bg_3.jpg);
    background-size: cover;
    background-position: center center;
}

.background-image-4 {
    width: 100%;
    height: 100vh;
    background-image: url(bg_image/uyc__bg_4.jpg);
    background-size: cover;
    background-position: center center;
}


.flickity-prev-next-button{display:none}
@media only screen and (min-device-width:23em) and (max-device-width:41em) and (orientation: landscape) {
	html,
body {
    overflow: hidden;
    position: relative;
    height: 100%;
}
	
	.logo img {
        position: absolute;
        width: 180px;
        height: 180px;
        top: .5rem;
        left: calc(50% - 90px);
        margin: 0;
    }
	
	.textbox-wrapper {
    
    margin: 0 auto;
 	padding:0 0;
	bottom:4rem;
	left: auto;
		right:auto;
}
	
}

@media screen and (max-width:38em) {
html,
body {
    overflow: hidden;
    position: relative;
    height: 100%;
}
	
    .logo img {
        position: absolute;
        width: 200px;
        height: 200px;
        top: 1rem;
        left: calc(50% - 100px);
        margin: 0;
    }
	
	.textbox-wrapper {
    
    margin: 0 auto;
 	padding:0 0;
	bottom:6rem;
	left: auto;
		right:auto;
}
	
}