@charset "utf-8";

/*  BASIC PAGE SETUP ============================================================================= */
html {
height:100%;
text-size-adjust:100%;
-webkit-text-size-adjust:100%;
scroll-behavior:smooth;
}
body {
margin:0px;
background-color:#FFFFFF;
background-repeat:no-repeat;
background-size:cover;
-webkit-background-size:cover;
-moz-background-size:cover;
-o-background-size:cover;
background-position:center center;
background-attachment:fixed;
font-family:'Raleway', Helvetica, Verdana, Arial, sans-serif;
font-family:'Red Hat Display', Helvetica, Verdana, Arial, sans-serif;
font-size:18px;
font-weight:400;
color:#1A1915;
}
@media (pointer:coarse) {
body {
background-size:175%;
background-position:center top;
}
}
div, ul, li, img, form {
margin:0px;
padding:0px;
}
iframe, object, embed {
display:block;
margin:0px;
}
h1 {
width:auto;
margin:0px;
margin-bottom:50px;
font-family:'Red Hat Display', Helvetica, Verdana, Arial, sans-serif;
font-size:100px;
font-weight:700;
text-align:center;
text-transform:uppercase;
color:#1A1915;
line-height:75px;
}
h2 {
font-family:'Red Hat Display', Helvetica, Verdana, Arial, sans-serif;
font-size:50px;
line-height:50px;
font-weight:700;
text-align:left;
text-transform:uppercase;
}
h3 {
font-family:'Red Hat Display', Helvetica, Verdana, Arial, sans-serif;
font-size:35px;
line-height:35px;
font-weight:400;
text-align:center;
text-transform:uppercase;
}
h4 {
font-family:'Raleway', Helvetica, Verdana, Arial, sans-serif;
font-family:'Red Hat Display', Helvetica, Verdana, Arial, sans-serif;
font-size:25px;
font-weight:400;
text-align:left;
color:#1A1915;
line-height:35px;
padding-bottom:5px;
border-bottom:1px solid #AFAEAC;
}
a {
text-decoration:none;
}
a:active {
color:#6B2936;
}
a:link {
color:#6B2936;
}
a:visited {
color:#6B2936;
}
a:hover {
color:#AB3F54;
}
select {
font-size:12px;
}
select {
font-size:12px;
}
hr {
border:0;
height:1px;
margin-top:15px;
margin-bottom:15px;
background-color:#818286;
}
p {
text-align:justify;
line-height:28px;
}
p.anchor {
display:block;
position:relative;
top:-150px;
visibility:hidden;
}
strong {
font-weight:700;
}
svg {
fill:#FFFFFF;
fill:#6B2936;
width:160px;
height:350px;
width:auto;
height:75vh;
height:50vh;
opacity:0.25;
}
svg.svg-linkedin {
fill:#6B2936;
height:25px;
opacity:1;
padding-left:10px;
padding-top:10px;
}
svg.svg-linkedin:hover {
fill:#818286;
}
.bottom-nav svg.svg-linkedin {
fill:#FFFFFF;
padding-left:0px;
}
.table-design table {
width:100%;
margin-left:auto;
margin-right:auto;
margin-bottom:15px;
padding:0px;
border-spacing:0px;
border:1px solid #818286;
font-weight:400;
}
.table-design tr {
background-color:#FFFFFF;
}
.table-design tr:hover {
background-color:#F5F5F5;
}
.table-design th {
background-color:#1A1915;
padding:15px;
vertical-align:top;
text-align:left;
font-size:20px;
font-weight:400;
color:#FFFFFF;
}
.table-design th p {
padding:0px;
margin:0px;
}
.table-design td {
padding:10px;
vertical-align:top;
border-top:1px solid #F5F5F5;
font-weight:400;
}
.table-design td p {
padding:0px;
margin:0px;
}
.material-icons {
display:inline;
vertical-align:middle;
padding-right:5px;
}
.shape {
position:relative;
float:right;
margin:0px;
padding:0px;
width:35px;
height:35px;
}
.shape:before {
content: "";
display:block;
position:absolute;
z-index:0;
top:0;
left:0;
/* create the triangle */
width:0;
height:0;
border:17.5px solid transparent;
border-top-color:#FFFFFF;
border-right-color:#FFFFFF;
}
.arrow a {
position:absolute;
bottom:20px;
left:50%;
z-index:20000;
display:inline-block;
-webkit-transform:translate(0, -50%);
transform:translate(0, -50%);
color:#fff;
letter-spacing:.1em;
text-decoration:none;
transition:opacity .3s;
}
.arrow a:hover {
opacity:.5;
}
.flex-container {
display:flex;
flex-wrap:wrap;
}
.flex-cell {
flex-grow:1;
display:flex;
align-items:center;
margin:0px;
padding:0px;
background-color:#E5E5E5;
}

/*  IMAGES ============================================================================= */
img {
margin:0px;
display:block;
border :0px;
max-width:100%;
height:auto;
}
img a:hover {
opacity:0.5;
}
img.float-left {
float:left;
margin:0px 10px 0px 0px;
}
img.float-right {
float:right;
margin:0px 0px 0px 10px;
}
.overlay {
left:0px;
top:0px;
width:100%;
min-height:40%;
text-align:center;
color:rgb(255,255,255);
position:absolute;
opacity:0px;
background-color:rgba(26,25,21,1);
-webkit-transition:0.25s ease-in;
-moz-transition:0.25s ease-in;
-o-transition:0.25s ease-in;
transition:0.25s ease-in;
}
.overlay h3 {
margin:0px auto;
padding:27px 0px 5px;
text-align:center;
color:rgb(255,255,255);
line-height:30px;
letter-spacing:1px;
font-size:28px;
}
.overlay p {
text-align:center;
font-size:12px;
}

/* IFRAMES============================================================================= */
.framework-iframe {
position:relative;
padding-bottom:56.25%;
padding-top:30px;
height:0;
overflow:hidden;
border:1px solid #818286;
}
.framework-iframe iframe,
.framework-iframe object,
.framework-iframe embed {
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
}

/* FLEX============================================================================= */

.flex-container {
display:-webkit-box;
display:-webkit-flex;
display:-ms-flex;		
display:flex;
-webkit-flex-wrap:wrap;
-ms-flex-wrap:wrap;
flex-wrap:wrap;
}
.flex-container:before {
display:inline;
}
.flex-container .box-outline {
-webkit-flex:1;
-ms-flex:1;
flex:1;
}
.flex-container .box-logo {
-webkit-flex:1;
-ms-flex:1;
flex:1;
}

/* FRAMEWORK============================================================================= */
#framework {
width:100%;
position:relative;
margin:0px;
text-align:left;
}
#framework-home {
background-repeat:no-repeat;
background-position:left top;
background-size:cover;
}
#framework-navigation {
width:100%;
width:45px;
height:35px;
background-color:transparent;
z-index:20000;
position:fixed;
top:0px;
}
#navigation {
width:auto;
min-width:320px;
max-width:1600px;
position:relative;
margin-right:auto;
margin-left:auto;
}
#framework-header {
width:100%;
height:35px;
line-height:35px;
position:fixed;
top:0px;
z-index:1999;
transition:0.5s;
background-color:#FFFFFF;
background-color:transparent;
background-image:linear-gradient(rgba(26,25,21,1),rgba(26,25,21,0.8));
}
#header {
width:auto;
min-width:320px;
max-width:1600px;
max-width:100%;
position:relative;
margin:0px;
margin-right:auto;
margin-left:auto;
z-index:1000;
}
#header a:active, #header a:link, #header a:visited {
color:#1A1915;
}
#header a:hover {
color:#6B2936;
}
#header-box {
float:right;
background-color:rgba(255,255,255,1);
padding-left:15px;
padding-right:10%;
padding-right:50px;
font-size:12px;
font-weight:700;
}
#header-logo {
width:305px;
height:48px;
position:absolute;
top:12.5px;
left:65px;
right:0;
right:auto;
margin:auto;
z-index:5002;
transition:0.5s;
}
#header-logo img {
width:auto;
height:100%;
margin-left:auto;
margin-right:auto;
transition:0.5s;
}
#header-logo-mini {
width:156px;
max-width:156px;
height:25px;
position:absolute;
top:12.5px;
left:50px;
right:0;
right:auto;
margin:auto;
z-index:5002;
transition:0.5s;
}
#header-logo-mini img {
width:auto;
height:100%;
margin-left:auto;
margin-right:auto;
transition:0.5s;
}
#header-phone {
position:absolute;
top:0px;
right:15px;
font-size:25px;
line-height:75px;
text-transform:uppercase;
text-align:center;
z-index:2006;
transition:0.5s;
}
#header-address {
width:90%;
height:50px;
margin-left:auto;
margin-right:auto;
border-bottom:1px solid #818286;
border-bottom:1px solid #FFFFFF;
overflow:hidden;
transition:0.5s;
}
#header-address p {
font-size:12px;
color:#FFFFFF;
line-height:50px;
margin:0px;
padding:0px;
text-align:center;
}
#header-address .material-icons {
display:inline;
vertical-align:middle;
padding-left:15px;
padding-right:5px;
}
#framework-buttons {
width:100%;
height:75px;
line-height:75px;
position:fixed;
top:35px;
z-index:1999;
background-color:#1A1915;
background-color:transparent;
background-image:linear-gradient(rgba(26,25,21,0.8),rgba(26,25,21,0));
transition:0.5s;
}
#buttons {
width:auto;
min-width:320px;
max-width:1600px;
position:relative;
margin:0px;
margin-right:auto;
margin-left:auto;
z-index:1000;
}
#buttons .material-icons {
display:inline;
vertical-align:middle;
padding-right:10px;
}
#framework-animation {
width:100%;
height:85vh;
position:relative;
background-color:#FFFFFF;
background-repeat:no-repeat;
background-position:center top;
margin-top:0px;
padding-top:0px;
transition:0.5s;
text-align:center;
}
#animation {
width:100%;
min-width:320px;
max-width:1600px;
max-width:100%;
height:85vh;
position:relative;
margin:0px;
margin-right:auto;
margin-left:auto;
padding:0px;
background-position:center center;
background-size:cover;
background-repeat:none;
z-index:1000;
}
#animation a:active, #animation a:link, #animation a:visited {
color:#FFFFFF;
}
#animation a:hover {
color:#AB3F54;
}
#animation-box {
width:80%;
max-width:50%;
position:absolute;
background-color:transparent;
left:0;
right:0;
margin-left:auto;
margin-right:auto;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
-ms-transform: translate(-50%,-50%);
-webkit-transform: translate(-50%,-50%);
-moz-transform: translate(-50%,-50%);
-o-transform: translate(-50%,-50%);
font-family:'Red Hat Display', Helvetica, Verdana, Arial, sans-serif;
font-size:2vw;
font-weight:400;
line-height:50px;
text-align:center;
text-align:center;
text-shadow:2px 2px 3px #1A1915;
color:#FFFFFF;
z-index:5000;
}
#animation-box strong {
font-size:3vw;
line-height:50px;
text-transform:uppercase;
}
#animation-box p.overview {
font-family:'Red Hat Display', Helvetica, Verdana, Arial, sans-serif;
font-size:16px;
line-height:50px;
font-weight:700;
text-align:center;
text-transform:uppercase;
margin:0px;
}
#animation-box p.feature {
font-family:'Red Hat Display', Helvetica, Verdana, Arial, sans-serif;
font-size:50px;
line-height:50px;
font-weight:700;
text-align:center;
text-transform:uppercase;
color:#FFFFFF;
margin:0px;
}
#out-of-the-box {
height:100vh;
}
#out-of-the-box li {
height:100vh;
background-size:cover;
background-position:center top;
background-repeat:no-repeat;
}
#out-of-the-box li div {
height:100vh;
position:relative;
background-color:rgba(26,25,21,0.25);
}
.sy-caption-wrap .sy-caption {
background-color:rgba(26,25,21,0.65);
font-weight:700;
text-align:center;
}
.sy-caption-wrap .sy-caption a:link, .sy-caption-wrap .sy-caption a:visited {
color:#6B2936;
}
.sy-caption-wrap .sy-caption span {
font-size:12px;
font-weight:400;
color:#6B2936;
color:#FFFFFF;
}
.sy-pager li.sy-active a {
background-color:#6B2936;
}
.news-slider .news-pager li.sy-active a {
color:#6B2936;
}
.thumb-box .thumbs {
overflow: hidden;
}
.thumb-box ul.thumbs {
list-style:none;
}
.thumb-box ul.thumbs li {
float:left;
width:18%;
margin-left:1%;
margin-right:1%;
}
.thumbnails .sy-caption-wrap {
top:25px;
left:0px;
}
.thumbnails .sy-caption-wrap .sy-caption {
top:0px;
left:0px;
padding:10px;
padding-left:25px;
padding-right:25px;
background-color:rgba(26,25,21,.5);
border-radius:0px;
font-size:35px;
text-transform:uppercase;
color:#FFFFFF;
}
#framework-content {
width:100%;
background-color:#FFFFFF;
}
#content {
width:auto;
min-width:320px;
max-width:1600px;
position:relative;
margin:0px;
padding:0px;
padding-top:75px;
padding-bottom:75px;
margin-right:auto;
margin-left:auto;
z-index:1000;
}
#content img {
max-width:100%;
margin-left:1%;
margin-right:1%;
margin-bottom:1%;
}
#content ul {
margin-left:5%;
}
#content li {
margin-bottom:10px;
}
#content li .material-icons {
display:inline;
vertical-align:middle;
padding-right:5px;
}
#content hr {
margin-top:0px;
margin-top:35px;
margin-bottom:35px;
}
#content .material-icons {
display:inline;
vertical-align:middle;
}
#framework-content-basic {
width:100%;
background-color:#FFFFFF;
background-color: #E5E5E5;
background-color: #F5F5F5;
}
#content-basic {
width:auto;
min-width:320px;
max-width:1600px;
position:relative;
margin:0px;
padding:0px;
padding-top:75px;
padding-bottom:75px;
margin-right:auto;
margin-left:auto;
z-index:1000;
}
#content-basic ul {
margin-left:5%;
}
#content-basic li {
margin-bottom:10px;
}
#content-basic li .material-icons {
display:inline;
vertical-align:middle;
padding-right:5px;
}
#framework-content-0 {
width:100%;
background-color:#1A1915;
}
#content-0 {
width:auto;
min-width:320px;
max-width:1600px;
position:relative;
margin:0px;
padding:0px;
padding-top:75px;
padding-bottom:75px;
margin-right:auto;
margin-left:auto;
z-index:1000;
color:#FFFFFF;
}
#content-0 img {
max-width:100%;
margin-left:1%;
margin-right:1%;
margin-bottom:1%;
}
#content-0 ul {
margin-left:5%;
}
#content-0 li {
margin-bottom:10px;
}
#content-0 h2 {
color:#FFFFFF;
}
#content-0 h3 {
color:#FFFFFF;
}
#content-0 h4 {
color:#FFFFFF;
}
#framework-content-1 {
width:100%;
background-color:#FFFFFF;
}
#content-1 {
width:auto;
min-width:320px;
max-width:1600px;
position:relative;
margin:0px;
padding:0px;
padding-top:75px;
padding-bottom:75px;
margin-right:auto;
margin-left:auto;
z-index:1000;
}
#content-1 img {
max-width:100%;
margin-left:1%;
margin-right:1%;
margin-bottom:1%;
}
#content-1 ul {
margin-left:5%;
}
#content-1 li {
margin-bottom:10px;
}
#framework-content-2 {
width:100%;
background-color:#E5E5E5;
}
#content-2 {
width:auto;
min-width:320px;
max-width:1600px;
position:relative;
margin:0px;
padding:0px;
padding-top:75px;
padding-bottom:75px;
margin-right:auto;
margin-left:auto;
z-index:1000;
}
#content-2 img {
max-width:100%;
margin-left:1%;
margin-right:1%;
margin-bottom:1%;
}
#content-2 ul {
margin-left:5%;
}
#content-2 li {
margin-bottom:10px;
}
#framework-content-3 {
width:100%;
background-color:#F5F5F5;
}
#content-3 {
width:auto;
min-width:320px;
max-width:1600px;
position:relative;
margin:0px;
padding:0px;
padding-top:75px;
padding-bottom:75px;
margin-right:auto;
margin-left:auto;
z-index:1000;
}
#content-3 img {
max-width:100%;
margin-left:1%;
margin-right:1%;
margin-bottom:1%;
}
#content-3 ul {
margin-left:5%;
}
#content-3 li {
margin-bottom:10px;
}
.content-main {
width:74.6%;
}
.content-menu {
width:23.8%;
}
.content-image img {
width:50%;
max-width:800px;
}
#icons {
width:auto;
font-size:14px;
text-align:center;
color:#818286;
padding-top:25px;
}
#icons span {
font-size:3vw;
font-size:35px;
}
#icons span.material-icons {
display:inline;
vertical-align:middle;
padding-left:2%;
padding-right:2%;
font-size:5vw;
font-size:50px;
}
#feature {
width:auto;
font-size:20px;
text-align:center;
}
#feature span {
font-size:3vw;
font-size:60px;
}
#feature span.material-icons {
display:inline;
vertical-align:middle;
padding-left:2%;
padding-right:2%;
font-size:5vw;
font-size:100px;
}
#framework-features {
width:100%;
background-color:#FFFFFF;
border-bottom:1px solid #BCBDC1;
}
#features {
width:95%;
min-width:320px;
max-width:1600px;
height:40px;
line-height:40px;
position:relative;
margin:0px;
margin-right:auto;
margin-left:auto;
padding:0px;
padding-top:5px;
padding-bottom:5px;
z-index:1000;
text-transform:uppercase;
color:#818286;
color:#6B2936;
}
#features-nav {
height:50px;
position:absolute;
top:0px;
left:0px;
z-index:1000;
font-weight:400;
font-size:12px;
line-height:50px;
text-align:center;
text-transform:uppercase;
overflow:hidden;
}
#features-nav div {
width:50px;
height:50px;
float:left;
border-left:1px solid #BCBDC1;
}
#features-nav div#features-nav-text {
width:auto;
max-width:100%;
padding-left:10px;
padding-right:10px;
color:#818286;
}
#features-nav div:hover {
background-color:#BCBDC1;
background-color:#6B2936;
}
#features-nav div#features-nav-facebook:hover {
background-color:#4468B0;
}
#features-nav div#features-nav-instagram:hover {
background-color:#F00075;
}
#features-nav div#features-nav-twitter:hover {
background-color:#409BD6;
}
#features-nav a {
display:block;
padding:15px;
text-decoration:none;
}
#features-nav a:active, #features-nav a:link, #features-nav a:visited {
color:#BCBDC1;
color:#6B2936;
}
#features-nav a:hover {
color:#FFFFFF;
}
#features-nav div#features-nav-text a {
display:inline;
padding:0px;
font-weight:700;
}
#features-nav div#features-nav-text:hover {
color:#FFFFFF;
}
#features-nav div#features-nav-text:hover a {
color:#FFFFFF;
color:#BCBDC1;
}
#features-nav div#features-nav-text:hover a:hover {
color:#AB3F54;
}
#framework-basic {
position:relative;
width:100%;
background-size:cover;
background-position:center center;
border-top: 1px solid #818286;
border-bottom: 1px solid #818286;
filter:grayscale(100%);
}
#basic {
width:100%;
height:65vh;
position:relative;
padding-top:75px;
padding-bottom:75px;
}
#basic-box {
position:absolute;
width:80%;
min-width:320px;
max-width:750px;
margin:0px;
margin-right:auto;
margin-left:auto;
padding-left:10%;
padding-right:10%;
top:50%;
left:50%;
transform:translate(-50%,-50%);
-ms-transform:translate(-50%,-50%);
-webkit-transform:translate(-50%,-50%);
-moz-transform:translate(-50%,-50%);
-o-transform:translate(-50%,-50%);
color:#FFFFFF;
}
#basic-box p {
font-size:45px;
line-height:45px;
font-family:'Red Hat Display', Helvetica, Verdana, Arial, sans-serif;
font-weight:400;
text-align:center;
text-shadow:2px 2px 5px #1A1915;
text-transform:uppercase;
color:#FFFFFF;
}
#framework-bar {
position:relative;
width:100%;
background-color:#1A1915;
color:#818286;
}
#bar {
width:auto;
min-width:320px;
max-width:1600px;
max-width:2500px;
position:relative;
margin:0px;
padding:0px;
padding-top:50px;
padding-bottom:50px;
padding-top:2%;
padding-bottom:2%;
margin-right:auto;
margin-left:auto;
}
#bar h4 {
margin-top:0px;
text-align:center;
color:#818286;
border-bottom:1px solid #818286;
}
#framework-testimonials {
width:100%;
background-color:#6B2936;
background-repeat:no-repeat;
background-position:center top;
background-size:cover;
}
#testimonials {
width:auto;
min-width:320px;
max-width:1600px;
position:relative;
margin:0px;
padding:0px;
padding-top:50px;
padding-bottom:50px;
margin-right:auto;
margin-left:auto;
color:#FFFFFF;
z-index:1000;
}
#framework-shadow {
position:relative;
width:100%;
height:auto;
background-color:#1A1915;
}
#shadow {
width:auto;
min-width:320px;
max-width:1600px;
position:relative;
margin-right:auto;
margin-left:auto;
text-align:center;
color:#FFFFFF;
}
#shadow p {
margin:0px;
padding:0px;
font-size:20px;
text-align:center;
line-height:75px;
}
#shadow a:active, #shadow a:link, #shadow a:visited {
color:#FFFFFF;
}
#shadow a:hover {
color:#AB3F54;
}
#shadow .material-icons {
padding-left:15px;
}
#framework-footer {
position:relative;
width:100%;
background-color:#6B2936;
}
#footer {
width:auto;
min-width:320px;
max-width:1600px;
position:relative;
margin-right:auto;
margin-left:auto;
padding:0px;
line-height:25px;
text-align:left;
font-size:14px;
color:#1A1915;
}
#footer ul {
list-style:none;
margin-left:5%;
}
#footer li {
line-height:35px;
border-bottom:1px solid #7A3F4A;
}
#footer h5 {
margin:1%;
margin-bottom:2%;
padding-bottom:15px;
border-bottom:1px solid #AB3F54;
font-size:25px;
text-transform:uppercase;
color:#AB3F54;
}
#footer p {
margin:1%;
margin-left:5%;
}
#footer a:active, #footer a:link, #footer a:visited {
color:#FFFFFF;
}
#footer a:hover {
color:#AB3F54;
}
#footer-logo {
width:25%;
max-width:350px;
position:absolute;
top:25px;
right:0px;
z-index:5000;
}
#footer-icons {
width:280px;
max-width:100%;
height:30px;
margin-top:10px;
}
#footer-icons img {
width:100%;
max-width:30px;
height:auto;
margin-left:auto;
margin-right:auto;
}
#footer-icons div {
width:30px;
max-width:30px;
background-color:#3A3A3C;
float:left;
margin-left:5px;
margin-right:5px;
}
#footer-icons div:hover {
background-color:#6B2936;
}
#framework-copyright {
position:relative;
width:100%;
background-color:#818286;
background-color:#FFFFFF;
}
#copyright {
width:auto;
min-width:320px;
max-width:1600px;
position:relative;
margin-right:auto;
margin-left:auto;
padding:0px;
text-align:right;
font-size:15px;
line-height:50px;
color:#AFAEAC;
color:#818286;
}
#copyright-box {
padding:5%;
}
#copyright-box p {
text-align:center;
}
#copyright p {
padding-bottom:25px;
text-align:center;
}
#copyright p a {
padding-left:10px;
padding-right:10px;
font-weight:900;
text-transform:uppercase;
}
#copyright a:active, #copyright a:link, #copyright a:visited {
color:#AB3F54;
}
#copyright a:hover {
color:#BCBDC1;
}
.copyright {
text-align:left;
}
.float-left {
float:left;
}
.float-right {
float:right;
}
.content-clear {
clear:both;
}

/* MENUS============================================================================= */
#header-burger-bg {
position:absolute;
top:50px;
top:35px;
left:5px;
left:0px;
line-height:10px;
z-index:5000;
}
#header-burger-bg span.header-burger-bg-nav {
position:absolute;
width:75px;
display:inline-block;
line-height:75px;
font-weight:700;
text-align:center;
}
#header-burger-bg span.header-burger-bg-nav:hover {
background:#6B2936;
}
#header-burger {
width:25px;
height:15px;
top:55px;
left:15px;
left:20px;
}
#header-burger .toggle {
min-height:15px;
font-size:15px;
line-height:15px;
}
#header-burger .toggle span {
width:25px;
}
#header-buttons {
width:50%;
max-width:50%;
height:75px;
line-height:75px;
margin-left:auto;
margin-right:auto;
margin-right:0px;
font-size:14px;
text-align:center;
text-transform:uppercase;
color:#1A1915;
}
#header-buttons ul {
width:auto;
height:50px;
list-style:none;
vertical-align:bottom;
}
#header-buttons li {
width:25%;
height:50px;
float:left;
}
#header-buttons a {
display:block;
text-decoration:none;
}
#header-buttons a:active, #header-buttons a:link, #header-buttons a:visited {
color:#FFFFFF;
}
#header-buttons .button-active a:active, #header-buttons .button-active a:link, #header-buttons .button-active a:visited {
color:#AB3F54;
color:#FFFFFF;
font-weight:700;
}
#header-buttons ul#dropdown .submenu {
font-family:'Raleway', Helvetica, Verdana, Arial, sans-serif;
font-family:'Red Hat Display', Helvetica, Verdana, Arial, sans-serif;
font-size:16px;
font-weight:400;
}
ul#dropdown .submenu {
width:960%;
width:760%;
float:right;
visibility:hidden;
position:relative;
top:0px;
left:0px;
padding:20%;
text-transform:none;
z-index:5001;
background-color:#FFFFFF;
border:1px solid #BCBDC1;
}
ul#dropdown #about .submenu {
left:300%;
}
ul#dropdown #locations .submenu {
left:300%;
}
ul#dropdown #services .submenu {
left:200%;
}
ul#dropdown #industries .submenu {
left:100%;
}
ul#dropdown li:hover>.submenu {
visibility:visible;
opacity:1;
}
ul#dropdown .submenu ul {
padding:2%;
}
ul#dropdown .submenu li {
width:100%;
height:35px;
line-height:35px;
height:65px;
line-height:65px;
margin:0px;
padding:0px;
border-top:1px solid #BCBDC1;
text-align:left;
transition:0s;
}
ul#dropdown .submenu li strong {
font-size:16px;
text-transform:uppercase;
}
ul#dropdown .submenu li:hover {
background-color:transparent;
}
ul#dropdown .submenu li:first-child {
border-top:0px solid #BCBDC1;
}
ul#dropdown .button-active .submenu  li a {
border-bottom:0px solid #BCBDC1;
color:#6B2936;
}
ul#dropdown .submenu li a {
border-bottom:0px solid #BCBDC1;
color:#6B2936;
}
ul#dropdown .submenu li a:hover {
color:#AB3F54;
}
ul#dropdown .submenu div a:active, ul#dropdown .submenu div a:link, ul#dropdown .submenu div a:visited {
color:#6B2936;
}
ul#dropdown .submenu div a:hover {
color:#AB3F54;
}
ul#dropdown .submenu li:hover>a {
background-color:transparent;
}
.submenu-feature {
float:left;
margin:0px;
margin-right:10px;
padding:0px;
width:100px;
height:100px;
border-radius:50%;
background-size:cover;
background-position:center center;
border:1px solid #E5E5E5;
filter:grayscale(100%);
cursor:pointer;
}
.submenu-feature:hover {
filter:grayscale(0%);
}

/* FORMS============================================================================= */
input:not([type=submit]):not([type=file]):not([type=radio]):not([type=checkbox]):not([type=image]):not([type=submit]) {
width:90%;
max-width:90%;
height:40px;
border:1px solid #BCBDC1;
border-radius:5px;
-moz-border-radius:5px;
-webkit-border-radius:5px;
background:#F8F8F8;
padding-left:5%;
padding-right:5%;
color:#818286;
}
input:not([type=submit]):not([type=file]):not([type=radio]):not([type=checkbox]):not([type=image]):not([type=submit]):hover {
border:1px solid #BCBDC1;
border-radius:5px;
-moz-border-radius:5px;
-webkit-border-radius:5px;
background:#E8E7E7;
color:#818286;
}
textarea {
width:95%;
max-width:95%;
border:1px solid #BCBDC1;
border-radius:5px;
-moz-border-radius:5px;
-webkit-border-radius:5px;
background:#F8F8F8;
padding:2.5%;
color:#818286;
}
textarea:hover {
border:1px solid #BCBDC1;
border-radius:5px;
-moz-border-radius:5px;
-webkit-border-radius:5px;
background:#E8E7E7;
color:#818286;
}
select {
width:90%;
max-width:90%;
height:40px;
border:1px solid #BCBDC1;
border-radius:5px;
-moz-border-radius:5px;
-webkit-border-radius:5px;
background:#F8F8F8;
padding-left:5%;
padding-right:5%;
color:#818286;
}
.form-details {
padding-left:2%;
height:35px;
line-height:35px;
background-color:#1A1915;
color:#FFFFFF;
font-size:20px;
text-transform:uppercase;
}
.form-labels {
width:23%;
max-width:250px;
background-color:#E8E7E7;
padding:1%;
font-size:16px;
}
.form-fields {
width:73%;
background-color:#F8F8F8;
padding:1%;
font-size:14px;
}
.form-fields img {
width:auto;
max-width:auto;
padding:1%;
}
.form-button {
max-width:100%;
height:50px;
line-height:50px;
padding-left:25px;
padding-right:25px;
background:#6B2936;
border:1px solid #6B2936;
font-size:16px;
color:#FFFFFF;
text-transform:uppercase;
text-align:center;
float:right;
margin-right:5px;
margin-bottom:5px;
cursor:pointer;
-webkit-appearance:none;
border-radius:0;
}
.form-button:hover {
border:1px solid #1A1915;
background:#1A1915;
color:#FFFFFF;
}
.page-button {
width:auto;
margin-left:auto;
margin-right:auto;
-webkit-appearance:none;
border-radius:0;
cursor:pointer;
transition:0.5s;
}
.page-button a {
display:inline-block;
height:50px;
line-height:50px;
position:relative;
font-size:16px;
text-align:center;
text-decoration:none;
color:#FFFFFF;
background-color:#1A1915;
padding:0px 35px 0px 35px;
-webkit-appearance:none;
}
.page-button a:active, .page-button a:link, .page-button a:visited {
color:#FFFFFF;
}
.page-button a:hover {
background-color:#818286;
color:#FFFFFF;
}
.page-button span.material-icons {
display:inline;
vertical-align:middle;
margin:0px;
padding:0px;
font-size:25px !important;
line-height:50px;
}
.feature-button {
width:auto;
margin-left:auto;
margin-right:auto;
-webkit-appearance:none;
border-radius:0;
cursor:pointer;
transition:0.5s;
}
.feature-button a {
display:inline-block;
width:auto;
height:50px;
line-height:50px;
position:relative;
font-size:16px;
text-align:center;
text-decoration:none;
color:#FFFFFF;
background-color:#6B2936;
padding:0px 35px 0px 35px;
-webkit-appearance:none;
}
.feature-button a:active, .feature-button a:link, .feature-button a:visited {
color:#FFFFFF;
}
.feature-button a:hover {
background-color:#818286;
color:#FFFFFF;
}
.feature-button span.material-icons {
display:inline;
vertical-align:middle;
margin:0px;
padding:0px;
font-size:25px !important;
line-height:50px;
}
.border-button {
width:auto;
margin-left:auto;
margin-right:auto;
-webkit-appearance:none;
border-radius:0;
cursor:pointer;
transition:0.5s;
}
.border-button a {
display:inline-block;
height:50px;
line-height:50px;
position:relative;
font-size:16px;
text-align:center;
text-decoration:none;
color:#FFFFFF;
border:1px solid #FFFFFF;
padding:0px 35px 0px 35px;
-webkit-appearance:none;
transition:0.5s;
}
.border-button a:active, .border-button a:link, .border-button a:visited {
color:#FFFFFF;
}
.border-button a:hover {
background-color:#818286;
border:1px solid #818286;
color:#FFFFFF;
}
.border-button span.material-icons {
display:inline;
vertical-align:middle;
margin:0px;
padding:0px;
font-size:25px !important;
line-height:50px;
}
.highlight-button {
width:auto;
margin-left:auto;
margin-right:auto;
-webkit-appearance:none;
border-radius:0;
cursor:pointer;
transition:0.5s;
}
.highlight-button a {
display:inline-block;
height:50px;
line-height:50px;
position:relative;
font-size:16px;
text-align:center;
text-decoration:none;
color:#6B2936;
border:1px solid #6B2936;
padding:0px 35px 0px 35px;
-webkit-appearance:none;
transition:0.5s;
}
.highlight-button a:active, .highlight-button a:link, .highlight-button a:visited {
color:#6B2936;
}
.highlight-button a:hover {
background-color:#818286;
border:1px solid #818286;
color:#FFFFFF;
}
.highlight-button:hover a:active, .highlight-button:hover a:link, .highlight-button:hover a:visited {
color:#FFFFFF;
}
.highlight-button span.material-icons {
display:inline;
vertical-align:middle;
margin:0px;
padding:0px;
font-size:25px !important;
line-height:50px;
}

/* CONTENT ============================================================================= */
.swatches {
font-size:14px;
text-align:center;
}
.swatch {
width:100%;
max-width:140px;
border:1px solid #1A1915;
border:1px solid #949292;
}
.box-download-text {
width:85%;
}
.box-download-image {
position:absolute;
width:17.5%;
max-width:287px;
top:-50px;
right:-15px;
text-align:right;
}
.box-hover {
width:100%;
height:100%;
position:absolute;
top:0px;
left:0px;
background-color:rgba(135,135,135,0);
cursor:pointer;
}
.box-hover:hover {
background-color:rgba(135,135,135,0.50);
}
.box-basic {
background-color:#F5F5F5;
background-color:#FFFFFF;
background-color:transparent;
padding:10%;
}
.box-basic-image {
background-size:cover;
background-position:center center;
transition:0.5s;
}
.box-basic-image:hover {
transform:scale(1.2);
}
.box-featured {
background-color:#E5E5E5;
background-color:#F5F5F5;
}
#content-basic .box-featured {
background-color:#FFFFFF;
}
.box-featured h3 {
font-size:25px;
line-height:30px;
}
.box-featured p {
text-align:left;
}
.box-featured-surround {
position:relative;
height:100%;
width:80%;
padding-left:10%;
padding-right:10%;
padding-top:5%;
padding-bottom:5%;
}
.box-featured-content {
position:absolute;
position:relative;
top:50%;
-ms-transform:translateY(-50%);
transform:translateY(-50%);
}
.box-featured-content h6 {
font-size:25px;
line-height:35px;
margin:0px;
padding:0px;
}
.box-featured-content .page-button {
text-align:right;
}
.box-featured-category {
margin-top:0px;
padding-top:0px;
}
.box-navigation {
position:relative;
background-color:#F2F2F2;
border:0px solid #C5C5C5;
font-size:15px;
font-weight:400;
overflow:hidden;
}
.box-navigation:hover .box-navigation-bg {
transform:scale(1.2, 1.2);
}
.box-navigation h2 {
height:15px;
line-height:15px;
margin:0px;
padding:10px;
background-color:#C5C5C5;
font-size:15px;
font-weight:400;
text-align:center;
color:#221F1F;
}
,box-navigation div {
background-size:cover;
background-position:center center;
}
.box-navigation img {
display:block;
max-width:100%;
height:auto;
margin:0px;
padding:0px;
transition:0.5s ease;
}
.box-navigation:hover img {
opacity:0.5;
opacity:1;
transform:scale(1.2, 1.2);
}
.box-navigation-overlay {
width:96%;
position:absolute;
background:rgba(26,25,21,0.75);
bottom:0px;
padding-left:2%;
padding-right:2%;
padding-top:10px;
padding-bottom:10px;
cursor:pointer;
transition:0.5s;
}
.box-navigation:hover .box-navigation-overlay {
background:rgba(26,25,21,0.85);
top:0px;
}
.box-navigation-overlay p {
min-height:25px;
line-height:25px;
margin:0px;
padding:0px;
font-size:16px;
font-weight:900;
text-align:center;
text-transform:uppercase;
color:#333333;
overflow:hidden;
}
.box-navigation-overlay p a:active, .box-navigation-overlay p a:link, .box-navigation-overlay p a:visited {
color:#FFFFFF;
}
.box-navigation-overlay p a:hover {
color:#AB3F54;
}
.box-navigation-title {
width:96%;
position:absolute;
background:transparent;
top:0px;
padding-left:2%;
padding-right:2%;
padding-top:10px;
padding-bottom:10px;
cursor:pointer;
transition:0.5s;
}
.box-navigation:hover .box-navigation-title {
background:rgba(26,25,21,0.75);
top:0px;
}
.box-navigation-title p {
height:auto;
min-height:25px;
line-height:25px;
margin:0px;
padding:0px;
font-size:0.75vw;
font-size:20px;
font-weight:900;
text-align:left;
text-transform:uppercase;
color:#333333;
overflow:hidden;
}
.box-navigation-title p a:active, .box-navigation-title p a:link, .box-navigation-title p a:visited {
color:#FFFFFF;
}
.box-navigation-title p a:hover {
color:#AB3F54;
}
.box-navigation-icon {
display:none;
position:absolute;
top:5px;
right:0px;
}
.box-navigation:hover .box-navigation-icon {
display:block;
}
.box-navigation ul {
list-style:none;
margin-left:0px;
padding:2%;
}
.box-navigation h3 {
margin:0px;
padding:2%;
font-size:20px;
}
.box-navigation p {
margin:0px;
padding:2%;
}
.box-navigation-text {
opacity:0;
position:absolute;
width:96%;
left:0px;
top:50%;
transform:translateY(-50%);
padding:2%;
text-align:center;
font-size:1.5vw;
font-size:20px;
color:#FFFFFF;
-webkit-transition:opacity 0.5s ease-in-out;
transition:opacity 0.5s ease-in-out;
z-index:2;
}
.box-navigation:hover .box-navigation-text {
opacity:1;
}
.box-features-border {
position:relative;
margin-bottom:325px;
}
.box-features {
position:absolute;
margin-left:auto;
margin-right:auto;
left:0;
right:0;
top:85%;
width:50%;
height:325px;
padding:2%;
padding-left:5%;
padding-right:5%;
background-color:#1A1915;
color:#FFFFFF;
text-align:center;
}
.box-features h2 {
text-transform:uppercase;
text-align:center;
color:#FFFFFF;
}
.box-features p {
text-align:center;
}
.box-features img {
width:100%;
max-width:100%;
margin:0px;
padding:0px;
}
.box-background {
background-color:#F5F5F5;
background-size:cover;
background-position:left center;
}
.box-text {
background-color:#F5F5F5;
background-color:transparent;
}
.box-about {
margin:10%;
padding:10%;
background-color:#FFFFFF;
background-color:rgba(255,255,255,0.80);
}
.box-about-border {
padding-top:10%;
border-top:1px solid #878786;
}
.box-about h6 {
white-space:normal;
margin:0px;
}
.box-about p {
font-size:25px;
}
.box-about span {
font-size:14px;
}
.box-about .material-icons {
font-size:95px;
}
.box-plain {
padding:2%;
}
.box-plain-border {
padding-top:10%;
border-top:1px solid #AFAEAC;
}
.box-logo {
position:relative;
height:100%;
}
.box-logo p {
margin:0;
position:relative;
top:50%;
left:50%;
transform:translate(-50%,-50%);
text-align:center;
}
#content .box-logo img {
display:block;
width:75%;
max-width:450px;
margin:auto;
}
.box-logo-category {
background-color:#1A1915;
font-size:20px;
font-weight:700;
color:#FFFFFF;
}
.box-testimonial {
position:relative;
height:100%;
border:1px solid #E5E5E5;
background-color:#FFFFFF;
margin-bottom:5px;
font-size:15px;
line-height:20px;
overflow:hidden;
}
.box-testimonial:hover {
background-color:#F5F5F5;
}
.box-testimonial div {
padding:2%;
}
.box-testimonial-category {
background-color:#1A1915;
font-size:20px;
font-weight:700;
color:#FFFFFF;
}
.box-testimonial .material-icons {
display:inline;
vertical-align:middle;
line-height:20px;
padding-right:10px;
}
.box-testimonial p.page-button {
position:absolute;
bottom:0px;
right:0px;
margin:0px;
padding:0px;
}
.box-testimonial p.feature-button {
position:absolute;
bottom:0px;
right:0px;
margin:0px;
padding:0px;
}
.box-testimonial .page-button .material-icons {
line-height:auto;
padding-right:0px;
}
.box-testimonial .feature-button .material-icons {
line-height:auto;
padding-right:0px;
}
.box-testimonial .symbol {
font-family:Georgia, "Times New Roman", Times, serif;
font-size:35px;
line-height:20px;
vertical-align:middle;
}
.testimonial {
font-size:12px
}
.testimonial a:active, .testimonial a:link, .testimonial a:visited {
color:#6B2936;
}
.testimonial a:hover {
color:#6B2936;
}
.navigation {
font-weight:700;
font-size:14px;
}
.slogan {
color:#6B2936;
font-size:20px;
font-weight:700;
}
.gallery {
font-size:18px;
}
.gallery div {
margin-bottom:10px;
}
#content.gallery img:hover {
opacity:0.75;
}
.photo {
font-size:16px;
}
.photo div {
margin-bottom:10px;
}
.photo a:active, .photo a:link, .photo a:visited {
color:#1A1915;
}
.photo a:hover {
color:#1A75CE;
}
.video {
border:#E8E7E7 1px solid;
padding-bottom:10px;
padding-left:10px;
padding-right:10px;
padding-top:10px;
text-align:center;
}
#lightbox {
width:100%;
height:100%;
position:fixed;
z-index:30000;
margin:0px;
padding:0px;
top:0px;
left:0px;
text-align:center;
}
#lightbox #light {
width:100%;
height:100%;
position:fixed;
z-index:-1;
margin:0px;
padding:0px;
top:0px;
left:0px;
background:#1A1915;
filter:alpha(opacity=100);
opacity:1;
}
#lightbox #box-nav {
width:100%;
position:absolute;
z-index:30001;
background-color:#FFFFFF;
top:0px;
left:0px;
}
#lightbox #box {
position:absolute;
width:100%;
max-width:100%;
height:100%;
top:50%;
left:50%;
transform:translate(-50%,-50%);
-ms-transform:translate(-50%,-50%);
-webkit-transform:translate(-50%,-50%);
-moz-transform:translate(-50%,-50%);
-o-transform:translate(-50%,-50%);
overflow:hidden;
}
#lightbox #box img {
width:auto;
max-width:90%;
height:auto;
max-height:90%;
padding:0px;
position:fixed;
top:50%;
left:50%;
transform:translate(-50%,-50%);
-ms-transform:translate(-50%,-50%);
-webkit-transform:translate(-50%,-50%);
-moz-transform:translate(-50%,-50%);
-o-transform:translate(-50%,-50%);
background-color:#FFFFFF;
}
#lightbox p {
text-align:center;
}
#quotes {
font-size:35px;
line-height:55px;
}
#quotes ul {
list-style:none;
text-align:center;
}
#quotes .symbol {
font-family:Georgia, "Times New Roman", Times, serif;
font-size:65px;
line-height:35px;
vertical-align:bottom;
}
.title {
color:#FFFFFF;
font-size:12px;
font-weight:700;
}
.heading {
font-size:12px;
font-weight:700;
color:#FF9933
}
.textsmall {
font-size:12px;
font-weight:700;
}
.textcolour {
color:#6B2936;
}
.texttiny {
font-size:12px;
color:#FFFFFF
}
.polygon {
height:100%;
width:100%;
}
svg {
width:100%;
height:100px;
}
polygon {
fill:#FFFFFF;
}
.hide-mini {
display:inline;
}
.hide-midi {
display:inline;
}
.hide-maxi {
display:none;
}
.hide-mini-t {
display:table-cell;
}
.hide-midi-t {
display:table-cell;
}
.hide-maxi-t {
display:none;
}
.hide-all {
display:none;
}
.hide-features {
display:inline;
}
.hide-team {
display:inline;
}

@media only screen and (max-width:1600px) {
.box-download-text {
width:82.5%;
}
.box-download-image {
width:20%;
top:-40px;
}
}

@media only screen and (max-width:1400px) {
/*   MAKE LAYOUT RESPONSIVE at 1400px FOR LAPTOP ================================================================ */
h1 {
font-size:7vw;
}
#header-logo {
width:250px;
height:39px;
top:20px;
left:55px;
}
#header-phone {
font-size:2vw;
}
#animation-box {
max-width:60%;
font-size:3vw;
line-height:50px;
}
#animation-box strong {
font-size:4vw;
line-height:50px;
}
#icons span {
font-size:2vw;
}
#icons span.material-icons {
font-size:4vw;
}
#feature span {
font-size:4vw;
}
#feature span.material-icons {
font-size:6vw;
}
#bar span {
font-size:4vw;
}
#bar span.material-icons {
font-size:6vw;
}
#shadow p {
font-size:1.5vw;
}
#footer-box {
padding-left:5%;
}
.box-download-text {
width:80%;
}
.box-download-image {
width:22.5%;
top:-30px;
}
.box-plain .material-icons {
font-size:7vw;
}
.box-features-border {
margin-bottom:275px;
}
.box-features {
width:75%;
height:275px;
}
.box-features h2 {
font-size:2.5vw;
}
.box-features p {
font-size:1.5vw;
}
.hide-features {
display:none;
}
}

@media only screen and (max-width:1200px) {
.box-download-text {
width:75%;
}
.box-download-image {
width:27.5%;
top:-20px;
}
}

@media only screen and (max-width:1000px) {
/*   MAKE LAYOUT RESPONSIVE at 1000px FOR LAPTOP ================================================================ */
h1 {
font-size:9vw;
}
#header-buttons {
width:100%;
width:90%;
font-size:12px;
}
#header-call {
display:none;
}
#header-address strong {
display:none;
}
#animation-box {
max-width:70%;
font-size:5vw;
line-height:45px;
}
#animation-box strong {
font-size:7vw;
line-height:45px;
}
#bar {
padding-top:75px;
padding-bottom:75px;
}
#shadow p {
font-size:2vw;
}
#footer-box {
padding-left:0px;
}
.box-download-text {
width:70%;
}
.box-download-image {
width:32.5%;
}
.box-features h2 {
font-size:3vw;
}
.box-features p {
font-size:2vw;
}
.hide-team {
display:none;
}
}

@media only screen and (max-width:768px) {
/*   MAKE LAYOUT RESPONSIVE at 768px FOR IPAD LANDSCAPE ================================================================ */
h1 {
font-size:10vw;
line-height:65px;
white-space:normal;
}
h2 {
font-size:30px;
font-size:5vw;
line-height:35px;
}
h3 {
font-size:30px;
font-size:5vw;
line-height:35px;
}
h4 {
font-size:30px;
font-size:5vw;
line-height:35px;
}
h5 {
font-size:20px;
font-size:4vw;
line-height:25px;
}
h6 {
font-size:30px;
font-size:5vw;
line-height:35px;
}
div.shape {
display:none;
}
#framework-header {
height:50px;
line-height:50px;
background-color:#1A1915;
background-color:transparent;
background-image:linear-gradient(rgba(26,25,21,1),rgba(26,25,21,0));
}
#header a:active, #header a:link, #header a:visited {
color:#FFFFFF;
}
#header a:hover {
color:#6B2936;
}
#header-box {
background-color:transparent;
padding-right:10px;
padding-right:0px;
}
#framework-buttons {
top:0px;
height:50px;
}
#header-burger-bg {
top:0px;
left:0px;
}
#header-burger-bg span.header-burger-bg-nav {
width:45px;
line-height:50px;
}
#header-burger {
top:5px;
left:10px;
}
#header-buttons {
display:none;
width:100%;
height:65px;
top:15px;
}
#header-phone {
line-height:50px;
font-size:20px;
}
#animation-box {
max-width:80%;
font-size:6vw;
line-height:40px;
}
#animation-box strong {
font-size:8vw;
line-height:40px;
}
#animation-box p.feature {
font-size:7vw;
line-height:40px;
}
#content img {
width:250px;
max-width:100%;
margin-left:1%;
margin-right:1%;
margin-bottom:1%;
}
.content-main {
width:100%;
}
.content-menu {
width:100%;
margin-left:0px;
}
#content .padding2h {
padding-left:5%;
padding-right:5%;
padding-bottom:5%;
}
#content-basic .padding2h {
padding-left:5%;
padding-right:5%;
padding-bottom:5%;
}
#content-0 .padding2h {
padding-left:5%;
padding-right:5%;
padding-bottom:5%;
}
#content-1 .padding2h {
padding-left:5%;
padding-right:5%;
padding-bottom:5%;
}
#content-2 .padding2h {
padding-left:5%;
padding-right:5%;
padding-bottom:5%;
}
#content-3 .padding2h {
padding-left:5%;
padding-right:5%;
padding-bottom:5%;
}
#icons {
display:none;
}
#feature span {
font-size:7vw;
}
#feature span.material-icons {
font-size:10vw;
}
#bar {
padding-top:50px;
padding-bottom:50px;
font-size:16px;
}
#content .box-logo img {
width:75%;
max-width:75%;
padding-top:5px;
padding-bottom:5px;
}
.box-download-text {
width:60%;
}
.box-download-image {
width:40%;
}
.box-featured h3 {
font-size:4vw;
line-height:30px;
}
.box-features-border {
margin-bottom:325px;
}
.box-features {
width:80%;
height:325px;
}
.box-features h2 {
font-size:4vw;
}
.box-features p {
font-size:3vw;
}
.box-text {
background-color:transparent;
}
.box-plain {
background-color:rgba(255,255,255,0.80);
}
.box-plain .material-icons {
font-size:15vw;
}
.gallery {
font-size:16px;
}
.gallery div {
margin-bottom:5px;
}
.photo {
font-size:14px;
}
.photo div {
margin-bottom:5px;
}
#quotes {
font-size:25px;
line-height:45px;
}
#quotes .symbol {
font-size:55px;
line-height:25px;
}
#shadow p {
font-size:3vw;
}
#features-nav-text {
display:none;
}
#footer img {
margin-left:auto;
margin-right:auto;
}
#footer .footer-buttons {
text-align:center;
}
#footer .feature-button {
width:35%;
margin-top:10px;
margin-left:2%;
}
#footer .feature-button a {
width:100%;
padding:0px;
}
#footer .page-button {
width:35%;
margin-top:10px;
}
#footer .page-button a {
width:100%;
padding:0px;
}
#footer-icons {
margin-top:10px;
margin-bottom:10px;
}
#copyright {
text-align:center;
font-size:14px;
line-height:35px;
padding-top:10px;
padding-bottom:10px;
}
.copyright {
text-align:center;
}
.hide-mini {
display:inline;
}
.hide-maxi {
display:inline;
}
.hide-midi {
display:none;
}
.hide-mini-t {
display:table-cell;
}
.hide-maxi-t {
display:table-cell;
}
.hide-midi-t {
display:none;
}
}

@media only screen and (max-width:480px) {
/* MAKE LAYOUT RESPONSIVE at 480px FOR IPHONE LANDSCAPE ============================================ */

/* CONTENT ============================================================================= */
h1 {
font-size:10vw;
line-height:45px;
margin-top:50px;
margin-bottom:50px;
white-space:normal;
}
h2 {
font-size:25px;
font-size:6vw;
line-height:30px;
white-space:normal;
}
h3 {
font-size:25px;
font-size:6vw;
line-height:30px;
}
h4 {
font-size:25px;
font-size:6vw;
line-height:30px;
}
h5 {
font-size:20px;
font-size:5vw;
line-height:25px;
}
h6 {
font-size:25px;
font-size:6vw;
line-height:30px;
white-space:normal;
}
svg.svg-linkedin {
padding-left:5px;
}
div.shape {
display:none;
}
#framework-header {
height:50px;
line-height:50px;
background-color:#1A1915;
background-color:transparent;
background-image:linear-gradient(rgba(26,25,21,1),rgba(26,25,21,0));
}
#header a:active, #header a:link, #header a:visited {
color:#FFFFFF;
}
#header a:hover {
color:#6B2936;
}
#header-box {
background-color:transparent;
padding-right:10px;
padding-right:0px;
}
#header-phone {
line-height:35px;
font-size:16px;
}
#header-address {
width:95%;
border-bottom:0px;
}
#header-address p {
text-align:right;
}
#header-address .material-icons {
padding-left:5px;
padding-right:0px;
}
#framework-buttons {
top:0px;
height:50px;
}
#header-burger-bg {
top:0px;
left:0px;
}
#header-burger-bg span.header-burger-bg-nav {
width:45px;
line-height:50px;
}
#header-burger {
top:5px;
left:10px;
}
#header-buttons {
display:none;
height:35px;
line-height:35px;
position:relative;
top:0px;
font-size:11px;
}
#header-buttons li {
width:20%;
}
#header-buttons li:first-child {
display:none;
}
#framework-animation {
min-height:100vh;
}
#animation {
min-height:100vh;
}
#animation-box {
font-size:7vw;
line-height:35px;
}
#animation-box strong {
font-size:9vw;
line-height:75px;
}
#animation-box p.feature {
font-size:8vw;
line-height:40px;
}
#out-of-the-box {
height:88vh;
}
#out-of-the-box li {
height:88vh;
}
#out-of-the-box li div {
height:88vh;
}
.thumbnails .sy-caption-wrap .sy-caption {
font-size:20px;
}
#content .padding2h {
padding-left:5%;
padding-right:5%;
padding-bottom:5%;
}
#content img {
width:100%;
max-width:100%;
margin-left:0px;
margin-right:0px;
margin-bottom:1%;
}
#content-basic .padding2h {
padding-left:5%;
padding-right:5%;
padding-bottom:5%;
}
#content-basic img {
width:100%;
max-width:100%;
margin-left:0px;
margin-right:0px;
margin-bottom:1%;
}
#content-0 .padding2h {
padding-left:5%;
padding-right:5%;
padding-bottom:5%;
}
#content-0 img {
width:100%;
max-width:100%;
margin-left:0px;
margin-right:0px;
margin-bottom:1%;
}
#content-1 .padding2h {
padding-left:5%;
padding-right:5%;
padding-bottom:5%;
}
#content-1 img {
width:100%;
max-width:100%;
margin-left:0px;
margin-right:0px;
margin-bottom:1%;
}
#content-2 .padding2h {
padding-left:5%;
padding-right:5%;
padding-bottom:5%;
}
#content-2 img {
width:100%;
max-width:100%;
margin-left:0px;
margin-right:0px;
margin-bottom:1%;
}
#content-3 .padding2h {
padding-left:5%;
padding-right:5%;
padding-bottom:5%;
}
#content-3 img {
width:100%;
max-width:100%;
margin-left:0px;
margin-right:0px;
margin-bottom:1%;
}
.content-image img {
width:100%;
max-width:100%;
margin:0px;
margin-bottom:1%;
float:none;
}
.box-download-text {
width:100%;
margin-top:265px;
}
.box-download-image {
width:70%;
top:-50px;
left:15%;
right:15%;
}
.box-plain .material-icons {
font-size:20vw;
}
.box-testimonial-category {
font-size:18px;
}
#content .box-logo img {
padding-top:15px;
padding-bottom:15px;
}
.box-featured h3 {
font-size:5vw;
line-height:30px;
}
.box-features-border {
margin-bottom:0px;
}
.box-features {
position:relative;
top:0px;
width:90%;
height:auto;
}
.box-features h2 {
font-size:25px;
line-height:30px;
}
.box-features p {
font-size:18px;
}
#quotes {
font-size:20px;
line-height:40px;
}
#quotes .symbol {
font-size:50px;
line-height:20px;
}
#feature span {
font-size:7vw;
}
#feature span.material-icons {
font-size:10vw;
}
#features {
margin-left:0;
}
#features-nav div {
border-left:0px solid #BCBDC1;
border-right:1px solid #BCBDC1;
}
#features-nav-text {
display:none;
}
#bar span {
font-size:7vw;
}
#bar span.material-icons {
font-size:10vw;
}
#shadow p {
font-size:4.5vw;
font-size:3.5vw;
}
#shadow .material-icons {
padding-left:0px;
}
#basic {
min-height:65vh;
}
#basic-box p {
font-size:8vw;
}
#footer {
padding-top:15px;
padding-bottom:15px;
font-size:14px;
}
#footer h4 {
margin-left:5%;
margin-right:5%;
text-align:center;
}
#footer h5 {
margin-left:0px;
text-align:center;
}
#footer p {
margin-left:0px;
text-align:center;
}
#footer span {
font-size:25px;
}
#footer .feature-button {
width:47%;
margin-top:10px;
margin-left:2%;
}
#footer .feature-button a {
width:100%;
padding:0px;
}
#footer .page-button {
width:47%;
margin-top:10px;
}
#footer .page-button a {
width:100%;
padding:0px;
}
#footer-box {
padding-left:5%;
}
#copyright {
text-align:center;
font-size:14px;
line-height:35px;
padding-top:10px;
padding-bottom:10px;
}
.copyright {
text-align:center;
}
.box-services {
display:none;
}
input:not([type=submit]):not([type=file]):not([type=radio]):not([type=checkbox]):not([type=image]):not([type=submit]) {
width:90%;
max-width:90%;
margin-bottom:5px;
font-size:16px;
}
textarea {
width:90%;
margin-bottom:5px;
font-size:16px;
}
.hide-maxi {
display:inline;
}
.hide-midi {
display:inline;
}
.hide-mini {
display:none;
}
.hide-maxi-t {
display:table-cell;
}
.hide-midi-t {
display:table-cell;
}
.hide-mini-t {
display:none;
}
}

@media only screen and (max-width:400px) {
/* MAKE LAYOUT RESPONSIVE at 400px FOR IPHONE LANDSCAPE ============================================ */

h1:before,
h1:after {
top:0.8em;
}
h2:before,
h2:after {
top:0.8em;
}
h6:before,
h6:after {
top:0.8em;
}
svg.svg-linkedin {
padding-left:3px;
}
#header-address .material-icons {
padding-left:0px;
padding-right:0px;
}
#header-phone {
right:5px;
font-size:3vw;
}
#header-tel {
display:none;
}
.sy-caption-wrap .sy-caption {
font-size:14px;
}

}