/**************************************************
******** Reset Common Elements ********************
**************************************************/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockEcom, pre,
a, abbr, acronym, address, big, cite, 
code,del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol,  li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	vertical-align: baseline;
}

/********************************************
******* Page Style and Common HTML **********
*********************************************/
body 
{
	width:100%;
	line-height:1.428;
	font-size:14pt; 
	font-family:Lato;
	color:#000000;
}

.AdjustableWidth
{
  width:100%;
  margin:0 auto;
  display:block;
}

a:link, a:visited, a:hover
{
  padding:0px;
  margin:0px;
  text-decoration:none;
}

a:hover
{
  text-decoration:underline;
}

h1
{
  font-size:1.15em;
  font-weight:bold;
  text-align:center;
  padding-bottom:10px;
}

h2
{
  font-weight:bold;
  font-size:1em;
  padding-left:10px;
  padding-right:10px;
  padding-bottom:3px;
}

h3
{
  font-weight:bold;
  font-size:.85em;
  padding-left:10px;
  padding-right:10px;
  padding-bottom:3px;
  text-align:center;
}

p /* paragraph */
{
  font-size:1em;
  padding-left:10px;
  padding-right:10px;
  margin-bottom:15px;
}

ul
{
  margin:0px;
  margin-top:20px;
  margin-bottom:10px;
  padding-left:30px;
}

.SmallText
{
  color:Red;
  display:inline;
  padding-left:10px;
}

.Warning
{
  color:Red;
}

img
{
  border:0px;
}

/*************************************************
************ IFrame Area *************************
**************************************************/
.IFrameCentering
{
  margin:0 auto;
  display:block;
  height:150px;
  width:300px;
}

@media only screen and (min-width:400px)
{
  .IFrameCentering
  {
    height:250px;
    width:350px;
  }
}

@media only screen and (min-width:500px)
{
  .IFrameCentering
  {
    height:300px;
    width:400px;
  }
}

@media only screen and (min-width:600px)
{
  .IFrameCentering
  {
    height:187.50px;
    width:250px;
  }
}

@media only screen and (min-width:700px)
{
  .IFrameCentering
  {
    height:170px;
    width:300px;
  }
}

@media only screen and (min-width:900px)
{
  .IFrameCentering
  {
    height:225px;
    width:352px;
  }
}

@media only screen and (min-width:1000px)
{
  .IFrameCentering
  {
    height:250px;
    width:350px;
  }
}

@media only screen and (min-width:1200px)
{
  .IFrameCentering
  {
    height:300px;
    width:470px;
  }
}

/********************************************
****** Sets Width for desktop ***************
*********************************************/
@media only screen and (min-width:1200px)
{
  .AdjustableWidth
  {
    width:1200px;
    margin:0 auto;
  }
}

/*************************************************
**************** Header Area *********************
**************************************************/
header
{
  clear:both; 
  width:100%;
  overflow:hidden;
  background-image:url("../images/DesignElements/BGMain.png"); 
  background-repeat:repeat-x repeat-y;
}

header a:link, header a:visited, header a:hover
{
  padding:0px;
}

.LogoArea
{
  clear:both;
  width:95%;
  margin:0 auto;
  display:block;
  padding-top:5px;
  padding-bottom:10px;
}

.PhoneArea
{
  clear:both;
  width:95%;
  color:#32679a;
  margin:0 auto;
  display:block;
  padding-top:5px;
  padding-bottom:10px;
  text-align:center;
  font-size:1em;
}

.LogoArea img
{
  width:auto;
  margin:0 auto;
  display:block; 
}

@media only screen and (min-width:500px)
{
  .LogoArea
  {
    clear:none;
    width:60%;
    float:left;
    
  }
  
  .PhoneArea
  {
    clear:none;
    width:38%;
    font-size:1.25em;
    padding-top:10px;
    float:right;
  }
 
  .LogoArea img
  {
   width:auto;
  }
}

@media only screen and (min-width:600px)
{
  .LogoArea img
  {
   width:auto;
  }
}

/*************************************************
********** Mobile/Desktop Toggle Menu ************
**************************************************/
.MobileToggle
{
  clear:both;
  width:15%;
  margin:0px auto;
  display:block;
  margin-top:10px;
  margin-bottom:10px; 
}

.MobileToggle img
{
  clear:both;
  width:80%;
  margin:0px auto;
  display:block;
}

.MobileLinks
{ 
  display:block;
}

.DeskLinks
{
  display:none;
}

@media only screen and (min-width:500px)
{
  .MobileToggle
  {
    display:none;
  }

  .MobileLinks
  {
    display:none;
  }

  .DeskLinks
  {
    display:block;
  }
}

/**************************************************
*********** Mobile Navigation *********************
**************************************************/
nav
{
  clear:both;
  width:100%;
  display:block;  
}

nav a:link, nav a:visited, nav a:hover
{ 
  clear:both;
  width:95%;
  background-color:#32679a;
	border:1px solid black;
  color:#f0f0f0;
  text-decoration:none;
  text-align:center;
	display:block;
  margin:5px;
}

nav a:hover
{
  color:#de7516;
}

@media only screen and (min-width:400px)
{
  nav a:link, nav a:visited, nav a:hover
  {
    margin-left:10px;
  }
}
 
/**************************************************
*********** Desktop Navigation ********************
**************************************************/
@media only screen and (min-width:500px)
{
  nav
  {
    background-color:#32679a;
  }
  
  nav a:link, nav a:visited, nav a:hover
  { 
	  clear:none;
	  width:100%;
	  font-size:.85em; 	
	  text-align:left;
	  text-decoration:none;
	  background-color:transparent;
    border:0px;
    margin:0 auto;
	  display:inline;
    padding-left:14px;
    padding-right:14px;      
  }
}

@media only screen and (min-width:525px)
{
  nav a:link, nav a:visited, nav a:hover
  {
    padding-left:16px;
    padding-right:16px; 
  } 
}

@media only screen and (min-width:550px)
{
  nav a:link, nav a:visited, nav a:hover
  {
    padding-left:18px;
    padding-right:18px; 
  } 
}

@media only screen and (min-width:575px)
{
  nav a:link, nav a:visited, nav a:hover
  {
    padding-left:21px;
    padding-right:21px; 
  } 
}

@media only screen and (min-width:600px)
{
  nav a:link, nav a:visited, nav a:hover
  {
    padding-left:24px;
    padding-right:24px; 
  } 
}

@media only screen and (min-width:625px)
{
  nav a:link, nav a:visited, nav a:hover
  {
    padding-left:26px;
    padding-right:26px; 
  } 
}

@media only screen and (min-width:650px)
{
  nav a:link, nav a:visited, nav a:hover
  {
    padding-left:29px;
    padding-right:29px; 
  } 
}

@media only screen and (min-width:675px)
{
  nav a:link, nav a:visited, nav a:hover
  {
    padding-left:31px;
    padding-right:31px; 
  } 
}

@media only screen and (min-width:700px)
{
  nav a:link, nav a:visited, nav a:hover
  {
    padding-left:34px;
    padding-right:34px; 
  } 
}

@media only screen and (min-width:725px)
{
  nav a:link, nav a:visited, nav a:hover
  {
    padding-left:36px;
    padding-right:36px; 
  } 
}

@media only screen and (min-width:750px)
{
  nav a:link, nav a:visited, nav a:hover
  {
    padding-left:39px;
    padding-right:39px; 
  } 
}

@media only screen and (min-width:768px)
{
  nav a:link, nav a:visited, nav a:hover
  { 
    font-size:1.25em;
    padding-left:22px; 
    padding-right:22px;
  }
}

@media only screen and (min-width:800px)
{
  nav a:link, nav a:visited, nav a:hover
  { 
    
    padding-left:28px; 
    padding-right:28px;
  }
}

@media only screen and (min-width:825px)
{
  nav a:link, nav a:visited, nav a:hover
  { 
    
    padding-left:30px; 
    padding-right:30px;
  }
}

@media only screen and (min-width:850px)
{
  nav a:link, nav a:visited, nav a:hover
  { 
    
    padding-left:32px; 
    padding-right:32px;
  }
}

@media only screen and (min-width:875px)
{
  nav a:link, nav a:visited, nav a:hover
  { 
    
    padding-left:34px; 
    padding-right:34px;
  }
}

@media only screen and (min-width:900px)
{
  nav a:link, nav a:visited, nav a:hover
  { 
    
    padding-left:38px; 
    padding-right:38px;
  }
}

@media only screen and (min-width:925px)
{
  nav a:link, nav a:visited, nav a:hover
  { 
    
    padding-left:40px; 
    padding-right:40px;
  }
}

@media only screen and (min-width:950px)
{
  nav a:link, nav a:visited, nav a:hover
  { 
    
    padding-left:42px; 
    padding-right:42px;
  }
}

@media only screen and (min-width:975px)
{
  nav a:link, nav a:visited, nav a:hover
  { 
    
    padding-left:44px; 
    padding-right:44px;
  }
}

@media only screen and (min-width:1000px)
{
  nav a:link, nav a:visited, nav a:hover
  { 
    font-size:1.5em;
    padding-left:38px; 
    padding-right:38px;
  }
}

@media only screen and (min-width:1025px)
{
  nav a:link, nav a:visited, nav a:hover
  { 
    padding-left:40px; 
    padding-right:40px;
  }
}

@media only screen and (min-width:1050px)
{
  nav a:link, nav a:visited, nav a:hover
  { 
    
    padding-left:42px; 
    padding-right:42px;
  }
}

@media only screen and (min-width:1075px)
{
  nav a:link, nav a:visited, nav a:hover
  { 
    
    padding-left:45px; 
    padding-right:45px;
  }
}

@media only screen and (min-width:1100px)
{
  nav a:link, nav a:visited, nav a:hover
  { 
    padding-left:47px; 
    padding-right:47px;
  }
}

@media only screen and (min-width:1125px)
{
  nav a:link, nav a:visited, nav a:hover
  { 
    padding-left:49px; 
    padding-right:49px;
  }
}

@media only screen and (min-width:1150px)
{
  nav a:link, nav a:visited, nav a:hover
  { 
    padding-left:51px; 
    padding-right:51px;
  }
}

@media only screen and (min-width:1175px)
{
  nav a:link, nav a:visited, nav a:hover
  { 
    padding-left:53px; 
    padding-right:53px;
  }
}

@media only screen and (min-width:1200px)
{
  nav a:link, nav a:visited, nav a:hover
  { 
    padding-left:55px; 
    padding-right:55px;
  }
}

/*************************************************
*********** Top Image Area ***********************
**************************************************/
.TopImageMobile
{
  width:100%;
  display:block;
  background-image:url("../images/DesignElements/BgTopImageShort.png"); 
  background-repeat:repeat-x;
}
  
.TopImageMobile img 
{
  width:100%;
  margin:0 auto;
  display:block;
  padding-top:15px;
}

.TopImageDesk
{
  display:none;
}

@media only screen and (min-width:350px)
{
  .TopImageMobile img
  {
    width:90%;
  }
}

@media only screen and (min-width:400px)
{
  .TopImageMobile img
  {
    width:85%;
  }
}

@media only screen and (min-width:450px)
{
  .TopImageMobile img
  {
    width:auto;
    padding-top:0px;
  }
}

@media only screen and (min-width:700px)
{
  .TopImageMobile
  {
    display:none;
  }
  
  .TopImageDesk
  {
    margin:0px auto;
    display:block;
    background-image:url("../images/DesignElements/BgTopImageTall.png"); 
    background-repeat:repeat-x;
  }
  
  .TopImageDesk img
  {
    width:95%;
    margin:0 auto;
    display:block;
  }
}

@media only screen and (min-width:750px)
{
  .TopImageDesk img
  {
    width:90%;
  }
}

@media only screen and (min-width:800px)
{
  .TopImageDesk img
  {
    width:auto;
  }
}
/*************************************************
********* Set CTA Image per Screen Width *********
**************************************************/
.CTADesignArea, .CTAMarketingArea, .CTAScheduleArea 
{
  clear:both;
  width:100%;
  margin:0px auto;
  display:block;
  background-size:cover;
}

.CTADesignArea 
{
  background-image:url("../images/DesignElements/BGDesign.png"); 
  background-repeat:repeat-x;
}

.CTAMarketingArea
{
  background-image:url("../images/DesignElements/BGMarketing.png"); 
  background-repeat:repeat-x;
}

.CTAScheduleArea 
{
  background-image:url("../images/DesignElements/BGSchedule.png"); 
  background-repeat:repeat-x;
  margin-bottom:25px;
}

.CTADesignArea img, .CTAMarketingArea img, .CTAScheduleArea img
{
  clear:both;
  width:95%;
  margin:0px auto;
  display:block;
}

@media only screen and (min-width:392px)
{
  .CTADesignArea img, .CTAMarketingArea img, .CTAScheduleArea img
  {
    width:90%;
  }
}

@media only screen and (min-width:462px)
{
  .CTADesignArea img, .CTAMarketingArea img, .CTAScheduleArea img
  {
    width:85%;
  }
}

@media only screen and (min-width:530px)
{
  .CTADesignArea img, .CTAMarketingArea img, .CTAScheduleArea img
  {
    width:auto;
  }
}

/********************************************
******** Full Width Areas Defined ***********
*********************************************/
.ContentArea, .ContentAreaCentered, .FBArea, .PortfolioArea, .TierArea, BlogSignupArea, .TestimonialsArea
{
  clear:both;
  width:100%;
  overflow:hidden;
  background-image:url("../images/DesignElements/BGMain.png"); 
  background-repeat:repeat-x repeat-y;
  padding-top:15px;
  padding-bottom:15px;
}

.ContentAreaCentered
{
  text-align:center;
}

.TierArea
{
  background-image:url("../images/DesignElements/BGGreen.png"); 
  background-repeat:repeat-x repeat-y;
}

.BorderArea
{
  clear:both;
  width:100%;
  background-image:url("../images/DesignElements/BGOrange.png"); 
  background-repeat:repeat-x repeat-y;
  height:15px;
}

.AddBorder 
{
  border:2px solid #32679a;
}

/********************************************
*********** Content Area ********************
*********************************************/
.ContentArea img
{
  width:40%;
  float:right;
  padding:10px;
  display:inline;
}

.ContentArea a:link, .ContentArea a:visited, .ContentArea a:hover
{
  color:#000000;
  font-size:1em;
  text-decoration:underline;
  padding:0px;
  margin:0px;
}

.ContentArea a:hover
{
  color:red;
}

@media only screen and (min-width:400px)
{
  .ContentArea img
  {
    width:35%;
  }
}

@media only screen and (min-width:500px)
{
  .ContentArea img
  {
    width:30%;
  }
}

@media only screen and (min-width:600px)
{
  .ContentArea img
  {
    width:25%;
  }
}

@media only screen and (min-width:700px)
{
  .ContentArea img
  {
    width:auto;
  }
}

/********************************************
************ Column One *********************
*********************************************/
.Column1
{
  clear:both;
  width:100%;
  margin:0 auto;
  display:block;
  padding-top:20px;
  padding-bottom:20px;
}

.Column1 img
{
  width:90%;
  margin:0 auto;
  display:block;
}

@media only screen and (min-width:400px)
{
  .Column1 img
  {
    width:auto;
  }
}

/********************************************
************ Column Two *********************
*********************************************/
.Column2
{
  clear:both;
  width:95%;
  margin:0 auto;
  display:block;
  padding-top:20px;
  padding-bottom:20px;
}

.Column2 img
{
  width:auto;
  margin:0 auto;
  display:block;
}

@media only screen and (min-width:600px)
{
  .Column2
  {
    clear:none;
    display:inline;
    width:48%;
    margin:0 auto;
    float:left;
    padding-left:10px;
  }
  
  .Column2 img
  {
    width:auto;
  }
}

/********************************************
************ Portfolio Area *****************
*********************************************/
.DesignFan, .CheckOut
{
  clear:both;
  width:100%;
  margin:0 auto;
  display:block;
  padding-top:15px;
  padding-bottom:15px;
}

.Header
{
  padding-top:10px;
  padding-bottom:10px;
}

.Header img
{
  width:auto;
  margin:0 auto;
  display:block;
}

.CheckOutImage img
{
  width:auto;
  margin:0 auto;
  display:block;
}

.DesignFanImage img
{
  width:90%;
  margin:0 auto;
  display:block;
}

@media only screen and (min-width:600px)
{ 
  .DesignFan, .CheckOut
  {
    clear:none;
    display:inline;
    padding-top:0px;
    padding-bottom:15px;
  }  
  
  .DesignFan
  {
    width:60%;
    float:left;
  }
  
  .CheckOut
  {
    width:40%;
    float:right;
  }
  
  .DesignFanImage img
  {
    width:75%;
    margin:0 auto;
    display:block;
    padding-top:0px;
  }
  
  .CheckOutImage img
  {
    width:auto;
    margin:0 auto;
    display:block;
    padding-top:5px;
    padding-bottom:5px;
  }
}

/********************************************
*********** Tier and Video Area *************
*********************************************/
.FourSteps, .FourStepsImageSmall, .FourStepsImageLarge, .VideoArea
{
  clear:both;
  width:100%;
  margin:0 auto;
  display:block;
  padding-top:15px;
  padding-bottom:15px;
}

.FourStepsImageLarge
{
  display:none;
}

.FourStepsImageSmall img
{
  width:auto;
  margin:0 auto;
  display:block;
}

.FourStepsImageLarge img
{
  width:auto;
  margin:0 auto;
  display:block;
}

@media only screen and (min-width:600px)
{ 
  .FourSteps, .FourStepsImage, .VideoArea
  {
    clear:none;
    display:inline;
    padding-top:0px;
    padding-bottom:15px;
  }  

  .FourSteps
  {
    width:48%;
    float:left;
    padding-left:10px;
  }
  
  .VideoArea
  {
    width:48%;
    float:left;
    padding-left:12px;
  }
}

@media only screen and (min-width:900px)
{ 
  .FourStepsImageSmall
  {
    display:none;
  }
  
  .FourStepsImageLarge
  {
    display:block;
  }
  
  .FourStepsImageLarge img
  {
    width:90%;
  }
}

@media only screen and (min-width:1000px)
{ 
  .FourStepsImageLarge img
  {
    width:85%;
  }
}

@media only screen and (min-width:1100px)
{ 
  .FourStepsImageLarge img
  {
    width:80%;
  }
}

@media only screen and (min-width:1200px)
{ 
  .FourStepsImageLarge img
  {
    width:auto;
  }
}

/********************************************
************ Column Three *******************
*********************************************/
.Column3
{
  clear:both;
  width:95%;
  margin:0 auto;
  display:block;
  padding-top:20px;
  padding-bottom:20px;
}

.Column3 img
{
  width:auto;
  margin:0 auto;
  display:block;
}

.Column3 h2, .Column3 p
{
  text-align:center;
}

@media only screen and (min-width:600px) 
{
  .Column3
  {
    clear:none;
    display:inline;
    width:33.3%;
    margin:0 auto;
    float:left;
  }
  
  .Column3 img
  {
    width:85%;
    padding-top:10px;
    padding-bottom:10px;
  }
}

@media only screen and (min-width:800px)
{
  .Column3 img
  {
    width:80%;
  }
}

@media only screen and (min-width:900px)
{
  .Column3 img
  {
    width:75%;
  }
}

@media only screen and (min-width:1000px)
{
  .Column3 img
  {
    width:auto;
  }
}

/********************************************
********** Testimonial Area *****************
*********************************************/
.TestimonialsArea img
{
  width:auto;
  margin:0 auto;
  display:block; 
  margin-top:0px;
  margin-bottom:15px;
}
  
@media only screen and (min-width:600px) 
{
  .TestimonialsArea
  {
    clear:none;
    display:inline;
    width:49%;
    margin:0 auto;
    float:left;
  }
  
  .TestimonialsArea img
  {
    width:85%;
    margin-top:25px;
    margin-bottom:25px;
  }
}

@media only screen and (min-width:750px) 
{
  .TestimonialsArea img
  {
    width:auto;
  }
}

/********************************************
********** Blog Signup Area *****************
*********************************************/
.Blog1, .Blog2, .BlogSingle, .Signup
{
  clear:both;
  width:95%;
  margin:0 auto;
  display:block;
  padding-top:20px;
  padding-bottom:20px;
}

.Blog1 img, .Blog2 img, , .BlogSingle img, .Signup img
{
  width:auto;
  margin:0 auto;
  display:block;
}

.BlogSignupArea img
{
  width:60%;
  margin:0 auto;
  display:block;
  padding:15px;
  border:2px solid #1e84b9;
  background-color:#ffffff;
}

.BlogSignupArea h3 /* This serves as the H1, since we can't have multiple ones per page. */
{
  color:#848484;
  font-size:1.25em;
  margin-bottom:2px;
  padding-right:10px;
  padding-left:15px;
  text-align:center;
}

.BlogSignupArea h2
{
  color:#a4a4a4;
  font-size:.8em;
  margin-bottom:8px;
  padding-right:5px;
  padding-left:5px;
  text-align:center;
}

.BlogSignupArea p
{
  color:#848484;
  font-size:1em;
  margin-top:10px;
  margin-bottom:10px;
  padding-right:15px;
  padding-left:15px;
}

.BlogSignupArea a:link, .BlogSignupArea a:visited, .BlogSignupArea a:hover
{
  color:#1e84b9;
  padding-top:5px;
  margin-top:10px;
  margin-bottom:10px;
  text-decoration:none;
}

.BlogSignupArea a:hover
{
  text-decoration:underline; 
}

@media only screen and (min-width:600px) 
{
  .Blog2 /* For this screen size hide the 2nd blog. Will reappear on wider screens. */
  {
    display:none;
  }
  
  .Blog1, .BlogSingle, .Signup
  {
    clear:none;
    display:inline;
    width:49%;
    margin:0 auto;
    float:left;
  }
  
  .Signup
  {
    float:right;
  }
  
  .BlogSignupArea img
  {
    width:85%;
    padding-top:10px;
    padding-bottom:10px;
  }
}

@media only screen and (min-width:900px)
{
  .Blog2
  {
    clear:none;
    display:inline;
    margin:0 auto;
    float:left;
  }
  
  .Blog1, .Blog2, .Signup
  {
    width:33.33%;
  }
  
  . BlogSignupArea img
  {
    width:80%;
  }
}

/*************************************************
************* Contact Area ***********************
**************************************************/
.ContactTextArea
{
  clear:both;
  width:95%;
  display:block;
  float:left;
  padding-top:0px;
  padding-bottom:0px;
}

.ContactForm
{
  clear:both;
  width:95%;
  margin:0 auto;
  display:block;
  float:left;
  padding-top:0px;
  padding-bottom:0px;
}

.ContactTextArea img
{
  width:auto;
  margin:0 auto;
  display:block;
}

@media only screen and (min-width:650px)
{  
  .ContactTextArea
  {
    clear:none;
    width:50%;
    display:inline;
  }
  
  .ContactForm
  {
    clear:none;
    width:50%;
    display:inline;   
    float:right;
  }
}

@media only screen and (min-width:1050px)
{  
  .ContactTextArea
  {
    width:65%;
  }
  
  .ContactForm
  {
    width:35%;
  }
}

/*************************************************
*************** Form Elements ********************
**************************************************/
.FormElementsLeft, .FormElementsRight
{
  clear:both;
  width:100%;
  margin:0 auto;
  display:block;
  padding-left:15px;
}

.FormElementsCaption
{
  width:33%;
  color:#848484;
  display:inline;
  font-size:1.25em;
  font-weight:bold;
  float:left;
  margin-bottom:20px;
}

.FormElementsInput
{
  width:65%;
  display:inline;
  float:left;
  margin-bottom:20px; 
}

/*************************************************
********** Footer Area Columns *******************
**************************************************/
footer
{
  clear:both;
  width:100%;
  overflow:hidden;
  padding-top:10px;
  padding-bottom:5px;
  background-color:#313131;
}

footer p
{
  font-size:.95em;
  color:#ffffff;
  margin-bottom:10px;
}

footer a:link, footer a:visited, footer a:hover
{
  font-size:.95em;
  color:#ffffff;
  text-decoration:none;
}

footer a:hover
{
  text-decoration:underline;
}

footer img
{
  padding-bottom:15px;
}

.FooterLogo, .FooterContact, .FooterNav1, .FooterNav2, .FooterQuestion, .PartnerArea
{
  clear:both;
  width:95%;
  margin:0 auto;
  display:block;
  text-align:center;
  padding-top:15px;
  padding-bottom:15px;
}

.FooterNav2
{
  display:none;
}

.FooterLogo img
{
  width:auto;
  margin:0 auto;
  display:block;
  vertical-align:top;
}

.StartProject img 
{
  width:65%;
}

@media only screen and (min-width:400px)
{
  .StartProject img 
  {
    width:60%;
  }
}

@media only screen and (min-width:450px)
{
  .StartProject img 
  {
    width:auto;
  }
}

@media only screen and (min-width:600px)
{
  .FooterNav2
  {
    display:block;
  }

  .FooterNav1
  {
    display:none; 
  }

  .FooterContact, .FooterQuestion
  {
    clear:none;
    width:50%;
    display:inline;
    float:left;
  }
  
  .StartProject img 
  {
    width:60%;
  }
}

@media only screen and (min-width:700px)
{
  .StartProject img 
  {
    width:50%;
  }
}

@media only screen and (min-width:900px)
{
  .FooterNav2
  {
    display:none;
  }
  
  .FooterContact
  {
    width:25%;
  }

  .FooterQuestion
  {
    width:30%;
  }
  
  .FooterNav1
  {
    clear:none;
    width:45%;
    display:inline;
    float:left;
  }
   
  .StartProject img 
  {
    width:70%;
  }
}

@media only screen and (min-width:1100px)
{
  .StartProject img 
  {
    width:auto;
  }
}