/* Add here all your CSS customizations */
.g_ad {
	text-align:center;
}
.p_heading {
	float:left;
}
.indent {
	margin-left:30px;
}
h4.group {
	background:#f2f2f2;
	padding:2px 0 2px 10px;
	border-top-left-radius:3px;
	border-top-right-radius:3px;
	border-bottom:1px solid #ccc;
	text-align:center;
	font-weight:bold;
	text-shadow:0 0 2px #fff;

}
.box-it {
	border:1px solid #ccc;
	border-radius:3px;
	font-size:0.9em;
	margin:0 1px 10px 1px;
}
.box-it p {
	line-height:1.5em;
}
.examples{position:relative;margin:15px 0;padding:39px 19px 14px;padding-top:39px;background-color:#fff;border:1px solid #ddd;border-radius:4px;}
.examples .topic{position:absolute;top:-1px;left:-1px;padding:3px 7px;font-size:12px;font-weight:bold;background-color:#f5f5f5;border:1px solid #ddd;color:#9da0a4;border-radius:4px 0 4px 0;}
.code {
	background:#f2f2f2;
	padding:0 2px;
	border-radius:3px;
	border:1px solid #ccc;
}
.external:after {
    content: " ";
    display: inline-block;
    background: url("../img/external.png") no-repeat;
    width: 16px;
    height: 16px;
    margin-left:5px;
    margin-right:-4px;
    vertical-align:text-bottom;
}
.btn-space {
	margin:0 15px 15px 0;
}
h1{
    position:relative;
    margin-bottom:14px;
    font-family:"Exo 2",Arial,sans-serif;
    font-size:2.25em;
    line-height:1.2em;
    font-weight:normal
}
h1:after{
    content:"";
    display:block;
    margin-top:5px;
    width:40px;
    height:3px;
    line-height:0;
	background-color:#ffb617;
}

.page-title-bottom-inner{
    position:relative;
    margin:-40px -40px 10px -40px
}
.page-title-bottom-inner:before,.page-title-bottom-inner:after{
    content:'';
    display:block;
    position:absolute;
    top:10px;
    left:-15px;
    width:15px;
    height:100px
}
.page-title-bottom-inner:after{
    left:auto;
    right:-15px
}
.page-title-bottom-inner2:before,.page-title-bottom-inner2:after{
    content:'';
    display:block;
    position:absolute;
    top:10px;
    left:-15px;
    width:15px;
    height:100px
}
.page-title-bottom-inner2:after{
    left:auto;
    right:-15px
}
.page-title-bottom-inner{
    color:#444;
    background-color:#fff
}
.page-title-bottom-inner:before{
    background-image:-webkit-gradient(linear, left top, right top, from(rgba(255,255,255,0)), to(rgba(0,0,0,0.15)));
    background-image:-webkit-linear-gradient(left, rgba(255,255,255,0), rgba(0,0,0,0.15));
    background-image:-moz-linear-gradient(left, rgba(255,255,255,0), rgba(0,0,0,0.15));
    background-image:-o-linear-gradient(left, rgba(255,255,255,0), rgba(0,0,0,0.15));
    background-image:linear-gradient(to right, rgba(255,255,255,0),rgba(0,0,0,0.15))
}
.page-title-bottom-inner:after{
    background-image:-webkit-gradient(linear, left top, right top, from(rgba(0,0,0,0.15)), to(rgba(255,255,255,0)));
    background-image:-webkit-linear-gradient(left, rgba(0,0,0,0.15), rgba(255,255,255,0));
    background-image:-moz-linear-gradient(left, rgba(0,0,0,0.15), rgba(255,255,255,0));
    background-image:-o-linear-gradient(left, rgba(0,0,0,0.15), rgba(255,255,255,0));
    background-image:linear-gradient(to right, rgba(0,0,0,0.15),rgba(255,255,255,0))
}
.page-title-bottom-inner2:before,.page-title-bottom-inner2:after{
    background-image:-webkit-gradient(linear, left top, left bottom, from(rgba(255,255,255,0)), to(#fff));
    background-image:-webkit-linear-gradient(top, rgba(255,255,255,0), #fff);
    background-image:-moz-linear-gradient(top, rgba(255,255,255,0), #fff);
    background-image:-o-linear-gradient(top, rgba(255,255,255,0), #fff);
    background-image:linear-gradient(to bottom, rgba(255,255,255,0),#ffffff);
    z-index:10
}
.page-title-breadcrumbs{
    position:relative;
    padding:8px 40px;
    border-bottom:1px solid transparent;
    z-index:20;
    color:dimgrey;
    background-color:#f9f9f9;
    border-color:#f1f1f1
}
.page-title-breadcrumbs ul{
    list-style-type:none;
    margin:0;
    padding:0
}
.page-title-breadcrumbs ul>li{
    list-style-type:none;
    margin:0;
    padding:0
}
.page-title-breadcrumbs ul>li:before{
    content:none;
    display:inline;
    position:inherit;
    top:auto;
    left:auto;
    width:auto;
    height:auto;
    background:none;
	color:#ffb617
}
.page-title-breadcrumbs ul>li{
    display:inline-block;
    padding:5px 10px 5px 0
}
.page-title-breadcrumbs ul>li:before{
    display:block;
    display:inline-block;
    font-family:FontAwesome;
    font-style:normal;
    font-weight:normal;
    line-height:1;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    content:'\f054';
    position:relative;
    top:1px;
    margin-right:10px;
    font-size:12px
}
.page-title-breadcrumbs ul>li:first-child:before{
    display:block;
    display:inline-block;
    font-family:FontAwesome;
    font-style:normal;
    font-weight:normal;
    line-height:1;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    content:'\f015';
    margin-right:5px;
    font-size:18px
}
.page-title-breadcrumbs ul>li:last-child{
    padding-right:0
}
.page-title-breadcrumbs a{
    color:dimgrey;
    border-color:transparent
}
.page-title-breadcrumbs a:hover{
    border-color:dimgrey
}
@media (max-width: 1299px){
    .page-title-bottom .container{
        width:auto
    }
    .page-title-bottom-inner{
        margin:-40px 0 10px 0;
    }
    .page-title-breadcrumbs{
        padding-right:20px;
        padding-left:20px
    }	
}
@media (max-width: 991px){
    .page-title-bottom .container{
        padding:0
    }
    .page-title-bottom-inner{
        margin:-40px 0 10px 0;
    }
    .page-title-bottom-inner:before,.page-title-bottom-inner:after,.page-title-bottom-inner2:before,.page-title-bottom-inner2:after{
        display:none
    }	
}


.alert{
    position:relative;
    padding:22px 20px 20px 60px;
    /*border:2px solid transparent*/
	border-radius: 5px;
}
.alert>.ico{
    position:absolute;
    top:22px;
    left:20px;
    font-size:24px
}
.alert.alert-warning{
  background-color: #f7a7a3;
  color:#8f130c;
  border-left: 5px solid #8f130c;
}
.alert.alert-success{
  background-color: #a8f0c6;
  color:#178344;
  border-left: 5px solid #178344;
}
.alert.alert-info{
    color:#265e88;
    background-color:#e1edf9;
	border-left: 5px solid #265e88;
}
.alert.alert-notification{
    color:#c88435;
    background-color:#fff4cf;
	border-left: 5px solid #c88435;
}

.checkbox-label {
    align-items: center;
    background-color: none;
    border: 1px solid lightgrey;
    border-radius: 5px;
    cursor: pointer;
    display: flex;
    font-weight: 600;
    justify-content: space-between;
    margin: 0 auto 10px;
    padding: 10px 20px 10px 70px;
    position: relative;
    transition: .3s ease all;
    width: 100%;
}
.checkbox-label span:last-child {
    padding: 0 0 0 20px;
}
.checkbox-label:hover {
    background-color: rgba(255,255,255,0.2);   
}
.checkbox-label:focus {
    outline: none;
}
.checkbox-label:before {
    background-repeat: no-repeat;
    background-position: center;
    background-size: 15px;
    border: 1px solid lightgrey;
    border-radius: 50%;
    content:'';
    height: 30px;
    left: 20px;
    position: absolute;
    top: calc(50% - 15px);
    transition: .3s ease background-color;
    width: 30px;
}
.checkbox-label:hover:before {
    background-image: 
        url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="23.571429" height="23.571429" viewBox="0.000000 -47.142857 23.571429 23.571429"><path fill="lightgrey" d="M23.571429 -36.964286L23.571429 -33.750000C23.571429 -33.303571 23.415179 -32.924107 23.102679 -32.611607C22.790179 -32.299107 22.410714 -32.142857 21.964286 -32.142857L15.000000 -32.142857L15.000000 -25.178571C15.000000 -24.732143 14.843750 -24.352679 14.531250 -24.040179C14.218750 -23.727679 13.839286 -23.571429 13.392857 -23.571429L10.178571 -23.571429C9.732143 -23.571429 9.352679 -23.727679 9.040179 -24.040179C8.727679 -24.352679 8.571429 -24.732143 8.571429 -25.178571L8.571429 -32.142857L1.607143 -32.142857C1.160714 -32.142857 0.781250 -32.299107 0.468750 -32.611607C0.156250 -32.924107 0.000000 -33.303571 0.000000 -33.750000L0.000000 -36.964286C0.000000 -37.410714 0.156250 -37.790179 0.468750 -38.102679C0.781250 -38.415179 1.160714 -38.571429 1.607143 -38.571429L8.571429 -38.571429L8.571429 -45.535714C8.571429 -45.982143 8.727679 -46.361607 9.040179 -46.674107C9.352679 -46.986607 9.732143 -47.142857 10.178571 -47.142857L13.392857 -47.142857C13.839286 -47.142857 14.218750 -46.986607 14.531250 -46.674107C14.843750 -46.361607 15.000000 -45.982143 15.000000 -45.535714L15.000000 -38.571429L21.964286 -38.571429C22.410714 -38.571429 22.790179 -38.415179 23.102679 -38.102679C23.415179 -37.790179 23.571429 -37.410714 23.571429 -36.964286ZM23.571429 -36.964286"></path></svg>');
}
.checkbox-label span {
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
}
.checkbox-label span em {
    display: block;
    /*font-style: normal;*/
    font-weight: normal;
    line-height: 1.2;
}
.checkbox-btn {
    position: absolute;
    visibility: hidden;
}
.checkbox-btn:checked + .checkbox-label {
    background-color: white;
    border-color: #ffb617;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
}
.checkbox-btn:checked + .checkbox-label:before {
    background-color: #ffb617;
    background-image: 
        url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="25.948661" height="19.888393" viewBox="2.025670 -40.011161 25.948661 19.888393"><path fill="white" d="M27.974330 -36.127232C27.974330 -35.680804 27.818080 -35.301339 27.505580 -34.988839L15.385045 -22.868304L13.108259 -20.591518C12.795759 -20.279018 12.416295 -20.122768 11.969866 -20.122768C11.523438 -20.122768 11.143973 -20.279018 10.831473 -20.591518L8.554688 -22.868304L2.494420 -28.928571C2.181920 -29.241071 2.025670 -29.620536 2.025670 -30.066964C2.025670 -30.513393 2.181920 -30.892857 2.494420 -31.205357L4.771205 -33.482143C5.083705 -33.794643 5.463170 -33.950893 5.909598 -33.950893C6.356027 -33.950893 6.735491 -33.794643 7.047991 -33.482143L11.969866 -28.543527L22.952009 -39.542411C23.264509 -39.854911 23.643973 -40.011161 24.090402 -40.011161C24.536830 -40.011161 24.916295 -39.854911 25.228795 -39.542411L27.505580 -37.265625C27.818080 -36.953125 27.974330 -36.573661 27.974330 -36.127232ZM27.974330 -36.127232"></path></svg>');
    border-color: #ffb617;
}

@media(max-width:480px) {
    .checkbox-label {
        align-items: flex-start;
        flex-direction: column;
        flex-wrap: wrap;
    }
    .checkbox-label span:last-child {
        padding: 10px 0 0 0;
    }
}
.input, .select select {
  padding: .5em;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  font: inherit;
  line-height: 1.3em;
  border: 1px solid #ffb617;
  border-radius: 3px;
  outline-width: 0;
  color: inherit;
}
.input:focus, .select select:focus {
  border-color: #ffb617;
}

.select select {
  padding-right: 1.5em;
  width: 100%;
}

.select {
  position: relative;
  display: inline-block;
}

.select:after {
  position: absolute;
  top: 0;
  right: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
  width: 1.9em;
  content: "\f078";
  font-family: fontawesome;
  pointer-events: none;
}
.copyIcon {color:#777;padding:2px; border-radius:3px; cursor:pointer}
.clipboard {position: relative;}
.copied::after {
  position: absolute;
  bottom: 100%;
  right: 40%;
  display: block;
  content: "Copied!";
  padding: 4px 6px;
  font-size:.9em;
  color: #fff;
  background-color: rgba(0,0,0,.8);
  border-radius: 3px;
  opacity: 0;
  will-animate: opacity, transform;
  animation: showcopied 1.5s ease;
}

@keyframes showcopied {
  0% {
    opacity: 0;
    transform: translateY(100%);
  }
  70% {
    opacity: 1;
    transform: translateX(0);
  }
  100% {
    opacity: 0;
  }
}



.c-feature{
    position:relative;
	background:
    linear-gradient(to right, #ffb617 1px, transparent 1px) 0 0,
    linear-gradient(to right, #ffb617 1px, transparent 1px) 0 100%,
    linear-gradient(to left, #ffb617 1px, transparent 1px) 100% 0,
    linear-gradient(to left, #ffb617 1px, transparent 1px) 100% 100%,
    linear-gradient(to bottom, #ffb617 1px, transparent 1px) 0 0,
    linear-gradient(to bottom, #ffb617 1px, transparent 1px) 100% 0,
    linear-gradient(to top, #ffb617 1px, transparent 1px) 0 100%,
	linear-gradient(to top, #ffb617 1px, transparent 1px) 100% 100%;

	background-repeat: no-repeat;
	background-size: 25px 20px;
	padding:10px 5px 5px 65px;
	margin-bottom:25px;
	

}
.c-feature:hover {
	background:
    linear-gradient(to right, #ffb617 2px, transparent 2px) 0 0,
    linear-gradient(to right, #ffb617 2px, transparent 2px) 0 100%,
    linear-gradient(to left, #ffb617 2px, transparent 2px) 100% 0,
    linear-gradient(to left, #ffb617 2px, transparent 2px) 100% 100%,
    linear-gradient(to bottom, #ffb617 2px, transparent 2px) 0 0,
    linear-gradient(to bottom, #ffb617 2px, transparent 2px) 100% 0,
    linear-gradient(to top, #ffb617 2px, transparent 2px) 0 100%,
	linear-gradient(to top, #ffb617 2px, transparent 2px) 100% 100%;

	background-repeat: no-repeat;
	background-size: 25px 20px;	
}
.c-feature .feature-icon{
    display:block;
    position:absolute;
    top:10px;
    left:10px;
	width:32px;
	height:32px;
}
.c-feature .feature-icon img{
	width:50px;
	height:50px;
}
.c-feature .feature-title{
    margin-bottom:5px;
	font-size:1.5em;
	color:#111;
	font-family:"Exo 2",Arial,sans-serif;
}
/*.c-feature .feature-title a{
	border-bottom:1px solid #ffb617;
}*/
.c-feature .feature-title a:hover{
	text-decoration:none;
	border-bottom:2px solid #ffb617;
}