
/*BODY {background: #ffffff url(spacer.gif) no-repeat}

@font-face { font-family: "AcariSans-Medium"; src: url("AcariSans-Medium.ttf"); }
@font-face { font-family: "MinionPro-Regular"; src: url("MinionPro-Regular.otf"); }
*/

@font-face { font-family: "Lato-Regular"; src: url("Lato-Regular.ttf"); }

BODY {
	background: #ffffff url(backgroundWhite.jpg) no-repeat center center fixed;
	width: 100%;
	height: 100%;
	background-size: cover;
	}
	
	

A:link {color:#CD1540; text-decoration:none;}
A:visited {color:#CD1540; text-decoration:none;}
A:hover {color:#7B7B7E; text-decoration:none;}
A:active {color:#7B7B7E; text-decoration:none;}

A.nav:link { color:#ffffff; text-decoration:none; font-size: 24px; font-family: Arial, Helvetica, sans-serif; text-transform: uppercase;}
A.nav:visited { color:#ffffff; text-decoration:none; font-size: 24px; font-family: Arial, Helvetica, sans-serif; text-transform: uppercase;}
A.nav:hover { color:#000000; text-decoration:underline; font-size: 26px; font-family: Arial, Helvetica, sans-serif; text-transform: uppercase;}
A.nav:active { color:#000000; text-decoration:none; font-size: 26px; font-family: Arial, Helvetica, sans-serif; text-transform: uppercase;}

.rounded-corners {
    border-radius: 20px;
}

.mainText {
	font-family: 'Lato-Regular', 'Century Gothic', Futura, 'URW Gothic L', Arial, Helvetica, sans-serif;
	font-size: 20px;
	line-height: 25px;
	font-weight: normal;
	color: #000000;
	text-decoration: none;
	letter-spacing: 1px;
	}
	
.mainTextWhite {
	font-family: 'Century Gothic',Futura,'URW Gothic L', Arial, Helvetica, sans-serif;
	font-size: 20px;
	line-height: 25px;
	font-weight: normal;
	color: #ffffff;
	text-decoration: none;
	letter-spacing: 1px;
	}
	
.frontText {
	font-family: 'Century Gothic',Futura,'URW Gothic L', Arial, Helvetica, sans-serif;
	font-size: 40px;
	line-height: 40px;
	font-weight: normal;
	color: #ffffff;
	text-decoration: none;
	text-transform: uppercase;
	}
	
.textProtfolio {
	font-family: 'Century Gothic',Futura,'URW Gothic L', Arial, Helvetica, sans-serif;
	font-size: 20px;
	line-height: 25px;
	font-weight: normal;
	color: #FFF;
	text-decoration: none;
	letter-spacing: 1px;
	}
	
.textServices {
	font-family: 'Century Gothic',Futura,'URW Gothic L', Arial, Helvetica, sans-serif;
	font-size: 18px;
	line-height: 20px;
	font-weight: normal;
	color: #FFF;
	text-decoration: none;
	letter-spacing: 1px;
	}
	
.headerText1 {
	font-family: 'Century Gothic',Futura,'URW Gothic L', Arial, Helvetica, sans-serif;
	font-size: 26px;
	line-height: 30px;
	font-weight: bold;
	color: #ffffff;
	text-decoration: none;
	text-transform: uppercase;
	}
	
h1 {
	font-family: 'Century Gothic',Futura,'URW Gothic L', Arial, Helvetica, sans-serif;
	font-size: 28px;
	line-height: 30px;
	font-weight: bold;
	color: #343434;
	text-decoration: none;
	text-transform: uppercase;
	}
	
.headerText2 {
	font-family: 'Century Gothic',Futura,'URW Gothic L', Arial, Helvetica, sans-serif;
	font-size: 20px;
	line-height: 22px;
	font-weight: normal;
	color: #ffffff;
	text-decoration: none;
	text-transform: none;
	}

.headerText3 {
	font-family: 'Century Gothic',Futura,'URW Gothic L', Arial, Helvetica, sans-serif;
	font-size: 22px;
	line-height: 30px;
	font-weight: normal;
	color: #40671D;
	text-decoration: none;
	text-transform: none;
	}
	
.headerProtfolio {
	font-family: 'Century Gothic',Futura,'URW Gothic L', Arial, Helvetica, sans-serif;
	font-size: 26px;
	line-height: 30px;
	font-weight: normal;
	color: #ffffff;
	text-decoration: none;
	text-transform: none;
	}
		
.footerText {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 19px;
	line-height: 22px;
	font-weight: normal;
	color: #FFF;
	text-decoration: none;
	}
	
.addressText {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 19px;
	line-height: 22px;
	font-weight: normal;
	color: #FFF;
	text-decoration: none;
	}
	
textarea {
	box-sizing: border-box;
	width: 100%;
}	


.frame
{
padding: 0px;
border: 0px solid #000000;
box-shadow: 1px 1px 2px #ffffff;
border-radius: 0px;
max-width: 100%;
height: auto;
}

.smallframe
{
padding: 0px;
border: 1px solid #CCC;
box-shadow: 1px 1px 2px #ccc;
border-radius: 18px;
}

.resize
{
max-width: 100%;
height: auto;
}


.block
{
padding: 0px;
border: 1px solid #cccccc;
background: #FCB200;
padding: 5px;
box-shadow: 1px 1px 2px #ccc;
border-radius: 12px;
}

.shadow {
     text-shadow: 1px 1px #dbdbdb;
}

.imageFloatText { 
   position: relative; 
   max-width: 100%;
}

h2 { 
   position: absolute; 
   top: 200px; 
   left: 0; 
   width: 100%;
   max-width: 100%; 
}

a.bigbutton {
	margin: 0.25em;
	margin-bottom: 3px;
	margin-top: 3px;
	display: inline-block;
	background: #343434;
	border: 0px solid #cdcdcd;
	text-align: center;
	text-decoration: none;
	color: #ffffff;
	padding: 5px;
	font: bold 14px/120%  "Lucida Grande", Arial, Helvetica, sans-serif;
	border-radius:0px;
	box-shadow:
		3px 3px 12px #cdcdcd,
		0px 0px 3px #cdcdcd,
		inset 0px 5px 12px #343434,
		inset 0px 15px 2px #343434,
		inset 0px 25px 25px #343434;
	}
	
a.bigbuttonGreen {
	margin: 0.25em;
	margin-bottom: 3px;
	margin-top: 3px;
	display: inline-block;
	background: #BADFCA;
	border: 0px solid #cdcdcd;
	text-align: center;
	text-decoration: none;
	color: #000000;
	padding: 5px;
	font: bold 14px/120%  "Lucida Grande", Arial, Helvetica, sans-serif;
	border-radius:0px;
	box-shadow:
		3px 3px 12px #cdcdcd,
		0px 0px 3px #cdcdcd,
		inset 0px 5px 12px #BADFCA,
		inset 0px 15px 2px #BADFCA,
		inset 0px 25px 25px #BADFCA;
	}
	
a.bigbuttonOrange {
	margin: 0.25em;
	margin-bottom: 3px;
	margin-top: 3px;
	display: inline-block;
	background: #F4DABF;
	border: 0px solid #cdcdcd;
	text-align: center;
	text-decoration: none;
	color: #000000;
	padding: 5px;
	font: bold 14px/120%  "Lucida Grande", Arial, Helvetica, sans-serif;
	border-radius:0px;
	box-shadow:
		3px 3px 12px #cdcdcd,
		0px 0px 3px #cdcdcd,
		inset 0px 5px 12px #F4DABF,
		inset 0px 15px 2px #F4DABF,
		inset 0px 25px 25px #F4DABF;
	}

a.bigbuttonPink {
	margin: 0.25em;
	margin-bottom: 3px;
	margin-top: 3px;
	display: inline-block;
	background: #EAC2B8;
	border: 0px solid #cdcdcd;
	text-align: center;
	text-decoration: none;
	color: #000000;
	padding: 5px;
	font: bold 14px/120%  "Lucida Grande", Arial, Helvetica, sans-serif;
	border-radius:0px;
	box-shadow:
		3px 3px 12px #cdcdcd,
		0px 0px 3px #cdcdcd,
		inset 0px 5px 12px #EAC2B8,
		inset 0px 15px 2px #EAC2B8,
		inset 0px 25px 25px #EAC2B8;
	}

a.bigbuttonYellow {
	margin: 0.25em;
	margin-bottom: 3px;
	margin-top: 3px;
	display: inline-block;
	background: #ECEAC2;
	border: 0px solid #cdcdcd;
	text-align: center;
	text-decoration: none;
	color: #000000;
	padding: 5px;
	font: bold 14px/120%  "Lucida Grande", Arial, Helvetica, sans-serif;
	border-radius:0px;
	box-shadow:
		3px 3px 12px #cdcdcd,
		0px 0px 3px #cdcdcd,
		inset 0px 5px 12px #ECEAC2,
		inset 0px 15px 2px #ECEAC2,
		inset 0px 25px 25px #ECEAC2;
	}
	
a.bigbuttonBlue {
	margin: 0.25em;
	margin-bottom: 3px;
	margin-top: 3px;
	display: inline-block;
	background: #AFDDEF;
	border: 0px solid #cdcdcd;
	text-align: center;
	text-decoration: none;
	color: #000000;
	padding: 5px;
	font: bold 14px/120%  "Lucida Grande", Arial, Helvetica, sans-serif;
	border-radius:0px;
	box-shadow:
		3px 3px 12px #cdcdcd,
		0px 0px 3px #cdcdcd,
		inset 0px 5px 12px #AFDDEF,
		inset 0px 15px 2px #AFDDEF,
		inset 0px 25px 25px #AFDDEF;
	}

a.bigbuttonRed {
	margin: 0.25em;
	margin-bottom: 3px;
	margin-top: 3px;
	display: inline-block;
	background: #cd1a46;
	border: 0px solid #cdcdcd;
	text-align: center;
	text-decoration: none;
	color: #000000;
	padding: 5px;
	font: bold 14px/120%  "Lucida Grande", Arial, Helvetica, sans-serif;
	border-radius:0px;
	box-shadow:
		3px 3px 12px #cdcdcd,
		0px 0px 3px #cdcdcd,
		inset 0px 5px 12px #cd1a46,
		inset 0px 15px 2px #cd1a46,
		inset 0px 25px 25px #cd1a46;
	}

.container2Column {
  clear: both;
  padding: 10px;
  margin: 10px;
  overflow:hidden;
 }
 
.profile2_1 {
  background-color: #;
}
.profile2_2 {
  background-color: #;
}

@media only screen and (min-width: 680px) {
.span2 {
  width: 48.4%;
}
.col2 {
  display: block;
  float: left;
  margin: 1% 0 1% 1.6%;

}
.col2:first-child {
  margin-left: 0px;
}
}


.container3Column {
  clear: both;
  padding: 0px;
  margin: 0px;
  overflow:hidden;
 }
.profile3_1 {
  background-color: #;
 }
.profile3_2 {
  background-color: #;
}
.profile3_3 {
  background-color: #;
}

@media only screen and (min-width: 480px) {
 .span3 {
  width: 32.2%;
}
.col3 {
  display: block;
  float: left;
  margin: 1% 0 1% 1.6%;
}
.col3:first-child {
 margin-left: 0;
}
}

.container4Column {
  clear: both;
  padding: 0px;
  margin: 0px;
  overflow:hidden;
 }
.profile4_1 {
  background-color: #;
 }
.profile4_2 {
  background-color: #;
}
.profile4_3 {
  background-color: #;
}
.profile4_4 {
  background-color: #;
}

@media only screen and (min-width: 480px) {
 .span4 {
  width: 23.9%;
}
.col4 {
  display: block;
  float: left;
  margin: 1% 0 1% 1.6%;
}
.col4:first-child {
 margin-left: 0;
}
}

.overlayone{
      width: 400px;
      height: 300px;
      display: inline-block;
      position: relative;
    }
	
	 
	
.overlayinn {
      background-color: rgba(119, 126, 132, 0.5);
      height: 100%;
      width: 100%;
      opacity: 0;
      top: 0px;
      left: 0px;
      position: absolute;
      padding: 0px;
      transition: opacity .5s;
    }
	
.overlayinn:hover {
      opacity: 1;
      transition: opacity .5s;
    }
	
.floatBoxServices {
  display: inline-block;
  position: relative;
  width: 260px;
  height: 400px;
  margin: 4px;
  vertical-align: top;
}

.floatBoxProducts {
  display: inline-block;
  position: relative;
  width: 300px;
  height: 500px;
  margin: 20px;
  padding: 20px;
  vertical-align: top;
  border-style: solid;
  border-color: black;
}

.floatBoxLogos {
  display: inline-block;
  position: relative;
  width: 400px;
  height: 300px;
  margin: 40px;
  padding:20px;
  background-color:#FFF;
}

input[type=text] {
  width: ;
  padding: 6px 6px;
  margin: 8px 0;
  font-size: 18px;
  box-sizing: border-box;
}
input[type=submit] {
  width: ;
  padding: 6px 6px;
  margin: 8px 0;
  font-size: 18px;
  box-sizing: border-box;
}
select {
   font-size: 18px;
}



#videowrapper{  
    position: relative;
    overflow: hidden;
} 

#fullScreenDiv{
    min-height: 100%; 
    height: 100vh;
    width: 100vw;
    padding:0;
    margin: 0;
    background-color: gray;
    position: relative;
}

#video{    
    width: 100vw; 
    height: auto;
    margin: auto;
    display: block;
}
@media (min-aspect-ratio: 16/9) {
  #video{
    width: 100vw; 
    height:auto;
  }
}

@media (max-aspect-ratio: 16/9) {
  #video {
    height: 100vh; 
    width:auto;
    margin-left: 50vw;
    transform: translate(-50%);
  }
}

#videoMessage{
    width: 100%; 
    height: 100%;
    position: absolute; 
    top: 0; 
    left: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}