  * {
  text-rendering: optimizeLegibility; /* Use with caution */
  -moz-font-feature-settings: "kern";
  -moz-font-feature-settings: "kern=1";
  -ms-font-feature-settings: "kern";
  -o-font-feature-settings: "kern";
  -webkit-font-feature-settings: "kern";
  font-feature-settings: "kern";

  font-family: "TFForever® TWO LIGHT", sans-serif;
}
body {
  font-family: "TFForever® TWO LIGHT", sans-serif;
}

.flink {
  color: #337ab7;
  text-decoration: none;
  cursor: pointer;
}
.cbold {
  font-family: "TFForever® TWO EXTRABOLD", sans-serif;
}
.cmedium {
  font-family: "TFForever® TWO MEDIUM", sans-serif;
}

.text-upper {
  text-transform: uppercase;
}

div.sample-message {
  display: inline-block;
  padding: 2px 6px;
  color: #fff;
  text-align: center;
  white-space: nowrap;
  border-radius: 3px;
}

.margin-top {
  margin-top: 10px;
}

div.spacegallery {
  margin-top: 150px;
  position: relative;
  overflow: hidden;
  clear: both;
  height: 270px;
}

label {
  font-weight: normal;
}

.dropdown-menu>li> .flink {
  display: block;
  padding: 3px 20px;
  clear: both;
  font-weight: 400;
  line-height: 1.42857143;
  color: #333;
  white-space: nowrap;
}

.angularjs-toast .blue-toast .alert.alert-success {
  border-color: #0889f9;
  background-color: #0889f9;
  color: #fff;
  padding: 15px;
}
.angularjs-toast .blue-toast .close {
  display: none;
}

button.btn {
    font-size: 14pt;
    border-width: 0;
    box-shadow: 0 0 1px 1px #fff inset;
    border-radius: 25px;
    padding: 4px 12px;
}
button.btn.btn-primary {
  background-color: transparent;
}
.input-group-btn button.btn {
  font-size: 14px;
  border: 1px solid transparent;
  box-shadow: none;
  border-radius: 4px;
  padding: 6px 12px;
}

.input-group select {
  height: 35px;
  border-width: 0;
}

button.btn.flat-btn, button.btn.flat-btn:active {
  font-size: 14pt;
  border-width:0;
  box-shadow: 0 0 1px 1px #fff inset;
  border-radius: 25px;
  background-color: transparent;
  outline: none;
  padding: 4px 12px;
  margin: 5px 10px;
}

.box {
  position: relative;
  background-color:#eee;
  padding:20px 30px;
  box-sizing: border-box;
  font-family: 'TFAdefabcOneLightRegular', serif;
  font-size: 42px;
  min-height: 540px;
  word-wrap: break-word;
  background: url("../images2/box_bg.svg") no-repeat scroll center top / 100% auto transparent;
}
.box .edit_area {
  line-height:100%;

}
.box .edit_area:focus {
   outline: none;
}

.blue_modal .tab-content {
  padding-top: 10px;
}

#sans_demos .contenteditable, 
#serif_demos .contenteditable, 
#calligraphic_demos .contenteditable, 
#utility_demos .contenteditable {
  white-space: nowrap;
  overflow:hidden;
}
.contenteditable div {
  font-family: inherit;
}

.rbtns {
margin-left: -10px;
}
.rbtns p, .carousel-control span {
line-height:18px;height:18px;font-size: 18px;cursor:pointer;
color:#7D8183;
margin-bottom: 8px;
user-select: none;
}
.rbtns p span.disabled {
  color: #ddd;
  z-index: -1;
  cursor:default;
}
.rbtns p:hover, .carousel-control span:hover {
color:#204760;
}

#slider1, #slider2, #slider3, #slider4 {
  margin: 0 auto;
}

.box .ffamily {
  display: block;
  margin: 0 0 10px;
  line-height: 20px;
  position:relative;
  font-size: 12pt;
}

.box#sans_demos .ffamily {
  margin-bottom: 1px;
}

.box span#font_family_l, .box span#text_var_l, .box span#azexpl, .box span.glyphicon {
  color: #aaa;
  font-size: 12pt;
  text-transform: uppercase;
}
.ffamily a {
  text-decoration: none;
}
.cats p {
  background: url("../images2/cat_icons.png") no-repeat scroll center center transparent;
  border: 1px solid transparent;
  box-sizing: border-box;
  color: transparent;
  cursor: pointer;
  height: 46px;
  margin: 0 0 7px;
  padding: 3px;
}

.nmabs .cats {
    width: 45px;
    position:absolute;
    left: -20px;
}
#cats2 {
  padding-top:5px;
}
#cats2 p {
  display:inline-block;
  width:46px;
  height:46px;
  
}

#cat1 {
  background-position:0 2px;
}
#cat2 {
  background-position:-52px 4px;
}
#cat3 {
  background-position:0 -47px;
}
#cat4 {
  background-position:-52px -47px;
}

#cat1:hover {
  background-position:-102px -4px;
}
#cat2:hover {
  background-position:-154px -2px;
}
#cat3:hover {
  background-position:-102px -48px;
}
#cat4:hover {
  background-position:-154px -48px;
}

#cat1:active {
  background-position:-202px -4px;
}
#cat2:active {
  background-position:-254px -2px;
}
#cat3:active {
  background-position:-202px -48px;
}
#cat4:active {
  background-position:-255px -48px;
}

.ui-button {
  border:none;
  background:none;
}
.ui-button span {
  color:#888;
  font-size:17px;
}
.ui-button-text-only .ui-button-text {
  padding: 0.4em 0;
}
.ui-button:hover span {
  color:#204760;
}


/* min tabs */
#tabs-min { 
    background: transparent; 
    border: none; 
} 
#tabs-min .ui-widget-header { 
    background: transparent; 
    border: none; 
    -moz-border-radius: 0px; 
    -webkit-border-radius: 0px; 
    border-radius: 0px; 
} 
#tabs-min .ui-tabs-nav .ui-state-default { 
    background: transparent; 
    border: none; 
} 
#tabs-min .ui-tabs-nav .ui-state-active { 
    background: transparent url(../img/uiTabsArrow.png) no-repeat bottom center; 
    border: none; 
} 
#tabs-min .ui-tabs-nav .ui-state-default a { 
    color: #222; 
} 
#tabs-min .ui-tabs-nav .ui-state-active a { 
    color: #fff; 
}
.ui-widget-content {
  color: #fff;
}

footer {
  background-color: #f9f9f9;
  border-top: 1px solid #e5e5e5;
  color: #999;
  padding: 10px 0;
  text-align: center;
}


.feedback_text {
  display: block;
  left: 0;
  position: absolute;
  top: 50%;
}

.navbar {
  margin: 5px auto;
}
.navbar-default, .breadcrumb {
    background-color: transparent;
    border-color: transparent;
    box-shadow: none;
}

.nav>li>a, .nav>li > .flink {
  color: #777;
  cursor: pointer;
  line-height: 40px;
  vertical-align: middle;
  height: 40px;
  padding: 0 12px;
}

.nav-tabs a, .nav-tabs div.flink {
  color: #fff;
}
.nav-tabs li:hover a, .nav-tabs li:hover div.flink {
  color: #555;
}

.navbar-default .navbar-nav>li>a:hover span.opstog1, .navbar-default .navbar-nav>li>a:hover span.opstog2 {
  color: #001a9e;
}
.navbar-default .navbar-nav>li>.glyphicon {
  font-size: 18px;
}
.navbar-default .navbar-nav>li>.glyphicon-sunglasses {
  font-size: 22px;
  margin-top: -2px;
}


#preview_areal {
  padding-top: 116px; margin-top: -116px;
}

.breadcrumb li a {
    color:#23527c;
    text-decoration: none;
}
.breadcrumb li a:hover,
.breadcrumb li a:active {
    color:#337ab7;
    text-decoration: none;
}
.breadcrumb li.donate-link {
  float: right;
  margin-right: 10px;
}
.breadcrumb li.donate-link::before {
  display: none;
}

.nmabs {
  right: calc(50% - 6px);
  position: absolute;
  z-index:1;
  margin-top: 10px;
}

.top_video {
  width: 100%;
  height: auto;
  max-height: 370px;
}

.cpicker {
  width: 18px;
  background: transparent url("../images2/icons/cbgs.png") no-repeat ;
}
.cpicker:hover {
  background: transparent url("../images2/icons/cb.png") no-repeat;
}
.rlogo {
  height: 150px;
  margin-left:-40px;
  margin-right:-40px;
}
.rlogolbl {
  margin-left: -40px;
  margin-top: -4px;
}
.rlogoicn {
  margin-left: -10px;
  margin-right: -15px;
}
hr {
  margin-top:10px;
  margin-bottom:10px;
}
.breadcrumb {
  margin-bottom:10px;
  width: 100%;
  padding:6px;
}
#links2 {
  margin: 0 auto;
  width: auto;
}
#links2 .btn {
  display: inline;
}

body footer {
  position:fixed;
  bottom:0;
  width:100%;
}

.welcome-overlay {
  background-color: #0889f9;
  border-radius: 8px;
  /*bottom: -25px;*/
  /*font-size: 24px;*/
  /*left: -180px;*/
  /*padding: 8px;*/
  position: absolute;
  width: 191px;
  height: 105px;
  color:transparent;
  box-shadow: 2px 2px 4px rgba(0,0,0,.6);
  z-index:1000002;
  /*text-align: center;*/
  cursor: pointer;
  /*line-height: 26px;*/

  background: url(../img/welcome_bg.png) no-repeat scroll center center transparent;
  background-size: 100%;
  bottom: -26px;
  left: -196px;
}
.welcome-overlay .arrow-right {
  border-bottom: 8px solid transparent;
  border-left: 8px solid #0889f9;
  border-top: 8px solid transparent;
  bottom: 40px;
  height: 0;
  position: absolute;
  right: -8px;
  width: 0;
}
#xs_control {
  background-color: #0889f9;
  border-radius: 8px;
  bottom: -11px;
  font-size: 17px;
  left: -146px;
  padding: 8px 8px 2px;
  position: absolute;
  width: 145px;
  color:#FFFFFF;
  box-shadow: 2px 2px 4px rgba(0,0,0,.6);
  z-index:1000002;
  text-align: center;
}

#xs_control .arrow-right {
    border-bottom: 8px solid transparent;
    border-left: 8px solid #0889f9;
    border-top: 8px solid transparent;
    bottom: 24px;
    height: 0;
    position: absolute;
    right: -8px;
    width: 0;
}

#xs_control span {
  color:#dadada;
  margin:4px 5px;
  cursor:pointer;
}
#xs_control span.cact {
  color:#ffffff;
}
#xs_control span:hover {
  color:#ffffff;
}
#xs_control .xs_control_v {
  clear: both;
  border-top: 1px solid #B3B6B7;
  text-align: center;
  text-transform: capitalize;
  word-wrap: break-word;
  margin-top: 3px;
  padding-top: 3px;
}

.xs_control_h {
  margin:0 !important;
}

.fontsize-number {
  background-color: transparent;
  border: none;
  width: 35px;
  float: left;
  text-align: center;
}
.fontsize-number:active, .fontsize-number:focus {
  border: none;
  background-color: #077ce2;
}

.fontsize-action {
  width: 47px;
  height: 25px;
  background-color: transparent;
  border-width: 0;
  float: left;
  padding: 0;
  outline: none;
  opacity: 0;
  transition: opacity .3s ease-in-out;
}
.fontsize-action-left {
  background: rgb(0,0,0);
  background: linear-gradient(-90deg, rgba(0,0,0,0) 0%, rgba(120,10,191,1) 50%);
  border-radius: 6px 0 0 6px;
}
.fontsize-action-left:hover {
  opacity: 1;
}
.fontsize-action-right {
  background: rgb(255,236,62);
  background: linear-gradient(-90deg, rgba(255,236,62,1) 50%, rgba(0,0,0,0) 100%);
  border-radius: 0 6px 6px 0;
}
.fontsize-action-right:hover {
  opacity: 1;
}

/*carousel styles*/
.carousel-inner {
  position:relative;
}

.carousel-table {
  display: table;
  position: relative;
  width: 100%;
}
div.carousel {
  display: table-row;
  position: relative;
}

.has-feedback-left .form-control-feedback {
    left: 0px;
    color: #368ECE;
}
.has-feedback-left .form-control {
  padding-right: 12px;
  padding-left: 30px;
  border-radius: 15px !important;
  box-shadow: 0px 1px 5px rgba(0, 0, 0, 0.2) inset;
}
.has-feedback-left .search_s:focus {
  border-color:#ccc;
}

#compare_area .list-group li {
  margin-bottom: 15px;
}


ol.smooth-sortable li {
  list-style: none;
}

.ui-sortable {
    margin: 0px;
    padding: 0px;
    list-style: outside none none;
}

.ui-sortable-handle {
  margin-bottom: 1em;
}
.ui-sortable-handle .ffamily {
  cursor: move;
  position:relative;
}
.ui-sortable-handle .c-actions .glyphicon-random {
padding: 3px;
}
.c-actions .glyphicon-ok, .c-actions .glyphicon-shopping-cart, .c-actions .glyphicon-heart-empty, .c-actions .glyphicon-remove, .c-actions .glyphicon-eye-open, .c-actions .glyphicon-eye-close, .c-actions .glyphicon-list-alt {
margin-right:12px;
cursor:pointer;
padding: 3px;
margin-right: 3px;
user-select: none;
}

.compare-visibility {
  position: fixed;
  font-size: 18px;
  color: #888;
  text-align: right;
  margin-left: -2px;
  margin-top: 2px;
  cursor: pointer;
}
.compare-visibility-mobile {
  font-size: 18px;
  color: #888;
  cursor: pointer;
  position: fixed;
  top: 110px;
  right: 10px;
  z-index: 10;
  /*display: none;*/
}
.ui-sortable-handle .c-actions .glyphicon-ok, .ui-sortable-handle .c-actions .glyphicon-heart-empty {
  opacity: 0.2;
  transition: all 0.2s linear;
}
.ui-sortable-handle .c-actions .glyphicon-remove {
margin-right:12px;
opacity: 0.2;
transition: all 0.2s linear;
cursor:pointer;
padding: 3px;
margin-right: 3px;
}
.ffamily:hover .c-actions .glyphicon-ok, .ffamily:hover .c-actions .glyphicon-remove, .ffamily:hover .c-actions .glyphicon-heart-empty {
    opacity: 1;
    transition: all 0.6s linear;
}
.ffamily .c-actions {
  font-size: 18px;
  color: #888;
  position: absolute;
  right: 0;
  top: 0;
  margin-right: 6px;
}
.ui-sortable-helper {
  background-color: #FFF;
  text-shadow: 0px 1px 0px #EEE;
}
.droppable {
  position: absolute;
  margin: 0;
  padding: 0;
  bottom: -10px;
  width: 94%;
  left: 3%;
  height: 100px;
  line-height: 100px;
  text-align: center;
  visibility: hidden;
}
.droppable.ui-state-default {
  visibility: visible;

    bottom: 0;
   -webkit-transition: bottom .1s ease-in-out;
   -moz-transition: bottom .1s ease-in-out;
   -o-transition: bottom .1s ease-in-out;
   -ms-transition: bottom .1s ease-in-out;
   transition: bottom .1s ease-in-out;
}


.carousel-inner > .item > img, .carousel-inner > .item > a > img {
  width: 100%;
}
.carousel-control {
    width: 8.33333333%;
    color: #337ab7;
    opacity: 1;
    text-shadow: unset;
    display: table-cell;
    position:relative;
    vertical-align:middle;
    z-index:1;
}
.carousel-control {
  color: #7D8183;
}

.carousel-control:focus, .carousel-control:hover {
  color: #204760;
}
.carousel-control a {
  display: block;
}

.carousel-control .glyphicon-forward {
  margin-left: 4px;
}

.carousel-control span {
    margin: 5px 0;
}

/* Fade transition for carousel items */
.carousel .item {
  left: 0 !important;
    -webkit-transition: opacity .4s; /*adjust timing here */
       -moz-transition: opacity .4s;
         -o-transition: opacity .4s;
            transition: opacity .4s;
}
.carousel-control {
  background-image: none !important; /* remove background gradients on controls */
}

/* Fade controls with items */
.next.left, .prev.right {
  opacity: 1; z-index: 1;
}
.active.left, .active.right {
  opacity: 0; z-index: 2;
}

.leftpair {
  margin-top:150px;
}

.navbar-form, .navbar-collapse, .navbar-collapse.in {
  border-width:0;
  overflow-y: visible;
}


#search_results {
  overflow-y: auto;  
  width: 90%;
  z-index: 300;
  line-height: 30px;
  margin-top: 33px;
  position: absolute;
  right: 5%;
  height: 80vh;
}
#search_results ul {
    list-style: outside none none;
    padding: 0px;
    margin: 0px;
    height: auto;
    border: 1px solid #CCC;
    background-color: #FFF;
}
#search_results ul li {
  margin: 0 10px;
  vertical-align: middle;
  line-height: 30px;
  cursor: pointer;
  overflow: hidden;
  text-overflow: ellipsis;
  width: calc(100% - 20px);
  white-space: nowrap;
}
#search_results ul li a {
    line-height: 20px;
    text-decoration: none;
    padding: 5px;
    display: block;
    color: #333;
    margin-left: 36px;
    text-overflow: ellipsis;
    overflow: hidden;
}
#search_results ul li img {
  width: 24px;
  height: 24px;
  margin-right: 8px;
  vertical-align: middle;
}
#search_results .img {
    display: block;
    margin: 0px 7px 5px;
    border: 1px solid #EBEBEB;
    float: left;
}

/* video controls onhover effect */
.third-effect {
  position: relative;
}
.third-effect .mask {
    width: 100%;
    height: 100%;
    position: absolute;
    overflow: hidden;
    top: 0;
    left: 0;

   opacity: 0;
   overflow:visible;
   -moz-box-sizing:border-box;
   -webkit-box-sizing:border-box;
   box-sizing:border-box;
   -webkit-transition: all 0.4s ease-in-out;
   -moz-transition: all 0.4s ease-in-out;
   -o-transition: all 0.4s ease-in-out;
   -ms-transition: all 0.4s ease-in-out;
   transition: all 0.4s ease-in-out;
}
.third-effect a.info, .third-effect .rbtns {
  position: absolute;
  bottom: 45%;
  text-align: center;
  opacity: 0;
  color: #fff;
  width: 100%;
  margin-left: 0;
  left: 0;
   -webkit-transition: opacity 0.5s 0s ease-in-out;
   -moz-transition: opacity 0.5s 0s ease-in-out;
   -o-transition: opacity 0.5s 0s ease-in-out;
   -ms-transition: opacity 0.5s 0s ease-in-out;
   transition: opacity 0.5s 0s ease-in-out;
}
.third-effect .rbtns2 {
  bottom: 50%;
}
.third-effect:hover .mask {
   opacity: 1;
  background-color: rgba(0,0,0,0.4);
}
.third-effect:hover a.info, .third-effect:hover .rbtns {
	opacity:1;
	-moz-transition-delay: 0.3s;
	-webkit-transition-delay: 0.3s;
	-o-transition-delay: 0.3s;
	-ms-transition-delay: 0.3s;
	transition-delay: 0.3s;
}
.third-effect .rbtns p {
  display: inline-block;
  color: white;
  margin: 0 5px;
}

.third-effect video {
  vertical-align: bottom;
  object-fit: fill;
}

.right-slider:hover {
   -webkit-transition: all 0.5s 0s ease-in-out;
   -moz-transition: all 0.5s 0s ease-in-out;
   -o-transition: all 0.5s 0s ease-in-out;
   -ms-transition: all 0.5s 0s ease-in-out;
   transition: all 0.5s 0s ease-in-out;
  background-color:rgba(0,0,0,0.2);
}


.panel-faq {
  border: 1px solid #1f46af;
  background-color: transparent;
}


#share-modal-box .podcast-title { 
  width: 90%;
  margin: 0 auto;
  display: block;
} 

/* images that are hidden, should be visible only in LG */
.hidden-md .img-responsive {
  display:none;
}
@media (min-width:1200px){
  .hidden-md .img-responsive {
    display:block;
  }
}
/* LG */
@media (min-width:1200px)and (max-width:1400px){
  .rlogo {
    height: 130px;
    margin-right:-40px;
  }
  .rlogoicn {
    height: 132px;
    margin-left: -10px;
    margin-right: -40px;
  }
}


/* MD */
@media (min-width:992px)and (max-width:1199px){
  .ffamily .c-actions {
    font-size: 30px;
  }
  .rlogo {
    height: 120px;
    margin-right:-30px;
  }
  .rlogoicn {
    height: 72px;
    margin-left: -10px;
    margin-right: -40px;
  }

  .leftpair {
    margin-top:20px;
  }
  .rbtns p, .carousel-control span {
    margin-top: 0px;
    margin-bottom: 35px;
    font-size: 39px;
    height: 39px;
    line-height: 39px;
  }
  .cpicker {
    width: 39px;
    background-size: 39px;
  }
  .cpicker:hover {
    background-size: 39px;
  }
  .box {
    min-height: 700px;
  }

  .maincontent {
    margin-top:100px;
  }
  .navbar-toggle {
    border-width:0;
  }
  .navbar {
    background-color: #fff;
    width: 100%;
    padding-left:25px;
    position: fixed;
    top: 0px;
    z-index: 20;

    border-radius: inherit;
    left: 0;
    margin: 0;

    -webkit-box-shadow: 0px 30px 20px -24px rgba(50,50,50,0.64);
    -moz-box-shadow: 0px 30px 20px -24px rgba(50,50,50,0.64);
    box-shadow: 0px 30px 20px -24px rgba(50,50,50,0.64);
  }

  .navbar-brand-logon {
    height:auto;
  }
  #bs-navbar-collapse {
    margin-top: 20px;
  }
  #bs-navbar-collapse .nav li.visible-md-block {
    display:table-cell !important;
    text-align: center;
  }
  #bs-navbar-collapse .nav {
    position: absolute;
    right: 25%;
  }
  #search_form {
    width: 25%;
  }
  #preview_areal {
    padding-top: 136px; margin-top: -136px;
  }
  footer {
    font-size:12px;
  }
}

/* SM */
@media (min-width:768px)and (max-width:991px) {
  .ffamily .c-actions {
    font-size: 30px;
  }
  .rlogo {
    height: 50px;
    margin-right:0;
  }
  .rlogoicn {
    height: 72px;
    margin-left: -10px;
    margin-right: -40px;
  }
  .leftpair {
    margin-top:20px;
  }
  .rbtns p, .carousel-control span {
    margin-top: 0px;
    margin-bottom: 26px;
    font-size: 30px;
    height: 30px;
    line-height: 30px;
  }
  .cpicker {
    width: 30px;
    background-size: 30px;
  }
  .cpicker:hover {
    background-size: 30px;
  }
  .box {
    min-height: 450px;
  }
  .maincontent {
    margin-top:100px;
  }
  .navbar-toggle {
    border-width:0;
  }
  .navbar {
    background-color: #fff;
    width: 100%;
    padding-left:25px;
    position: fixed;
    top: 0px;
    z-index: 20;

    border-radius: inherit;
    left: 0;
    margin: 0;

    -webkit-box-shadow: 0px 30px 20px -24px rgba(50,50,50,0.64);
    -moz-box-shadow: 0px 30px 20px -24px rgba(50,50,50,0.64);
    box-shadow: 0px 30px 20px -24px rgba(50,50,50,0.64);
  }
  .navbar-brand-logon {
    height:auto;
  }
  #bs-navbar-collapse {
    margin-top: 20px;
  }
  #bs-navbar-collapse .nav li.visible-sm-block {
    display:table-cell !important;
    text-align: center;
  }
  #bs-navbar-collapse .nav {
    position: absolute;
    right: 28%;
  }
  #search_form {
    width: 30%;
    float: left;
  }

  #preview_areal {
    padding-top: 136px; margin-top: -136px;
  }
  footer {
    font-size:11px;
  }
}


/* XS */
@media (max-width:767px){

  .col-xs-11 {
    height: 100%;
    width: calc(100% - 50px);
    padding-right: 0;
  }
  .col-xs-1 {
    padding-left: 0;
    width: 50px;
    padding-right: 0;
  }

  .ffamily .c-actions {
    font-size: 24px;
  }
  div.par_col {
    margin-top: 106px;
  }

  .leftpair {
    margin-top:20px;
  }
  .leftpair .rtoolbar {
    padding-top: 15px;
  }
  .rlogo {
    height: 40px;
    margin-left: 0;
    margin-right: 0;
  }
  .rlogolbl {
    margin-left: 0;
    margin-top: 5px;
  }
  .rlogoicn {
    height: 52px;
    margin-left: 0;
    margin-right: -40px;
  }
  .navbar-toggle {
    border-width:0;
    margin-top: 25px;
  }
  .rbtns {
    margin-left: 0;
  }
  .rbtns p, .carousel-control span {
    margin-top:0;
    margin-bottom:14px;
    font-size: 24px;
    height: 24px;
    line-height: 24px;
    text-align: center;
    display: block;
  }
  div.rbtns .hint--left {
    display: block;
}
.rbtns p > span {
  left: -5px;
}
  div.hint--left {
    width:100%;
  }
  .cpicker {
    width: 24px;
    background-size: 24px;
  }
  .cpicker:hover {
    background-size: 24px;
  }
  .box {
    background-image: url("../images2/ts_prototype1A_Small.png");
    min-height: 520px;
  }
  .maincontent {
    margin-top:100px;
  }
  .navbar {
    background-color: #fff;
    width: 100%;
    position: fixed;
    top: 0px;
    z-index: 20;

    border-radius: inherit;
    left: 0;
    margin: 0;
    min-height: 80px;

    -webkit-box-shadow: 0px 30px 20px -24px rgba(50,50,50,0.64);
    -moz-box-shadow: 0px 30px 20px -24px rgba(50,50,50,0.64);
    box-shadow: 0px 30px 20px -24px rgba(50,50,50,0.64);
  }
  .breadcrumb {
    background-color: #fff;
    position: fixed;
    left: 0;
    top: 83px;
    z-index: 10;
  }
  .navbar-brand-logon {
    height:auto;
  }
  .navbar-brand {
    height:auto;
  }
  
  #xs_control {
    left: -140px;
    bottom: -12px;
  }
  #xs_control .arrow-right {
    bottom: 30px;
  }
  .welcome-overlay {
    /*left: -174px;*/

    left: -194px;
  }
  #bs-navbar-collapse .nav li.visible-xs-block {
    display:table-cell !important;
    text-align: center;
  }
  #bs-navbar-collapse .nav {
    display: table;
    width: 55%;
    float:right;
  }
  #search_form {
    width: 45%;
    float: left;
    margin: 0;
    padding-left:0;

    top: 15px;
    right: 50px;
    position: absolute;
  }

  #search_results {
    right: 8%;
    width: 84%;
  }

  #search_results ul li a {
    padding: 2px;
    line-height: 17px;
    margin-left: 34px;
  }
  #search_results .img {
    margin: 0px 4px 3px;
    width: 24px;
    height: 24px;
  }

  footer {
    font-size:10px;
  }

}

@media (max-width:650px){
  .box {
    min-height: 420px;
  }
  .blue_modal .static-section button.btn {
      font-size: 13px;
  }
}
@media (max-width:550px){
  .box {
    min-height: 300px;
    padding: 15px 16px;
  }
}


.par_col {
  overflow:hidden;
  position:relative;
  margin-top: 80px;
}

.center_col {
  width:35%;
}
.side_col1 {
  width:30%;
  position:relative;
}
.side_col2 {
  width:30%;
}

/*less than LG*/
@media (max-width:1199px) {
  .side_col1, .side_col2 {
    float:none;
    margin:0 auto;
  }
  .center_col {
    width:100%;
    position: relative;
  }
  .side_col1, .side_col2 {
    width:100%;
  }
  .rlogolbl {
    height: 58px;
  }
  #lslide1 {
    margin-bottom:10px;
  }
  body footer {
    position:relative;
  }
  .navbar-nav .account-menu, .navbar-nav .logout-menu {
    white-space: nowrap;
  }
}
/*LG*/
@media (min-width:1200px) {
  body {
    height:100vh;
    overflow:hidden;
  }
  .rlogoicn {
    width: 155px;
    margin-top: -29px;
  }
  .container {
    width: 65%;
    margin-left: 10.5%;
  }
  .par_col {
    overflow: visible;
    position: relative;
    margin-top: 1px;
  }
  .side_col1 {
    position: fixed;
    left: 0;
    bottom: 41px;
    width: 37%;
  }
  .center_col {
    position: relative;
    margin-left: 38%;
    position: fixed;
    height: calc(100% - 105px);
  }
  .side_col2 {
    position: fixed;
    right: 0;
    bottom: 41px;
  }
  #preview_areal {
    padding-top: inherit;
    margin-top: inherit;
  }

  .nav-tabs>li.active>a, .nav-tabs>li.active>a:focus, .nav-tabs>li.active>a:hover,
  .nav-tabs {
    border-width:0;
  }

  /* fluid layout styles */
  .navbar-header {
    width: 26%;
  }
  .nav.navbar-nav {
    margin-left: calc(38% - 105px);
    position: absolute;
    left: 0;
  }
  #search_form {
    width: 30%;
    margin-right:0;
  }
  #search_form .input-group {
    width:100%;
  }
  a.navbar-brand {
    width: 100%;
    padding: 0;
    margin: 0 !important;
  }
  a.navbar-brand img {
    height: auto;
    width: 100%;
    padding: 0;
  }
  .nav>li>a, .nav>li>a:link, .nav>li>a:hover, .nav>li>a:active, .nav>li>a:visited,
  .nav>li> .flink {
    padding-left: 5px;
    padding-right: 5px;
  }
}



.ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button {
  font-family: inherit;
}

input[type=range][orient=vertical] {
    writing-mode: bt-lr; /* IE */
    -webkit-appearance: slider-vertical; /* Webkit */
    width: 20px;
    height: 100px;
}

.cart-items a {
  color: #fff;
}

/* videogrid modal window */
/** search and sort section css start ***/
#searchFilterWrap {
  overflow: hidden;
  padding-right: 300px;
  max-width: 800px;
  margin: 0 auto;
  margin-top: 50px;
}
#searchForm {
  position: relative;
  width: 100%;
  float: left;
}
#searchForm .icon-search {
  position: absolute;
  right: 10px;
  top: 8px;
  font-size: 22px;
}
#searchBox {
  width: 100%;
  border: 1px solid #ccc;
  outline: none;
  padding-left: 15px;
  padding-right: 40px;
  border-radius: 10px;
  font-size: 16px;
  height: 40px;
}
#sortByWrap {
  float: right;
  margin-right: -250px;
}
#sortByWrap [class^="icon-"],
#sortByWrap [class*=" icon-"] {
  background: none repeat scroll 0 0 #f7faff;
  border-radius: 5px;
  cursor: pointer;
  display: inline-block;
  font-size: 18px;
  height: 40px;
  line-height: 40px;
  margin-right: 10px;
  text-align: center;
  width: 40px;
}

  .grid {
    border: 1px solid #cccccc;
    list-style: none;
    background: #ffffff;
    box-sizing: border-box;
    -moz-box-sizing : border-box;
    -webkit-transition: all 0.6s ease-out;
    transition: all 0.6s ease-out;
}
.grid-img {
    width: 100%;
    vertical-align: middle;
    -webkit-transition: opacity 0.6s ease-out;
    transition: opacity 0.6s ease-out;
    background-color: #fff;
}
 
.grid-img.img-loaded{
    visibility: visible;
    opacity: 1;
}

  .dynamic-grid {
  position: relative;
}
.dynamic-grid.angular-grid {
  display: block;
}
.grid {
  list-style: none;
  background: #ffffff;;
  box-sizing: border-box;
  -webkit-transition: all 400ms ease;
  transition: all 400ms ease;
  overflow: hidden;
  border-radius: 10px;
  width: 300px;
  display: inline-block;
}
.grid.ng-leave {
  -webkit-transition: all ease 400ms;
  transition: all ease 400ms;
}
.grid.ng-leave.ng-leave-active {
  -webkit-transform: scale(0.5);
  transform: scale(0.5);
  opacity: 0;
}
.grid.ng-enter {
  -webkit-transition: all ease 400ms;
  transition: all ease 400ms;
  -webkit-transition-delay: 500ms;
  transition-delay: 500ms;
  -webkit-transform: scale(0.5);
   transform: scale(0.5);
  opacity: 0;
}
.grid.ng-enter.ng-enter-active {
  -webkit-transform: scale(1);
  transform: scale(1);
  opacity: 1;
}
.grid-img {
  width: 100%;
  vertical-align: middle;
  background-color: #fff;
}
.grid-img.img-loaded {
  visibility: visible;
  opacity: 1;
}

.fonts-vertical-set ul {
  max-height: 370px;
  overflow-y: auto;
  background-color: #000;
  padding: 0 1px 0 0;
  margin: 0;
}
.fonts-vertical-set ul li {
  list-style: none;
  color: #fff;
  width: 100%;
  line-height: 105px;
  border-bottom: 1px solid #247dbf;
  position: relative;
  display: flex;
}
.fonts-vertical-set ul li .font-icon, .fonts-vertical-set ul li .font-name, .fonts-vertical-set ul li .font-cart {
  cursor: pointer;
  display: inline-block;
}
.fonts-vertical-set ul li h4 {
  font-size: 34px;
  margin: 0;
  font-weight: normal;
  vertical-align: middle;
}
.fonts-vertical-set ul li .font-name {
  flex: 1;
  margin-left: 10px;
  overflow: hidden;
  white-space: nowrap;
  margin-right: 15px;
  line-height: 104px;
}
.fonts-vertical-set ul li .font-cart {
  vertical-align: middle;
  font-size: 18px;
  line-height: 100px;
  margin-left: 10px;
  margin-right: 10px;
}

.search-backdrop {
  position:fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 10;
}


div#helium_checkout_container, div#helium_checkout_container *, div#helium_checkout_container input, div#helium_checkout_container textarea, div#helium_checkout_container button,
div#helium_checkout_container form input, div#helium_checkout_container form textarea, div#helium_checkout_container form button, .ElementsApp input {
  font-family: "TFForever® TWO REGULAR", sans-serif !important;
}

body div#helium_checkout_container, body div#helium_checkout_container div.helium_checkout_controls {
  background-image: none;
  background-color: rgba(0, 141, 252, 0.95);
}
body div#helium_checkout_container div#helium_checkout_server_error,
body div#helium_checkout_container div#helium_checkout_container_processing {
  background: inherit;
}
body div#helium_checkout_container div#helium_checkout_server_error p,
body div#helium_checkout_container div#helium_checkout_container_processing p,
body div#helium_checkout_container p.thanks, body div#helium_checkout_container p.error_message
{
  color: #fff;
  text-shadow: none;
  font-size: 16px;
}
body div#helium_checkout_container div#helium_checkout_server_error p a.helium_checkout_button span {
  box-shadow: none;
}
body div#helium_checkout_container div#helium_checkout_container_processing span.large_icon {
  display: none;
}
body div#helium_checkout_container form fieldset h5 span {
  background-image: none;
  text-shadow: none;
  padding: 7px 16px;
  color: #2d6b8f;
  background-color: #fff;
  border-radius: 15px;
}
div#helium_checkout_container div.helium_checkout_controls a.helium_checkout_button span {
  display: none;
}
body div#helium_checkout_container a.helium_checkout_button {
  text-shadow: none;
  color: #2d6b8f;
  background-color: #fff;
  box-shadow: none;
  border-radius: 15px;
  padding: 7px 16px;
  font-size: 12px;
  background-image: none;
  text-transform: uppercase;
}
body div#helium_checkout_container a.helium_checkout_button:active {
  box-shadow: none;
  background-color: #f4f4f4;
}
body div#helium_checkout_container span.helium_flag span.message {
  width: 110px;
}
div#helium_checkout_container input.helium_checkout_field.qty {
  display: none;
}


.delayed-button {
  opacity: 0;
    -moz-animation: delayVisibility 0.5s ease-in 4s forwards;
  -webkit-animation: delayVisibility 0.5s ease-in 4s forwards;
  -o-animation: delayVisibility 0.5s ease-in 4s forwards;
  animation: delayVisibility 0.5s ease-in 4s forwards;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
}
@keyframes delayVisibility {
  from { opacity: 0; }
  to {
    opacity:1;
  }
}
@-webkit-keyframes delayVisibility {
  from { opacity: 0; }
  to {
    opacity:1;
  }
}

.modal-body { /*def override*/
  padding: 10px 15px;
}

.extend-license-modal {
  max-height: 100%;
}

.cursor-pointer {
  cursor: pointer;
}
.modal-body h3 i.tool {
  font-size: 16px;
  margin-left: 5px;
  cursor: pointer;
}

.profile-edit-form {
  margin: 0 20px 20px;
}
.profile-edit-form .control-label {
  margin-right: 10px;
}
.profile-edit-form .control-label-prefix {
  vertical-align: top;
}
.profile-edit-form .form-group {
  display: flex;
}
.profile-edit-form .control-field {
  display: inline-block;
  flex: 1;
}
.profile-edit-form .checkbox[disabled] checkbox, .profile-edit-form input[type=checkbox][disabled] {
  cursor: default;
}

.extend-license-modal .modal-content .h4 {
  text-align: center;
  font-size: 22px;
  margin-bottom: 20px;
}
.extend-license-modal button.btn-active {
  color: #fff;
  background-color: #204d74;
  border-color: #122b40;
}
.extend-license-modal label {
  font-size: 15px;
  margin-bottom: 9px;
}
.extend-license-modal label .cbold {
  font-size: 18px;
}
.extend-license-modal .row .col-xs-12 {
  margin-bottom: 10px;
}
.podcast-modal .list-group,
.extend-license-modal .list-group {
  margin-bottom: 15px;
  max-height: calc(100vh - 430px);
  overflow: auto;
}
.extend-license-modal .list-group li,
.podcast-modal .list-group li {
  padding: 5px 10px;
  background-color: #0c6de0;
  border-color: #4c94ea;
}
.podcast-modal .list-group li i {
  float: right;
}
.podcast-modal .list-group li a {
  color: #fff;
  text-decoration: none;
}
.extend-license-modal .list-group li i {
  margin-top: 3px;
}
.extend-license-modal input[type="range"] {
  margin-bottom: 10px; 
}
.extend-license-modal section .btn, .extend-license-modal section .btn:active {
  font-size: 14pt;
  border-width:0;
  box-shadow: 0 0 1px 1px #fff inset;
  border-radius: 25px;
  background-color: transparent;
  outline: none;
  padding: 4px 12px;
  margin: 5px 6px;
}
.extend-license-modal .platform-selector {
  margin: -35px auto 40px;
  width: 126px;
  display: block;
}

@media (max-width:1199px){
  .extend-license-modal .list-group {
    max-height: 205px;
  }

  .extend-license-modal .platform-selector {
    margin: 0;
    width: 130px;
    display: inline-block;
  }
}
@media (min-width: 1200px) {
  .extend-license-modal .left-side {
    padding-right: 3px;
  }
  .extend-license-modal .right-side {
    padding-left: 3px;
  }
}


/* from feedback.css */
.blue_modal {
  background-color: #1a398c;
  color: white;
}
.blue_modal .close {
  color: white;
  text-shadow: inherit;
  outline: none;
}


/* new custom styles */
.feedback_modal {
  color: white;
}
.feedback_modal .close {
  color: white;
  text-shadow: inherit;
  font-size: 28px;
  z-index: 1;
  position: absolute;
  right: 15px;
  top: 15px;
}
.feedback_modal input, .feedback_modal textarea {
  border-width: 0;
}
.feedback_modal .modal-header {
  border-width: 0;
}

/* from accordion.css */

.accordian {
  width: 100%;
  overflow: hidden;
  
  /*Time for some styling*/
  box-shadow: 0 0 10px 1px rgba(0, 0, 0, 0.35);
  -webkit-box-shadow: 0 0 10px 1px rgba(0, 0, 0, 0.35);
  -moz-box-shadow: 0 0 10px 1px rgba(0, 0, 0, 0.35);
}

/*A small hack to prevent flickering on some browsers*/
.accordian ul {
  display: flex;
  width: 100%;
  margin: 0;
  padding: 0;
  /*This will give ample space to the last item to move
  instead of falling down/flickering during hovers.*/
}

.accordian li {
  position: relative;
  display: inline-block;
  width: 20%;
  
  border-left: 1px solid #888;
  
  box-shadow: 0 0 25px 10px rgba(0, 0, 0, 0.5);
  -webkit-box-shadow: 0 0 25px 10px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: 0 0 25px 10px rgba(0, 0, 0, 0.5);
  
  /*Transitions to give animation effect*/
  transition: width 0.5s ease-in-out 0.1s;
  -webkit-transition: width 0.5s ease-in-out 0.1s;
  -moz-transition: width 0.5s ease-in-out 0.1s;
  /*If you hover on the images now you should be able to 
  see the basic accordian*/
}

/*Reduce with of un-hovered elements*/
.accordian ul:hover li {width: 5%;}
/*Lets apply hover effects now*/
/*The LI hover style should override the UL hover style*/
.accordian ul li:hover {width: 80%;}


.accordian li img {
  display: block;
}

/*Image title styles*/
.image_title {
  background: rgba(0, 0, 0, 0.5);
  position: absolute;
  left: 0; bottom: 0;  
  width: 640px;
  display: none;

}
.image_title a {
  display: none;
  color: #fff;
  text-decoration: none;
  padding: 20px;
  font-size: 16px;
}

/* from cart-menu2.css */


.ccart {
  height: 100%;
  padding: 0;
  display: block;
  width:100%;
}

.ccart .table-row-group {
  display: block;
}
.ccart .section  {
  color: #ffffff;
  display: block;
  width: 100%;
  overflow: hidden;

}
.ccart .section-1.animated, .ccart .section-2.animated, .ccart .section-3.animated {
  -webkit-transition: height 0.2s linear;
  transition: height 0.2s linear;
}

.ccart .section h3 {
  margin-top: 10px;
  margin-bottom: 10px;
  font-size: 22px;
}
 .ccart .static-section {
    display: block;
    color: #ffffff;
    height: 55px;
    width: 100%;
}
.ccart .static-section .btn, #cart-modal2-box-info section .btn {
  font-size: 14pt;
  border-width:0;
  box-shadow: 0 0 1px 1px #fff inset;
  border-radius: 25px;
  background-color: transparent;
  outline: none;
  padding: 4px 12px;
  margin: 5px 10px;
}

.ccart .blue1 {
  background-color: rgba(255, 161, 0, 0.95);
}
.ccart .blue2 {
  background-color: rgba(247, 36, 16, 0.95);
}
.ccart .blue3 {
  background-color: rgba(2, 40, 192, 0.95);
}
.ccart .blue4 {
  background-color: rgba(0, 141, 252, 0.95);
}

.ccart .explanation {
  display: none;
}
.ccart .explanation p {
  margin-bottom: 5px;
  color: #902d07;
}
.ccart .explanation p, .ccart .explanation div {
  line-height: 20px;
}
.ccart .section .top {
  cursor: pointer;
}
.ccart .section .top span.fontname,
.ccart .section .top span.varname {
  text-transform: uppercase;
}

.ccart .section.active .explanation {
  display: block;
  padding-left: 5px;
  padding-right: 5px;
}
.ccart .section .explanation h4 {
  margin-top: 5px;
  margin-bottom: 5px;
}

.font-all-family-img {
  width: 100%;
}

.ccart .static-section {
  padding-top: 5px;
}
.ccart .media-left .glyphicon {
  font-size: 80px;
}
.ccart .media .halfpanel {
  width: 49%;
  display: inline-block;
  vertical-align:top;
}

#cart-modal2-box, #cart-modal2-box-info, #share-modal-box, #wishlist-modal-box, #cartlist-modal-box, #loginerr-modal-box, .myprofile-box-modal {
  height: 325px;
  display: none;
  position: absolute;
  z-index: 15;
  border-radius: 5px;
  overflow: hidden;
  width: 95%;
  background-color: transparent;
}
#ask-modal-box, #login-modal-box, #join-modal-box {
  position: absolute;
  z-index: 15;
  border-radius: 5px;
  overflow: hidden;
  width: 95%;
  background-color: transparent;
}

.join-form {
  margin-bottom: 7px;
}
.join-form .submit-button .btn, .join-form .submit-button .btn:active {
  margin: 0;
  border-radius: 0 4px 4px 0;
}


/* angular control */
div#share-modal-box, #wishlist-modal-box, #cart-modal2-box, #cart-modal2-box-info, #loginerr-modal-box, .myprofile-box-modal {
    display: block;
}

#share-modal-box, #ask-modal-box, #wishlist-modal-box, #cartlist-modal-box, #loginerr-modal-box {
  height: auto;
  max-height: 600px;
  overflow-y: auto;
}

#share-modal-box img {
  width: 325px;
}

.myprofile-box-modal {
  z-index: 12;
  height: auto;
}
.myprofile-box-modal .feedback_modal {
  background-color: rgba(8, 137, 249, 0.95);
}
#cart-modal2-box-info {
  z-index: 14;
  height: auto;
}
#join-modal-box .feedback_modal, #login-modal-box .feedback_modal,
#cart-modal2-box-info .feedback_modal, #share-modal-box .feedback_modal, #ask-modal-box .feedback_modal,
#wishlist-modal-box .feedback_modal, #cartlist-modal-box .feedback_modal, #loginerr-modal-box .feedback_modal {
  height: 100%;
  background-color: rgba(8, 137, 249, 0.95);
}
#cart-modal2-box-info .modal-body div {
  margin-bottom: 5px;
  line-height: 23px;
}
#cart-modal2-box-info .modal-body .col-xs-6 div {
  font-size:18px;
}
#cart-modal2-box-info .modal-body div.strong {
  font-weight:bold;
}

#cartlist-modal-box .modal-body, #wishlist-modal-box .modal-body {
  padding: 15px 30px;
}
#cartlist-modal-box .modal-body div, #wishlist-modal-box .modal-body div {
  text-transform: uppercase;
}
#cartlist-modal-box .modal-body div .glyphicon, #wishlist-modal-box .modal-body div .glyphicon {
  cursor: pointer;
}


.section-4 .explanation, .section-5 .explanation, .section-6 .explanation {
  display: block;
  padding: 10px 20px;
}

.section-5 .explanation .media-left {
  width: 30%;
  font-size: 18px;
}
.section-5 .explanation .col-xs-4 .pull-left {
  width: 40%;
}
.section-5 .explanation .col-xs-4 .pull-right {
  width: 60%;
}
.section-5 .explanation .col-xs-4 .existing_amount {
  font-size: 26px;
  line-height: 30px;
}
.section-5 .explanation .col-xs-4 .existing_desc {
  font-size: 22px;
  line-height: 26px;
}
.section-5 .explanation .col-xs-4 #slider_cart {
  margin-top: 10px;
  margin-left: 10px;
  margin-right: 20px;
  background-color: white;
  display: inline-block;
  height: 80px;
  padding: 0;
}

.ccart .section-4 .explanation p,
.ccart .section-5 .explanation p,
.ccart .section-6 .explanation p {
  color: #1189f5;
}

.select-format .format {
  color: #000;
  cursor: pointer;
  font-size: 22px;
  line-height: 30px;
  font-weight: normal;
}
.select-format p.format.active {
  color: #fff;
  font-size: 22px;
  line-height: 30px;
}

.select-license .license {
  color: #000;
  cursor: pointer;
  font-size: 22px;
  line-height: 30px;
  font-weight: normal;
}
.select-license p.license.active {
  color: #fff;
  font-size: 22px;
  line-height: 30px;
}
.section .explanation .col-xs-4 strong, .section .explanation .col-xs-5 strong{
  font-size: 18px;
  line-height: 25px;
  display: block;
  font-weight: normal;
}
.section-1 .explanation .col-xs-4:first-child,
.section-2 .explanation .col-xs-4:first-child,
.section-4 .explanation .col-xs-4:first-child,
.section-5 .explanation .col-xs-4:first-child,
.section-6 .explanation .col-xs-4:first-child,
.section-6 .explanation .col-xs-5:first-child
{
  text-align:right;
  padding-right: 0;
  padding-left: 10px;
}
.section-1 .explanation .col-xs-4:nth-child(2) img,
.section-2 .explanation .col-xs-4:nth-child(2) img,
.section-4 .explanation .col-xs-4:nth-child(2) img,
.section-6 .explanation .col-xs-4:nth-child(2) img,
.section-6 .explanation .col-xs-3:nth-child(2) img
{
  display: block;
  margin: 0 auto;
}
.section-1 .explanation .col-xs-4:last-child,
.section-2 .explanation .col-xs-4:last-child,
.section-4 .explanation .col-xs-4:last-child,
.section-5 .explanation .col-xs-4:last-child,
.section-6 .explanation .col-xs-4:last-child,
.section-6 .explanation .col-xs-5:last-child
{
  text-align:left;
  padding-left: 0;
  padding-right: 10px;
}

.section-3 .top h3 {
  line-height: 70px;
  margin-top: 0;
}
.section-3.active .top h3 {
  line-height: 38px;
}
.section-3 .explanation .col-xs-4 {
  cursor: pointer;
}
.section-1 div.font-demo {
  text-align: center;
  height: 120px;
  overflow: hidden;
}
.section-1 .explanation {
  margin-top: 23px;
}
.section-2 .explanation {
  margin-top: 23px;
}
.section-1 .explanation img, .section-2 .explanation img {
  height: 110px;
}
.section-3 .more-1 img, .section-3 .more-2 img, .section-3 .more-3 img {
  height: 110px;
}
.section-4 .explanation img, .section-6 .explanation img {
  height: 110px;
}

.colorpicker.dropdown-menu {
  background-color: #0889f9;
  padding: 5px;
  border-radius: 8px;
}
.colorpicker .btn-group .btn-sm {
  font-size: 12px;
  padding: 0;
  box-shadow: none;
  background-color: transparent;
  color: #fff;
  line-height: 26px;
  width: 67px;
}
.colorpicker.dropdown-menu:after {
  border-bottom-color: #0889f9;
}
.colorpicker-bar {
  min-height: 16px;
  margin: 6px 0 0 0;
  clear: both;
  text-align: center;
  font-size: 10px;
  line-height: normal;
  max-width: 100%;
}

.btn-scroll-up {
  position: fixed;
  width: 70%;
  height: 40px;
  bottom: 0;
  left: 15%;
  z-index: 100000;
  cursor: pointer;
  border-radius: 0;
  border-width: 0;
  background-color: rgba(255,255,255,0.5);
}


.other-brands {
  position: fixed;
  top: 0;
  right: 0;
  width: 27%;
  margin-top: 40px;
}
.other-brands .brands-title {
  font-size: 12px;
  line-height: 60px;
  text-align: center;
}
.other-brands .brands-title img {
  width: 100px;
  margin-bottom: 2px;
}
.other-brands .brands-subtitle {
  font-size: 16px;
  text-align: center;
  margin-bottom: 10px;
}
.other-brands .ui-carousel {
  display: block;
  margin-bottom: 30px;
  width: 90%;
  margin: 0 auto;
  opacity: 0.6;
}
.other-brands .carousel-item img {
  width: 100%;
}
.side_col2 .disclaimer {
  margin-bottom: 10px;
  font-size: 8px;
  text-align: center;
}

.custom-registration .email-field::placeholder {
  color: #fff;
}
.custom-registration .submit-field {
  font-size:28pt;box-shadow: 0 0 1px 1px #fff inset;border-radius: 30px;display: inline-block;padding: 0 20px;background-color: #fff;color: #158ff9;margin-bottom: 10px;cursor: pointer;
}
.custom-registration .submit-field[disabled] {
  opacity: .65;
  cursor: default;
}

@media (max-width: 1199px) {
  #cart-modal2-box, #cart-modal2-box-info, #share-modal-box, #wishlist-modal-box, #cartlist-modal-box, #loginerr-modal-box, .myprofile-box-modal, #ask-modal-box, #login-modal-box, #join-modal-box {
    width: 100%;
    padding: 0 2px;
  }

  .other-brands {
    display: none;
  }

  div.rbtns .hint--left {
    z-index: 12;
  }

  body div#helium_checkout_container div.paper div.paper_contents {
    padding-top: 40px;
  }
}

@media (max-width: 550px) {
  .ccart .section h3 {
    font-size: 18px;
  }
  .rbtns span {
    font-size: 18px;
  }
  .cpicker {
    width: 18px;
  }
  .ffamily .c-actions {
    font-size: 18px;
  }
}


@media (max-width: 1100px) {
  .rbtns p:hover {
    outline: 1px solid rgba(0,0,0,0.1);
  }
}