/* 

	AVALITH CSS
	
	1. CORE CSS
	2. NAVIGATION
	3. FULLSCREEN SLIDER
	4. WELCOME
	5. ABOUT
	6. TEAM
	7. MILESTONE
	8. PROCESS
	9. TESTIMONIAL
	10. SERVICES
	11. WORKS
	12. HIGHLIGHT
	13. CLIENTS
	14. CONTACT
	15. MISC.
		A. Form Elements
		B. Buttons
		C. Preloader
		D. Image Overlay
		E. Text Rotator

*/





/* CORE CSS */

@font-face {
    font-family: 'misobold';
    src: url('../fonts/miso-bold-webfont.eot');
    src: url('../fonts/miso-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/miso-bold-webfont.woff') format('woff'),
         url('../fonts/miso-bold-webfont.ttf') format('truetype'),
         url('../fonts/miso-bold-webfont.svg#misobold') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'misolight';
    src: url('../fonts/miso-light-webfont.eot');
    src: url('../fonts/miso-light-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/miso-light-webfont.woff') format('woff'),
         url('../fonts/miso-light-webfont.ttf') format('truetype'),
         url('../fonts/miso-light-webfont.svg#misolight') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'misoregular';
    src: url('../fonts/miso-regular-webfont.eot');
    src: url('../fonts/miso-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/miso-regular-webfont.woff') format('woff'),
         url('../fonts/miso-regular-webfont.ttf') format('truetype'),
         url('../fonts/miso-regular-webfont.svg#misoregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

body {
	color:#333333;
	font-family:'Source Sans Pro';
	font-size:1.4em;
	font-weight:300;
	line-height:1.5em;
	letter-spacing:1px;
	overflow-x:hidden;
	-webkit-font-smoothing: antialiased;
}

section {
	padding:35px 0;
}

h2 {
	color:#1a1a1a;
	font-family:misoregular;
	font-size:31px;
	margin-top:0;
}

h3 {
	color:#1a1a1a;
	font-family:misoregular;
	font-size:30px;
}

h4 {
	color:#999999;
	font-family:marvel;
	font-size:20px;
	font-weight:400;	
}

.subhead {
	color:#999999;
	font-family:marvel;
	font-size:22px;
	font-weight:700;
	letter-spacing:2px;
	line-height:22px;
	margin:0 0 50px 0;
}

.uppercase {
	text-transform:uppercase;
}


/* NAVIGATION */

.navbar {
	-webkit-transition: background .5s ease-in-out,padding .5s ease-in-out;
	   -moz-transition: background .5s ease-in-out,padding .5s ease-in-out;
	        transition: background .5s ease-in-out,padding .5s ease-in-out;
}

.navbar-custom {
	color:#ffffff;
	background:transparent;
	font-family:misolight;
	font-size:17px;
	font-weight:300;
	letter-spacing:1px;
	border-radius:0;
	z-index:50; */
}

.navbar-custom a {
	color:inherit;
}

.navbar-custom .navbar-nav > li > a:hover {
	color:#c3ac6d;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}

.navbar-custom .navbar-toggle {
	background:#ffffff;
	position:relative;
}

.navbar-custom .navbar-toggle .icon-bar {
	background:#1a1a1a;
}

.top-nav-collapse {
	color:#1a1a1a;
	background:rgba(255,255,255, 0.85);
	z-index:50;
	padding:0;
}

.navbar-custom .navbar-brand {
	font-family:misoregular;
	font-size:23px;
	font-weight:400;
}


/* FULLSCREEN SLIDER */

#slides {
	font-family:misoregular;
	font-weight:350;
}

#slides  .container {
	display:table-cell;
	vertical-align:middle;
	width:100%;
}

#slides h1 {
	font-size:5em;
	color:#ffffff;
}

#slides .lead {
	font-size:2em;
	color:#ffffff;
}


/* WELCOME */

#welcome {
	padding:70px 0;
}

#welcome h1 {
	font-size:3em;
	font-family:'misolight';
	letter-spacing:0;
}

#welcome .rotate {
	font-family:'misoregular';
}


/* ABOUT */

.about {
	background:#ececee;
	padding:15px 0;
}

#about p {
	margin-bottom:35px;
}

.about-img {
	color:#ffffff;
	background-color:#999999;
	width: 100%;
	height:500px;
	display:table;
	overflow: hidden;
	z-index: 0;
	background:url(../img/about.jpg) bottom center no-repeat fixed;
	-webkit-background-size:cover;
	-moz-background-size:cover;
	background-size:cover;
}

.about-img h2,
.about-img .subhead {
	color:#ffffff;
}

.about-img #head {
	display:table-cell;
	vertical-align:middle;
}


/* TEAM */

#team {
	padding:70px 0;
}

#team-slider .item {
	margin:0 15px;
}

#team .owl-theme .owl-controls .owl-buttons div {
	color:#1a1a1a;
}


/* MILESTONE */

#milestone {
	width: 100%;
	overflow: hidden;
	z-index: 0;
	height:auto;
	min-height:250px;
	background-color:#ececee;
}

.milestone {
	margin:65px 0;
	text-transform:uppercase;
}

.milestone .timer {
	font-family:Montserrat;
	font-size:63px;
	font-weight:400;
	line-height:65px;
}

.milestone p {
	font-size:20px;
	font-family:'misobold';
	font-weight:400;
	letter-spacing:2px;
}


/* SECTION PROCESS */

#process {
	padding:70px 0;
}

.number {
	font-family:misobold;
	font-size:50px;
	border-bottom: 2px solid #1a1a1a;
	vertical-align:middle;
}

#process h3 {
	border-bottom:1px solid #555555;
}

#process i {
	
}


/* TESTIMONIAL */

#testimonial {
	color:#ffffff;
	background-color:#333333;
	padding:55px 0 35px 0;
	width:100%;
	overflow: hidden;
	z-index:0;
	height:auto;
	background:url(../img/testimonial-bg.jpg) bottom center no-repeat fixed;
	-webkit-background-size:cover;
	-moz-background-size:cover;
	background-size:cover;
}

#testimonial img {
	position:absolute;
}


#testimonial p {
	font-size:31px;
	font-family:'Montserrat';
	letter-spacing:-1px;
	line-height:35px;
	padding-top:50px;
	margin-left:20px;
}

#testimonial h4 {
	color:#1a1a1a;
	font-family:misoregular;
	font-size:27px;
	margin:35px 0 0 20px;
	letter-spacing:1px;
}

#testimonial .owl-theme .owl-controls{
	float:right;
}

/* SERVICES */

#services {
	color:#999;
}

.service {
	float: none;
	display: inline-table;
}

#services h3 {
	margin-top:0;
}

#services i {
	color:#1a1a1a;
	float:left;
	margin:0px 10px 120px 0;
	width:65px;
	text-align:center;
}


/* WORKS 

   if you want any change on portfolio, please go cubeportfolio.css */
   
   
/* HIGHLIGHT */

#highlight {
	color:#ffffff;
	background:#1a1a1a;
	padding:50px 0;
}

#highlight .lead {
	color:#c3ac6d;
	font-family:'misolight';
	font-size:30px;
	margin:15px 0 0 0;
}

#highlight .button {
	margin:10px;
}


/* CLIENTS */

#clients {
	padding:80px 0 50px 0;
}


/* CONTACT */
#contact {
	font-size:16px;
	padding-top:0;
}

#contact p {
	float:left;
}

#contact .subhead {
	margin-bottom:20px;
}

#contact .address {
	float:inherit;
	margin:10px 0;
	display:block;
}

#contact .button {
	font-size:16px;
	margin:0;
	width:100%;
}

.address i {
	float:left;
	width:50px;
	text-align:center;
}

#gmap_canvas {
	height:500px;
	width:100%;
	margin-bottom:30px;
}

#gmap_canvas img{
	max-width:none!important;
	background:none!important
}


/* FOOTER */

footer {
	background:#ececee;
	padding:20px 0;
	margin:30px 0 0 0; 
}

footer h4 {
	color:#1a1a1a;
	font-family:'misoregular';
}

.social {
	margin:10px 0;
}

.social a {
	color:rgba(26, 26, 26, .85);
	text-decoration:none;
	margin:0;
	padding:0;
}

.social a:hover{
	color:rgba(26, 26, 26, 1);
	text-decoration:none;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}


/* MISC */

/* FORM ELEMENTS */

input[type="text"],
input[type="email"],
textarea {
	color:#1a1a1a;
	font-size:20px;
	font-family:'misoregular';
	background:transparent;
	width:100%;
	min-height:30px;
	text-transform:uppercase;
	border:0;
	border-bottom:1px solid #1a1a1a;
	margin-bottom:30px;
	outline:none;
}


::-webkit-input-placeholder {
   color: #1a1a1a;
}

:-moz-placeholder { /* Firefox 18- */
   color: #1a1a1a;  
}

::-moz-placeholder {  /* Firefox 19+ */
   color: #1a1a1a;  
}

:-ms-input-placeholder {  
   color: #1a1a1a;  
}


/* BUTTONS */

.button {
	color: inherit;
	background: none;
	font-family:misoregular;
	font-size: 11px;
	font-weight: 400;
	letter-spacing: 2px;
	text-transform: uppercase;
	border: none;
	margin: 15px 0;
	padding: 5px 15px;
	display: inline-block;
	position: relative;
	outline: none;
	cursor: pointer;
	-webkit-border-radius:4px;
	   -moz-border-radius:4px;
	   		border-radius:4px;
		-webkit-transition: all 0.3s;
		   -moz-transition: all 0.3s;
	            transition: all 0.3s;
}

.button:after {
	content: '';
	position: absolute;
	z-index: -1;
	-webkit-transition: all 0.3s;
	   -moz-transition: all 0.3s;
	        transition: all 0.3s;
}

.button-big {
	padding:15px 25px;
	font-size:22px;
	border-radius:4px;
	-webkit-border-radius:4px;
	   -moz-border-radius:4px;
}

.button-border-light {
	border: 1px solid #ffffff;
	color: #ffffff;
}

.button-border-light:hover,
.button-border-light:active {
	color: #1a1a1a;
	background: #ffffff;
	text-decoration:none;
}

.button-border-dark {
	border: 1px solid #1a1a1a;
	color: #1a1a1a;
}

.button-border-dark:hover,
.button-border-dark:active {
	color: #ffffff;
	background: #1a1a1a;
	text-decoration:none;
}


/* PRELOAD */

#preload {
	background:#ececee;
	position: fixed;
	top:0;
	left:0;
	width: 100%;
	height: 100%; 
	z-index: 99;
	display:table;
}

.spinner {
  margin: 0 auto;
  width: 50px;
  height: 30px;
  text-align: center;
  font-size: 10px;
  display:table-cell;
  vertical-align:middle;
} 

.spinner > div {
  background-color: #1a1a1a;
  height: 60px;
  width: 6px;
  display: inline-block;
  
  
  -webkit-animation: stretchdelay 1.2s infinite ease-in-out;
  animation: stretchdelay 1.2s infinite ease-in-out;
}

.spinner .rect2 {
  -webkit-animation-delay: -1.1s;
  animation-delay: -1.1s;
}

.spinner .rect3 {
  -webkit-animation-delay: -1.0s;
  animation-delay: -1.0s;
}

.spinner .rect4 {
  -webkit-animation-delay: -0.9s;
  animation-delay: -0.9s;
}

.spinner .rect5 {
  -webkit-animation-delay: -0.8s;
  animation-delay: -0.8s;
}

@-webkit-keyframes stretchdelay {
  0%, 40%, 100% { -webkit-transform: scaleY(0.4) }  
  20% { -webkit-transform: scaleY(1.0) }
}

@keyframes stretchdelay {
  0%, 40%, 100% { 
    transform: scaleY(0.4);
    -webkit-transform: scaleY(0.4);
  }  20% { 
    transform: scaleY(1.0);
    -webkit-transform: scaleY(1.0);
  }
}


/* IMAGE OVERLAYS */

.imagewrap {
	display: block;
	overflow: hidden;
	position: relative;
}

.whitecircle {
	background-color: #ffffff;
	border: medium none;
	display: inline-block !important;
	float: none !important;
	font-size: 14px;
	font-weight: normal;
	height: 40px;
	line-height: 40px;
	margin: 0 2px;
	text-align: center;
	width: 40px;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	-ms-border-radius: 50%;
	-o-border-radius: 50%;
	border-radius: 50%;
	-webkit-box-shadow: 0 0 1px rgba(0, 0, 0, 0.5), inset 0 0 2px rgba(0, 0, 0, .1);
	-moz-box-shadow: 0 0 1px rgba(0, 0, 0, 0.5), inset 0 0 2px rgba(0, 0, 0, .1);
	-ms-box-shadow: 0 0 1px rgba(0, 0, 0, 0.5), inset 0 0 2px rgba(0, 0, 0, .1);
	-o-box-shadow: 0 0 1px rgba(0, 0, 0, 0.5), inset 0 0 2px rgba(0, 0, 0, .1);
	box-shadow: 0 0 1px rgba(0, 0, 0, 0.5), inset 0 0 2px rgba(0, 0, 0, .1);
}

.whitecircle > a {
	color: #1a1a1a;
	display: block;
	font-weight: normal;
}

.imagewrap .image-overlay {
	background: none repeat scroll 0 0 rgba(0, 0, 0, 0.5);
	bottom: 0;
	display: block;
	height: 100%;
	left: 0;
	opacity: 0;
	position: absolute;
	right: 0;
	top: 0;
	-webkit-transition: all 0.3s ease 0s;
	-moz-transition: all 0.3s ease 0s;
	-ms-transition: all 0.3s ease 0s;
	-o-transition: all 0.3s ease 0s;
	transition: all 0.3s ease 0s;
	width: 100%;
}

.imagewrap:hover .image-overlay {
	opacity: 1;
}

.imagewrap .buttons span {
	position: absolute;
}

.imagewrap .buttons span:nth-of-type(1) {
	bottom: 50%;
	top: 50%;
	left: 50%;
	margin: -20px 0 0 -82px;
	visibility: hidden;
	opacity: 0;
	-webkit-transition: all 0.3s ease 0s;
	-moz-transition: all 0.3s ease 0s;
	-ms-transition: all 0.3s ease 0s;
	-o-transition: all 0.3s ease 0s;
	transition: all 0.3s ease 0s;
}

.imagewrap .buttons span:nth-of-type(2) {
	bottom: 50%;
	top: 50%;
	right: 50%;
	margin: -20px -82px 0 0;
	visibility: hidden;
	opacity: 0;
	-webkit-transition: all 0.3s ease 0s
	;-moz-transition: all 0.3s ease 0s;
	-ms-transition: all 0.3s ease 0s;
	-o-transition: all 0.3s ease 0s;
	transition: all 0.3s ease 0s;
}

.imagewrap:hover .buttons span:nth-of-type(1) {
	margin: -20px 0 0 -42px;
	visibility: visible;
	opacity: 1;
}

.imagewrap:hover .buttons span:nth-of-type(2) {
	margin: -20px -42px 0 0;
	visibility: visible;
	opacity: 1;
}


/* TEXT ROTATOR */

.rotating {
  display: inline-block;
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
  -ms-transform-style: preserve-3d;
  -o-transform-style: preserve-3d;
  transform-style: preserve-3d;
  -webkit-transform: rotateX(0) rotateY(0) rotateZ(0);
  -moz-transform: rotateX(0) rotateY(0) rotateZ(0);
  -ms-transform: rotateX(0) rotateY(0) rotateZ(0);
  -o-transform: rotateX(0) rotateY(0) rotateZ(0);
  transform: rotateX(0) rotateY(0) rotateZ(0);
  -webkit-transition: 0.5s;
  -moz-transition: 0.5s;
  -ms-transition: 0.5s;
  -o-transition: 0.5s;
  transition: 0.5s;
  -webkit-transform-origin-x: 50%;
}

.rotating.flip {
  position: relative;
}

.rotating .front, .rotating .back {
  left: 0;
  top: 0;
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -ms-backface-visibility: hidden;
  -o-backface-visibility: hidden;
  backface-visibility: hidden;
}

.rotating .front {
  position: absolute;
  display: inline-block;
  -webkit-transform: translate3d(0,0,1px);
  -moz-transform: translate3d(0,0,1px);
  -ms-transform: translate3d(0,0,1px);
  -o-transform: translate3d(0,0,1px);
  transform: translate3d(0,0,1px);
}

.rotating.flip .front {
  z-index: 1;
}

.rotating .back {
  display: block;
  opacity: 0;
}

.rotating.spin {
  -webkit-transform: rotate(360deg) scale(0);
  -moz-transform: rotate(360deg) scale(0);
  -ms-transform: rotate(360deg) scale(0);
  -o-transform: rotate(360deg) scale(0);
  transform: rotate(360deg) scale(0);
}

.rotating.flip .back {
  z-index: 2;
  display: block;
  opacity: 1;
  
  -webkit-transform: rotateY(180deg) translate3d(0,0,0);
  -moz-transform: rotateY(180deg) translate3d(0,0,0);
  -ms-transform: rotateY(180deg) translate3d(0,0,0);
  -o-transform: rotateY(180deg) translate3d(0,0,0);
  transform: rotateY(180deg) translate3d(0,0,0);
}

.rotating.flip.up .back {
  -webkit-transform: rotateX(180deg) translate3d(0,0,0);
  -moz-transform: rotateX(180deg) translate3d(0,0,0);
  -ms-transform: rotateX(180deg) translate3d(0,0,0);
  -o-transform: rotateX(180deg) translate3d(0,0,0);
  transform: rotateX(180deg) translate3d(0,0,0);
}

.rotating.flip.cube .front {
  -webkit-transform: translate3d(0,0,100px) scale(0.9,0.9);
  -moz-transform: translate3d(0,0,100px) scale(0.85,0.85);
  -ms-transform: translate3d(0,0,100px) scale(0.85,0.85);
  -o-transform: translate3d(0,0,100px) scale(0.85,0.85);
  transform: translate3d(0,0,100px) scale(0.85,0.85);
}

.rotating.flip.cube .back {
  -webkit-transform: rotateY(180deg) translate3d(0,0,100px) scale(0.9,0.9);
  -moz-transform: rotateY(180deg) translate3d(0,0,100px) scale(0.85,0.85);
  -ms-transform: rotateY(180deg) translate3d(0,0,100px) scale(0.85,0.85);
  -o-transform: rotateY(180deg) translate3d(0,0,100px) scale(0.85,0.85);
  transform: rotateY(180deg) translate3d(0,0,100px) scale(0.85,0.85);
}

.rotating.flip.cube.up .back {
  -webkit-transform: rotateX(180deg) translate3d(0,0,100px) scale(0.9,0.9);
  -moz-transform: rotateX(180deg) translate3d(0,0,100px) scale(0.85,0.85);
  -ms-transform: rotateX(180deg) translate3d(0,0,100px) scale(0.85,0.85);
  -o-transform: rotateX(180deg) translate3d(0,0,100px) scale(0.85,0.85);
  transform: rotateX(180deg) translate3d(0,0,100px) scale(0.85,0.85);
}