/* css for Matt's web page */

@viewport {
  width: device-width ;
  zoom: 1.0 ;
}

body {
  background-color: #fff;
  font-family:tahoma,geneva,sans-serif;
  text-align: center;
  margin:0;
  padding:0;
}

/* unvisited link */
a:link {
  color: #ff6600;
  text-decoration: none;
}

/* visited link */
a:visited {
  color: #ff6600;
  text-decoration:none
}

/* mouse over link */
a:hover {
  color: grey;
}

/* selected link */
a:active {
  color: black;
}

h1 {
  color: navy;
  margin-left: 20px;
}
#bannerbox {
    background-color: rgb(0, 0, 0);
    width: 100%;
    padding: 30px 0px;
    margin: 0px auto;
    text-align: center;
}
#mainarea {
    background-color:#fff;
    width:auto;
    padding:30 30 30 30;
    margin: auto;
    padding:20px
}
.iwannabeorange {
    color: #ff6600;
}
.serviceshead {
    font-size:1.2em;
    font-weight: bold;
    text-transform: uppercase;
}
.textstyle1 {
    padding-top:50px;
}
.companytitle {
    letter-spacing: 3px;
    color:#ff6600;
}
.enquries {
    font-size: 26px;
    line-height:1.5em;
}

.lightweighth2 {
    font-weight: normal;
    font-family:Georgia,serif;
    font-style: oblique;
}
.spacing3px {
    letter-spacing: 1px;
}
.spacing1px {
    letter-spacing: 1px;
}
.padtop {
    padding-top: 20px;
}
.padlower {
    padding-bottom: 20px;
}
.capsok {
    text-transform: uppercase;
}
/* this is the footer area lines */
.simplediv {
    width: 100%;
    padding:17px;
    text-align: center;
    font-weight:bold;
}
/* this contains the barcode graphic */
.basediv {
    background-color: #ff6600;
    width: 100%;
    padding: 30px 0px;
    margin: 0px auto;
    text-align: center;
}
}
/*BLUR*/
.blur img {
  -webkit-transition: all 1s ease;
     -moz-transition: all 1s ease;
       -o-transition: all 1s ease;
      -ms-transition: all 1s ease;
          transition: all 1s ease;
}
 
.blur img:hover {
  -webkit-filter: blur(5px);
}
/*TILT*/
.tilt {
  -webkit-transition: all 0.5s ease;
     -moz-transition: all 0.5s ease;
       -o-transition: all 0.5s ease;
      -ms-transition: all 0.5s ease;
          transition: all 0.5s ease;
}
 
.tilt:hover {
  -webkit-transform: rotate(-5deg);
     -moz-transform: rotate(-5deg);
       -o-transform: rotate(-5deg);
      -ms-transform: rotate(-5deg);
          transform: rotate(-5deg);
}
/*GROW*/
.grow img {
  height: 107px;
  width: 262px;
 
  -webkit-transition: all 1s ease;
     -moz-transition: all 1s ease;
       -o-transition: all 1s ease;
      -ms-transition: all 1s ease;
          transition: all 1s ease;
}
 
#minibikes {
     opacity: 1; 
}
#minibikes:hover {
     opacity: 0.4; 
}
.grow img:hover {
  height: 107px;
  width: 272px;
}
#barcode {
     opacity: 1; 
}
#barcode:hover {
     opacity: 0.7; 
}



@media screen and (max-width: 320px) {
  /* comes into effect for screens less than or equal to 320 pixels */
  body {
      font-size: 1.3em ;
  }
  .mainlogo {
    width:auto;
    height:auto;
    max-width:100%;
    max-height:90%;
  }
}
@media screen and (min-width: 321px) and (max-width: 480px) {
  /* comes into effect for screens between 321 and 480 pixels (inclusive) */
   body {
      font-size: 1.3em ;
  }
  .mainlogo {
    width:auto;
    height:auto;
    max-width:100%;
    max-height:90%;
};
  }
}
/*
@media screen and (min-width: 481px) {
   body {
      font-size: 1.5em ;
  }
  .mainlogo {
      visability:none;
  }
}
*/