.icon-box .icon { display:inline-block; height:68px; margin-bottom:20px; text-align:center; -webkit-transition:all 0.3s ease; -o-transition:all 0.3s ease; transition:all 0.3s ease; width:68px; }
.icon-box .icon em { line-height:68px; }
.icon-box .icon.icon-gray { background-color:#eeeeee; color:#555555; }
.icon-box .icon.icon-gray:hover { background-color:#d5d5d5; color:#bbbbbb; }
.icon-box .icon.icon-gray.icon-bordered { background-color:transparent; border:2px solid #eeeeee; }
.icon-box .icon.icon-gray.icon-bordered:hover { background-color:#eeeeee; color:#555555; }
.icon-box .icon.icon-dark { background-color:#111111; color:#fff; }
.icon-box .icon.icon-dark:hover { color:#5e5e5e; }
.icon-box .icon.icon-dark.icon-bordered { background-color:transparent; border:2px solid #111111; color:#111111; }
.icon-box .icon.icon-dark.icon-bordered:hover { background-color:#111111; border-color:#111111; color:#fff; }
.icon-box .icon.icon-white { background-color:#fff; color:#333333; }
.icon-box .icon.icon-white:hover { background-color:#b3b3b3; color:#000000; }
.icon-box .icon.icon-white.icon-bordered { background-color:transparent; border:2px solid #fff; color:#fff; }
.icon-box .icon.icon-white.icon-bordered:hover { background-color:#fff; border-color:#fff; color:#111111; }
.icon-box .icon.icon-white.icon-border-effect { position:relative; }
.icon-box .icon.icon-white.icon-border-effect::after { box-shadow:0 0 0 3px #fff; }
.icon-box .icon.icon-bordered { border:1px solid #777777; }
.icon-box .icon.icon-bordered:hover { background-color:#777777; color:#fff; }
.icon-box .icon.icon-rounded { border-radius:3px; }
.icon-box .icon.icon-circled { border-radius:50%; }
.icon-box .icon.icon-xs { height:30px; width:30px; }
.icon-box .icon.icon-xs em { font-size:18px; line-height:30px; }
.icon-box .icon.icon-sm { height:50px; width:50px; }
.icon-box .icon.icon-sm em {font-size:32px;font-family:pe7;line-height:50px;}
.icon-box .icon.icon-md { height:75px; width:75px; }
.icon-box .icon.icon-md em { font-size:36px; line-height:75px; }
.icon-box .icon.icon-lg { height:90px; width:90px; }
.icon-box .icon.icon-lg em { font-size:48px; line-height:90px; }
.icon-box .icon.icon-xl { height:120px; width:120px; }
.icon-box .icon.icon-xl em { font-size:60px; line-height:120px; }
.icon-box .icon.icon-border-effect { position:relative; }
.icon-box .icon.icon-border-effect::after { border-radius:50%; box-shadow:0 0 0 3px #eeeeee; box-sizing:content-box; content:""; height:100%; left:-4px; opacity:0; padding:4px; top:-4px; transform:scale(0.8); transition:transform 0.2s ease 0s, opacity 0.2s ease 0s; pointer-events:none; position:absolute; width:100%; }
.icon-box .icon.icon-border-effect.effect-flat::after { border-radius:0; }
.icon-box .icon.icon-border-effect.effect-rounded::after { border-radius:3px; }
.icon-box .icon.icon-border-effect.effect-circled::after { border-radius:50%; }
.icon-box .icon.icon-border-effect.icon-gray::after { box-shadow:0 0 0 3px #eeeeee; }
.icon-box .icon.icon-top { left:0; margin:0 auto; position:absolute; right:0; top:-32px; }
.icon-box em { display:inline-block; font-size:40px; -webkit-transition:all 0.3s ease; -o-transition:all 0.3s ease; transition:all 0.3s ease; }
.icon-box i[class*="pe-7s-"] { vertical-align:text-bottom; }
.icon-box.left { text-align:left; }
.icon-box.left a { margin-right:30px; padding:0; }
.icon-box.iconbox-border { border:1px solid #dcdcdc; }
.icon-box.iconbox-bg { background-color:#fafafa; }
.icon-box.iconbox-bg.iconbox-bg-dark { background-color:#333333; }
.icon-box .icon-box-title { margin-bottom:15px; }
.icon-box .icon-border-effect:hover::after, .icon-box:hover .icon-border-effect::after { opacity:1; transform:scale(1); }
.icon-box .icon-box-details { margin-left:80px; }