/*
Theme Name: dotTheme
Theme URI: https://dotsolutions.nl
Author: dotsolutions
Author URI: https://dotsolutions.nl
Version: 1.0
*/

body {
	-webkit-font-smoothing: subpixel-antialiased;
	-moz-osx-font-smoothing: grayscale;
	font-family: 'Montserrat', sans-serif;
}

.row {
	max-width:72.5rem;
}

ul {
	list-style-position: inside;
}

h1 {
	font-size: 36px;
	color: #00beee;
		font-family: 'Poppins', sans-serif;
}

h2 {
	font-size: 30px;
	font-weight: 700;
	color: #00beee;
	font-family: 'Poppins', sans-serif;
}

h3 {
	font-size: 24px;
	font-weight: 700;
	color: #00beee;
	font-family: 'Poppins', sans-serif;
}

p {
	margin-bottom: 0;
	color: #4d4d4d;
	font-family: 'Poppins', sans-serif;
}
ul {
	margin-left: 0;
}

a {
	color: #00beee;
}

a:hover {
	color: #f77e08;
}


.no-padding {
	padding: 0;
}


.full {
	width: 100%;
}

.wpcf7-submit {
	color: #fff;
	padding: 20px;
	font-size: 12px;
	font-weight: 800;
	text-transform: uppercase;
	min-width: 200px;
	letter-spacing: 1.5px;
	background-color: #f77e08;
	border-radius: 0;
	border: none;
	cursor: pointer;
}

.wpcf7-validation-errors {
	border: 0!important;
	margin: 0!important;
	padding: 0!important;
	color: #fff;
}

.wpcf7-submit:hover {
	background-color: #fff;
}

.button, .wpcf7-submit {
	color: #fff;
	padding: 20px 25px;
	font-size: 12px;
	font-weight: 700;
	text-transform: uppercase;
	min-width: 200px;
	border-radius: 3px;
}

.button.blue {
	background-color: #00beee;
}

.button:blue:hover {
	background-color: #f77e08;
}

.wp-block-button__link {
	color: #fff;
	padding: 20px !important;
	font-size: 12px !important;
	font-weight: 800;
	text-transform: uppercase;
	min-width: 200px;
	letter-spacing: 1.5px !important;
	border-radius: 2px !important;
	border: none;
	cursor: pointer;
	background-color: #f77e08 !important;
}

.wp-block-button__link:hover { 
background-color: #fff !important;
color: #f77e08 !important;
}

.dashicons.orange {
	color: #f47320;
}

.button.orange {
	background-color: #f47320;
}
.button.orange:hover {
	background-color: #00beee;
}
#content .row {
	padding-right: 50px;
    padding-left: 50px;
}

.full {
	max-width: 100%;
}

.large {
	max-width: 80%;
}

thead, tbody, tfoot {
	border: 0;
	background-color: unset;
}

tbody tr:nth-child(even) {
	background-color: unset;
}

@media (orientation: landscape) {
	#content {
		padding: 20px 0px;
	}
}
#footer {
	font-size: 15px;
	font-weight: 400;
}

#footer span {
    color: #00beee;
    font-weight: 700;
    font-size: 16px;
    margin-bottom: 13px;
    width: 100%;
    float: left;
}

#footer .social a
{
	font-size: 14px;
	line-height: 30px;
}

#footer ul li {
	list-style:none;
	font-size: 14px;
	line-height: 30px;
}

#footer a {
	color: #f47320;
}

#footer ul li a {
	text-transform: uppercase;
	color: #353535;
}

#copyright .row {
	padding: 20px 40px;
	background-color: #d9d9d9;
}

#copyright p {
	font-weight: 200;
	font-size: 13px;
}

#copyright a {
	color: #4d4d4d;
}

#copyright a:hover {
	color: #f77e08;
}

/* menu top */

#topmenu {
	padding: 10px 0;
}
#topmenu p {
	font-size: 12px;
	font-weight: 400;
}

.logo img {
	padding-left: 20px;
    padding-top: 30px;
}

.maintext p{
	margin-top: 40px;
	margin-bottom: 40px;
	font-size: 18px;
	font-weight: 600;
	color: #4d4d4d;
}

#slider .row{
	position:relative;
}

#diensten .row {
    background-color: #f8f8f8;
    padding: 50px;
}

#diensten img {
	width: 100%;
}

#logo .row {
    background-color: #f8f8f8;
    padding-top: 50px;
    padding-bottom: 50px;
    padding-right: 50px;
    padding-left: 50px;
}


#footer .row {
    background-color: #f8f8f8;
    padding-right: 50px;
    padding-left: 50px;
    padding-bottom: 50px;
}

.slider2 {
	position: relative;
}

.slidertext {
    position: absolute;
    top: 14vh;
    right: 0;
    left: 10vh;
    float: left;
    color: #fff;
}

.slidertext span {
    line-height: 50px;
	font-family: 'Poppins', sans-serif;
	font-weight: 700;
	font-size: 36px;
}

.slidertext a {
	color :#fff;
}

@media (orientation: portrait) {
	#slider h1 {
		margin-top: 10px!important;
	}
}

#slider .medium-offset-1 {
	padding-left: 65px;
}

#slider h1 {
	margin-top: 50px;
	font-weight: 800;
	font-size: 33px;
	line-height: 35px;
	text-transform: uppercase;
}

#slider h1 span {
	color: #f77e08;
}

#slider p {
	padding-bottom: 20px;
}

.flexslider {
	background-color: unset;
	border: 0;
	margin: 0;
	
}
.flex-direction-nav {
	display: none;
}
.flex-control-nav {
	bottom: 20px;
}


.block {
    background-color: #fff;
    padding: 30px;
}

.block span {
	color: #00beee;
	font-size: 18px;
	font-weight: 700;
}

.block p {
	font-size: 13px;
	font-weight: 500;
	margin-top:20px;
}

/* Menu*/

#menu {
	text-align: right;
}

.site-navigation
{
	display: block;
}
.site-navigation ul
{
	display: block !important;
}


.main-navigation {
	position: relative;
	font-family: 'Open Sans', sans-serif;
	font-weight: normal;
	clear: both;
	display: block;
	float: left;
	width: 100%;
	z-index: 999;
	padding-top: 15px;
	/*height: 80px;*/

}
.main-navigation ul {
	list-style: none;
	display: block;
	margin: 0;
	padding-left: 0;
}
.main-navigation li {
	position: relative;
	display: inline-block;
	padding: 10px 10px;
	-webkit-transition: all 0.4;
	transition: all 0.4s;
	cursor: pointer;
	height: 80px;
    line-height: 50px;
}


.main-navigation li:active {
	color: #00beee;
}
.main-navigation li:hover > a {
	color: #00beee;
}

.main-navigation ul li ul li {
	height: 55px;
	line-height: 35px;
}

.main-navigation ul ul li a:hover {
    /*color: #000;
    border-bottom: 0px;*/
}

.main-navigation a {
	display: block;
	text-decoration: none;
	font-size: 14px;
	-webkit-transition: all 0.4;
	transition: all 0.4s;
	font-weight: 600;
	color: #4d4d4d;
	text-transform: uppercase;
}

.main-navigation a:hover {
	color: #00beee;
}
.main-navigation ul ul {
	float: left;
	position: absolute;
	top: 100%;
	left: -999em;
	z-index: 99999;
	text-align: left;
}
.main-navigation ul ul ul {
	left: -999em;
	top: 0;
}
.main-navigation ul ul a {
	width: 200px;
	color: #525252;
	text-transform: uppercase;
}

.main-navigation ul ul:hover {
	color: #fff;
} 

.main-navigation ul ul li {
	padding: 10px;
	text-transform: none;
}
.main-navigation ul ul li:last-child {
	border-bottom: 0;
}
.main-navigation ul li:hover > ul {
	left: 0;
	box-shadow:0px 0px 7px #cecece;
	background-color: #fff;
}
.main-navigation ul ul li:hover > ul {
	left: 100%;
}

.main-navigation ul ul li:hover > a {
	/*color: #fff !important;*/
}

.main-navigation ul ul li:hover {
    color: #fff !important;
}

.main-navigation ul ul li a:hover {
    /*color: #000;*/
}
.main-navigation .current_page_item a,
.main-navigation .current-menu-item a {
	color: #00beee;
}

.flex-control-paging li a.flex-active {
    background: #00beee;
    background: rgb(0, 190, 238);
    cursor: default;
}

.flex-control-paging li a {
	background: #fff;
}


/* Small menu */
.menu-toggle {
	display: none;
	font-size: 25px;
	color: #2a363b;
}

.sub-menu
{
	display: block;
}

@media screen and (max-width: 786px) {
	.sub-menu
	{
		display: none !important;
	}
	
	#content .row {
		padding-top: 50px;
		padding-bottom: 50px;
		padding-left: 0;
		padding-right: 0;
	}
	#logo .row .columns {
		    padding-top: 30px;
			padding-bottom: 30px;
			text-align: center;
	}
	
	.flexslider .slides img {
		height: 300px;
		width: 100%;
		object-fit: cover;
		-moz-user-select: none;
	}
	
	#topmenu {
		text-align: center;
	}
	
	#topmenu .text-right {
		text-align: center;
	}
	
	#footer .row {
		padding-left: 0;
		padding-right: 0;
		text-align: center;
	}
	
	#copyright .row {
		padding-left: 0;
		padding-right: 0;
	}
	
	.slidertext {
		position: absolute;
		top: 4vh;
		right: 0;
		left: 5vh;
		float: left;
		color: #fff;
	}
	
	.slidertext span {
		line-height: 20px;
		font-family: 'Poppins', sans-serif;
		font-weight: 700;
		font-size: 18px;
	}
	
	.main-navigation 
	{
		float: none !important;
	}
	.menu-toggle,
	.main-navigation.toggled .nav-menu {
		display: block;
		z-index: 10;
		height: auto;
		float: right;
		color: #fff;
		padding-left:10px;
		border: none;
		height: 50px;
	}
	.has-banner .main-navigation {
		background-color: #3C3C3C;
	}
	.main-navigation li,
	.has-banner .main-navigation li {
		width: 100%;
		border: 0;
		padding: 10px 0;
		
	}
	.main-navigation li:hover {
		background: transparent !important;
	}
	.main-navigation li:first-child {
		padding-top: 15px;
	}
	.main-navigation ul ul li:hover {
		background-color: transparent;
	}
	.main-navigation ul {
		display: none;
	}
	.main-navigation .children {
		display: none !important;
		float: none;
		position: static;
		border: none;
		background: transparent;
		box-shadow: none;
	}	
}

@media screen and (min-width:768px) and (max-width:1024px) {
	#content .row .medium-8 {
		width: 100%;
	}
	
	#content .row .medium-4 {
		text-align: left;
		margin-top: 30px;
		width: 100%;
	}
	
	#footer .row .medium-3 {
		width: 50%;
		min-height: 250px;
	}
	
	.slidertext {
		position: absolute;
		top: 4vh;
		right: 0;
		left: 5vh;
		float: left;
		color: #fff;
	}
}

@media screen and (min-width:1023px) and (max-width:1366px) {
	.slidertext {
		position: absolute;
		top: 10vh;
		right: 0;
		left: 15vh;
		float: left;
		color: #fff;
	}
}

.menu-button {
	position: absolute;
	width: 25px;
	height: 1px;
	border: 2px solid #000;
	right:0px;
	pointer-events: none;
	transition: border 0.8s;
	-webkit-transition: border 0.8s;

}

.menu-button::before {
	transform: translate3d(0,-10px,0);
	-webkit-transform: translate3d(0,-10px,0);
}
.menu-button::after {
	transform: translate3d(0,6px,0);
	-webkit-transform: translate3d(0,6px,0);
}

.menu-button::before, .menu-button::after {
	content: '';
	position: absolute;
	background: #000;
	border: 2px solid #000;
	will-change: transform;
	left: -2px;
	width: 25px;
	transition: transform 0.6s;
	-webkit-transition: transform 0.6s;
}

.menu-button.open {
	border: 2px solid transparent;
	transition: border 0.3s;
	-webkit-transition: border 0.3s;
}

.menu-button.open::before {
	transform: rotateZ(45deg) translate3d(0,0,0);
	-webkit-transform: rotateZ(45deg) translate3d(0,0,0);
}

.menu-button.open::after {
	transform: rotateZ(-45deg) translate3d(0,0,0);
	-webkit-transform: rotateZ(-45deg) translate3d(0,0,0);
}

.cursor-pointer {
	cursor: pointer;
}

div.qa {
	margin-bottom: 1.5rem;
	padding: 12px;
	background-color: #efefef;
	border-radius: 5px;
}

div.qa > h3 {
	margin-bottom: 0;
}

div.row-container > span {
	width: 50%;
}

div.row-container > span:first-child {
	float: left;
	overflow: hidden;
}
