@font-face {
   font-family: 'fontello';
  src: url('../font/fontello.eot?32906451');
  src: url('../font/fontello.eot?32906451#iefix') format('embedded-opentype'),
       url('../font/fontello.woff2?32906451') format('woff2'),
       url('../font/fontello.woff?32906451') format('woff'),
       url('../font/fontello.ttf?32906451') format('truetype'),
       url('../font/fontello.svg?32906451#fontello') format('svg');
  font-weight: normal;
  font-style: normal;
}
/* Chrome hack: SVG is rendered more smooth in Windozze. 100% magic, uncomment if you need it. */
/* Note, that will break hinting! In other OS-es font will be not as sharp as it could be */
/*
@media screen and (-webkit-min-device-pixel-ratio:0) {
  @font-face {
    font-family: 'fontello';
    src: url('../font/fontello.svg?19057008#fontello') format('svg');
  }
}
*/
 
 [class^="icon-"]:before, [class*=" icon-"]:before {
  font-family: "fontello";
  font-style: normal;
  font-weight: normal;
  speak: none;
 
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  margin-right: .2em;
  text-align: center;
  /* opacity: .8; */
 
  /* For safety - reset parent styles, that can break glyph codes*/
  font-variant: normal;
  text-transform: none;
 
  /* fix buttons height, for twitter bootstrap */
  line-height: 1em;
 
  /* Animation center compensation - margins should be symmetric */
  /* remove if not needed */
  margin-left: .2em;
 
  /* you can be more comfortable with increased icons size */
  /* font-size: 120%; */
 
  /* Font smoothing. That was taken from TWBS */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
 
  /* Uncomment for 3D effect */
  /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
}
 
 
.icon-ok-circled2:before { content: '\e800'; } /* '' */
.icon-cancel:before { content: '\e801'; } /* '' */
.icon-ok-circled:before { content: '\e802'; } /* '' */
.icon-ok:before { content: '\e803'; } /* '' */
.icon-right-open:before { content: '\e804'; } /* '' */
.icon-left-open:before { content: '\e805'; } /* '' */
.icon-down-open:before { content: '\e806'; } /* '' */
.icon-up-open:before { content: '\e807'; } /* '' */
.icon-left-big:before { content: '\e808'; } /* '' */
.icon-right-big:before { content: '\e809'; } /* '' */
.icon-up-big:before { content: '\e80a'; } /* '' */
.icon-down-big:before { content: '\e80b'; } /* '' */
.icon-cancel-circled:before { content: '\e80c'; } /* '' */
.icon-plus-circled:before { content: '\e80d'; } /* '' */
.icon-plus:before { content: '\e80e'; } /* '' */
.icon-minus:before { content: '\e80f'; } /* '' */
.icon-minus-circled:before { content: '\e810'; } /* '' */
.icon-home:before { content: '\e811'; } /* '' */
.icon-mobile:before { content: '\e812'; } /* '' */
.icon-wristwatch:before { content: '\e813'; } /* '' */
.icon-eye:before { content: '\e814'; } /* '' */
.icon-search:before { content: '\e815'; } /* '' */
.icon-search-1:before { content: '\e816'; } /* '' */
.icon-location:before { content: '\e817'; } /* '' */
.icon-location-1:before { content: '\e818'; } /* '' */
.icon-share:before { content: '\e819'; } /* '' */
.icon-left-small:before { content: '\e81a'; } /* '' */
.icon-right-small:before { content: '\e81b'; } /* '' */
.icon-up-small:before { content: '\e81c'; } /* '' */
.icon-down-small:before { content: '\e81d'; } /* '' */
.icon-info-circled:before { content: '\e81e'; } /* '' */
.icon-help-circled:before { content: '\e81f'; } /* '' */
.icon-twitter:before { content: '\f099'; } /* '' */
.icon-facebook:before { content: '\f09a'; } /* '' */
.icon-filter:before { content: '\f0b0'; } /* '' */
.icon-menu:before { content: '\f0c9'; } /* '' */
.icon-gplus-squared:before { content: '\f0d4'; } /* '' */
.icon-gplus:before { content: '\f0d5'; } /* '' */
.icon-sort:before { content: '\f0dc'; } /* '' */
.icon-sort-down:before { content: '\f0dd'; } /* '' */
.icon-sort-up:before { content: '\f0de'; } /* '' */
.icon-plus-squared:before { content: '\f0fe'; } /* '' */
.icon-angle-double-left:before { content: '\f100'; } /* '' */
.icon-angle-double-right:before { content: '\f101'; } /* '' */
.icon-angle-left:before { content: '\f104'; } /* '' */
.icon-angle-right:before { content: '\f105'; } /* '' */
.icon-angle-up:before { content: '\f106'; } /* '' */
.icon-angle-down:before { content: '\f107'; } /* '' */
.icon-desktop:before { content: '\f108'; } /* '' */
.icon-tablet:before { content: '\f10a'; } /* '' */
.icon-minus-squared:before { content: '\f146'; } /* '' */
.icon-ok-squared:before { content: '\f14a'; } /* '' */
.icon-sort-alt-up:before { content: '\f160'; } /* '' */
.icon-sort-alt-down:before { content: '\f161'; } /* '' */
.icon-youtube-squared:before { content: '\f166'; } /* '' */
.icon-youtube-play:before { content: '\f16a'; } /* '' */
.icon-instagram:before { content: '\f16d'; } /* '' */
.icon-share-1:before { content: '\f1e0'; } /* '' */
.icon-facebook-official:before { content: '\f230'; } /* '' */
.icon-twitter-squared:before { content: '\f304'; } /* '' */
.icon-facebook-squared:before { content: '\f308'; } /* '' */


.gradient-bluewhite {
  background: rgba(216,239,246,1);
background: -moz-radial-gradient(center, ellipse cover, rgba(216,239,246,1) 0%, rgba(145,215,238,1) 100%);
background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%, rgba(216,239,246,1)), color-stop(100%, rgba(145,215,238,1)));
background: -webkit-radial-gradient(center, ellipse cover, rgba(216,239,246,1) 0%, rgba(145,215,238,1) 100%);
background: -o-radial-gradient(center, ellipse cover, rgba(216,239,246,1) 0%, rgba(145,215,238,1) 100%);
background: -ms-radial-gradient(center, ellipse cover, rgba(216,239,246,1) 0%, rgba(145,215,238,1) 100%);
background: radial-gradient(ellipse at center, rgba(216,239,246,1) 0%, rgba(145,215,238,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d8eff6', endColorstr='#91d7ee', GradientType=1 );
}



body {
  position: relative;
  padding:0px;
  margin:0px;
  font-family: 'Encode Sans', sans-serif;
  font-size: 16px;
}

* {
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

a {
  color: #3498db;
  text-decoration: none;
}

.container {
  width: 1216px;
  margin:0 auto;
}
.row {
  clear: both;
  overflow: hidden;
}
.col-alpha {
  width: 50%;
  float: left;
}
.col-beta {
  width: 50%;
  float: left;
}
.col-full {
  width: 100%;
  float: none
}

.section-home {
  padding:50px 0;
}
.titlsec {
  text-indent: -9999px;
  height: 1px;
  display: none;
}
.title-img-section {
  display: block;
  margin: 0 auto 30px;
}

.btn {
  background-color: #e4a224;
  color: #fff;
  padding:10px 30px;
  font-size: 1em;
  display: inline-block;
  border-radius: 100px;
}
.btn:hover { 
  background-color: #d19116;
}


/* SECTION HEADER */
#header {
  background-color: transparent; 
  height: 90px; 
  position: fixed; 
  top: 0px; 
  left: 0px; 
  width: 100%; 
  z-index: 99
}
.mainlogo {
  height: 50px;
  margin-top: 18px;
  margin-left: 20px;
  display: block;
}

/* SECTION BANNER */
#banner {
  padding:0px;
  margin:0px;
  display: block;
}
.slick-slide img {
  width: 100%;
}

.banner-desktop {
  display: block;
}
.banner-mobile {
  display: none
}

/* SECTION - ABOUT */
#about {
  color: #333;
  background: #f9f5dc url(../img/BG-chocolate.jpg) top center;
  background-size: cover;
  text-align: left;
  padding-top: 50px;
}
#about .col-alpha {
  float: left;
}
#about .col-beta {
  float: right
}
#about .heroimg {}
#about .heroimg img {
  width: 100%;
  display: block;
}
#about .desc {
  text-align: left;
  padding-top: 50px;
}
#about .title-img-section {
  display: block;
  margin:0 0 0 -30px;
}
#about .inn {
  padding-left: 30px;
  padding-right: 20%;
}
#about .desc p {
  font-size: 1.4em;
  line-height: 1.6em;
  color: #77342a
}


/* SECTION PRODUCTS */
#features {
  padding-top: 50px;
  padding-bottom: 30px;
}

.img-slide {
  width: 100%;
}

#features .slick-slide {
  padding-top: 20px;
  padding-bottom: 50px;
}

/* style of slick slider */
/* Slider */
.slick-slider {
  position: relative;
  display: block;
  box-sizing: border-box;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  -webkit-touch-callout: none;
  -khtml-user-select: none;
  -ms-touch-action: pan-y;
      touch-action: pan-y;
  -webkit-tap-highlight-color: transparent;
}

.slick-list {
  position: relative;
  display: block;
  overflow: hidden;
  margin: 0;
  padding: 0;
}
.slick-list:focus {
  outline: none;
}
.slick-list.dragging {
  cursor: pointer;
  cursor: hand;
}

.slick-slider .slick-track,
.slick-slider .slick-list {
  -webkit-transform: translate3d(0, 0, 0);
     -moz-transform: translate3d(0, 0, 0);
      -ms-transform: translate3d(0, 0, 0);
       -o-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
}

.slick-track {
  position: relative;
  top: 0;
  left: 0;

  display: block;
  margin-left: auto;
  margin-right: auto;
}
.slick-track:before,
.slick-track:after {
  display: table;
  content: '';
}
.slick-track:after {
  clear: both;
}
.slick-loading .slick-track {
  visibility: hidden;
}

.slick-slide {
  display: none;
  float: left;

  height: 100%;
  min-height: 1px;
}
[dir='rtl'] .slick-slide {
  float: right;
}
.slick-slide img {
  display: block;
}
.slick-slide.slick-loading img {
  display: none;
}
.slick-slide.dragging img {
  pointer-events: none;
}
.slick-initialized .slick-slide {
  display: block;
}
.slick-loading .slick-slide {
  visibility: hidden;
}
.slick-vertical .slick-slide {
  display: block;
  height: auto;
  border: 1px solid transparent;
}
.slick-arrow.slick-hidden { 
  display: none;
}


/* style of slick-themes slider */
@charset 'UTF-8';
/* Slider */
.slick-loading .slick-list {
  background: #fff url('../img/ajax-loader.gif') center center no-repeat; 
}

/* Icons 
@font-face {
    font-family: 'slick';
    font-weight: normal;
    font-style: normal;

    src: url('./fonts/slick.eot');
    src: url('./fonts/slick.eot?#iefix') format('embedded-opentype'), url('./fonts/slick.woff') format('woff'), url('./fonts/slick.ttf') format('truetype'), url('./fonts/slick.svg#slick') format('svg');
}*/
/* Arrows */
.slick-prev,
.slick-next {
  font-size: 0;
  line-height: 0;

  position: absolute;
  top: 35%;

  display: block;

  width: 20px;
  height: 20px;
  padding: 0;
  -webkit-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  transform: translate(0, -50%);

  cursor: pointer;

  color: transparent;
  border: none;
  outline: none;
  background: transparent;
}
.slick-prev:hover,
.slick-prev:focus,
.slick-next:hover,
.slick-next:focus
{
    color: transparent;
    outline: none;
    background: transparent;
}
.slick-prev:hover:before,
.slick-prev:focus:before,
.slick-next:hover:before,
.slick-next:focus:before
{
    opacity: 1;
}
.slick-prev.slick-disabled:before,
.slick-next.slick-disabled:before
{
    opacity: .25;
}

.slick-prev:before,
.slick-next:before
{
    font-family: 'fontello';
    font-size: 30px;
    line-height: 1;

    opacity: .75;
    color: white;

    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.slick-prev
{
    left: -25px;
}
[dir='rtl'] .slick-prev
{
    right: -25px;
    left: auto;
}
.slick-prev:before
{
    content: '←';
    content: '\e805';
}
[dir='rtl'] .slick-prev:before
{
    content: '→';
    content: '\e804';
}

.slick-next
{
    right: -25px;
}
[dir='rtl'] .slick-next
{
    right: auto;
    left: -25px;
}
.slick-next:before
{
    content: '→';
    content: '\e804';
}
[dir='rtl'] .slick-next:before
{
    content: '←';
    content: '\e805';
}

/* Dots */
.slick-dotted.slick-slider
{
    margin-bottom: 0px;
}

.slick-dots
{
    position: absolute;
    bottom: 7px;
    opacity: 0.7;

    display: block;

    width: 100%;
    padding: 0;
    margin: 0;

    list-style: none;

    text-align: center;
}
.slick-dots li
{
    position: relative;

    display: inline-block;

    width: 20px;
    height: 20px;
    margin: 0 5px;
    padding: 0;

    cursor: pointer;
}
.slick-dots li button
{
    font-size: 0;
    line-height: 0;

    display: block;

    width: 20px;
    height: 20px;
    padding: 5px;

    text-align: center;
    cursor: pointer;

    color: transparent;
    border: 0;
    outline: none;
    background: transparent;
}
.slick-dots li button:hover,
.slick-dots li button:focus
{
    outline: none;
}
.slick-dots li button:hover:before,
.slick-dots li button:focus:before
{
    opacity: 1;
}
.slick-dots li button:before
{
    /*font-family: 'slick';
    font-size: 15px;
    line-height: 15px;*/



    position: absolute;
    top: 5px;
    left: 5px;

    width: 10px;
    height: 10px;
    border-radius: 20px;
    margin:0 auto;
    background-color: red;

    content: '•';
    text-align: center;

    opacity: .25;
    color: black;
    /*
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    */
}
.slick-dots li.slick-active button:before
{
    opacity: .75;
    color: black;
}







/* SECTION - IG */
#feedig {
  background-color: #fff;
  background: url(../img/igsec-bgtop.png) no-repeat top left, url(../img/igsec-bgbottom.png) no-repeat right bottom;
  background-size: 500px, 500px;
  text-align: center;
}
#feedig.section-home {
  padding:50px 0 130px;
}
.imgpostlist {
  text-align: center;
  width: 100%;
}
.imgpost {
  width: 365px;
  margin:15px;
  display: inline-block;
}


/* SECTION - FIND */
#find {
  background-color: #fddb3b;
  color: #fff;
  text-align: center;
}
#find.section-home {
  padding: 50px 20px 0;
}
.petaimg-desktop {
  display: block;
  margin:0 auto;
  max-width: 100%;
}
.petaimg-mobile {
  display: none;
}
#find .title-img-section {
  height: 110px;
  width: auto;
  display: inline-block;
}
.imgaddon {
  text-align: right;
}
.img-bottom-find {
  display:inline-block;
  margin-top: -80px;
  padding-right: 100px;
}



/* SECTION - FOOTER */
#footer {
  background-color: #2e2e2e;
  color: #fff;
}
#footer a,
#footer a:visited {
  color: #f5f5f5;
}
#footer a:hover,
#footer a:focus {
  color: #fff;
}
#footer.section-home {
  padding: 30px 20px 10px;
}
#footer .col-alpha {
  text-align: left;
  padding-bottom: 20px;
}
#footer .col-beta {
  text-align: right;
}
.logofooter {
  display: inline-block;
  margin-right: 10px;
}
#footer .icon {
  font-size: 2em!important;
}

.copy {
  border-top:1px solid #fff;
  padding:20px 0 15px;
  font-size: 0.9em;
  letter-spacing: 0.5px
}



.blue {
  color: #fff;
}
.blue h3 {
  background: #fff;
  color: #3498db;
  font-size: 36px;
  line-height: 100px;
  margin: 10px;
  padding: 2%;
  position: relative;
  text-align: center;
}
.variable-width .slick-slide p {
  background: #fff;
  height: 100px;
  color: #3498db;
  margin: 5px;
  line-height: 100px;
}
.button {
  background: #3498db;
  color: #fff;
  display: block;
  font-size: 16px;
  margin: 20px auto;
  padding: 20px;
  text-align: center;
  text-decoration: none;
  width: 48%;
}
.buttons {
  padding: 0 20px 20px;
  margin-bottom: 10px;
}
.buttons .button {
  background: #fff;
  color: #3498db;
  float: left;
  margin: 5px;
}
.center .slick-center h3 {
  -moz-transform: scale(1.18);
  -ms-transform: scale(1.18);
  -o-transform: scale(1.18);
  -webkit-transform: scale(1.18);
  color: #e67e22;
  opacity: 1;
  transform: scale(1.18);
  margin: 0 15px 10px;
}

.center .slick-center .img-slide {
  -moz-transform: scale(1.18);
  -ms-transform: scale(1.18);
  -o-transform: scale(1.18);
  -webkit-transform: scale(1.18);
  color: #e67e22;
  opacity: 1;
  transform: scale(1.18);
}


.center h3 {
  opacity: 0.8;
  transition: all 300ms ease;
}
.content {
  margin: auto;
  padding: 0px;
  width: 1000px;
}
.content:after,
.buttons::after {
  clear: both;
  content: '';
  display: table;
}
.destroy {
  font-weight: 400;
  margin-top: 40px;
}
.features {
  display: block;
  list-style-type: none;
  margin-top: 30px;
  padding: 0;
  text-align: center;
}
.features li {
  margin: 20px 0;
}
.filter .button {
  background: #fff;
  color: #3498db;
  margin-bottom: 40px;
}


body,
html {
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  margin: 0;
  padding: 0;
  text-rendering: optimizeLegibility;
  height: 100%;
}
@media (max-width: 768px) {
  .fixed-header {
    display: none !important;
  }
  #carbonads {
    top: 0px;
  }
  .header ul.nav li {
    display: block;
    margin: 20px;
  }
  .blue h3 {
    font-size: 24px;
  }
  .button {
    margin: 0 auto 20px;
    width: auto;
  }
  .button.first {
    margin-top: 40px;
  }
  .buttons {
    padding: 0 0 20px;
  }
  .buttons .button {
    float: left;
    font-size: 12px;
    margin: 1%;
    width: 48%;
  }
  .center {
    margin-left: -40px;
    margin-right: -40px;
  }
  .center .slick-center h3 {
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    -webkit-transform: scale(1);
    color: #e67e22;
    opacity: 1;
    transform: scale(1);
  }
  .center h3 {
    -moz-transform: scale(0.95);
    -ms-transform: scale(0.95);
    -o-transform: scale(0.95);
    -webkit-transform: scale(0.95);
    opacity: 0.8;
    transform: scale(0.95);
    transition: all 300ms ease;
  }
  .content {
    margin: auto;
    padding: 20px 0px;
    width: auto;
  }
 
}



@media only screen and (min-width: 320px) and (max-width: 759px) {
  .native-flex,
  .native-main {
    flex-flow: column nowrap;
  }

  .native-img,
  .native-details {
    margin: 0;
  }

  .native-img {
    margin-bottom: 10px;
  }

  .native-main {
    text-align: center;
    margin-bottom: 20px;
  }
}


.slick-slide {
  padding-top: 0px;
}
.slick-slide:focus {
  outline: 0;
}

.slick-initialized .slick-slide .captions {
  display: none
}
.slick-initialized .slick-current .captions {
  display: block
}

.captions {
  border-radius: 10px;
  background-color: #fff;
  color: #77342a;
  padding:20px;
  margin-top: 20px;
  text-align: center;
  position: relative;
}
.captions .title {
  font-size: 1.1em;
  color: #77342a!important;
  line-height: 1.3em;
  margin:0px 0 10px;
  padding:0px;
}
.captions .desc {
  font-size: 1.1em;
  color: #77342a;
  line-height: 1.3em;
  margin:0px;
  padding:0px;
}
.dotsline {
  position: absolute;
  left:40%;
  top:-70px;
  display: block;
  z-index: 9;
  width: 40px!important;
}


.imgcenter {
  width: 100%;
  height: 400px;
  position: absolute;
  top:20%;
  left:0px;
}
.imgbox {
  width: 300px;
  height: 400px;
  background-color: magenta;
  margin:0 auto;
  display: block;
}

.dotsbottom {
  width: 100%;
  height: auto;
  position: absolute;
  bottom: 0px;
  left:0px;
}



.boxmenu {
  width: 100%;
  background-color: brown;
  /*position: fixed;
    left:0px;*/
  margin:0px;
  padding:0px;
}
.boxinn {
  position: relative;
  width: 100%;
  background: lime;
}
.hamburger-menu-button {
  width: 40px;
  height: 40px;
  padding: 6px;
  display: block;
  position: fixed;
  z-index: 999;
  top:10px;
  right: 10px;
  margin-top: 0px;
  z-index: 100;
  background: #fff;
  border: 0px solid white;
  box-sizing: content-box;
  text-indent: 100%;
  color: transparent;
  white-space: nowrap;
  cursor: pointer;
  overflow: hidden;
  border-radius: 50%;
}
.hamburger-menu-button:focus {
  outline: 0;
}
.hamburger-menu-button-open {
  top: 50%;
  margin-top: -1px;
  left: 50%;
  margin-left: -12px;

}
.hamburger-menu-button-open, 
.hamburger-menu-button-open::before, 
.hamburger-menu-button-open::after {
  position: absolute;
  width: 24px;
  height: 2px;
  background: #77342a;
  border-radius: 4px;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}
.hamburger-menu-button-open::before, 
.hamburger-menu-button-open::after {
  left: 0;
  content: "";
}
.hamburger-menu-button-open::before {
  top: 6px;
}
.hamburger-menu-button-open::after {
  bottom: 6px;
}
.hamburger-menu-button-close {
  background: transparent;
  -webkit-transform: rotate(180deg);
          transform: rotate(180deg);
}
.hamburger-menu-button-close::before {
  -webkit-transform: translateY(-6px) rotate(45deg);
          transform: translateY(-6px) rotate(45deg);
}
.hamburger-menu-button-close::after {
  -webkit-transform: translateY(6px) rotate(-45deg);
          transform: translateY(6px) rotate(-45deg);
}
.ham-menu {
  position: absolute;
  top: 0px;
  right: 0px;
  margin: auto;
  max-width:100%;
  overflow: hidden;
}
.ham-menu ul {
  -webkit-transform: translateX(110%);
          transform: translateX(110%);
  background-color: #3896d3;
  -webkit-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
  height: 100vh;
  width: 20%;
  padding-top: 50px;
  background: #e4a224;
  z-index: 99;
  position: fixed;
  right: 0px;
  top: 0px;
}
.ham-menu.on ul {
  -webkit-transform: translateX(0px);
          transform: translateX(0px);
}
.ham-menu ul {
  font-size: 0;
}
.ham-menu ul li {
  display: block;
}
.ham-menu ul li:first-child .ham-menu ul li a {
  padding-left: 30px;
}
.ham-menu ul li a {
  padding: 15px;
  display: block;
  background-color: transparent;
  color: #fff;
  text-transform: uppercase;
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  font-size: 20px;
  font-weight: bold;
  font-style: italic;
}
.ham-menu ul li.active a, .ham-menu ul li a:hover {
  background-color: transparent;
  color: #fff !important;
} 





/* RESPONSIVE */


/* TABLET 768px ---> LAPTOP Under 1366px */
@media only screen and (min-width: 768px) and (max-width: 1365px) { 
  .container {
    width: 100%;
  }
  .title-img-section {
    width: 500px;
  }
  .imgpost {
    width: 33%;
    margin:15px;
    display: inline-block;
  }
  .content {
    width: 550px;
  }

  #feedig .title-img-section {
    width: 400px;
    height: auto;
    margin-top: 40px;
  }
  #feedig .imgpost {
    width: 25%;
  }
}

@media only screen and (min-width: 1280px) and (max-width: 1365px) { 
  #about .desc p {
    font-size: 1.3em;
  }
}

@media only screen and (min-width: 1024px) and (max-width: 1279px) { 
  #about .title-img-section {
    width: 430px
  }
  #about .desc p {
    font-size: 1.1em;
  }
}

@media only screen and (min-width: 768px) and (max-width: 1023px) { 
  #about .title-img-section {
    width: 80%
  }
  #about .desc p {
    font-size: 1em;
  }
}



/* TABLET Landscape 1024px ---> LAPTOP Under 1366px */
@media only screen and (min-width: 1024px) and (max-width: 1365px) { 
  .content {
    margin: auto;
    padding: 0px;
    width: 800px;
  }
  .center .slick-center .img-slide {
    -moz-transform: scale(1.08);
    -ms-transform: scale(1.08);
    -o-transform: scale(1.08);
    -webkit-transform: scale(1.08);
    transform: scale(1.10);
  }

}
@media only screen and (max-width: 767px) {

  .ham-menu ul {
    width: 45%;
    background-color: #fff;
    padding-top: 60px;
    padding-left: 15px;
  }
  .ham-menu ul li a {
    color: #d3ae4b!important;
    font-size: 18px;
    font-weight: bold;
    font-style: italic;
  }
  .ham-menu ul li.active a, .ham-menu ul li a:hover {
    color: #d3ae4b!important;
  }

  .mainlogo {
    height: 40px;
    margin-top: 22px;
  }
  .hamburger-menu-button {
    background-color: #d3ae4b;
  }
  .hamburger-menu-button-open, 
  .hamburger-menu-button-open::before, 
  .hamburger-menu-button-open::after {
    background-color: #fff;
  }
  .hamburger-menu-button-close {
    background-color: #d3ae4b
  }
  .container {
    width: 100%;
  }
  .col-alpha,
  .col-beta {
    width: 100%;
    float: none;
    display: block;
  }

  .title-img-section {
    width: auto
  }


  
  
  /* ABOUT */
  #about {
    background: #f9f5dc url(../img/BG-bokeh-mobile.jpg) top center;
    padding-top: 60px;    
  }
  #about .desc {
    padding-top: 0px;
  }
  #about .title-img-section {
    margin:0px auto;
    width: 60%;
  }
  #about .inn {
    padding: 0 30px 30px;
  }
  #about .col-alpha {
    float: right;
  }
  #about .col-beta {
    float: left
  }
  #about .desc p {
    font-size: 1em;
    text-align: center;
  }

  /* RESPO - SECTION - IG */
  #feedig {
    background: url(../img/igsec-bgtop-mobile.png) no-repeat top center, url(../img/igsec-bgbottom-mobile.png) no-repeat center bottom;
    background-size: 98%
  }
  #feedig .title-img-section {
    width: 70%;
    margin-top: 40px;
  }
  .imgpost {
    width: 70%;
    margin:0 auto 30px;
    display: block;
  }
  

  #find .title-img-section {
    width: 70%;
    height: auto;
  }
  .petaimg-desktop {
    display: none;
  }
  .petaimg-mobile {
    display: block;
    margin:0 auto;
    width: 100%;
  }

  #footer {
    text-align: center;
  }
  #footer .container {
    padding:0 20px;
  }
  #footer .col-alpha,
  #footer .col-beta {
    text-align: center;
  }
  .sosmed {
    width: 100%;
    padding: 10px 0 30px;
  }
  #footer .icon {
    margin:0 10px;
  }


}

@media only screen and  (max-width: 479px) {
/* BANNER - SECTION */
  .banner-desktop {
    display: none!important;
  }
  .banner-mobile {
    display: block;
  }
}
@media only screen and (min-width: 480px) and (max-width: 767px) {
  #about {
    background-size: cover
  }
  #about .title-img-section {
    width: 50%;
  }
  #about .heroimg img {
    width: 80%;
    margin:0 auto;
  }
  #features .title-img-section {
    width: 300px;
    margin-bottom: 0px;
  } 
  .content {
    margin: auto;
    padding: 0px;
    width: 410px;
  }
  .captions {
    padding: 12px;
  }
  .captions .title {
    font-size: 0.9em!important;
  }
  .captions .desc {
    font-size: 0.8em;
  }
  
  #feedig {
    background-size: 80%;
  }
  #feedig .title-img-section {
    width: 350px;
  }
  .imgpost {
    width: 30%;
    display: inline-block;
    margin:0 3px 30px;
  }
}

/* MOBILE - ALL Under < 480px */
@media only screen and (max-width: 479px) {
  .content {
    margin: auto;
    padding: 0px;
    width: 200px;
  }
  .center .slick-center .img-slide {
    -moz-transform: scale(1.08);
    -ms-transform: scale(1.08);
    -o-transform: scale(1.08);
    -webkit-transform: scale(1.08);
    transform: scale(1.10);
  }
  .title-img-section {
    width: 85%
  }
}

/* MOBILE - ALL Under < 380px */
@media only screen and (max-width: 375px) {
  .content {
    margin: auto;
    padding: 0px;
    width: 180px;
  }
  .center .slick-center .img-slide {
    -moz-transform: scale(1.08);
    -ms-transform: scale(1.08);
    -o-transform: scale(1.08);
    -webkit-transform: scale(1.08);
    transform: scale(1.10);
  }
}

@media only screen and (max-width: 320px) {
  .content {
    margin: auto;
    padding: 0px;
    width: 180px;
  }
  .center .slick-center .img-slide {
    -moz-transform: scale(1.08);
    -ms-transform: scale(1.08);
    -o-transform: scale(1.08);
    -webkit-transform: scale(1.08);
    transform: scale(1.08);
  }

  #about .title-img-section {
    width: 80%;
  }
}