/*
Author       : theme_ocean
Template Name: Anushka - Personal Portfolio Template
Version      : 1.0
*/
/*=============================================================
    CSS INDEX
    =============================
    01. GENERAL STYLE (body, link color, section-title, preloader btn, overlay, section-padding etc)
    02. START BOOTSTRAP NAVIGATION OVERRIDES
    03. START HOMEPAGE CSS STYLE
    04. START ABOUT CSS STYLE
    05. START SERVICE CSS STYLE
    06. START FUNFACT CSS STYLE
    07. START PORTFILIO PAGE DESIGN
    08. START RESUME PAGE DESIGN
    09. START TEAM DESIGN
    10. START BLOG PAGE DESIGN
    11. START CONTACT DESIGN
    12. START FOOTER DESIGN
    13. START SECTION TOP DESIGN
  =============================================================*/
/*
* ----------------------------------------------------------------------------------------
* 01.GENERAL STYLE
* ----------------------------------------------------------------------------------------
*/
body {
color:#484848;
font-family: 'Zilla Slab', serif;
font-size: 18px;
font-weight: 400;
line-height: 26px;
background:#fff;
overflow-x:hidden;
background-size: cover;
}


html,
body { height: 100%;position:relative;  }
h1,
h2,
h3,
h4,
h5,
h6 {
  letter-spacing: 0px;
  margin-top: 0px;
  font-family: 'Zilla Slab', serif;
  color: #232434;
  font-weight: 400;
}
a {
	 font-family: 'Zilla Slab', serif;
    text-decoration: none;
    -webkit-transition: all 0.2s;
    -o-transition: all 0.2s;
    transition: all 0.2s;
}
a:hover {
    color: #fff;
    text-decoration: none;
}
a:focus {
    outline: none;
    text-decoration: none;
}

p {
  margin-bottom: 0;
}
ul,
li {
    margin: 0;
    padding: 0;
	list-style:none;
}
fieldset {
    border: 0 none;
    margin: 0 auto;
    padding: 0;
}
b, strong {
	font-weight: 600;
}
span{font-family: 'Zilla Slab', serif;}
/*START PRELOADER DESIGN*/
.preloader {
	background:#fff;
    bottom: 0;
    left: 0;
    position: fixed;
    right: 0;
    top: 0;
    z-index: 99999;	
}
.spinner {
	width: 50px;
	height: 50px;
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -25px 0 0 -25px;
	font-size: 10px;
	text-indent: -12345px;
	z-index: 10000;
}

.double-bounce1, .double-bounce2 {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background-color: #ffde67;
  opacity: 0.6;
  -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
  position: absolute;
  top: 0;
  left: 0;
  
  -webkit-animation: sk-bounce 2.0s infinite ease-in-out;
  animation: sk-bounce 2.0s infinite ease-in-out;
}

.double-bounce2 {
  -webkit-animation-delay: -1.0s;
  animation-delay: -1.0s;
}

@-webkit-keyframes sk-bounce {
  0%, 100% { -webkit-transform: scale(0.0) }
  50% { -webkit-transform: scale(1.0) }
}

@keyframes sk-bounce {
  0%, 100% { 
    transform: scale(0.0);
    -webkit-transform: scale(0.0);
  } 50% { 
    transform: scale(1.0);
    -webkit-transform: scale(1.0);
  }
}
.no-padding { padding: 0 }

::-moz-placeholder { 
  color: #fff;
}

/*END PRELOADER DESIGN*/
.section-padding { padding: 80px 0 }
/*START SECTION TITLE DESIGN*/
.section-title { margin-bottom:60px }
.section-title h1 {
	text-transform: capitalize;
	font-size: 40px;
	font-weight: 600;
}
h1.section-title-white{color:#fff;font-size: 40px;}
p.section-title-white{color:#fff;}
/*END SECTION TITLE DESIGN*/
/*START SCROLL TO TOP*/
.topcontrol {
background: #ffde67 none repeat scroll 0 0;
border-radius: 30px;
bottom: 5px;
-webkit-box-shadow: 0 1px 10px 0 rgba(0, 0, 0, 0.2);
        box-shadow: 0 1px 10px 0 rgba(0, 0, 0, 0.2);
color: #232434;
cursor: pointer;
font-size: 22px;
height: 50px;
line-height: 47px;
opacity: 1;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
position: fixed;
right: 5px;
text-align: center;
-webkit-transition: all 0.2s ease 0s;
-o-transition: all 0.2s ease 0s;
transition: all 0.2s ease 0s;
width: 50px;
}
@media only screen and (max-width:768px) { 
.topcontrol {display:none;}
}
.topcontrol:hover {
    background: #fff;
    color: #232434;
}
/*END SCROLL TO TOP*/

/*START BTN DESIGN*/
.btn_all {
	display: inline-block;
	vertical-align: middle;
	-webkit-transform: translateZ(0);
	transform: translateZ(0);
	box-shadow: 0 0 1px rgba(0, 0, 0, 0);
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	-moz-osx-font-smoothing: grayscale;
	position: relative;
	-webkit-transition-property: color;
	transition-property: color;
	-webkit-transition-duration: 0.3s;
	transition-duration: 0.3s;
	padding: 13px 38px;
	font-size: 16px;
	color: #232434;
	background: #ffde67;
	box-shadow: 0 10px 40px -10px rgba(0,64,128,.2);
	font-weight: 500;
}
.btn_all:before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: #f0c733;
  -webkit-transform: scaleY(0);
  transform: scaleY(0);
  -webkit-transform-origin: 50% 100%;
  transform-origin: 50% 100%;
  -webkit-transition-property: transform;
  transition-property: transform;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}
.btn_all:hover, .btn_all:focus, .btn_all:active {
  color: #fff;
}
.btn_all:hover:before, .btn_all:focus:before, .btn_all:active:before {
  -webkit-transform: scaleY(1);
  transform: scaleY(1);
}
/*END BTN DESIGN*/

/*START SOCIAL PROFILE CSS*/
.social_profile {
	position: fixed;
	top:30%;
	right:0;
}
@media only screen and (max-width:480px) { 
.social_profile {top:40%;}
}
.social_profile ul{
list-style: outside none none;
margin: 0;
padding: 0;
}
.social_profile ul li{display: inline;}
.social_profile ul li a {
	text-align: center;
	border: 0px;
	text-transform: uppercase;
	-webkit-transition: all 0.3s ease 0s;
	-o-transition: all 0.3s ease 0s;
	transition: all 0.3s ease 0s;
	margin-right: 10px;
	font-size: 16px;
	color: #fff;
	display: block;
	width: 40px;
	height: 40px;
	line-height: 40px;
	border-radius: 30px;
}
@media only screen and (max-width:880px) { 
.social_profile{display:none;}
}
.social_profile ul li a:hover{
color:#fff;
}
/*END SOCIAL PROFILE CSS*/
/*
* ----------------------------------------------------------------------------------------
* 01.END GENERAL STYLE
* ----------------------------------------------------------------------------------------
*/

/*
* ----------------------------------------------------------------------------------------
* 02.START BOOTSTRAP NAVIGATION OVERRIDES
* ----------------------------------------------------------------------------------------
*/
.site-logo img {
	width: 150px;
	height: auto;
	margin-top: 10px;
}
.bg-faded {
	background-color: transparent;
	-webkit-transition:all 0.5s ease 0s;
	transition: all 0.5s ease 0s;
}
.navbar-fixed {
    z-index: 999;
    position: fixed;
    opacity: .98;
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=98)";
    width: 100%;
	padding:10px 0;
    top: 0;
    -webkit-animation: fadeInDown 800ms;
    animation: fadeInDown 800ms;
    -webkit-backface-visibility: hidden;
    border-radius: 0px;
    background: #fff;
	box-shadow: 0 0 40px rgba(0, 0, 0, 0.07);
}
#navigation {
	padding: 10px 0;
	/* border-bottom: 1px solid #232434; */
	background-color: transparent;
}
#navigation.navbar-fixed {
	padding:10px 0;
	background:#fff;
	border-color: #fff;
}
.header_right {
	display: block;
	-ms-flex-preferred-size: auto;
	    flex-basis: auto;
}
#main-menu {

}
#main-menu ul{
	list-style-type: none;
	text-align: center;
}
#main-menu ul li{
	display: inline-block;
	margin-left:20px;
	position: relative;
}
#main-menu ul li a {
	color: #232434;
	font-weight: 500;
	text-transform: capitalize;
	-webkit-transition:.5s;
	transition: .5s;
	font-size: 18px;
	padding: 24px 0 26px;
	display: block;
}
#main-menu ul li a span {
	font-weight: bold;
	font-size: 12px;
}
@media only screen and (max-width: 880px){
#main-menu ul li a span{display: none;}
}
#navigation.navbar-fixed #main-menu ul li a{
	color: #232434;
	padding: 22px 0 22px;
}
#navigation.navbar-fixed #main-menu ul li a:hover,
#navigation.navbar-fixed #main-menu ul li a:focus,
#main-menu ul li a:hover,
#main-menu ul li a:focus{
	color: #232434;
}
#main-menu ul li > a:hover,
#main-menu ul li > a:focus{

	color: #ffde67;
}
#navigation #main-menu ul li a:hover,
#navigation #main-menu ul li a:focus,
#navigation.navbar-fixed #main-menu ul li a:hover,
#navigation.navbar-fixed #main-menu ul li a:focus{
}
#navigation.navbar-fixed #main-menu ul li a:hover,
#navigation.navbar-fixed #main-menu ul li a:focus{
	color: #ffde67;
}

.slicknav_menu {
	font-size: 16px;
	box-sizing: border-box;
	background: #fff;
	padding: 0px;
}
.slicknav_nav_icon{
	color: #6138bd;
	font-size: 24px;
}
#mobile_menu{
	display: none;
}
/* Responsive Design */
@media only screen and (max-width:1024px) { 
#main-menu ul li {
	margin-left: 30px;
}
}
/*END 1024px*/
@media only screen and (max-width: 991px){	
#main-menu ul li {
	margin-left: 9px;
}
#main-menu ul li a {
	font-size: 15px;
}
#navigation {
	padding: 10px 0 20px;
	background: #fff;
}
}
/*END 991px*/
@media only screen and (max-width: 880px){
#main-menu{
display: none;
}
#mobile_menu{
display: block;
width: 100%;
}
.slicknav_nav{
background-color: #fff;
}
#navigation #mobile_menu li a {
	color: #232434;
	font-weight: 500;
}
#navigation.navbar-fixed #mobile_menu li a{
color: #232434;
}
.slicknav_nav a{
padding: 5px 0px;
-webkit-transition:.3s;
transition: .3s;
}
#navigation #mobile_menu li a:hover,
#navigation #mobile_menu li a:focus{
color: #232434;
background:#fff;
}
.slicknav_btn {
top: 24px;
background:#FFDE67;
}
}
/*END 767px*/

@media only screen and (max-width: 575px){
.slicknav_btn {
margin: 0;
text-decoration: none;
position: absolute;
top: 35px;
right: 17px;
}
.ti-angle-down {
	display: none;
}
}
/*END 575px*/
/*-------------------------------
# Dropdwon menu 
--------------------------------*/

#navigation #main-menu ul li ul ,
#navigation #main-menu ul li ul li ul {	
	background: #fff;
	box-shadow: 0 0 10px 3px rgba(0,0,0,.05);
	left: -55px;
	list-style: outside none none;
	margin:  0;
	opacity: 0;
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	padding:10px;
	position: absolute;
	text-align: left;
	top: 100%;
	-webkit-transition:all 0.3s ease 0s;
	transition: all 0.3s ease 0s;
	visibility: hidden;
	width: 200px;
	z-index: 999;
	border-radius: 4px;
	border-top: 2px solid #232434;
}
#navigation #main-menu ul li  ul li{
	position: relative;
}
#navigation #main-menu ul li ul li ul{
	top: 0;
	right: auto;
	left: 205px;
}
#navigation.navbar-fixed #main-menu ul li li a{
	color: #232434;
} 
#navigation #main-menu ul li:hover ul,
#navigation #main-menu ul li ul li:hover > ul{
	opacity: 1;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; 
	visibility: visible;
}
#navigation #main-menu ul li ul li {display: block; margin: 0; padding: 0;}

#navigation.navbar-fixed #main-menu ul li ul li a,
#navigation #main-menu ul li ul li a {
	color: #232434;
	display: block;
	font-size: 16px;
	font-weight: 400;
	text-transform: capitalize;
	padding: 5px 12px;
	position: relative;	
	-webkit-transition:all 0.3s ease 0s !important;	
	transition: all 0.3s ease 0s !important;
	visibility: inherit !important;
	opacity: inherit !important;
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=NaN)";
}

#navigation #main-menu ul li ul li a:hover,
#navigation.navbar-fixed #main-menu ul li ul li a:hover,
#navigation.navbar-fixed #main-menu ul li ul li a:focus{
	color: #fff;
	background-color: #232434;
	text-decoration: none;
}


@media only screen and (max-width:767px) { 
  .navbar-brand {
    padding-top: 20px;
  }
}
@media only screen and (max-width:880px) { 
#navigation .call_to_action:hover {
	text-align:center;
}
}
@media only screen and (max-width:880px) { 
#navigation.navbar-fixed .call_to_action{
	text-align:center;
}
}
.call_to_action {
	text-align: center;
	margin-top: 7px;
}

/*
* ----------------------------------------------------------------------------------------
* 02.END BOOTSTRAP NAVIGATION OVERRIDES
* ----------------------------------------------------------------------------------------
*/
/*
* ----------------------------------------------------------------------------------------
* 03. START HOMEPAGE CSS STYLE
* ----------------------------------------------------------------------------------------
*/
.home_bg{
height:750px;
position:relative;
background: #FFFAEE;
}
.about_me_content{
padding-top:250px;
position:relative;
}
@media only screen and (max-width:768px) { 
.about_me_content{padding-top:200px;}
}
.about_me_content h1 {
	font-size: 62px;
	margin-top: 10px;
	font-weight: 700;
	color: #232434;
	font-family: 'Poppins', sans-serif;
}
 @media only screen and (max-width:480px){
.about_me_content h1 {font-size: 40px;}
 }
.about_me_content > span {
	text-transform: capitalize;
	font-weight: 500;
	color: #484848;
	font-size: 20px;
}
.basic-info{margin-top:30px;position:relative;}
.basic-info{}
.single-basic-info {
	display: inline-block;
	font-size: 14px;
	padding: 10px 0;
	width: 175px;
}
.single-basic-info p {
font-size:18px;
color: #232434;
font-weight: 600;
}
.single-basic-info p span {
	color: #232434;
	font-size:16px;
	font-weight: normal;
}
/*TOP SOCIAL PROFILES*/
.top_social_profile{margin-top: 50px;}
.top_social_profile ul{
list-style: outside none none;
margin: 0;
padding: 0;
}
.top_social_profile ul li{float:left;}
.top_social_profile ul li a {
	background:#fff;
	text-align: center;
	border: 0px;
	text-transform: uppercase;
	-webkit-transition: all 0.3s ease 0s;
	-o-transition: all 0.3s ease 0s;
	transition: all 0.3s ease 0s;
	margin-right: 15px;
	font-size: 20px;
	color: #232434;
	display: block;
	width: 60px;
	height: 60px;
	line-height: 60px;
	border-radius: 5px;
	box-shadow: 0 10px 40px -10px rgba(0,64,128,.1);
}
@media only screen and (max-width:768px) { 
.top_social_profile ul li a{margin-right:10px;margin-bottom:10px;}
}
.top_social_profile ul li a:hover{
color:#fff;
}
.top_f_facebook:hover{background:#3B5998;}
.top_f_twitter:hover{background:#1A90D9;}
.top_f_instagram:hover{background:#FF5252;}
.top_f_linkedin:hover{background:#0e76a8;}
/*02. END LOGO WITH CONTACT*/
.hero_img {
	position: absolute;
	z-index: 9;
	bottom: 0;
}
 @media only screen and (max-width:768px){
.hero_img {display:none;}
 }
.hero_img img{} 
/*
* ----------------------------------------------------------------------------------------
* 03. END HOMEPAGE CSS STYLE
* ----------------------------------------------------------------------------------------
*/

/*
* ----------------------------------------------------------------------------------------
* 04. START ABOUT CSS STYLE
* ----------------------------------------------------------------------------------------
*/
.about_img{}
.about_img img{width:100%;}
 @media only screen and (max-width:880px){
.about_img {margin-bottom:60px;}
 }
.about_info {
}
.about_info h4, .skills_info h4 {
	margin-bottom: 10px;
	text-transform: capitalize;
	font-size: 16px;
	/* font-weight: 600; */
	border-bottom: 1px dashed #232434;
	display: inline-block;
	padding-bottom: 4px;
	/* font-style: italic; */
}
.about_info h3 {
	margin-bottom: 20px;
	font-size: 42px;
	font-weight: 600;
	line-height: 48px;
}
.about_info p {
	margin-bottom: 30px;
	font-size: 18px;
	line-height: 32px;
}
.about_btns a{margin-right:40px;}
 @media only screen and (max-width:768px){
.about_btns a{margin-bottom:40px;}
 }
.video-play {
	display: inline-block;
	position:relative;
	
}
.video-play i {
	background: #fff;
	border:2px solid #ffde67;
	color: #ffde67;
	width: 60px;
	height: 60px;
	line-height: 56px;
	text-align: center;
	border-radius: 100px;
	margin-right:15px;
	display: inline-block;
	transition: all 0.3s ease 0s;
}
.video-play:hover i{
background: #ffde67;
color:#232434;
border:2px solid #ffde67;
}
.video-title {
	font-weight: 500;
	color: #232434;
	text-transform: uppercase;
	font-size: 16px;
}
/*
* ----------------------------------------------------------------------------------------
* 04. END ABOUT CSS STYLE
* ----------------------------------------------------------------------------------------
*/


/*
* ----------------------------------------------------------------------------------------
* 05. START SERVICE CSS STYLE
* ----------------------------------------------------------------------------------------
*/
.service_area{background:#e5ffff;}
 @media only screen and (max-width:768px){
.service_area{padding-bottom:20px;}
}
.serviceBox {
	position: relative;
	padding: 40px;
	position:relative;
z-index:2;
transition:0.3s;
}
.sb_top{margin-top:150px;}
.service-icon span {
	color: #ffde67;
	display: inline-block;
	font-size:50px;
	margin-bottom: 25px;
	-webkit-transition: all 0.5s ease 0s;
	-o-transition: all 0.5s ease 0s;
	transition: all 0.5s ease 0s;
}
.serviceBox:hover .service-icon{
    -webkit-animation: 0.3s ease 0s normal forwards 1 running loading;
            animation: 0.3s ease 0s normal forwards 1 running loading;
	color: #ffde67;
}
.serviceBox .title {
	font-size: 20px;
	font-weight: 700;
	margin: 0 0 15px;
	text-transform: capitalize;
}
.serviceBox .service-no{
    display: inline-block;
    float: right;
    font-size: 32px;
    line-height: 20px;
}
.serviceBox .description{
    margin: 0;
}
.serviceBox:hover{
background:#ffde67;
-webkit-box-shadow:0px 60px 60px rgba(0,0,0,0.1);
        box-shadow:0px 60px 60px rgba(0,0,0,0.1);
position:relative;
-webkit-transform: translate(0, -10px);
        -ms-transform: translate(0, -10px);
    transform: translate(0, -10px);
}
.serviceBox:hover .title{color:#232434;}
.serviceBox:hover .description{color:#232434;}
.serviceBox:hover .service-icon span{color:#232434;}
@-webkit-keyframes loading{
    49%{ -webkit-transform: translateY(-100%); transform: translateY(-100%); }
    50%{
        opacity: 0;
        -webkit-transform: translateY(100%);
                transform: translateY(100%);
    }
    51%{ opacity: 1; }
}
@keyframes loading{
    49%{ -webkit-transform: translateY(-100%); transform: translateY(-100%); }
    50%{
        opacity: 0;
        -webkit-transform: translateY(100%);
                transform: translateY(100%);
    }
    51%{ opacity: 1; }
}
@media only screen and (max-width:990px){
    .serviceBox{ margin-bottom: 40px; }
}
@media only screen and (max-width:480px){
    .sb_top{ margin-top:0px; }
}
/*
* ----------------------------------------------------------------------------------------
* 05. END SERVICE CSS STYLE
* ----------------------------------------------------------------------------------------
*/

/*
* ----------------------------------------------------------------------------------------
* 06. START FUNFACT CSS STYLE
* ----------------------------------------------------------------------------------------
*/
.funfact_area{
position:relative;
background:#F7FAEB;
padding-bottom:50px;
}
.cbg {
}
.sp {
	text-align: center;
	padding: 30px 30px;
	position: relative;
	background: #FFDE67;
}
 @media only screen and (max-width:768px){
.sp {padding:30px;}
 }
.sp h2 {
	font-size: 60px;
	font-weight: 600;
}
.sp h3{font-size: 18px;}

.sp-two {background: #E6FFC7;}
.sp-three {background: #FFD89F;}
.sp-four {background: #CBF2FE;}
.rating_one {
	/* background: #fff; */
	padding: 30px;
	/*box-shadow: 0 10px 40px -10px rgba(0,64,128,.1); */
	border-radius: 5px;
	margin-bottom:30px;
}
.rating_one span {
	background: #00b67a;
	color:#fff;
	padding: 2px;
}
.rating_ptb {
	margin-top: 40px;
}
.rating_one h5 {
	font-weight: 600;
	font-size: 18px;
	margin-top: 5px;
	margin-bottom: 10px;
}
.rating_one p{font-size: 16px;}
/*
* ----------------------------------------------------------------------------------------
* 06. END FUNFACT CSS STYLE
* ----------------------------------------------------------------------------------------
*/

/*
* ----------------------------------------------------------------------------------------
* 07. START PORTFILIO PAGE DESIGN
* ----------------------------------------------------------------------------------------
*/
.portfolio_area{padding-bottom:50px;}
.mix{
	display: none;
}
.portfolio_filter ul {
	list-style: none;
	margin-bottom: 60px;
	background: #fff;
	border-radius: 5px;
	box-shadow: 0 10px 40px -10px rgba(0,64,128,.1);
}
@media only screen and (max-width:768px) { 
.portfolio_filter ul{width:100%;}
}
.portfolio_filter ul li {
	font-weight: 500;
	text-transform: capitalize;
	display: inline-block;
	cursor: pointer;
	padding: 20px 30px;
	font-size: 18px;
	color: #232434;
	-webkit-transition: .5s;
	-o-transition: .5s;
	transition: .5s;
	margin: 0;
	border-right: 1px solid #e8e8e8;
}
@media only screen and (max-width:480px) { 
.portfolio_filter ul li{margin-bottom:10px;}
}
.portfolio_filter ul li:last-child {
	border-right: 0px;
}
.portfolio_filter .active {
	color: #232434;
	opacity: 1;
	background: #ffde67;
	border-radius: 5px 0 0 5px;
}
.single_portfolio_design {
	overflow: hidden;
	background: #fff;
	padding: 30px;
	border-radius: 10px;
	box-shadow: 0 10px 40px -10px rgba(0,64,128,.2);
	margin-bottom: 30px;
	border: 1px solid #e8e8e8;
}
.port_img {
	margin-right: 30px;
	float: left;
}
@media only screen and (max-width:480px) { 
.port_img {
	margin-right: 00px;
	float: none;
}
}
.port_img img{
border-radius: 10px;
width: 275px;
}
@media only screen and (max-width:480px) { 
.port_img img{width: 100%;}
}
.port_content {
	overflow: hidden;
	margin-top: 50px;
}
.port_content p {
	overflow: hidden;
	font-weight: 400;
	text-decoration: underline;
}
.port_content h2{overflow: hidden;}
.port_content h2 a{
	overflow: hidden;
	font-weight: 500;
	color:#232434;
	margin-top: 8px;
	margin-bottom: 20px;
	display: block;
	transition:0.3s;
}
.single_portfolio_design:hover .port_content h2 a{
color:#ffde67;
}
.port_content span{}
.plus_btn {
	background:#fff;
	color: #ffde67;
	border: 2px solid #ffde67;
	border-radius: 30px;
	width: 40px;
	height: 40px;
	display: inline-block;
	text-align: center;
	line-height: 40px;
	transition: 0.3s;
}
.single_portfolio_design:hover .plus_btn{
background:#ffde67;
border: 2px solid #ffde67;
color:#fff;
}
/*project modal*/
.modal-title {
    color: #232434;
    margin: 0;
    text-transform: uppercase;
}
.modal-content {
    padding: 10px 30px;
    border-radius: 0px;
}
.modal-body { margin-bottom: 15px }
.modal-body img {
	width: 100%;
}
.modal-body p { margin: 15px 0 0 }
.project-list { margin-top: 30px }
.project-list label {
	color: #232434;
	margin-bottom: 0;
	margin-right: 0;
	width: 120px;
}
.project-list li {
    padding: 7px 0;
    font-size: 16px;
}
.project-list li a {
    color: #232434;
    margin-bottom: 0;
    margin-right: 7px;
font-weight: 600;
	
}
.project-list li a:hover { color: #ffde67; }
/*End project modal*/
/*
* ----------------------------------------------------------------------------------------
* 07. END PORTFILIO PAGE DESIGN
* ----------------------------------------------------------------------------------------
*/


/*
* ----------------------------------------------------------------------------------------
* 08. START RESUME PAGE DESIGN
* ----------------------------------------------------------------------------------------
*/
.resume_area{
padding-bottom:50px;
}
.timeline_title {
	text-transform: capitalize;
	font-size:30px;
	font-weight: 600;
	margin-bottom:30px;
}
.timeline_title::after {
	content: "";
	background: -o-radial-gradient(left,ellipse,#ddd 0%,rgba(255,255,255,0) 70%);
	background: radial-gradient(ellipse at left,#ddd 0%,rgba(255,255,255,0) 70%);
	width: 200px;
	height: 2px;
	display: block;
	margin-top: 5px;
}
.single_timeline {
	margin-bottom: 40px;
}
.single_timeline_mbnone{margin-bottom:0px;}
@media only screen and (max-width:480px) { 
.single_timeline_mbnone{margin-bottom:60px;}
}
.single_timeline h4 {
	font-weight: 700;
	font-size: 18px;
	margin-bottom:25px;
}
.single_timeline span {
	margin-bottom: 10px;
	display: inline-block;
	color: #232434;
}
.active_year {
	color: #232434;
	font-weight: 500;
	border: 2px solid #ffde67;
	padding: 0px 10px;
	border-radius: 2px;
}
.active_company {
	font-weight: 500;
}
.single_timeline p{}
/*START SKILL DESIGN */
.progress-bar-linear {
	margin-bottom: 20px;
}
.progress-bar-text {
	font-size: 18px;
	margin-bottom: 10px;
	text-transform: capitalize;
	font-weight: 500;
}
.progress-bar-text span { float: right }
.progress-bar {
	background: #e8e8e9 none repeat scroll 0 0;
	-webkit-box-shadow: 0 0 0;
	box-shadow: 0 0 0;
	height: 12px;
	margin: 0 0 12px;
	border-radius: 30px;
	position: relative;
	width: 100%;
}
.progress-bar > span {
    background: #ffde67 none repeat scroll 0 0;
    display: block;
    height: 100%;
    width: 0;
	border-radius: 30px;
}
.pb1 > span{background:#ffde67;}
.pb2 > span{background:#ff9900;}
.pb3 > span{background:#82b700;}
.pb4 > span{background:#ef2d56;}
.pb5 > span{background:#ff80b0;}
/*END SKILL*/
/*
* ----------------------------------------------------------------------------------------
* 08. END RESUME PAGE DESIGN
* ----------------------------------------------------------------------------------------
*/


 
 /*
* ----------------------------------------------------------------------------------------
* 09.START TESTIMONIAL DESIGN
* ----------------------------------------------------------------------------------------
*/
.testimonials_area {
	background: #e5ffff;
}
.testi_pd {
	padding-left: 50px;
}
@media only screen and (max-width:880px){
.testi_pd {padding-left:0px;}
}
.testi_title{margin-bottom:30px;position: relative;}
.testi_title h2 {
	font-weight: 700;
	font-size: 60px;
}
.testi_title p {
	color: #ffde67;
	font-weight: 600;
}
.testi_rev {
	background: #00b67a;
	display: inline-block;
	padding: 25px;
	position: absolute;
	bottom: 0;
	right: 0;
	border-radius: 0px 30px 0px 30px;
}
.testi_revv {
	background: #ffde67;
	display: inline-block;
	padding: 25px;
	position: absolute;
	bottom: 0;
	right: 130px;
	border-radius: 0px 30px 0px 30px;
}
@media only screen and (max-width:480px) { 
.testi_rev {
	position: relative;
	margin-top: 40px;
}
.testi_revv {
	position: absolute;
	bottom: 0;
	right: 230px;
}
}
.testi_rev span {
	font-weight: 600;
	font-size: 32px;
	display: inline-block;
	margin-bottom: 10px;
}
.testi_rev > p {
	color: #232434;
	text-transform: capitalize;
}
.testi_revv span {
	font-weight: 600;
	font-size: 32px;
	display: inline-block;
	color: #fff;
	margin-bottom: 10px;
}
.testi_revv > p {
	color: #fff;
	text-transform: capitalize;
}
.testimonial_content_two{}
.testimonial_content_two p {
	font-size: 18px;
	line-height: 30px;
}
.testi_name {
	font-size: 22px;
	text-transform: capitalize;
	font-weight: 600;
	margin-top: 40px;
	display: block;
	color: #232434;
	margin-bottom: 5px;
}
.testi_con{}
@media only screen and (max-width:880px){
.testi_img {margin-bottom:60px;}
}
.owl-theme .owl-controls .owl-page { display: inline-block }
.owl-controls .owl-page,
.owl-controls .owl-buttons div { cursor: pointer }
.owl-theme .owl-controls .owl-page span {
	background-color: #ffde67 !important;
	border-radius: 20px;
	display: block;
	height: 2px;
	margin: 5px 3px;
	width: 20px;
}

.owl-theme .owl-controls .owl-page.active span,
.owl-theme .owl-controls.clickable .owl-page:hover span { background-color: #fff }
.owl-theme .owl-controls {
  display: block !important;
  margin-top:10px;
  text-align: center;
}
/*
* ----------------------------------------------------------------------------------------
* 09.END TESTIMONIAL DESIGN
* ----------------------------------------------------------------------------------------
*/

/*
* ----------------------------------------------------------------------------------------
* 10. START BLOG PAGE DESIGN
* ----------------------------------------------------------------------------------------
*/
.blog_area{}
.single_blog_content{}
@media only screen and (max-width:480px) { 
.single_blog_content{margin-bottom:60px;}
}
.single_blog_content h1 {
	font-weight: 600;
	margin-bottom: 20px;
}
.single_blog_content p{}
.single_blog {
	background: none;
	border-radius: 0px 10px 10px 10px;
}
.sb_none{margin-bottom:0px;}
@media only screen and (max-width:880px) { 
.single_blog {margin-bottom:30px;}
}
.blog_content {
margin-top: 15px;
}
.blog-img{position: relative;}
.blog-img img{position: relative;}
@media only screen and (max-width:768px) { 
.blog-img img{width:100%;}
}
.single_blog h2 {
	line-height: 32px;
	font-size: 20px;
	font-weight: 500;
}
.single_blog h2 a {
	color: #232434;
}
.single_blog p{margin-bottom:20px;}
.single_blog h2 a:hover{color:#ffde67;}
.single_blog span {
	text-transform: capitalize;
	margin-bottom: 10px;
	display: inline-block;
	font-weight: 500;
	color: #232434;
}
@media screen and (max-width:480px){
.single_blog span {margin-right:15px;}
}
@media screen and (max-width:414px){
.single_blog span {
	margin-right: 5px;
	font-size: 12px;
}
}
.single_blog span a{color:#ffde67;}
.single_blog > a{margin-bottom: 30px;}
.blog_content a {
	font-size: 22px;
	-webkit-transition: 0.3s;
	-o-transition: 0.3s;
	transition: 0.3s;
}
.blog_content a:hover{color:#ffde67;}
/*START SINGLE PAGE BLOG STYLE*/
.single_blog_area{}
.single_blog_page{}
.single_blog_page img {
}
.single_blog_page p{margin-top: 30px;}
.text-italic {
	font-style: italic;
	font-weight: 600;
	font-size: 16px;
	line-height: 26px;
}
/*END SINGLE PAGE BLOG STYLE*/
/*
* ----------------------------------------------------------------------------------------
* 10. END BLOG PAGE DESIGN
* ----------------------------------------------------------------------------------------
*/

/*
* ----------------------------------------------------------------------------------------
* 11.START CONTACT DESIGN
* ----------------------------------------------------------------------------------------
*/
.contact_us{background:#F7FAEB;}
.contact {margin-right:30px;}
@media only screen and (max-width:768px) { 
.contact {margin-bottom:60px;margin-right:0px;}
}
.contact h4 {font-weight: 700;font-size: 40px;}
.contact p {
margin-bottom:40px;
}
.contact_img{margin-right:30px;}
@media only screen and (max-width:880px) { 
.contact_img{
margin-bottom:60px;
margin-right:0px;
}
}
.contact input {
background: #fff;
	background: #fff;
	border: 1px solid #fff;
	border-radius: 0px;
	-webkit-box-shadow: none;
	        box-shadow: none;
	color: #232434;
	font-size: 16px;
	font-weight: 400;
	height: 70px;
	padding: 10px 10px 10px 30px;
	width: 100%;
	margin-bottom: 30px;
}
.contact textarea {
	background: #fff;
	border: 1px solid #fff;
	border-radius: 0px;
	-webkit-box-shadow: none;
	        box-shadow: none;
	color: #232434;
	font-size: 16px;
	font-weight: 400;
	padding: 10px 10px 10px 30px;
	width: 100%;
	margin-bottom:30px;
}
.contact input:focus {
background: #fff;
	border: 1px solid #fff;
    -webkit-box-shadow: none;
            box-shadow: none;
    outline: 0 none;
	color: #232434;
}
.contact textarea:focus {
background: #fff;
border: 1px solid #fff;
    -webkit-box-shadow: none;
            box-shadow: none;
	color: #232434;
}
.contact button {
	width: 100%;
	font-size: 16px;
	border: none;
}
.address_bg {
	position: relative;
	text-align: center;
	background: #e5ffff;
	padding: 25px 0px;
	margin-top: -45px;
	border-radius: 1000px;
	box-shadow: 0 10px 40px -10px rgba(0,64,128,.2);
}
.single_address {}
@media only screen and (max-width:768px) { 
.single_address{margin-bottom: 30px;}
}
.single_address h4 {
	font-weight: 600;
	font-size: 18px;
	overflow: hidden;
	
}
.contact_btn {
	background: #ffde67;
	padding: 10px;
	color: #fff;
	text-transform: capitalize;
	border: 2px solid #fff;
	-webkit-transition: 0.3s;
	-o-transition: 0.3s;
	transition: 0.3s;
}
.contact_btn:hover{background:#ffde67;color: #fff;}


.map{}
.map iframe{
width:100%;
height:400px;
margin-bottom:-8px;
}
/*
* ----------------------------------------------------------------------------------------
* 11.END CONTACT DESIGN
* ----------------------------------------------------------------------------------------
*/


/*
* ----------------------------------------------------------------------------------------
* 12.START FOOTER DESIGN
* ----------------------------------------------------------------------------------------
*/
.footer {
background: #F7FAEB;
  padding-bottom:30px;
}
.footer_social_profile {
  margin: 30px 0;
}
.footer_social_profile ul{
list-style: outside none none;
margin: 0;
padding: 0;
text-align: center;
}
.footer_social_profile ul li{
display: inline-block;
}
@media only screen and (max-width:480px) { 
.footer_social_profile ul li{margin:2px;}
}
.footer_social_profile ul li a {
	color: #232434;
	float: left;
	font-size: 18px;
	margin: 0;
	padding: 10px 20px;
	text-align: center;
	text-transform: capitalize;
	-webkit-transition: all 0.3s ease 0s;
	-o-transition: all 0.3s ease 0s;
	transition: all 0.3s ease 0s;
	text-decoration: underline;
}
.footer_social_profile ul li a:hover{
color: #ffde67;
}
/*END FOOTER SOCIAL DESIGN*/
.copyright{
text-transform: capitalize;
}

.pt-cus {
  padding-top: 160px;
  padding-bottom: 100px;
  padding-left: 50px;
  padding-right: 50px;

}


@media screen and (max-width: 776px) {
  .pt-cus {
      padding-top: 120px;
      padding-bottom: 50px;
      padding-left: 15px;
      padding-right: 15px;
  }
}
/*
* ----------------------------------------------------------------------------------------
* 12.END FOOTER DESIGN
* ----------------------------------------------------------------------------------------
*/

