@font-face {
	font-family: 'fontawesome';
	src:url('../fonts/fontawesome/fontawesome.eot?-e43dk9');
	src:url('../fonts/fontawesome/fontawesome.eot?#iefix-e43dk9') format('embedded-opentype'),
		url('../fonts/fontawesome/fontawesome.woff?-e43dk9') format('woff'),
		url('../fonts/fontawesome/fontawesome.ttf?-e43dk9') format('truetype'),
		url('../fonts/fontawesome/fontawesome.svg?-e43dk9#fontawesome') format('svg');
	font-weight: normal;
	font-style: normal;
}


.video-content {
  position: absolute;
  top: 28%;
  z-index: 2;
  margin: 0 10%;
  text-align: center;
  width:80%;
  
}

h2.content_heading {
  font-family: 'Open Sans', sans-serif !important;
  margin-bottom: 24px;
  color: #fff;
  font-size: 2.5em;
  font-weight: 700;
  margin:0 auto;
  line-height:1.5em;
}

h3.content_teaser {
  margin-bottom: 15%;
  color: #f2f2f2;
  font-size: 1.75em;
  line-height:1.4em;
  font-weight: 400;
}

.content_btn {
  display: inline-block;
  margin: 0;
  padding: 12px 48px;
  color: #ff3c64;
  font-size: 22px;
  text-decoration: none;
  border: solid 4px #ff3c64;
}





#myVideo{
		position: relative;
		right: 0;
		bottom: 0;
		top:0;
		right:0;
		width: 100%;
		height: auto;
		max-width:100%;
		max-height:100% !important;
		background-size: 100% 100%;
 		background-color: black; /* in case the video doesn't fit the whole page*/
  		background-image: /* our video */;
  		background-position: center center;
  		background-size: contain;
   		object-fit: cover; /*cover video background */
   		z-index:-1;
	}








.scroll-down { text-align:center; bottom:3%; }
.scroll-more {
	color: #fff;
    font-size: 18px;
    letter-spacing: 1px;
	font-weight:normal;
	padding-bottom:10px;
	text-transform:uppercase;
}
	

/* Boucing Arrow Animation */
@keyframes arrowbounce {
	from {
		-webkit-transform:translateY(0);
		-moz-transform:translateY(0);
		transform:translateY(0);
	}
	to {
		-webkit-transform:translateY(-20px);
		-moz-transform:translateY(-20px);
		transform:translateY(-20px);
	}
}
@-moz-keyframes arrowbounce {
	/* Firefox */ from {
		-webkit-transform:translateY(0);
		-moz-transform:translateY(0);
		transform:translateY(0);
	}
	to {
		-webkit-transform:translateY(-20px);
		-moz-transform:translateY(-20px);
		transform:translateY(-20px);
	}
}
@-webkit-keyframes arrowbounce {
	/* Safari and Chrome */ from {
		-webkit-transform:translateY(0);
		-moz-transform:translateY(0);
		transform:translateY(0);
	}
	to {
		-webkit-transform:translateY(-20px);
		-moz-transform:translateY(-20px);
		transform:translateY(-20px);
	}
}
@-o-keyframes arrowbounce {
	/* Opera */ from {
		-webkit-transform:translateY(0);
		-moz-transform:translateY(0);
		transform:translateY(0);
	}
	to {
		-webkit-transform:translateY(-20px);
		-moz-transform:translateY(-20px);
		transform:translateY(-20px);
	}
}
.scrollto {
	padding: 100px 0px 0px 0px;
	display:block;
	color:#FFF;
	text-decoration:none;
	width:200px;
	margin:0 auto;
	border-bottom: none;
}
.scrollto--arrow {
	padding:10px;
}
.scrollto--arrow img {
	animation:arrowbounce 1s alternate infinite;
	-moz-animation:arrowbounce 1s alternate infinite;
	/* Firefox */-webkit-animation:arrowbounce 1s alternate infinite;
	/* Safari and Chrome */-o-animation: arrowbounce 1s alternate infinite;
	/* Opera */
}








.openbox-bg { background-color:#f2f2f2; height:100%; padding:50px 0px; }

.band.OpenBoxHead {
    padding: 70px 0;
    background: #91ddfc;
}



#SaaS {
  background-color:#FFFFFF;
  display: table;
  position: relative;
  width: 100%;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}


#SaaS h2 { font-family: 'Open Sans', sans-serif !important; color: #333; font-size:2.5em; font-weight: 700; margin: 50px 0 0px 0; line-height:1.6em;  }
#SaaS h4 { font-family: 'Open Sans', sans-serif !important; color: #333; font-size: 1.75em; font-weight: 400; margin: 0px 0 10px 0; line-height:1.1em;  }
#SaaS p { line-height:1.6em; margin-bottom: 80px;  }
#SaaS div { line-height:1.4em; margin-bottom: 15px;  }

#SaaS .demo-req { color:#ff3c64; }
#SaaS .demo-req:hover { color:#333; }


#SaaS .demo_btn {
  display: inline-block;
  margin: 0;
  padding: 10px 24px;
  color: #ff3c64;
  font-size: 18px;
  font-weight:bold;
  text-decoration: none;
  border: solid 2px #ff3c64;
}

#SaaS .demo_btn:hover {
	background-color:#ff3c64 !important;
	color:#FFFFFF;
}


.SaaS-question { padding:5px 0 0px 0; margin:0; }
.SaaS-question2 { padding:5px 0 10px 0; margin:0; }

.newsletter-alert { color:#ee747f; padding:6px 0; margin-bottom:10px; }

#cloud {
  background:#f2f2f2 url(../img/background_4.jpg) no-repeat center center fixed; 
  display: table;
  height: 280px;
  position: relative;
  width: 100%;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.pad-section {
  padding: 50px 0;
}

.pad-section-news {
  margin: 3% 0 5% 0;
}

#cloud h2 { font-family: 'Open Sans', sans-serif !important; font-size: 1.6em; color: #333; font-weight: 700; margin: 50px auto 20px auto; line-height:1.5em; }
#cloud h3 { width:60%; font-family: 'Open Sans', sans-serif !important; font-size: 1.3em; color: #333; font-weight: 700; margin: 10px auto 20px auto !important; line-height:1.5em; text-align:center; }
#cloud h4 { font-family: 'Open Sans', sans-serif !important; font-size: 1.1em; color: #333; font-weight: 700; margin: 0px 0 15px 0; line-height:1.3em; }
#cloud p { line-height:1.4em; margin-bottom: 15px;  }
#cloud ol { margin: 0 0 15px 0px; line-height:1.6em; }
#cloud ol li { padding-bottom:5px; }

#cloud .demo_btn {
  display: inline-block;
  margin: 0 auto;
  padding: 10px 24px;
  color: #ff3c64;
  font-size: 18px;
  font-weight:bold;
  text-decoration: none;
  border: solid 2px #ff3c64;
}

#cloud .demo_btn:hover {
	background-color:#ff3c64 !important;
	color:#FFFFFF;
}


#cloud .Get_in_Touch_btn {
  display: inline-block;
  margin: 0 auto;
  padding: 10px 24px;
  font-size: 18px;
  font-weight:bold;
  text-decoration: none;
  background-color:#ff3c64;
  color:#FFFFFF;
  border: solid 2px #ff3c64;
  
}

#cloud .Get_in_Touch_btn:hover {
	/*background-color:#ff3c64 !important;
	color:#FFFFFF;*/
	padding: 10px 24px;
	background:none;
	border: solid 2px #ff3c64;
    color: #ff3c64;
}


.form_fields {
	color:#000000; 
	font-size:15px;
	font-weight: normal !important; 
	font-style: normal !important; 
	background-color: #FFFFFF !important;
	padding:12px 4% !important;	
	border: solid 1px #dadada !important;
	-webkit-border-radius: 0px !important;
	-moz-border-radius: 0px !important;
	border-radius: 0px !important;
	margin: 0 4% 1% 0 !important;
	min-width:50%;
}



.submitbtn {
	min-width:58%;
	display:inline-block;
	text-align:center;
	background-color:#10a25a;
	color:#fff;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	padding: 12px 4% !important;
	margin: 0 4% 1% 0 !important;
	border:none !important;
	
	font-size: 1em;
	font-weight:700;
	
	border-radius:0px !important;
	text-indent:0 !important;
	border:1px solid #dcdcdc !important;
	display:inline-block !important;
	font-style:normal !important;
	line-height:18px !important;
	text-decoration:none !important;
	text-align:center !important;
	cursor: pointer !important;
	background-image: none !important;
	
	transition:all 0.15s linear;
	-webkit-transition:all 0.15s linear;
	-moz-transition:all 0.15s linear;-o-transition:all 0.15s linear;}

.submitbtn:hover {
	color:#fff;
	background:#333;}


.center { text-align:center; }
.right { text-align: right;}

.w90 { width:90%; margin:0 auto; }
.p30 { padding-top:30px; }




.Signup_Partners {  
	padding: 70px 0; 
	position: relative;
	background-color:#ffffff; }
	
.Signup_Partners h3 {
    width: 60%;
    font-family: 'Open Sans', sans-serif !important;
    font-size: 1.3em;
    color: #333;
    font-weight: 700;
    margin: 10px auto 20px auto !important;
    line-height: 1.5em;
    text-align: center; }
	
.Signup_Partners p {
    line-height: 1.4em;
    margin-bottom: 15px;
}

.Signup_Partners .Get_in_Touch_btn {
  display: inline-block;
  margin: 0 auto;
  padding: 10px 24px;
  font-size: 18px;
  font-weight:bold;
  text-decoration: none;
  background-color:#ff3c64;
  color:#FFFFFF;
  border: solid 2px #ff3c64;
  
}

.Signup_Partners .Get_in_Touch_btn:hover {
	/*background-color:#ff3c64 !important;
	color:#FFFFFF;*/
	padding: 10px 24px;
	background:none;
	border: solid 2px #ff3c64;
    color: #ff3c64;
}

	
	

/************************** 4 Steps  - Start **********************/

.step-block {
    float: left;
    width: 100%;
    padding: 90px 0;
    position: relative;
	background-color:#4e4e4e;
}


.step-block h1 { color:#FFFFFF; font-size:34px; font-weight:bold; text-align:center; margin:15px auto; padding-bottom:35px; }


.step::before,
.step {
	-webkit-transition:all 0.4s ease 0s;
		-moz-transition:all 0.4s ease 0s;
		-ms-transition:all 0.4s ease 0s;
		-o-transition:all 0.4s ease 0s;
		transition:all 0.4s ease 0s;
}

.step-info > span::before { background-color: #ee747f; }


.steps-sec { float: left; width: 100%; }
.step { float: left; position: relative; width: 100%; z-index: 0; min-height:350px; }

.step::before {
    background: #171717 none repeat scroll 0 0;
    content: "";
    height: 100%;
    left: 0;
    opacity: 0.9;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 0;
}
.step > img { float: left; width: 100%; }
.steps-sec .row { margin: 0; }
.steps-sec .row > div { padding: 0; }
.step-info { 
    padding: 0 10px;
    position: absolute;
    top: 50%;
    
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);

    z-index: 9;
}
.step-info > span {
    color: #ffffff;
    float: left;

    font-family: 'Oswald', sans-serif !important;
    font-size: 50px;
    font-weight: 900;
    line-height: 73px;
    margin-left:25px;
    margin-bottom: 25px;
    padding-bottom: 0px;
    position: relative;
    width: 100%;
}
.step-info > span::before {
    bottom: 0;
    content: "";
    height: 4px;
    left: 0;
    position: absolute;
    width: 45px;
}
.step-info > h3 {
    color: #fff;
    float: left;
    font-size: 20px;
    margin: 12px 0 20px;
    width: 100%;
	line-height:1.4em;
	text-align:center;
}
.step-info > p {
    color: #d9d9d9;
    float: left;
    margin-bottom: 20px;
    width: 100%;
	text-align:center;
}

.step-info > p img {
    color: #d9d9d9;
    margin-bottom: 0px;
	text-align:center;
}

.steps-sec .row > div:nth-child(2n+4) > .step::before { opacity: 1; }
.steps-sec:hover .step { opacity: 0.8; }
.step:hover { opacity: 1 !important; }




.btn-padding { margin:70px auto 0px auto !important; text-align:center; }
.flat-btn {
    border: 2px solid transparent;
	background-color: none;
	border-color: #fff; 
    color: #fff;
    font-size: 16px;
    font-weight: bold;
    padding: 10px 36px;
	margin:15px auto;
}


.flat-btn:hover { background: #e45966; border-color: #e45966;  color: #fff; text-decoration: none; outline: none; }

/************************** 4 Steps  - End **********************/












@media only screen and (device-width: 768px) {
  .video-content {
  position: absolute;
  top: 10%;
  z-index: 2;
  margin: 0 12%;
  text-align: center;
  width:70%;
}

.content_heading {
  margin-bottom: 24px;
  color: #fff;
  font-size: 44px;
  margin:0 auto;
  line-height:1.8em;
}

.content_teaser {
  margin-bottom: 24px;
  color: #f2f2f2;
  font-size: 18px;
  line-height:1.5em;
}

.content_btn {
  display: inline-block;
  margin: 0;
  padding: 12px 48px;
  color: #ff3c64;
  font-size: 22px;
  text-decoration: none;
  border: solid 4px #ff3c64;
}
  
 
}

@media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:portrait) {
  .scroll-down { visibility:hidden; }
}

@media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:landscape) {
  /* For landscape layouts only */
}






/* ----------- iPhone 5 and 5S ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 568px)
  and (-webkit-min-device-pixel-ratio: 2) {

  .video-content {
  position: absolute;
  top: 16%;
  z-index: 2;
  margin: 0 12%;
  text-align: center;
  width:80%;
}

.content_heading {
  margin-bottom: 28px;
  color: #fff;
  font-size: 20px;
  margin:0 auto;
  line-height:1.8em;
}

.content_teaser {
  margin-bottom: 14px;
  color: #f2f2f2;
  font-size: 12px;
  line-height:1.5em;
}

.content_btn {
  display: inline-block;
  margin: 0;
  padding: 6px 24px;
  color: #ff3c64;
  font-size: 12px;
  text-decoration: none;
  border: solid 2px #ff3c64;
}
 
.step-block h1 { width:90% !important; color:#FFFFFF; font-size:22px !important; font-weight:bold; text-align:center; margin:15px auto; padding-bottom:35px; line-height:1.444em; } 

}


@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {



#OpenBox_Video_content { padding: 30px 10px !important; text-align: center; }
#OpenBox_Video_content h2 { padding-bottom: 15px; font-size: 22px !important; font-weight: 400; margin:0 auto; line-height:1.5em; }
#OpenBox_Video_content p { width:90%; margin: 0 auto 5% auto; color: #fff; font-size: 14px !important; font-weight: 400; }


#SaaS h2 { font-family: 'Open Sans', sans-serif !important; color: #333; font-size: 22px !important; font-weight: 700; margin: 0px auto; line-height:1.6em;  }
#SaaS h4 { font-family: 'Open Sans', sans-serif !important; color: #333; font-size: 20px !important; font-weight: 400; margin: 0px 0 10px 0; line-height:1.3em;  }
#SaaS p { font-size: 14px !important; line-height:1.6em; margin-bottom: 30px !important;  }
#SaaS div { font-size: 14px !important; line-height:1.4em; margin-bottom: 15px;  }



#cloud h2 { width:100%; font-family: 'Open Sans', sans-serif !important; font-size: 22px !important; color: #333; font-weight: 700; margin: 20px auto 50px auto; line-height:1.5em; text-align:center; }
#cloud p { font-size: 14px !important; line-height:1.4em; margin-bottom: 15px;  }

#cloud h3 { width:90%; font-family: 'Open Sans', sans-serif !important; font-size: 21px !important; color: #333; font-weight: 600; margin: 10px auto 20px auto !important; line-height:1.5em; text-align:center; }

#cloud h4 { font-family: 'Open Sans', sans-serif !important; font-size: 20px !important; color: #333; font-weight: 700; margin: 0px 0 15px 0; line-height:1.3em; }
#cloud ol { font-size: 14px !important; margin: 0 0 15px 0px; line-height:1.6em; }
#cloud ol li { padding-bottom:5px; }

#cloud .demo_btn { width:80%; display: inline-block; margin: 0; padding: 10px 24px; color: #ff3c64; font-size: 18px; font-weight:bold; text-decoration: none; border: solid 2px #ff3c64; }
#cloud .demo_btn:hover { background-color:#ff3c64 !important; color:#FFFFFF; }


#OpenBox_Video_Cooking_content { padding: 30px 10px !important; }

#OpenBox_Video_Cooking_content h2 {  padding-bottom: 14px; font-size: 22px !important; font-weight: 700;  margin:0 auto; line-height:1.5em; }

#OpenBox_Video_Cooking_content p { margin: 0 auto 2% auto; width:90% !important; font-size: 14px !important; line-height:1.4em; font-weight: 400; }


.form_fields {
	color:#000000; 
	font-size:14px;
	font-weight: normal !important; 
	font-style: normal !important; 
	background-color: #FFFFFF !important;
	padding:12px 4% !important;	
	border: solid 1px #dadada !important;
	-webkit-border-radius: 0px !important;
	-moz-border-radius: 0px !important;
	border-radius: 0px !important;
	margin: 0 4% 1% 0 !important;
	width:90%;
}



.submitbtn {
	min-width:99%;
	display:inline-block;
	text-align:center;
	background-color:#10a25a;
	color:#fff;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	padding: 12px 4% !important;
	margin: 0 4% 1% 0 !important;
	border:none !important;
	
	font-size: 1em;
	font-weight:700;
	
	border-radius:0px !important;
	text-indent:0 !important;
	border:1px solid #dcdcdc !important;
	display:inline-block !important;
	font-style:normal !important;
	line-height:18px !important;
	text-decoration:none !important;
	text-align:center !important;
	cursor: pointer !important;
	background-image: none !important;
	
	transition:all 0.15s linear;
	-webkit-transition:all 0.15s linear;
	-moz-transition:all 0.15s linear;-o-transition:all 0.15s linear;}

.submitbtn:hover { color:#fff; background:#333; } 


}



@media screen and (max-width: 60em) {

#OpenBox_Video_content { text-align: center; }
#OpenBox_Video_content h2 { padding-bottom: 15px; font-size: 22px !important; font-weight: 400; margin:0 auto; line-height:1.5em; }
#OpenBox_Video_content p { width:90%; margin: 0 auto 5% auto; color: #fff; font-size: 14px !important; font-weight: 400; }



#cloud h2 { width:100%; font-size: 22px !important; color: #333; font-weight: 700; margin: 20px auto 50px auto; line-height:1.5em; text-align:center; }
#cloud p { font-size: 14px !important; line-height:1.4em; margin-bottom: 15px;  }

#cloud h3 { width:90%; font-family: 'Open Sans', sans-serif !important; font-size: 21px !important; color: #333; font-weight: 600; margin: 10px auto 20px auto !important; line-height:1.5em; text-align:center; }

#cloud h4 { font-family: 'Open Sans', sans-serif !important; font-size: 20px !important; color: #333; font-weight: 700; margin: 0px 0 15px 0; line-height:1.3em; }
#cloud ol { font-size: 14px !important; margin: 0 0 15px 0px; line-height:1.6em; }
#cloud ol li { padding-bottom:5px; }

#cloud .demo_btn { width:80%; display: inline-block; margin: 0; padding: 10px 24px; color: #ff3c64; font-size: 18px; font-weight:bold; text-decoration: none; border: solid 2px #ff3c64; text-align:center;}
#cloud .demo_btn:hover { background-color:#ff3c64 !important; color:#FFFFFF; }

#OpenBox_Video_Cooking_content { padding: 30px 10px !important; }

#OpenBox_Video_Cooking_content h2 {  padding-bottom: 14px; font-size: 22px !important; font-weight: 700;  margin:0 auto; line-height:1.5em; }

#OpenBox_Video_Cooking_content p { margin: 0 auto 2% auto; width:90% !important; font-size: 14px !important; line-height:1.4em; font-weight: 400; }

.step-block h1 { width:70%; color:#FFFFFF; font-size:40px; font-weight:bold; text-align:center; margin:15px auto; padding-bottom:35px; line-height:1.5em; }

}
























#OpenBox_Video_container {
  position: relative;
  margin: 0;
  height: 300px;
  background-color: #282828;
  overflow: hidden;
}

#OpenBox_Video {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 1;
  width: 600px;
  height: auto;
/*  background-color: #54453f !important;*/
  background-color: rgba(84, 69, 63, 0.59);
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

#OpenBox_Video_content {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 2;
  padding: 80px 20px;
  text-align: center;
}
#OpenBox_Video_content h2,
#OpenBox_Video_content p,
#OpenBox_Video_content a {
  color: #fff;
  /*text-shadow: -1px 1px 4px rgba(0, 0, 0, 0.6);*/
}
#OpenBox_Video_content h2 {
	font-family: 'Open Sans', sans-serif !important;
	  margin-bottom: 24px;
	  color: #fff;
	  font-size: 2.5em;
	  font-weight: 700;
	  margin:0 auto;
	  line-height:1.5em;
	 }
#OpenBox_Video_content p {
  width:90%;
  margin: 0 auto 10% auto;
  color: #fff;
  font-size: 1.75em;
  line-height:1.4em;
  font-weight: 400;
}
#OpenBox_Video_content a {
  display: inline-block;
  margin: 0;
  padding: 10px 20px;
  font-family: "Roboto Slab", serif;
  -webkit-transition: background 0.3s, color 0.3s, text-shadow 0.3s;
  -moz-transition: background 0.3s, color 0.3s, text-shadow 0.3s;
  -o-transition: background 0.3s, color 0.3s, text-shadow 0.3s;
  transition: background 0.3s, color 0.3s, text-shadow 0.3s;
}
#OpenBox_Video_content a:hover {
  text-shadow: none;
}



@media all and (min-width: 600px) {
  #OpenBox_Video_container {
    height: 480px;
  }

  #OpenBox_Video {
    width: 1024px;
  }

  #OpenBox_Video_content {
    padding: 160px 20px;
  }
  #OpenBox_Video_content h2 {
    font-size: 42px;
  }
  #OpenBox_Video_content p,
  #OpenBox_Video_content a {
    font-size: 18px;
  }
}
@media all and (min-width: 1024px) {
  #OpenBox_Video_container {
    height: 600px;
  }

  #OpenBox_Video {
    width: 1600px;
  }

  #OpenBox_Video_content {
    padding: 200px 20px;
  }
  #OpenBox_Video_content h2 {
    font-size: 54px;
  }
  #OpenBox_Video_content p,
  #OpenBox_Video_content a {
    font-size: 24px;
  }
}






#OpenBox_Video_Cooking_container {
  position: relative;
  margin: 0;
  height: 300px;
  background-color: #282828;
  overflow: hidden;
}

#OpenBox_Video_Cooking {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 1;
  width: 600px;
  height: auto;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

#OpenBox_Video_Cooking_content {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 2;
  padding: 80px 20px;
  text-align: center;
}
#OpenBox_Video_Cooking_content h2,
#OpenBox_Video_Cooking_content p,
#OpenBox_Video_Cooking_content a {
  color: #fff;
  text-shadow: -1px 1px 4px rgba(0, 0, 0, 0.6);
}
#OpenBox_Video_Cooking_content h2 {
	font-family: 'Open Sans', sans-serif !important;
	  margin-bottom: 24px;
	  color: #fff;
	  font-size: 2.5em;
	  font-weight: 700;
	  margin:0 auto;
	  line-height:1.5em;
	 }
#OpenBox_Video_Cooking_content p {
  margin: 0 auto 2% auto;
  width:70%;
  color: #f2f2f2;
  font-size: 1.75em;
  line-height:1.4em;
  font-weight: 400;
}
#OpenBox_Video_Cooking_content a {
  display: inline-block;
  margin: 0;
  padding: 10px 20px;
  font-family: "Roboto Slab", serif;
  -webkit-transition: background 0.3s, color 0.3s, text-shadow 0.3s;
  -moz-transition: background 0.3s, color 0.3s, text-shadow 0.3s;
  -o-transition: background 0.3s, color 0.3s, text-shadow 0.3s;
  transition: background 0.3s, color 0.3s, text-shadow 0.3s;
}
#OpenBox_Video_Cooking_content a:hover {
  text-shadow: none;
}

@media all and (min-width: 600px) {
  #OpenBox_Video_Cooking_container {
    height: 480px;
  }

  #OpenBox_Video_Cooking {
    width: 1024px;
  }

  #OpenBox_Video_Cooking_content {
    padding: 160px 20px;
  }
  #OpenBox_Video_Cooking_content h2 {
    font-size: 42px;
  }
  #OpenBox_Video_Cooking_content p,
  #OpenBox_Video_Cooking_content a {
    font-size: 18px;
  }
}
@media all and (min-width: 1024px) {
  #OpenBox_Video_Cooking_container {
    height: 786px;
  }

  #OpenBox_Video_Cooking {
    width: 1600px;
  }

  #OpenBox_Video_Cooking_content {
    padding: 150px 20px;
  }
  #OpenBox_Video_Cooking_content h2 {
    font-size: 54px;
  }
  #OpenBox_Video_Cooking_content p,
  #OpenBox_Video_Cooking_content a {
    font-size: 24px;
  }
}

















/* General style */
.grid-gallery ul {
	font-family: 'Open Sans', sans-serif !important;
	list-style: none;
	margin: 0;
	padding: 0;
}

.grid-gallery figure {
	margin: 0;
}

.grid-gallery figure img {
	display: block;
	width: 100%;
}

.grid-gallery figcaption h3 {
	font-family: 'Open Sans', sans-serif !important;
	font-weight:700;
	margin: 0;
	padding: 0 0 0.5em;
}

.grid-gallery figcaption p {
	margin: 0;
	line-height:1.4em;
}

/* Grid style */
.grid-wrap {
	max-width: 69em;
	margin: 0 auto;
	padding: 0 1em 1.875em;
}

.grid {
	margin: 0 auto;
}

.grid li {
	width: 16%;
	float: left;
	cursor: pointer;
}

.grid figure {
	padding: 15px;
	-webkit-transition: opacity 0.2s;
	transition: opacity 0.2s;
}

.grid li:hover figure {
	opacity: 0.7;
}

.grid figcaption {
	background: #e4e4e4;
	padding: 15px 5px 10px 5px;
	text-align:center;
	font-size:12px;
	text-indent: -1;
}

/* Slideshow style */
.slideshow {
	position: fixed;
	background: rgba(0,0,0,0.6);
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: 500;
	opacity: 0;
	visibility: hidden;
	overflow: hidden;
	-webkit-perspective: 1000px;
	perspective: 1000px;
	-webkit-transition: opacity 0.5s, visibility 0s 0.5s;
	transition: opacity 0.5s, visibility 0s 0.5s;
}

.slideshow-open .slideshow {
	opacity: 1;
	visibility: visible;
	-webkit-transition: opacity 0.5s;
	transition: opacity 0.5s;
}

.slideshow ul {
	width: 100%;
	height: 100%;
	-webkit-transform-style: preserve-3d;
	transform-style: preserve-3d;
	-webkit-transform: translate3d(0,0,150px);
	transform: translate3d(0,0,150px);
	-webkit-transition: -webkit-transform 0.5s;
	transition: transform 0.5s;
}

.slideshow ul.animatable li {
	-webkit-transition: -webkit-transform 0.5s;
	transition: transform 0.5s;
}

.slideshow-open .slideshow ul {
	-webkit-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
}

.slideshow li {
	width: 660px;
	height: 560px;
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -280px 0 0 -330px;
	visibility: hidden;
}

.slideshow li.show {
	visibility: visible;
}

.slideshow li:after {
	content: '';
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background: rgba(255,255,255,0.8);
	-webkit-transition: opacity 0.3s;
	transition: opacity 0.3s;
}

.slideshow li.current:after {
	visibility: hidden;
	opacity: 0;
	-webkit-transition: opacity 0.3s, visibility 0s 0.3s;
	transition: opacity 0.3s, visibility 0s 0.3s;
}

.slideshow figure {
	width: 100%;
	height: 100%;
	background: #fff;
	border: 20px solid #fff;
	overflow: hidden;
}

.slideshow figcaption {
	padding:0px 30px 20px 0px;
}

.slideshow figcaption h3 {
	font-family: 'Open Sans', sans-serif !important;
	font-weight:700;
	font-size: 200%;
}

/* Navigation */
.slideshow nav span {
	position: fixed;
	z-index: 1000;
	color: #999999;
	text-align: center;
	padding: 0;
	cursor: pointer;
	font-size: 2.2em;
}

.slideshow nav span.nav-prev {
	top: 50%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
}

.slideshow nav span.nav-next {
	top: 50%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
}


.slideshow nav span.nav-prev {
	left: 0;
}
.slideshow nav span.nav-next {
	right: 0;
}

.slideshow nav span.nav-close {
	top: 8%;
	right: 0;
	padding: 0.5em;
	color: #999999;
}

.icon:before,
.icon:after {
	font-family: 'fontawesome';
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

span.nav-prev:before {
	content: "\e601";
}

span.nav-next:before  {
	content: "\e600";
}

span.nav-close:before {
	content: "\e602";
}

/* Info on arrow key navigation */
.info-keys {
	position: fixed;
	top: 10%;
	left: 10px;
	width: 60px;
	font-size: 8px;
	padding-top: 20px;
	text-transform: uppercase;
	color: #000;
	letter-spacing: 1px;
	text-align: center;
}

.info-keys:before,
.info-keys:after {
	position: absolute;
	top: 0;
	width: 16px;
	height: 16px;
	border: 1px solid #000;
	text-align: center;
	line-height: 14px;
	font-size: 12px;
}

.info-keys:before {
	left: 10px;
	content: "\e603";
}

.info-keys:after {
	right: 10px;
	content: "\e604";
}

/* Example media queries (reduce number of columns and change slideshow layout) */

@media screen and (max-width: 60em) {
	/* responsive columns; see "Element sizing" on http://masonry.desandro.com/options.html */
	.grid li {
		width: 33.3%;
	}
	
	.grid-gallery figcaption h3 {
	font-family: 'Open Sans', sans-serif !important;
	margin: 0;
	padding: 0 0 0.5em;
	font-size:14px;
	font-weight:700;
	}

		
	.grid-gallery figcaption p {
	margin: 0;
	line-height:1.4em;
	font-size:12px;
	}


	.slideshow li {
		width: 100%;
		height: 100%;
		top: 0;
		left: 0;
		margin: 0;
	}

	.slideshow li figure img {
		width: auto;
		max-width: 90%;
	}

	.slideshow nav span,
	.slideshow nav span.nav-close {
		font-size: 1.8em;
	}

	.info-keys {
		display: none;
	}
		
	.slideshow nav span.nav-close {
		top: 2%;
		right: 0;
		padding: 0;
		color: #31373a;
	}

}

@media screen and (max-width: 35em) {
	.grid li {
		width: 50%;
	}
}

@media screen and (max-width: 24em) {
	.grid li {
		width: 100%;
	}
}