/**
 *	=================================================================================================
 *
 *  [Main Stylesheet]
 *
 *	Project:		Flare - HTML Startup Landing Page
 *	Version:		1.0
 *	Last change:	01/26/2016
 *	Primary use:	Mobile App, Landing Page, Creative, Coporate, Business
 *	File Name: 		styles.css
 *	Author: 		Morad
 *	Description: This file is containing almost the all basic settings of the template except
 *				 for bootstrap, fontAwesome and owlCarousel. Both of them has its separated file.
 *				 This file is separated to detailed section tobe easy to be handled in
 *				  a quick way.
 *				  
 *				 The file is divided as listed below.
 *
 *	=================================================================================================
 *
 *	styles.css file is divided as the following:
 *
 *	( 01 ) - General Basics
 *	( 02 ) - Other Miscellaneous
 *	( 03 ) - Form Settings
 *	( 04 ) - Header
 *	( 05 ) - Logo and Nav
 *	( 06 ) - Main Content
 *	( 07 ) - Footer
 *	( 08 ) - Responsive Specifications
 *
 */








/**
 *	-------------------------------------------------------------------------------
 *	( 01 ) - General Basics
 *	-------------------------------------------------------------------------------
 *
 *  This part contains the general settings that you can change like general
 *  font-family, color, headings settings, paragraphs, .. etc.
 *
 *	------
 *
 *  General Basics divided to the following sections:
 *
 *	   |
 *	   |-->  [ 1 ] - Small Reset
 *	   |-->  [ 2 ] - Body
 *	   |-->  [ 3 ] - General Links
 *	   |-->  [ 4 ] - Headings
 *	   |-->  [ 5 ] - Paragraphs
 *	   |-->  [ 6 ] - Strong
 *	   |-->  [ 7 ] - Texts Highlighting Selection
 *
 */


/**
 *  [ 1 ] - Small Reset
 *	~~~~~~~~~~~~~~~~~~~~~
 */

body, ul, ol, h1,h3,h3,h4,h5,h6,form,li,p,input,select,legend,textarea,fieldset{ margin:0; padding:0;}


/**
 *  [ 2 ] - Body
 *	~~~~~~~~~~~~~~
 */

body {
	width: 100%;
	position: relative;
	font-size: 14px;
	font-family: 'Open Sans', sans-serif;
	line-height: 24px;
	background: #fff;
	color: #777;
}

#full-container {
	display: block;
	position: relative;
	right: 0;
	max-width: 100%;
	overflow: hidden;
	-webkit-transition: all 0.6s cubic-bezier(0.19, 1, 0.22, 1);
			transition: all 0.6s cubic-bezier(0.19, 1, 0.22, 1);
}


/**
 *  [ 3 ] - General Links
 *	~~~~~~~~~~~~~~~~~~~~~~~
 */

a, a img {
	outline: none !important;
	border: none;
}

a {
	text-decoration: none;
	color: #f17663;
	-webkit-transition: color 0.2s, background 0.2s ,border-color 0.2s, border-width 0.2s, padding 0.2s;
			transition: color 0.2s, background 0.2s ,border-color 0.2s, border-width 0.2s, padding 0.2s;
}

a:hover {
	text-decoration: none;
	color: #222;
}

a:focus {
	color: #f17663;
	text-decoration: none;
}

p a {
	border-bottom: 1px dotted transparent;
}

p a:hover {
	text-decoration: none;
	border-bottom: 1px dotted #222;
}


/**
 *  [ 4 ] - Headings
 *	~~~~~~~~~~~~~~~~~~
 */

h1, 
h2, 
h3, 
h4, 
h5, 
h6 {
	font-family: "Raleway", sans-serif;
	color: #222;
	font-weight: 700;
	letter-spacing: .1px;
	display: block;
	margin: 0;
	width: 100%;
}

h1 {
	font-size: 38px;
	line-height: 106%;
	padding-bottom: 25px;
}

h2 {
	font-size: 32px;
	line-height: 106%;
	padding-bottom: 25px;
}

h3 {
	font-size: 26px;
	line-height: 108%;
	padding-bottom: 23px;
}

h4 {
	font-size: 21px;
	line-height: 110%;
	padding-bottom: 20px;
}

h5 {
	font-size: 18px;
	line-height: 110%;
	padding-bottom: 22px;
}

h6 {
	font-size: 15px;
	line-height: 110%;
	padding-bottom: 22px;
}

h1 a, 
h2 a, 
h3 a, 
h4 a, 
h5 a, 
h6 a {
	text-decoration: none;
	color: #222;
}

h1 a:hover, 
h2 a:hover, 
h3 a:hover, 
h4 a:hover, 
h5 a:hover, 
h6 a:hover {
	color: #f17663;
}

h1 strong, 
h2 strong, 
h3 strong, 
h4 strong, 
h5 strong, 
h6 strong {
	font-weight: 700;
}

h1 small, 
h2 small, 
h3 small, 
h4 small, 
h5 small, 
h6 small {
	font-size: 60%;
	color: #777;
	line-height: 0;
}

/* Subheaders */

.subheader {
	font-weight: 300;
	display: block;
	color: #888;
	margin-bottom: 0;
	margin-top: -15px;
	padding-bottom: 60px; /* 25px */
}

h5.subheader, 
h6.subheader {
	font-weight: 400;
}

/* Light Headings */

.light-heading {

}

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

h2.light-heading {
	font-size: 38px;
}

h3.light-heading {
	font-size: 33px;
}

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

h5.light-heading {
	font-size: 23px;
}

h6.light-heading {
	font-size: 18px;
}

h1.light-heading, 
h2.light-heading, 
h3.light-heading {
	font-weight: 500;
	padding-bottom: 40px;
}

h4.light-heading, 
h5.light-heading, 
h6.light-heading {
	font-weight: 500;
	padding-bottom: 30px;
}

.light-heading + p {
	margin-top: -15px;
}

.light-heading.subheader + p {
	margin-top: 0;
}

/* Light Heading Subheader */

.light-heading.subheader {
	color: #888;
}

h1.light-heading.subheader, 
h2.light-heading.subheader, 
h3.light-heading.subheader,
h4.light-heading.subheader {
	font-weight: 200;
	padding-bottom: 30px;
}

h5.light-heading.subheader, 
h6.light-heading.subheader {
	font-weight: 300;
	padding-bottom: 25px;
}

h1.light-heading + .light-heading.subheader, 
h2.light-heading + .light-heading.subheader, 
h3.light-heading + .light-heading.subheader {
	margin-top: -27px;
}

h4.light-heading + .light-heading.subheader, 
h5.light-heading + .light-heading.subheader, 
h6.light-heading + .light-heading.subheader {
	margin-top: -15px;
}


/**
 *  [ 5 ] - Paragraphs
 *	~~~~~~~~~~~~~~~~~~~~
 */

p {
	padding-bottom: 10px;
}

/* Paragraphs Justify */

p.paragraph-justify {
text-align: justify;
}


/**
 *  [ 6 ] - Strong
 *	~~~~~~~~~~~~~~~~
 */

strong {
	color: #222;
	font-weight: 600;
}


/**
 *  [ 7 ] - Texts Highlighting Selection
 *	~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 */

::-moz-selection{
	background: #ddd;
	color: #000;
}

::selection {
	background: #ddd;
	color: #000;
}



/**
 *	-------------------------------------------------------------------------------
 *	( 02 ) - Other Miscellaneous
 *	-------------------------------------------------------------------------------
 *
 *  This part contains the website loading element and the content options
 *  like text alignment, element alignment, readmore link .. etc.
 *
 *	------
 *
 *  Others Miscellaneous divided to the following sections:
 *
 *	   |
 *	   |-->  [ 1 ] - Website Loading
 *	   |-->  [ 2 ] - Element Alignment
 *	   |-->  [ 3 ] - Text Alignment
 *	   |-->  [ 4 ] - Padding
 *	   |-->  [ 5 ] - Margin
 *	   |-->  [ 6 ] - Read More Link
 *	   |-->  [ 7 ] - Text Colored
 *	   |-->  [ 8 ] - Clear
 *
*/


/**
 *  [ 1 ] - Website Loading
 *	~~~~~~~~~~~~~~~~~~~~~~~~~
 */

#website-loading {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #fff;
	z-index: 9999999999;
	text-align: center;
	display: block;

}

.loading-effect{
	position: absolute;
	bottom: 50%;
	width: 100%;
	text-align: center;
	margin-bottom: -30px;
}

.loading-title {
	font-size: 14px;
	margin-top: 5px;
	display: block;
	letter-spacing: 2px;
	text-transform: uppercase;
}

/*!
 * Load Awesome v1.1.0 (http://github.danielcardoso.net/load-awesome/)
 * Copyright 2015 Daniel Cardoso <@DanielCardoso>
 * Licensed under MIT
 */

.la-ball-fall {
	color: #f17663 !important;
	/*margin: auto;*/
	display: inline-block !important;
}

.la-ball-fall,
.la-ball-fall > div {
    position: relative;
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
}
.la-ball-fall {
    display: block;
    font-size: 0;
    color: #fff;
}
.la-ball-fall.la-dark {
    color: #333;
}
.la-ball-fall > div {
    display: inline-block;
    float: none;
    background-color: currentColor;
    border: 0 solid currentColor;
}
.la-ball-fall {
    width: 54px;
    height: 18px;
}
.la-ball-fall > div {
    width: 10px;
    height: 10px;
    margin: 4px;
    border-radius: 100%;
    opacity: 0;
    -webkit-animation: ball-fall 1s ease-in-out infinite;
            animation: ball-fall 1s ease-in-out infinite;
}
.la-ball-fall > div:nth-child(1) {
    -webkit-animation-delay: -200ms;
            animation-delay: -200ms;
}
.la-ball-fall > div:nth-child(2) {
    -webkit-animation-delay: -100ms;
            animation-delay: -100ms;
}
.la-ball-fall > div:nth-child(3) {
    -webkit-animation-delay: 0ms;
            animation-delay: 0ms;
}
.la-ball-fall.la-sm {
    width: 26px;
    height: 8px;
}
.la-ball-fall.la-sm > div {
    width: 4px;
    height: 4px;
    margin: 2px;
}
.la-ball-fall.la-2x {
    width: 108px;
    height: 36px;
}
.la-ball-fall.la-2x > div {
    width: 20px;
    height: 20px;
    margin: 8px;
}
.la-ball-fall.la-3x {
    width: 162px;
    height: 54px;
}
.la-ball-fall.la-3x > div {
    width: 30px;
    height: 30px;
    margin: 12px;
}
/*
 * Animation
 */
@-webkit-keyframes ball-fall {
    0% {
        opacity: 0;
        -webkit-transform: translateY(-145%);
        	-ms-transform: translateY(-145%);
                transform: translateY(-145%);
    }
    10% {
        opacity: .5;
    }
    20% {
        opacity: 1;
        -webkit-transform: translateY(0);
        	-ms-transform: translateY(0);
                transform: translateY(0);
    }
    80% {
        opacity: 1;
        -webkit-transform: translateY(0);
        	-ms-transform: translateY(0);
                transform: translateY(0);
    }
    90% {
        opacity: .5;
    }
    100% {
        opacity: 0;
        -webkit-transform: translateY(145%);
        	-ms-transform: translateY(145%);
                transform: translateY(145%);
    }
}
@keyframes ball-fall {
    0% {
        opacity: 0;
        -webkit-transform: translateY(-145%);
           	-ms-transform: translateY(-145%);
                transform: translateY(-145%);
    }
    10% {
        opacity: .5;
    }
    20% {
        opacity: 1;
        -webkit-transform: translateY(0);
           	-ms-transform: translateY(0);
                transform: translateY(0);
    }
    80% {
        opacity: 1;
        -webkit-transform: translateY(0);
           	-ms-transform: translateY(0);
                transform: translateY(0);
    }
    90% {
        opacity: .5;
    }
    100% {
        opacity: 0;
        -webkit-transform: translateY(145%);
           	-ms-transform: translateY(145%);
                transform: translateY(145%);
    }
}


/**
 *  [ 2 ] - Element Alignment
 *	~~~~~~~~~~~~~~~~~~~~~~~~~~~
 */

.align-left {
	float: left;
	margin-right: 10px;
	margin-bottom: 10px;
	display: inline-block;
}

.align-right {
	float: right;
	margin-left: 10px;
	margin-bottom: 10px;
	display: inline-block;
}
div.align-left, div.align-right {
	margin-bottom: 10px;
	margin-top: 5px;
}


/**
 *  [ 3 ] - Text Alignment
 *	~~~~~~~~~~~~~~~~~~~~~~~~
 */

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

.text-align-left {
	text-align: left;
}

.text-align-right {
	text-align: right;
}


/**
 *  [ 4 ] - Padding
 *	~~~~~~~~~~~~~~~~~
 */

/* Top Padding */
.padding-top-10px { padding-top: 10px; }
.padding-top-20px { padding-top: 20px; }
.padding-top-30px { padding-top: 30px; }
.padding-top-40px { padding-top: 40px; }
.padding-top-50px { padding-top: 50px; }
.padding-top-60px { padding-top: 60px; }
.padding-top-70px { padding-top: 70px; }
.padding-top-80px { padding-top: 80px; }
.padding-top-90px { padding-top: 90px; }
.padding-top-100px { padding-top: 100px; }
.padding-top-110px { padding-top: 110px; }
.padding-top-120px { padding-top: 120px; }
.padding-top-130px { padding-top: 130px; }
.padding-top-140px { padding-top: 140px; }

/* Bottom Padding */
.padding-bottom-10px { padding-bottom: 10px; }
.padding-bottom-20px { padding-bottom: 20px; }
.padding-bottom-30px { padding-bottom: 30px; }
.padding-bottom-40px { padding-bottom: 40px; }
.padding-bottom-50px { padding-bottom: 50px; }
.padding-bottom-60px { padding-bottom: 60px; }
.padding-bottom-70px { padding-bottom: 70px; }
.padding-bottom-80px { padding-bottom: 80px; }
.padding-bottom-90px { padding-bottom: 90px; }
.padding-bottom-100px { padding-bottom: 100px; }
.padding-bottom-110px { padding-bottom: 110px; }
.padding-bottom-120px { padding-bottom: 120px; }
.padding-bottom-130px { padding-bottom: 130px; }
.padding-bottom-140px { padding-bottom: 140px; }

/* Left Padding */
.padding-left-10px { padding-left: 10px; }
.padding-left-20px { padding-left: 20px; }
.padding-left-30px { padding-left: 30px; }
.padding-left-40px { padding-left: 40px; }
.padding-left-50px { padding-left: 50px; }
.padding-left-60px { padding-left: 60px; }
.padding-left-70px { padding-left: 70px; }
.padding-left-80px { padding-left: 80px; }
.padding-left-90px { padding-left: 90px; }
.padding-left-100px { padding-left: 100px; }
.padding-left-110px { padding-left: 110px; }
.padding-left-120px { padding-left: 120px; }
.padding-left-130px { padding-left: 130px; }
.padding-left-140px { padding-left: 140px; }

/* Right Padding */
.padding-right-10px { padding-right: 10px; }
.padding-right-20px { padding-right: 20px; }
.padding-right-30px { padding-right: 30px; }
.padding-right-40px { padding-right: 40px; }
.padding-right-50px { padding-right: 50px; }
.padding-right-60px { padding-right: 60px; }
.padding-right-70px { padding-right: 70px; }
.padding-right-80px { padding-right: 80px; }
.padding-right-90px { padding-right: 90px; }
.padding-right-100px { padding-right: 100px; }
.padding-right-110px { padding-right: 110px; }
.padding-right-120px { padding-right: 120px; }
.padding-right-130px { padding-right: 130px; }
.padding-right-140px { padding-right: 140px; }

/* Top Bottom Padding */
.padding-top-bottom-10px { padding: 10px 0; }
.padding-top-bottom-20px { padding: 20px 0; }
.padding-top-bottom-30px { padding: 30px 0; }
.padding-top-bottom-40px { padding: 40px 0; }
.padding-top-bottom-50px { padding: 50px 0; }
.padding-top-bottom-60px { padding: 60px 0; }
.padding-top-bottom-70px { padding: 70px 0; }
.padding-top-bottom-80px { padding: 80px 0; }
.padding-top-bottom-90px { padding: 90px 0; }
.padding-top-bottom-100px { padding: 100px 0; }
.padding-top-bottom-110px { padding: 110px 0; }
.padding-top-bottom-120px { padding: 120px 0; }
.padding-top-bottom-130px { padding: 130px 0; }
.padding-top-bottom-140px { padding: 140px 0; }

/* Left Right Padding */
.padding-left-right-10px { padding: 0 10px; }
.padding-left-right-20px { padding: 0 20px; }
.padding-left-right-30px { padding: 0 30px; }
.padding-left-right-40px { padding: 0 40px; }
.padding-left-right-50px { padding: 0 50px; }
.padding-left-right-60px { padding: 0 60px; }
.padding-left-right-70px { padding: 0 70px; }
.padding-left-right-80px { padding: 0 80px; }
.padding-left-right-90px { padding: 0 90px; }
.padding-left-right-100px { padding: 0 100px; }
.padding-left-right-110px { padding: 0 110px; }
.padding-left-right-120px { padding: 0 120px; }
.padding-left-right-130px { padding: 0 130px; }
.padding-left-right-140px { padding: 0 140px; }

/* Responsive Padding [ That added for small devices < 992px ] */

@media (max-width: 992px) {
	/* Responsive Top Padding */
	.resp-padding-top-10px { padding-top: 10px; }
	.resp-padding-top-20px { padding-top: 20px; }
	.resp-padding-top-30px { padding-top: 30px; }
	.resp-padding-top-40px { padding-top: 40px; }
	.resp-padding-top-50px { padding-top: 50px; }
	.resp-padding-top-60px { padding-top: 60px; }
	.resp-padding-top-70px { padding-top: 70px; }
	.resp-padding-top-80px { padding-top: 80px; }
	.resp-padding-top-90px { padding-top: 90px; }
	.resp-padding-top-100px { padding-top: 100px; }
	.resp-padding-top-110px { padding-top: 110px; }
	.resp-padding-top-120px { padding-top: 120px; }
	.resp-padding-top-130px { padding-top: 130px; }
	.resp-padding-top-140px { padding-top: 140px; }

	/* Responsive Bottom Padding */
	.resp-padding-bottom-10px { padding-bottom: 10px; }
	.resp-padding-bottom-20px { padding-bottom: 20px; }
	.resp-padding-bottom-30px { padding-bottom: 30px; }
	.resp-padding-bottom-40px { padding-bottom: 40px; }
	.resp-padding-bottom-50px { padding-bottom: 50px; }
	.resp-padding-bottom-60px { padding-bottom: 60px; }
	.resp-padding-bottom-70px { padding-bottom: 70px; }
	.resp-padding-bottom-80px { padding-bottom: 80px; }
	.resp-padding-bottom-90px { padding-bottom: 90px; }
	.resp-padding-bottom-100px { padding-bottom: 100px; }
	.resp-padding-bottom-110px { padding-bottom: 110px; }
	.resp-padding-bottom-120px { padding-bottom: 120px; }
	.resp-padding-bottom-130px { padding-bottom: 130px; }
	.resp-padding-bottom-140px { padding-bottom: 140px; }

	/* Responsive Left Padding */
	.resp-padding-left-10px { padding-left: 10px; }
	.resp-padding-left-20px { padding-left: 20px; }
	.resp-padding-left-30px { padding-left: 30px; }
	.resp-padding-left-40px { padding-left: 40px; }
	.resp-padding-left-50px { padding-left: 50px; }
	.resp-padding-left-60px { padding-left: 60px; }
	.resp-padding-left-70px { padding-left: 70px; }
	.resp-padding-left-80px { padding-left: 80px; }
	.resp-padding-left-90px { padding-left: 90px; }
	.resp-padding-left-100px { padding-left: 100px; }
	.resp-padding-left-110px { padding-left: 110px; }
	.resp-padding-left-120px { padding-left: 120px; }
	.resp-padding-left-130px { padding-left: 130px; }
	.resp-padding-left-140px { padding-left: 140px; }

	/* Responsive Right Padding */
	.resp-padding-right-10px { padding-right: 10px; }
	.resp-padding-right-20px { padding-right: 20px; }
	.resp-padding-right-30px { padding-right: 30px; }
	.resp-padding-right-40px { padding-right: 40px; }
	.resp-padding-right-50px { padding-right: 50px; }
	.resp-padding-right-60px { padding-right: 60px; }
	.resp-padding-right-70px { padding-right: 70px; }
	.resp-padding-right-80px { padding-right: 80px; }
	.resp-padding-right-90px { padding-right: 90px; }
	.resp-padding-right-100px { padding-right: 100px; }
	.resp-padding-right-110px { padding-right: 110px; }
	.resp-padding-right-120px { padding-right: 120px; }
	.resp-padding-right-130px { padding-right: 130px; }
	.resp-padding-right-140px { padding-right: 140px; }

	/* Responsive Top Bottom Padding */
	.resp-padding-top-bottom-10px { padding: 10px 0; }
	.resp-padding-top-bottom-20px { padding: 20px 0; }
	.resp-padding-top-bottom-30px { padding: 30px 0; }
	.resp-padding-top-bottom-40px { padding: 40px 0; }
	.resp-padding-top-bottom-50px { padding: 50px 0; }
	.resp-padding-top-bottom-60px { padding: 60px 0; }
	.resp-padding-top-bottom-70px { padding: 70px 0; }
	.resp-padding-top-bottom-80px { padding: 80px 0; }
	.resp-padding-top-bottom-90px { padding: 90px 0; }
	.resp-padding-top-bottom-100px { padding: 100px 0; }
	.resp-padding-top-bottom-110px { padding: 110px 0; }
	.resp-padding-top-bottom-120px { padding: 120px 0; }
	.resp-padding-top-bottom-130px { padding: 130px 0; }
	.resp-padding-top-bottom-140px { padding: 140px 0; }

	/* Responsive Left Right Padding */
	.resp-padding-left-right-10px { padding: 0 10px; }
	.resp-padding-left-right-20px { padding: 0 20px; }
	.resp-padding-left-right-30px { padding: 0 30px; }
	.resp-padding-left-right-40px { padding: 0 40px; }
	.resp-padding-left-right-50px { padding: 0 50px; }
	.resp-padding-left-right-60px { padding: 0 60px; }
	.resp-padding-left-right-70px { padding: 0 70px; }
	.resp-padding-left-right-80px { padding: 0 80px; }
	.resp-padding-left-right-90px { padding: 0 90px; }
	.resp-padding-left-right-100px { padding: 0 100px; }
	.resp-padding-left-right-110px { padding: 0 110px; }
	.resp-padding-left-right-120px { padding: 0 120px; }
	.resp-padding-left-right-130px { padding: 0 130px; }
	.resp-padding-left-right-140px { padding: 0 140px; }
}

/**
 *  [ 5 ] - Margin
 *	~~~~~~~~~~~~~~~~
 */

/* Top Margin */
.margin-top-10px { margin-top: 10px; }
.margin-top-20px { margin-top: 20px; }
.margin-top-30px { margin-top: 30px; }
.margin-top-40px { margin-top: 40px; }
.margin-top-50px { margin-top: 50px; }
.margin-top-60px { margin-top: 60px; }
.margin-top-70px { margin-top: 70px; }
.margin-top-80px { margin-top: 80px; }
.margin-top-90px { margin-top: 90px; }
.margin-top-100px { margin-top: 100px; }
.margin-top-110px { margin-top: 110px; }
.margin-top-120px { margin-top: 120px; }
.margin-top-130px { margin-top: 130px; }
.margin-top-140px { margin-top: 140px; }

/* Bottom Margin */
.margin-bottom-10px { margin-bottom: 10px; }
.margin-bottom-20px { margin-bottom: 20px; }
.margin-bottom-30px { margin-bottom: 30px; }
.margin-bottom-40px { margin-bottom: 40px; }
.margin-bottom-50px { margin-bottom: 50px; }
.margin-bottom-60px { margin-bottom: 60px; }
.margin-bottom-70px { margin-bottom: 70px; }
.margin-bottom-80px { margin-bottom: 80px; }
.margin-bottom-90px { margin-bottom: 90px; }
.margin-bottom-100px { margin-bottom: 100px; }
.margin-bottom-110px { margin-bottom: 110px; }
.margin-bottom-120px { margin-bottom: 120px; }
.margin-bottom-130px { margin-bottom: 130px; }
.margin-bottom-140px { margin-bottom: 140px; }

/* Left Margin */
.margin-left-10px { margin-left: 10px; }
.margin-left-20px { margin-left: 20px; }
.margin-left-30px { margin-left: 30px; }
.margin-left-40px { margin-left: 40px; }
.margin-left-50px { margin-left: 50px; }
.margin-left-60px { margin-left: 60px; }
.margin-left-70px { margin-left: 70px; }
.margin-left-80px { margin-left: 80px; }
.margin-left-90px { margin-left: 90px; }
.margin-left-100px { margin-left: 100px; }
.margin-left-110px { margin-left: 110px; }
.margin-left-120px { margin-left: 120px; }
.margin-left-130px { margin-left: 130px; }
.margin-left-140px { margin-left: 140px; }

/* Right Margin */
.margin-right-10px { margin-right: 10px; }
.margin-right-20px { margin-right: 20px; }
.margin-right-30px { margin-right: 30px; }
.margin-right-40px { margin-right: 40px; }
.margin-right-50px { margin-right: 50px; }
.margin-right-60px { margin-right: 60px; }
.margin-right-70px { margin-right: 70px; }
.margin-right-80px { margin-right: 80px; }
.margin-right-90px { margin-right: 90px; }
.margin-right-100px { margin-right: 100px; }
.margin-right-110px { margin-right: 110px; }
.margin-right-120px { margin-right: 120px; }
.margin-right-130px { margin-right: 130px; }
.margin-right-140px { margin-right: 140px; }

/* Top Bottom Margin */
.margin-top-bottom-10px { margin: 10px 0; }
.margin-top-bottom-20px { margin: 20px 0; }
.margin-top-bottom-30px { margin: 30px 0; }
.margin-top-bottom-40px { margin: 40px 0; }
.margin-top-bottom-50px { margin: 50px 0; }
.margin-top-bottom-60px { margin: 60px 0; }
.margin-top-bottom-70px { margin: 70px 0; }
.margin-top-bottom-80px { margin: 80px 0; }
.margin-top-bottom-90px { margin: 90px 0; }
.margin-top-bottom-100px { margin: 100px 0; }
.margin-top-bottom-110px { margin: 110px 0; }
.margin-top-bottom-120px { margin: 120px 0; }
.margin-top-bottom-130px { margin: 130px 0; }
.margin-top-bottom-140px { margin: 140px 0; }

/* Left Right Margin */
.margin-left-right-10px { margin: 0 10px; }
.margin-left-right-20px { margin: 0 20px; }
.margin-left-right-30px { margin: 0 30px; }
.margin-left-right-40px { margin: 0 40px; }
.margin-left-right-50px { margin: 0 50px; }
.margin-left-right-60px { margin: 0 60px; }
.margin-left-right-70px { margin: 0 70px; }
.margin-left-right-80px { margin: 0 80px; }
.margin-left-right-90px { margin: 0 90px; }
.margin-left-right-100px { margin: 0 100px; }
.margin-left-right-110px { margin: 0 110px; }
.margin-left-right-120px { margin: 0 120px; }
.margin-left-right-130px { margin: 0 130px; }
.margin-left-right-140px { margin: 0 140px; }

/* Responsive Margin [ That added for small devices < 992px ] */
@media (max-width: 992px) {

	/* Responsive Top Margin */
	.resp-margin-top-10px { margin-top: 10px; }
	.resp-margin-top-20px { margin-top: 20px; }
	.resp-margin-top-30px { margin-top: 30px; }
	.resp-margin-top-40px { margin-top: 40px; }
	.resp-margin-top-50px { margin-top: 50px; }
	.resp-margin-top-60px { margin-top: 60px; }
	.resp-margin-top-70px { margin-top: 70px; }
	.resp-margin-top-80px { margin-top: 80px; }
	.resp-margin-top-90px { margin-top: 90px; }
	.resp-margin-top-100px { margin-top: 100px; }
	.resp-margin-top-110px { margin-top: 110px; }
	.resp-margin-top-120px { margin-top: 120px; }
	.resp-margin-top-130px { margin-top: 130px; }
	.resp-margin-top-140px { margin-top: 140px; }

	/* Responsive Bottom Margin */
	.resp-margin-bottom-10px { margin-bottom: 10px; }
	.resp-margin-bottom-20px { margin-bottom: 20px; }
	.resp-margin-bottom-30px { margin-bottom: 30px; }
	.resp-margin-bottom-40px { margin-bottom: 40px; }
	.resp-margin-bottom-50px { margin-bottom: 50px; }
	.resp-margin-bottom-60px { margin-bottom: 60px; }
	.resp-margin-bottom-70px { margin-bottom: 70px; }
	.resp-margin-bottom-80px { margin-bottom: 80px; }
	.resp-margin-bottom-90px { margin-bottom: 90px; }
	.resp-margin-bottom-100px { margin-bottom: 100px; }
	.resp-margin-bottom-110px { margin-bottom: 110px; }
	.resp-margin-bottom-120px { margin-bottom: 120px; }
	.resp-margin-bottom-130px { margin-bottom: 130px; }
	.resp-margin-bottom-140px { margin-bottom: 140px; }

	/* Responsive Left Margin */
	.resp-margin-left-10px { margin-left: 10px; }
	.resp-margin-left-20px { margin-left: 20px; }
	.resp-margin-left-30px { margin-left: 30px; }
	.resp-margin-left-40px { margin-left: 40px; }
	.resp-margin-left-50px { margin-left: 50px; }
	.resp-margin-left-60px { margin-left: 60px; }
	.resp-margin-left-70px { margin-left: 70px; }
	.resp-margin-left-80px { margin-left: 80px; }
	.resp-margin-left-90px { margin-left: 90px; }
	.resp-margin-left-100px { margin-left: 100px; }
	.resp-margin-left-110px { margin-left: 110px; }
	.resp-margin-left-120px { margin-left: 120px; }
	.resp-margin-left-130px { margin-left: 130px; }
	.resp-margin-left-140px { margin-left: 140px; }

	/* Responsive Right Margin */
	.resp-margin-right-10px { margin-right: 10px; }
	.resp-margin-right-20px { margin-right: 20px; }
	.resp-margin-right-30px { margin-right: 30px; }
	.resp-margin-right-40px { margin-right: 40px; }
	.resp-margin-right-50px { margin-right: 50px; }
	.resp-margin-right-60px { margin-right: 60px; }
	.resp-margin-right-70px { margin-right: 70px; }
	.resp-margin-right-80px { margin-right: 80px; }
	.resp-margin-right-90px { margin-right: 90px; }
	.resp-margin-right-100px { margin-right: 100px; }
	.resp-margin-right-110px { margin-right: 110px; }
	.resp-margin-right-120px { margin-right: 120px; }
	.resp-margin-right-130px { margin-right: 130px; }
	.resp-margin-right-140px { margin-right: 140px; }

	/* Responsive Top Bottom Margin */
	.resp-margin-top-bottom-10px { margin: 10px 0; }
	.resp-margin-top-bottom-20px { margin: 20px 0; }
	.resp-margin-top-bottom-30px { margin: 30px 0; }
	.resp-margin-top-bottom-40px { margin: 40px 0; }
	.resp-margin-top-bottom-50px { margin: 50px 0; }
	.resp-margin-top-bottom-60px { margin: 60px 0; }
	.resp-margin-top-bottom-70px { margin: 70px 0; }
	.resp-margin-top-bottom-80px { margin: 80px 0; }
	.resp-margin-top-bottom-90px { margin: 90px 0; }
	.resp-margin-top-bottom-100px { margin: 100px 0; }
	.resp-margin-top-bottom-110px { margin: 110px 0; }
	.resp-margin-top-bottom-120px { margin: 120px 0; }
	.resp-margin-top-bottom-130px { margin: 130px 0; }
	.resp-margin-top-bottom-140px { margin: 140px 0; }

	/* Responsive Left Right Margin */
	.resp-margin-left-right-10px { margin: 0 10px; }
	.resp-margin-left-right-20px { margin: 0 20px; }
	.resp-margin-left-right-30px { margin: 0 30px; }
	.resp-margin-left-right-40px { margin: 0 40px; }
	.resp-margin-left-right-50px { margin: 0 50px; }
	.resp-margin-left-right-60px { margin: 0 60px; }
	.resp-margin-left-right-70px { margin: 0 70px; }
	.resp-margin-left-right-80px { margin: 0 80px; }
	.resp-margin-left-right-90px { margin: 0 90px; }
	.resp-margin-left-right-100px { margin: 0 100px; }
	.resp-margin-left-right-110px { margin: 0 110px; }
	.resp-margin-left-right-120px { margin: 0 120px; }
	.resp-margin-left-right-130px { margin: 0 130px; }
	.resp-margin-left-right-140px { margin: 0 140px; }

}




/**
 *  [ 6 ] - Read More Link
 *	~~~~~~~~~~~~~~~~~~~~~~~~
 */

a.readmore-link {
	text-decoration: none;
	display: inline-block;
	color: #222;
	position: relative;
	z-index: 5;
	font-weight: bold;
}

a.readmore-link.align-left, a.readmore-link.align-right {
	margin-bottom: 0;
}

a.readmore-link:hover {
	text-decoration: none;
	color: #f17663;
}


/**
 *  [ 7 ] - Text Colored
 *	~~~~~~~~~~~~~~~~~~~~~~
 */

.colored {
	color: #f17663;
}


/**
 *  [ 8 ] - Clear
 *	~~~~~~~~~~~~~~~
 */

.clear {
clear: both;
display: block;
height: 1px;
margin-bottom: -1px;
width: 100%;
}



/**
 *	-------------------------------------------------------------------------------
 *	( 03 ) - Form Settings
 *	-------------------------------------------------------------------------------
 *
 *  This part contains the general website forms settings and the header
 *  form settings.
 *
 *	------
 *
 *  Form Settings divided to the following sections:
 *
 *	   |
 *	   |-->  [ 1 ] - General Forms Settings
 *	   |-->  [ 2 ] - Header Form
 *
 */


/**
 *  [ 1 ] - General Forms Settings
 *	~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 */

form {
	position: relative;
}

input, 
label, 
textarea {
	font-size: 15px;
	line-height: 22px;
	border-radius: 4px;
	color: #222;
	outline: none;
	transition: all 0.2s ease;
}

abbr {
cursor: help;
}

input, 
textarea {
	border: none;
	background: #fff;
	padding: 12px 15px;
	width: 270px;
	box-shadow: 0 2px 3px #ddd inset;
}


input:focus, 
textarea:focus {

}

textarea {
	height: 200px;
}

label {
	vertical-align: top;
	margin-bottom: 0;
	display: inline;
	color: #aaa;
}

input.submit {
	cursor: pointer;
	display: inline-block;
	padding: 12px 17px;
	font-size: 16px;
	font-weight: bold;
	font-family: "Raleway", sans-serif;
	width: auto;
	position: relative;
	top: -1px;
	margin-left: 5px;
	border: none;
	color: #fff;
	background: #f17663;
	box-shadow: none;
}

input.submit:hover {
	background: #eb6455;
}

/* error state */

label.error {
    background: #ff3333;
    color: #fff;
    display: inline-block;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.1px;
    line-height: 20px;
    margin-top: 6px;
    padding: 1px 8px;
    position: relative;
}

form input.error, 
form textarea.error {
	background: #fff;
	border: 3px solid #ff3333;
	transition: border-color 0s;
	margin-bottom: -15px;
}


/**
 *  [ 2 ] - Header Form
 *	~~~~~~~~~~~~~~~~~~~~~
 */

#header-form {
	display: block;
	padding: 30px;
	text-align: left;
	background: rgba(255, 255, 255, 0.05);
	border-radius: 10px;
	border: 2px solid rgba(255, 255, 255, 0.12);
}

#header-form .form-icon {
	width: 80px;
	height: 80px;
	line-height: 80px;
	font-size: 35px;
	display: block;
	text-align: center;
	border-radius: 100%;
	color: #fff;
	background: #f17663;
	margin: -76px auto 25px;
}

#header-form h3 {
	color: #fff;
	display: block;
	text-align: center;
	padding-bottom: 5px;
}

#header-form span {
	font-size: 14px;
	color: #999;
	padding-bottom: 20px;
	display: block;
	text-align: center;
}

#header-form .single-input-line {
	display: block;
	width: 100%;
	margin-bottom: 15px;
	position: relative;
}

#header-form .single-input-line:last-child {
	margin-bottom: 0;
}

#header-form .single-input-line input[type=text], 
#header-form .single-input-line textarea {
	width: 100%;
	text-indent: 30px;
	box-shadow: none;
}

#header-form .single-input-line textarea {
	height: 290px;
}

#header-form .single-input-line i {
	position: absolute;
	top: 14px;
	left: 14px;
	font-size: 18px;
	color: #222;
}

/* Submit Message */

#submit-message {
	position: fixed;
	bottom: 30px;
	left: 30px;
	padding: 7px 50px 0 110px;
	background: #222;
	text-align: left;
	-webkit-animation-duration: 0.8s;
			animation-duration: 0.8s;
}

.hidden-form {
	opacity: 0;
}

.appearing-delay {
	-webkit-animation-delay: 0.8s;
			animation-delay: 0.8s;
}

#submit-message .close-icon:before {
	content: "×";
	font-size: 25px;
	color: #fff;
	cursor: pointer;
	position: absolute;
	right: 20px;
	top: 13px;
}

.submit-message-content {
	display: block;
}

.error-icon:before, .success-icon:before {
	width: 60px;
	height: 60px;
	line-height: 52px;
	border: 3px solid;
	border-radius: 50%;
	color: #fff;
	font-size: 25px;
	text-align: center;
	position: absolute;
	left: 30px;
}

.error-icon:before {
	border-color: #ff3333;
}

.success-icon:before {
	border-color: #3aae39;
}

.submit-message-content h5 {
	font-size: 18px;
	color: #ddd;
	padding-bottom: 0;
}

.submit-message-content p {
	padding: 0;
	font-style: normal !important;
	font-size: 13px !important;
	font-family: "Open Sans", sans-serif;
	color: #999 !important;
}




/**
 *	-------------------------------------------------------------------------------
 *	( 04 ) - Header
 *	-------------------------------------------------------------------------------
 *
 *  This part contains the general header settings, header top content settings
 *  header featured content, slider and header go bottom icon
 *
 *	------
 *
 *  Header divided to the following sections:
 *
 *	   |
 *	   |-->  [ 1 ] - Header Settings
 *	   |-->  [ 2 ] - Header Top Content
 *	   |-->  [ 3 ] - Header Featured Content 
 *	   |-->  [ 4 ] - Slider
 *	   |-->  [ 5 ] - Header Go Bottom
 *
 */



/**
 *  [ 1 ] - Header Settings
 *	~~~~~~~~~~~~~~~~~~~~~~~~~
 */

header {
	width: 100%;
	display: block;
	position: relative;
}

header h1, 
header h2, 
header h3, 
header h4, 
header h5, 
header h6 {
	color: #fff;
}

header h1 strong, 
header h2 strong, 
header h3 strong, 
header h4 strong, 
header h5 strong, 
header h6 strong {
	color: #fff;
}

header h1 small, 
header h2 small, 
header h3 small, 
header h4 small, 
header h5 small, 
header h6 small {
	color: #ddd;
}

header .light-heading.subheader {
	color: rgba(255, 255, 255, 0.85);
}

header p {
	color: rgba(255, 255, 255, 0.9);
	font-size: 16px;
	line-height: 24px;
	font-family: "Open Sans", sans-serif;
}

/* Header Featured Button */

.button {
	text-align: center;
	border: 3px solid;
	margin: 15px 5px 0 0;
	border-radius: 4px;
	display: inline-block;
	font-family: "Raleway", sans-serif;
}

header .button {
	margin-top: 30px;
}

.button.rounded {
	border-radius: 9999px;
}

/* Sizes of Header Featured Button */
.button.small {
	font-size: 14px;
	padding: 7px 25px;
}

.button.medium {
	font-size: 16px;
	padding: 10px 30px;
}

.button.large {
	font-size: 19px;
	padding: 15px 35px;
}

/* Header Featured Button with Icons */
.button i {
	-webkit-transition: all 0.2s;
			transition: all 0.2s;
}

.button.small i {
	width: 14px;
}

.button.medium i {
	width: 16px;
}

.button.large i {
	width: 19px;
}

/* With Icon Right */
.button.with-icon-right.small i {
	margin-left: 9px;
}

.button.with-icon-right.medium i {
	margin-left: 11px;
}

.button.with-icon-right.large i {
	margin-left: 14px;
}

/* With Icon Left */
.button.with-icon-left.small i {
	margin-right: 9px;
}

.button.with-icon-left.medium i {
	margin-right: 11px;
}

.button.with-icon-left.large i {
	margin-right: 14px;
}

/* With Hover Icon Right & Left */
.button.with-hover-icon-right i,
.button.with-hover-icon-left i {
	width: 0;
	opacity: 0;
}

.button.with-hover-icon-right:hover i,
.button.with-hover-icon-left:hover i {
	opacity: 1;
	-webkit-transition: all 0.2s;
			transition: all 0.2s;	
}

.button.with-hover-icon-right.small:hover i {
	width: 14px;
	margin-left: 9px;
}

.button.with-hover-icon-right.medium:hover i {
	width: 16px;
	margin-left: 11px;
}

.button.with-hover-icon-right.large:hover i {
	width: 19px;
	margin-left: 14px;
}

.button.with-hover-icon-left.small:hover i {
	width: 14px;
	margin-right: 9px;
}

.button.with-hover-icon-left.medium:hover i {
	width: 16px;
	margin-right: 11px;
}

.button.with-hover-icon-left.large:hover i {
	width: 19px;
	margin-right: 14px;
}

/* Transparent Colorful Button */
.button.transparent-colorful,
.button.hover-transparent-colorful:hover {
	color: #f17663;
	background: transparent;
	border-color: #f17663;
}

/* Colorful Button */
.button.colorful,
.button.hover-colorful:hover {
	color: #fff;
	background: #f17663;
	border-color: #f17663;
}

/* Transparent White Button */
.button.transparent-white,
.button.hover-transparent-white:hover {
	color: #fff;
	background: transparent;
	border-color: #fff;
}

/* Transparent Button */
.button.transparent,
.button.hover-transparent:hover {
	color: #fff;
	background: transparent;
}

/* White Button */
.button.white,
.button.hover-white:hover {
	color: #111;
	background: #fff;
	border-color: #fff;
}

/* Transparent Dark Button */
.button.transparent-dark,
.button.hover-transparent-dark:hover {
	color: #111;
	background: transparent;
	border-color: #111;
}

/* Dark Button */
.button.dark,
.button.hover-dark:hover {
	color: #fff;
	background: #111;
	border-color: #111;
}


/**
 *  [ 2 ] - Header Top Content
 *	~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 */

.header-top-content {
	display: table;
	width: 100%;
	height: 100px;
	position: absolute;
	z-index: 2;
	color: #fff;
	font-size: 12px;
}

.header-top-content-inner {
	display: table-cell;
	vertical-align: middle;
}

/* Contact Info */

.contact-info {
	display: inline-block;
	position: relative;
	top: 4px;
}

.contact-info span {
	display: inline-block;
	margin-right: 20px;
}

.contact-info span i {
	font-size: 15px;
	position: relative;
	top: 1px;
	margin-right: 6px;
}

/* Header Social Icons */

.header-top-content .social-icons {
	float: right;
	display: inline-block;
	margin-bottom: 0;
}

.header-top-content .social-icons.grey li a {
	background: #fff;
}

.header-top-content .social-icons.hover-dark li a:hover {
	background: #222 !important;
}


/**
 *  [ 3 ] - Header Featured Content
 *	~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 */

/* Header Featured Content Outer */
#header-featured-content-outer {
	display: block;
	position: relative;
	overflow: hidden;
	width: 100% !important;
	height: 100% !important;
	padding: 0;
}

/* Header Parallax */
.header-parallax {
	position: relative;
	/*background-image: url("../images/files/parallax-background-images/image110.jpg");*/ /* 61 & 69 & 76 & 89 & 18 */
	background-color: #222; /* 777 */
	background-position: top center;
	background-size: cover;
	background-attachment: fixed;
	background-repeat: no-repeat;
}

/* Pattern Overlay */
.pattern-overlay {
	width: 100%;
	height: 100%;
	position: absolute;
	z-index: 1;
	background-image: url("../images/general-elements/pattern-overlay.png");
	background-color: rgba(0, 0, 0, 0.85);
	background-repeat: repeat;
	background-position: top left;
}

/* Header Colored Background */
.header-colored-background {
	position: absolute;
	width: 100%;
	height: 100%;
	z-index: 1;
}

/* Background Video */
.background-video {
	position: absolute;
	width: 100%;
	height: 100%;
}

/* Header Featured Content */
.header-featured-content {
	position: absolute;
	top: 0;
	display: block;
	z-index: 1;
	width: 100%;
	height: 100%;
	font-family: "Raleway", sans-serif;
	color: #fff;
}

.header-featured-content img {
	max-width: 100%;
}

.header-featured-content .container, .header-featured-content .row, .header-featured-content [class*="col-"] {
	height: 100%;
	z-index: 1;
}

.header-featured-content-inner {
	position: absolute;
	top: 0;
	width: 100%;
	height: 100%;
	display: block;
}

/* Header Center Box */
.header-center-box {
	display: table;
	width: 100%;
	height: 100%;
	position: relative;
}

.header-center-box-content {
	display: table-cell;
	vertical-align: middle;
	padding: 85px 0;
	position: relative;
}

.header-center-box img {
	max-height: 100%;
	max-width: 100%;
}

/* Header Logo */
.header-logo {
	display: inline-block;
	width: 100%;
	margin-bottom: 50px;
}

.disable-header-logo {
	display: none;
}

/* Header Featured Title */
.header-featured-title {
	display: block;
}

.header-featured-title h4 {
	font-family: "Courier New", serif;
	color: #bbb;
	font-size: 21px;
	font-weight: normal;
	padding-bottom: 10px;
}

.header-featured-title h2 {
	color: #fff;
	font-size: 42px;
	margin-bottom: 15px;
	padding-bottom: 15px;
}

.header-featured-title h2:after {
	content: "";
	width: 60px;
	height: 5px;
	background: #f17663;
	margin-top: 25px;
	display: block;
}

.text-center .header-featured-title h2:after,
.text-center.header-featured-title h2:after {
	margin: 25px auto 0 auto;
}

.header-featured-title p {
	font-size: 18px;
	line-height: 27px;
	color: #ddd;
}

.text-center .header-featured-title p,
.text-center.header-featured-title p {
	max-width: 60%;
	margin: auto;
}

/* Horizontal Featured Image */
.horizontal-featured-image-container {
	width: 100%;
	display: block;
}

.horizontal-featured-image-container img {
	max-width: 100%;
}

/* Vertical Featured Image */
.vertical-featured-image-container {
	height: 100%; /* Use it when you need img to be resizable when resizing browser [ rare possibility ] */
}

.vertical-featured-image-container img {
	max-width: 100%;
	max-height: 100%;
}


/**
 *  [ 4 ] - Slider
 *	~~~~~~~~~~~~~~~~
 */

.header-slider {
	list-style: outside none;
	/*position: absolute !important;*/
	background: #333;
	width: 100%;
	height: 100%;
	z-index: 0;
}

.header-slider li {
	height: 100%;
	display: block;
	width: 100%;
	background-color: #222;
	background-position: top center;
	background-size: cover;
	/*background-attachment: fixed;*/
	background-repeat: no-repeat;
	position: relative;
}


/**
 *  [ 5 ] - Header Go Bottom
 *	~~~~~~~~~~~~~~~~~~~~~~~~~~
 */

.header-go-bottom {
	position: absolute;
	bottom: 30px;
	width: 100%;
	text-align: center;
	font-size: 13px;
	letter-spacing: 1px;
	font-family: "Raleway", sans-serif;
	color: #fff;
}

.header-go-bottom a {
	color: #fff;
	font-family: "Raleway", sans-serif;
	font-size: 14px;
	display: inline-block;
	position: relative;
	z-index: 1;
}

.header-go-bottom a span {
	width: 26px;
	height: 35px;
	border: 3px solid #fff;
	border-radius: 12px;
	display: block;
	margin: 15px auto auto;
}

.header-go-bottom a span:before {
	content: "";
	width: 5px;
	height: 9px;
	margin: 4px auto auto;
	border-radius: 10px;
	background: #fff;
	display: block;
	position: relative;

    -webkit-animation-name: iconMove;
            animation-name: iconMove;
    -webkit-animation-duration: 1s;
            animation-duration: 1s;
    -webkit-animation-timing-function: linear;
            animation-timing-function: linear;
    -webkit-animation-delay: 0s;
            animation-delay: 0s;
    -webkit-animation-iteration-count: infinite;
            animation-iteration-count: infinite;
    -webkit-animation-direction: normal;
            animation-direction: normal;
    -webkit-animation-play-state: running;
            animation-play-state: running;
}

@keyframes iconMove {
	0%		{ top: 0; }
	50%		{ top: 5px; }
	100%	{ top: 10px; opacity: 0; }
}

@-webkit-keyframes iconMove {
	0%		{ top: 0; }
	50%		{ top: 5px; }
	100%	{ top: 10px; opacity: 0; }
}



/**
 *	-------------------------------------------------------------------------------
 *	( 05 ) - Logo and Nav
 *	-------------------------------------------------------------------------------
 *
 *  This part contains the the logo, nav and other addons such as subscribe 
 *  button and go to top button.
 *
 *	------
 *
 *  It's divided to the following sections:
 *
 *	   |
 *	   |-->  [ 1 ] - Logo and Nav Settings
 *	   |-->  [ 2 ] - Logo
 *	   |-->  [ 3 ] - Nav
 *	   |-->  [ 4 ] - Additional Addons
 *
 */


/**
 *  [ 1 ] - Logo and Nav Settings
 *	~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 */

.logo-and-nav {
	height: 75px;
	position: fixed;
	top: 0;
	right: 0;
	display: block;
	width: 100%;
	background: rgba(255, 255, 255, 0.95); /* 0.98 */
	box-shadow: 0 1px 7px rgba(0, 0, 0, 0.15);
	z-index: 20;
	transition: background 0.2s, height 0.2s, box-shadow 0.2s, right 0.6s cubic-bezier(0.19, 1, 0.22, 1); /* Important */
}

.logo-and-nav-fullwidth .container {
	width: 100%;
	padding: 0 50px;
}

.logo-and-nav-fixedwidth .container {

}

/* Sticky Plugin Settings */
.logo-and-nav-wrapper {
	position: absolute;
	width: 100%;
}

/* Logo and Nav Sticky State general properties  */
.logo-and-nav-sticky-state .logo-and-nav {
	background: #fff;
/*	background: rgba(255, 255, 255, 1);
	box-shadow: 0 1px 5px rgba(0, 0, 0, 0.12);
*/	/*box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);*/
	/*height: 70px; */
}

.logo-and-nav-sticky-state .logo {

}

.logo-and-nav-sticky-state .logo img.dark-logo{
	opacity: 1;
	visibility: visible;
}

.logo-and-nav-sticky-state .logo img.light-logo {
	opacity: 1;
	visibility: hidden;
}

.logo-and-nav-sticky-state .logo h3	{
	color: #222;
}

.logo-and-nav-sticky-state .logo h3 strong	{
	color: #f17663;
}

.logo-and-nav-sticky-state .logo:hover h3 {
	color: #222;
}

.logo-and-nav-sticky-state .logo span {
	/*color: #999;*/
}

.logo-and-nav-sticky-state .main-menu > li:after {

}

.logo-and-nav-sticky-state .main-menu > li > a {

}

.logo-and-nav-sticky-state .main-menu > li > a:hover {

}

.logo-and-nav-sticky-state .main-menu > li:hover > a {

}

.logo-and-nav-sticky-state .main-menu > li > a.current {

}

.logo-and-nav-sticky-state .main-menu > li > a:before {

}

/* Logo and Nav Style 1 */
.logo-and-nav-style1 {
	position: fixed;
	opacity: 0;
	-webkit-backface-visibility: hidden; /* Fix 'visibility' property which cause flickr with jQuery */
			backface-visibility: hidden;
	transition: all 0s;
}

/* Logo and Nav Style 1 Sticky State */
.logo-and-nav-sticky-state .logo-and-nav-style1 {
	opacity: 1;
	-webkit-backface-visibility: hidden; /* Fix 'visibility' property which cause flickr with jQuery */
			backface-visibility: hidden; /* margin */
	-webkit-transition: opacity 0.4s, margin 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.7);
			transition: opacity 0.4s, margin 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.7);
}


/**
 *  [ 2 ] - Logo
 *	~~~~~~~~~~~~~~
 */

.logo  {
	display: block;
	position: relative;
	top: 20px;
}

.logo img {
	position: absolute;
	left: 0;
	max-height: 35px;
	margin-top: 0;
	transition: all 0.2s ease 0s;
}

.logo img.light-logo {

}

.logo img.dark-logo {
	left: 0;
	opacity: 0;
	visibility: hidden;
}

.logo h3 {
	overflow: hidden;
	width: auto;
	margin-top: -5px;
	font-size: 24px;
	font-weight: 400;
	padding-bottom: 0;
}

.logo h3 strong	{
	font-weight: 600;
	color: #f17663;
}

.logo:hover h3 {
	color: #222;
}

.logo span {
	color: #888;
	font-size: 12px;
	margin-top: -10px;
}

.logo h3,
.logo h3 strong,
.logo span {
	transition: all 0.2s ease 0s;
}

/* Text Logo */
.text-logo {
	display: inline-block;
}

.text-logo h3 {
	display: inline-block;
}

.text-logo span {
	display: block;
}

.text-logo img {
	display: none !important;
}

/* Image Logo */
.image-logo img {
	display: inline-block;
}

.image-logo h3,
.image-logo span {
	display: none;
}


/**
 *  [ 3 ] - Nav
 *	~~~~~~~~~~~~~
 */

nav#main-nav {
	position: relative;
	float: right;
	height: 100%;
	line-height: 100%;
}

.main-menu {
	list-style: none;
	display: inline-block;
	height: 100%;
	position: relative;
	z-index: 1; /* related with z-index of .header-addon-search-form */
	left: 0;
	transition: all .2s ease .35s;
}

.main-menu li {
	position: relative;
	white-space: nowrap; /* no need for Supersubs plugin */
}

.main-menu > li {
	float: left;
	height: 100%;
}

.main-menu > li > a {
	color: #222;
	height: 75px;
	display: block;
	line-height: 75px;
	font-size: 14px;
	font-weight: 600;
	padding: 0 8px;
	letter-spacing: 0.4px;
	font-family: "Raleway", sans-serif;
}

.main-menu > li > a:hover {
	color: #f17663;
}

.main-menu > li:hover > a {
	color: #f17663;
}

.main-menu > li > a.current {
	color: #f17663;
}

/* Nav Responsive Settings */
#main-nav input[type=checkbox] {
  position: absolute;
  top: -9999px;
  left: -9999px;
}

#main-nav label {
  display: none;
  cursor: pointer;
  -moz-user-select: none;
}

/* small screens */
@media screen and (max-width: 992px) {
  #main-nav #main-menu {
    display: none;
    height: auto;
    background: #fff;
    padding: 10px 0;
    -webkit-transition: all 0s;
    		transition: all 0s;
  }
  #main-nav label {
    position: absolute;
    top: 26px;
    left: -18px;
    display: block;
    width: 30px;
    height: 30px;
  }

  #main-nav label:after {
    font-family: "fontAwesome";
    content: "\f0c9";
    font-size: 21px;
  }
  #main-nav input[type=checkbox]:checked ~ label:after {
    color: #222;
  }
  #main-nav input[type=checkbox]:checked ~ #main-menu {
    border: 3px solid #ddd;
    display: block;
    left: 0;
    margin-top: 30px;
    position: fixed;
    top: 45px;
    width: 100%;
  }
  #main-nav input[type=checkbox]:checked ~ #main-menu > li {
    width: 100%;
    height: auto;
    background: #fff;
  }

  #main-nav input[type=checkbox]:checked ~ #main-menu > li a {
  	height: auto;
  	line-height: inherit; 
  	padding: 11px 20px;
	float: right;
  }

}

/**
 *  [ 4 ] - Additional Addons
 *	~~~~~~~~~~~~~~~~~~~~~~~~~~~
 */

 .header-additional-addons {
	position: relative;
	display: inline-block;
	float: right;
	height: 75px;
 }

/* Buttons */
 .header-additional-addons .button {
 	margin: 0 -8px 0 25px;
 	position: relative;
 	top: 20px;
 }

/* Social Icons */
 .header-additional-addons .social-icons {
 	display: inline-block;
 	float: right;
 	margin-left: 25px;
 	position: relative;
 	top: 20px;
 }




/**
 *	-------------------------------------------------------------------------------
 *	( 06 ) - Main content
 *	-------------------------------------------------------------------------------
 *
 *  This part contains the the main container settings. Also the general
 *  settings for flat section, parallax section and flat section 2 which is
 *  is used for the short content
 *
 *	------
 *
 *  Main content divided to the following sections:
 *
 *	   |
 *	   |-->  [ 1 ] - Main Content Settings
 *	   |-->  [ 2 ] - About Us
 *	   |-->  [ 3 ] - Our Clients
 *	   |-->  [ 4 ] - Fun Facts
 *	   |-->  [ 5 ] - Testmonials
 *	   |-->  [ 6 ] - Pricing Plans
 *	   |-->  [ 7 ] - Subscribe
 *
 */


/**
 *  [ 1 ] - Main Content Settings
 *	~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 */

#main-container {
	display: block;
	position: relative;
	z-index: 0; /* Important for icons animations */
	width: 100%;
	background: #fff;
	padding: 0;
	-webkit-transition: all 0.2s ease 0s;
			transition: all 0.2s ease 0s;
}

#main {
	display: block;
	position: relative;
}

/* Flat Section */
.flat-section {
	display: block;
	width: 100%;
	/* have to use padding properties separately due to avoiding jQuery purposes conflict */
	padding-top: 115px;
	padding-bottom: 120px;
	position: relative;
}

/* Flat Section Title */
.flat-section-title {
	width: 100%;
	display: block;
	margin-bottom: 40px;
	position: relative;
}

[class*="col-"] .col-md-12 .flat-section-title,
[class*="col-"] .col-lg-12 .flat-section-title,
[class*="col-"] .col-xs-12 .flat-section-title,
[class*="col-"] .col-sm-12 .flat-section-title {
	width: 100%;
}

.col-md-12 .flat-section-title,
.col-lg-12 .flat-section-title {
	width: 75%;
}

.text-center.flat-section-title,
.text-center .flat-section-title {
	margin-left: auto;
	margin-right: auto;
}

.text-center.flat-section-title:after,
.text-center .flat-section-title:after {
	margin-left: auto;
	margin-right: auto;
}

.white-content .flat-section-title h2 {
	color: #fff;
}

.white-content .flat-section-title span {
	color: #ddd;
}

.flat-section-title:after {
	content: "";
	width: 60px;
	height: 5px;
	background: #f17663;
	margin-top: 25px;
	display: block;
}

.flat-section-title h2 {
	font-size: 34px;
	font-weight: 700;
}

.flat-section-title .subheader {
	padding-bottom: 12px;
}

.flat-section-subtitle {
	font-size: 18px;
	line-height: 28px;
	margin-top: -12px;
	color: #999;
	display: inline-block;
	font-family: "Open Sans", sans-serif;
}


.flat-section-title .subheader + .flat-section-subtitle {
    margin-bottom: 10px;
    margin-top: 7px;
}


/* Flat Section Content */
.flat-section-content {
	display: block;
	width: 100%;
	position: relative;
}

/* Parallax Section */
.parallax-section {
	display: block;
	width: 100%;
	position: relative;
	text-align: center;
	background-color: #ccc;
	background-position: top center;
	background-size: cover;
	background-attachment: fixed;
	background-repeat: no-repeat;
	color: #fff;
}

.parallax-section-inner {
	width: 100%;
	height: 100%;
	position: relative;
	padding: 115px 0 110px;
	z-index: 1;
}


/**
 *  [ 2 ] - About Us
 *	~~~~~~~~~~~~~~~~~~
 */

#about-us {
	display: block;
	width: 100%;
}

#about-us2 .flat-section2 {
	background: #f3f3f3;
	border-top: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
	padding-top: 100px;
}


/**
 *  [ 3 ] - Our Clients
 *	~~~~~~~~~~~~~~~~~~~~~
 */

#our-clients {
	display: block;
	width: 100%;
}

#our-clients .flat-section {
	background: #f3f3f3;
	border-top: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
}

#our-clients .flat-section-title {
	width: 60%;
}

/* Clients Carousel */
.clients-carousel {
	list-style: outside none;
	display: block;
	margin-bottom: 15px;
}

.clients-carousel li {
	/*text-align: center;*/
	width: 100%;
}


/**
 *  [ 4 ] - Fun Facts
 *	~~~~~~~~~~~~~~~~~~~
 */

#fun-facts {
	width: 100%;
	display: block;
}

#fun-facts .flat-section-title {
	width: 60%;
}

/* Fun Facts Box */

.fun-facts-box .info-box-content {
	padding-left: 84px !important;
	min-height: auto !important;
}

.fun-facts-box h5 {
	padding-bottom: 6px;
}

.fun-facts-box span {
	font-size: 40px;
	font-weight: 400;
	color: #222;
	font-family: "Raleway", sans-serif;
}


/**
 *  [ 5 ] - Teatmonials
 *	~~~~~~~~~~~~~~~~~~~~~
 */

#testmonials {
	width: 100%;
	display: block;
}

#testmonials .flat-section-title {
	width: 60%;
}

/* Testmonial Carousel */
.testmonials-carousel-outer {
	display: block;
	position: relative;
	text-align: left;
}

.testmonials-carousel-quote-icon {
	width: 128px;
	height: 128px;
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	margin-top: -23px;
}

.testmonials-carousel-quote-icon img {
	width: 100%;
	height: 100%;
}

.testmonials-carousel {
	list-style: outside none;
	padding-left: 163px;
	text-align: left;
}

.single-testmonial {
	display: block;
	width: 100%;
	min-height: 93px;
}

.single-testmonial-image {
	width: 93px;
	position: absolute;
	border-radius: 100%;
	overflow: hidden;
	border: 5px solid #f17663;
}

.single-testmonial-image img {
	width: 100%;
	height: 100%;
}

.single-testmonial-content {
	width: 80%;
	padding: 3px 0 0 113px;
}

.single-testmonial-message {
    color: #d3d3d3;
    font-size: 18px;
    font-style: italic;
    line-height: 28px;
    margin-bottom: 10px;
}
.single-testmonial-person {
	font-size: 14px;
	font-family: "Raleway", sans-serif;
	color: #eee;
	font-weight: 700;
	margin-top: 5px;
	display: block;
}


/**
 *  [ 6 ] - Pricing Plans
 *	~~~~~~~~~~~~~~~~~~~~~~~
 */

#pricing-plans {
	width: 100%;
	display: block;
}

#pricing-plans .flat-section-title {
	width: 60%;
}


/**
 *  [ 7 ] - Subscribe
 *	~~~~~~~~~~~~~~~~~~~
 */

#subscribe {
	width: 100%;
	display: block;
}

#subscribe .flat-section-title {
	width: 60%;
}

/* Subscribe form */
.subscribe-form {
	display: inline-block;
	font-size: 0;
}

.subscribe-form input.error {
	border: none;
}

.subscribe-form span {
	font-style: italic;
	display: block;
	margin-top: 1px;
	color: #aaa;
	font-size: 15px;
	text-align: left;
}

.subscribe-result {
	display: none;
	width: 100%;
	text-align: center;
}

.subscribe-result .error, 
.subscribe-result .success {
	padding: 10px 25px 10px 35px;
	text-align: left;
	color: #ccc;
	border: 2px solid;
	border-radius: 4px;
	font-size: 15px;
	line-height: 23px;
	margin-top: 30px;
	display: inline-block;
	position: relative;
}

.subscribe-result .error {
	border-color: #ff3333;
}

.subscribe-result .success {
	border-color: #bccc86;
}

.subscribe-result .fa {
	width: 30px;
	height: 30px;
	line-height: 30px;
	text-align: center;
	border-radius: 50%;
	position: absolute;
	left: -15px;
	top: 7px;
	color: #fff;
}

.subscribe-result .error .fa-exclamation {
	background: #ff3333;
}

.subscribe-result .success .fa-check {
	background: #bccc86;
	color: #000;
}





/**
 *	-------------------------------------------------------------------------------
 *	( 07 ) - Footer
 *	-------------------------------------------------------------------------------
 *
 *  This part contains the footer settings, footer logo, social
 *  icons and footer message.
 *
 *	------
 *
 *  It has the following code:
 *
 */


footer {
	display: block;
	position: relative;
	width: 100%;
	padding: 40px 0;
	background: #f3f3f3;
}

.footer-logo-and-message {

}

/* Footer Logo */
img.footer-logo-image {
	float: left;
}

.footer-logo-title {
	font-size: 24px;
	color: #f17663;
	font-weight: 700;
	display: block;
	font-family: "Raleway", sans-serif;
	position: relative;
	left: 15px;
}

/* Footer Message */
.footer-message {
	display: block;
	font-size: 14px;
	margin-top: -2px;
	position: relative;
	left: 15px;
}

.footer-message a {
	color: #555;
	text-decoration: underline;
}

.footer-message a:hover {
	color: #222;
}

/* Footer Social Icons */
footer .social-icons {
	float: right;
}




/**
 *	-------------------------------------------------------------------------------
 *	( 08 ) - Responsive Specifications
 *	-------------------------------------------------------------------------------
 *
 *  This part contains the responsive modifications for small devices widths
 *
 *	------
 *
 *  It has the following code:
 *
 *	   |
 *	   |-->  [ 1 ] - Width From 1200px to 0
 *	   |-->  [ 2 ] - Width From 992px to 0
 *	   |-->  [ 3 ] - Width From 768px to 0
 *	   |-->  [ 4 ] - Width From 480px to 0
 *	   |-->  [ 5 ] - Width From 320px to 0
 *	   |-->  [ 6 ] - Height Form 768px to 0
 *	   |-->  [ 7 ] - Height Form Maximmum to 768px
 *	   |-->  [ 8 ] - Height Form Maximmum to 900px
 *
 */


/**
 *  [ 1 ] - Width From 1200px to 0
 *	~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 */

@media (max-width: 1200px) {

	/* Vertical Featured Image Container */
	header .vertical-featured-image-container {
		text-align: center !important
	}

	/* Pricing Table */
	.pricing-table-column {
		margin-bottom: 40px;
	}


}


/**
 *  [ 2 ] - Width From 992px to 0
 *	~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 */

@media (max-width: 992px) {

	/* Header Top Content */
	.header-top-content {
		text-align: center;
		height: auto;
	}

	.contact-info {
		display: block;
		margin-top: 15px;
	}

	.header-top-content .social-icons {
		float: none;
		margin-top: 15px;
	}

	/* Fixing Header Height With Content */
	.header-featured-content {
		position: relative;
	}

	.header-featured-content-inner {
		position: relative;
	}

	.header-slider + .header-featured-content-inner {
		height: auto;
	}

	#header-featured-content-outer, 
	header .fullscreen, 
	.header-slider li, 
	.header-center-box .vertical-featured-image-container,
	.header-center-box-content {
		height: auto !important;
	}

	/* Disable Fade Scroll Animation */
	.header-center-box {
		opacity: 1 !important;
		top: 0 !important;
		text-align: center;
	}

	.header-center-box .header-featured-title h2:after {
		margin: 25px auto 0 auto;
	}


	.header-center-box-content {
		padding: 140px 0;
		top: 0;
	}

	/* Vertical Featured Image Container */
	.vertical-featured-image-container {
		text-align: center !important;
	}

	.vertical-featured-image-container img {
		max-height: 100% !important;
	}
	
	/* Vertical Featured Image Container */
	.vertical-featured-image-container2 {
		text-align: center !important;
		padding-bottom:10px;
	}

	.vertical-featured-image-container2 img {
		max-height: 100% !important;
	}

	/* Optimizing paddings in case of using */
	[class*="col-"]:nth-child(1) .header-center-box-content {
		padding-top: 150px !important;
		padding-bottom: 0;
	}

	/* From 3rd to more */
	[class*="col-"]:nth-child(n+3) .header-center-box-content {
		padding-top: 0;
		padding-bottom: 90px;
	}

	/* Last box and in most 2nd */
	[class*="col-"]:last-child .header-center-box-content {
		padding-top: 90px;
		padding-bottom: 140px;
	}

	/* Modifing Last button if 2 buttons used in single slider slide */
	header .button:last-child {
		margin-top: 15px;
	} 

	/* Section Title */
	.col-md-12 .flat-section-title,
	.col-lg-12 .flat-section-title,
	.col-xs-12 .flat-section-title,
	.col-sm-12 .flat-section-title {
		width: 100%;
	}

	/* Info Box */
	[class*="col-md-"] .info-box1,
	[class*="col-md-"] .info-box2 {
		margin-bottom: 40px;
	}

	#pricing-plans [class*="col-"]:last-child .pricing-table-column {
		margin-bottom: 0;
	}

	.horizontal-featured-image-container img {
		width: 100%;
	}

	/* Header Go Bottom */
	.header-go-bottom  {
		display: none;
	}

	/* Remove Custom Paddings and Margins */
	.resp-remove-padding-top {
		padding-top: 0 !important;
	}
	.resp-remove-padding-bottom {
		padding-bottom: 0 !important;
	}
	.resp-remove-padding-left {
		padding-left: 0 !important;
	}
	.resp-remove-padding-left[class*="col-"] {
		padding-left: 15px !important;
	}
	.resp-remove-padding-right {
		padding-right: 0 !important;
	}
	.resp-remove-padding-right[class*="col-"] {
		padding-right: 15px !important;
	}

	.resp-remove-margin-top {
		margin-top: 0 !important;
	}
	.resp-remove-margin-bottom {
		margin-bottom: 0 !important;
	}
	.resp-remove-margin-left {
		margin-left: 0 !important;
	}
	.resp-remove-margin-right {
		margin-right: 0 !important;
	}

}


/**
 *  [ 3 ] - Width From 768px to 0
 *	~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 */

@media (max-width: 768px) {

	/* Footer Social Icons */
	footer .social-icons {
		float: none;
		margin-top: 30px;
	}

	/* Setting Widths for Flat Section Title in some Sections */
	#our-clients .flat-section-title,
	#fun-facts .flat-section-title,
	#testmonials .flat-section-title,
	#pricing-plans .flat-section-title,
	#subscribe .flat-section-title {
		width: 90%;
	}

	/* Info Box */
	.info-box {
		padding-bottom: 35px;
	}

	.testmonials-carousel-quote-icon {
		display: none;
	}	

	#testmonials {
		/*display: none;*/
	}

	.testmonials-carousel {
		padding-left: 17.5px;
	}

	.single-testmonial-content {
		width: 90%;
	}

	.clients-carousel li {
		text-align: center;
	}

	/* Custom Padding */
	*[data-padding-left] {
		padding-left: 0 !important;
	}

	*[data-padding-right] {
		padding-right: 0 !important;
	}

	/* Set col- as default padding left and right */
	[class*="col-"] {
		padding-left: 15px !important;
	}

	[class*="col-"] {
		padding-right: 15px !important;
	}

	/* Info Box */
	.info-box1,
	.info-box2 {
		margin-bottom: 40px !important;
	}

	/* Remove Custom Paddings and Margins */
	.resp-remove-padding-top {
		padding-top: 0 !important;
	}
	.resp-remove-padding-bottom {
		padding-bottom: 0 !important;
	}
	.resp-remove-padding-left {
		padding-left: 0 !important;
	}
	.resp-remove-padding-left[class*="col-"] {
		padding-left: 15px !important;
	}
	.resp-remove-padding-right {
		padding-right: 0 !important;
	}
	.resp-remove-padding-right[class*="col-"] {
		padding-right: 15px !important;
	}

	.resp-remove-margin-top {
		margin-top: 0 !important;
	}
	.resp-remove-margin-bottom {
		margin-bottom: 0 !important;
	}
	.resp-remove-margin-left {
		margin-left: 0 !important;
	}
	.resp-remove-margin-right {
		margin-right: 0 !important;
	}


}


/**
 *  [ 4 ] - Width From 480px to 0
 *	~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 */

@media (max-width: 480px) {
	
	.header-additional-addons .social-icons {
		display: none;
	}

	.vertical-featured-image-container img {
		width: 100%;
	}

	.subscribe-form input.submit {
		position: absolute;
		top: 0;
		right: 0;
	}

}


/**
 *  [ 5 ] - Width From 320px to 0
 *	~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 */

@media (max-width: 320px) {

}



/**
 *  [ 6 ] - Height From 768px to 0
 *	~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 */

@media (max-height : 768px) {

	.header-center-box-content {
		/*padding: 100px 0 90px;*/
		top: 20px;
	}

	.horizontal-featured-image-container {
		display: none;
	}

	/* Header Go Bottom */
	.header-go-bottom  {
		display: none;
	}

}


/**
 *  [ 7 ] - Height From Maximmum to 768px
 *	~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 */

@media (min-height : 768px) {

	.header-center-box-content {
		top: 0;
		padding: 150px 0;
	}	

}


/**
 *  [ 8 ] - Height From Maximmum to 900px
 *	~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 */

@media (min-height : 900px) {

	#submit-message {
		right: 30px;
		left: auto;
	}

}

.flex-video {
position: relative;
padding-top: 25px;
padding-bottom: 67.5%;
height: 0;
margin-bottom: 16px;
overflow: hidden;
}
 
.flex-video.widescreen { padding-bottom: 56.25%; }
.flex-video.vimeo { padding-top: 0; }
 
.flex-video iframe,
.flex-video object,
.flex-video embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
@media only screen and (max-device-width: 800px), only screen and (device-width: 1024px) and (device-height: 600px), only screen and (width: 1280px) and (orientation: landscape), only screen and (device-width: 800px), only screen and (max-width: 767px) {
.flex-video { padding-top: 0; }
}