body,html{height:100%;background:#e4e4e8;}
body {  overflow-y: hidden;
    overflow-x: hidden;}
	.getC {text-align:center;font-family:Raleway,sans-serif;color:#606777;padding:10px 0px}
	.getC img{display:block;margin:0px auto;width:25px}
.wrapper {height:100%;width:100%;}
.nav {width:240px;background:#2b303b;height:100%;position:fixed;left:0px;top:0px;z-index:10}
.nav-profil {width:180px;margin:42px auto;}
.nav-profil-img {padding:5px;background:#393f4c}
.nav-profil .img-wrap {padding:5px;background:#2b303b;}
.nav-profil .img-wrap img {opacity:0.5}
.profil-name {line-height:28px;margin-top:10px;font-family:Raleway,sans-serif;text-align:center;color:#71798c;}
.profil-name h3 {font-size:17px;font-weight:300}
.profil-name p {font-size:13px;position:relative;}
.profil-name p i {position:absolute;top:7px;left:20px;}
.cizgi {width:100px;background:#404652;height:1px;margin:20px auto}
.active-nav {color:#fff !important}
.nav-menu {width:100%;overflow:auto;height:230px;}
.nav-menu ul li a {font-size: 13px;
	position:relative;
    font-weight: 400;
    line-height: 40px;
	display:block;
	margin-top:5px;
	padding:0px 20px;
    font-family: 'Montserrat',sans-serif;color:#788195;
	-webkit-transition: all .2s ease;
    -moz-transition: all .2s ease;
    -o-transition: all .2s ease;
    transition: all .2s ease;
	}
.nav-img {background:#21252d;position:absolute;right:15px;display:block;top:0px;font-size:16px;width:40px;height:40px}
.nav-img i {margin:10px;font-size:21px}
.nav-menu ul li a:hover {color:#fff;}
.nav-menu ul li a:hover .nav-img{background:#788195;color:#2b303b}


.active-nav .nav-img{background:#81b71a;color:#fff}


.clear {clear:both}
.container {width:100%;height:99%;position:absolute;left:240px;right:0px;}
.h-top {box-shadow:1px 1px 5px #c5c5c9;width:100%;position:fixed;left:240px;background:#f5f5f7}
.h-top a{display:inline-block;padding:15px;border-right:1px solid #dfdfdf;color:#788195;font-size:15px}
.height {height:45px}
.box-cont {width:4010px;height:95%;overflow:scroll}
.box {overflow:auto;position:relative;width:490px;height:95%;background:#f2f2f4;float:left;margin:10px;box-shadow:1px 1px 8px #c5c5c9}
.type {position:absolute;right:4px;top:4px;width:40px;height:40px;background:#21252d;color:#858ea1;font-size:24px;}
.type-hover {background:#81b71a;color:#fff}
.type i {display:block;text-align:center;margin-top:7px}
.box-item {width:440px;margin:70px auto;}
.box-title h3 {position:relative;font-family:montserrat,sans-serif;font-size:17px;color:#6d7482;font-weight:300;letter-spacing:2px;line-height:19px}
.box-title h3:after {content:'';left:0px;top:30px;position:absolute;width:17px;height:2px ;background:#81b71a} 
.box-data {margin-top:40px;}
#box-title {position:relative;font-family:montserrat,sans-serif;font-size:12px;font-weight:400;color:#606777;display:inline-block}
#box-title:after {content:'';position:absolute;right:-12px;top:6px;width:10px;height:10px;border-style:solid;border-width:0px 2px 2px 0px}
.item-cont{width:440px;height:267px;position:relative;margin-top:15px}
.item {width:440px;height:267px;position:relative;background:url(../images/cover.jpg);background-size:cover;margin-top:15px}
.hover {position:absolute;width:440px;height:267px;background:#2b303b;opacity:0.7;left:0px;top:0px;}
.detail {margin-top:50px}
.line {margin-left:10px;margin-bottom:10px;width:230px;height:30px;background:rgba(0,0,0,0.3);font-weight:600;font-family:raleway,sans-serif;color:#a4a4a5;font-size:13px}
.line span {float:left;height:30px;width:25px;background:#000;display:block;font-size:15px;padding-right:5px;background:}
.line p {text-indent:5px;float:left;line-height:30px}
.line i {margin-left:8px;line-height:30px}
.tabs-wrapper {}
.tabs {float:left}
.myTabs p{font-family:Raleway;font-size:13px;color:#606777;line-height:24px;text-align:justify}
.tabs-cont {word-wrap:break-word;float:left;width:325px;padding:10px;background:#f6f6f8;border:1px solid #dbdbe0;margin:3px 5px}
.tabs ul li  {border:1px solid #eee ;margin:3px 0px;display:block;cursor:pointer;height:20px;line-height:20px;background:#81B71A;font-family:Montserrat,sans-serif;font-size:11px; color: rgba(255, 255, 255, 0.82);padding:7px 15px;text-align:center}
.tabs-cont h3 {font-family:Montserrat,sans-serif;color:#727887;font-size:13px}
.tabs-cont span {font-family:Montserrat,sans-serif;color:#81B71A;font-size:11px;display:inline-block;margin:5px 0px 20px 0px}
.tabs ul li.tab-active {border:1px solid #eee ;background:#fff;color:#858998;}
.hobiler {color:#606777}
.icon {padding:20px 20px 10px 0px;float:left;font-size:50px;font-family:raleway,sans-serif;line-height:71px;}
.hobi {width:250px;text-align:justify;float:left;font-size:13px;font-family:raleway,sans-serif;line-height:24px;}
.p-box {margin-bottom:20px;text-align:center;width:132px;float:left;float:left;color:#606777;padding:0px 15px}
.f-icon {font-size:60px;font-family:raleway,sans-serif;line-height:86px;}
.f-number {font-size:30px;font-family:raleway,sans-serif;line-height:46px;}
.f-desc {font-size:12px;font-family:raleway,sans-serif;line-height:17px;text-transform:uppercase}
.list {float:right;}
.list .a-z{text-align:center;width:40px;height:40px;float:left;cursor:pointer;padding:10px;-webkit-box-sizing:border-box;box-sizing:border-box;border:1px solid #caccd4;color:#606777}
.list-active {}
.list span.desc {border-left:none}
.blog-plus {transition:color .3s ease;transition:background-color .3s ease;border:1px solid #DBDBE0;font-size:16px;line-height:16px;cursor:pointer;position:absolute;right:0px;top:0px;padding:5px 8px;}
.blog-plus:hover {background:#81B71A;color:#fff}
.blog-box {width:100%;height:217px;border:1px solid #dbdbe0;margin:10px 0px;padding:10px;font-size:13px;position:relative;font-family:Raleway,sans-serif;line-height:24px;color:#606777;box-sizing:border-box;-webkit-box-sizing:border-box}
.blog-date {width:80px;height:124px;float:left;}
.blog-date-day {width:100%;height:65px;text-align:center;color:rgba(255, 255, 255, 0.82);background:#81b71a;font-family:Raleway,sans-serif;}
.blog-date-time {width:100%;padding:5px 0px;text-align:center;color:rgba(255, 255, 255, 0.82);background:#709f17;font-family:Raleway,sans-serif;}
.blog-date-day h3 {font-weight:200;font-size:40px;line-height:40px;text-transform:uppercase;}
.blog-date-day p {font-weight:500;font-size:16px;line-height:23px;}
.blog-date-time p {font-weight:300;font-size:13px;line-height:17px;text-transform:uppercase;}
.blog-desc {float:left;width:78%;-webkit-box-sizing:border-box;box-sizing:border-box;padding:0px 10px;height:170px;margin-bottom:4px;margin-left:10px;border-left:1px solid #dbdbe0;}
.blog-title h3 {padding:0px;margin:0px;font-family:Montserrat,sans-serif;color:#606777;font-weight:500;font-size:11px;line-height:13px}
.blog-title span {font-size:10px;font-weight:500;font-family:Raleway,sans-serif;line-height:11px;color:#97c343;display:block;margin:5px 0px}
.blog-desc .blog-text p {word-wrap:break-word;text-align:justify;}
.blog-footer {width:100%;height:20px;box-sizing:border-box;border-top:1px solid #ced7e2}
.blog-footer p {font-family:raleway,sans-serif;font-size:12px;line-height:28px;float:right}
.b-cat {float:left;font-size:9px;font-family:raleway,sans-serif;line-height:9px;color:#fff;}
.b-cat li {float:left;display:block;padding:3px 6px;margin:7px 1px;background:#2b303b;}
.team {transform-style: preserve-3d;
    transition: all 1.0s linear;width:220px;height:300px;position:relative;float:left;margin:2px}
.team-img1 {background:url(../images/team/team1.jpg);width:220px;height:300px}
.team-detail {position:absolute;left:10px;bottom:10px}
.imghover {background:#2b303b;width:220px;height:300px;opacity:0.7}
.team-detail p{line-height:21px;font-family:raleway,sans-serif;font-size:12px;color:#fff;text-transform:uppercase;}
.team-detail span {font-family:raleway,sans-serif;font-size:13px;color:#81b71a;text-transform:uppercase;}
.team-back p{font-family:raleway,sans-serif;font-size:13px;line-height:24px;color:#606777;}
.skil-cont {margin:20px 0px;color:rgba(255, 255, 255, 0.82);width:100%;border:1px solid #dbdbe0;padding:10px;box-sizing:border-box;background:#f6f6f8;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;}
.skil {background:#81b71a;width:100%;padding:10px;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;}
.skil-detail {background:#709f17;color:#fff;width:50px;height:50px;float:left;text-align:center;font-family:raleway,sans-serif}
.skil-detail p {color:rgba(255, 255, 255, 0.82);font-size:18px;line-height:50px;font-weight:300;}
.skil-desc {float:left;width:340px;margin-left:5px;height:50px}
.skil-desc ul li {font-family:raleway,sans-serif;font-size:11px;margin-right:10px;line-height:16px;float:left;}
.skil-desc ul li i {margin-right:3px;}
.progress {width:340px;height:2px;background:#709f17;margin:10px 0px}
.progres {width:60%;height:2px;background:#f0ffd4;}
.language ul li {float:left;display:block;margin:0px 2px !important;font-family:raleway,sans-serif;font-size:10px;line-height:10px;color:#f0ffd4;background:#709f17;padding:2px 4px}
.proje-cont {width:100%}
.proje {overflow:hidden;cursor:pointer;position:relative;width:220px;height:220px;float:left;margin-right:3px;margin-bottom:3px;}
.proje-hover {display:none;cursor:pointer;background:rgba(0,0,0,0.5);width:220px;height:220px;position:absolute;left:0px;top:0px}
.p-title {text-align:center;margin-top:60px}
.p-title h3 {font-family:Montserrat,sans-serif;font-size:13px;letter-spacing:3px;line-height:14px;color:#fff;font-weight:300}
.search {width:40px;margin:20px auto;height:40px;border:1px solid #fff;border-radius:100%;}
.search a {font-size:15px;line-height:15px;color:#fff;display:block;width:40px;height:40px;}
.search a i {margin-top:12px}
.message {text-align:center;}
.message h2 {font-family:Montserrat,sans-serif;font-size:22px;line-height:24px;color:#81b71a;font-weight:200}
.message p {margin-bottom:7px;font-family:Montserrat,sans-serif;font-size:13px;line-height:14px;color:#606777;text-transform:uppercase;}
.message span{font-family:Raleway,sans-serif;font-size:13px;line-height:14px;color:#606777;}
.m-cont {padding:10px 0px}
.c-form input[type=text],textarea {transition:border-color 0.4s ease;resize:none;width:100%;margin-bottom:5px;padding:15px 10px;background:#f6f6f8;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;color:#606777;font-family:Montserrat,sans-serif;font-size:12px;font-weight:300;outline:0;border:1px solid #dbdbe0;text-transform:uppercase;}
.c-form button {transition:color 0.3s ease-in;padding:0px 15px;color:#6c7381;border:1px solid #c9ccd4;outline:0;cursor:pointer;font-family:Montserrat,sans-serif;font-size:11px;line-height:38px;background:#f2f2f4;display:block;margin:0px auto}
.c-form button:hover {color:#8abc2c;border:1px solid #81b71a}
.c-form input:focus {border:1px solid #81b71a}
.c-form textarea:focus {border:1px solid #81b71a}
@-webkit-keyframes animation-bt {
  0% {
    -webkit-transform: translate(0, 20%);
    opacity: 0;
    
  }
  100% {
    -webkit-transform: translate(0, 0);
    opacity: 1;
  }

}

@-moz-keyframes animation-bt {
  0% {
    -moz-transform: translate(0, 20%);
    opacity: 0;
  }
  100% {
    -moz-transform: translate(0, 0);
    opacity: 1;
  }
}

@-o-keyframes animation-bt {
  0% {
    -o-transform: translate(0, 20%);
    opacity: 0;
  }
  100% {
    -o-transform: translate(0, 0);
    opacity: 1;
  }
}

@keyframes animation-bt {
  0% {
    transform: translate(0, 20%);
    opacity: 0;
  }
  100% {
    transform: translate(0, 0);
    opacity: 1;
  }
}

.blog-modal {
  -webkit-animation: animation-bt 1s 1 ease; /* Safari 4+ */
  -moz-animation: animation-bt 1s 1 ease; /* Fx 5+ */
  -o-animation: animation-bt 1s 1 ease; /* Opera 12+ */
  animation: animation-bt 1s 1 ease; /* IE 10+ */
  opacity: 1;
  position:absolute;
  width:500px;
  padding:10px;
  box-sizing:border-box;
  -webkit-box-sizing:border-box;
  -moz-box-sizing:border-box;
  background:#fff;
  left:50%;
  margin-left:-250px;
  margin-top:46px
}.proje-modal {
  -webkit-animation: animation-bt 1s 1 ease; /* Safari 4+ */
  -moz-animation: animation-bt 1s 1 ease; /* Fx 5+ */
  -o-animation: animation-bt 1s 1 ease; /* Opera 12+ */
  animation: animation-bt 1s 1 ease; /* IE 10+ */
  opacity: 1;
  position:relative;
  width:908px;
  padding:20px;
  box-sizing:border-box;
  -webkit-box-sizing:border-box;
  -moz-box-sizing:border-box;
  background:#fff;
  margin:46px auto;
 display:none;  
}
.proje-img {float:left;width:420px;height:420px;}
.proje-desc {color:#606777;margin-left:10px;width:438px;text-align:justify;float:left}
.proje-desc h3{margin-bottom:10px;font-weight:300;font-family:Montserrat,sans-serif;font-size:18px;line-height:21px;}
.proje-desc p{font-family:Raleway,sans-serif;font-size:13px;line-height:24px;}
.blog-modal {position:relative;display:none}
.close {position:absolute;right:14px;top:14px;cursor:pointer;color:#606777;}
.bg-hover { display:none;  background:rgba(0,0,0,0.5);position:fixed;left:0px;top:0px;bottom:0px;right:0px;z-index:100}
.blog-info {margin-top:20px}
.blog-info h3{font-family:Montserrat,sans-serif;font-weight:300;font-size:13px;line-height:21px;color:#606777}
.b-p {margin-top:10px}
.b-p p {font-family:Raleway,sans-serif;font-size:13px;line-height:24px;color:#606777}

.loader{
  display: block;
  width: 100%;
  height: 100vh;
  background: #2c3e50;
  position: fixed;
  z-index: 99;
  top: 0;
  left: 0
}
.spinner {
  width: 40px;
  height: 40px;
  background-color: #fff;
  -webkit-animation: rotateplane 1.2s infinite ease-in-out;
  animation: rotateplane 1.2s infinite ease-in-out;
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: -20px;
  margin-left: -20px;
}

@-webkit-keyframes rotateplane {
  0% { -webkit-transform: perspective(120px) }
  50% { -webkit-transform: perspective(120px) rotateY(180deg) }
  100% { -webkit-transform: perspective(120px) rotateY(180deg)  rotateX(180deg) }
}

@keyframes rotateplane {
  0% { 
    transform: perspective(120px) rotateX(0deg) rotateY(0deg);
    -webkit-transform: perspective(120px) rotateX(0deg) rotateY(0deg) 
  } 50% { 
    transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);
    -webkit-transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg) 
  } 100% { 
    transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
    -webkit-transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
  }
}