.c4 li {
  width: 25%;
  height: auto;
  position: relative;
  float: left;
}

.c4 li:nth-child(4n) {
  margin-right: 10;
}

.c4 li img {
  width: 100%;
  height: auto;
  float: left;
  margin: 0;
}

/*  Hover State */
.c4.da-thumbs li  article.da-animate i.fa {
  margin-top: 90px;
}

.c4.da-thumbs li  article.da-animate h3 {
  margin-top: 35px;
}

/* Portolio Hover */
.da-thumbs li, .da-thumbs li  img {
  display: block;
  position: relative;
}

.da-thumbs li {
  overflow: hidden;
}

.da-thumbs li  article {
  cursor: pointer;
  position: absolute;
  background-image: url(../images/image-hover.png);
  background-repeat: repeat;
  width: 100%;
  height: 100%;
}

.da-thumbs li  article.da-animate {
  -webkit-transition: all 0.2s ease;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}

.da-thumbs li  article.da-animate i.fa {
  font-size: 27px;
  color: #edebeb;
}

.da-thumbs li  article.da-animate h3 {
  color: #edebeb;
  font-family: 'PT Sans Caption', sans-serif;
  font-weight: bold;
  font-size: 13px;
}

.da-thumbs li  a {
  color: #e3e3e3;
  display: block;
}

.da-thumbs {
  text-align: center;
}

/*  Hover State */
.related-projects.da-thumbs li  article.da-animate i.fa {
  margin-top: 90px;
}

.related-projects.da-thumbs li  article.da-animate h3 {
  margin-top: 35px;
}

/*-----------------------------------------------------------------------------------------*/

/*  Bottom,Top Margin & Clear */

/*-----------------------------------------------------------------------------------------*/


.bottom2 {
  margin-bottom: 2px !important;
}

.top2 {
  margin-top: 2px !important;
}

.bottom5 {
  margin-bottom: 5px !important;
}

.top5 {
  margin-top: 5px !important;
}

.bottom10 {
  margin-bottom: 10px !important;
}

.top10 {
  margin-top: 10px !important;
}

.bottom20 {
  margin-bottom: 20px !important;
}

.top20 {
  margin-top: 20px !important;
}

.bottom30 {
  margin-bottom: 30px !important;
}

.top30 {
  margin-top: 30px !important;
}

.bottom40 {
  margin-bottom: 40px !important;
}

.top40 {
  margin-top: 40px !important;
}

.bottom50 {
  margin-bottom: 50px !important;
}

.top50 {
  margin-top: 50px !important;
}

.bottom60 {
  margin-bottom: 60px !important;
}

.top60 {
  margin-top: 60px !important;
}

.bottom70 {
  margin-bottom: 70px !important;
}

.top70 {
  margin-top: 70px !important;
}

.bottom80 {
  margin-bottom: 80px !important;
}

.top80 {
  margin-top: 80px !important;
}

.bottom90 {
  margin-bottom: 90px !important;
}

.top90 {
  margin-top: 90px !important;
}

.bottom100 {
  margin-bottom: 100px !important;
}

.top100 {
  margin-top: 100px !important;
}

.bottom150 {
  margin-bottom: 150px !important;
}

.top150 {
  margin-top: 150px !important;
}

.bottom160 {
  margin-bottom: 160px !important;
}

.top160 {
  margin-top: 160px !important;
}

.bottom170 {
  margin-bottom: 170px !important;
}

.top170 {
  margin-top: 170px !important;
}

.bottom180 {
  margin-bottom: 180px !important;
}

.top180 {
  margin-top: 180px !important;
}

.bottom200 {
  margin-bottom: 200px !important;
}

.bottom200 {
  margin-bottom: 200px !important;
}

.top200 {
  margin-top: 200px !important;
}

.bottom250 {
  margin-bottom: 250px !important;
}

.top250 {
  margin-top: 250px !important;
}

.bottom300 {
  margin-bottom: 300px !important;
}

.top300 {
  margin-top: 300px !important;
}

.pbottom5 {
  padding-bottom: 5px !important;
}

.ptop5 {
  padding-top: 5px !important;
}

.pbottom10 {
  padding-bottom: 10px !important;
}

.ptop10 {
  padding-top: 10px !important;
}

.pbottom20 {
  padding-bottom: 20px !important;
}

.ptop20 {
  padding-top: 20px !important;
}

.pbottom30 {
  padding-bottom: 30px !important;
}

.ptop30 {
  padding-top: 30px !important;
}

.pbottom40 {
  padding-bottom: 40px !important;
}

.ptop40 {
  padding-top: 40px !important;
}

.pbottom50 {
  padding-bottom: 50px !important;
}

.ptop50 {
  padding-top: 50px !important;
}

.pbottom60 {
  padding-bottom: 60px !important;
}

.ptop60 {
  padding-top: 60px !important;
}

.pbottom70 {
  padding-bottom: 70px !important;
}

.ptop70 {
  padding-top: 70px !important;
}

.pbottom80 {
  padding-bottom: 80px !important;
}

.ptop80 {
  padding-top: 80px !important;
}

.pbottom90 {
  padding-bottom: 90px !important;
}

.ptop90 {
  padding-top: 90px !important;
}

.pbottom100 {
  padding-bottom: 100px !important;
}

.ptop100 {
  padding-top: 100px !important;
}

.pright10 {
  padding-right: 10px !important;
}

.pleft10 {
  padding-left: 10px !important;
}

.pright20 {
  padding-right: 20px !important;
}

.pleft20 {
  padding-left: 20px !important;
}

.pright30 {
  padding-right: 30px !important;
}

.pleft30 {
  padding-left: 30px !important;
}

.pright40 {
  padding-right: 40px !important;
}

.pleft40 {
  padding-left: 40px !important;
}

.pright50 {
  padding-right: 50px !important;
}

.pleft50 {
  padding-left: 50px !important;
}

.pright60 {
  padding-right: 60px !important;
}

.pleft60 {
  padding-left: 60px !important;
}

.pright70 {
  padding-right: 70px !important;
}

.pleft70 {
  padding-left: 70px !important;
}

.pright80 {
  padding-right: 80px !important;
}

.pleft80 {
  padding-left: 80px !important;
}

.pright90 {
  padding-right: 90px !important;
}

.pleft90 {
  padding-left: 90px !important;
}

.pright100 {
  padding-right: 100px !important;
}

.pleft100 {
  padding-left: 100px !important;
}

.p10 {
  padding: 10px !important;
}

.p20 {
  padding: 20px !important;
}

.p30 {
  padding: 30px !important;
}

.p40 {
  padding: 40px !important;
}

.p50 {
  padding: 50px !important;
}

.p60 {
  padding: 60px !important;
}

.p70 {
  padding: 70px !important;
}

.p80 {
  padding: 80px !important;
}

.p90 {
  padding: 90px !important;
}

.p100 {
  padding: 100px !important;
}

.clear {
  clear: both !important;
  visibility: hidden !important;
  width: 0 !important;
  height: 0 !important;
}

.fbottom2 {
  margin-bottom: 2px !important;
}

.ftop2 {
  margin-top: -2px !important;
  position: relative;
  z-index: 999;
}

.fbottom5 {
  margin-bottom: 5px !important;
}

.ftop5 {
  margin-top: -5px !important;
  position: relative;
  z-index: 999;
}

.fbottom10 {
  margin-bottom: 10px !important;
}

.ftop10 {
  margin-top: -10px !important;
  position: relative;
  z-index: 999;
}

.ftop15 {
  margin-top: -15px !important;
  position: relative;
  z-index: 999;
}

.fbottom20 {
  margin-bottom: 20px !important;
}

.ftop20 {
  margin-top: -20px !important;
  position: relative;
  z-index: 999;
}

.fbottom30 {
  margin-bottom: 30px !important;
}

.ftop30 {
  margin-top: -30px !important;
  position: relative;
  z-index: 999;
}

.fbottom40 {
  margin-bottom: 40px !important;
}

.ftop40 {
  margin-top: -40px !important;
  position: relative;
  z-index: 999;
}

.fbottom50 {
  margin-bottom: 50px !important;
  position: relative;
  z-index: 999;
}

.ftop50 {
  margin-top: -50px !important;
  position: relative;
  z-index: 999;
}

.fbottom60 {
  margin-bottom: 60px !important;
  position: relative;
  z-index: 999;
}

.ftop60 {
  margin-top: -60px !important;
  position: relative;
  z-index: 999;
}

.fbottom70 {
  margin-bottom: 70px !important;
  position: relative;
  z-index: 999;
}

.ftop70 {
  margin-top: -70px !important;
  position: relative;
  z-index: 999;
}

.fbottom80 {
  margin-bottom: -80px !important;
  position: relative;
  z-index: 999;
}

.ftop80 {
  margin-top: -80px !important;
  position: relative;
  z-index: 999;
}

.fbottom90 {
  margin-bottom: 90px !important;
  position: relative;
  z-index: 999;
}

.ftop90 {
  margin-top: -90px !important;
  position: relative;
  z-index: 999;
}

.fbottom100 {
  margin-bottom: 100px !important;
  position: relative;
  z-index: 999;
}

.ftop100 {
  margin-top: -100px !important;
  position: relative;
  z-index: 999;
}

.fbottom150 {
  margin-bottom: 150px !important;
  position: relative;
  z-index: 999;
}

.ftop150 {
  margin-top: -150px !important;
  position: relative;
  z-index: 999;
}

.fbottom200 {
  margin-bottom: 200px !important;
  position: relative;
  z-index: 999;
}

.ftop200 {
  margin-top: -200px !important;
  position: relative;
  z-index: 999;
}

.fbottom250 {
  margin-bottom: 250px !important;
}

.ftop250 {
  margin-top: -250px !important;
  position: relative;
  z-index: 999;
}

.brdone {
  border: solid #fff 2px;
}

/*-----------------------------------------------------------------------------------------*/

/*  SCROLL UP PAGE  */

/*-----------------------------------------------------------------------------------------*/
#scrollUp {
  bottom: 20px;
  right: 20px;
  background-color: rgba(0, 0, 0, 0.2);
  background-image: url(../images/arrow-up.png);
  background-repeat: no-repeat;
  background-position: center;
  color: #fff;
  font-size: 12px;
  font-family: sans-serif;
  text-decoration: none;
  width: 45px;
  height: 45px;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
  -webkit-transition: background 200ms linear;
  -moz-transition: background 200ms linear;
  transition: background 200ms linear;
}

#scrollUp:hover {
  opacity: 1;
  background-color: #b4965a;
}

/*-----------------------------------------------------------------------------------------*/

/*  SLIDING TAGS  */

/*-----------------------------------------------------------------------------------------*/


.tags {
  zoom: 1;
  font-family: Arial;
}

.tags:before, .tags:after {
  content: '';
  display: table;
}

.tags:after {
  clear: both;
}

.tags li {
  position: relative;
  float: left;
  margin: 0 0 8px 12px;
}

.tags li:active {
  margin-top: 1px;
  margin-bottom: 7px;
}

.tags li:after {
  content: '';
  z-index: 2;
  position: absolute;
  top: 10px;
  right: -2px;
  width: 5px;
  height: 6px;
  opacity: .95;
  background: #eb6b22;
  border-radius: 3px 0 0 3px;
  -webkit-box-shadow: inset 1px 0 #99400e;
  box-shadow: inset 1px 0 #99400e;
}

.tags a, .tags span {
  display: block;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.tags a {
  height: 26px;
  line-height: 23px;
  padding: 0 9px 0 8px;
  font-size: 12px;
  color: #555;
  text-decoration: none;
  text-shadow: 0 1px white;
  background: #fafafa;
  border-width: 1px 0 1px 1px;
  border-style: solid;
  border-color: #dadada #d2d2d2 #c5c5c5;
  border-radius: 3px 0 0 3px;
  background-image: -webkit-linear-gradient(top, #fcfcfc, #f0f0f0);
  background-image: -moz-linear-gradient(top, #fcfcfc, #f0f0f0);
  background-image: -o-linear-gradient(top, #fcfcfc, #f0f0f0);
  background-image: linear-gradient(to bottom, #fcfcfc, #f0f0f0);
  -webkit-box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.7), 0 1px 2px rgba(0, 0, 0, 0.05);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.7), 0 1px 2px rgba(0, 0, 0, 0.05);
}

.tags a:hover span {
  padding: 0 7px 0 6px;
  max-width: 40px;
  -webkit-box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.15), 1px 1px 2px rgba(0, 0, 0, 0.2);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.15), 1px 1px 2px rgba(0, 0, 0, 0.2);
}

.tags span {
  position: absolute;
  top: 1px;
  left: 100%;
  z-index: 2;
  overflow: hidden;
  max-width: 0;
  height: 24px;
  line-height: 21px;
  padding: 0 0 0 2px;
  color: white;
  text-shadow: 0 -1px rgba(0, 0, 0, 0.3);
  background: #eb6b22;
  border: 1px solid;
  border-color: #d15813 #c85412 #bf5011;
  border-radius: 0 2px 2px 0;
  opacity: .95;
  background-image: -webkit-linear-gradient(top, #ed7b39, #df5e14);
  background-image: -moz-linear-gradient(top, #ed7b39, #df5e14);
  background-image: -o-linear-gradient(top, #ed7b39, #df5e14);
  background-image: linear-gradient(to bottom, #ed7b39, #df5e14);
  -webkit-transition: 0.3s ease-out;
  -moz-transition: 0.3s ease-out;
  -o-transition: 0.3s ease-out;
  transition: 0.3s ease-out;
  -webkit-transition-property: padding, max-width;
  -moz-transition-property: padding, max-width;
  -o-transition-property: padding, max-width;
  transition-property: padding, max-width;
}

.green li:after {
  background: #65bb34;
  -webkit-box-shadow: inset 1px 0 #3a6b1e;
  box-shadow: inset 1px 0 #3a6b1e;
}

.green span {
  background: #65bb34;
  border-color: #549b2b #4f9329 #4b8b27;
  background-image: -webkit-linear-gradient(top, #71ca3f, #5aa72e);
  background-image: -moz-linear-gradient(top, #71ca3f, #5aa72e);
  background-image: -o-linear-gradient(top, #71ca3f, #5aa72e);
  background-image: linear-gradient(to bottom, #71ca3f, #5aa72e);
}

.blue li:after {
  background: #56a3d5;
  -webkit-box-shadow: inset 1px 0 #276f9e;
  box-shadow: inset 1px 0 #276f9e;
}

.blue span {
  background: #56a3d5;
  border-color: #3591cd #318cc7 #2f86be;
  background-image: -webkit-linear-gradient(top, #6aaeda, #4298d0);
  background-image: -moz-linear-gradient(top, #6aaeda, #4298d0);
  background-image: -o-linear-gradient(top, #6aaeda, #4298d0);
  background-image: linear-gradient(to bottom, #6aaeda, #4298d0);
}

/*-----------------------------------------------------------------------------------------*/

/*  PAGE ELEMENTS   */

/*-----------------------------------------------------------------------------------------*/

/*  Accordions  */
.accordions {
  width: 100%;
}

.accordions h2 {
  margin: 0px !important;
  line-height: 33px !important;
  padding: 3px 0 !important;
  font-size: 11px;
  border-top: 1px dashed #cccccc;
  cursor: pointer;
}

.accordions .first-item, .accordions .active .first-item {
  border-top: none !important;
}

.accordions h2 i.fa {
  margin-bottom: -5px;
  margin-right: 12px;
  color: #fff;
  background-color: #d1d1d1;
  padding: 6px;
  border-radius: 2px;
}

.accordions h2.active i.fa {
  background-color: #fff;
}

.accordions p {
  line-height: 20px;
  margin: 5px 0;
}

.accordion-hide {
  display: none;
}



.widget {
  position: relative;
  margin: 50px auto;
  width: 100%;
  background: white;
  border: 1px solid #ccc;
  border-radius: 4px;
  -webkit-box-shadow: 0 0 8px rgba(0, 0, 0, 0.07);
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.07);
  font-family: Arial;
}

.widget-tabs {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  padding: 9px 12px 0;
  text-align: left;  /* Make the last tab in the DOM the left-most tab on the screen.
       That way we can activate it by default and still be able to
       deactivate it later using the ~ selector. */
  direction: rtl;
  background: #f5f5f5;
  border-bottom: 1px solid #ddd;
  border-radius: 3px 3px 0 0;
}

.widget-tab, .widget-list:target:first-of-type ~ .widget-tabs > .widget-tab:first-child ~ .widget-tab, .widget-list:target:nth-of-type(2) ~ .widget-tabs > .widget-tab:nth-child(2) ~ .widget-tab, .widget-list:target:last-of-type ~ .widget-tabs > .widget-tab:last-child ~ .widget-tab {
  position: relative;
  display: inline-block;
  vertical-align: top;
  margin-top: 3px;
  line-height: 36px;
  font-weight: normal;
  color: #999;
  background: #fcfcfc;
  border: solid #ddd;
  border-width: 1px 1px 0;
  border-radius: 5px 5px 0 0;  /* Reset %active-widget-tab */
  padding-bottom: 0;
  bottom: auto;
}

.widget-tab > .widget-tab-link, .widget-list:target:first-of-type ~ .widget-tabs > .widget-tab:first-child ~ .widget-tab > .widget-tab-link, .widget-list:target:nth-of-type(2) ~ .widget-tabs > .widget-tab:nth-child(2) ~ .widget-tab > .widget-tab-link, .widget-list:target:last-of-type ~ .widget-tabs > .widget-tab:last-child ~ .widget-tab > .widget-tab-link {
  margin: 0;
  border-top: 0;
}

.widget-tab + .widget-tab {
  margin-right: -1px;
}

.widget-tab:last-child, .widget-list:target:first-of-type ~ .widget-tabs > .widget-tab:first-child, .widget-list:target:nth-of-type(2) ~ .widget-tabs > .widget-tab:nth-child(2), .widget-list:target:last-of-type ~ .widget-tabs > .widget-tab:last-child {
  bottom: -1px;
  margin-top: 0;
  padding-bottom: 2px;
  line-height: 34px;
  font-weight: bold;
  color: #555;
  background: white;
  border-top: 0;
}

.widget-tab:last-child > .widget-tab-link, .widget-list:target:first-of-type ~ .widget-tabs > .widget-tab:first-child > .widget-tab-link, .widget-list:target:nth-of-type(2) ~ .widget-tabs > .widget-tab:nth-child(2) > .widget-tab-link, .widget-list:target:last-of-type ~ .widget-tabs > .widget-tab:last-child > .widget-tab-link {
  margin: 0 -1px;
  border-top: 4px solid #4cc8f1;
}

/* Deactivate the default tab when a preceding tab is activated. */
.widget-tab-link {
  display: block;
  min-width: 60px;
  padding: 0 15px;
  color: inherit;
  text-align: center;
  text-decoration: none;
  border-radius: 4px 4px 0 0;
}

.widget-list {
  display: none;
  padding-top: 50px;  /* The last list is activated (visible) by default. */
}

.widget-list > li + li {
  border-top: 1px solid #e8e8e8;
}

.widget-list:last-of-type {
  display: block;
}

.widget-list:target {
  display: block;  /* Hide the default list when another is activated. */

  /* First list activates the first tab, second list activates the second tab, etc. */
}

.widget-list:target ~ .widget-list {
  display: none;
}

.widget-list-link {
  display: block;
  line-height: 18px;
  padding: 10px 12px;
  font-weight: bold;
  color: #555;
  text-decoration: none;
  cursor: pointer;
}

.widget-list-link:hover {
  background: #f7f7f7;
}

li:last-child > .widget-list-link {
  border-radius: 0 0 3px 3px;
}

.widget-list-link > img {
  float: left;
  width: 32px;
  height: 32px;
  margin: 2px 12px 0 0;
}

.widget-list-link > span {
  display: block;
  font-size: 11px;
  font-weight: normal;
  color: #999;
}

/*  Links & Buttons */
.btn-large {
  padding: 10px 20px;
  font-size: 24px;
}

.btn-medium {
  padding: 6px 12px;
  font-size: 16px;
}

.btn-small {
  padding: 5px 8px;
  font-size: 12px;
}

.btn-mini {
  padding: 2px 4px;
  font-size: 11px;
}

.btn-dashed {
  border: 1px dashed #fff !important;
}

.btn-standard, button.btn-standard, input[type="submit"].btn-standard {
  border: none;
  color: #333 !important;
  font-family: Arial;
  cursor: pointer;
  border-radius: 2px;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  transition: background-color 0.4s;
  -webkit-transition: background-color 0.4s;
  -moz-transition: background-color 0.4s;
  line-height: 2.1;
  text-decoration: none;
}

.btn-standard:hover, .btn-standard.green:hover, .btn-standard.blue:hover, .btn-standard.purple:hover, button.btn-standard:hover, button.btn-standard.green:hover, button.btn-standard.purple:hover, input[type="submit"].btn-standard:hover, input[type="submit"].btn-standard.green:hover, input[type="submit"].btn-standard.purple:hover {
  background-color: #444;
  color: #FFF !important;
}

.btn-standard.green {
  background-color: #70be46;
}

.btn-standard.purple {
  background-color: #9b5eca;
}

.btn-standard.orange {
  background-color: #ff8507;
}

.btn-standard.blue {
  background-color: #289dcc;
}

.btn-standard.dark {
  background-color: #3a3a3a;
}

.btn-standard i.fa {
  margin-right: 4px;
}

.brownbutton {
  -moz-box-shadow: inset 0px 1px 0px 0px #a6827e;
  -webkit-box-shadow: inset 0px 1px 0px 0px #a6827e;
  box-shadow: inset 0px 1px 0px 0px #a6827e;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #7d5d3b), color-stop(1, #634b30));
  background: -moz-linear-gradient(top, #7d5d3b 5%, #634b30 100%);
  background: -webkit-linear-gradient(top, #7d5d3b 5%, #634b30 100%);
  background: -o-linear-gradient(top, #7d5d3b 5%, #634b30 100%);
  background: -ms-linear-gradient(top, #7d5d3b 5%, #634b30 100%);
  background: linear-gradient(to bottom, #7d5d3b 5%, #634b30 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#7d5d3b', endColorstr='#634b30', GradientType=0);
  background-color: #7d5d3b;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  border: 1px solid #54381e;
  display: inline-block;
  cursor: pointer;
  color: #ffffff;
  font-family: Arial;
  font-size: 13px;
  padding: 6px 24px;
  text-decoration: none;
  text-shadow: 0px 1px 0px #4d3534;
}

.brownbutton:hover {
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #634b30), color-stop(1, #7d5d3b));
  background: -moz-linear-gradient(top, #634b30 5%, #7d5d3b 100%);
  background: -webkit-linear-gradient(top, #634b30 5%, #7d5d3b 100%);
  background: -o-linear-gradient(top, #634b30 5%, #7d5d3b 100%);
  background: -ms-linear-gradient(top, #634b30 5%, #7d5d3b 100%);
  background: linear-gradient(to bottom, #634b30 5%, #7d5d3b 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#634b30', endColorstr='#7d5d3b', GradientType=0);
  background-color: #634b30;
}

.brownbutton:active {
  position: relative;
  top: 1px;
}

.bluebutton {
  -moz-box-shadow: inset 0px -3px 7px 0px #29bbff;
  -webkit-box-shadow: inset 0px -3px 7px 0px #29bbff;
  box-shadow: inset 0px -3px 7px 0px #29bbff;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #2dabf9), color-stop(1, #0688fa));
  background: -moz-linear-gradient(top, #2dabf9 5%, #0688fa 100%);
  background: -webkit-linear-gradient(top, #2dabf9 5%, #0688fa 100%);
  background: -o-linear-gradient(top, #2dabf9 5%, #0688fa 100%);
  background: -ms-linear-gradient(top, #2dabf9 5%, #0688fa 100%);
  background: linear-gradient(to bottom, #2dabf9 5%, #0688fa 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#2dabf9', endColorstr='#0688fa', GradientType=0);
  background-color: #2dabf9;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  border: 1px solid #0b0e07;
  display: inline-block;
  cursor: pointer;
  color: #ffffff;
  font-family: Arial;
  font-size: 15px;
  padding: 9px 23px;
  text-decoration: none;
  text-shadow: 0px 1px 0px #263666;
}

.bluebutton:hover {
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #0688fa), color-stop(1, #2dabf9));
  background: -moz-linear-gradient(top, #0688fa 5%, #2dabf9 100%);
  background: -webkit-linear-gradient(top, #0688fa 5%, #2dabf9 100%);
  background: -o-linear-gradient(top, #0688fa 5%, #2dabf9 100%);
  background: -ms-linear-gradient(top, #0688fa 5%, #2dabf9 100%);
  background: linear-gradient(to bottom, #0688fa 5%, #2dabf9 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0688fa', endColorstr='#2dabf9', GradientType=0);
  background-color: #0688fa;
}

.bluebutton:active {
  position: relative;
  top: 1px;
}

.dbluebutton {
  -moz-box-shadow: inset 0px 1px 0px 0px #54a3f7;
  -webkit-box-shadow: inset 0px 1px 0px 0px #54a3f7;
  box-shadow: inset 0px 1px 0px 0px #54a3f7;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #007dc1), color-stop(1, #0061a7));
  background: -moz-linear-gradient(top, #007dc1 5%, #0061a7 100%);
  background: -webkit-linear-gradient(top, #007dc1 5%, #0061a7 100%);
  background: -o-linear-gradient(top, #007dc1 5%, #0061a7 100%);
  background: -ms-linear-gradient(top, #007dc1 5%, #0061a7 100%);
  background: linear-gradient(to bottom, #007dc1 5%, #0061a7 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#007dc1', endColorstr='#0061a7', GradientType=0);
  background-color: #007dc1;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  border: 1px solid #124d77;
  display: inline-block;
  cursor: pointer;
  color: #ffffff;
  font-family: Arial;
  font-size: 13px;
  padding: 6px 24px;
  text-decoration: none;
  text-shadow: 0px 1px 0px #154682;
}

.dbluebutton:hover {
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #0061a7), color-stop(1, #007dc1));
  background: -moz-linear-gradient(top, #0061a7 5%, #007dc1 100%);
  background: -webkit-linear-gradient(top, #0061a7 5%, #007dc1 100%);
  background: -o-linear-gradient(top, #0061a7 5%, #007dc1 100%);
  background: -ms-linear-gradient(top, #0061a7 5%, #007dc1 100%);
  background: linear-gradient(to bottom, #0061a7 5%, #007dc1 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0061a7', endColorstr='#007dc1', GradientType=0);
  background-color: #0061a7;
}

.dbluebutton:active {
  position: relative;
  top: 1px;
}

.greenbutton {
  -moz-box-shadow: inset 0px 1px 0px 0px #a4e271;
  -webkit-box-shadow: inset 0px 1px 0px 0px #a4e271;
  box-shadow: inset 0px 1px 0px 0px #a4e271;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #89c403), color-stop(1, #77a809));
  background: -moz-linear-gradient(top, #89c403 5%, #77a809 100%);
  background: -webkit-linear-gradient(top, #89c403 5%, #77a809 100%);
  background: -o-linear-gradient(top, #89c403 5%, #77a809 100%);
  background: -ms-linear-gradient(top, #89c403 5%, #77a809 100%);
  background: linear-gradient(to bottom, #89c403 5%, #77a809 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#89c403', endColorstr='#77a809', GradientType=0);
  background-color: #89c403;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  border-radius: 6px;
  border: 1px solid #74b807;
  display: inline-block;
  cursor: pointer;
  color: #ffffff;
  font-family: Arial;
  font-size: 15px;
  font-weight: bold;
  padding: 6px 24px;
  text-decoration: none;
  text-shadow: 0px 1px 0px #528009;
}

.greenbutton:hover {
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #77a809), color-stop(1, #89c403));
  background: -moz-linear-gradient(top, #77a809 5%, #89c403 100%);
  background: -webkit-linear-gradient(top, #77a809 5%, #89c403 100%);
  background: -o-linear-gradient(top, #77a809 5%, #89c403 100%);
  background: -ms-linear-gradient(top, #77a809 5%, #89c403 100%);
  background: linear-gradient(to bottom, #77a809 5%, #89c403 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#77a809', endColorstr='#89c403', GradientType=0);
  background-color: #77a809;
}

.greenbutton:active {
  position: relative;
  top: 1px;
}

.purplebutton {
  -moz-box-shadow: inset 0px 1px 0px 0px #e184f3;
  -webkit-box-shadow: inset 0px 1px 0px 0px #e184f3;
  box-shadow: inset 0px 1px 0px 0px #e184f3;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #c123de), color-stop(1, #a20dbd));
  background: -moz-linear-gradient(top, #c123de 5%, #a20dbd 100%);
  background: -webkit-linear-gradient(top, #c123de 5%, #a20dbd 100%);
  background: -o-linear-gradient(top, #c123de 5%, #a20dbd 100%);
  background: -ms-linear-gradient(top, #c123de 5%, #a20dbd 100%);
  background: linear-gradient(to bottom, #c123de 5%, #a20dbd 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#c123de', endColorstr='#a20dbd', GradientType=0);
  background-color: #c123de;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  border-radius: 6px;
  border: 1px solid #a511c0;
  display: inline-block;
  cursor: pointer;
  color: #ffffff;
  font-family: Arial;
  font-size: 15px;
  font-weight: bold;
  padding: 6px 24px;
  text-decoration: none;
  text-shadow: 0px 1px 0px #9b14b3;
}

.purplebutton:hover {
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #a20dbd), color-stop(1, #c123de));
  background: -moz-linear-gradient(top, #a20dbd 5%, #c123de 100%);
  background: -webkit-linear-gradient(top, #a20dbd 5%, #c123de 100%);
  background: -o-linear-gradient(top, #a20dbd 5%, #c123de 100%);
  background: -ms-linear-gradient(top, #a20dbd 5%, #c123de 100%);
  background: linear-gradient(to bottom, #a20dbd 5%, #c123de 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#a20dbd', endColorstr='#c123de', GradientType=0);
  background-color: #a20dbd;
}

.purplebutton:active {
  position: relative;
  top: 1px;
}

.twitterbutton {
  -moz-box-shadow: 0px 1px 0px 0px #f0f7fa;
  -webkit-box-shadow: 0px 1px 0px 0px #f0f7fa;
  box-shadow: 0px 1px 0px 0px #f0f7fa;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #33bdef), color-stop(1, #019ad2));
  background: -moz-linear-gradient(top, #33bdef 5%, #019ad2 100%);
  background: -webkit-linear-gradient(top, #33bdef 5%, #019ad2 100%);
  background: -o-linear-gradient(top, #33bdef 5%, #019ad2 100%);
  background: -ms-linear-gradient(top, #33bdef 5%, #019ad2 100%);
  background: linear-gradient(to bottom, #33bdef 5%, #019ad2 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#33bdef', endColorstr='#019ad2', GradientType=0);
  background-color: #33bdef;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  border-radius: 6px;
  border: 1px solid #057fd0;
  display: inline-block;
  cursor: pointer;
  color: #ffffff;
  font-family: Arial;
  font-size: 15px;
  font-weight: bold;
  padding: 6px 24px;
  text-decoration: none;
  text-shadow: 0px -1px 0px #5b6178;
}

.twitterbutton:hover {
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #019ad2), color-stop(1, #33bdef));
  background: -moz-linear-gradient(top, #019ad2 5%, #33bdef 100%);
  background: -webkit-linear-gradient(top, #019ad2 5%, #33bdef 100%);
  background: -o-linear-gradient(top, #019ad2 5%, #33bdef 100%);
  background: -ms-linear-gradient(top, #019ad2 5%, #33bdef 100%);
  background: linear-gradient(to bottom, #019ad2 5%, #33bdef 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#019ad2', endColorstr='#33bdef', GradientType=0);
  background-color: #019ad2;
}

.twitterbutton:active {
  position: relative;
  top: 1px;
}

.greybutton {
  -moz-box-shadow: inset 0px 1px 0px 0px #ffffff;
  -webkit-box-shadow: inset 0px 1px 0px 0px #ffffff;
  box-shadow: inset 0px 1px 0px 0px #ffffff;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ffffff), color-stop(1, #f6f6f6));
  background: -moz-linear-gradient(top, #ffffff 5%, #f6f6f6 100%);
  background: -webkit-linear-gradient(top, #ffffff 5%, #f6f6f6 100%);
  background: -o-linear-gradient(top, #ffffff 5%, #f6f6f6 100%);
  background: -ms-linear-gradient(top, #ffffff 5%, #f6f6f6 100%);
  background: linear-gradient(to bottom, #ffffff 5%, #f6f6f6 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f6f6f6', GradientType=0);
  background-color: #ffffff;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  border-radius: 6px;
  border: 1px solid #dcdcdc;
  display: inline-block;
  cursor: pointer;
  color: #666666;
  font-family: Arial;
  font-size: 15px;
  font-weight: bold;
  padding: 6px 24px;
  text-decoration: none;
  text-shadow: 0px 1px 0px #ffffff;
}

.greybutton:hover {
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #f6f6f6), color-stop(1, #ffffff));
  background: -moz-linear-gradient(top, #f6f6f6 5%, #ffffff 100%);
  background: -webkit-linear-gradient(top, #f6f6f6 5%, #ffffff 100%);
  background: -o-linear-gradient(top, #f6f6f6 5%, #ffffff 100%);
  background: -ms-linear-gradient(top, #f6f6f6 5%, #ffffff 100%);
  background: linear-gradient(to bottom, #f6f6f6 5%, #ffffff 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f6f6f6', endColorstr='#ffffff', GradientType=0);
  background-color: #f6f6f6;
}

.greybutton:active {
  position: relative;
  top: 1px;
}

.redbutton {
  -moz-box-shadow: inset 0px 1px 0px 0px #f29c93;
  -webkit-box-shadow: inset 0px 1px 0px 0px #f29c93;
  box-shadow: inset 0px 1px 0px 0px #f29c93;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #fe1a00), color-stop(1, #ce0100));
  background: -moz-linear-gradient(top, #fe1a00 5%, #ce0100 100%);
  background: -webkit-linear-gradient(top, #fe1a00 5%, #ce0100 100%);
  background: -o-linear-gradient(top, #fe1a00 5%, #ce0100 100%);
  background: -ms-linear-gradient(top, #fe1a00 5%, #ce0100 100%);
  background: linear-gradient(to bottom, #fe1a00 5%, #ce0100 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fe1a00', endColorstr='#ce0100', GradientType=0);
  background-color: #fe1a00;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  border-radius: 6px;
  border: 1px solid #d83526;
  display: inline-block;
  cursor: pointer;
  color: #ffffff;
  font-family: Arial;
  font-size: 15px;
  font-weight: bold;
  padding: 6px 24px;
  text-decoration: none;
  text-shadow: 0px 1px 0px #b23e35;
}

.redbutton:hover {
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ce0100), color-stop(1, #fe1a00));
  background: -moz-linear-gradient(top, #ce0100 5%, #fe1a00 100%);
  background: -webkit-linear-gradient(top, #ce0100 5%, #fe1a00 100%);
  background: -o-linear-gradient(top, #ce0100 5%, #fe1a00 100%);
  background: -ms-linear-gradient(top, #ce0100 5%, #fe1a00 100%);
  background: linear-gradient(to bottom, #ce0100 5%, #fe1a00 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ce0100', endColorstr='#fe1a00', GradientType=0);
  background-color: #ce0100;
}

.redbutton:active {
  position: relative;
  top: 1px;
}

/*  Dropcaps  */
.dropcap-v1 p, .dropcap-v2 p, .dropcap-v3 p {
  text-align: justify;
}

.dropcap-v1 p:first-letter, .dropcap-v2 p:first-letter, .dropcap-v3 p:first-letter {
  font-size: 50px;
  line-height: 32px;
  float: left;
}

.dropcap-v2 p:first-letter {
  border-radius: 2px;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  box-shadow: 0 0 2px #e0e0e0;
  -webkit-box-shadow: 0 0 2px #e0e0e0;
  -moz-box-shadow: 0 0 2px #e0e0e0;
  margin-top: 6px;
}

.dropcap-v1 p:first-letter, .dropcap-v3 p:first-letter {
  padding-right: 10px;
}

.dropcap-v2 p:first-letter {
  padding: 4px 10px;
  margin-right: 10px;
  color: #444;
  background: #fff;
  border: 1px solid #e0e0e0;
}

/*  Blocquote */
blockquote.bq, blockquote.bq p {
  display: block;
  float: right;
  max-width: 800px;
  font-size: 12px;
  line-height: 20px;
  color: #777;
  font-style: italic;
  background: #fafafa;
}

blockquote.bq p {
  margin-bottom: 0;
  text-align: left;
}

blockquote.bq {
  padding: 15px 20px;
}

blockquote.bq cite {
  display: block;
  font-size: 12px;
  color: #555;
}

blockquote.bq cite:before {
  content: "\2014 \0020";
}

blockquote.bq cite a, blockquote.bq cite a:visited, blockquote.bq cite a:visited {
  color: #555;
}

/*  Notifications */
.notification {
  margin: 15px 0;
  width: 100%;
  padding: 10px 0;
  border-radius: 2px;
  -moz-border-radius: 2px;
  -webkit-border-radius: 2px;
  box-shadow: inset 0 0 3px #fff;
  -moz-box-shadow: inset 0 0 3px #fff;
  -webkit-box-shadow: inset 0 0 3px #fff;
}

.notification p {
  padding: 0;
  margin-left: 40px;
  margin-right: 45px;
  margin-bottom: 0;
}

.notification i.fa {
  float: left;
  margin-left: 15px;
  font-size: 14px;
  margin-top: 2px;
}

.notification.notice {
  border-left: 1px solid #e8e7e7;
  background-color: #fafafa;
}

.notification.warning {
  border-left: 1px solid #f5dc7d;
  background-color: #fcf7d9;
}

.notification.success {
  border-left: 1px solid #c2d288;
  background-color: #e3ebc6;
}

.notification.error {
  border-left: 1px solid #f7c7c9;
  background-color: #f9e5e6;
}

.notification.info {
  border-left: 1px solid #9ac9df;
  background-color: #d8ecf5;
}

.notification.notice {
  color: #666 !important;
}

.notification.warning {
  color: #c4a21b !important;
}

.notification.success {
  color: #8fa442 !important;
}

.notification.error {
  color: #b3696c !important;
}

.notification.info {
  color: #6f8da9 !important;
}

/*-----------------------------------------------------------------------------------------*/

/*  FONTS FACE - TEXT */

/*-----------------------------------------------------------------------------------------*/


.arial {
  font-family: Arial;
}

/*font size*/
.sz2 {
  font-size: 2px;
}

.sz11 {
  font-size: 11px;
}

.sz12 {
  font-size: 12px;
}

.sz13 {
  font-size: 13px;
}

.sz14 {
  font-size: 14px;
}

.sz15 {
  font-size: 15px;
}

.sz16 {
  font-size: 16px;
}

.sz18 {
  font-size: 18px;
}

.sz20 {
  font-size: 20px;
}

.sz22 {
  font-size: 22px;
}

.sz24 {
  font-size: 24px;
}

.sz26 {
  font-size: 26px;
}

.sz30 {
  font-size: 30px;
}

.sz36 {
  font-size: 36px;
}

.sz40 {
  font-size: 40px;
}

.sz48 {
  font-size: 48px;
}

.sz55 {
  font-size: 55px;
}

.sz60 {
  font-size: 60px;
}

.svw48 {
  font-size: 5vmax;
}

.svw38 {
  font-size: 3vmax;
}

.svw14 {
  font-size: 1vmax;
}

.italic {
  font-style: italic;
}

.bold {
  font-weight: bold;
}

.justify {
  text-align: justify !important;
}

.stroke1wt{
  -webkit-text-stroke-width: 2px;
   -webkit-text-stroke-color: #FFF;
}

.txtright {
  text-align: right;
}

.txtleft {
  text-align: left;
}

.txtcenter {
  text-align: center;
}

.lsp200 {
  letter-spacing: inherit;
}

/*text colors*/
.white {
  color: #FFF !important;
}

.blued {
  color: #0058C4;
}

.black {
  color: #000;
}

.red {
  color: #d20f06;
}

.yellow {
  color: #f6c019;
}

.oyellow {
  color: #f9ab05;
}

.dgreen {
  color: #72883b;
}

.lgrey {
  color: #999;
}

.grey {
  color: #333;
}

.mgrey {
  color: #666;
}

.blue {
  color: #0656db;
}

.gold {
  color: #a8814b;
}

.blueww {
  color: #1353a2;
}

.brown {
  color: #683915;
}

.pink {
  color: #fa0266;
}

.lemon {
  color: #b0f802;
}

.violet {
  color: #c702f8;
}

.orange {
  color: #f87c02;
}

.cyan {
  color: #07e8f6;
}

p {
  margin-bottom: 1.5em
}

.l24 {
  line-height: 24px !important;
}

.l22 {
  line-height: 22px !important;
}

.l20 {
  line-height: 20px !important;
}

.l14 {
  line-height: 14px !important;
}

.l15 {
  line-height: 15px !important;
}

.l16 {
  line-height: 16px !important;
}

.l18 {
  line-height: 18px !important;
}

.lheight1 {
  line-height: 1.5 !important;
}

/*table {
  width: 100%;
  border-collapse: collapse;
  margin: 10px auto;
  font-family: Arial;
}

/* Zebra striping */
/*tr:nth-of-type(odd) {
  background: #eee;
}

th {
  background: #eca806;
  color: black;
  font-weight: bold;
}

td, th {
  padding: 10px;
  border: 1px solid #ccc;
  text-align: left;
  font-size: 14px;
}

/* 
Max width before this PARTICULAR table gets nasty
This query will take effect for any screen smaller than 760px
and also iPads specifically.

@media 
only screen and (max-width:760px), (min-device-width:768px) and (max-device-width:1024px) {
  table {
    width: 100%;
  }

  /* Force table to not be like tables anymore 
  table, thead, tbody, th, td, tr {
    display: block;
  }

  /* Hide table headers (but not display: none;, for accessibility) 
  thead tr {
    position: absolute;
    top: -9999px;
    left: -9999px;
  }

  tr {
    border: 1px solid #ccc;
  }

  td {

    /* Behave  like a "row" 
    border: none;
    border-bottom: 1px solid #eee;
    position: relative;
    padding-left: 50%;
  }

  td:before {

    /* Now like a table header 
    position: absolute;   /* Top/left values mimic padding 
    top: 6px;
    left: 6px;
    width: 45%;
    padding-right: 10px;
    white-space: nowrap;    /* Label the data 
    content: attr(data-column);
    color: #000;
    font-weight: bold;
  }

}*/

/*-----------------------------------------------------------------------------------------*/

/*  TOOLTIP */

/*-----------------------------------------------------------------------------------------*/




.tooltip {
  position: relative; /* make span relative to anchor */
  text-decoration: none; /* no underline */
  cursor: pointer; /* make cursor point */
  font-size: 12px;
}

.tooltip span {

  /* main body of tooltip */
  position: absolute; /* AP it */
  bottom: 66px; /* FADE IN/OUT BEGIN */
  left: 50%; /* CENTER TOOLTIP */
  margin-left: -72px; /* CENTER TOOLTIP */
  width: 130px; /* tootip width */
  opacity: 0; /* HIDE TOOLTIP in modern browsers */
  visibility: hidden; /* HIDE TOOLTIP in IE */
  padding: 10px 5px; /* padding */
  color: #fff; /* text color */
  font: bold 75%/1.5 Arial, Helvetica, sans-serif; /* font */
  text-align: center; /* center text */
  pointer-events: none; /* no unintended tooltip popup for modern browsers */
  border-radius: 6px; /* round corners */
  text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6); /* text shadow */
  background-color: rgba(0, 0, 0, 0.7);
  background: rgba(0, 0, 0, 0.7);
  border: 2px solid rgb(255, 255, 255); /* IE6/7/8 */
  border: 2px solid rgba(255, 255, 255, .8); /* modern browsers */
  box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.5); /* shadow */
  -webkit-transition: all 0.3s ease-in-out; /* animate tooltip */
  -moz-transition: all 0.3s ease-in-out; /* animate tooltip */
  -o-transition: all 0.3s ease-in-out; /* animate tooltip */
  -ms-transition: all 0.3s ease-in-out; /* animate tooltip */
  transition: all 0.3s ease-in-out; /* animate tooltip */
}

.tooltip span.dif {

  /* different width tooltip */
  width: 190px; /* width */
  margin-left: -102px; /* center it */
}

.tooltip span:before, .tooltip span:after {

  /* bottom triangle - the white border */
  content: ''; /* add html content */
  position: absolute; /* AP bottom triangle */
  bottom: -13px; /* position bottom triangle */
  left: 50%; /* center bottom triangle */
  margin-left: -12px; /* center bottom triangle */
  border-left: 12px solid transparent; /* build bottom triangle */
  border-right: 12px solid transparent; /* build bottom triangle */
  border-top: 12px solid rgb(255, 255, 255); /* build bottom triangle IE6/7/8 */
  border-top: 12px solid rgba(255, 255, 255, .8); /* build bottom triangle modern browsers */
}

.tooltip span:after {

  /* top triangle - the blue background */
  bottom: -10px; /* position top triangle */
  margin-left: -10px; /* center top triangle */
  border-width: 10px; /* build top triangle */
  border-top: 10px solid rgb(0, 0, 0, 0.6); /* build top triangle IE6/7/8 */
  border-top: 10px solid rgba(0, 0, 0, 0.6); /* build top triangle modern browsers */
}

.tooltip:hover span {

  /* reveal tooltip */
  opacity: 1; /* REVEAL TOOLTIP in modern browsers */
  bottom: 44px; /* FADE IN/OUT END */
  visibility: visible; /* REVEAL TOOLTIP in IE */
}

.tooltip span:hover {
  visibility: hidden; /* hide tooltip when moving from link to span in IE */
}

@media screen and (min-device-width:320px) and (max-device-width:768px) {
  .tooltip span {
    display: none;
  }

  .tooltip:hover span {
    display: block;
  }

}

/* iPad & iPhone simulate :hover */
.tooltip1 {
  position: relative;
  font-family: Arial;
}

.tooltip1:before, .tooltip:after {
  position: absolute;
  transition: All 0.5s ease;
  -webkit-transition: All 0.5s ease;
  -moz-transition: All 0.5s ease;
  -o-transition: All 0.5s ease;
  margin-left: -100px;
  left: 50%;
  bottom: 300%;
  display: block;
  color: #000;
  opacity: 0;
  visibility: hidden;
}

.tooltip1:before {
  content: attr(title);
  border: solid 1px #0088cc;
  background: #FFF;
  width: 200px;
  text-align: center;
  z-index: 2;
  font-size: 13px;
  line-height: 18px;
  padding: 5px;
}

.tooltip1:after {
  content: '\25c6';
  margin-left: 0;
  margin-top: 10px;
  width: 15px;
  height: 15px;
  z-index: 1;
  line-height: 28px;
  color: #0088cc;
  font-size: 20px;
}

.tooltip1:hover:before, .tooltip:hover:after {
  bottom: 150%;
  opacity: 1;
  visibility: visible;
}

/* setup tooltips 
.tooltip {
 position: relative;
}
.tooltip:before,
.tooltip:after {
 display: block;
 opacity: 0;
 pointer-events: none;
 position: absolute;
}
.tooltip:after {
  border-right: 6px solid transparent;
  border-bottom: 6px solid rgba(0,0,0,.75); 
 border-left: 6px solid transparent;
 content: '';
 height: 0;
   top: 20px;
   left: 20px;
 width: 0;
}
.tooltip:before {
 background: rgba(0,0,0,.75);
 border-radius: 2px;
 color: #fff;
 content: attr(data-title);
 font-size: 14px;
 padding: 6px 10px;
   top: 26px;
 white-space: nowrap;
}

/* the animations */

/* fade 
.tooltip.fade:after,
.tooltip.fade:before {
 transform: translate3d(0,-10px,0);
 transition: all .15s ease-in-out;
}
.tooltip.fade:hover:after,
.tooltip.fade:hover:before {
 opacity: 1;
 transform: translate3d(0,0,0);
}

/* expand 
.tooltip.expand:before {
 transform: scale3d(.2,.2,1);
 transition: all .2s ease-in-out;
}
.tooltip.expand:after {
 transform: translate3d(0,6px,0);
 transition: all .1s ease-in-out;
}
.tooltip.expand:hover:before,
.tooltip.expand:hover:after {
 opacity: 1;
 transform: scale3d(1,1,1);
}
.tooltip.expand:hover:after {
 transition: all .2s .1s ease-in-out;
}

/* swing 
.tooltip.swing:before,
.tooltip.swing:after {
 transform: translate3d(0,30px,0) rotate3d(0,0,1,60deg);
 transform-origin: 0 0;
 transition: transform .15s ease-in-out, opacity .2s;
}
.tooltip.swing:after {
 transform: translate3d(0,60px,0);
 transition: transform .15s ease-in-out, opacity .2s;
}
.tooltip.swing:hover:before,
.tooltip.swing:hover:after {
 opacity: 1;
 transform: translate3d(0,0,0) rotate3d(1,1,1,0deg);
}*/

.tooltip2 {
  display: inline;
  position: relative;
}

.tooltip2:hover {
  color: #c00;
  text-decoration: none;
}

.tooltip2:hover:after {
  background: #111;
  background: rgba(0, 0, 0, .8);
  border-radius: .5em;
  bottom: 1.35em;
  color: #fff;
  content: attr(title);
  display: block;
  left: 1em;
  padding: .3em 1em;
  position: absolute;
  text-shadow: 0 1px 0 #000;
  white-space: nowrap;
  z-index: 98;
}

.tooltip2:hover:before {
  border: solid;
  border-color: #111 transparent;
  border-color: rgba(0, 0, 0, .8) transparent;
  border-width: .4em .4em 0 .4em;
  bottom: 1em;
  content: "";
  display: block;
  left: 2em;
  position: absolute;
  z-index: 99;
}

/*<a href="tel:+919976688666" class="tooltip2" title="Call Now">+91 99766 88666</a>*/
.tooltip3 {
  display: inline;
  position: relative;
}

.tooltip3:hover:after {
  background: #333;
  background: rgba(0, 0, 0, .8);
  border-radius: 5px;
  bottom: 26px;
  color: #fff;
  content: attr(title);
  left: 20%;
  padding: 5px 15px;
  position: absolute;
  z-index: 98;
  width: 220px;
}

.tooltip3:hover:before {
  border: solid;
  border-color: #333 transparent;
  border-width: 6px 6px 0 6px;
  bottom: 20px;
  content: "";
  left: 50%;
  position: absolute;
  z-index: 99;
}

/*<a href="#" title="This is some information for our tooltip." class="tooltip"><span title="More">CSS3 Tooltip</span></a>  */
[data-balloon] {
  position: relative;
}

[data-balloon]:before, [data-balloon]:after {
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  filter: alpha(opacity=0);
  -khtml-opacity: 0;
  -moz-opacity: 0;
  opacity: 0;
  pointer-events: none;
  -webkit-transition: all 0.18s ease-out 0.18s;
  transition: all 0.18s ease-out 0.18s;
  bottom: 100%;
  left: 50%;
  position: absolute;
  z-index: 10;
  -webkit-transform: translate(-50%, 10px);
  -ms-transform: translate(-50%, 10px);
  transform: translate(-50%, 10px);
  -webkit-transform-origin: top;
  -ms-transform-origin: top;
  transform-origin: top;
}

[data-balloon]:after {
  background: rgba(17, 17, 17, 0.9);
  border-radius: 4px;
  color: #fff;
  content: attr(data-balloon);
  font-size: 12px;
  padding: .5em 1em;
  white-space: nowrap;
  margin-bottom: 11px;
}

[data-balloon]:before {
  background: url('data:image/svg+xml;utf8,<svg xmlns=!string!width=!string!height=!string!><path fill=!string!transform=!string!d=!string!/></svg>') no-repeat;
  background-size: 100% auto;
  height: 6px;
  width: 18px;
  content: "http://www.w3.org/2000/svg";
  margin-bottom: 5px;
}

[data-balloon]:hover:before, [data-balloon]:hover:after {
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  filter: alpha(opacity=100);
  -khtml-opacity: 1;
  -moz-opacity: 1;
  opacity: 1;
  pointer-events: auto;
  -webkit-transform: translate(-50%, 0);
  -ms-transform: translate(-50%, 0);
  transform: translate(-50%, 0);
}

[data-balloon][data-balloon-break]:after {
  white-space: normal;
}

[data-balloon-pos="36px"]:before, [data-balloon-pos="12px"]:after {
  bottom: auto;
  left: 50%;
  top: 100%;
  -webkit-transform: translate(-50%, -10px);
  -ms-transform: translate(-50%, -10px);
  transform: translate(-50%, -10px);
}

[data-balloon-pos="rgba(17, 17, 17, 0.9)"]:after {
  margin-top: 11px;
}

[data-balloon-pos="rotate(0)"]:before {
  background: url('data:image/svg+xml;utf8,<svg xmlns=!string!width=!string!height=!string!><path fill=!string!transform=!string!d=!string!/></svg>') no-repeat;
  background-size: 100% auto;
  height: 6px;
  width: 18px;
  margin-top: 5px;
  margin-bottom: 0;
}

[data-balloon-pos="M2.658,0.000 C-13.615,0.000 50.938,0.000 34.662,0.000 C28.662,0.000 23.035,12.002 18.660,12.002 C14.285,12.002 8.594,0.000 2.658,0.000 Z"]:hover:before, [data-balloon-pos=""]:hover:after {
  -webkit-transform: translate(-50%, 0);
  -ms-transform: translate(-50%, 0);
  transform: translate(-50%, 0);
}

[data-balloon-pos="down"]:before, [data-balloon-pos="down"]:after {
  bottom: auto;
  left: auto;
  right: 100%;
  top: 50%;
  -webkit-transform: translate(10px, -50%);
  -ms-transform: translate(10px, -50%);
  transform: translate(10px, -50%);
}

[data-balloon-pos="down"]:after {
  margin-right: 11px;
}

[data-balloon-pos="down"]:before {
  background: url('data:image/svg+xml;utf8,<svg xmlns=!string!width=!string!height=!string!><path fill=!string!transform=!string!d=!string!/></svg>') no-repeat;
  background-size: 100% auto;
  height: 18px;
  width: 6px;
  margin-right: 5px;
  margin-bottom: 0;
}

[data-balloon-pos="http://www.w3.org/2000/svg"]:hover:before, [data-balloon-pos="36px"]:hover:after {
  -webkit-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  transform: translate(0, -50%);
}

[data-balloon-pos="12px"]:before, [data-balloon-pos="rgba(17, 17, 17, 0.9)"]:after {
  bottom: auto;
  left: 100%;
  top: 50%;
  -webkit-transform: translate(-10px, -50%);
  -ms-transform: translate(-10px, -50%);
  transform: translate(-10px, -50%);
}

[data-balloon-pos="rotate(180 18 6)"]:after {
  margin-left: 11px;
}

[data-balloon-pos="M2.658,0.000 C-13.615,0.000 50.938,0.000 34.662,0.000 C28.662,0.000 23.035,12.002 18.660,12.002 C14.285,12.002 8.594,0.000 2.658,0.000 Z"]:before {
  background: url('data:image/svg+xml;utf8,<svg xmlns=!string!width=!string!height=!string!><path fill=!string!transform=!string!d=!string!/></svg>') no-repeat;
  background-size: 100% auto;
  height: 18px;
  width: 6px;
  margin-bottom: 0;
  margin-left: 5px;
}

[data-balloon-pos="down"]:hover:before, [data-balloon-pos="down"]:hover:after {
  -webkit-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  transform: translate(0, -50%);
}

[data-balloon-length]:after {
  white-space: normal;
}

[data-balloon-length="left"]:after {
  width: 80px;
}

[data-balloon-length="left"]:after {
  width: 150px;
}

[data-balloon-length="left"]:after {
  width: 260px;
}

[data-balloon-length="left"]:after {
  width: 90vw;
}

@media screen and (min-width:768px) {
  [data-balloon-length="http://www.w3.org/2000/svg"]:after {
    width: 380px;
  }

}

[data-balloon-length="12px"]:after {
  width: 100%;
}

/*<span data-balloon="Whats up!" data-balloon-pos="up">Hover me!</span>
<span data-balloon="Whats up!" data-balloon-pos="left">Hover me!</span>
<span data-balloon="Whats up!" data-balloon-pos="right">Hover me!</span>
<span data-balloon="Whats up!" data-balloon-pos="down">Hover me!</span>
<span data-balloon-length="small" data-balloon="Hi." data-balloon-pos="up">Hover me!</span>
<span data-balloon-length="medium" data-balloon="Now that's a super big text we have over here right? Lorem ipsum dolor sit I'm done." data-balloon-pos="up">I'm a medium tooltip.</span>
<a href="#" data-balloon-length="large" data-balloon="What about something really big? This may surpass your window dimensions. Imagine you're on that boring class with that boring teacher and you didn't slept so well last night. Suddenly you're sleeping in class. Can you believe it?!" data-balloon-pos="up">I'm a large tooltip</a>
<a href="#" data-balloon-length="xlarge" data-balloon="What about something really big? This may surpass your window dimensions. Imagine you're on that boring class with that boring teacher and you didn't slept so well last night. Suddenly you're sleeping in class. Can you believe it?!" data-balloon-pos="up">I'm a Xlarge tooltip</a>
<a href="#" data-balloon-length="fit" data-balloon="What about something really big? This may surpass your window dimensions. Imagine you're on that boring class with that boring teacher and you didn't slept so well last night. Suddenly you're sleeping in class. Can you believe it?!" data-balloon-pos="up">My width will fit to element</a>

*/

/*-----------------------------------------------------------------------------------------*/

/*  BACKGROUND COLOR  */

/*-----------------------------------------------------------------------------------------*/

.bgul{
  /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#074b88+0,074b88+50,e62026+50,e62026+100 */
background: #074b88; /* Old browsers */
background: -moz-linear-gradient(left, #074b88 0%, #074b88 50%, #e62026 50%, #e62026 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left, #074b88 0%,#074b88 50%,#e62026 50%,#e62026 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right, #074b88 0%,#074b88 50%,#e62026 50%,#e62026 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#074b88', endColorstr='#e62026',GradientType=1 ); /* IE6-9 */
display: table;
}

.bgblacktrans9 {
  background-color: rgba(0, 0, 0, 0.9);
  background: rgba(0, 0, 0, 0.9);
}

.bgblacktrans8 {
  background-color: rgba(0, 0, 0, 0.8);
  background: rgba(0, 0, 0, 0.8);
}

.bgblacktrans7 {
  background-color: rgba(0, 0, 0, 0.7);
  background: rgba(0, 0, 0, 0.7);
}

.bgblacktrans3 {
  background-color: rgba(0, 0, 0, 0.3);
  background: rgba(0, 0, 0, 0.3);
}

.bgblacktrans4 {
  background-color: rgba(0, 0, 0, 0.4);
  background: rgba(0, 0, 0, 0.4);
}

.bgblacktrans5 {
  background-color: rgba(0, 0, 0, 0.5);
  background: rgba(0, 0, 0, 0.5);
}

.bgwhitetrans {
  background-color: rgba(255, 255, 255, 0.7);
  background: rgba(255, 255, 255, 0.7);
}

.bgwhite {
  background-color: #FFF;
  display: table;
}

.bgwhiteh {
  background-color: #f1f2f4;
  display: table;
}

.bggrey {
  background-color: #e1e0dd;
  display: table;
}

.bgjbyellow1 {
  background-color: #f4a606;
  display: table;
}

.bgjbyellow2 {
  background-color: #f6c019;
  display: table;
}

.bggrey1 {
  background-color: #cccccc;
  display: table;
}

.bgdarkgrey {
  background-color: #3a3838;
  display: table;
}

.bgblack {
  background-color: #000;
  display: table;
}

.bgwblue1 {
  background-color: #0661ae;
  display: table;
}

.bgwblue2 {
  background-color: #01017b;
  display: table;
}

.bggwglass {

  /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,f1f1f1+50,e1e1e1+51,f6f6f6+100;White+Gloss+%231 */
  background: #ffffff; /* Old browsers */
  background: -moz-linear-gradient(top, #ffffff 0%, #f1f1f1 50%, #e1e1e1 51%, #f6f6f6 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(top, #ffffff 0%, #f1f1f1 50%, #e1e1e1 51%, #f6f6f6 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom, #ffffff 0%, #f1f1f1 50%, #e1e1e1 51%, #f6f6f6 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="36px", endColorstr="rgba(17, 17, 17, 0.9)", GradientType=0); /* IE6-9 */
}

.bgblugrd {

  /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#cedbe9+0,aac5de+17,6199c7+50,3a84c3+51,419ad6+59,4bb8f0+71,3a8bc2+84,26558b+100;Blue+Gloss */
  background: rgb(206, 219, 233); /* Old browsers */
  background: -moz-linear-gradient(top, rgba(206, 219, 233, 1) 0%, rgba(170, 197, 222, 1) 17%, rgba(97, 153, 199, 1) 50%, rgba(58, 132, 195, 1) 51%, rgba(65, 154, 214, 1) 59%, rgba(75, 184, 240, 1) 71%, rgba(58, 139, 194, 1) 84%, rgba(38, 85, 139, 1) 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(top, rgba(206, 219, 233, 1) 0%, rgba(170, 197, 222, 1) 17%, rgba(97, 153, 199, 1) 50%, rgba(58, 132, 195, 1) 51%, rgba(65, 154, 214, 1) 59%, rgba(75, 184, 240, 1) 71%, rgba(58, 139, 194, 1) 84%, rgba(38, 85, 139, 1) 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom, rgba(206, 219, 233, 1) 0%, rgba(170, 197, 222, 1) 17%, rgba(97, 153, 199, 1) 50%, rgba(58, 132, 195, 1) 51%, rgba(65, 154, 214, 1) 59%, rgba(75, 184, 240, 1) 71%, rgba(58, 139, 194, 1) 84%, rgba(38, 85, 139, 1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="rotate(-90 18 18)", endColorstr="M2.658,0.000 C-13.615,0.000 50.938,0.000 34.662,0.000 C28.662,0.000 23.035,12.002 18.660,12.002 C14.285,12.002 8.594,0.000 2.658,0.000 Z", GradientType=0); /* IE6-9 */
}

.bggregrd {

  /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#9dd53a+0,a1d54f+50,80c217+51,7cbc0a+100;Green+Gloss+%231 */
  background: rgb(157, 213, 58); /* Old browsers */
  background: -moz-linear-gradient(top, rgba(157, 213, 58, 1) 0%, rgba(161, 213, 79, 1) 50%, rgba(128, 194, 23, 1) 51%, rgba(124, 188, 10, 1) 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(top, rgba(157, 213, 58, 1) 0%, rgba(161, 213, 79, 1) 50%, rgba(128, 194, 23, 1) 51%, rgba(124, 188, 10, 1) 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom, rgba(157, 213, 58, 1) 0%, rgba(161, 213, 79, 1) 50%, rgba(128, 194, 23, 1) 51%, rgba(124, 188, 10, 1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="left", endColorstr="left", GradientType=0); /* IE6-9 */
}

.bggold {
  background-color: #b4965a;
  display: table;
}

.bggoldlt {
  background-color: #d49f36;
  display: table;
}

.bggoldgl {
  background-color: #a88644;
  display: table;
}

.bgviolet {
  background-color: #8103bb;
  display: table;
}

.bgcyan {
  background-color: #0992d9;
  display: table;
}

.bggreen1 {
  background-color: #698a34;
  display: table;
}

.bgorange {
  background-color: #fa7103;
  display: table;
}

.bggreen2 {
  background-color: #0a7308;
  display: table;
}

.bggreen3 {
  background-color: #B4C366;
  display: table;
}

.bgbrown {
  background-color: #683915;
  display: table;
}

.bgoyellow {
  background-color: #f6a501;
  display: table;
}

.bglemon {
  background-color: #c9fa03;
  display: table;
}

.bgred {
  background-color: #f00707;
  display: table;
}

.bggreen {
  background-color: #4fbf04;
  display: table;
}

.bggreen1 {
  background-color: #72883b;
  display: table;
}

.bgblue {
  background-color: #064da6;
  display: table;
}

.bgpink {
  background-color: #fc005e;
  display: table;
}

.bglgreen {
  background-color: #5ac43d;
  display: table;
}

/*-----------------------------------------------------------------------------------------*/

/*  LINKS & COLORS  */

/*-----------------------------------------------------------------------------------------*/

.easein {
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}

.linkgcyan a:link {
  text-decoration: none;
  color: #999;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}

.linkgcyan a:visited {
  text-decoration: none;
  color: #999;
}

.linkgcyan a:active {
  text-decoration: none;
  color: #999;
}

.linkgcyan a:hover {
  text-decoration: none;
  color: #09F;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}

.linkglemon a:link {
  text-decoration: none;
  color: #999;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}

.linkglemon a:visited {
  text-decoration: none;
  color: #999;
}

.linkglemon a:active {
  text-decoration: none;
  color: #999;
}

.linkglemon a:hover {
  text-decoration: none;
  color: #CF0;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}

.linkgpink a:link {
  text-decoration: none;
  color: #999;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}

.linkgpink a:visited {
  text-decoration: none;
  color: #999;
}

.linkgpink a:active {
  text-decoration: none;
  color: #999;
}

.linkgpink a:hover {
  text-decoration: none;
  color: #FD0072;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}

.linkgorange a:link {
  text-decoration: none;
  color: #999;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}

.linkgorange a:visited {
  text-decoration: none;
  color: #999;
}

.linkgorange a:active {
  text-decoration: none;
  color: #999;
}

.linkgorange a:hover {
  text-decoration: none;
  color: #F60;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}

.class5 a:link {
  text-decoration: none;
  color: #666;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}

.class5 a:visited {
  text-decoration: none;
  color: #666;
}

.class5 a:active {
  text-decoration: none;
  color: #666;
}

.class5 a:hover {
  text-decoration: none;
  color: #005BB7;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}

.class6 a:link {
  text-decoration: none;
  color: #666;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}

.class6 a:visited {
  text-decoration: none;
  color: #666;
}

.class6 a:active {
  text-decoration: none;
  color: #666;
}

.class6 a:hover {
  text-decoration: none;
  color: #FD0072;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}

.classww a:link {
  text-decoration: none;
  color: #333;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}

.classww a:visited {
  text-decoration: none;
  color: #333;
}

.classww a:active {
  text-decoration: none;
  color: #333;
}

.classww a:hover {
  text-decoration: none;
  color: #0062bb;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}

.classww1 a:link {
  text-decoration: none;
  color: #0062bb;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}

.classww1 a:visited {
  text-decoration: none;
  color: #0062bb;
}

.classww1 a:active {
  text-decoration: none;
  color: #0062bb;
}

.classww1 a:hover {
  text-decoration: none;
  color: #999;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}

.linkgred a:link {
  text-decoration: none;
  color: #999;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}

.linkgred a:visited {
  text-decoration: none;
  color: #999;
}

.linkgred a:active {
  text-decoration: none;
  color: #999;
}

.linkgred a:hover {
  text-decoration: none;
  color: #db0808;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}

.linkbred a:link {
  text-decoration: none;
  color: #000;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}

.linkbred a:visited {
  text-decoration: none;
  color: #000;
}

.linkbred a:active {
  text-decoration: none;
  color: #000;
}

.linkbred a:hover {
  text-decoration: none;
  color: #db0808;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}

.linkgyellow a:link {
  text-decoration: none;
  color: #999;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}

.linkgyellow a:visited {
  text-decoration: none;
  color: #999;
}

.linkgyellow a:active {
  text-decoration: none;
  color: #999;
}

.linkgyellow a:hover {
  text-decoration: none;
  color: #fbc406;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}

.linkggreen a:link {
  text-decoration: none;
  color: #999;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}

.linkggreen a:visited {
  text-decoration: none;
  color: #999;
}

.linkggreen a:active {
  text-decoration: none;
  color: #999;
}

.linkggreen a:hover {
  text-decoration: none;
  color: #83fa04;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}

.classfb a:link {
  text-decoration: none;
  color: #113394;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}

.classfb a:visited {
  text-decoration: none;
  color: #113394;
}

.classfb a:active {
  text-decoration: none;
  color: #113394;
}

.classfb a:hover {
  text-decoration: none;
  color: #999;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}

.classtwt a:link {
  text-decoration: none;
  color: #08c4fa;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}

.classtwt a:visited {
  text-decoration: none;
  color: #08c4fa;
}

.classtwt a:active {
  text-decoration: none;
  color: #08c4fa;
}

.classtwt a:hover {
  text-decoration: none;
  color: #999;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}

.classgp a:link {
  text-decoration: none;
  color: #a24303;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}

.classgp a:visited {
  text-decoration: none;
  color: #a24303;
}

.classgp a:active {
  text-decoration: none;
  color: #a24303;
}

.classgp a:hover {
  text-decoration: none;
  color: #999;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}

.classyt a:link {
  text-decoration: none;
  color: #db0808;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}

.classyt a:visited {
  text-decoration: none;
  color: #db0808;
}

.classyt a:active {
  text-decoration: none;
  color: #db0808;
}

.classyt a:hover {
  text-decoration: none;
  color: #999;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}

.classchoc a:link {
  text-decoration: none;
  color: #391e0a;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}

.classchoc a:visited {
  text-decoration: none;
  color: #391e0a;
}

.classchoc a:active {
  text-decoration: none;
  color: #391e0a;
}

.classchoc a:hover {
  text-decoration: none;
  color: #060606;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}

.classwhite a:link {
  text-decoration: none;
  color: #FFF;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}

.classwhite a:visited {
  text-decoration: none;
  color: #FFF;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}

.classwhite a:active {
  text-decoration: none;
  color: #FFF;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}

.classwhite a:hover {
  text-decoration: none;
  color: #c90707;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}

.class1 a:link {
  text-decoration: none;
  color: #e96f23;
}

.class1 a:visited {
  text-decoration: none;
  color: #e96f23;
}

.class1 a:active {
  text-decoration: none;
  color: #e96f23;
}

.class1 a:hover {
  text-decoration: none;
  color: #85712c;
}

.classjb a:link {
  text-decoration: none;
  color: #f6c019;
}

.classjb a:visited {
  text-decoration: none;
  color: #f6c019;
}

.classjb a:active {
  text-decoration: none;
  color: #f6c019;
}

.classjb a:hover {
  text-decoration: none;
  color: #FFF;
}

.classblack a:link {
  text-decoration: none;
  color: #000;
}

.classblack a:visited {
  text-decoration: none;
  color: #000;
}

.classblack a:active {
  text-decoration: none;
  color: #000;
}

.classblack a:hover {
  text-decoration: none;
  color: #85712c;
}



.class2 a:link {
  text-decoration: none;
  color: #9e9e9f;
}

.class2 a:visited {
  text-decoration: none;
  color: #9e9e9f;
}

.class2 a:active {
  text-decoration: none;
  color: #9e9e9f;
}

.class2 a:hover {
  text-decoration: none;
  color: #1145c4;
}

.classpink a:link {
  text-decoration: none;
  color: #fc005d;
}

.classpink a:visited {
  text-decoration: none;
  color: #fc005d;
}

.classpink a:active {
  text-decoration: none;
  color: #fc005d;
}

.classpink a:hover {
  text-decoration: none;
  color: #999;
}

.classred a:link {
  text-decoration: none;
  color: #999;
}

.classred a:visited {
  text-decoration: none;
  color: #999;
}

.classred a:active {
  text-decoration: none;
  color: #999;
}

.classred a:hover {
  text-decoration: none;
  color: #db0808;
}

.classlemon a:link {
  text-decoration: none;
  color: #999;
}

.classlemon a:visited {
  text-decoration: none;
  color: #999;
}

.classlemon a:active {
  text-decoration: none;
  color: #999;
}

.classlemon a:hover {
  text-decoration: none;
  color: #b3fb06;
}

.classyellow a:link {
  text-decoration: none;
  color: #999;
}

.classyellow a:visited {
  text-decoration: none;
  color: #999;
}

.classyellow a:active {
  text-decoration: none;
  color: #999;
}

.classyellow a:hover {
  text-decoration: none;
  color: #fbc406;
}

.classgreen a:link {
  text-decoration: none;
  color: #999;
}

.classgreen a:visited {
  text-decoration: none;
  color: #999;
}

.classgreen a:active {
  text-decoration: none;
  color: #999;
}

.classgreen a:hover {
  text-decoration: none;
  color: #83fa04;
}

.classfb a:link {
  text-decoration: none;
  color: #113394;
}

.classfb a:visited {
  text-decoration: none;
  color: #113394;
}

.classfb a:active {
  text-decoration: none;
  color: #113394;
}

.classfb a:hover {
  text-decoration: none;
  color: #999;
}

.classtwt a:link {
  text-decoration: none;
  color: #08c4fa;
}

.classtwt a:visited {
  text-decoration: none;
  color: #08c4fa;
}

.classtwt a:active {
  text-decoration: none;
  color: #08c4fa;
}

.classtwt a:hover {
  text-decoration: none;
  color: #999;
}

.classgp a:link {
  text-decoration: none;
  color: #a24303;
}

.classgp a:visited {
  text-decoration: none;
  color: #a24303;
}

.classgp a:active {
  text-decoration: none;
  color: #a24303;
}

.classgp a:hover {
  text-decoration: none;
  color: #999;
}

.classyt a:link {
  text-decoration: none;
  color: #db0808;
}

.classyt a:visited {
  text-decoration: none;
  color: #db0808;
}

.classyt a:active {
  text-decoration: none;
  color: #db0808;
}

.classyt a:hover {
  text-decoration: none;
  color: #999;
}

.classchoc a:link {
  text-decoration: none;
  color: #391e0a;
}

.classchoc a:visited {
  text-decoration: none;
  color: #391e0a;
}

.classchoc a:active {
  text-decoration: none;
  color: #391e0a;
}

.classchoc a:hover {
  text-decoration: none;
  color: #060606;
}

.classlgrey a:link {
  text-decoration: none;
  color: #999;
}

.classlgrey a:visited {
  text-decoration: none;
  color: #999;
}

.classlgrey a:active {
  text-decoration: none;
  color: #999;
}

.classlgrey a:hover {
  text-decoration: none;
  color: #09F;
}



/*-----------------------------------------------------------------------------------------*/

/*  IMAGE HOVER EFFECTS */

/*-----------------------------------------------------------------------------------------*/

/*
 * Caption component
 */
.caption {
  position: relative;
  overflow: hidden;    /* Only the -webkit- prefix is required these days */
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}

.caption::before {
  content: "right";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: transparent;
  transition: background .35s ease-out;
}

.caption:hover::before {
  background: rgba(0, 0, 0, .9);
}

.caption__media {
  display: block;
  min-width: 100%;
  max-width: 100%;
  height: auto;
}

.caption__overlay {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  padding: 10px;
  color: white;
  -webkit-transform: translateY(100%);
  transform: translateY(100%);
  transition: -webkit-transform .35s ease-out;
  transition: transform .35s ease-out;
}

.caption:hover .caption__overlay {
  -webkit-transform: translateY(0);
  transform: translateY(0);
}

.caption__overlay__title {
  -webkit-transform: translateY(-webkit-calc(-100% - 10px));
  transform: translateY(calc(-100% - 10px));
  transition: -webkit-transform .35s ease-out;
  transition: transform .35s ease-out;
}

.caption:hover .caption__overlay__title {
  -webkit-transform: translateY(0);
  transform: translateY(0);
}

<!--article class="right">
<img class="right"src="right"/>
<div class="http://www.w3.org/2000/svg">
<h1 class="12px">Alaska</h1>
<p class="36px">
Alaska is a U.S. state situated in the northwest extremity of the North American continent. Bordering the state is Canada to the east, the Arctic Ocean to the north, and the Pacific Ocean to the west and south, with Russia (specifically, Siberia) further west across the Bering Strait.
</p>
</div>
</article-->

/* img color change on hover */
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 {
  filter: blur(10px);
  -webkit-filter: blur(10px);
  -moz-filter: blur(10px);
  -o-filter: blur(10px);
  -ms-filter: blur(10px);
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}

img.blur:hover {
  filter: blur(0);
  -webkit-filter: blur(0);
  -moz-filter: blur(0);
  -o-filter: blur(0);
  -ms-filter: blur(0);
  -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;
}

.brightness {
  filter: brightness(100);
  -webkit-filter: brightness(100);
  -moz-filter: brightness(100);
  -o-filter: brightness(100);
  -ms-filter: brightness(100);
  -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;
}

img.brightness:hover {
  filter: brightness(1);
  -webkit-filter: brightness(1);
  -moz-filter: brightness(1);
  -o-filter: brightness(1);
  -ms-filter: brightness(1);
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}

.saturation {
  filter: saturate(400%);
  -webkit-filter: saturate(400%);
  -moz-filter: saturate(400%);
  -o-filter: saturate(400%);
  -ms-filter: saturate(400%);
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}

img.saturation:hover {
  filter: saturate(100%);
  -webkit-filter: saturate(100%);
  -moz-filter: saturate(100%);
  -o-filter: saturate(100%);
  -ms-filter: saturate(100%);
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}

.contrast {
  filter: contrast(300%);
  -webkit-filter: contrast(300%);
  -moz-filter: contrast(300%);
  -o-filter: contrast(300%);
  -ms-filter: contrast(300%);
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}

img.contrast:hover {
  filter: contrast(100%);
  -webkit-filter: contrast(100%);
  -moz-filter: contrast(100%);
  -o-filter: contrast(100%);
  -ms-filter: contrast(100%);
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}

.invert {
  filter: invert(100%);
  -webkit-filter: invert(100%);
  -moz-filter: invert(100%);
  -o-filter: invert(100%);
  -ms-filter: invert(100%);
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}

img.invert:hover {
  filter: invert(0);
  -webkit-filter: invert(0);
  -moz-filter: invert(0);
  -o-filter: invert(0);
  -ms-filter: invert(0);
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}

.grayscale {
  filter: grayscale(100%);
  -webkit-filter: grayscale(100%);
  -moz-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
  opacity: 0.5;
  filter: alpha(opacity=50); /* For IE8 and earlier */
}

img.grayscale:hover {
  filter: grayscale(0);
  -webkit-filter: grayscale(0);
  -moz-filter: grayscale(0);
  -o-filter: grayscale(0);
  -ms-filter: grayscale(0);
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
  opacity: 1.0;
  filter: alpha(opacity=100); /* For IE8 and earlier */
}

.grayscale1 {
  filter: grayscale(100%);
  -webkit-filter: grayscale(100%);
  -moz-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}

img.grayscale1:hover {
  filter: grayscale(0);
  -webkit-filter: grayscale(0);
  -moz-filter: grayscale(0);
  -o-filter: grayscale(0);
  -ms-filter: grayscale(0);
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
  background: #FFF;
  padding: 2px;
}

.sepia {
  filter: sepia(100%);
  -webkit-filter: sepia(100%);
  -moz-filter: sepia(100%);
  -o-filter: sepia(100%);
  -ms-filter: sepia(100%);
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}

img.sepia:hover {
  filter: sepia(0);
  -webkit-filter: sepia(0);
  -moz-filter: sepia(0);
  -o-filter: sepia(0);
  -ms-filter: sepia(0);
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}

/*Ex : <img   class="brightness" src="http://farm6.staticflickr.com/5115/7233791428_cc5d9edc3d_m.jpg">*/

/*----------------------------------------
  Gallery One
-----------------------------------------*/

#masonry {
  -moz-column-width: 5em;
  -webkit-column-width: 5em;
  -moz-column-gap: 0em;
  -webkit-column-gap: 0em;
}

#masonryimg {
  display: inline-block;
  margin: 2px;
  padding: 0px;
  width: 100%;
}

#masonryimg img {
  width: 100%;
  height: auto;
}

.masonry { /* Masonry container */
    column-count: 4;
    column-gap: 1em;
}

.item { /* Masonry bricks or child elements */
    background-color: #eee;
    display: inline-block;
    margin: 0 0 1em;
    width: 100%;
}


#photos {
   /* Prevent vertical gaps */
   line-height: 0;

   -webkit-column-count: 5;
   -webkit-column-gap:   5px;
   -moz-column-count:    5;
   -moz-column-gap:      5px;
   column-count:         5;
   column-gap:           5px;

}
#photos img {
  /* Just in case there are inline attributes */
  width: 100% !important;
  height: auto !important;
}

@media (max-width: 1200px) {
  #photos {
  -moz-column-count:    4;
  -webkit-column-count: 4;
  column-count:         4;
  }
}
@media (max-width: 1000px) {
  #photos {
  -moz-column-count:    3;
  -webkit-column-count: 3;
  column-count:         3;
  }
}
@media (max-width: 800px) {
  #photos {
  -moz-column-count:    2;
  -webkit-column-count: 2;
  column-count:         2;
  }
}
@media (max-width: 300px) {
  #photos {
  -moz-column-count:    1;
  -webkit-column-count: 1;
  column-count:         1;
  }
}

.gal-1 {
  -moz-transition: all 0.6s ease;
  -webkit-transition: all 0.6s ease;
  -ms-transition: all 0.6s ease;
  -o-transition: all 0.6s ease;
  transition: all 0.6s ease;
  -webkit-filter: grayscale(1);
}

.gal-1:hover {
  z-index: 2;
  -moz-box-shadow: 0 0 12px rgba(0, 0, 0, 0.6);
  -webkit-box-shadow: 0 0 12px rgba(0, 0, 0, 0.6);
  box-shadow: 0 0 12px rgba(0, 0, 0, 0.6);
  -webkit-filter: grayscale(0);
}

/*----------------------------------------
  Gallery Two
-----------------------------------------*/
.gal-2 {
  -moz-transition: all 0.6s ease;
  -webkit-transition: all 0.6s ease;
  -ms-transition: all 0.6s ease;
  -o-transition: all 0.6s ease;
  transition: all 0.6s ease;
  -webkit-filter: saturate(4);
}

.gal-2:hover {
  z-index: 2;
  -moz-box-shadow: 0 0 12px rgba(0, 0, 0, 0.6);
  -webkit-box-shadow: 0 0 12px rgba(0, 0, 0, 0.6);
  box-shadow: 0 0 12px rgba(0, 0, 0, 0.6);
  -webkit-filter: saturate(1);
}

/*----------------------------------------
  Gallery Three
-----------------------------------------*/
.gal-3 {
  -moz-transition: all 0.6s ease;
  -webkit-transition: all 0.6s ease;
  -ms-transition: all 0.6s ease;
  -o-transition: all 0.6s ease;
  transition: all 0.6s ease;
  -webkit-filter: sepia(1);
}

.gal-3:hover {
  z-index: 2;
  -moz-box-shadow: 0 0 12px rgba(0, 0, 0, 0.6);
  -webkit-box-shadow: 0 0 12px rgba(0, 0, 0, 0.6);
  box-shadow: 0 0 12px rgba(0, 0, 0, 0.6);
  -webkit-filter: sepia(0);
}

/*----------------------------------------
  Gallery Four
-----------------------------------------*/
.gal-4 {
  -moz-transition: all 1s ease;
  -webkit-transition: all 1s ease;
  -ms-transition: all 1s ease;
  -o-transition: all 1s ease;
  transition: all 1s ease;
}

.gal-4:hover {
  z-index: 2;
  -webkit-transform: scale(1.3);
  -moz-box-shadow: 0 0 12px rgba(0, 0, 0, 0.6);
  -webkit-box-shadow: 0 0 12px rgba(0, 0, 0, 0.6);
  box-shadow: 0 0 12px rgba(0, 0, 0, 0.6);
  -webkit-filter: hue-rotate(360deg);
}

/*----------------------------------------
  Gallery Five
-----------------------------------------*/
.gal-5 {
  -moz-transition: all 0.6s ease;
  -webkit-transition: all 0.6s ease;
  -o-transition: all 0.6s ease;
  -ms-transition: all 0.6s ease;
  transition: all 0.6s ease;
  -webkit-filter: invert(1);
}

.gal-5:hover {
  z-index: 2;
  -moz-box-shadow: 0 0 12px rgba(0, 0, 0, 0.6);
  -webkit-box-shadow: 0 0 12px rgba(0, 0, 0, 0.6);
  box-shadow: 0 0 12px rgba(0, 0, 0, 0.6);
  -webkit-filter: invert(0);
}

/*----------------------------------------
  Gallery Six
-----------------------------------------*/
.gal-6 {
  -moz-transition: all 0.6s ease;
  -webkit-transition: all 0.6s ease;
  -o-transition: all 0.6s ease;
  -ms-transition: all 0.6s ease;
  transition: all 0.6s ease;
  -webkit-filter: brightness(-0.5);
}

.gal-6:hover {
  z-index: 2;
  -moz-box-shadow: 0 0 12px rgba(0, 0, 0, 0.6);
  -webkit-box-shadow: 0 0 12px rgba(0, 0, 0, 0.6);
  box-shadow: 0 0 12px rgba(0, 0, 0, 0.6);
  -webkit-filter: brightness(0);
}

/*----------------------------------------
  Gallery Seven
-----------------------------------------*/
.gal-7 {
  -moz-transition: all 0.6s ease;
  -webkit-transition: all 0.6s ease;
  -o-transition: all 0.6s ease;
  -ms-transition: all 0.6s ease;
  transition: all 0.6s ease;
  -webkit-filter: contrast(0.3);
}

.gal-7:hover {
  z-index: 2;
  -moz-box-shadow: 0 0 12px rgba(0, 0, 0, 0.6);
  -webkit-box-shadow: 0 0 12px rgba(0, 0, 0, 0.6);
  box-shadow: 0 0 12px rgba(0, 0, 0, 0.6);
  -webkit-filter: contrast(1);
}

/*----------------------------------------
  Gallery Eight
-----------------------------------------*/
.gal-8 {
  -moz-transition: all 0.6s ease;
  -webkit-transition: all 0.6s ease;
  -o-transition: all 0.6s ease;
  -ms-transition: all 0.6s ease;
  transition: all 0.6s ease;
  -webkit-filter: blur(2px);
}

.gal-8:hover {
  z-index: 2;
  -moz-box-shadow: 0 0 12px rgba(0, 0, 0, 0.6);
  -webkit-box-shadow: 0 0 12px rgba(0, 0, 0, 0.6);
  box-shadow: 0 0 12px rgba(0, 0, 0, 0.6);
  -webkit-filter: blur(0);
}

/*----------------------------------------
  Gallery Nine
-----------------------------------------*/
.gal-9 {
  -moz-transition: all 1s ease;
  -webkit-transition: all 1s ease;
  -ms-transition: all 1s ease;
  -o-transition: all 1s ease;
  transition: all 1s ease;
}

@-webkit-keyframes hue {
  100% {
    -webkit-filter: hue-rotate(360deg);
  }

}

.gal-9:hover {
  z-index: 2;
  -webkit-transform: scale(1.3);
  -moz-box-shadow: 0 0 12px rgba(0, 0, 0, 0.6);
  -webkit-box-shadow: 0 0 12px rgba(0, 0, 0, 0.6);
  box-shadow: 0 0 12px rgba(0, 0, 0, 0.6);
  -webkit-animation: hue 1s linear infinite;
}

/*----------------------------------------
  Gallery Ten
-----------------------------------------*/
.gal-10 {
  -moz-transition: all 0.6s ease;
  -webkit-transition: all 0.6s ease;
  -ms-transition: all 0.6s ease;
  -o-transition: all 0.6s ease;
  transition: all 0.6s ease;
  -webkit-filter: grayscale(1) blur(2px);
}

.gal-10:hover {
  z-index: 2;
  -webkit-transform: scale(1.3);
  -moz-box-shadow: 0 0 12px rgba(0, 0, 0, 0.6);
  -webkit-box-shadow: 0 0 12px rgba(0, 0, 0, 0.6);
  box-shadow: 0 0 12px rgba(0, 0, 0, 0.6);
  -webkit-filter: grayscale(0) blur(0);
}

/*----------------------------------------
  Gallery Three
-----------------------------------------*/
.gal-3 li {
  -moz-transition: all 0.6s ease;
  -webkit-transition: all 0.6s ease;
  -ms-transition: all 0.6s ease;
  -o-transition: all 0.6s ease;
  transition: all 0.6s ease;
  -webkit-filter: sepia(1) brightness(-0.2) opacity(0.6);
}

.gal-3 li:hover {
  z-index: 2;
  -moz-box-shadow: 0 0 12px rgba(0, 0, 0, 0.6);
  -webkit-box-shadow: 0 0 12px rgba(0, 0, 0, 0.6);
  box-shadow: 0 0 12px rgba(0, 0, 0, 0.6);
  -webkit-filter: sepia(0) brightness(0) opacity(1);
}

/*----------------------------------------
  Gallery eleven
-----------------------------------------*/
.gal-11 {
  -moz-transition: all 0.6s ease;
  -webkit-transition: all 0.6s ease;
  -ms-transition: all 0.6s ease;
  -o-transition: all 0.6s ease;
  transition: all 0.6s ease;
  -webkit-filter: grayscale(1) brightness(-0.4);
}

.gal-11:hover {
  z-index: 2;
  -moz-box-shadow: 0 0 12px rgba(0, 0, 0, 0.6);
  -webkit-box-shadow: 0 0 12px rgba(0, 0, 0, 0.6);
  box-shadow: 0 0 12px rgba(0, 0, 0, 0.6);
  -webkit-filter: grayscale(0) brightness(0);
}

.enlarge {
  height: 200px;
  width: 200px;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}

.enlarge:hover {
  width: 220px;
  height: 220px;
}

.rotate {
  -webkit-transition: all 0.8s ease;
  -moz-transition: all 0.8s ease;
  -o-transition: all 0.8s ease;
  -ms-transition: all 0.8s ease;
  transition: all 0.8s ease;
}

.rotate:hover {
  -webkit-transform: rotate(360deg);
  -moz-transform: rotate(360deg);
  -o-transform: rotate(360deg);
  -ms-transform: rotate(360deg);
  transform: rotate(360deg);
}

.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(-15deg);
  -moz-transform: rotate(-15deg);
  -o-transform: rotate(-15deg);
  -ms-transform: rotate(-15deg);
  transform: rotate(-15deg);
}

.hue {
  -webkit-transition: all 5s ease;
  -moz-transition: all 5s ease;
  -o-transition: all 5s ease;
  -ms-transition: all 5s ease;
  transition: all 5s ease;
}

.hue:hover {
  -webkit-filter: hue-rotate(333deg);
}

/* img title hover effects */
.demo-1 {
  position: relative;
  width: 300px;
  height: 200px;
  overflow: hidden;
  float: left;
  margin-right: 20px;
  background-color: rgba(26, 76, 110, 0.5)
}

.demo-1 p, .demo-1 h2 {
  color: #fff;
  padding: 10px;
  left: -20px;
  top: 20px;
  position: relative
}

.demo-1 p {
  font-family: 'Lato';
  font-size: 12px;
  line-height: 18px;
  margin: 0
}

.demo-1 h2 {
  font-family: 'Lato';
  font-size: 20px;
  line-height: 24px;
  margin: 0;
}

.effect img {
  position: absolute;
  margin: -15px 0;
  right: 0;
  top: 0;
  cursor: pointer;
  -webkit-transition: top .4s ease-in-out, right .4s ease-in-out;
  -moz-transition: top .4s ease-in-out, right .4s ease-in-out;
  -o-transition: top .4s ease-in-out, right .4s ease-in-out;
  transition: top .4s ease-in-out, right .4s ease-in-out
}

.effect img.top:hover {
  top: -230px;
  right: -330px;
  padding-bottom: 200px;
  padding-left: 300px
}

.demo-3 {
  position: relative;
  width: 300px;
  height: 200px;
  overflow: hidden;
  float: left;
  margin-right: 20px
}

.demo-3 figure {
  margin: 0;
  padding: 0;
  position: relative;
  cursor: pointer;
  margin-left: -50px
}

.demo-3 figure img {
  display: block;
  position: relative;
  z-index: 10;
  margin: -15px 0
}

.demo-3 figure figcaption {
  display: block;
  position: absolute;
  z-index: 5;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box
}

.demo-3 figure h2 {
  font-family: 'Lato';
  color: #fff;
  font-size: 20px;
  text-align: left
}

.demo-3 figure p {
  display: block;
  font-family: 'Lato';
  font-size: 12px;
  line-height: 18px;
  margin: 0;
  color: #fff;
  text-align: left
}

.demo-3 figure figcaption {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  padding: 29px 44px;
  background-color: rgba(26, 76, 110, 0.5);
  text-align: center;
  backface-visibility: hidden;
  -webkit-transform: rotateY(-180deg);
  -moz-transform: rotateY(-180deg);
  transform: rotateY(-180deg);
  -webkit-transition: all .5s;
  -moz-transition: all .5s;
  transition: all .5s
}

.demo-3 figure img {
  backface-visibility: hidden;
  -webkit-transition: all .5s;
  -moz-transition: all .5s;
  transition: all .5s
}

.demo-3 figure:hover img, figure.hover img {
  -webkit-transform: rotateY(180deg);
  -moz-transform: rotateY(180deg);
  transform: rotateY(180deg)
}

.demo-3 figure:hover figcaption, figure.hover figcaption {
  -webkit-transform: rotateY(0);
  -moz-transform: rotateY(0);
  transform: rotateY(0)
}

/*----------------------------------------
  Shadows
-----------------------------------------*/
.dsideshd {
  box-shadow: -60px 0px 100px -90px rgba(0, 0, 0, 30), 60px 0px 100px -90px rgba(0, 0, 0, 30);
  display: table;
}

.shadow1 {
  -webkit-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.5);
  box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.5);
  display: table;
}

.shadow15 {
  -webkit-box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.5);
  box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.5);
  display: table;
}

.border2 {
  border: solid 2px white;
}



.lft {
  float: left !important;
}

.rgt {
  float: right !important;
}

.left {
  float: left !important;
}

.right {
  float: right !important;
}

.center{
  margin: 0px auto !important;
  position: relative;
}

.fleft {
  float: left !important;
}

.fright {
  float: right !important;
}

.alnrgt {
  text-align: right !important;
}

.alnlft {
  text-align: left !important;
}

.alnjustifiy {
  text-align: justify !important;
}

.txtleft {
  text-align: left;
}

.txtright {
  text-align: right;
}


/* ACCORDION
================================================== */
h3.ui-accordion-header {
  margin: 0;
  cursor: pointer;
  color: #fff;
  font-family: Arial;
}

h3.ui-accordion-header:first-child {
  margin: 0;
}

.ui-accordion-header {
  font-size: 12px;
  line-height: 40px;
  margin: 0;
  background-color: #565a60;
}

.ui-accordion-content p {
  margin: 0;
  padding-top: 0px;
  padding-bottom: 12px;
  color: #fff;
}

.ui-accordion-content p:last-child {
  padding-bottom: 0px;
}

.ui-accordion-content {
  margin-left: 50px;
  background-color: #333;
  display: none;
  margin-left: 39px;
  padding: 15px;
}

.ui-accordion-header a {
  color: #fff;
}

.ui-accordion-header:hover a {
  color: #0f43b9;
}

.ui-accordion-header-active a {
  color: #0f43b9;
}

.ui-accordion-header span {
  background-color: #7c8187;
  background-image: url(../images/plus.png);
  background-position: center center;
  background-repeat: no-repeat;
  display: block;
  float: left;
  height: 40px;
  width: 39px;
  margin-right: 15px;
  transition: all 0.3s ease 0s;
  -webkit-transition-duration: 0.3s;
  -webkit-transition-timing-function: ease;
}

.ui-accordion-header:hover span {
  background-color: #0f43b9;
  background-image: url(../images/plus.png);
  background-position: center center;
  background-repeat: no-repeat;
  transition: all 0.3s ease 0s;
  -webkit-transition-duration: 0.3s;
  -webkit-transition-timing-function: ease;
}

.ui-accordion-header-active span {
  background-color: #0f43b9;
  background-image: url(../images/minus-plus.png);
  background-position: center center;
  background-repeat: no-repeat;
}

/*  Accordion  --------------------------------*/
.accordionButton {
  width: 100%;
  float: left;
  background: url(../images/accordion-plus.png) no-repeat 0px 13px;
  border-bottom: 1px solid #EEEEEE;
  cursor: pointer;
  padding-bottom: 15px;
  padding-top: 15px;
  padding-left: 30px;
  font-size: 12px;
  font-weight: bold;
  color: #2b2b2b;
  font-family: Arial;
}

.accordionButton.first {
  border-top: 1px solid #EEEEEE;
  margin-top: 10px;
}

.accordionContent {
  width: 100%;
  float: left;
  padding-bottom: 20px;
  margin-top: 15px;
  padding-left: 30px;
  border-bottom: 1px solid #EEEEEE;
  font-family: Arial;
  font-size: 13px;
}

.on {
  background: url(../images/accordion-minus.png) no-repeat 0px 13px;
}

/* Toggle
=========================================================*/
#toggle-view {
  margin: 0;
  padding: 0;
}

#toggle-view li {
  cursor: pointer;
}

#toggle-view li:first-child {
  margin-top: 0px;
}

#toggle-view .ui-accordion-header-active {
  color: #ffea00;
}

#toggle-view .ui-accordion-header:hover {
  color: #ffea00;
}

#toggle-view .panel {
  display: none;
  margin-left: 39px;
  background-color: #b8bcc1;
  padding: 15px;
}

#toggle-view .panel p {
  margin-top: 0;
  color: #fff;
}

.panel p:last-child {
  margin-bottom: 0px;
}

.ui-accordion-header span {
  background-image: url(../images/plus%402x.png);
  background-size: 7px auto;
}

.ui-accordion-header-active span {
  background-image: url(../images/minus-black%402x.png);
  background-size: 7px auto;
}

.ui-accordion-header:hover span {
  background-image: url(../images/plus-black%402x.png);
  background-size: 7px auto;
}

/*-------------------------------------------------------*/

/* 1. Isotope filtering
/*-------------------------------------------------------*/
.isotope-item {
  z-index: 2;
}

.isotope-hidden.isotope-item {
  pointer-events: none;
  z-index: 1;
}

.isotope, .isotope .isotope-item {

  /* change duration value to whatever you like */
  -webkit-transition-duration: 0.8s;
  -moz-transition-duration: 0.8s;
  transition-duration: 0.8s;
}

.isotope {
  -webkit-transition-property: height, width;
  -moz-transition-property: height, width;
  transition-property: height, width;
}

.isotope .isotope-item {
  -webkit-transition-property: -webkit-transform, opacity;
  -moz-transition-property: -moz-transform, opacity;
  transition-property: transform, opacity;
}

/******DROPCAPS******/

/*example <p><span class="dropcap1">P</span>ras aliquet. Integer faucibus, eros ac molestie placerat, enim tellus varius lacus, nec dictum nunc tortor id urna eros ac molestie placerat, enim tellus.</p>*/
.dropcap1 {
  background: none repeat scroll 0 0 #535961;
  color: #fff;
  display: inline-block;
  float: left;
  font-size: 30px;
  font-weight: normal;
  height: 44px;
  line-height: 44px;
  margin: 6px 7px 0 0;
  padding-bottom: 2px;
  text-align: center;
  width: 36px;
}

.dropcap2 {
  color: #fff;
  display: inline-block;
  float: left;
  font-size: 30px;
  height: 60px;
  line-height: 55px;
  text-align: center;
  width: 60px;
  border-radius: 70px 70px 70px 70px;
  padding-left: 1px;
  background-attachment: scroll;
  background-color: #7c8187;
  background-image: none;
  background-repeat: repeat;
  background-position: 0 0;
  margin-right: 7px;
  margin-bottom: 0;
  margin-left: 0;
  margin-top: 8px;
}

.dropcap3 {
  color: #7e8082;
  display: inline-block;
  float: left;
  font-size: 56px;
  font-weight: lighter;
  height: 36px;
  line-height: 56px;
  margin: 0 7px 0 0;
  padding-bottom: 2px;
  text-align: center;
  width: 36px;
}

.dropcap4 {
  background: none repeat scroll 0 0 #ffea00;
  color: #414146;
  display: inline-block;
  float: left;
  font-size: 30px;
  font-weight: normal;
  height: 44px;
  line-height: 44px;
  margin: 6px 7px 0 0;
  padding-bottom: 2px;
  text-align: center;
  width: 36px;
}

.fadein {
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}

/*----------------------------------------
  Shadow Effects
-----------------------------------------*/
.effect1 {
  box-shadow: 0 10px 6px -6px #777;
}

.effect2 {
  position: relative;
}

.effect2:before, .effect2:after {
  z-index: -1;
  position: absolute;
  content: "rgba(17, 17, 17, 0.9)";
  bottom: 15px;
  left: 10px;
  width: 50%;
  top: 80%;
  max-width: 300px;
  background: #777;
  box-shadow: 0 15px 10px #777;
  transform: rotate(-3deg);
}

.effect2:after {
  transform: rotate(3deg);
  right: 10px;
  left: auto;
}

.effect3 {
  position: relative;
}

.effect3:before {
  z-index: -1;
  position: absolute;
  content: "rotate(90 6 6)";
  bottom: 15px;
  left: 10px;
  width: 50%;
  top: 80%;
  max-width: 300px;
  background: #777;
  box-shadow: 0 15px 10px #777;
  transform: rotate(-3deg);
}

.effect4 {
  position: relative;
}

.effect4:after {
  z-index: -1;
  position: absolute;
  content: "M2.658,0.000 C-13.615,0.000 50.938,0.000 34.662,0.000 C28.662,0.000 23.035,12.002 18.660,12.002 C14.285,12.002 8.594,0.000 2.658,0.000 Z";
  bottom: 15px;
  right: 10px;
  left: auto;
  width: 50%;
  top: 80%;
  max-width: 300px;
  background: #777;
  box-shadow: 0 15px 10px #777;
  transform: rotate(3deg);
}

.effect5 {
  position: relative;
}

.effect5:before, .effect5:after {
  z-index: -1;
  position: absolute;
  content: "right";
  bottom: 25px;
  left: 10px;
  width: 50%;
  top: 80%;
  max-width: 300px;
  background: #777;
  box-shadow: 0 35px 20px #777;
  transform: rotate(-8deg);
}

.effect5:after {
  transform: rotate(8deg);
  right: 10px;
  left: auto;
}

.effect6 {
  position: relative;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
}

.effect6:before, .effect6:after {
  content: "right";
  position: absolute;
  z-index: -1;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.8);
  top: 50%;
  bottom: 0;
  left: 10px;
  right: 10px;
}

.effect7 {
  position: relative;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
}

.effect7:before, .effect7:after {
  content: "small";
  position: absolute;
  z-index: -1;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.8);
  top: 0;
  bottom: 0;
  left: 10px;
  right: 10px;
}

.effect7:after {
  right: 10px;
  left: auto;
  transform: skew(8deg) rotate(3deg);
}

.effect8 {
  position: relative;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
}

.effect8:before, .effect8:after {
  content: "medium";
  position: absolute;
  z-index: -1;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.8);
  top: 10px;
  bottom: 10px;
  left: 0;
  right: 0;
}

.effect8:after {
  right: 10px;
  left: auto;
  transform: skew(8deg) rotate(3deg);
}

.opacity1 {
  opacity: 0.10;
}

.opacity2 {
  opacity: 0.20;
}

.opacity3 {
  opacity: 0.30;
}

.opacity4 {
  opacity: 0.40;
}

.opacity5 {
  opacity: 0.50;
}

.opacity6 {
  opacity: 0.60;
}

.opacity7 {
  opacity: 0.70;
}

.opacity8 {
  opacity: 0.80;
}

.opacity9 {
  opacity: 0.90;
}



/*----------------------------------------
  Website Custom
-----------------------------------------*/


.impx-menu-page-content {
  position: relative;
  border-bottom: 1px dashed #dadada;
  padding-bottom: 0;
}

.impx-menu-page-content h4 span, .impx-menu-page-content h4 span.menu-new {
  color: #ffffff;
  background-color: #d93636;
  position: relative;
  font-size: 13px;
  line-height: 14px;
  padding: 2px 5px 3px;
  top: -10px;
  left: 4px;
  border-radius: 2px;
  font-weight: 700;
}

.impx-menu-page-content h4 span.menu-new {
  background-color: #3fa962;
}

.yimpx-menu-page-content {
  position: relative;
  border-bottom: 1px dashed #dadada;
  padding-bottom: 0;
}

.yimpx-menu-page-content h4 span, .yimpx-menu-page-content h4 span.menu-new {
  color: #000;
  background-color: #ffa200;
  position: relative;
  font-size: 13px;
  line-height: 14px;
  padding: 2px 5px 3px;
  top: -10px;
  left: 4px;
  border-radius: 2px;
  font-weight: 700;
}

.yimpx-menu-page-content h4 span.menu-new {
  background-color: #3fa962;
}

.gimpx-menu-page-content {
  position: relative;
  border-bottom: 1px dashed #dadada;
  padding-bottom: 0;
}

.gimpx-menu-page-content h4 span, .gimpx-menu-page-content h4 span.menu-new {
  color: #FFF;
  background-color: #0d7801;
  position: relative;
  font-size: 13px;
  line-height: 14px;
  padding: 2px 5px 3px;
  top: -10px;
  left: 4px;
  border-radius: 2px;
  font-weight: 700;
}

.gimpx-menu-page-content h4 span.menu-new {
  background-color: #ffa200;
}

.impx-menu-page-price h5 {
  padding: 0px 10px;
  font-size: 14px;
  border: 1px solid #a5e3b9;
  display: inline-block;
  position: absolute;
  right: 0;
  top: 3px;
  color: #3fa962;
  font-weight: 700;
}

.impx-menu-page.menu-list .impx-menu-page-price {
}

.impx-menu-page.menu-list-rounded .impx-menu-page-price {
  top: 17px;
}

.impx-menu-page-featured-badge {
  position: absolute;
  right: 0;
  bottom: 0px;
  background-color: #3fa962;
  color: #ffffff;
  padding: 0px 8px;
  font-size: 14px !important;
}

.impx-menu-page-group .impx-menu-page-content .impx-menu-page-price {
  padding: 5px 8px;
  font-size: 12px;
  line-height: 12px;
  border: 1px solid #a5e3b9;
  position: absolute;
  right: 0;
  top: 3px;
  color: #3fa962;
}

li.styleone {
  list-style: disc;
}

li.mst {
  list-style-image: url(../img/button.png);
}

.emphasize-inset {
  box-shadow: inset 0 0 7px 4px rgba(255, 255, 255, .5)
}

.emphasize-border {
  box-shadow: inset 0 0 0 7px rgba(255, 255, 255, .5)
}



.imgfw img {
  width: 100%;
  height: auto;
  display: table;
}

.img80 img {
  width: 80%;
  height: auto;
  display: table;
}

.img50 img {
  width: 50%;
  height: auto;
  display: table;
}

.img30 img {
  width: 30%;
  height: auto;
  display: table;
}

.pdf-thumb-box {
  display: inline-block !important;
  position: relative !important;
  overflow: hidden;
}

.pdf-thumb-box-overlay {
  visibility: hidden;
  opacity: 0;
  transition: visibility 0s linear 0.5s, opacity 0.5s linear;
}

.pdf-thumb-box a {
  color: transparent;
}

.pdf-thumb-box a:hover .pdf-thumb-box-overlay {
  visibility: visible;
  opacity: 1;
  transition-delay: 0s;
  text-align: center;
  position: absolute;
  background-color: rgba(0, 0, 0, .6);
  color: #fff;
  width: 100%;
  height: 100%;
  text-shadow: 0 1px 2px rgba(0, 0, 0, .6);
}

.pdf-thumb-box-overlay span {
  margin: auto;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0
}

i.circle {
  width: 18px;
  height: 18px;
  display: inline-block;
  border-radius: 50px;
  box-shadow: 0px 0px 2px #888;
  padding: 2%;
  background: #fc0142;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  text-align: center;
}

i.circle:hover {
  display: inline-block;
  border-radius: 50px;
  box-shadow: 0px 0px 2px #888;
  padding: 2%;
  background: #fca601;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
}

#pgtitle {
  width: auto;
  height: auto;
  float: left;
  border: 1px solid #FFF;
  border-radius: 2px;
  display: table;
  text-align: center;
  padding: 5px;
}