/*======================
01. BASE STYLES
========================*/

body {
    max-width: 1920px;
    margin: auto;
    font-family: 'open sans', sans-serif;
    font-size: 18px;
    line-height: normal;
    color:#424142;
    overflow-x: hidden;
    background-image: url(../images/lcbg05.png);
    background-size:cover;
    background-attachment:fixed;
    padding-bottom:50px;
}
/*body::before {
    content: "";
    position: absolute;
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    background-color: rgba(255,255,255,0.2);
  }*/

img {max-width:100%;}

.container {
    width:95%;
    margin:0 auto;
    max-width:1480px;
    position:relative;
}

.column {
    float:left;
    margin:0 1%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.row {
    width:100%;
    padding:90px 0;
    display:inline-block;
}
.row:after{
    content: '';
    clear: both;
    display: block;
}

.text {padding-top:15px;}

.grid12 {width:98%;}
.grid11 {width:89.6667%;}
.grid10 {width:81.3333%;}
.grid9 {width:73%;}
.grid8 {width:65%;}
.grid7 {width:56.3333%;}
.grid6 {width:48%;}
.grid5 {width:39.6667%;}
.grid4 {width:31%;}
.grid3 {width:23%;}
.grid2 {width:14.6667%;}
.grid1 {width:6.3333%;}

.clear {clear:both;}

.alignleft {
    float:left;
    margin-right:20px !important;
}

.alignright {
    float:right;
    margin-left:20px !important;
}

.alignmid {
    display:block;
    margin:0 auto;
}
.mbottom {
  margin-bottom:4%;
}
.mtop {
  margin-top:150px;
}

.tleft{
    text-align: left;
}
.tright{
    text-align: right;
}
.center {text-align:center;}

 .row-full{
 width: 100vw;
 position: relative;
 margin-left: -50vw;
 height: 300px;
 margin-top:100px;
 left: 50%;
}
.white {
  background-color:#fff;
}
.copyright {
  color:#474749;
  font-size:.8em;
}

hr {
    border:0;
    height:1px;
    background:#000;
    padding:0;
    margin-top:35px;
    margin-bottom:35px;
}

.rounded{
    -webkit-border-radius: 40px;
    -moz-border-radius: 40px;
    border-radius: 40px;
}


/*======================
02. TYPOGRAPHY/LINK STYLES
========================*/

h1,h2,h3,h4,h5,h6 {
    font-weight:400;
    margin-bottom: 10px;
    padding: 0;
    color:#fff;
}

h4, h5, h6{
    font-weight: bold;
}

h1 {
    font-size:2.8em;
    line-height:1.2em;
}
h2 {font-size:2.4em;}
h3 {font-size:2.1em;}
h4 {font-size:1.6em;}
h5 {font-size:1.3em; margin-top:10px;}
h6 {font-size:.8em;}

a {
    color:#fff;
    transition:0.5s all ease;
}

a:hover {color:#367d59;}

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

.column li {
    line-height:1.7em;
}



.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }


.flex{
    display: flex;
}

/*======================
03. HEADER STYLES
========================*/

.logo {
    padding: 30px 10px 0px 0;
    text-align:center;
    margin-bottom:20px;
}
.logo a {
    text-decoration:none;
    line-height:3em;
}
.logo img{
  text-align:center;
    max-width: 300px;
    height: auto;
    float:none;
}



/*======================
05. CONTENT STYLES
========================*/
.product {
  background: rgba(255,255,255,1);
  margin-bottom:20px;
}
.product img {
  width:85%;
}

.button {
  display: block;
  font-size: 1em;
  width:40%;
  padding: 15px 25px;
  color: #363636;
  background-color:#fff;
  text-decoration: none;
  cursor: pointer;
  transition: all 0.3s ease-out;
  min-width:200px;
  text-align:center;
  margin:20px auto;
}
.button:hover {
  background: rgba(255,255,255, 0.3);
  color:#282828;
}


hr {
  border-top: 1px solid;
  border-bottom: 0;
}

/* Fixed/sticky icon bar (vertically aligned 50% from the top of the screen) */
.icon-bar {
  /*position: fixed;
  top: 14%;
  left:5%;*/
  margin:0px auto 50px auto;
  text-align:center;
  /*-webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);*/
}

/* Style the icon bar links */
.icon-bar a {
  display: inline-block;
  text-align: center;
  padding: 2px 5px;
  transition: all 0.3s ease;
  color: #474749;
  font-size: 20px;
  -webkit-border-radius: 50px;
    -moz-border-radius: 50px;
    border-radius: 50px;
    padding:5px 5px;
    width:30px;
    height:30px;
}

/* Style the social media icons with color, if you want */
.icon-bar a:hover {
  background: rgba(255,255,255,.8);
}

.facebook {
  color: #474749;
  background: rgba(255,255,255,1);
}

.instagram {
  color: #474749;
  background: rgba(255,255,255,1);
}

.email {
  color: #474749;
  background: rgba(255,255,255,1);
}

.etsy {
  color: #474749;
  background: rgba(255,255,255,1);
}














@media only screen and (max-width: 900px){
  .button {
    width:70%;
  }
  .logo img {
    width:200px;
  }
}

@media only screen and (max-width: 600px){
  .button {
    width:80%;

  }
}



/*======================
06. FOOTER STYLES
========================*/

footer {
  position:absolute;
  bottom:10px;
  margin:20px;
}