@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,600,700');

body {
  font-family: 'Open Sans', sans-serif;
  font-size:16px;
  font-weight: 500;
  margin: 0;
  -webkit-font-smoothing: subpixel-antialiased; /* Make Safari font consistent */
     }

h1 {
	font-size:3.8em;
	line-height: 0.8em;
	font-weight:500;
	letter-spacing:-0.05em;
	color:#7b66a7;
	margin-top: 0;
    margin-left: 0.7em;
}

@media (min-width: 600px) {

        h1 {
            font-size:5em;
        }
    }

@media (min-width: 1600px) {

        h1 {
            font-size:7em;
        }
    }

h2 {
    font-size:3em;
    line-height: 1.1em;
    font-weight:700;
    letter-spacing:-0.03em;
    color:#7b66a7;
}

strong {
	font-weight: 700;
}

ul {
	font-size:1.1em;
	margin-left:0px;
	padding-left: 20px;
	overflow: hidden;
}

.box-4 a {
	color:#fff;
	 text-decoration:none;
}

.title-block {
    margin-top: 2em;
    margin-bottom: 2em;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
}

/* Cursor Begins */

    .cursor {
        background-color: #7b66a7;
        height: 2.8em;
        width: 1.4em;
        margin: 0 200px -48px 0;
    }

    @media (min-width: 600px) {
        
			.cursor {
                height: 3.8em;
                width: 1.9em;
                margin-bottom: -64px;
			}
    }

    @media (min-width: 1600px) {
        
			.cursor {
                height: 5em;
                width: 2.5em;
                margin-bottom: -88px;
			}
    }

/* Cursor Ends */

a[href^="tel:"] {
  color: #fff;
  text-decoration: none;
}

input[type="text"],
	input[type="password"],
	input[type="email"],
	select,
	textarea {
		font-family: 'Open Sans', sans-serif;
		-moz-appearance: none;
		-webkit-appearance: none;
		-ms-appearance: none;
		appearance: none;
		border: none;
		border: solid 1px;
		border-radius: 0;
		background-color: #fff;
		color: #000;
		display: block;
		outline: 0;
		padding: 0.75em;
		text-decoration: none;
		width: 100%;
		font-size:1.25em;
		font-weight:300;
		margin-bottom:1em;
		box-sizing: border-box;
	}

		input[type="text"]:invalid,
		input[type="password"]:invalid,
		input[type="email"]:invalid,
		select:invalid,
		textarea:invalid {
			box-shadow: none;
		}

textarea {
	height:8em;
}

/* Button */
	input[type="submit"],
	input[type="reset"],
	input[type="button"],
	button,
	.button {
		-moz-appearance: none;
		-webkit-appearance: none;
		-ms-appearance: none;
		appearance: none;
		-moz-transition: background-color 0.2s ease-in-out;
		-webkit-transition: background-color 0.2s ease-in-out;
		-ms-transition: background-color 0.2s ease-in-out;
		transition: background-color 0.2s ease-in-out;
		border: 0;
		border-radius: 0;
		cursor: pointer;
		display: inline-block;
		font-family: 'Open Sans', sans-serif;
		font-weight: 700;
		font-size:1em;
		padding: 1.5em;
		width:100%;
		text-align: center;
		text-decoration: none;
		white-space: nowrap;
		box-sizing: border-box;
		background-color:#7b66a7;
		color:#fff;
	}

.nav-text {
    font-weight: 700;
}

@media (min-width: 800px) {
			
	input[type="submit"],
	input[type="reset"],
	input[type="button"],
	button,
	.button {
		width:50%;
		align:center;
		}
}

input[type="submit"]:hover,
		input[type="reset"]:hover,
		input[type="button"]:hover,
		button:hover,
		.button:hover {
			background-color: #a294c1;
		}

/* Logo */
			.mdee-logo {
				height:8em;
				width:8em;
				position:absolute;
				top:2em;
				left:2em;
				background-image: url(../../images/mdee-logo.png);
				background-repeat:no-repeat;
				background-size:contain;

			}

			@media only screen and (max-device-width: 980px), screen and (max-width: 980px) {

				.mdee-logo {
					height:6em;
					width:6em;
					position:absolute;
					top:1.2em;
					left:1.2em;
					background-repeat:no-repeat;
					background-size:contain;
				}	
			}
	

.intro {
	font-size:1.1em;
}
	@media (min-width: 800px) {
		.intro {
			font-size:1.2em;
		}
}



.rose-split {
	background-image: url(../../images/rose-split.png);
	color: #fff;
}

.plum-split {
	background-image: url(../../images/plum-split.png);
	color: #fff;
}

.ocean-split {
	background-image: url(../../images/ocean-split.png);
	color: #fff;
}

.emerald-split {
	background-image: url(../../images/emerald-split.png);
	color: #fff;
}


.rose-split,
.plum-split,
.ocean-split,
.emerald-split{
background-position:0%;
	background-repeat: repeat-y;
}

.rose {
	background-color: #de3572;
	color:#fff;
}

.rose-light {
	background-color: #FBEFF3;
}

.black {
	background-color: #000;
	color:#fff;
}

.plum {
	background-color: #7b66a7;
	color:#fff;
}

.plum-light {
	background-color: #dbd7ea;
}

.plum-light-2 {
	background-color: #F1EEF5;
}

.ocean {
	background-color: #3A8AB0;
	color:#fff;
}

.ocean-light {
	background-color: #bdd8e5;
	color:#000;
}

.emerald {
	background-color: #007a62;
	color:#fff;
}

.emerald-light {
	background-color: #b2d7d0;
	color:#000;
}

.emerald-light-2 {
	background-color: #dfefe9;
	color:#000;
}

.light-stone {
	background-color:#e5e1dd;
	color:#000;
}

.plum h2, .rose h2, .black h2, .emerald h2 {
	color:#fff;
}

	@media (min-width: 600px) {
		.rose-split,
		.plum-split,
		.ocean-split,
		.emerald-split {
			background-position:39%;
		}
	}

	@media (min-width: 980px) {
		.rose-split,
		.plum-split,
		.ocean-split,
		.emerald-split{
			background-position:46%;
		}
	}
	
	@media (min-width: 1200px) {
		.rose-split,
		.plum-split,
		.ocean-split,
		.emerald-split{
			background-position:52%;
		}
	}



.margin-bounds {
	width:90%;
	margin: 0 auto;
	max-width: 1200px;
	margin-bottom: 1em;
	padding: 2em 0;
}

.margin-bounds-floats {
	width:94%;
	margin: 0 auto;
	max-width: 1250px;
	margin-bottom: 1em;
}

form {
	max-width: 100%;

}

.box-3,
.box-4 {
	width:96%;
	margin:20px 2%;
}

	@media (min-width: 980px) {
		.box-3 {
			width:46%;
			float:left;
		}
	}

	@media (min-width: 1200px) {
		.box-3 {
			width:29.33%;
		}
	}

	@media (min-width: 600px) {
		.box-4 {
			width:46%;
			float:left;
		}
	}

	@media (min-width: 980px) {
		.box-4 {
			width:29.33%;
		}
	}

	@media (min-width: 1200px) {
		.box-4 {
			width:21%;
		}
	}

.box-3 img,
.box-4 img {
	width:100%;
	height:auto;
}

 


.home-box-3,
.products-box-3 {
	width:96%;
	margin:50px 2%;
}

@media (min-width: 600px) {
		.home-box-3,
		.products-box-3 {
			width:46%;
			float:left;
		}
	}

@media (min-width: 980px) {
		.home-box-3,
		.products-box-3 {
			width:29.33%;
		}
	}

.home-box-3 img,
.products-box-3 img {
	width:50px;
	height:auto;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
	box-sizing: border-box;
	margin-bottom:0.5em;
}

.home-box-3 img {
	border: 15px solid #7b66a7;
}

.products-box-3 img {
	border: 15px solid #007a62;
}

.home-box-3 span,
.products-box-3 span {
	font-size: 1.5em;
}

.home-box-3 h1,
.products-box-3 h1 {
	text-transform:none;
	font-size: 1em;
	line-height: 1.1em;
	letter-spacing: normal;
	color:#000;
	font-weight: 700;
	margin: 0;
}

.home-box-3 p,
.products-box-3 p {
	margin: 0.5em 0;
	min-height:120px;
}


.home-hero p {
	font-size:3em; 
	align-content:5em; 
	line-height:0.8em; 
	letter-spacing:-0.03em; 
	color:#7b66a7; margin:0; 
	max-width:900px;
	padding:0.2em 0; 
}
.home-hero span {
	font-size:3em; 
	line-height:0.8em; 
	letter-spacing:-0.03em; 
	color:#FFF; 
	max-width:900px;
}

	@media (min-width: 600px) {
			.home-hero p {
				font-size:4em;
			}
			.home-hero span {
				font-size:5em; 
			}
		}

	@media (min-width: 980px) {
			.home-hero p {
				font-size:5em;
			}
			.home-hero span {
				font-size:7em; 
			}
		}

.question {
	background-color: #3A8AB0;
	padding: 1.5em;
	letter-spacing: -0.05em;
	font-size:1.6em;
	line-height: 1.2em;
}

	@media (min-width: 980px) {
			.question {
				min-height:200px;
			}
		}

	@media (min-width: 1200px) {
			.question {
				min-height:280px;
			}
		}


.question span {
	color:#000;
	
}

.question p {
	color:#fff;
	margin:0;
}

.who-we-are,
.what-we-offer,
.contact-us,
.worry-free-payments,
.partner-with-us {
	width:100%;
	height:400px;
	background-position:center;
	background-size: cover;
}

.who-we-are {
	background-image: url("../../images/mdee-offices-22.jpg");
}

.what-we-offer {
	background-image: url("../../images/what-we-offer.jpg");
}

.worry-free-payments {
	background-image: url(../../images/worry-free-payments.jpg);
}

.partner-with-us {
	background-image: url(../../images/partner-with-us.jpg);
}

.contact-us {
	background-image: url(../../images/contact-mdee.jpg);
}

	@media (min-width: 980px) {
			.who-we-are,
			.what-we-offer,
			.contact-us,
			.worry-free-payments,
			.partner-with-us  {
				width:55%;
				height:470px;
				float:right;
				margin-left:3em;
			}
	}

	@media (min-width: 1200px) {
				.who-we-are,
				.what-we-offer,
				.contact-us,
				.worry-free-payments,
				.partner-with-us {
					width:50%;
					height:450px;
					margin-left:5em;
				}
		}

	@media (min-width: 1600px) {
					.who-we-are,
					.what-we-offer,
					.contact-us,
					.worry-free-payments,
					.partner-with-us  {
						width:45%;
						height:450px;
						margin-left:8em;
					}
			}


.video-left {
	width:100%;
	margin: 0 auto;
}

.video-right {
	width:100%;
	margin: 0 auto;
}

.picture-left, 
.picture-right,
.picture-left-wide, 
.picture-right-wide {
	width:70%;
	margin: 0 auto;
}

.picture-left img, 
.picture-right img, 
.picture-left-wide img,
.picture-right-wide img {
	width:100%;
	height:auto;
}

		@media (min-width: 800px) {
			
			
			
			.picture-left, 
			.picture-left-wide  {
					width:50%;
					float:left;
					padding-right:3em;
				}
			
				.picture-right, 
				.picture-right-wide {
					width:50%;
					float:right;
					padding-left:3em;
				}
		}
		
		@media (min-width: 980px) {
			
			.video-left  {
					width:50%;
					float:left;
					padding-right:3em;
				}
			
			.video-right  {
					width:50%;
					float:right;
					padding-left:3em;
				}
			
			.picture-left {
				width:35%;
				float:left;
				padding-right:3em;
			}
			
			.picture-right {
				width:35%;
				float:right;
				padding-left:3em;	
			}

		}

.jem-screen {
  float: right;
  padding: 0 0 2em 2em;
  width: 50%;
}
.jem-screen video {
  width: 100%;
  display: block;
  padding: 0;
}
@media (max-width: 979px) {
  .jem-screen { float: none; width: 100%; padding: 0 0 0 0; }
}
@media (min-width: 980px) {
  .jem-screen {
    width:100%;        /* matches text width */
    float:none;
    margin:0 auto 2em;
    padding:0;
    text-align:center;
  }
  .jem-screen video {
    width:100%;
    max-width:100%;
    display:block;
    margin:0 auto;
  }
}


.what-we-do,
.auto-mate,
.wandera,
.btnet,
.btcloudvoice,
.bt-broadband,
.devicecover,
.mdm,
.m2m,
.mobileiron,
.soti,
.renewd,
.strattoopencell,
.work-at-mdee {
	width:100%;
	height:360px;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}

.what-we-do {
	background-image: url(../../images/what-we-do.jpg);
}

.work-at-mdee {
	background-image: url(../../images/work-at-mdee.jpg);
}

.auto-mate {
	background-image: url(../../images/auto-mate-header.jpg);
}

.wandera {
	background-image: url(../../images/wandera-header.jpg);
}

.btnet {
	background-image: url(../../images/btnet-header.jpg);
}

.btcloudvoice {
	background-image: url(../../images/bt-cloud-voice-header.jpg);
}

.bt-broadband {
	background-image: url("../../images/bt-broadband-bundles-header.jpg");
}

.devicecover {
	background-image: url(../../images/devicecover-header.jpg);
}

.mdm {
	background-image: url("../../images/mdm-header.jpg");
}

.renewd {
	background-image: url("../../images/renewd-header.jpg");
}

.m2m {
	background-image: url("../../images/m2m-header.jpg");
}

.mobileiron {
	background-image: url("../../images/mobileiron-header.jpg");
}

.soti {
	background-image: url("../../images/soti-header.jpg");
}

.strattoopencell {
	background-image: url("../../images/strattoopencell-header.jpg");
}

		@media (min-width: 800px) {
			.what-we-do,
			.auto-mate,
			.wandera, 
			.btnet,
			.btcloudvoice,
			.devicecover,
			.bt-broadband,
			.mdm,
			.m2m,
			.mobileiron,
			.soti,
			.strattoopencell,
            .work-at-mdee {
				height:420px;
			}
		}

		@media (min-width: 980px) {
			.what-we-do,
			.auto-mate,
			.wandera,
			.btnet,
			.btcloudvoice,
			.bt-broadband,
			.devicecover,
			.mdm,
			.m2m,
			.mobileiron,
			.soti,
			.strattoopencell,
            .work-at-mdee {
				height:480px;
			}
		}

		@media (min-width: 1200px) {
			.what-we-do,
			.auto-mate,
			.wandera,
			.btnet,
			.btcloudvoice,
			.bt-broadband,
			.devicecover,
			.mdm,
			.m2m,
			.mobileiron,
			.soti,
			.strattoopencell,
            .work-at-mdee {
				height:560px;
			}
		}

		@media (min-width: 1600px) {
			.what-we-do,
			.auto-mate,
			.wandera,
			.btnet,
			.btcloudvoice,
			.bt-broadband,
			.devicecover,
			.mdm,
			.m2m,
			.mobileiron,
			.soti,
			.strattoopencell,
            .work-at-mdee {
				height:640px;
			}
		}

		@media (min-width: 1920px) {
			.what-we-do,
			.auto-mate,
			.wandera,
			.btnet,
			.btcloudvoice,
			.bt-broadband,
			.devicecover,
			.mdm,
			.m2m,
			.mobileiron,
			.soti,
			.strattoopencell,
            .work-at-mdee {
				height:720px;
			}
		}


.soti-insurance img {
	width:80%;
	height: auto;
	margin: 2em 10% 0 10%;
}

	@media (min-width: 600px) {
				.soti-insurance img {
				width:60%;
				margin: 2em 20% 0 20%;
			}
		}

	@media (min-width: 800px) {
		.soti-insurance img {
				width:50%;
				margin: 2em 25% 0 25%;
			}
		}

	@media (min-width: 980px) {
				.soti-insurance {
					float:right;
					padding-left:3em;
				}
				.soti-insurance img {
				width:100%;
				max-width:200px;
				margin: auto;
				text-align: right;
			}
		}

.quote {
	width: 100%;
	margin: 0 auto;
}

.quote img {
	width:100%;
	height:auto;
}

	@media (min-width: 600px) {
				.quote {
					width: 80%;
				}
		}

	@media (min-width: 800px) {
				.quote {
					width: 60%;
				}
		}

	@media (min-width: 980px) {
			.quote {
			width: 40%;
			float:left;
			padding-right:3em;
		}
}
		
	@media (min-width: 1200px) {
		.quote {
			width: 30%;
			float:left;
			padding-right:3em;
		}
}


.someone-says-pink {
	background-color: #f8d5db;

}

.someone-says-ocean {
	background-color: #bdd8e5;

}

.someone-says-plum {
	background-color: #d3cce2;

}

.someone-says-emerald {
	background-color: #b2d7d0;

}

.someone-says-pink,
.someone-says-plum,
.someone-says-ocean,
.someone-says-emerald {
	width:80%;
	padding:5% 10%;
	color:#000;
}

	@media (min-width: 600px) {
			.someone-says-pink,
			.someone-says-plum,
			.someone-says-ocean,
			.someone-says-emerald {
				width:40%;
				background-color:transparent;
				padding:0;
				float: right;
			}
	}
	
	@media (min-width: 980px) {
			.someone-says-pink,
			.someone-says-plum,
			.someone-says-ocean,
			.someone-says-emerald{
				width:55%;
			}
	}
	
	@media (min-width: 1200px) {
			.someone-says-pink,
			.someone-says-plum,
			.someone-says-ocean,
			.someone-says-emerald {
				width:60%;
			}
	}

.left-column {
	width:100%;
}

.right-column {
	width:100%;
}

@media (min-width: 800px) {
	
			.left-column {
				width:47%;
				float:left;
				padding-bottom:2em;
			}

			.right-column {
				width:47%;
				float:right;
				padding-bottom:2em;
			}
	}


table.table-product {
	border-collapse: collapse;
	margin-bottom:2em;
}

table, th, td {
 	border: 1px solid #bdb3aa;
	padding: 5px;
}

table.table-product th {
	background-color: #007a62;
	color: #fff;
	text-align:left;
}

table.table-product tr {
		
}

table.table-product td {
	color: #7b6856;
}

.map-holder {
  overflow: hidden;
  position: relative;
  padding-top:250px;
  padding-bottom:250px;
}
.map-holder iframe {
  border: none;
  position: absolute;
  width: 100%;
  height: 180%;
  top: -40%;
  left: 0;
  z-index: 1;
}
.map-holder:before {
  content: '';
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 2;
}
.map-holder.interact:before {
  width: 0;
}
.map-holder.inline {
  height: 500px;
  overflow: hidden;
}
.map-canvas {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
}

.icon-container {
    display: flex; 
    flex-wrap: wrap; 
    justify-content:space-between;
}

.icons {
    width:44%;
    text-align: center;
    margin-bottom:2em;
}

.icons img {
    width:60%;
    height:auto;
}

.icons p {
    font-weight: bold; 
    font-size: 1.2em;
    line-height:1.3em;
}
.icons br {
    display: none;
}

@media (min-width: 600px) {
    .icons br {
        display:block;
    }
}

@media (min-width: 800px) {
    .icon-container {
        justify-content:space-around;
    }

    .icons {
        width:26%;
    }

    .icons p {
        max-width: 250px;
        margin:0.5em auto;
}
}

.footer {
	background-color:#000;
	border-top: 14px solid #7b66a7;
	position:relative;
}

.footer-contact {
	color:#FFF;
	text-align: center;
	padding-top: 2em;
}

.footer-smallprint {
	color: #fff;
	font-size:12px;
	border-top:1px solid #fff;
	padding:15px;
	box-sizing: border-box;
}

.footer-smallprint a {
	color: #fff;
	text-decoration: none;
}

.partner-logos {
	width:60%;
	margin:0 auto;
	height:136px;
	background-image:url(../../images/partner-logos.png);
	background-size:contain;
	background-repeat:no-repeat;
	background-position: center;
	max-width:320px;
}

	@media (min-width: 900px) {
			.partner-logos {
				width:50%;
			}
		}

.love-our-partners-a,
.love-our-partners-b {
	margin: 30px auto auto auto;
	height:120px;
    width: 120px;
	background-image:url("../../images/love-our-partners.svg");
	background-repeat:no-repeat;
	background-position: center;
	max-width:320px;
}

.love-our-partners-b {
    display: none;
}

	@media (min-width: 800px) {
        
            .love-our-partners-a {
                display: none;
            }
        
            .love-our-partners-b {
                display: block;
				margin:  18px auto;                
                height: 100px;
                width: 100px;
            }
    }

	@media (min-width: 800px) {
			.footer {
				height:186px;
			}
		
			.footer-contact {
				float:right;
				margin-right:1em;
				text-align: right;
			}
		
			.partner-logos {
				float:left;
				margin-left:1em;
			}
		
			.footer-smallprint {
				width:100%;
				position:absolute;
				bottom:0;
				left:0;
				padding: 15px 30px;
			}
    }

	@media (min-width: 980px) {
			.footer-contact {
				margin-right:2em;
			}
		
			.partner-logos {
				max-width:380px;
				margin-left:2em;
			}
    }

	.desktop-only {
		visibility: hidden;
		height:0px;
		overflow:hidden;
	}

		@media (min-width: 980px) {
			.desktop-only {
				visibility:visible;
				height:auto;
			}
		}	

    .mobile-only {
        visibility:visible;
        height:auto;
    }

		@media (min-width: 980px) {
			.mobile-only {
				visibility:hidden;
				height:0px;
				overflow:hidden;
			}
		}
	
    input.has-error{
        border: 2px solid red;
        background-color: rgb(255,220,220);
    }	

/* Post */

	.post {
		display: -moz-flex;
		display: -webkit-flex;
		display: -ms-flex;
		display: flex;
		-moz-flex-direction: column;
		-webkit-flex-direction: column;
		-ms-flex-direction: column;
		flex-direction: column;
		-moz-align-items: stretch;
		-webkit-align-items: stretch;
		-ms-align-items: stretch;
		align-items: stretch;
		margin-bottom: 1.5em;
		position: relative
	}

		@media screen and (max-width: 640px) {
			.post {
				display: block;
			}
		}

.post h3 {
	margin:0;
	font-size:1.1em;
	font-weight:300;
	border-bottom:1px solid #7b66a7;
}

/* Posts */

	.posts {
		display: -moz-flex;
		display: -webkit-flex;
		display: -ms-flex;
		display: flex;
		-moz-flex-wrap: wrap;
		-webkit-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
		-moz-justify-content: space-between;
		-webkit-justify-content: space-between;
		-ms-justify-content: space-between;
		justify-content: space-between;
		-moz-align-items: stretch;
		-webkit-align-items: stretch;
		-ms-align-items: stretch;
		align-items: stretch;
		margin-top:2em;
		
	}

		.posts .post {
			width: calc(50% - 3em);
		}

		@media (min-width: 980px) {
		.posts .post {
			width: calc(33% - 3em);
			}
		
		}

		@media screen and (max-width: 640px) {
			.posts {
				display: block;
			}

			.posts .post {
				width: 100%;
			}
		}


/* Products & Services */

	.product {
		display: -moz-flex;
		display: -webkit-flex;
		display: -ms-flex;
		display: flex;
		-moz-flex-direction: column;
		-webkit-flex-direction: column;
		-ms-flex-direction: column;
		flex-direction: column;
		-moz-align-items: stretch;
		-webkit-align-items: stretch;
		-ms-align-items: stretch;
		align-items: stretch;
		margin-bottom: 1.5em;
		position: relative
	}

		@media screen and (max-width: 640px) {
			.product {
				display: block;
			}
		}

.product img {
	width:90%;
	height:auto;
	border: 15px solid #007a62;
}

.product span {
	font-size: 1.5em;
}

.product h3 {
	margin:0;
	font-size:1.1em;
	font-weight:300;
	border-bottom:1px solid #7b66a7;
}

.tandcs {
	border: 15px solid #C2C2C2;
}

/* Posts */

	.products {
		display: -moz-flex;
		display: -webkit-flex;
		display: -ms-flex;
		display: flex;
		-moz-flex-wrap: wrap;
		-webkit-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
		-moz-justify-content: space-between;
		-webkit-justify-content: space-between;
		-ms-justify-content: space-between;
		justify-content: space-between;
		-moz-align-items: stretch;
		-webkit-align-items: stretch;
		-ms-align-items: stretch;
		align-items: stretch;
		margin-top:2em;
		
	}

    .products .product {
        width: calc(50% - 3em);
    }

    @media (min-width: 980px) {
    .products .product {
        width: calc(33% - 3em);
        }

    }

    @media screen and (max-width: 640px) {
        .products {
            display: block;
        }

        .products .product {
            width: 100%;
        }
    }

/* Making YouTube fit */

.videoplayer{
    text-align: center;
    vertical-align: middle;
    background-color:#000000;
    margin: 0;
    padding: 0;
    width: 100%;
    height:auto;
    overflow:hidden;
    top: 0;
    bottom: 0;
}

.auto-resizable-iframe {
    width:100%;
    max-width:100%;
    margin: 0 auto;
	background-color:#000000;
}

.auto-resizable-iframe > div {
    position: relative;
    padding-bottom:56.2%;
    height: 0px;
}

.auto-resizable-iframe iframe {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
}

.video-desktop {
	visibility: hidden;
	height:0;
}

.video-mobile {
		visibility: visible;
		height:auto;
	}

@media (min-width: 800px) {
	.video-desktop {
		visibility: visible;
		height:auto;
	}
	
	.video-mobile {
		visibility: hidden;
		height:0;
	}
}

@media (max-width: 620px) {

    .containerblock {
        margin-top: 1em;
        margin-bottom: -1em;
    }
    
    .blockimg {
        margin-bottom: -1em;
    }
    
}