/*
Theme Name: dpx uikit theme - ostsee-ferienzeit.de
Theme URI: http://www.diplexa.de/
Author: dpx/JHM
Author URI: http://www.diplexa.de/
Description: wordpress uikit theme // prefix: dpxt // plugins: ACF (PRO), dpx Booking
Version: 0.0.2
Text Domain: dpxt
*/

@import url('https://fonts.googleapis.com/css?family=Work+Sans');


h1, .uk-navbar-brand {
	font-family: 'Work Sans', sans-serif;
}

h2, h3, h4 {
	font-family: 'Work Sans', sans-serif;
	color: #8E9CAF;
}

em {
	color: #000000;
}


@media (max-width: 768px) {
	.uk-container {
		padding-left: 0;
		padding-right: 0;
		margin-left: 0;
		margin-right: 0;
	}
	.dpxt_start,
	.dpxt_post {
		padding-left: 10px;
		padding-right: 10px;
	}
	h2 {
		font-size: 30px;
	}
}

@media (max-width: 500px) {
	h2 {
		font-size: 20px;
	}
	h3 {
		font-size: 16px;
	}
	html {
		font-size: 12px;
	}
}


/* uk */

.uk-navbar {
    background: #fff;
}

.uk-navbar a {
    color: #6b7d95 !important;
}

.uk-navbar div {
    color: #6b7d95 !important;
}

.uk-button {
    background: #fff;
	color: #6b7d95 !important;
}

.uk-table {
	/*table-layout: fixed !important;*/
	border-collapse: separate !important;
	border-spacing: 1px !important;
	background: #fff;
	color: #333;
}


/* dpxt_... */

.dpxt_content {
	padding-bottom: 60px;
	background: #fff;/*#E9F2FF;*/
}


.dpxt_post {
	background: #fff;/*#E9F2FF;*/
}

.dpxt_post_title {
	color: #8E9CAF;
	margin-bottom: 30x;
}

@media (max-width: 900px) {
	.dpxt_menu .uk-navbar-nav > li > a {
		padding-left: 8px;
		padding-right: 8px;

	}
}

.dpxt_widget {
	max-width: 700px;
}

.dpxt_widget a {
	text-decoration: none;
}

.dpxt_widget h2 {
	margin-bottom: 20px;
}

.dpxt_widget ul {
	padding-left: 0px;
	list-style-type: none;
}

.dpxt_widget li {
	margin-top: 10px;
	margin-bottom: 10px;
}

.dpxt_widget ul a.rsswidget {
	background-color: #f5f5f5;
	padding: 10px;
	margin-bottom: 10px;
	text-decoration: none;
}
.dpxt_widget ul div.rssSummary {
	padding: 10px;
	margin-bottom: 10px;
}


/* dpxt_start... */

.dpxt_title {
	background: #fff;/*#E9F2FF;*/
}

.dpxt_title > h1 > a {
    color: #8E9CAF !important;
	font-weight: 300;
	font-size: 24px;
	text-decoration: none;
}
.dpxt_start {
	width: 100%;
	height: 400px;
}

.dpxt_start_text {
	padding-top: 50px;
}

.dpxt_start_text h1 {
	color: #fff;
	/*text-shadow: 0px 0px #333333;*/
	font-weight: 300;
	font-size: 3.5em;
}

.dpxt_start_text h2 {
	color: #fff;
	/*text-shadow: 0px 0px #333333;*/
	font-weight: 300;
	font-size: 2.5em;
	margin-top: 40px;
}

.dpxt_start_text p {
	color: white;
	font-size: 1.5em;
}

/* dpxb (plugin: dpx Booking) */
.dpxb-calendar {
	font-size: 12px;
}

.dpxb-calendar td {
	padding: 3px 6px;
	text-align: center;
}

.dpxb-day-white {
	background-color: grey;
	color: white;
}

.dpxb-day-green {
	background-color: #a0d4b1;
	color: white;
}

.dpxb-day-booking {
	background-color: #d6ffca;
	color: black;
}

.dpxb-day-red {
	background-color: #ff4a4a;
	color: white;
}

/* dpxc (plugin: dpx Contact) */

.uk-modal-dialog .uk-button,
.uk-modal-dialog .uk-button:focus,
.dpxb .uk-button,
.dpxb .uk-button:focus,
.dpxc .uk-button,
.dpxc .uk-button:focus {
	background: #4E627F;
	color: white !important;
}

.uk-modal-dialog .uk-button:hover,
.dpxb .uk-button:hover,
.dpxc .uk-button:hover {
	background-color: #f5f5f5;
	color: #444 !important;
}

#dpxc_captcha {
	max-width: 600px;
}

.cimg,
.dpxc_captcha_img {
	padding: 5px;
	background-color: #ffffff;
	border-style: solid;
	border-width: 2px;
	border-color: #ffffff;
}

.dpxb_captcha_active,
.dpxc_captcha_img_active {
	border-color: #4E627F;
}


/* Style the tab OT 24062019 */
.tab {
	overflow: hidden;
	border: none;
	background-color: inherit;
}

/* Style the buttons that are used to open the tab content */
.tab button {
	background-color: rgb(233, 242, 255);
	float: left;
	border: 1px solid rgb(160, 212, 177);
	outline: none;
	cursor: pointer;
	padding: 14px 16px;
	margin: 2px;
	transition: 0.3s;
}

/* Change background color of buttons on hover */
.tab button:hover {
	background-color: rgb(214, 255, 202);
}
	
/* Create an active/current tablink class */
.tab button.active {
	background-color: rgb(160, 212, 177);
}

/* Style the tab content */
.tabcontent {
	display: none;
	border: none;
}