/*
Theme Name: Haute Fabrication
Text Domain: hautefabrication
Description: Haute Fabrication Custom Design
Author: Design Bee Advertising
Author URI: http://www.designbeeadvertising.com/

*/

body, html { float: left; width: 100%; height: 100%; margin: 0; padding: 0; }
p { }
a { }
a:hover { }
ul { }
ul li { }
ul li a { }
ul li a:hover { }
h1, h2, h3, h4, h5, h6 { }

.top-header { width: 100%; height: auto; float: left; background-color: #d0112b; color: #FFF; font-family: 'Roboto', sans-serif; font-size: 12px; font-weight: 700; padding: 5px 4.3%; }
.top-header .number { float: left; padding: 8px 0; width: auto; }
.top-header .number a { color: #FFF; text-decoration: none; font-size: 15px; font-weight: 500; }
.top-header .number a:hover { text-decoration: none; }
.top-header .social { float: right; width: auto; padding: 7px 0; }
.top-header .social ul { float: left; width: auto; list-style: none; padding: 0; margin: 0; }
.top-header .social ul li { float: left; padding: 0 7px; }
.top-header .social ul li:last-child { padding-left: 12px; padding-top: 3px; }
.top-header .social ul li a { color: #FFF; text-decoration: none; font-size: 14px; }
.top-header .social ul li a:hover { text-decoration: none; }
.top-header .social ul li a img { max-height: 15px; }

.header { float: left; width: 100%; padding: 5px 4.3%; height: auto; }
.header .logo { float: left; width: auto; padding-left: 0; }
.header .logo a img { width: 260px; }
.header .nav { float: right; width: auto; padding-right: 0; }
.header .nav ul { float: left; padding: 0; list-style: none; padding-top: 5px; }
.header .nav ul li { float: left; padding: 0px 20px; background-image: url(images/navborder.png); background-repeat: no-repeat; background-position: right 45%; background-size: 2px 40%; position: relative; }
.header .nav ul li a { font-family: 'Roboto', sans-serif; font-size: 15px; color: #000; font-weight: 500; text-transform: uppercase; }
.header .nav ul li a img { width: 15px; }
.header .nav ul li:last-child { padding: 0 0 0 25px; background: transparent; }
.header .nav ul li span.arrow { float: right; width: 10px; height: 11px; background-image: url(images/arrow.png); background-repeat: no-repeat; background-position: center center; position: relative; top: 5px; background-size: contain; right: -10px; }
.header .nav ul li ul { display: none; position: absolute; padding-top: 5px; width: auto; z-index: 999; border: 2px solid #FFF; }
.header .nav ul li ul li { float: left; width: 100%; text-align: left; padding-left: 0 !important; padding: 5px 50px !important; background: rgba(0, 0, 0, 0.8) !important; border-bottom: 1px solid #FFF; }
.header .nav ul li ul li:last-child { border: 0; }
.header .nav ul li ul li:hover { background: rgba(150, 29, 46, 1) !important; }
.header .nav ul li ul li a { color: #FFF !important; }
.header .nav ul li ul li a:hover { text-decoration: none; }

.slider { float: left; width: 100%; max-height: 650px; padding: 0; }
.slider-internal { max-height: 435px; overflow: hidden; } }
.slider .foreground { float: left; width: 100%; height: 650px; position: relative; z-index: 99; }
.slider-internal .foreground { height: 435px; }
.slider .foreground img.foreground-pic { width: 100%; height: 650px; max-width: 50%; position: relative; z-index: 99; }
.slider-internal .foreground img.foreground-pic { height: 929px; max-width: 100%; top: -180px; }
.slider .foreground .foreground-info { width: 45%; height: 650px; position: absolute; left: 0; top: 0; padding: 100px 0; }
.slider-internal .foreground .foreground-info { height: 435px; }
.slider .foreground .foreground-info > div { position: relative; z-index: 100; padding-left: 100px; padding-right: 50px; }
.slider .foreground .foreground-info > div p { text-align: left; }
.slider .foreground .foreground-info > div p img { max-width: 300px; }
.slider .foreground .foreground-info > div h3 { color: #FFF; font-size: 1.8vw; font-style: italic; font-weight: 700; }
.slider-internal .foreground .foreground-info > div h3 { font-style: inherit; font-size: 2.8vw; margin-top: 30px; }
.slider .foreground .foreground-info > div hr { background-color: #d0112b; height: 10px; width: 23%; float: left; border: 0; margin-right: 77%; margin-top: 15px; margin-bottom: 15px; }
.slider .foreground .foreground-info > div .left-fg { float: left; max-width: 30%; }
.slider .foreground .foreground-info > div .left-fg ul { list-style: none; padding: 0; }
.slider .foreground .foreground-info > div .left-fg ul li { float: left; width: 100%; padding: 5px 0px 5px 25px; background-image: url(images/checkmark.png); background-repeat: no-repeat; background-position: left center; background-size: 19px; }
.slider .foreground .foreground-info > div .left-fg ul li:hover, .slider .foreground .foreground-info > div .left-fg ul li:active { float: left; width: 100%; padding: 5px 0px 5px 25px; background-image: url(images/checkmark-hover.png); background-repeat: no-repeat; background-position: left center; background-size: 19px;  }
.slider .foreground .foreground-info > div .left-fg ul li a { color: #FFF; font-size: 1.1vw; font-weight: 700; text-decoration: none; }
.slider .foreground .foreground-info > div .left-fg ul li a:hover { text-decoration: none; }
.slider .foreground .foreground-info > div .left-fg .learn-more { float: left; width: 100%; margin-top: 20px; }
.slider .foreground .foreground-info > div .left-fg .learn-more a.red-btn { color: #FFF; font-weight: bold; font-size: 18px; background-color: #d0112b; padding: 5px 10px; border: 2px solid #FFF; text-decoration: none; border-radius: 5px; }
.slider .foreground .foreground-info > div .left-fg .learn-more a.hover { text-decoration: none; }
.slider .foreground .foreground-info > div .right-fg { float: left; max-width: 70%; }
.slider .foreground .foreground-info > div .right-fg .form { display: none; float: left; width: 85%; margin-left: 10px; margin-top: 0px; position: relative; top: -33px; }
.slider .foreground .foreground-info > div .right-fg .form .top-btn { float: left; width: 100%; border-radius: 10px 10px 0 0; border: 3px solid #98190f; background-color: #FFF; position: relative; background-image: url(images/form-downarrow.png); background-repeat: no-repeat; background-size: 13px; background-position: 97% 10%; }
.slider .foreground .foreground-info > div .right-fg .form .top-btn p { color: #d0112b; font-weight: bold; text-align: center; font-size: 14px; line-height: 15px; padding: 13px 8%; margin-bottom: 0; }
.slider .foreground .foreground-info > div .right-fg .form .int-form { padding: 13px 8%; background-image: url(images/hauteinvestbg.jpg); background-repeat: no-repeat; background-position: top center; background-size: cover; float: left; width: 100%; border-radius: 0 0 10px 10px; border: 3px solid #98190f; color: #FFF; text-transform: uppercase; }
.slider .foreground .foreground-info > div .right-fg .form .int-form form { float: left; width: 100%; text-align: center; }
.slider .foreground .foreground-info > div .right-fg .form .int-form form input[type="text"] { width: 100%; box-shadow: inset 0px 1px 3px 0px rgba(152, 25, 15, 0.6); border: 2px solid #98190f; border-radius: 5px; margin: 3px 0; padding: 2px 6px; font-family: 'Roboto', sans-serif; color: #000; }
.slider .foreground .foreground-info > div .right-fg .form .int-form form textarea { width: 100%; height: 75px; box-shadow: inset 0px 1px 3px 0px rgba(152, 25, 15, 0.6); border: 2px solid #98190f; border-radius: 5px; margin: 3px 0; padding: 2px 6px; font-family: 'Roboto', sans-serif; color: #000; }
.slider .foreground .foreground-info > div .right-fg .form .int-form form input[type="text"]::placeholder { font-size: 12px; font-weight: bold; color: #7d7d7d; }
.slider .foreground .foreground-info > div .right-fg .form .int-form form textarea::placeholder { font-size: 12px; font-weight: bold; color: #7d7d7d; }
.slider .foreground .foreground-info > div .right-fg .form .int-form form input[type="submit"] { background-color: #cb1228; border: 2px solid #fff; padding: 5px 10px; border-radius: 5px; font-weight: bold; }
.slider .foreground .foreground-info > div .right-fg .form .int-form form label { width: 100%; text-align: left; }
.slider .background { width: 100%; height: 100%; position: absolute; right: 0; top: 0; z-index: 98; }
.slider .background > div { overflow: hidden; }
.slider .background > div img { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 97; }

.welcome-bar { float: left; width: 100%; background-image: url(images/welcome.jpg); background-repeat: no-repeat; background-position: center center; background-size: cover; }
.welcome-bar p { font-size: 28px; color: #FFF; text-align: center; float: left; width: 100%; padding: 5px 0; font-family: 'Roboto', sans-serif; margin: 0; text-transform: uppercase; font-weight: bold; }

.body-content { float: left; width: 100%; padding: 40px; background-image: url(images/mainbodybg.jpg); background-repeat: no-repeat; background-size: cover; background-position: center center; border-bottom: 20px solid #d0122b; }
.body-content .left-body { float: left; }
.body-content .left-body h2 { font-weight: 900; font-family: 'Roboto', sans-serif; margin-bottom: 0; }
.body-content .left-body h3 { font-weight: 900; font-family: 'Roboto', sans-serif; color: #d0112b; margin-top: 5px; font-size: 22px; margin-bottom: 0px; }
.body-content .left-body hr { background-color: #d0112b; height: 10px; width: 10%; margin-right: 90%; float: left; border: 0; }
.body-content .left-body { font-family: 'Roboto', sans-serif; font-size: 16px; font-weight: 400; }
.body-content .left-body p { font-size: 15px; }
.body-content .right-body { float: left; }
.body-content .right-body p { float: left; width: 100%; text-align: right; }
.body-content .right-body p img { max-width: 225px; }
.body-content .right-body .form { float: right; width: 300px; margin-left: 10px; margin-top: 0px; }
.body-content .right-body .form .top-btn { float: left; width: 100%; border-radius: 10px 10px 0 0; border: 3px solid #98190f; background-color: #FFF; position: relative; }
.body-content .right-body .form .top-btn p { color: #d0112b; font-weight: bold; text-align: center; font-size: 14px; line-height: 15px; padding: 13px 8%; margin-bottom: 0; }
.body-content .right-body .form .int-form { padding: 13px 8%; background-image: url(images/hauteinvestbg.jpg); background-repeat: no-repeat; background-position: top center; background-size: cover; float: left; width: 100%; border-radius: 0 0 10px 10px; border: 3px solid #98190f; color: #FFF; text-transform: uppercase; }
.body-content .right-body .form .int-form form { float: left; width: 100%; text-align: center; }
.body-content .right-body .form .int-form form input[type="text"] { width: 100%; box-shadow: inset 0px 1px 3px 0px rgba(152, 25, 15, 0.6); border: 2px solid #98190f; border-radius: 5px; margin: 3px 0; padding: 2px 6px; font-family: 'Roboto', sans-serif; }
.body-content .right-body .form .int-form form textarea { width: 100%; height: 75px; box-shadow: inset 0px 1px 3px 0px rgba(152, 25, 15, 0.6); border: 2px solid #98190f; border-radius: 5px; margin: 3px 0; padding: 2px 6px; font-family: 'Roboto', sans-serif; }
.body-content .right-body .form .int-form form input[type="text"]::placeholder { font-size: 12px; font-weight: bold; color: #7d7d7d; }
.body-content .right-body .form .int-form form textarea::placeholder { font-size: 12px; font-weight: bold; color: #7d7d7d; }
.body-content .right-body .form .int-form form input[type="submit"] { background-color: #cb1228; border: 2px solid #fff; padding: 5px 10px; border-radius: 5px; font-weight: bold; }
.body-content .right-body .form .int-form form label { width: 100%; text-align: left; }

.footer-sep { float: left; width: 100%; height: 20px; background-image: url(images/subfooter.jpg); background-repeat: no-repeat; background-position: center center; background-size: cover; }

.footer { float: left; width: 100%; text-align: center; min-height: 365px; background-image: url(images/footerbg.jpg); background-repeat: no-repeat; background-position: center center; background-size: cover; padding-top: 20px; }
.footer p { text-align: center; color: #FFF; font-weight: 700; font-size: 22px; padding-bottom: 5px; }
.footer ul { padding: 0; list-style: none; margin: 0 auto; display: inline-block; }
.footer ul li { float: left; padding: 0 15px; }
.footer ul li:first-child { padding-left: 0; }
.footer ul li:last-child { padding-right: 0; }
.footer ul li a { color: #FFF; font-size: 19px; font-weight: 700; text-decoration: none; }
.footer ul li a:hover { text-decoration: none; }
.footer ul li a img { max-width: 30px; }
.footer .footer-trio { float: left; width: 100%; padding-top: 20px; }
.footer .footer-trio > div { float: left; }
.footer .footer-trio .links ul { float: left; width: 40%; list-style: none; padding: 0; }
.footer .footer-trio .links ul li { float: left; width: 100%; padding: 5px 10px; }
.footer .footer-trio .links ul li a { color: #FFF; font-size: 14px; text-decoration: none; }
.footer .footer-trio .links ul li a:hover { text-decoration: none; }
.footer .footer-trio .links { text-align: left; }
.footer .footer-trio .center { text-align: center; }
.footer .footer-trio .center p { font-size: 22px; font-family: 'Signika', sans-serif; font-weight: 300; margin: 0; padding: 5px; }
.footer .footer-trio .social { text-align: center; }
.footer .footer-trio .social p { font-size: 21px; font-weight: bold; margin: 0; }
.footer .footer-trio .social p a img { width: 35px; }

@media only screen and (max-width: 767px) {
	.top-header { padding-bottom: 5px; }
	.top-header .number { width: 100%; text-align: center; }
	.top-header .social { width: 100%; text-align: center; }
	.top-header .social ul { width: 240px; margin: 0 auto; float: none; }
	.header .logo { width: 100%; text-align: center; }
	.header .nav { width: 100%; }
	.header .nav ul { width: 100%; }
	.header .nav ul li { width: 100%; text-align: center; background: none; }
	.header .nav ul li ul { position: relative; width: 100%; }
	.header .nav ul li ul li { padding: 5px 0px !important; text-align: center; }
	.header .nav ul li:last-child { padding: 5px 0; text-align: center; }
	.slider { display: none; }
	.slider .foreground .foreground-info { padding: 30px 0; width: 90%; }
	.slider .foreground .foreground-info > div { padding-left: 30px; }
	.slider .foreground .foreground-info > div p img { max-width: 200px; }
	.slider .foreground .foreground-info > div h3 { font-size: 16px; }
	.slider .foreground .foreground-info > div hr { margin: 7px 80% 7px 0; height: 5px; }
	.slider .foreground .foreground-info > div .left-fg { float: left; }
	.slider .foreground .foreground-info > div .left-fg ul li { background-size: 18px; }
	.slider .foreground .foreground-info > div .left-fg ul li a { font-size: 14px; }
	.slider .foreground .foreground-info > div .right-fg { width: 50%; }
	.slider .foreground .foreground-info > div .right-fg .form .top-btn { height: 72px; }
	.slider .foreground .foreground-info > div .right-fg .form .top-btn p { font-size: 10px; line-height: 10px; }
	.slider .foreground .foreground-info > div .right-fg .form .int-form { top: 72px; }
	.slider .foreground .foreground-info > div .right-fg .form .int-form form input[type="text"]::placeholder { font-size: 10px; }
	.slider .foreground .foreground-info > div .right-fg .form .int-form form textarea::placeholder { font-size: 10px; }
	.welcome-bar p { font-size: 4vw; }
	.body-content .right-body .form { width: 100%; }
	.footer { min-height: initial; }
	.footer ul li { float: left; text-align: center; width: 100%; }
	.footer ul li a { font-size: 17px; }
	.footer .footer-trio { padding: 0 30px; }
	.footer .footer-trio > div { padding: 10px 0; }
	.footer .footer-trio .links ul { width: 100%; }
	.footer .footer-trio .links ul li { padding: 3px; width: 100%; float: left; }
	.footer .footer-trio .center p { font-size: 15px; }
	.footer .footer-trio .center p img { max-width: 100%; }
	.footer .footer-trio .social p a img { max-width: 35px; }
	.footer ul li { padding: 0 8px; }
	.footer ul li a { font-size: 15px; }
	.footer ul li a img { max-width: 20px; }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
	.header { padding: 15px 2% }
	.slider-internal { max-height: 285px; }
	.header .nav ul li { padding: 5px 30px; }
	.slider .foreground { height: 350px; }
	.slider .foreground img.foreground-pic { height: 350px; }
	.slider-internal .foreground img.foreground-pic { height: 585px; max-width: 100%; top: -80px; }
	.slider .foreground .foreground-info { width: 50%; height: 350px; padding: 25px 0; }
	.slider-internal .foreground .foreground-info { height: 400px; padding: 80px 0 0; }
	.slider .foreground .foreground-info > div { padding-left: 25px; }
	.slider .foreground .foreground-info > div p img { width: 200px; }
	.slider .foreground .foreground-info > div h3 { font-size: 2vw; }
	.slider-internal .foreground .foreground-info > div { padding-left: 50px; }
	.slider-internal .foreground .foreground-info > div p img { max-width: 21vw; }
	.slider-internal .foreground .foreground-info > div h3 { font-size: 3vw; }
	.slider .foreground .foreground-info > div hr { margin-top: 10px; margin-bottom: 10px; width: 30%; margin-right: 70%; }
	.slider .foreground .foreground-info > div .left-fg { max-width: 34%; }
	.slider .foreground .foreground-info > div .left-fg ul li { padding: 2px 0 4px 25px; }
	.slider .foreground .foreground-info > div .left-fg ul li:hover { padding: 2px 0 4px 25px; }
	.slider .foreground .foreground-info > div .left-fg ul li a { font-size: 1.6vw; }
	.slider .foreground .foreground-info > div .left-fg .learn-more { margin-top: 15px; }
	.slider .foreground .foreground-info > div .left-fg .learn-more a.red-btn { font-size: 14px; }
	.slider .foreground .foreground-info > div .right-fg { width: 66%; }
	.slider .foreground .foreground-info > div .right-fg .form .top-btn p { font-size: 11px; line-height: 13px; }
	.slider .foreground .foreground-info > div .right-fg .form .int-form { top: 77px; }
	.slider .foreground .foreground-info > div .right-fg .form .int-form form input[type="text"]::placeholder { font-size: 10px; }
	.slider .foreground .foreground-info > div .right-fg .form .int-form form textarea::placeholder { font-size: 10px; }
	.body-content .right-body .form { width: 100%; }
	.welcome-bar p { font-size: 3vw; }
	.footer { min-height: initial; }
	.footer ul li a { font-size: 17px; }
	.footer .footer-trio { padding: 30px; }
	.footer .footer-trio .links ul { width: 50%; }
	.footer .footer-trio .links ul li { padding: 5px; }
	.footer .footer-trio .center p { font-size: 15px; }
	.footer .footer-trio .center p img { max-width: 100%; }
	.footer .footer-trio .social p a img { max-width: 35px; }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
	.header { padding: 15px 2%; }
	.slider-internal { max-height: 335px; }
	.slider .foreground { height: 550px; }
	.slider .foreground img.foreground-pic { height: 550px; }
	.slider-internal .foreground img.foreground-pic { height: 700px; max-width: 100%; top: -110px; }
	.slider .foreground .foreground-info { height: 550px; padding: 90px 0 0; }
	.slider-internal .foreground .foreground-info { height: 450px; padding: 90px 0 0; }
	.slider .foreground .foreground-info > div { padding-left: 70px; }
	.slider .foreground .foreground-info > div hr { width: 30%; margin-right: 70%; height: 7px; }
	.slider .foreground .foreground-info > div p img { max-width: 250px; }
	.slider-internal .foreground .foreground-info > div { padding-left: 50px; }
	.slider-internal .foreground .foreground-info > div p img { max-width: 21vw; }
	.slider .foreground .foreground-info > div h3 { font-size: 1.8vw; }
	.slider-internal .foreground .foreground-info > div h3 { font-size: 3vw; }
	.slider .foreground .foreground-info > div .left-fg { max-width: 34%; }
	.slider .foreground .foreground-info > div .left-fg ul li { padding: 5px 0 5px 22px; background-size: 16px; }
	.slider .foreground .foreground-info > div .left-fg ul li:hover { padding: 5px 0 5px 22px; background-size: 16px; }
	.slider .foreground .foreground-info > div .left-fg ul li a { font-size: 1.2vw; }
	.slider .foreground .foreground-info > div .left-fg .learn-more a.red-btn { padding: 5px 10px; font-size: 15px; }
	.slider .foreground .foreground-info > div .right-fg { max-width: 66%; }
	.slider .foreground .foreground-info > div .right-fg .form { }
	.footer .footer-trio > div ul { width: 50%; }
	.footer .footer-trio .center p { font-size: 20px; }
	.footer .footer-trio .center p img { max-width: 100%; }
	.footer .footer-trio .social p a img { max-width: 35px; }
	.footer { min-height: 290px; }
}

@media only screen and (min-width: 1200px) and (max-width: 1500px) {
	.slider-internal { max-height: 385px; }
	.slider .foreground { height: 550px; }
	.slider .foreground img.foreground-pic { height: 550px; }
	.slider-internal .foreground img.foreground-pic { height: 750px; max-width: 100%; top: -110px; }
	.slider .foreground .foreground-info { height: 550px; padding: 90px 0 0; }
	.slider-internal .foreground .foreground-info { height: 500px; padding: 130px 0 0; }
	.slider .foreground .foreground-info > div { padding-left: 70px; }
	.slider-internal .foreground .foreground-info > div { padding-left: 50px; }
	.slider-internal .foreground .foreground-info > div p img { max-width: 21vw; }
	.slider .foreground .foreground-info > div h3 { font-size: 2vw; }
	.slider-internal .foreground .foreground-info > div h3 { font-size: 3vw; }
	.footer { min-height: 250px; }
}

@media only screen and (min-width: 1501px) {
	.body-content .right-body p { text-align: right; }
	.body-content .right-body p img { max-width: 225px; }
	.footer { min-height: 250px; }
	.footer .footer-trio { padding-top: 20px; }
}