*, *:after, *:before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }

.clearfix:before, .clearfix:after { content: " "; display: table; }
.clearfix:after { clear: both; }

.container > header {
 width: 90%;
 max-width: 69em;
 margin: 0 auto;
 padding: 2.875em 1.875em 1.875em;
}

.container > header h1 {
 font-size: 2.125em;
 line-height: 1.3;
 margin: 0 0 0.6em 0;
 float: left;
 font-weight: 400;
}

.container > header > span {
 display: block;
 position: relative;
 z-index: 9999;
 font-weight: 700;
 text-transform: uppercase;
 letter-spacing: 0.5em;
 padding: 0 0 0.6em 0.1em;
}

.container > header > span span:after {
 width: 30px;
 height: 30px;
 left: -12px;
 font-size: 50%;
 top: -8px;
 font-size: 75%;
 position: relative;
}

.container > header > span span:hover:before {
 content: attr(data-content);
 text-transform: none;
 text-indent: 0;
 letter-spacing: 0;
 font-weight: 300;
 font-size: 110%;
 padding: 0.8em 1em;
 line-height: 1.2;
 text-align: left;
 left: auto;
 margin-left: 4px;
 position: absolute;
 color: #fff;
 background: #47a3da;
}

.container > header nav {
 float: right;
 text-align: center;
}

.container > header nav a {
 display: inline-block;
 position: relative;
 text-align: left;
 width: 2.5em;
 height: 2.5em;
 background: #fff;
 border-radius: 50%;
 margin: 0 0.1em;
 border: 4px solid #47a3da;
}

.container > header nav a > span {
 display: none;
}

.container > header nav a:hover:before {
 content: attr(data-info);
 color: #47a3da;
 position: absolute;
 width: 600%;
 top: 120%;
 text-align: right;
 right: 0;
 pointer-events: none;
}

.container > header nav a:hover {
 background: #47a3da;
}

.container > header nav .bp-icon:after {
 position: absolute;
 top: 0;
 left: 0;
 width: 100%;
 height: 100%;
 line-height: 2;
 text-indent: 0;
}

.container > header nav a:hover:after {
 color: #fff;
}

@media screen and (max-width: 55em) {

 .container > header h1,
 .container > header nav {
  float: none;
 }

 .container > header > span,
 .container > header h1 {
  text-align: center;
 }

 .container > header nav {
  margin: 0 auto;
 }

 .container > header > span {
  text-indent: 30px;
 }
}


.cbp-pgcontainer {
 position: relative;
 width: 100%;
 padding: 0px 0px 0px 0px;
}

.cbp-pgcontainer ul,
.cbp-pgcontainer li {
 padding: 0;
 margin: 0;
 list-style-type: none;
}

.cbp-pggrid {
 position: relative;
 text-align: center;
}
/* If flexbox is supported we'll use it to lay out the grid */
.flexbox .cbp-pggrid {
 display: -webkit-flex;
 display: -moz-flex;
 display: -ms-flex;
 display: flex;
 -webkit-flex-flow: row wrap;
 -moz-flex-flow: row wrap;
 -ms-flex-flow: row wrap;
 flex-flow: row wrap;
 -webkit-justify-content: center;
 -moz-justify-content: center;
 -ms-justify-content: center;
 -webkit-justify-content: center;
}

.cbp-pggrid > li {
 display: inline-block;
 vertical-align: top;
 position: relative;
 /*width: 33%;*/
 min-width: 220px;
 max-width: 500px;
 padding: 0px 1% 50px 1%;
 text-align: left;
 transition: 0.5s ease;
 -webkit-transition: 0.5s ease;
 -moz-transition: 0.5s ease;
 padding: 0px 20px 44px 20px;
}

.cbp-pggrid > li:hover {
/* -webkit-transform: scale(1.048);
 transform: scale(1.048);
 -webkit-font-smoothing: subpixel-antialiased;
 backface-visibility: hidden;    
 -webkit-filter: blur(0);*/
}

.flexbox .cbp-pggrid > li {
 display: block;
}

.cbp-pgcontent {
 border: 3px solid #7d7d7d;
 position: relative;
 background-color: rgb(255,255,255);
 background-color: rgba(234,234,234,0.58);
 /*padding: 40px 15px 15px 15px;*/
 padding: 15px;
 border-radius: 15px;
}

.cbp-pgrotate {
 width: 36px;
 height: 36px;
 position: absolute;
 display: block;
 color: transparent;
 font-size: 0;
 z-index: 100;
 border-bottom: 3px solid #47a3da;
 border-left: 3px solid #47a3da;
 right: 0px;
 top: 0px;
 cursor: pointer;
 text-align: center;
}

.cbp-pgrotate:before {
 font-size: 18px;
 line-height: 32px;
 color: #47a3da;
}

.no-touch .cbp-pgrotate:hover,
.cbp-pgrotate.cbp-pgrotate-active {
 background: #47a3da;
}

.no-touch .cbp-pgrotate:hover:before,
.cbp-pgrotate.cbp-pgrotate-active:before {
 color: #fff;
}

/* The item with the images will have perspective */
.cbp-pgitem {
 width: 100%;
 position: relative;
 /*padding: 2em;*/
 -webkit-perspective: 1400px;
 -moz-perspective: 1000px;
 perspective: 1000px;
 -webkit-backface-visibility: hidden;
 -moz-backface-visibility: hidden;
 backface-visibility: hidden;
}

/* The flip container */
.cbp-pgitem-flip {
 -webkit-transform-style: preserve-3d;
 -moz-transform-style: preserve-3d;
 transform-style: preserve-3d;
 -webkit-transition: -webkit-transform .4s ease-out;
 -moz-transition: -moz-transform .4s ease-out;
 transition: transform .4s ease-out;
}

/* If you want to rotate on hover instead of click, you could use something like this: 
.cbp-pgrotate:hover + .cbp-pgitem .cbp-pgitem-flip
*/
.cbp-pgitem.cbp-pgitem-showback .cbp-pgitem-flip {
 -webkit-transform: rotateY(180deg);
 -moz-transform: rotateY(180deg);
 transform: rotateY(180deg);
}

.cbp-pgitem-flip img {
 display: block;
 margin: 0 auto;
 max-width: 100%;
 max-height: 100%;
 -webkit-backface-visibility: hidden;
 -moz-backface-visibility: hidden;
 backface-visibility: hidden;
}

.cbp-pgitem img:first-child {
 position: relative;
}

/* The second image will be rotated so that we'd be looking at the back of it */
.cbp-pgitem img:nth-child(2) {
 position: absolute;
 top: 50%;
 left: 50%;
 -webkit-transform: translateX(-50%) translateY(-50%) rotateY(-180deg);
 -moz-transform: translateX(-50%) translateY(-50%) rotateY(-180deg);
 transform: translateX(-50%) translateY(-50%) rotateY(-180deg);
}

/* Fallback for browsers that don't support 3d transforms */
.no-csstransforms3d .cbp-pgitem img:nth-child(2) {
 position: relative;
 top: 0;
 left: 0;
 display: none;
}

.no-csstransforms3d .cbp-pgitem.cbp-pgitem-showback img:first-child {
 display: none;
}

.no-csstransforms3d .cbp-pgitem.cbp-pgitem-showback img:nth-child(2) {
 display: block;
}

/* The options bar */
.cbp-pgoptions {
 height: 60px;
 width: 100%;
  border-top: 3px solid #47a3da;;
}

.cbp-pgoptions > li {
 width: 20%;
 height: 100%;
 float: left;
 position: relative;
 display: block;
 cursor: pointer;
 color: transparent;
 font-size: 0;
 border-left: 3px solid #47a3da;
 -webkit-touch-callout: none;
 -webkit-user-select: none;
 -khtml-user-select: none;
 -moz-user-select: none;
 -ms-user-select: none;
 user-select: none;
}

.cbp-pgoptions > li:first-child {
 border-left: none;
} 

.no-touch .cbp-pgoptions li {
 color: #47a3da;
}

.no-touch .cbp-pgoptions li:hover,
.cbp-pgoptions li.cbp-pgoption-active {
 background: #47a3da;
}

.cbp-pgoptions li:before,
.cbp-pgoptions li > span {
 font-size: 22px;
 line-height: 60px;
 text-indent: 0;
 text-align: center;
 color: #47a3da;
}

.no-touch .cbp-pgoptions li:hover:before,
.no-touch .cbp-pgoptions li:hover > span,
.cbp-pgoptions li.cbp-pgoption-active > span  {
 color: #fff;
}

.cbp-pgoptions li.cbp-pgoptsize > span {
 font-size: 22px;
}

.cbp-pgoptions li > span {
 display: block;
}

.cbp-pgoptions li:before {
 position: absolute;
 width: 100%;
 height: 100%;
}

/* Icons */
.cbp-pgoptcompare, 
.cbp-pgoptcart, 
.cbp-pgoptfav,
.cbp-pgrotate {
speak: none;
 font-style: normal;
 font-weight: normal;
 font-variant: normal;
 text-transform: none;
 line-height: 1;
 -webkit-font-smoothing: antialiased;
}

.cbp-pgoptcompare:before {
 content: "\e001";
}

.cbp-pgoptfav:before {
 content: "\e003";
}

.cbp-pgoptfav.cbp-pgoptfav-selected:before {
 content: "\e002";
 color: #ee73b8;
}

.cbp-pgoptfav.cbp-pgoptfav-selected:hover:before {
 color: #f9c0e0;
}

.cbp-pgoptcart:before {
 content: "\e000";
}

.cbp-pgrotate:before {
 content: "\e004";
}

/* Tooltips */
.cbp-pgopttooltip {
 position: absolute;
 bottom: 180%;
 margin-bottom: 0px;
 background: #fff;
 padding: 25px;
 width: 100px;
 left: 50%;
 margin-left: -50px;
 border: 3px solid #47a3da;
 opacity: 0;
 z-index: 1000;
 visibility: hidden;
 pointer-events: none;
 -webkit-transition: visibility 0s 0.3s, opacity 0.3s, bottom 0.3s;
 -moz-transition: visibility 0s 0.3s, opacity 0.3s, bottom 0.3s;
 transition: visibility 0s 0.3s, opacity 0.3s, bottom 0.3s;
}

.cbp-pgoptions li:hover .cbp-pgopttooltip,
.cbp-pgoptions li.cbp-pgoption-active .cbp-pgopttooltip {
 visibility: visible;
 opacity: 1;
 -webkit-transition-delay: 0s;
 -moz-transition-delay: 0s;
 transition-delay: 0s;
 bottom: 100%;
 pointer-events: auto;
}

.cbp-pgopttooltip:after,
.cbp-pgopttooltip:before {
 top: 100%;
 border: solid transparent;
 content: " ";
 height: 0;
 width: 0;
 position: absolute;
 pointer-events: none;
}

.cbp-pgopttooltip:after {
 border-color: transparent;
 border-top-color: #fff;
 border-width: 10px;
 left: 50%;
 margin-left: -10px;
}

.cbp-pgopttooltip:before {
 border-color: transparent;
 border-top-color: #47a3da;
 border-width: 14px;
 left: 50%;
 margin-left: -14px;
}

/* Size tooltip */
.cbp-pgoptsize .cbp-pgopttooltip {
 margin-left: -50px;
}

.cbp-pgoptsize .cbp-pgopttooltip span {
 display: block;
 text-indent: 0;
 background: url(../images/tshirt.svg) no-repeat center center;
 background-size: 100%;
 margin: 0 auto 4px;
 text-align: center;
 font-size: 12px;
 font-weight: 700;
 color: #65b3e2;
}

.cbp-pgoptsize .cbp-pgopttooltip span:hover {
 color: #0968a1;
 -webkit-transform: scale(1.1);
 -moz-transform: scale(1.1);
 transform: scale(1.1);
}

.cbp-pgoptsize .cbp-pgopttooltip span[data-size="XL"] {
 width: 44px;
 height: 44px;
 line-height: 44px;
}

.cbp-pgoptsize .cbp-pgopttooltip span[data-size="L"] {
 width: 40px;
 height: 40px;
 line-height: 40px;
}

.cbp-pgoptsize .cbp-pgopttooltip span[data-size="M"] {
 width: 34px;
 height: 34px;
 line-height: 34px;
}

.cbp-pgoptsize .cbp-pgopttooltip span[data-size="S"] {
 width: 30px;
 height: 30px;
 line-height: 30px;
}

/* Color tooltip */
.cbp-pgoptcolor .cbp-pgopttooltip {
 padding: 5px;
}

.cbp-pgoptions li.cbp-pgoptcolor > span,
.cbp-pgoptcolor .cbp-pgopttooltip span {
 display: block;
 margin: 12px auto 0;
 text-indent: -900em;
}

.cbp-pgoptions li.cbp-pgoptcolor > span {
 width: 36px;
 height: 36px;
 border: 3px solid #fff;
}

.cbp-pgoptcolor .cbp-pgopttooltip span {
 float: left;
 margin: 4px;
 width: 34px;
 height: 34px;
}

.no-touch .cbp-pgoptcolor .cbp-pgopttooltip span:hover {
 -webkit-transform: scale(1.1);
 -moz-transform: scale(1.1);
 transform: scale(1.1);
}

.cbp-pgoptcolor span[data-color="c1"] {
 background: #72bbe9;
}

.cbp-pgoptcolor span[data-color="c2"] {
 background: #e577aa;
}

.cbp-pgoptcolor span[data-color="c3"] {
 background: #e5b178;
}

.cbp-pgoptcolor span[data-color="c4"] {
 background: #7abe93;
}

.cbp-pginfo {
 padding-top: 10px;
}

.cbp-pginfo:before,
.cbp-pginfo:after {
 content: " ";
 display: table;
}

.cbp-pginfo:after {
 clear: both;
}

.cbp-pginfo h3,
.cbp-pginfo span {
 float: left;
 width: 50%;
 font-size: 1.8em;
 padding: 10px 5px;
 margin: 0;
}
.favSportsBox {
height:160px;
}
.cbp-pginfo h3 {
 font-weight: 300;
}

.cbp-pginfo span {
 font-weight: 700;
 text-align: right;
}
/* Media Queries */

@media screen and (max-width: 768px) {
 .cbp-pggrid > li {
  width: 48%;
 }
}

@media screen and (max-width: 46.125em) {
 .cbp-pggrid > li {
  width: 48%;
  padding: 0px 10px 25px 10px;
 }
}

@media screen and (max-width: 544px) {
 .cbp-pggrid > li {
  /*width: 100%;*/
  min-width: 100px !important;
 }
}



.productImg {
  width: 140px;
  /*border-radius: 15px;*/
}
@media (max-width: 767px) {
 .productImg{
   /*border-radius: 8px;*/
 }
}

/*
@media (max-width: 1600px) {
  .content-form{
   max-width: 1000px !important;
  }
  .productImg{
    /*width: 180px;
  }
}*/
@media screen and (max-width: 544px) {
  .productImg{
    /*width: 150px;*/
  }
}
@media only screen and (max-width: 380px){
  .productImg{
    /*width: 150px;*/
  }
}
@media only screen and (max-width: 320px){
  .productImg{
    /*width: 150px;*/
  }
}
*/

.productTitle {
 padding: 0px;
 margin: 0px 0px 5px 0px;
 font-weight: 600;
 color: #333;
 text-transform: uppercase;
}
.productPrice {
 margin-top: -5px;
 font-size: 14px;
 color: #333;
 text-transform: uppercase;
}
.productPrice2 {
 margin-top: -5px;
 font-size: 14px;
 color: #333;
 text-transform: uppercase;
}
.productType {
 margin: 20px 0px 20px 0px;
 color: #333;
 text-transform: uppercase;
 font-size: 25px;
 letter-spacing: 0.05em;
}
.topSectionFilter:focus{
 text-decoration:none !important;
 color:#333;
 outline:none !important;
}
.RiderImg {
  filter: gray; /* IE6-9 */
  -webkit-filter: grayscale(1); /* Google Chrome, Safari 6+ & Opera 15+ */
  filter: grayscale(1); /* Microsoft Edge and Firefox 35+ */
}

/*top menu*/
.SFtopMenu{
 background: #f8f8f8; 
}
.SFtopMenu_mainNav_a{
 color: #333 !important;
}
.SFtopMenu_mainNav_li:hover{
 background-color: rgb(234, 234, 234) !important;
}

/*Product Page*/
.productImgPG {
  width: 650px;
  border-radius: 2px;
}
@media (max-width: 1600px) {
  .productImgPG{
    width: 650px;
  }
}
@media (max-width: 1450px) {
  .productImgPG{
    width: 400px;
  }
}
@media (max-width: 1000px) {
  .productImgPG{
    width: 350px;
  }
}
@media only screen and (max-width: 380px){
  .productImgPG{
    width: 300px;
  }
}
@media only screen and (max-width: 320px){
  .productImgPG{
    width: 250px;
  }
}
.gridPG > li {
 min-width: 250px;
 max-width: 650px;
}
.gridPG > li:hover {
 -webkit-transform: scale(1);
 transform: scale(1);
 -webkit-font-smoothing: subpixel-antialiased;
 backface-visibility: hidden;    
 -webkit-filter: blur(0);
}
.productInfo {
 margin: 80px 0px 0px 0px;
 width:100%;
 text-align:left;
 padding-left: 20px;
}
@media (max-width: 1000px) {
  .productInfo{
   margin: 10px 0px 0px 0px;
  }
} 
@media (max-width: 740px) {
  .productInfo{
   margin: 0px 0px 0px 0px;
   text-align:center;
   padding-left: 10px;
   padding-right: 10px;
  }
} 


[class*=" icon-"]:before,[class^=icon-]:before{font-style:normal;font-weight:400;speak:none;display:inline-block;text-decoration:inherit;width:1em;margin-right:.2em;text-align:center;font-variant:normal;text-transform:none;line-height:1em;margin-left:.2em;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}

.icon-fwf:before{content:'\e912'}
.icon-organic-textiles:before{content:'\e8a8'}
.icon-carbon-trust:before{content:'\e8a7'}
.icon-confidence-in-textiles:before{content:'\e8a5'}

.addToCartButton:hover{
 border-color:#000000 !important;
 background-color: rgb(0, 0, 0) !important;
 color: #ffffff;
}

/*Life-style Photos*/
.lifestyleProductPhoto {
  width: 1024px;
  border-radius: 2px;
}
@media (max-width: 1024px) {
  .lifestyleProductPhoto{
   width: 93%;
  }
  .garmentProductSection{
   width: 95% !important;
  }
}
/*@media (max-width: 1000px) {
  .lifestyleProductPhoto{
   width: 960px;
  }
}
@media only screen and (max-width: 380px){
  .lifestyleProductPhoto{
    width: 340px;
  }
}
@media only screen and (max-width: 320px){
  .lifestyleProductPhoto{
    width: 280px;
  }
}*/
/*Hats - Product Page*/
.productImgHatsDT {
  width: 450px;
  border-radius: 2px;
}
@media (max-width: 1600px) {
  .productImgHatsDT{
    width: 450px;
  }
}
@media (max-width: 1450px) {
  .productImgHatsDT{
    width: 400px;
  }
}
@media (max-width: 1000px) {
  .productImgHatsDT{
    width: 350px;
  }
}
@media only screen and (max-width: 380px){
  .productImgHatsDT{
    width: 300px;
  }
}
@media only screen and (max-width: 320px){
  .productImgHatsDT{
    width: 250px;
  }
}
/* Life-style photos <hr> tag */
hr.lifeStylePhotos {
 margin-bottom: 40px;
 margin-top:20px;
 padding: 0;
 border: none;
 height: 1px;
 background-image: -webkit-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0));
 background-image: -moz-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0));
 background-image: -ms-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0));
 background-image: -o-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0));
 color: #333;
 text-align: center;
}
/* Product-style photos <hr> tag */
hr.hrProductPhotos {
 margin-bottom: 0px;
 margin-top:20px;
 padding: 0;
 border: none;
 height: 1px;
 background-image: -webkit-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0));
 background-image: -moz-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0));
 background-image: -ms-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0));
 background-image: -o-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0));
 color: #333;
 text-align: center;
 opacity: 0.5;
}

/*Rider Photo*/
.riderMainPhoto {
  width: 200px;
  border-radius: 2px;
}
@media (max-width: 1600px) {
  .riderMainPhoto{
    width: 200px;
  }
}
@media (max-width: 1450px) {
  .riderMainPhoto{
    width: 150px;
  }
}
@media (max-width: 1000px) {
  .riderMainPhoto{
    width: 100px;
  }
}
@media only screen and (max-width: 380px){
  .riderMainPhoto{
    width: 50px;
  }
}
@media only screen and (max-width: 320px){
  .riderMainPhoto{
    width: 25px;
  }
}
/*Rider Videos*/
.video-responsive{
    overflow:hidden;
    padding-bottom:56.25%;
    position:relative;
    height:0;
}
.video-responsive iframe{
    left:0;
    top:0;
    height:100%;
    width:100%;
    position:absolute;
}
/*Rider HR*/
.riderHR {
 margin-bottom: 40px;
 margin-top:20px;
 padding: 0;
 border: none;
 height: 1px;
 background-image: -webkit-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0));
 background-image: -moz-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0));
 background-image: -ms-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0));
 background-image: -o-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0));
 color: #333;
 text-align: center;
}
/*Rider Insta*/
.riderInsta {
  width: 200px;
  border-radius: 2px;
}
@media (max-width: 1600px) {
  .riderInsta{
    width: 200px;
  }
}
@media only screen and (max-width: 380px){
  .riderInsta{
    width: 300px;
  }
}
@media only screen and (max-width: 320px){
  .riderInsta{
    width: 250px;
  }
}
.mobileToolsScreen{
 margin-top: 50px !important;
 z-index: 9999999 !important;
 border: 1px solid #fff;
 border-left: 0px;
 border-top: 0px;
 border-bottom-right-radius: 5px;
 color: #333;
 background: #f8f8f8 !important;
 height: 375px !important;
 width: 140px !important;
}


.item_minimized {
  transition: transform 1s;
  transform: scaleX(1) scaleY(1);
}
.item_maximized {
  transform: scaleX(1) scaleY(1);
}


/* ==== Custom Toggle Switch ==== */
.switch-checkbox {
  display: none;
}
.switch {
  width: 38px;
  height: 21px;
  display: inline-block;
  position: relative;
  border: 2px solid #e5e5e5;
  border-radius: 15px;
  background: #e5e5e5;
  cursor: pointer;
  transition: 0.2s;
  text-align: center;
}
.switch:after {
  content: ' ';
  color: #e5e5e5;
  top: 0px;
  left: 0px;
  width: 17px;
  height: 17px;
  position: absolute;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.5);
  transition: 0.3s;
  font-size: 15px;
  font-weight: 600;
}

.switch-checkbox:checked + .switch {
  background: #f0b428;
  border-color: #f0b428;
}

.switch-checkbox:checked + .switch:before {
  transform: scale(0);
  transition: 0s;
}

.switch-checkbox:checked + .switch:after {
  left: calc(100% - 17px);
  content: '\2713';
  color: #f0b428;
}

@media screen and (max-width: 767px) {
 .switch {
   top: 6px !important;
   left: 16px !important;
   width: 27px;
   height: 13px;
 }
 .switch:after {
   width: 9px;
   height: 9px;
   font-size: 7px;
   font-weight: 900;
 }
 .switch-checkbox:checked + .switch:after {
   left: calc(100% - 9px);
 }
}

.iconWithGrid{
 width: 16px !important;
 height: 16px !important;
}

.boxIsSelected{
 border: 3px solid #f0b428 !important;
}