/*!
 * Start Bootstrap - Freelancer Bootstrap Theme (http://startbootstrap.com)
 * Code licensed under the Apache License v2.0.
 * For details, see http://www.apache.org/licenses/LICENSE-2.0.
 */

body {
    overflow-x: hidden;
	font-family: 'Open Sans', sans-serif !important;
	background-color:;
	height:auto !important;
}


p {
    font-size: 20px;
}

p.small {
    font-size: 16px;
}


.navbar{
	z-index:1000000000!important;
}

a{
	text-decoration:none;
}

a:hover{
    outline: 0;
    color: #2aadfc!important;
}

pre-pro a{
	display:block !important;
}

a:focus,
a:active,
a.active {
    outline: 0;
    color: #999999;
}

*:focus {
    outline: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    text-transform: uppercase;
    font-family: 'Open Sans', sans-serif;
    font-weight: 700;
}

hr.star-light,
hr.star-primary {
    margin: 25px auto 30px;
    padding: 0;
    max-width: 250px;
    border: 0;
    border-top: solid 5px;
    text-align: center;
}

hr.star-light:after,
hr.star-primary:after {
    content: "\f005";
    display: inline-block;
    position: relative;
    top: -.8em;
    padding: 0 .25em;
    font-family: FontAwesome;
    font-size: 2em;
}

hr.star-light {
    border-color: #fff;
}

hr.star-light:after {
    color: #fff;
    background-color: #2aadfc;
}

hr.star-primary {
    border-color: #2c3e50;
}

hr.star-primary:after {
    color: #2c3e50;
    background-color: #fff;
}

#top-bar{
	z-index:200;
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:3px;
/*background: #00c1ff; /* Old browsers */
/*background: -moz-linear-gradient(left, #00c1ff 0%, #005eff 44%, #dc00a5 93%, #dc00a5 93%); /* FF3.6-15 */
/*background: -webkit-linear-gradient(left, #00c1ff 0%,#005eff 44%,#dc00a5 93%,#dc00a5 93%); /* Chrome10-25,Safari5.1-6 */
/*background: linear-gradient(to right, #00c1ff 0%,#005eff 44%,#dc00a5 93%,#dc00a5 93%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
/*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00c1ff', endColorstr='#dc00a5',GradientType=1 ); /* IE6-9 */
}

.img-centered {
    margin: 0 auto;
}

header {
    text-align: center;
    color: #fff;
    background: #ececec;
	display:block;
	z-index:-1;
	
}

header .container {
    padding-top: 100px;
    padding-bottom: 50px;
}

header img {
    display: block;
    margin: 0 auto 20px;
}



header .intro-text .skills {
    font-size: 1.25em;
    font-weight: 300;
}

.header-sec{
	position:relative;
	height:75vh;
}

.header-img{
	position:absolute;
	float:left;
}

#main-color-dot{
	left:17%;
	top:10%;
	width: 460px;
	height: 460px;
	-moz-border-radius: 230px;
	-webkit-border-radius: 230px;
	border-radius: 230px;
}

.main-gray-dot{
	left:30%;
	top:20%;
}
.dot1{
	left:47%;
	top:39%;
}

.dot2{
	left:80%;
	top:3%;
}
.dot3{
	left:13%;
	top:30%;
}
.dot4{
	left:48%;
	top:12%;
}
.dot5{
	left:10%;
	top:55%;
}
.dot6{
	left:78%;
	top:16%;
}
.dot7{
	left:0%;
	top:74%;
}
.dot8{
	left:20%;
	top:56%;
}
.dot9{
	left:14%;
	top:54%;
}
.dot10{
	left:9.5%;
	top:60%;
}
.dot11{
	left:5%;
	top:44%;
}
.dot12{
	left:22%;
	top:2%;
}
.dot13{
	left:82%;
	top:29%;
}
.dot14{
	left:83%;
	top:0%;
}
.dot15{
	left:90%;
	top:54%;
}
.dot16{
	left:86%;
	top:58%;
}
.dot17{
	left:20%;
	top:74%;
}
.dot18{
	left:4%;
	top:52%;
}
.dot19{
	left:12%;
	top:65%;
}
.dot20{
	left:70%;
	top:17%;
}
.plus1{
	left:40%;
	top:57%;
}
.plus2{
	left:25%;
	top:18%;
}
.plus3{
	width:1.2%;
	left:14%;
	top:57%;
}
.plus4{
	width:1.3%;
	left:79%;
	top:20%;
}
.gplus1{
	left:87%;
	top:4%;
}
.gplus2{
	left:1%;
	top:69%;
}
.gplus3{
	width:1%;
	left:85%;
	top:43%;
}
.header-caption{
	left:55%;
	top:64%;
}

.about-header{
	margin-top:-10%;
	margin-left:-2%;
}

.work-header{
	text-align:right;
	right:-3%;
	position:absolute;
}
.contact-header{
	z-index:-2 !important;
	margin-left:-2%;
}

#gradient-line{
	height:1.1px;
	margin-top:7px;
	/*background: #00c1ff; /* Old browsers */
	/*background: -moz-linear-gradient(left, #00c1ff 0%, #005eff 44%, #dc00a5 93%, #dc00a5 93%); /* FF3.6-15 */
	/*background: -webkit-linear-gradient(left, #00c1ff 0%,#005eff 44%,#dc00a5 93%,#dc00a5 93%); /* Chrome10-25,Safari5.1-6 */
	/*background: linear-gradient(to right, #00c1ff 0%,#005eff 44%,#dc00a5 93%,#dc00a5 93%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	/*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00c1ff', endColorstr='#dc00a5',GradientType=1 ); /* IE6-9 */
}
.about-copy-wrapper{
	margin:6% 0 2% 0;
	font-family: 'Open Sans', sans-serif !important;
	font-weight: 300;
	color:#999999;
}
.about-copy p{
	padding-left:5%;
	padding-right:15%;
	font-size:0.9em;
	letter-spacing:1px;
}

#work{
	background-color:#ececec;
	position:relative;
	overflow:hidden !important;
	z-index:1;
}

.work-dot1{
	position:absolute;
	left:4%;
	top:20%;
}

.work-plus1{
	position:absolute;
	margin-left:6%;
	top:25%;
}

.work-dot2{
	position:absolute;
	left:20%;
	top:30%;
}
#work-dot3{
	position:absolute;
	left:19.5%;
	top:40%;
	width: 30px;
	height: 30px;
	-moz-border-radius: 15px;
	-webkit-border-radius: 15px;
	border-radius: 15px;
}

.work-dot4{
	position:absolute;
	left:17%;
	top:60%;
}
.work-dot5{
	position:absolute;
	right:-30%;
	top:90%;
}
#work-dot6{
	position:absolute;
	right:-10%;
	top:20%;
	width: 50px;
	height: 50px;
	-moz-border-radius: 25px;
	-webkit-border-radius: 25px;
	border-radius: 25px;
}

/*work slider*/
.slider {
        width: 70%;
        margin: 100px auto;
    }

    .slick-slide {
      margin: 0px 20px;
    }

    .slick-slide img {
      width: 100%;
    }

    .slick-prev:before,
    .slick-next:before {
        color: black;
    }
	
.color-border-wrapper{
	position:absolute;
	height:432px;
	left:0;
	top:27%;
	width:100%;
}
.color-border{
	position:relative;
	margin:0 auto;
	z-index:5;
	height: 432px;
	width:680px;
	margin-top:30px;
	margin-left:auto;
	pointer-events: none;
	border-top: 1px solid #3ACFD5;
    border-bottom: 1px solid #3a4ed5;
   -webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
    box-sizing: border-box;
    background-position: 0 0, 100% 0;
    background-repeat: no-repeat;
   -webkit-background-size: 1px 100%;
   -moz-background-size: 1px 100%;
    background-size: 1px 100%;
    background-image: url(data:image/svg+xml;  base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiB2aWV3Qm94PSIwIDAgMSAxIiBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJub25lIj48bGluZWFyR3JhZGllbnQgaWQ9Imxlc3NoYXQtZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPjxzdG9wIG9mZnNldD0iMCUiIHN0b3AtY29sb3I9IiMzYWNmZDUiIHN0b3Atb3BhY2l0eT0iMSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzNhNGVkNSIgc3RvcC1vcGFjaXR5PSIxIi8+PC9saW5lYXJHcmFkaWVudD48cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2xlc3NoYXQtZ2VuZXJhdGVkKSIgLz48L3N2Zz4=),url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiB2aWV3Qm94PSIwIDAgMSAxIiBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJub25lIj48bGluZWFyR3JhZGllbnQgaWQ9Imxlc3NoYXQtZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPjxzdG9wIG9mZnNldD0iMCUiIHN0b3AtY29sb3I9IiMzYWNmZDUiIHN0b3Atb3BhY2l0eT0iMSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzNhNGVkNSIgc3RvcC1vcGFjaXR5PSIxIi8+PC9saW5lYXJHcmFkaWVudD48cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2xlc3NoYXQtZ2VuZXJhdGVkKSIgLz48L3N2Zz4=);
    background-image: -webkit-linear-gradient(top, #3acfd5 0%, #3a4ed5 100%), -webkit-linear-gradient(top, #3acfd5 0%, #3a4ed5 100%);
    background-image: -moz-linear-gradient(top, #3acfd5 0%, #3a4ed5 100%), -moz-linear-gradient(top, #3acfd5 0%, #3a4ed5 100%);
    background-image: -o-linear-gradient(top, #3acfd5 0%, #3a4ed5 100%), -o-linear-gradient(top, #3acfd5 0%, #3a4ed5 100%);
    background-image: linear-gradient(to bottom, #3acfd5 0%, #3a4ed5 100%), linear-gradient(to bottom, #3acfd5 0%, #3a4ed5 100%);

}


/*---------- Hover Effect---------*/ 
.hovereffect {
  width: 100%;
  height: 100%;
  float: left;
  overflow: hidden;
  position: relative;
  text-align: center;
  cursor: default;
  /*background: -webkit-linear-gradient(45deg, #9b0074 0%, #016f95 100%);
  background: linear-gradient(45deg, #9b0074 0%,#016f95 100%);*/ 
}


.hovereffect .overlay {
  width: 100%;
  height: 100%;
  position: absolute;
  overflow: hidden !important;
  top: 0;
  left: 0;
  padding: 3em;
  text-align: left;
}


.hovereffect img {
  display: block;
  position: relative;
  max-width: none;
  width: calc(100% + 20px);
  -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
  transition: opacity 0.35s, transform 0.35s;
  -webkit-transform: translate3d(-10px,0,0);
  transform: translate3d(-10px,0,0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}



.hovereffect h2 {
  text-transform: uppercase;
  color: #fff;
  font-weight:100;
  letter-spacing:1px;
  position: relative;
  font-size:1.6em;
  background-color: transparent;
  padding: 23% 0 10px 0;
  text-align: left;
  opacity: 0;
  filter: alpha(opacity=0);
  -webkit-transition: opacity 0.35s, -webkit-transform 0.45s;
  transition: opacity 0.35s, transform 0.45s;
  -webkit-transform: translate3d(-10px,0,0);
  transform: translate3d(-10px,0,0);
}


.hovereffect .overlay:before {
  position: absolute;
  top: 52%;
  right: 20px;
  bottom: 20px;
  left:7%;
  width: 30%;
  height: 1px;
  background: #fff;
  content: '';
  -webkit-transition: -webkit-transform 0.35s;
  transition: transform 0.35s;
  -webkit-transform: translate3d(-150%,0,0);
  transform: translate3d(-150%,0,0);
}


.hovereffect a, .hovereffect p {
  color: #FFF;
  opacity: 0;
  filter: alpha(opacity=0);
  -webkit-transition: opacity 0.35s, -webkit-transform 0.45s;
  transition: opacity 0.35s, transform 0.45s;
  -webkit-transform: translate3d(-10px,0,0);
  transform: translate3d(-10px,0,0);
}


.hovereffect:hover img {
  opacity: 0.3;
  filter: alpha(opacity=60);
  -webkit-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
}

.hovereffect:hover .overlay:before,
.hovereffect:hover a, .hovereffect:hover p, .hovereffect:hover h2 {
  opacity: 1;
  filter: alpha(opacity=100);
  -webkit-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
  
}

.hovereffect:hover a{
	text-transform: lowercase !important;
}


.overlay p a{
	text-decoration:none;
	font-size:0.8em;
	font-weight:100;
	letter-spacing:1px;
	
}

/*----------End of Hover Effect---------*/ 

.contact-content{
	margin-top: 100px;
}

.btn{
	border-width:0px !important;
}

.btn-lg{
	border-radius: none !important;
	padding: 7px 0 !important;
}
#btn-success{
	color: #999;
	background-color:white !important;
	border-color:none;
	float:right;
	letter-spacing:2px;
	text-transform:uppercase;
	font-size:1.2em;
	font-weight:100;
	font-family: 'Open Sans', sans-serif !important;
}

#btn-bar{
	width:100%;
	height:1px;
	float:right;
	margin-top:6px; 
}
.form-bar{
	width:100%;
	height:1px;
}
.text-danger, .text-danger:hover{
	color:#2aadfc;
	font-weight:100;
	font-family: 'Open Sans', sans-serif !important;
	font-size:1em;
}





@media(max-width:1199px) {
	.color-border-wrapper{
	height:333px;
	top:30.5%;
	}
	.color-border{
		height:333px;
	    width:529px;
	}
		
}

@media(max-width:991px) {
	.color-border-wrapper{
	height:241px;
	top:34.5%;
	}
	.color-border{
		height:241px;
	    width:375px;
	}
		
}

@media(min-width:768px) {
    header .container {
        padding-top: 200px;
        padding-bottom: 100px;
    }

    

    header .intro-text .skills {
        font-size: 1.75em;
    }
	
}

@media(min-width:768px) {
    .navbar-fixed-top {
        padding: 45px 0;
        -webkit-transition: padding .3s;
        -moz-transition: padding .3s;
        transition: padding .3s;
    }

    .navbar-fixed-top .navbar-brand {
        font-size: 2em;
        -webkit-transition: all .3s;
        -moz-transition: all .3s;
        transition: all .3s;
    }

    .navbar-fixed-top.navbar-shrink {
        padding: 10px 0;
    }

    .navbar-fixed-top.navbar-shrink .navbar-brand {
        font-size: 1.5em;
    }
}

.navbar {
    text-transform: uppercase;
    font-family: 'Open Sans', sans-serif;
    font-weight: 300;
}

.navbar a:focus {
    outline: 0;
}

.navbar .navbar-nav {
    letter-spacing: 1px;
}

.navbar .navbar-nav li a:focus {
    outline: 0;
}

.navbar-default,
.navbar-inverse {
    border: 0;
}

section {
    padding: 100px 0;
}

section h2 {
    margin: 0;
    font-size: 3em;
}

section.success {
    color: #fff;
    background: #2aadfc;
}

section.success a,
section.success a:hover,
section.success a:focus,
section.success a:active,
section.success a.active {
    outline: 0;
    color: #2c3e50;
}

@media(max-width:767px) {
    section {
        padding: 75px 0;
    }

    section.first {
        padding-top: 75px;
    }
}

#about{
	overflow:hidden !important;
}
#about .about-item {
    right: 0;
    margin: 0 0 15px;
}

#about .about-item .about-link {
    display: block;
    position: relative;
    margin: 0 auto;
    max-width: 400px;
}

#about .about-item .about-link .caption {
    position: absolute;
    width: 100%;
    height: 100%;
    opacity: 0;
    background: rgba(24,188,156,.9);
    -webkit-transition: all ease .5s;
    -moz-transition: all ease .5s;
    transition: all ease .5s;
}

#about .about-item .about-link .caption:hover {
    opacity: 1;
}

#about .about-item .about-link .caption .caption-content {
    position: absolute;
    top: 50%;
    width: 100%;
    height: 20px;
    margin-top: -12px;
    text-align: center;
    font-size: 20px;
    color: #fff;
}

#about .about-item .about-link .caption .caption-content i {
    margin-top: -12px;
}

#about .about-item .about-link .caption .caption-content h3,
#about .about-item .about-link .caption .caption-content h4 {
    margin: 0;
}

#about{
	position:relative;
    z-index: 1000000;
	background-color:white;
}

#map iframe{
	width:100%;
	height:450px;
	margin:0px !important;
	padding:0px !important;
}
#map{
	height:450px !important;
}


@media(min-width:767px) {
    #about .about-item {
        margin: 0 0 30px;
    }
	
}

.btn-outline {
    margin-top: 15px;
    border: solid 2px #fff;
    font-size: 20px;
    color: #fff;
    background: 0 0;
    transition: all .3s ease-in-out;
}

.btn-outline:hover,
.btn-outline:focus,
.btn-outline:active,
.btn-outline.active {
    border: solid 2px #fff;
    color: #2aadfc;
    background: #fff;
}

.floating-label-form-group {
    position: relative;
    margin-bottom: 0;
    padding-bottom:0;
   /* border-bottom: 1px solid #eee;*/
	
	font-family: 'Open Sans', sans-serif !important;
}

.floating-label-form-group input,
.floating-label-form-group textarea {
    z-index: 1;
    position: relative;
    padding-right: 0;
    padding-left: 0;
    border: 0;
    border-radius: 0;
    background: 0 0;
    box-shadow: none!important;
    resize: none;
	font-size:1.2em;
	font-family: 'Open Sans', sans-serif !important;
	font-weight:100;
}

.floating-label-form-group label {
    display: block;
    z-index: 0;
    position: relative;
    top: 2em;
    margin: 0;
    font-size: .85em;
    line-height: 1.764705882em;
    vertical-align: middle;
    vertical-align: baseline;
    opacity: 0;
    -webkit-transition: top .3s ease,opacity .3s ease;
    -moz-transition: top .3s ease,opacity .3s ease;
    -ms-transition: top .3s ease,opacity .3s ease;
    transition: top .3s ease,opacity .3s ease;
}

.floating-label-form-group::not(:first-child) {
    padding-left: 14px;
    border-left: 1px solid #eee;
}

.floating-label-form-group-with-value label {
    top: 0;
    opacity: 1;
}

.floating-label-form-group-with-focus label {
    color: #2aadfc;
}

form .row:first-child .floating-label-form-group {
    border-top: 0;
}

footer {
    color: #fff;
}

footer h3 {
    margin-bottom: 30px;
}

footer .footer-above {
    padding-top: 50px;
    background-color: #2c3e50;
}

footer .footer-col {
    margin-bottom: 50px;
}

footer #footer-below {
    padding: 25px 0;
	font-family: 'Open Sans', sans-serif !important;
	font-weight:100;
	color: #999;
}
#footer-bar{
	width:100%;
	height:3px;
	position:fixed;
	bottom:0;
	z-index:100000000!important;
}

.btn-social {
    display: inline-block;
    width: 50px;
    height: 50px;
    border: 2px solid #fff;
    border-radius: 100%;
    text-align: center;
    font-size: 20px;
    line-height: 45px;
}

.btn:focus,
.btn:active,
.btn.active {
    outline: 0;
}

.scroll-top {
    z-index: 1049;
    position: fixed;
    right: 2%;
    bottom: 2%;
    width: 50px;
    height: 50px;
}

.scroll-top .btn {
    width: 50px;
    height: 50px;
    border-radius: 100%;
    font-size: 20px;
    line-height: 28px;
}

.scroll-top .btn:focus {
    outline: 0;
}

.about-modal .modal-content {
    padding: 100px 0;
    min-height: 100%;
    border: 0;
    border-radius: 0;
    text-align: center;
    background-clip: border-box;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.about-modal .modal-content h2 {
    margin: 0;
    font-size: 3em;
}

.about-modal .modal-content img {
    margin-bottom: 30px;
}

.about-modal .modal-content .item-details {
    margin: 30px 0;
}

.about-modal .close-modal {
    position: absolute;
    top: 25px;
    right: 25px;
    width: 75px;
    height: 75px;
    background-color: transparent;
    cursor: pointer;
}

.about-modal .close-modal:hover {
    opacity: .3;
}

.about-modal .close-modal .lr {
    z-index: 1051;
    width: 1px;
    height: 75px;
    margin-left: 35px;
    background-color: #2c3e50;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

.about-modal .close-modal .lr .rl {
    z-index: 1052;
    width: 1px;
    height: 75px;
    background-color: #2c3e50;
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
}

.about-modal .modal-backdrop {
    display: none;
    opacity: 0;
}

.contact-left, .contact-right{
	position:relative;
	float:left;
}

.contact-left{
	margin-right:2%;
	width:39%;
}

.contact-right{
	width:59%;
}

.contact-left h1{
  font-size:1.2em;
  color:#999999;
  font-weight:400;
  text-transform:capitalize;
  letter-spacing:1px;
  margin-bottom:30px;
}

.contact-left p, .contact-left a{
  margin-top:20px;
  font-size:0.9em;
  color:#999999;
  font-weight:300;
  letter-spacing:1px;
  margin-bottom:50px;
}



.pre-pro .animsition-link:link{
	
}

/*-------------responsive-modification---------------------*/
@media only screen and (max-width: 1204px){
/*------ABOUT SECTION-------*/
	
#gradient-line{
		display:none !important;
	}
	
.about-copy p {
    padding-left: 0;
    padding-right: 0;
}

.about-header{
	margin-top:-100px;
	margin-left:0;
}
/*------WORK SECTION-------*/

.hovereffect h2{
 padding:20% 0 10px 0;
}
.header-caption{
	   top:20%;
	  }

}

@media only screen and (max-width: 991px){
	.about-header{
		width:80%;
	}
	
	.work-header{
		width:77%;
	}
	.scroll-top.btn a, .btn-primary, .scroll-top{
		z-index:10000000 !important;
	}
	
	/*------WORK SECTION-------*/
        .hovereffect .overlay:before{
			width:80%;
			text-align:center;
			margin-left:auto;
			margin-right:auto;
		}
		
		.hovereffect h2{
		 padding-top:16%;
		 font-size:1.1em;
		 margin-bottom:10px;
		 text-align:center;
		}
		
		.overlay p a{
			text-align:center;
			position:relative;
			margin-left:28%;
			
		}
			
}


@media only screen and (max-width: 887px){
	.header-caption{
		left:40%;
	}
}

@media only screen and (max-width: 770px){
	.hovereffect h2{
		 padding-top:14%;
	}
	
	.slick-slide{
		margin:44px 20px;
	}
	
	.navbar-header{
		padding:30px 10px;
	}
	.navbar-default .navbar-toggle{
		background-color:none !important;
		border-color:white !important;
		color: #999;
	}
	
	.navbar-toggle a:hover{
		background-color:none !important;
	}
	
	.navbar-default .navbar-nav>li>a{
		padding:10px 30px;
	}
	
	.contact-left, .contact-right{
		width:100%;
		position:relative;
		padding:0 10%;
		
	}
	
	 .contact-wrap-mobile{
		position:relative;
		float:left;
		width:49%;
		margin-rgiht:2%;
	}
}

@media only screen and (max-width: 731px){
  
    .slick-dotted.slick-slider {
    margin-bottom: 20px;
    }
	
	.slick-slide {
   
    padding: 0 7px !important;
   }
   
}



@media only screen and (max-width: 685px){
  
    .slick-dotted.slick-slider {
    margin-bottom: 10px;
    }
	
	.slick-slide {
   
    padding: 0 3px !important;
	margin-left:5px !important;
	margin-right:5px !important;
   }
   
   .header-caption{
	   left:30%;
	   top:20%;
	  }
	 
}

@media only screen and (max-width: 660px){
.color-border-wrapper{display:none;}
}

@media only screen and (max-width: 650px){
 .hovereffect h2{
		 padding-top:14%;
		 font-size:1em;
		 margin-bottom:6px;
		 text-align:center;
		}
.header-caption{
	     top:20%;
	  }
		
}


@media only screen and (max-width: 591px){
 .hovereffect h2{
		 padding-top:13%;
		 font-size:0.9em;
		 margin-bottom:6px;
		 text-align:center;
		}
		
		.overlay p a{
			font-size:0.7em;
			
		}
		.slick-slide {
			width:130%;
		}
		 .header-caption{
	   left:20%;
	  }
	  #main-color-dot{
		left:14%;
		top:10%;
		width: 430px;
		height: 430px;
		-moz-border-radius: 215px;
		-webkit-border-radius: 215px;
		border-radius: 215px;
	}
	
	.main-gray-dot{
		left:28%;
		top:18%;
	}
	.header-caption{
	     top:18%;
	  }
	
}


@media only screen and (max-width: 562px){
 .hovereffect h2{
		 padding-top:13%;
		 font-size:0.8em;
		 margin-bottom:5px;
		}
		
		.overlay p a{
			font-size:0.6em;
			
		}
		
		#main-color-dot{
		left:10%;
		top:10%;
		width: 400px;
		height: 400px;
		-moz-border-radius: 200px;
		-webkit-border-radius: 200px;
		border-radius: 200px;
	}
	
	.main-gray-dot{
		left:25%;
		top:15%;
	}
	
	
}
@media only screen and (max-width: 510px){
 .header-caption{
	   left:10%;
	     top:10%;
	  }
}

@media only screen and (max-width: 449px){
 .header-caption{
	   left:5%;
	   width:85%;
	   top:10%;
	  }
	  #main-color-dot{
		left:5%;
		width: 380px;
		height: 380px;
		-moz-border-radius:190px;
		-webkit-border-radius: 190px;
		border-radius: 190px;
	}
	
	.main-gray-dot{
		left:20%;
		top:10%;
	}
}