@charset "utf-8";
/* CSS Document */


@media all and (min-width: 1201px) and (max-width: 1599px) {

	.jumbo_heading{
		font-size: 85px;
	}

	.jumbo_heading span {
	    font-size: 45px;
	}

	.hero_text {
	    font-size: 26px;
	    width: 800px;
	    line-height: 42px;
	    margin: 40px auto;
	}

	.big_icon {
		background-size: 750px 750px;
		-moz-background-size: 750px 750px;
		-ms-background-size: 750px 750px;
		-o-background-size: 750px 750px;
		-webkit-background-size: 750px 750px;
	}

	.scroll_down_icon{
		left: 44.5%;
	}

	.portfolio_details {
	    margin-top: 18%;
	}

	.portfolio_details.web {
	    margin-top: 5%;
	}

	.portfolio_image{
		left: -0px;
	}

	.portfolio_image img{
		width: 560px;
	}

	h1.heading {
		font-size: 70px;
	}

	.purple_bar {
	    width: 18%;
	    height: 10px;
		margin-top: 30px;
		margin-bottom: 30px;
	}

	.about_text p {
	    font-size: 30px;
		line-height: 42px;
		margin-bottom: 60px;
	}

	.anand_pic {
	    right: 8%;
	}

	.anand_pic img {
	    height: 485px;
	}

	.macbook{
		margin-top:-320px;
		text-align: center;
		margin-bottom: 70px;
	}


	.macbook img{
		width: 970px;
	}

	.the_project {
	    text-align: center;
	}

	.the_project p {
	    width: 960px;
	    margin: 0 auto 70px;
	}

	.the_project.app{
		text-align: center;
	}

	.imac{
		width: 85%;
		margin: 0 auto
	}

	.iphone{
		margin-top:-320px;
		text-align: center;
		margin-bottom: 100px;
	}

	.screen_slide{
		padding: 120px 0px 110px !important;
	}

	.all_colors {
	    margin-bottom: 100px;
	}

	.portfolio_footer{
		padding: 0px 0px 20px;
	}

}


/*------------tablets landscape------------*/

@media all and (max-width: 1200px) {

	h1.heading {
	    font-size: 65px;
	}

	h2.heading {
	    font-size: 44px;
	}

	.jumbo_heading{
		font-size: 75px;
	}

	.jumbo_heading span {
	    font-size: 40px;
	}

	.hero_text {
	    font-size: 26px;
	    width: 800px;
	    line-height: 42px;
	    margin: 40px auto;
	}

	.big_icon {
		background-size: 650px 650px;
		-o-background-size: 650px 650px;
		-webkit-background-size: 650px 650px;
		-ms-background-size: 650px 650px;
		-moz-background-size: 650px 650px;
	}

	.extra_pad{
		padding:0px 40px;
	}

	.section, .section.about{
		padding: 110px 0px 120px;
	}

	.section.portfolio{
		padding: 100px 0px 120px;
	}

	.portfolio_image{
		left: inherit;
		right: inherit;
		text-align: center;
	}

	.portfolio_image img{
		width: 650px;
	}

	.portfolio_details, .portfolio_details.web {
	    margin-top: 0%;
	    width: 80%;
	    margin: 40px auto 0px;
	    text-align: center;
	}


	 .portfolio_image.web_right, .portfolio_image.right {
	 	right: inherit;
	 }

	 .about_text p {
	    color: white;
	    font-weight: 400;
	    font-size: 24px;
		line-height: 38px;
	    margin-bottom: 55px;
	}

	.contact_text p {
		width: 100%;
	}

	.anand_pic{
		right:3%;
	}

	.anand_pic img{
		height: 470px;
	}

	.macbook{
		margin-top:-350px;
		text-align: center;
		margin-bottom: 70px;
	}

	.macbook img{
		width: 900px;
	}

  	.iphone img{
		width: 300px;
	}

	.portfolio_head h1 {
	    font-size: 60px;
	}

	.iphone{
		margin-top:-350px;
	}

	.imac{
		width: 700px;
	}

	.screen_desc p {
	    font-size: 24px;
	    line-height: 38px;
	    width: 860px;
	}

	.screen_desc h1{
		font-size: 60px;
	}

	.all_colors {
	    margin-bottom: 70px;
	}

	.font_image img{
		max-height: 42px;
	}

	.fonts {
	    margin-bottom: 30px;
	}

	.font_image {
	    margin-bottom: 40px;
	}

	.single_font_row {
	    margin-bottom: 30px;
	}

	.portfolio_footer{
		padding: 0px 0px 20px;
	}

	.idea {
	    font-size: 60px;
	}

	.screen_slide{
		padding: 120px 0px 110px !important;
	}

}


/*------------tablets potrait and any device with lower css resolution------------*/

@media all and (max-width: 991px) {

	header{
		height: 85px;
	}

	.fake_header{
		height: 120px;
	}
	
	.logo{
		width: 200px;
		height: 33.5px;
		background-size: 200px 67px;
		-moz-background-size: 200px 67px;
		-webkit-background-size: 200px 67px;
		-ms-background-size: 200px 67px;
		-o-background-size: 200px 67px;
		margin-top: 45px;
		margin-left: 30px;
	}

	header.white .logo{
		width: 200px;
		height: 33.5px;
		background-size: 200px 67px;
		-moz-background-size: 200px 67px;
		-webkit-background-size: 200px 67px;
		-ms-background-size: 200px 67px;
		-o-background-size: 200px 67px;
		margin-top: 26px;
		margin-left: 30px;
	}

	#nav, #nav_inner {
	    list-style: none;
	    margin-top: 50px;
	    margin-right: 15px;
	}

	header.white #nav, header.white #nav_inner{
		margin-top: 30px;
	}


	#nav li a, #nav_inner li a{
	    font-size: 18px;
	}

	.hero_content {
	    top: 34%;
	}

	.hero_text {
	    font-size: 22px;
	    width: 675px;
	}

	.jumbo_heading {
    	font-size: 80px;
	}

	h1.heading{
		 font-size: 65px;
		 font-family: 'GothamBlack' , sans-serif;
	}

	h2.heading{
		 font-size: 42px;
		 font-family: 'GothamBold' , sans-serif;
		 margin-bottom: 15px;
	}

	.content ul li{
		font-size: 18px;
		background-size: 18px;
		padding-left: 34px;
	}

	.anand_pic{
		position: relative;
		width: 100%;
		text-align: center;
		margin-top: 50px;
		right: -00px;
	}

	.anand_pic img{
		height: 600px;
	}

	.portfolio_image img{
		width: 620px;
	}

	.section.about{
		padding-bottom: 0px;
	}

	.section.portfolio{
		padding: 100px 0px 120px;
	}

	.portfolio_hero_image.web_work {
		height: 70%;
	}

	.macbook{
		margin-top:-330px;
		text-align: center;
		margin-bottom: 70px;
	}

	.macbook img{
		width: 680px;
	}

	.iphone{
		margin-top: -480px;
	}

	.iphone img{
		width: 366px;
	}

	.imac{
		width: 490px;
	}

	.single_color {
	    width: 75px;
	    margin-right: 35px;
	}

	.color_circle {
	    width: 75px;
	    height: 75px;
	}

	.screen_desc h1 {
	    font-size: 50px;
	    letter-spacing: -2px;
	    padding-top: 100px;
	}

	.screen_desc p {
	    font-size: 20px;
	    line-height: 32px;
	    width: 600px;
	}

	.swiper-button-prev, .swiper-container-rtl .swiper-button-next {
	    background-size: 40px 40px;
	    -moz-background-size: 40px 40px;
	    -o-background-size: 40px 40px;
	    -ms-background-size: 40px 40px;
	    -webkit-background-size: 40px 40px;
	    left: -110px;
	    right: auto;
	}

	.swiper-button-next, .swiper-container-rtl .swiper-button-prev {
	    right: -110px;
	    background-size: 40px 40px;
	    left: auto;
	}

	.portfolio_hero_image, .first_screen, .second_screen{
		background-attachment: scroll !important;
		background-size: auto 100% !important;
		-webkit-background-size: auto 100% !important;
		-ms-background-size: auto 100% !important;
		-o-background-size:  auto 100% !important;
		-moz-background-size:  auto 100% !important;
	}

}


/*------------tablets potrait and large mobiles landscape------------*/

@media all and (min-width: 768px ) and (max-width: 991px ){


	
}


/*------------large mobiles potrait and small mobile landscape------------*/

@media all and (min-width: 481px ) and (max-width: 602px ){
	
	.big_icon {
	    background-size: 600px 600px;
	    -moz-background-size: 600px 600px;
	    -o-background-size: 600px 600px;
	    -ms-background-size: 600px 600px;
	    -webkit-background-size: 600px 600px;
	}

	.nav_icon{
		margin-top: 50px;
		margin-right: 35px;
	}

	.xs_drop{
		position: absolute;
		right: 0px;
	}

	.xs_nav{
		position: absolute;
		left: -127px;
		top: 95px;
		width: 140px;
		height: auto;
		background: white;
		padding: 10px 0px;
		-moz-border-radius:6px;
		-ms-border-radius:6px;
		-o-border-radius:6px;
		-webkit-border-radius:6px;
		border-radius:6px;
		border: none;
	}

	.xs_nav li{
		display: block !important;
		padding: 5px 0px !important
	}

	.xs_nav li a{
		color: #4d4d4d !important;
		text-align: left !important;
		display: block !important;
		font-size: 16px !important;
	}

	h2.heading {
	    font-size: 40px;
	}

	header.white .xs_nav{
		top: 75px;
	}

	header.white.nav-up .xs_nav{
		display: none;
	}


	header.white .nav_icon{
		margin-top: 32px;
	}

	h1.heading {
	    font-size: 60px;
	}

	h2.heading {
	    font-size: 40px;
	}

	h3.heading{
		font-size: 34px;
	}

	h4.heading{
		font-size: 28px;
	}

	.hero_text {
	    font-size: 22px;
	    width: 85%;
	    line-height: 35px;
	    margin: 25px auto;
	}

	.jumbo_heading {
	    font-size: 65px;
	}

	.jumbo_heading span {
	    font-size: 42px;
	    margin-top: 20px;
	}

	.portfolio_image img {
	    width: 535px;
	}

	.section, .section.about {
	    padding: 70px 0px 80px;
	}

	.contact_text p {
	    width: 100%;
	}

	.content ul li{
		font-size: 18px;
		background-size: 18px;
		padding-left: 34px;
		background-position: left 4px;
		padding-top: 0px;
		padding-bottom: 20px;
	}

	.portfolio_head h1 {
	    font-size: 50px;
	    letter-spacing: -2px;
	}

	.portfolio_head p {
	    font-size: 24px;
	    margin-bottom: 10px;
	}

	.portfolio_head span {
	    font-size: 18px;
	}

	.portfolio_image img {
	    width: 420px;
	}

	.macbook{
		margin-top:-210px;
		text-align: center;
		margin-bottom: 70px;
	}

	.macbook img{
		width: 450px;
	}

	.iphone img {
	    width: 290px;
	}

	.screen_desc h1 {
	    font-size: 40px;
	    letter-spacing: -2px;
	    padding-top: 80px;
	    margin-bottom: 15px;
	}

	.screen_desc p {
	    font-size: 18px;
	    line-height: 25px;
	    width: 450px;
	}

	.imac{
		width: 400px;
	}

	.iphone {
	    margin-top: -360px;
	    margin-bottom: 70px;
	}

	.sceond_desc {
	    width: 448px;
	}

	.sceond_desc p {
	    font-size: 20px;
	    line-height: 30px;
	}

	.single_color {
	    width: 65px;
	    margin-right: 30px;
	}

	.color_circle {
	    width: 65px;
	    height: 65px;
	}

	.color_code {
		font-size: 14px;
		margin-top: 10px;
	}

	.all_colors {
	    margin-bottom: 55px;
	}

	.font_name {
		font-size: 16px;
		margin-bottom: 30px;
	}

	.font_image {
	    margin-bottom: 30px;
	}

	.font_image img {
	    max-height: 30px;
	}

	.idea {
	    font-size: 35px;
	    margin-bottom: 40px;
	}

	.portfolio_footer {
	    padding: 0px 0px 0px;
	}

	.swiper-button-next, .swiper-button-prev{
		display: none;
	}

	.sceond_desc {
	    width: 390px;
	}


	.swiper-button-next.web_slider, .swiper-button-prev.web_slider{
		display: none;
	}

}


/*------------large mobiles potrait and small mobile landscape------------*/

@media all and (min-width: 603px ) and (max-width: 767px ){

	.xs_drop{
		position: absolute;
		right: 0px;
	}

	.xs_nav{
		position: absolute;
		left: -127px;
		top: 95px;
		width: 140px;
		height: auto;
		background: white;
		padding: 10px 0px;
		-moz-border-radius:6px;
		-ms-border-radius:6px;
		-o-border-radius:6px;
		-webkit-border-radius:6px;
		border-radius:6px;
		box-shadow: 0px 2px 8px rgba(0,0,0,0.25)
	}

	.xs_nav li{
		display: block !important;
		padding: 5px 0px !important
	}

	.xs_nav li a{
		color: #4d4d4d !important;
		text-align: left !important;
		display: block !important;
		font-size: 16px !important;
	}

	header.white .xs_nav{
		top: 75px;
	}

	header.white.nav-up .xs_nav{
		display: none;
	}

	.big_icon {
	    background-size: 600px 600px;
	    -moz-background-size: 600px 600px;
	    -o-background-size: 600px 600px;
	    -ms-background-size: 600px 600px;
	    -webkit-background-size: 600px 600px;
	}

	h1.heading {
	    font-size: 60px;
	}

	h2.heading {
	    font-size: 40px;
	}

	h3.heading{
		font-size: 34px;
	}

	h4.heading{
		font-size: 28px;
	}

	.content ul li{
		font-size: 18px;
		background-size: 18px;
		padding-left: 34px;
		background-position: left 4px;
		padding-top: 0px;
		padding-bottom: 20px;
	}

	.portfolio_details span {
	    font-weight: 300;
	    color: #4d4d4d;
	    font-size: 26px;
	    margin-bottom: 15px;
	}

	.portfolio_details h2.heading{
		margin-bottom: 10px;
	}

	.hero_text {
	    font-size: 22px;
	    width: 430px;
	    line-height: 35px;
	    margin: 25px auto;
	}

	.about_text p {
	    font-size: 22px;
	    line-height: 36px;
	}

	.jumbo_heading {
	    font-size: 65px;
	}

	.jumbo_heading span {
	    font-size: 40px;
	    margin-top: 20px;
	}

	.purple_bar {
	    width: 35%;
	}

	.nav_icon{
		margin-top: 50px;
		margin-right: 35px;
	}

	header.white .nav_icon{
		margin-top: 32px;
	}

	.portfolio_image img {
	    width: 535px;
	}

	.contact_text p {
	    width: 100%;
	}


	.section, .section.about{
		padding: 70px 0px 80px;
	}

	.section.portfolio{
		padding: 70px 0px 80px;
	}

	.section.about{
		padding-bottom: 0px;
	}

	.anand_pic {
		right: 25px;
	}

	.anand_pic img{
		height: 550px;
	}

	.scroll_down_icon {
	 	width: 100px;
	 	height: 31px;
	 	background-size: 100px 31px;
	 	-moz-background-size: 100px 31px;
	 	-ms-background-size: 100px 31px;
	 	-o-background-size: 100px 31px;
	 	-webkit-background-size: 100px 31px;
	}

	.scroll_down{
	 	height: 31px;
	}

	.macbook{
		margin-top:-200px;
		text-align: center;
		margin-bottom: 70px;
	}

	.macbook img{
		width: 500px;
	}


	.iphone img {
	    width: 290px;
	}

	.iphone {
	    margin-top: -360px;
	    margin-bottom: 70px;
	}

	.imac{
		width: 500px;
	}

	.font_name {
		font-size: 16px;
	}

	.screen_desc h1 {
	    font-size: 40px;
	    letter-spacing: -2px;
	    padding-top: 80px;
	    margin-bottom: 15px;
	}

	.screen_desc p {
	    font-size: 18px;
	    line-height: 25px;
	    width: 450px;
	}

	.sceond_desc {
	    width: 448px;
	}

	.sceond_desc p {
	    font-size: 20px;
	    line-height: 30px;
	}

	.idea {
	    font-size: 35px;
	    margin-bottom: 40px;
	}

	.portfolio_footer {
	    padding: 0px 0px 0px;
	}


	.swiper-button-next.web_slider, .swiper-button-prev.web_slider{
		display: none;
	}

}


/*------------large mobiles potrait only------------*/

@media all and (max-width: 480px ){

	header{
		height: 60px;
	}

	.fake_header{
		height: 80px;
	}

	.big_icon {
	    background-size: 600px 600px;
	    -moz-background-size: 600px 600px;
	    -o-background-size: 600px 600px;
	    -ms-background-size: 600px 600px;
	    -webkit-background-size: 600px 600px;
	}

	.logo {
	    width: 150px;
	    height: 25px;
	    background-size: 150px 50px;
	    -moz-background-size: 150px 50px;
	    -o-background-size: 150px 50px;
	    -ms-background-size: 150px 50px;
	    -webkit-background-size: 150px 50px;
	    margin-top: 30px;
	    margin-left: 15px;
	}

	header.white .logo{

		width: 150px;
	    height: 25px;
	    background-size: 150px 50px;
	    -moz-background-size: 150px 50px;
	    -o-background-size: 150px 50px;
	    -ms-background-size: 150px 50px;
	    -webkit-background-size: 150px 50px;
	    margin-top: 20px;
	    margin-left: 15px;
	}

	.nav_icon {
		margin-right: 30px;
	}

	.xs_drop{
		position: absolute;
		right: 0px;
	}

	.xs_nav{
		position: absolute;
		left: -127px;
		top: 65px;
		width: 140px;
		height: auto;
		background: white;
		padding: 10px 0px;
		-moz-border-radius:6px;
		-ms-border-radius:6px;
		-o-border-radius:6px;
		-webkit-border-radius:6px;
		border-radius:6px;
		border: none;
	}

	.xs_nav li{
		display: block !important;
		padding: 5px 0px !important
	}

	.xs_nav li a{
		color: #4d4d4d !important;
		text-align: left !important;
		display: block !important;
		font-size: 16px !important;
	}


	header.white .xs_nav{
		top: 50px;
	}

	header.white.nav-up .xs_nav{
		display: none;
	}

	.content ul li{
		font-size: 16px;
		background-size: 16px;
		padding-left: 34px;
		background-position: left 4px;
		padding-top: 0px;
		padding-bottom: 15px;
		padding-left: 30px;
	}


	.hero_text {
	    font-size: 18px;
	    line-height: 32px;
	    margin: 25px auto;
	}

	.jumbo_heading {
	    font-size: 48px;
	}

	.jumbo_heading span {
	    font-size: 30px;
	    margin-top: 12px;
	}

	.portfolio_image img {
	    width: 420px;
	}

	.contact_text p {
	    width: 100%;
	}


	.section, .section.about{
		padding: 70px 0px 80px;
	}

	.section.portfolio{
		padding: 70px 0px 80px;
	}

	.section.about{
		padding-bottom: 0px;
	}

	.anand_pic {
		right: 25px;
	}

	.purple_bar {
	    width: 30%;
	    height: 8px;
	    margin-top: 20px;
	    margin-bottom: 20px;
	}

	h1.heading {
	    font-size: 48px;
	}

	h2.heading {
	    font-size: 30px;
	}

	h3.heading{
		font-size: 28px;
	}

	h4.heading{
		font-size: 24px;
	}

	.portfolio_details, .portfolio_details.web {
	    margin-top: 0%;
	    width: 95%;
	    margin: 30px auto 0px;
	}


	.portfolio_details h2.heading {
		font-size: 38px;
		margin-bottom: 10px;
	}

	.portfolio_details span {
		font-size: 24px;
		margin-bottom: 15px;
	}

	.content p {
		font-size: 18px;
		line-height: 30px;
		margin-bottom: 25px;
		font-weight: 300;
		color: #7c7c7c;
	}

	.portfolio_details p {
	    font-size: 18px;
	    line-height: 30px;
	}

	.about_text p {
	    font-size: 20px;
	    line-height: 32px;
	    margin-bottom: 40px;
	}

	.founder_name {
	    font-size: 32px;
	}

	.designation {
	    font-size: 20px;
	    margin-bottom: 20px;
	}

	.anand p, .contact_text p {
	    font-size: 18px;
	    line-height: 30px;
	}
	
	.social_icons {
	    margin-top: 40px;
	}

	.social_icons a{
		margin-right: 15px;
	}

	.social_icons a img {
	    width: 38px;
	}

	.anand_pic img {
	    height: 400px;
	}

	.extra_pad{
		padding:0px 30px;
	}

	.scroll_down_icon {
		width: 100px;
		height: 31px;
		background-size: 100px 31px;
	    -moz-background-size: 100px 31px;
	    -o-background-size: 100px 31px;
	    -ms-background-size: 100px 31px;
	    -webkit-background-size: 100px 31px;
	}

	.scroll_down{
		height: 31px;
	}

	.devider {
		margin: 16px auto;
	}

	.portfolio_head h1 {
	    font-size: 50px;
	    letter-spacing: -2px;
	}

	.portfolio_head p {
	    font-size: 22px;
	    margin-bottom: 6px;
	}

	.portfolio_head span {
	    font-size: 18px;
	}

	.screen_desc h1 {
	    font-size: 36px;
	    letter-spacing: -2px;
	    padding-top: 80px;
	    margin-bottom: 15px;
	}

	.screen_desc p {
	    font-size: 16px;
	    line-height: 25px;
	    width: 370px;
	}

	.imac{
		width: 350px;
	}

	.macbook{
		margin-top:-200px;
		text-align: center;
		margin-bottom: 70px;
	}

	.macbook img{
		width: 370px;
	}

	.iphone img {
	    width: 285px;
	}

	.iphone {
	    margin-top: -280px;
	    margin-bottom: 70px;
	}

	.apple_iphone {
	    width: 320px;
	}

	.sceond_desc {
	    width: 340px;
	}

	.sceond_desc p {
	    font-size: 18px;
	    line-height: 30px;
	}

	.single_color {
	    width: 60px;
	    margin-right: 18px;
	}

	.color_circle {
	    width: 60px;
	    height: 60px;
	}

	.color_code {
		font-size: 14px;
		margin-top: 10px;
	}

	.all_colors {
	    margin-bottom: 55px;
	    margin-top: 15px;
	}

	.font_name {
		font-size: 16px;
		margin-bottom: 25px;
	}

	.font_image {
	    margin-bottom: 30px;
	}

	.font_image img {
	    max-height: 25px;
	}

	.idea {
	    font-size: 30px;
	    margin-bottom: 30px;
	}

	.portfolio_footer {
	    padding: 0px 0px 0px;
	}

	.swiper-button-next, .swiper-button-prev{
		display: none;
	}

	footer {
	    height: 80px;
	}

	.copyright, .social{
		margin-top: 30px;
	}


	.swiper-button-next.web_slider, .swiper-button-prev.web_slider{
		display: none;
	}

}


/*------------samll mobiles potrait and very small mobiles lanscape------------*/

@media all and (max-width: 479px ){

	.big_icon {
	    background-size: 500px 500px;
	    -moz-background-size: 500px 500px;
	    -o-background-size: 500px 500px;
	    -ms-background-size: 500px 500px;
	    -webkit-background-size: 500px 500px;
	}

	.jumbo_heading {
	    font-size: 44px;
	}


	.jumbo_heading span {
	    font-size: 26px;
	    margin-top: 12px;
	}

	.hero_text {
	    font-size: 16.5px;
	    line-height: 32px;
	    margin: 25px auto;
	    width: 91%;
	}

	h1.heading {
	    font-size: 44px;
	}

	.content p, .anand p, .contact_text p {
	    font-size: 16px;
	    line-height: 28px;
	}

	.portfolio_image{
		text-align: center;
	}

	.portfolio_image img {
	    width: 355px;
	}

	.copyright {
	    color: #7d7d7d;
	    font-size: 16px;
	}

	.scroll_down{
	 	height: 31px;
	 }

	 .anand_pic img {
	    height: 350px;
	}

	.anand_pic {
	    right: 18px;
	}

	.portfolio_head h1 {
	    font-size: 45px;
	    letter-spacing: -2px;
	}

	.screen_desc h1 {
	    font-size: 32px;
	    letter-spacing: -2px;
	    padding-top: 80px;
	    margin-bottom: 15px;
	}

	.screen_desc p {
	    font-size: 16px;
	    line-height: 25px;
	    width: 300px;
	}

	.imac{
		width: 300px;
	}

	.macbook{
		margin-top:-160px;
		text-align: center;
		margin-bottom: 70px;
	}

	.macbook img{
		width: 330px;
	}
	
}

@media all and (max-width: 434px ){

	.iphone img {
	    width: 250px;
	}

	.iphone {
	    margin-top: -250px;
	    margin-bottom: 70px;
	}


}
/*------------very small mobiles potrait only------------*/

@media all and (max-width: 375px ){

	.portfolio_image img {
	    width: 315px;
	}

	.button.view {
	    padding: 12px 30px;
	    font-size: 16px;
	}

	.iphone img {
	    width: 285px;
	}

	.iphone {
	    margin-top: -280px;
	    margin-bottom: 70px;
	}

	.sceond_desc {
	    width: 300px;
	}
	
}

@media all and (max-width: 360px ){

	.portfolio_head p {
	    font-size: 20px;
	    margin-bottom: 6px;
	}

	.portfolio_head span {
	    font-size: 17px;
	}

	.iphone img {
	    width: 250px;
	}

	.iphone {
	    margin-top: -250px;
	    margin-bottom: 70px;
	}

	.single_color {
	    width: 50px;
	    margin-right: 22px;
	}

	.color_circle {
	    width: 50px;
	    height: 50px;
	}

	.color_code {
	    font-size: 13px;
	    margin-top: 8px;
	}

}