/*

BENJAMIN HUANCA

@benjaminhuanca

*/







/* ------------------------------------------ */

/*             TABLE OF CONTENTS

/* ------------------------------------------ */



/*   01 - General & Basic Styles   */

/*   02 - Header & Navigation      */

/*   03 - Top Page Banner          */

/*   04 - Features                 */

/*   05 - Screens		           */

/*   06 - Team                     */

/*   07 - Video Banner             */

/*   08 - Pricing Tables           */

/*   09 - Testimonials Rotator	   */

/*   10 - FAQs			 	  	   */

/*   11 - Contacts		 	  	   */

/*   12 - Newsletter	 	  	   */

/*   13 - Footer		 	  	   */

/*   14 - Scroll to Top	 	  	   */







/* ==========================================================================

   01. GENERAL & BASIC STYLES

   ========================================================================== */

 

#content-wrapper {

	margin-top: 150px;

}



.color-theme {

	color: #af3809;

} 



/*------------------------------------------*/

/*	 Page Preload

/*------------------------------------------*/



#preOverlay {

	background-color: #af3809;

}



#jpreLoader {

	width: 300px;

	height: 100px;

	position: relative;

	z-index: 1;

	margin:0 auto;

}

#jpreBar {

	position:fixed;

	width:100%;

	height:100% !important;

	top:0;

	left:0;

}

#jprePercentage {

	color:#ddd;

	text-shadow: 0px 10px 10px rgba(0, 0, 0, 0.4);

	text-align:center;

	font-size: 60px;

	font-weight: 400;

	letter-spacing:-2px;

	z-index:2;

	margin: 0;

}



/*------------------------------------------*/

/*	 Headers

/*------------------------------------------*/



h1, h2, h3, h4, h5, h6 {

	margin-top: 0; 

	margin-bottom: 10px;

}



/*------------------------------------------*/

/*	 Link Setting

/*------------------------------------------*/



a {

	text-decoration: none;

	-webkit-transition: all 250ms ease-in-out;

	-moz-transition: all 250ms ease-in-out;

	-o-transition: all 250ms ease-in-out;

	-ms-transition: all 250ms ease-in-out;

	transition: all 250ms ease-in-out;

}



a:hover {

	color: #444;

	text-decoration: none;

}



a:focus {

	color: #f8f8f8;

	outline: none;

	border: none;

	text-decoration: none;

} 



/*------------------------------------------*/

/*	 Lists

/*------------------------------------------*/



ul {

	margin: 0;

	padding: 0;

	list-style: none;

}



/*------------------------------------------*/

/*	 Section Titlebar

/*------------------------------------------*/



.titlebar {

	

	text-align: center;	

}



.titlebar h1 {

	color: #444;

	font-weight: 900;

	text-transform: uppercase;

	text-shadow: 0px 1px 1px rgba(10, 10, 10, 0.6);	

}



.titlebar p {

	color: #888;

	font-size: 17px;

	font-family: 'Paprika', cursive;

	line-height: 28px;

	font-weight: 400;

	padding: 0 18%;

}



/*------------------------------------------*/

/*	 Theme Color Button

/*------------------------------------------*/



.btn-theme {

	background-color: #953009;

	border: 1px solid #8a2c07;

	color: #fff;

	font-size: 16px;

	font-weight: 700;

	padding: 10px 20px;

	box-shadow: 0px 1px 0px rgba(255, 255, 255, 0.2) inset, 0px 1px 2px rgba(0, 0, 0, 0.2);

	-webkit-transition: all 200ms ease-in-out;

	-moz-transition: all 200ms ease-in-out;

	-o-transition: all 200ms ease-in-out;

	-ms-transition: all 200ms ease-in-out;

	transition: all 200ms ease-in-out;

}



.btn-theme:hover {

	background-color: #bb4c20;

	box-shadow: 0px 1px 0px rgba(255, 255, 255, 0.2) inset, 0px 1px 2px rgba(0, 0, 0, 0.2);

	color: #f8f8f8; 

}



/*------------------------------------------*/

/*	 Black Button

/*------------------------------------------*/



.btn-black {

	background-color: #444;

	border: 1px solid #333;

	color: #fff;

	font-size: 16px;

	font-weight: 700; 

	padding: 10px 20px;

	box-shadow: 0px 1px 0px rgba(255, 255, 255, 0.2) inset, 0px 1px 2px rgba(0, 0, 0, 0.2);

	-webkit-transition: all 200ms ease-in-out;

	-moz-transition: all 200ms ease-in-out;

	-o-transition: all 200ms ease-in-out;

	-ms-transition: all 200ms ease-in-out;

	transition: all 200ms ease-in-out;

}



.btn-black:hover {

	background-color: #555;

	box-shadow: 0px 1px 0px rgba(255, 255, 255, 0.2) inset, 0px 1px 2px rgba(0, 0, 0, 0.2);

	color: #fff;

}



/*------------------------------------------*/

/*	 Large Button Settings   

/*------------------------------------------*/



.btn-lg {

	font-size: 18px;

	padding: 14px 28px;

}



.btn:focus {

	outline: none;

}



.btn:focus {

	color: #f8f8f8;

	text-decoration: none;

}







/* ==========================================================================

   02. HEADER & NAVIGATION

   ========================================================================== */



/*------------------------------------------*/

/*	 Logo Image    

/*------------------------------------------*/

.navbar-brand {

	padding: 15px;

}   

      

/*------------------------------------------*/

/*	 Navigation Menu    

/*------------------------------------------*/



.navbar-nav > li > a {

	color: #aaa;	

    display: block;

	padding: 0 15px;

	font-size: 13px;

	font-weight: 700;

	line-height: 60px;

	text-transform: uppercase;

	-webkit-transition: all 100ms ease-in-out;

	-moz-transition: all 100ms ease-in-out;

	-o-transition: all 100ms ease-in-out;

	-ms-transition: all 100ms ease-in-out;

	transition: all 100ms ease-in-out;

}



.navbar-nav > li > a:hover {

	color: #f8f8f8;

}



.navbar-nav > li > a.selected-nav {

	color: black;

}



/*------------------------------------------*/

/*	 Responsive Menu    

/*------------------------------------------*/

.navbar-toggle {

    position: relative;

    float: right;

    padding: 10px;

	margin: 13px 30px 13px 0;

    background-color: none;

	border: none;

}







/* ==========================================================================

   03. TOP PAGE BANNER

   ========================================================================== */



#top-page-banner {

	background-image: url(../img/thumbs/top_banner_bkg.jpg); 

	background-repeat: repeat;

	background-position: top center;

	background-color: #af3809;

	color: #fff;

	padding: 20px 0;

}



/*------------------------------------------*/

/*	 Top Banner Description

/*------------------------------------------*/



#tp_banner_description {

	margin: 110px 0 130px;

}



#tp_banner_description h1 {

	font-family: 'Fauna One', serif;

	line-height: 1.3;

	text-shadow: rgba(10, 10, 10, 0.6) 0px 1px 1px;

}



#tp_banner_description p {

	font-size: 16px;

	line-height: 26px;

	font-weight: 600;

	margin-bottom: 0;

	margin-top: 20px;

	margin-bottom: 40px;

}



/*------------------------------------------*/

/*	  Top Banner Buttons

/*------------------------------------------*/



.tp_banner_btn a {

	margin-right: 10px;

}



/*------------------------------------------*/

/*	  Top Banner Image

/*------------------------------------------*/



#tp_banner_image .img-responsive { 

	display: inline-block; 

}







/* ==========================================================================

   04. FEATURES

   ========================================================================== */

 

#features {

	padding-top: 5%;

	padding-bottom: 40px;

} 



#f_center_content { opacity: 0;} 



#feature_1, 

#feature_2, 

#feature_3, 

#feature_4, 

#feature_5, 

#feature_6 { 

	opacity: 0; 

	margin-top: 30px;

}



/*------------------------------------------*/

/*	  Features Left Side 

/*------------------------------------------*/



#f_left_content {

    text-align: right;

	padding-right: 0;

}



/*------------------------------------------*/

/*	  Features Right Side

/*------------------------------------------*/



#f_right_content {

    text-align: left;

    padding-left: 0;

}



/*------------------------------------------*/

/*	  Features Box

/*------------------------------------------*/



.feature-box p {

	color: #888;

	line-height: 20px;

}



.feature-box h4 {

	font-size: 16px;

	font-family: 'Paprika', cursive;

}



/*------------------------------------------*/

/*	  Feature Box Icon

/*------------------------------------------*/



.feature-box-icon i {

	color: #af3809; 

	font-size: 34px;

	margin: 10px 0 ;

}







/* ==========================================================================

   05. SCREENS 

   ========================================================================== */



#screens {

	padding-top: 80px;

	padding-bottom: 50px;

	border-bottom: 1px solid #ddd;

	background-color: #ECF0F1;

} 



#screenshot_1, 

#screenshot_2,

#screenshot_3,

#screenshot_4,

#screenshot_5,

#screenshot_6, 

#screenshot_7, 

#screenshot_8 { 

	opacity: 0;

	//margin-bottom: 30px;

}



/*------------------------------------------*/

/*	  Image Hover Effect

/*------------------------------------------*/



.hover-details {

	width: 100%;

	height: auto;

	overflow: hidden;

	position: relative;

	transition: all 400ms;

	-moz-transition: all 400ms;

	-webkit-transition: all 400ms;

	-o-transition: all 400ms;

}



.hover-details .img-cover {

	opacity: 0;

	position: absolute;

	top: 0;

	left: 0;

	width: 100%;

	height: 100%;

	background: rgba(15, 15, 15, 0.55);

	-moz-transition: all 400ms;

	-webkit-transition: all 400ms;

	-o-transition: all 400ms;

	transition: all 400ms;

}



.hover-details > img {

	width: 350px;

	height: 250px;

	-moz-transition: all 400ms;

	-webkit-transition: all 400ms;

	-o-transition: all 400ms;

	transition: all 400ms;

}



/*------------------------------------------*/

/*	  Image Zoom Icon

/*------------------------------------------*/



.image_zoom {

	position:absolute;

	top: -50%;

	left:50%;

	width:50px;

	height:50px;

	border-radius:50%;

	background: #af3809 url(../img/icons/zoom-ico.png) no-repeat 50% 50%;

	margin-top:-25px;

	margin-left: -25px;

	-webkit-transition: all ease 400ms;

	-moz-transition: all ease 400ms;

	-ms-transition: all ease 400ms;

	-o-transition: all ease 400ms;

	transition: all ease 400ms;

}



/*------------------------------------------*/

/*	 Image Title

/*------------------------------------------*/

.img-cover h3 {

	width: 100%;

	position: absolute;

	bottom: -28%;

	text-align: center;	

	color: #f8f8f8;

	font-size: 16px;

	font-weight: 400;

	padding: 0 10px;

	-webkit-transition: all 300ms ease-in-out;

	-moz-transition: all 300ms ease-in-out;

	-o-transition: all 300ms ease-in-out;

	-ms-transition: all 300ms ease-in-out;

	transition: all 300ms ease-in-out;

}



/*------------------------------------------*/

/*	 Image Scale ( Hover Effect )

/*------------------------------------------*/



.hover-details:hover > img {

	transform: scale(1.2);

	-ms-transform: scale(1.2);

	-webkit-transform: scale(1.2);

	-o-transform: scale(1.2);

	-moz-transform: scale(1.2);

}



.hover-details:hover .image_zoom {

	top: 45%;

}



.hover-details:hover .img-cover h3 {

	bottom: 28%;

}



.hover-details:hover .img-cover {

	opacity: 1;

}



.image_zoom:hover {

	background-color: #333;

}







/* ==========================================================================

   06. TEAM

   ========================================================================== */

   

#team {

	padding-top: 80px;

	padding-bottom: 80px;

	border-bottom: 1px solid #ddd;

} 



#team-member-holder {opacity:0;} 



.team-member {

	text-align: center;

	-webkit-transition: all 250ms ease-in-out;

	-moz-transition: all 250ms ease-in-out;

	-o-transition: all 250ms ease-in-out;

	-ms-transition: all 250ms ease-in-out;

	transition: all 250ms ease-in-out;

}



/*------------------------------------------*/

/*	  Team Member Photo

/*------------------------------------------*/



.img-block { 

	margin: 10px 10px 20px 10px;

}



.img-block img {

	-webkit-border-radius: 50%;

    -moz-border-radius: 50%;

    border-radius: 50%;

	box-shadow: 0px 0px 0px 0 rgba(10, 10, 10, 0.15);

	opacity: 1;

	-webkit-transition: all 250ms ease-in-out;

	-moz-transition: all 250ms ease-in-out;

	-o-transition: all 250ms ease-in-out;

	-ms-transition: all 250ms ease-in-out;

	transition: all 250ms ease-in-out;

}



/*------------------------------------------*/

/*	  Team Member Photo Hover

/*------------------------------------------*/



.team-member:hover .img-block img {

	box-shadow: 0px 0px 0px 10px rgba(10, 10, 10, 0.1);

	opacity: .85;

}



/*------------------------------------------*/

/*	  Team Member Meta

/*------------------------------------------*/



.team-img-meta h4 {

	font-family: 'Paprika', cursive;

	font-weight: 400;

	text-transform: uppercase;

}



.team-img-meta p {

	font-size: 16px;

	font-family: 'Paprika', cursive;

	font-weight: 400;

	margin-bottom: 10px;

	padding: 0 15%;

}



p.member-info {

	font-family: 'Open Sans', sans-serif;

	font-size: 14px;

	line-height: 20px;

	padding: 0 5%;

	margin-bottom: 20px;

}



/*------------------------------------------*/

/*	  Team Member Social Icons 

/*------------------------------------------*/



.team-member-socials {

	text-align: right;

	display: inline-block;

	margin: 0 auto;

}



.team-member-socials li {

	float: left;

    display: inline-block !important;

    vertical-align: top;

    width: auto !important;

    clear: none !important;

}



.page_social {

    width: 40px;

    height: 40px;

	background-color: #bbb;

	color: #fff;

	font-size: 14px; 

    text-align: center;

    line-height: 34px;

    display: block;

    text-decoration: none;

	border: 2px solid #bbb;

	-webkit-border-radius: 50%;

    -moz-border-radius: 50%;

    border-radius: 50%;

	margin: 0 3px 5px;

	-webkit-transition: all 250ms ease-in-out;

	-moz-transition: all 250ms ease-in-out;

	-o-transition: all 250ms ease-in-out;

	-ms-transition: all 250ms ease-in-out;

	transition: all 250ms ease-in-out;

}



/*------------------------------------------*/

/*	  Team Member Icons Hover 

/*------------------------------------------*/



.page_social:hover {

	background-color: #af3809; 

	border-color: #af3809;

	color: #f8f8f8;

}







/* ==========================================================================

   07. VIDEO BANNER

   ========================================================================== */



#video-banner {

	background: #033c78;

	color: #f8f8f8;

	padding: 70px 0;

}



/*------------------------------------------*/

/*	  Video Banner Content 

/*------------------------------------------*/



#v_banner_content {

	opacity: 0;

	margin: 9px 0;

}



#v_banner_content h1 {

	font-family: 'Fauna One', serif;

	margin-bottom: 30px;

}



#v_banner_content p {

	font-size: 16px;

	line-height: 26px;

	font-weight: 600;

}



/*------------------------------------------*/

/*	 Video Banner Buttons

/*------------------------------------------*/



.btn-google-play, .btn-app-store {

	display: block;

	width: 152px;

	height: 50px;

	margin-top: 30px;

	margin-right: 10px;

	background-repeat: no-repeat;

	text-indent: -9999px;

	overflow: hidden;

	display: inline-block;

}



.btn-google-play {

	background: url(../img/icons/btn-google-store.png);

}



.btn-app-store {

	background: url(../img/icons/btn-app-store.png);

}



/*------------------------------------------*/

/*	  Video Banner Video 

/*------------------------------------------*/



#v_banner_video {

	opacity: 0;

}



.video-block {

	position: relative;

	padding-bottom: 60%;

	padding-top: 30px;

	height: 0;

	overflow: hidden;

}



.video-block iframe,

.video-block object,

.video-block embed {

	position: absolute;

	top: 0;

	left: 0;

	width: 100%;

	height: 100%;

	border:0;

}







/* ==========================================================================

   08. PRICING 

   ========================================================================== */



#pricing {

	padding-top: 80px;

	padding-bottom: 100px;

	border-bottom: 1px solid #ddd;

} 



#price_1, 

#price_2, 

#price_3,

#price_4  {opacity:0;}

    

.pricing-table {

    border: 1px solid #ccc;

}



.pricing-table strong {

	color: #af3809;

}



/*------------------------------------------*/

/*	  Pricing Table Header

/*------------------------------------------*/



.pricing-table .plan-title {

	background-color: #444;

    color: #fff;

	font-size: 22px;

	font-family: 'Paprika', cursive;

	font-weight: 600;

	text-transform: none;

    line-height: 40px;

    padding: 15px;

    margin: 0px -1px;

	border: 1px solid #ccc;

	border-top: none;

	border-bottom: none;

	-webkit-transition: all 250ms ease-in-out;

	-moz-transition: all 250ms ease-in-out;

	-o-transition: all 250ms ease-in-out;

	-ms-transition: all 250ms ease-in-out;

	transition: all 250ms ease-in-out;	

}



.pricing-table .price-header {

	border-bottom: 1px solid #ccc;

	position: relative;

}



/*------------------------------------------*/

/*	  Pricing Table Price Plan

/*------------------------------------------*/



.pricing-table .plan-price {

    line-height: normal;

    background-color: #f3f3f3;

    padding: 12px 15px;

    margin: 0px;

    border-top: 1px solid #ddd;

	-webkit-transition: all 300ms ease-in-out;

	-moz-transition: all 300ms ease-in-out;

	-o-transition: all 300ms ease-in-out;

	-ms-transition: all 300ms ease-in-out;

	transition: all 300ms ease-in-out;	

}



.pricing-table .plan-price span {

	color: #444;

    font-size: 30px;

    font-weight: 900;

}



.plan-price small {

    font-size: 18px;

}



/*------------------------------------------*/

/*	  Pricing Table Body

/*------------------------------------------*/



.pricing-table ul.features {

	background-color: #eee;

    padding: 11px 16px;

}



.pricing-table ul.features li {

	font-size: 16px;

    border-top: 1px dashed #aaa;

    padding: 15px; 

}



.pricing-table ul.features li:nth-child(1) {

    border: none;

}



/*------------------------------------------*/

/*	  Pricing Table Footer

/*------------------------------------------*/



.pricing-table .price-footer {

	background-color: #fafafa;

    padding-top: 25px;

    padding-bottom: 25px;

    border-top: 1px solid #aaa;

	-webkit-border-radius: 0 0 5px 5px;

    -moz-border-radius: 0 0 5px 5px;

    border-radius: 0 0 5px 5px;

}



/*------------------------------------------*/

/*	  Featured Table

/*------------------------------------------*/



.pricing-table.featured .plan-title {

    background-color: #af3809;

}



.pricing-table.featured .plan-title, 

.pricing-table.featured .plan-price span, 

.pricing-table.featured .plan-price small {

    color: #fff;

}



.pricing-table.featured .plan-price {

    border-top: 1px solid #7e1203;

    background-color: #af3809;

}



/*------------------------------------------*/

/*	  Pricing Table Hover

/*------------------------------------------*/



.pricing-table:hover .plan-title {

    background-color: #af3809;

}



.pricing-table:hover .plan-price {

    border-top: 1px solid #7e1203;

    background-color: #af3809;

}



.pricing-table:hover .plan-price span,

.pricing-table:hover .plan-price small {

    color: #fff;

}



/*------------------------------------------*/

/*	  Corner Ribbon

/*------------------------------------------*/



.ribbon-wrapper {

  width: 85px;

  height: 85px;

  overflow: hidden;

  position: absolute;

  top: -6px;

  right: -3px;

}



.ribbon {

	font-size: 14px;

	font-weight: 700;

	text-transform: uppercase;

	text-align: center;

	text-shadow: rgba(150, 150, 150, 0.3) 0px 1px 0px;

	-webkit-transform: rotate(45deg);

	-moz-transform:    rotate(45deg);

	-ms-transform:     rotate(45deg);

	-o-transform:      rotate(45deg);

	position: relative;

	padding: 7px 0;

	left: -5px;

	top: 15px;

	width: 120px;

	background-color: #4db8e0;

	background-image: -webkit-gradient(linear, left top, left bottom, from(#4db8e0), to(#0391c5));

	background-image: -webkit-linear-gradient(top, #4db8e0, #0391c5);

	background-image:    -moz-linear-gradient(top, #4db8e0, #0391c5);

	background-image:     -ms-linear-gradient(top, #4db8e0, #0391c5);

	background-image:      -o-linear-gradient(top, #4db8e0, #0391c5);

	color: #fff;

	-webkit-box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.3);

	-moz-box-shadow:    0px 0px 3px rgba(0 ,0, 0, 0.3);

	box-shadow:         0px 0px 3px rgba(0, 0, 0, 0.3);

}



.ribbon:before, .ribbon:after {

	content: "";

	border-top:   3px solid #6e8900;

	border-left:  3px solid transparent;

	border-right: 3px solid transparent;

	position:absolute;

	bottom: -3px;

}



.ribbon:before {

	left: 0;

}

.ribbon:after {

	right: 0;

}







/* ==========================================================================

   09. TESTIMONIALS ROTATOR

   ========================================================================== */



#testimonials-rotator {

    background-color: #333;

	border-bottom:1px solid #ddd;

	color: #fff;

    text-align: center;

}



.testimonials {

	margin: 50px 8%;

}



.slides {

	margin: 30px 0 60px;

}



/*------------------------------------------*/

/*	 Testimonial Message

/*------------------------------------------*/



.testimonials p {

	font-size: 18px;

	font-family: 'Paprika', cursive;

	line-height: 30px;

    padding-top: 10px;

}



/*------------------------------------------*/

/*	 Message Author

/*------------------------------------------*/



.testimonials p.author {

	font-size: 16px;

	font-family: 'Open Sans', sans-serif;

	margin-bottom: 0;

}



.testimonials p.author span {

	color: #c04210;

	font-style: italic;

}







/* ==========================================================================

   10. FAQs

   ========================================================================== */



#faq {

	padding-top: 80px;

	padding-bottom: 100px;

	border-bottom: 1px solid #ddd;

}



#question_1,

#question_2,

#question_3,

#question_4,

#question_5,

#question_6,

#question_7,

#question_8 { 

	opacity: 0;

	width: 100%;

	display: block; 

	float: left; 

	padding: 0; 

	margin: 5px 0; 	

	cursor: pointer; 	

}



/*------------------------------------------*/

/*	  FAQs Accordion

/*------------------------------------------*/



.accordion a { 

	color: #666; 

	font-size: 13px;

	font-family: 'Paprika', cursive;

	line-height: 26px;

	padding: 10px 40px;

	text-decoration: none; 

	border-left: 4px solid #d0d0d0;

	border-bottom: 1px solid rgba(190, 190, 190, 0.2);

	display: block; 

	cursor: pointer; 

	background: #E4E4E1 url(../img/icons/open.png) no-repeat center left;

}



.accordion li.active>a { 

	background: #E4E4E1 url(../img/icons/close.png) no-repeat center left;  

	color: #151515;

	border-left: 4px solid #af3809;

	border-bottom: 1px solid #ccc;

	box-shadow: none;

}



/*------------------------------------------*/

/*	  FAQs Answer

/*------------------------------------------*/



.accordion li div { 

	line-height: 22px;

	padding: 15px 10px; 

	display: block; 

	clear: both; 

	float: left; 

}







/* ==========================================================================

   11. CONTACTS 

   ========================================================================== */



#contact {

	padding-top: 80px;

	padding-bottom: 80px;

	background-image: url(../img/thumbs/content_section_bkg.jpg); 

	background-repeat: no-repeat;

	background-position: center top;

	background-color: #ecf0f1;

	border-bottom: 1px solid #aaa;

} 



#input_name, 

#input_email, 

#input_subject, 

#input_message { opacity: 0;}



/*------------------------------------------*/

/*	  Contact Form Input

/*------------------------------------------*/



#contact-form .form-control {

	height: 50px;

	margin-bottom: 20px;

	border: 1px solid #aaa;

	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2)

}



.contact-form input[type="text"],

.contact-form input[type="email"],

.contact-form textarea {

	background: #f3f3f3;

	color: #444;

	-webkit-transition: all 300ms ease-in-out;

	-moz-transition: all 300ms ease-in-out;

	-o-transition: all 300ms ease-in-out;

	-ms-transition: all 300ms ease-in-out;

	transition: all 300ms ease-in-out;

	box-shadow: 0 0 0 0;

	padding: 8px;

	margin-bottom: 15px;

}



#contact-form textarea {

	min-height:180px;

}



/*------------------------------------------*/

/*	  Contact Form Focus

/*------------------------------------------*/



.form-control:focus {

    border-color: #af3809;

    outline: 0px none;

    box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.075) inset, 0px 0px 8px rgba(171, 34, 16, 0.6);

}



/*------------------------------------------*/

/*	  Contact Form Submit Button

/*------------------------------------------*/



#form_btn {

	margin-top: 30px;

	opacity: 0;

}



/*------------------------------------------*/

/*	  Contact Form Error Message 

/*------------------------------------------*/



.error {

	padding: 0 5px 20px;

	color: #af3809;

}







/* ==========================================================================

   12. NEWSLETTER  

   ========================================================================== */



#newsletter {

	background: #af3809;

	border-bottom: 1px solid #666;

	color: #fff;

}



#subscribe {

	margin-top: 40px;

	margin-bottom: 40px;

}



#newsletter_title {

	opacity: 0;

}



#newsletter h1 {

	font-family: 'Fauna One', serif;

}



#newsletter p {

	line-height: 26px;

	font-family: 'Paprika', cursive;

}



/*------------------------------------------*/

/*	  Newsletter Form

/*------------------------------------------*/



#newsletter_form {

	padding-left: 60px;

	opacity: 0;

}



.subscribe-form {

	margin: 14px auto;

    position: relative;

    z-index: 10;

}



#newsletter_form p {

	font-size: 14px;

	line-height: 16px;

	font-family: 'Open Sans', sans-serif;

	font-style: italic;

	text-align: right;

}



.subscribe-input {

    width: 75%;

    height: 54px;

	color: #999;

	font-size: 16px;

    font-weight: 300;

    color: #222;

	padding-left: 10px;

	border-radius:6px 0 0 6px;

}



.subscribe-submit {

	width: 25%;

	height: 54px;

	background: #953009;

	border: 1px solid #8a2c07;

    color: #fff;

	font-weight:900;

	text-decoration:none;

	text-transform: uppercase;

	text-align:center;

    display: block;

    position: absolute;

    top: 0px;

    right: 0px;

    border:none;

	border-radius:0 6px 6px 0;

    cursor: pointer;

    outline: 0;

	box-shadow: 0px 1px 0px rgba(255, 255, 255, 0.2) inset, 0px 1px 2px rgba(0, 0, 0, 0.2);

}



.subscribe-submit:active {

    outline: 0;

}



.subscribe-submit:hover {

    opacity:0.8

}







/* ==========================================================================

   13. FOOTER   

   ========================================================================== */



#footer { 

	padding: 30px 0 20px;

	background-color: #333;

}



#footer_copy, 

#footer_icons { 

	opacity: 0; 

}



#footer p {

	color: #999;

	font-family: 'Paprika', cursive;

	line-height: 40px;

	margin-bottom: 0;	

}



/*------------------------------------------*/

/*	 Footer Social Icons  

/*------------------------------------------*/



.footer-socials {

	margin: 10px 0;

}	



.footer-socials li {

	float: left;

	width: auto !important;

    display: inline-block !important;

    vertical-align: top;

    clear: none !important;

	line-height: 70px;

}



.foo_social {

    width: 44px;

    height: 44px;

	text-align: center;

	color: #999;

	font-size: 18px;

    line-height: 40px;

	margin: 0 4px;

	border: 2px solid #999;

	-webkit-border-radius: 50%;

    -moz-border-radius: 50%;

    border-radius: 50%;

    display: block;

    text-decoration: none;

	-webkit-transition: all 250ms ease-in-out;

	-moz-transition: all 250ms ease-in-out;

	-o-transition: all 250ms ease-in-out;

	-ms-transition: all 250ms ease-in-out;

	transition: all 250ms ease-in-out;

}



/*------------------------------------------*/

/*	 Footer Icons Hover 

/*------------------------------------------*/



.ico-facebook:hover {background-color: #3b5998;color: #f8f8f8;border-color:#3b5998;}

.ico-twitter:hover {background-color: #00a9ed;color: #f8f8f8;border-color:#00a9ed;}

.ico-google-plus:hover {background-color: #cd1111;color: #f8f8f8;border-color:#cd1111;}

.ico-linkedin:hover {background-color: #015886;color: #f8f8f8;border-color:#015886;}

.ico-dribbble:hover {background-color: #d92d84;color: #f8f8f8;border-color:#d92d84;}

.ico-instagram:hover {background-color: #beb3a8;color: #f8f8f8;border-color:#beb3a8}

.ico-pinterest:hover {background-color: #ac281a;color: #f8f8f8;border-color:#ac281a;}

.ico-dropbox:hover {background-color: #008ad2;color: #f8f8f8;border-color:#008ad2;}

.ico-skype:hover {background-color: #00a9ed;color: #f8f8f8;border-color:#00a9ed;}

.ico-youtube:hover {background-color: #cd1b20;color: #f8f8f8;border-color:#cd1b20;}

.ico-tumblr:hover {background-color: #3a5976;color: #f8f8f8;border-color:#3a5976;}

.ico-vimeo:hover {background-color: #00adee;color: #f8f8f8;border-color:#00adee;}

.ico-flickr:hover {background-color: #d2d2d2;color: #f8f8f8;border-color:#d2d2d2;}

.ico-github:hover {background-color: #222;color: #f8f8f8;border-color:#222;}

.ico-renren:hover {background-color: #364a83;color: #f8f8f8;border-color:#364a83;}

.ico-vk:hover {background-color: #3b5998;color: #f8f8f8;border-color:#3b5998;}

.ico-xing:hover {background-color: #015f5e;color: #f8f8f8;border-color:#015f5e;}

.ico-weibo:hover {background-color: #be4443;color: #f8f8f8;border-color:#be4443;}

.ico-rss:hover {background-color: #ff6600;color: #f8f8f8;border-color:#ff6600;}







/* ==========================================================================

   14. SCROLL TO TOP   

   ========================================================================== */



#scrollUp {

	bottom: 30px;

	right: 30px;

	width: 50px;

	height: 50px;

	-webkit-border-radius: 50%;

    -moz-border-radius: 50%;

    border-radius: 50%;

	position: fixed;

	display: none;

	background: rgba(123, 123, 123, 0.65) url(../img/icons/back-to-top.png) no-repeat 50% 48%;

	-webkit-transition: all 250ms linear;

	-moz-transition: all 250ms linear;

	transition: all 250ms linear;	

}



#scrollUp:hover {

	background-color: rgba(175, 56, 9, 0.95);

}



nav a#pull {  

    display: none;  

}











/* ==========================================================================

   STYLE CHANGER 

   ========================================================================== */



#stlChanger {

	color:#cecece;

	font-size: 14px;

	overflow:hidden;

	position:fixed;

	top: 80px;

	left:0;

	z-index:1000000 ;

}



#stlChanger .siteChanger, 

#stlChanger .bgChanger,

 #stlChanger .buts {

	position:relative;

	overflow:hidden;

}



#stlChanger .siteChanger, 

#stlChanger .bgChanger {

	min-width: 220px;

	min-height: 220px;

}



#stlChanger a {

	color: #fff;

	text-decoration: none;

}



#stlChanger a:hover {text-decoration:none;}



#stlChanger .blockChanger {

	width: 170px;

}



#stlChanger .chBody {

	background: rgba(240, 240, 240, 0.5);

	width: 180px;

	position: relative;

	overflow: hidden;

	border: 1px solid #aaa;

	border-radius: 0 6px 6px 0;

}



#stlChanger .chBut {

	background: #444;

	width: 40px;

	height: 40px;

	position:absolute;

	top: 15px;

	right:0px;

	z-index:10;

	text-align: center;

	border-radius: 0px 4px 4px 0px;

}



#stlChanger .chBut i {

	color:#fff;

	font-size: 28px;

	margin: 6px;

}



#stlChanger .stBlock {

	position:relative;

	overflow:hidden;

}



#stlChanger .stBlock p {

	color: #444;

	font-size: 14px;

	font-family: 'Paprika', cursive;

	margin-left: 22px;

}



#stlChanger h4 {

	color: #444;

	font-size: 18px;

	background: #444;

	font-weight: 900;

	line-height: 22px;

	display:block;

	margin-top: 0;

	padding: 8px 10px 9px;

}



#stlChanger .stBgs a  {

	text-decoration:none;

	width: 45px;

	height: 45px;

	float:left;

	padding:0;

	margin: 3px 3px 0 0;

	cursor:pointer;

	opacity: 1;

}



#stlChanger .stBgs a:hover {

	opacity: 0.7;

}



#stlChanger a.dark-style {

    display: inline-block;

    padding: 6px 16px;

    text-align: center;

    background: none repeat scroll 0% 0% rgb(75, 76, 77);

	font-size: 14px;

	font-weight: 900;

    color: #fff;

    cursor: pointer;

}



#stlChanger a.dark-style:hover {

    background: #ab2210;

	color: #fff;

}



#stlChanger .btn-theme {

	font-size: 14px;

	font-weight: 700; 

	text-transform: none;	

	padding: 6px 10px;

}