button.btn-start,
button.btn-signup,
button.btn-signin {
    overflow: hidden;
}

button.btn-start:focus,
button.btn-signup:focus,
button.btn-signin:focus {outline:0 !important;}

.ripple-effect {
    background: radial-gradient(circle, rgba(0, 0, 0, 0), #fff);
    transform: translate(-50%, -50%);
    border-radius: 100%;
}


@font-face{
	font-family: proxibold;
	src: url(../fonts/proxi-semibold.otf);
}
@font-face{
	font-family: proxibolde;
	src: url(../fonts/proxi-bold.otf);
}

@font-face{
	font-family: proxi;
	src: url(../fonts/proxi-regular.otf);
}
body{
	font-family: proxi;
}
.nav-new{
	background: rgba(76,45,162,1);
	/*background: rgba(0,0,0,0.01);*/
	border: none;
	height:90px;
	padding-top: 20px;

}
header{
	width: 100%;
	height: 768px;
	background-image: url(../img/old_bg.jpg);
}
.navbar-brand{
	font-family: proxibold;
	font-size: 20px;
}
.navbar-inverse .navbar-brand{
	color: #fff;
}
.navbar-inverse .navbar-nav li a{

	background: rgba(76,45,162,1);
	color:#fff;
	font-size: 14px;
	font-family: proxibold;
}
.btn-signin{
	width: 108px;
	height: 38px;
	border-radius: 60px;
	background: #ec3c62;
	border: none;
	margin-top: -10px;
}
.title{
	margin-top: 80px;
	color:#fff;
	font-family: proxibolde;
	font-size: 40px;
}
.capt{
	margin-top: 40px;
	color:#fff;
	font-size: 16px;
}
.btn-signup {
	width: 201px;
	height: 62px;
	border-radius: 60px;
	background: #ec3c62;
	border: none;
	margin-top: -10px;
	font-size: 16px;
	color: #fff;
	font-family: proxibold;
	margin-top: 25px;
}
.btn-signup:disabled {
	background: #666;
	color: #aaa;
}
.anim{
	margin-top: 55px;
}
.benefits{
	width: 100%;
	height: 950px;
	background: #FFF;
}
.benefits h1{
	color: #5031a9;
	font-size: 40px;
	font-family: proxibold;
	margin:100px;
	margin-bottom: 80px;
}
.benefits h2{
	color:#635e74;
	font-size: 24px;
	font-family: proxibold;
	line-height: 180%;

}
.benefits p{
	color: #8d8a94;
	font-size: 16px;
	line-height: 200%
}
.benim{
	margin-right: 50px;
	padding-top: 40px;
}
.benefits a{
	color: #5031a9;
	padding-top: 20px;
}
.drawbacks{
	width: 100%;
	background: #FFF;
}
.drawbacks h1 {
	color: #5031a9;
	font-size: 40px;
	font-family: proxibold;
	margin-bottom: 80px;
}
.drawbacks h2{
	color:#635e74;
	font-size: 24px;
	font-family: proxibold;

}
.drawbacks p{
	width: 90%;
	color: #8d8a94;
	font-size: 16px;
	line-height: 200%
}
.profile{
	width: 100%;
	height: 551px;
}

.col-h {
	min-height: 470px !important;
}

.col1 {
	background: #5031a9;
}
.col2 {
	background: #2f1b69;
}
.name {
	text-align: center;
}

.grade {
	text-align: center;
}
@media(max-width: 766px) {
	.people {
		display: block;
		margin: 0 auto;
		width: 100%;
	}
	.foto {
		margin: 0 auto;
		display: block;
		margin-top: 65px;
	}
	.name {
		margin-top: 30px;
	}
}

@media(min-width: 992px) and (max-width: 1101px) {
	.smaller-nav {
		width: 180px;
		margin-top: 10px;
	}
}


@media(max-width: 1091px) {
	.name {
		text-align: center;
		margin-top: 30px;
	}
}

@media(min-width: 767px) {
	.col1{
		width: 50%;
		height: 100%;

		float: left;
		overflow: hidden;
	}
	.col2{
		width: 50%;
		height: 100%;
		float: right;
		overflow: hidden;
	}
	.col1-inversed{
		background: #2f1b69 !important;
		float: right;
		overflow: hidden;
	}
	.col2-inversed{
		background: #5031a9 !important;
		float: left;
		overflow: hidden;
	}
}
.people{
	float: left;
	width: 100%;
}
.name,.grade{
	color:#fff;
	font-size: 24px;
	font-family: proxibold;
}

@media(max-width: 766px) {
	.fstyle {
		margin: 0 auto;
		display: block;
	}
}
.fstyle {
	height: 250px;
	width: 250px;
	border-radius: 0;
	margin: 0 auto;
	margin-top: 80px;
	display: block;
}
/*@media(min-width: 767px) {*/

	/*.fstyle{*/
		/*width: 89px;*/
		/*height: 89px;*/
		/*border-radius:50%;*/
		/*margin-right: 30px;*/
		/*margin-left: 100px;*/
		/*margin-top: 48px;*/
	/*}*/

/*}*/


.col1 p {
	margin-top: 60px;
	color:#fff;
	font-size: 16px;
	line-height: 200%;
}
.col2 p{
	margin-top: 60px;
	margin-left: 20px;
	font-size: 16px;
	line-height: 200%;
}
@media(min-width: 767px) and (max-width: 1199px) {
	.col1 p, .col2 p {
		margin-left: 15px;
		margin-right: 15px;
	}
}
@media(min-width: 1200px) {
	.col1 p, .col2 p {
		margin-left: 30px;
		margin-right: 30px;
	}
}
@media(max-width: 766px) {
	.col1 p,.col2 p {
		margin-left: 25px;
		margin-right: 25px;
	}
}

.clear{
	clear: both;
}

.exlusive h1, .testi h1 {
	color: #5031a9;
	font-size: 40px;
	font-family: proxibold;
	margin-bottom: 80px;
	margin-top: 90px;
}

.icon{
	margin-right: 80px;
	margin-top: 30px;
}
.icon2{
	margin-left: 30px;
	margin-top: 30px;
}
.box{
	width: 100%;
	height: 207px;
	box-shadow: 0px 5px 20px #CCCCCC;
	overflow: hidden;
}
.box2{
	width: 90%;
	height: 207px;
	box-shadow: 0px 5px 20px #ccc;
	overflow: hidden;
}
.exlusive h2{
	color:#635e74;
	font-size: 24px;
	font-family: proxibold;
	line-height: 180%;
	margin-left: 30px;
}
.exlusive p{
	width: 40%;
	color: #8d8a94;
	font-size: 16px;
	line-height: 200%;
	margin-left:30px;
}
.exlusive .left{
	width: 35%;
	color: #8d8a94;
	font-size: 16px;
	line-height: 200%;
	margin-left:30px;
}
.dis{
	padding-top: 80px;
}
.disa{
	padding-top: 80px;
}
.content{
	width: 100%;
	min-height: 700px;
	padding-bottom: 100px;
	background: #f7f7f7;
	margin-top: 150px;
}

.content h1 {
	color: #5031a9;
	font-size: 40px;
	font-family: proxibold;
	margin-bottom: 80px;
	padding-top: 90px;
}
.content span{
	color: #666272;
	font-size: 16px;
	margin-left: 20px;
}
.boxnya{
	width: 100%;
	min-height: 207px;
	box-shadow: 0px 5px 20px #ccc;
	overflow: hidden;
	margin-top: 40px;
	padding-top: 20px;
}
.boxnya h2{
	color: #666272;
	font-family: proxibolde;
	font-size: 18px;
	margin-bottom: 40px;
}
.spec{
	width: 83%;
}
.list span{
	color: #8e899d;
	font-size: 16px;
}
.list .icons{
	width: 50px;
	float: left;
	padding-bottom: 30px;
	margin-right: 10px;
}
.teks{
	color: #8e899d;
	font-size: 16px;
}
.list{
	margin-bottom: 40px;
}
.get{
	padding-top: 100px;
	padding-bottom: 600px;
}
.get h2{
	font-family: proxibold;
	font-size: 24px;
	color: #6c6877;
	margin-left: 150px;
	margin-bottom: 40px;
}
.get ul li{
	color: #8e8a98;
	font-size: 16px;
	margin-bottom: 10px;

}
.get ul{

	width: 50%;
	margin-left: 80px;
}
.ssd{
	margin-top: 80px;
	margin-left: 50px;
}
.bar{
	margin-left: 90px;
	box-shadow: 0px 5px 20px #CCCCCC;
}
.boxtesti{
	width: 100%;
	height: 262px;
	box-shadow: 0px 5px 20px #ccc;
	overflow: hidden;
	margin-top: 40px;
	padding-top: 20px;
	background: #fff;
	border-radius: 5px;
}
.pp{
	width: 52px;
	height: 52px;
	border-radius: 50%;
	overflow: hidden;
	margin-left: 50px;
	margin-top: 20px;
	float: left;
	margin-right: 20px;
}
.testi .name{
	color:#6f6a7c;
	font-size: 18px;
	margin-top: 20px;
}
.testi .grade{
	color:#6f6a7c;
	font-size: 16px;
}
.testi .teks{
	width: 70%;
	margin: 0 auto;
	margin-left: 120px;
	margin-top: 20px;
	line-height: 180%;
}
.bg2{
	width: 100%;
	height: 200px;
	background-image: url(../img/icon/bg2.png);
	margin-top: -150px;
}

.subs{
	width: 100%;
	height: 385px;
	background: #5031a9;
}
.subs h2{
	color: #fff;
	font-family: proxibold;
	font-size: 24px;
	padding-top: 100px;
	margin-top: 0;
}
.subs p{
	color: #fff;
	font-size: 16px;
	margin-top: 20px;
	line-height: 180%;
}
.subs .email{
	width: 50%;
	height: 64px;
	border-radius: 10px;
	border: none;
	padding-left: 30px;
	outline: none;
	margin-top: 20px;
}
.subemail{
	border: none;
	background: #fff;
	border-radius: 10px;
	color: #9426d5;
	font-size:25px;
	margin-left: -50px;
}
footer{
	background: #21264D;
	width: 100%;
	height: 100%;
}

.conta{
	width: 50%;
	margin: 0 auto;
	padding-top: 30px;
	color: #465099;
}
.conta p{
	color: #fff;
}
.conta ul li a{
	color: #465099;
	font-family: proxibold;
}
.conta ul {
 	list-style: none;
 	padding-left: 0;
}
.conta hr{
	background: #465099;
}



@media (max-width: 640px) {
	.conta {
		width: 80%;
	}
	footer {
		min-height: 340px;
	}
	footer li {
		margin-bottom:5px;
	}
	.subs .email {
		width: 80%;
	}
	.get {
		padding-bottom: 50px;
	}
	.col-md-6 .ssd,
        .col-md-6 button {
            margin-left: 0;
        }
    nav {
    	z-index: 999;
    }
    .testi .teks {
    	margin-left: 20px;
    }
    .boxtesti {
    	height: 320px;
    }
	.triage {
	    padding: 5px;
		overflow-wrap: break-word;
		word-wrap: break-word;
		-ms-word-break: break-all;
		word-break: break-all;
		word-break: break-word;
		-ms-hyphens: auto;
		-moz-hyphens: auto;
		-webkit-hyphens: auto;
		hyphens: auto;
	}
	.triage .pp{
		display:none;
	}
}

form#billing .has-error .form-control {
	border-width: 2px; /* Default bootstrap is 1px, not strong enough */
}
.bg{
  width: 100%;
  min-height: 20px;
  padding-top: 20px;
  padding-bottom: 20px;
  margin-bottom: 20px;
  background-color: #fff;
}
.lal{
	width: 33%;
	float: left;
}



/* Base for label styling */
.lal [type="checkbox"]:not(:checked),
.lal [type="checkbox"]:checked {
  position: absolute;
  left: -9999px;
}
.lal [type="checkbox"]:not(:checked) + label,
.lal [type="checkbox"]:checked + label {
  position: relative;
  padding-left: 1.95em;
  cursor: pointer;
}

/* checkbox aspect */
.lal [type="checkbox"]:not(:checked) + label:before,
.lal [type="checkbox"]:checked + label:before {
  content: '';
  position: absolute;
  left: 0; top: 0;
  width: 1.25em; height: 1.25em;
  background: #4c2da2;
  border-radius: 4px;
  box-shadow: inset 0 1px 3px rgba(0,0,0,.1);
}
/* checked mark aspect */
.lal [type="checkbox"]:not(:checked) + label:after,
.lal [type="checkbox"]:checked + label:after {
  content: '✔';
  position: absolute;
  top: .1em; left: 0em;
  font-size: 1.3em;
  line-height: 0.8;
  color: #fff;
  transition: all .2s;
}
/* checked mark aspect changes */
.lal [type="checkbox"]:not(:checked) + label:after {
  opacity: 0;
  transform: scale(0);
}
.lal [type="checkbox"]:checked + label:after {
  opacity: 1;
  transform: scale(1);
}
/* disabled checkbox */
.lal [type="checkbox"]:disabled:not(:checked) + label:before,
.lal [type="checkbox"]:disabled:checked + label:before {
  box-shadow: none;
  border-color: #bbb;
  background-color: #ddd;
}
.lal [type="checkbox"]:disabled:checked + label:after {
  color: #999;
}
.lal [type="checkbox"]:disabled + label {
  color: #aaa;
}
/* accessibility */
.lal [type="checkbox"]:checked:focus + label:before,
.lal [type="checkbox"]:not(:checked):focus + label:before {

}

/* hover style just for information */
label:hover:before {
  border: 2px solid #4778d9!important;
}
.ceks{
  font-size: 14px;
}

.kolomcek{
	margin-bottom: 30px;
}




/* price */
.boxprice{
	border:1px solid #fff;
	height: 563px;
	margin-top: 90px;
	width: 21%;
	margin-right: 40px;
	padding: 0;
}
.title-price{
	background: #0e062f;
	height: 45px;
	border-bottom: 1px solid #fff;
	color: #fff;
}
.title-text{
	font-size: 18px;
	padding-top: 8px;
}
.kanan{
	margin-right: 0;
}
.amount-price{
	background: #0e062f;
	height: 158px;
	border-bottom: 1px solid #fff;
	color: #fff;
	padding-top: 20px;
}
.dollar{
	font-size: 18px;
	font-family: proxibold;
	padding: -200px;
	position: relative;
	top: -10px;
}
.amount{
	font-family: proxibold;
	font-size: 30px;
}
.desc-price{
	width: 60%;
	line-height: 20px;
	font-size: 14px;
	margin-top: 15px;
	margin-bottom: 15px;
}
.custom{
	background: #b29bc9;
	border: 1px solid #b29bc9;
	color :#fff;
	width: 80%;
	height: 50px;
	border-radius: 50px;
	font-size: 18px;
	box-shadow: 0px 5px 20px #f1f1f1;
}
.feature{
	background: #fff;
	width: 100%;
	height: 360px;
	padding-top: 40px;
}
.feature-list{
	list-style: none;
	color: #a8abba;
	font-size: 12px !important;
	margin-bottom: 10px !important;
}
.user{
	color: #7b7e8d;
	font-size: 18px;
	padding-bottom: 20px;
}
/* end of price section*/

footer .conta ul li a,
footer p, footer, footer div, footer a {
	color: white;
}
footer p {
	text-decoration: underline;
}
footer span {
	color: #337ab7;
}




/* KSSM */
#projects {
	margin-top: 20px;
}
.active-jobs {
	background-color: #f6fafc;
}

.active-project {
	background-color: #fff;
	min-height: 90px;
	margin-bottom: 20px;
	box-shadow: 1px 1px 1px #c9c9c9;
}
.project-title {
	margin-top: 10px;
	width: 100%;
	display:table;
	height: 70px;
}
.project-title-inner {
	display:table-cell;
	vertical-align:middle;
	text-align: center;
	font-size: 22px;
	font-family: proxibold;
}
.user-thumbnail {
	height: 65px;
	display: block;
	margin-top: 13px;
}

.user-name {
	margin-top: 23px;
	font-size: 17px;
	color: #333;
}
.user-title {
	color: #bab9b9;
}