@charset "utf-8";

/*  BASIC PAGE SETUP ============================================================================= */
html {
text-size-adjust:100%;
-webkit-text-size-adjust:100%;
}
body { 
margin:0px;
background-color:#FFFFFF;
background-repeat:no-repeat;
background-size:cover;
background-position:center center;
background-attachment:fixed;
font-family:"Mulish", "Century Gothic", CenturyGothic, AppleGothic, sans-serif;
font-size:16px;
font-weight:400;
color:#737577;
color:#1D1B17;
scrollbar-face-color:#A5CE3A;
scrollbar-shadow-color:#1D1B17;
scrollbar-highlight-color:#CCCCCC;
scrollbar-3dlight-color:#FFFFFF;
scrollbar-darkshadow-color:#000033;
scrollbar-track-color:#1D1B17;
scrollbar-arrow-color:#FFFFFF;
}
div, ul, li, img, form {
margin:0px;
padding:0px;	
}
iframe, object, embed {
display:block;
margin:0px;
}
h1 {
font-family:"Mulish", "Century Gothic", CenturyGothic, AppleGothic, sans-serif;
font-size:65px;
font-weight:900;
text-transform:uppercase;
text-align:center;
color:#1D1B17;
line-height:75px;
}
h2 {
font-family:"Mulish", "Century Gothic", CenturyGothic, AppleGothic, sans-serif;
font-size:55px;
font-weight:200;
text-transform:uppercase;
text-align:center;
color:#C5C5C5;
color:#1D1B17;
line-height:55px;
}
h2 strong {
font-weight:400;
}
h3 {
font-family:"Mulish", "Century Gothic", CenturyGothic, AppleGothic, sans-serif;
font-size:25px;
font-weight:400;
text-align:center;
color:#1D1B17;
line-height:35px;
}
h4 {
font-family:"Mulish", "Century Gothic", CenturyGothic, AppleGothic, sans-serif;
font-size:25px;
font-weight:400;
text-align:center;
color:#1D1B17;
line-height:35px;
padding-bottom:5px;
border-bottom:1px solid #1D1B17;
}
h5 {
font-family:"Mulish", "Century Gothic", CenturyGothic, AppleGothic, sans-serif;
font-size:25px;
font-weight:600;
text-align:center;
color:#1D1B17;
line-height:35px;
}
h6 {
font-family:"Mulish", "Century Gothic", CenturyGothic, AppleGothic, sans-serif;
font-size:65px;
font-weight:400;
text-align:center;
color:#1D1B17;
line-height:65px;
margin:50px;
}
a {
text-decoration:none;
}
a:active {
color:#A5CE3A;
}
a:link {
color:#A5CE3A;
}
a:visited {
color:#A5CE3A;
}
a:hover {
color:#D5006E;
}
select {
font-size:16px;
}
hr {
border:0;
width:50%;
height:1px;
margin-left:25%;
margin-right:25%;
margin-top:15px;
margin-bottom:15px;
background-color:#757575;
background-color:#C5C5C5;
}
p {
text-align:justify;
line-height:28px;
}
p.anchor {
display:block;
position:relative;
top:-50px;
visibility:hidden;
line-height:0px;
margin:0px;
}
strong {
font-weight:600;
}
svg {
fill:#A5CE3A;
width:auto;
height:20px;
opacity:0.25;
}
svg.svg-instagram {
fill:#A5CE3A;
height:20px;
opacity:1;
padding-left:10px;
padding-top:5px;
}
svg.svg-instagram:hover {
fill:#F00075;
}
.bottom-nav svg.svg-instagram {
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 #C5C5C5;
font-weight:400;
}
.table-design tr {
background-color:#FFFFFF;
}
.table-design tr:hover {
background-color:#E5E5E5;
}
.table-design th {
background-color:#1D1B17;
padding:15px;
vertical-align:top;
text-align:center;
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 #E5E5E5;
text-align:center;
font-weight:400;
}
.table-design td p {
padding:0px;
margin:0px;
}
.table-design td span {
font-size:20px;
font-weight:600;
}
.material-icons {
display:inline;
vertical-align:middle;
padding-right:5px;
}
.standout .material-icons {
font-size:100px;
padding-right:0px;
}
.icon-facebook .material-icons:hover {
color:#4368B0;
}

/*  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(31, 180, 221, 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;
font-size:28px;
}
.overlay p {
text-align:center;
font-size:12px;
}
.circle {
width:100px;
height:100px;
background-color:transparent;
border:5px dashed #FFFFFF;
border-radius:50%;
-moz-border-radius:50%;
-webkit-border-radius:50%;
padding:25px;
margin-left:auto;
margin-right:auto;
}
.circle-highlight {
width:100px;
height:100px;
background-color:transparent;
border:5px dashed #93CAE9;
border-radius:50%;
-moz-border-radius:50%;
-webkit-border-radius:50%;
padding:25px;
margin-left:auto;
margin-right:auto;
}
.circle-new {
width:100px;
height:100px;
background-color:transparent;
border:5px dashed #1D1B17;
border-radius:50%;
-moz-border-radius:50%;
-webkit-border-radius:50%;
padding:25px;
margin-left:auto;
margin-right:auto;
}
.circle-solid {
position:absolute;
top:-35px;
left:-35px;
width:100px;
height:100px;
background-color:transparent;
border:3px solid #FFFFFF;
border-radius:50%;
-moz-border-radius:50%;
-webkit-border-radius:50%;
padding:25px;
margin-left:auto;
margin-right:auto;
}
#circle-profile {
position:relative;
float:left;
width:350px;
max-width:100%;
height:350px;
overflow:hidden;
margin:0px;
margin-right:25px;
padding:0px;
border-radius:50%;
}
#circle-profile img {
width:100%;
max-width:100%;
margin:0px;
padding:0px;
}
#icons-profile {
text-align:right;
}

/* IFRAMES============================================================================= */
.framework-iframe {
position:relative;
padding-bottom:56.25%;
padding-top:30px;
height:0;
overflow:hidden;
}
.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 {
position:relative;
width:100%;
margin:0px;
text-align:left;
}
#framework-home {
position:relative;
background-repeat:no-repeat;
background-position:left top;
background-size:cover;
}
#framework-navigation {
position:fixed;
width:100%;
height:50px;
top:35px;
top:0px;
background-color:#1D1B17;
border-bottom:1px solid #FFFFFF;
z-index:1999;
z-index:20000;
}
#navigation {
width:auto;
min-width:320px;
max-width:1600px;
position:relative;
margin-right:auto;
margin-left:auto;
}
#navigation a:active, #navigation a:link, #navigation a:visited {
color:#A5CE3A;
}
#navigation a:hover {
color:#D5006E;
}
#framework-logo {
position:relative;
width:100%;
}
#logo {
width:auto;
min-width:320px;
max-width:1600px;
position:relative;
margin-top:0px;
margin-right:auto;
margin-bottom:0px;
margin-left:auto;
}
#header-logo {
width:28%;
height:75px;
position:absolute;
float:left;
margin-left:1%;
margin-top:5px;
z-index:100;
}
#framework-menu {
position:fixed;
width:100%;
height:50px;
min-height:50px;
background-color:#A5CE3A;
z-index:5000;
top:0px;
}
#menu {
width:auto;
min-width:320px;
max-width:1600px;
position:relative;
margin-top:0px;
margin-right:auto;
margin-bottom:0px;
margin-left:auto;
color:#1D1B17;
font-size:15px;
}
#header-social{
width:450px;
top:5px;
right:0px;
z-index:100;
position:absolute;
}
#header-social div{
display:block;
text-align:right;
float:right;
margin-right:5px;
}
#framework-animation {
position:relative;
width:100%;
background-repeat:no-repeat;
background-position:center center;
background-size:cover;
padding-top:50px;
}
#animation {
width:100%;
min-width:320px;
position:relative;
margin:0px;
margin-right:auto;
margin-left:auto;
color:#C5C5C5;
}
#animation img {
width:100%;
max-width:100%;
margin:0px;
padding:0px;
}
#animation h1 {
color:#FFFFFF;
}
#animation a:active, #animation a:link, #animation a:visited {
color:#A5CE3A;
}
#animation a:hover {
color:#D5006E;
}
#animation div {
width:98%;
min-width:320px;
max-width:1600px;
margin-right:auto;
margin-left:auto;
}
#animation-overlay {
width:100%;
width:80%;
min-width:320px;
max-width:1600px;
position:relative;
margin:0px;
margin-right:auto;
margin-left:auto;
}
#animation-box {
width:80%;
position:absolute;
left:0;
right:0;
margin-left:auto;
margin-right:auto;
top:45%;
-ms-transform:translateY(-45%);
transform:translateY(-45%);
font-size:45px;
font-size:7vw;
font-weight:300;
text-align:right;
color:#1d1b17;
}
#animation-box h1 {
font-size:75px;
font-weight:600;
line-height:85px;
text-align:right;
text-transform:none;
text-shadow:1px 1px 1px #FFFFFF, 0px 0px 5px #FFFFFF;
}
#animation-box p {
text-align:right;
}
#animation-box .animation-standout {
font-size:75px;
font-weight:600;
line-height:85px;
text-shadow:1px 1px 1px #FFFFFF, 0px 0px 5px #FFFFFF;
}
#animation-box .animation-text {
padding-top:0px;
font-size:35px;
line-height:45px;
text-shadow:1px 1px 1px #FFFFFF, 0px 0px 5px #FFFFFF;
}
#framework-header {
position:relative;
width:100%;
height:100vh;
background-color:#D7D5D0;
background-size:cover;
background-position:center bottom;
background-repeat:no-repeat;
}
#header {
width:auto;
min-width:320px;
max-width:1600px;
position:relative;
margin-top:0px;
margin-right:auto;
margin-bottom:0px;
margin-left:auto;
color:#1D1B17;
font-size:15px;
}
.arrow a {
position:absolute;
bottom:20px;
left:50%;
z-index:2;
display:inline-block;
-webkit-transform:translate(0, -50%);
transform:translate(0, -50%);
color:#a5ce3a;
letter-spacing:.1em;
text-decoration:none;
transition:opacity .3s;
}
.arrow a:hover {
opacity:.5;
}
#framework-header a span {
position:absolute;
top:0;
left:50%;
width:46px;
height:46px;
margin-left:-23px;
border:2px solid #a5ce3a;
border-radius:100%;
box-sizing:border-box;
}
#framework-header a span::after {
position:absolute;
top:50%;
left:50%;
content:'';
width:16px;
height:16px;
margin:-12px 0 0 -8px;
border-left:2px solid #a5ce3a;
border-bottom:2px solid #a5ce3a;
-webkit-transform:rotate(-45deg);
transform:rotate(-45deg);
box-sizing:border-box;
}
#framework-header a span::before {
position:absolute;
top:0;
left:0;
z-index:-1;
content:'';
width:44px;
height:44px;
box-shadow:0 0 0 0 rgba(255,255,255,.1);
border-radius:100%;
opacity:0;
-webkit-animation:sdb03 3s infinite;
animation:sdb03 3s infinite;
box-sizing:border-box;
}
@-webkit-keyframes sdb03 {
0% {
opacity:0;
}
30% {
opacity:1;
}
60% {
box-shadow:0 0 0 60px rgba(255,255,255,.1);
opacity:0;
}
100% {
opacity:0;
}
}
@keyframes sdb03 {
0% {
opacity:0;
}
30% {
opacity:1;
}
60% {
box-shadow:0 0 0 60px rgba(255,255,255,.1);
opacity:0;
}
100% {
opacity:0;
}
}
#framework-highlights {
position:relative;
width:100%;
background-color:#1D1B17;
font-size:20px;
color:#FFFFFF;
}
#highlights {
width:auto;
min-width:320px;
max-width:1600px;
position:relative;
margin-top:0px;
margin-right:auto;
margin-bottom:0px;
margin-left:auto;
padding:0px;
padding-top:100px;
padding-bottom:100px;
text-align:center;
}
#highlights a {
font-size:15px;
color:#A5CE3A;
}
#highlights a:hover {
color:#D5006E;
}
#highlights-box {
padding:10px;
padding-top:25px;
padding-bottom:25px;
}
#framework-content {
position:relative;
width:100%;
background-color:#FFFFFF;
}
#content {
width:auto;
min-width:320px;
max-width:1600px;
position:relative;
margin:0px;
padding-top:100px;
padding-bottom:100px;
margin-right:auto;
margin-left:auto;
}
#content img {
max-width:100%;
margin-left:1%;
margin-right:1%;
margin-bottom:1%;
}
#content hr {
margin-top:0px;
margin-top:35px;
margin-bottom:35px;
}
#content ul {
margin-left:5%;
}
#content li {
margin-bottom:5px;
}
#framework-content-1 {
position:relative;
width:100%;
background-color:#1D1B17;
color:#C5C5C5;
}
#content-1 {
width:auto;
min-width:320px;
max-width:1600px;
position:relative;
margin:0px;
padding:0px;
padding-top:100px;
padding-bottom:100px;
margin-right:auto;
margin-left:auto;
}
#content-1 img {
max-width:100%;
margin-left:1%;
margin-right:1%;
margin-bottom:1%;
}
#content-1 h1 {
color:#C5C5C5;
}
#content-1 h2 {
color:#C5C5C5;
}
#content-1 h3 {
color:#C5C5C5;
}
#content-1 h4 {
color:#C5C5C5;
border-bottom:1px solid #C5C5C5;
}
#content-1 ul {
margin-left:5%;
}
#content-1 li {
margin-bottom:5px;
}
#framework-content-2 {
position:relative;
width:100%;
background-color:#C5C5C5;
border-top:1px solid #C5C5C5;
}
#content-2 {
width:auto;
min-width:320px;
max-width:1600px;
max-width:100%;
position:relative;
margin:0px;
padding:0px;
margin-right:auto;
margin-left:auto;
}
#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:5px;
}
#content-2 a:active, #content-2 a:link, #content-2 a:visited {
color:#D5006E;
}
#content-2 a:hover {
color:#1D1B17;
}
#framework-content-3 {
position:relative;
width:100%;
background-color:#FFFFFF;
}
#content-3 {
width:auto;
min-width:320px;
max-width:1600px;
position:relative;
margin:0px;
padding:0px;
padding-top:100px;
padding-bottom:100px;
margin-right:auto;
margin-left:auto;
}
#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:5px;
}
#framework-content-4 {
position:relative;
width:100%;
background-color:#A5CE3A;
}
#content-4 {
width:auto;
min-width:320px;
max-width:1600px;
position:relative;
margin:0px;
padding:0px;
padding-top:100px;
padding-bottom:100px;
margin-right:auto;
margin-left:auto;
}
#content-4 img {
max-width:100%;
margin-left:1%;
margin-right:1%;
margin-bottom:1%;
}
#content-4 ul {
margin-left:5%;
}
#content-4 li {
margin-bottom:5px;
}
#framework-content-5 {
position:relative;
width:100%;
background-color:#D5006E;
}
#content-5 {
width:auto;
min-width:320px;
max-width:1600px;
position:relative;
margin:0px;
padding:0px;
padding-top:100px;
padding-bottom:100px;
margin-right:auto;
margin-left:auto;
}
#content-5 img {
max-width:100%;
margin-left:1%;
margin-right:1%;
margin-bottom:1%;
}
#content-5 ul {
margin-left:5%;
}
#content-5 li {
margin-bottom:5px;
}
#framework-content-6 {
position:relative;
width:100%;
background-color:#E5E5E5;
}
#content-6 {
width:auto;
min-width:320px;
max-width:1600px;
position:relative;
margin:0px;
padding:0px;
padding-top:100px;
padding-bottom:100px;
margin-right:auto;
margin-left:auto;
}
#content-6 img {
max-width:100%;
margin-left:1%;
margin-right:1%;
margin-bottom:1%;
}
#content-6 ul {
margin-left:5%;
}
#content-6 li {
margin-bottom:5px;
}
#content-6 a:active, #content-6 a:link, #content-6 a:visited {
color:#D5006E;
}
#content-6 a:hover {
color:#A5CE3A;
color:#1D1B17;
}
.content-main {
width:74.6%;
}
.content-menu {
width:23.8%;
}
.content-image img {
width:50%;
max-width:800px;
}
#framework-feature {
position:relative;
width:100%;
background-color:#ECECEC;
background-color:#FFFFFF;
content-visibility:auto;
}
#feature {
width:auto;
min-width:320px;
max-width:1600px;
position:relative;
margin:0px;
padding:0px;
padding-top:25px;
padding-bottom:25px;
margin-right:auto;
margin-left:auto;
}
#feature h5 {
text-align:left;
margin:0px;
padding:0px;
}
#feature p {
text-align:left;
margin:0px;
padding:0px;
}
#framework-features {
position:relative;
width:100%;
background-color:#ECECEC;
content-visibility:auto;
}
#features {
width:auto;
min-width:320px;
max-width:1600px;
position:relative;
margin:0px;
padding:0px;
padding-top:100px;
padding-bottom:100px;
margin-right:auto;
margin-left:auto;
text-align:center;
}
#features h2 {
font-size:24px;
text-align:center;
line-height:35px;
background-image:url(/images/bg-title-divider.png);
background-repeat:repeat-x;
background-position:top;
}
#features h2 span {
padding:10px;
padding-bottom:5px;
background-color:#FFFFFF;
background-image:url();
}
#framework-logos {
position:relative;
width:100%;
background-color:#FFFFFF;
content-visibility:auto;
}
#logos {
width:auto;
min-width:320px;
max-width:1600px;
position:relative;
margin:0px;
padding:0px;
padding-top:100px;
padding-bottom:100px;
margin-right:auto;
margin-left:auto;
text-align:center;
}
#logos h2 {
font-size:24px;
text-align:center;
line-height:35px;
background-image:url(/images/bg-title-divider.png);
background-repeat:repeat-x;
background-position:top;
}
#logos h2 span {
padding:10px;
padding-bottom:5px;
background-color:#FFFFFF;
background-image:url();
}
#box-logos {
padding-left:2%;
padding-right:2%;
}
#framework-testimonials {
position:relative;
width:100%;
background-color:#A5CE3A;
content-visibility:auto;
}
#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:#1D1B17;
}
#testimonials h5 {
font-size:24px;
text-align:center;
line-height:35px;
}
#testimonials h5 span {
padding:10px;
padding-bottom:5px;
background-color:#737577;
background-image:url();
}
#testimonials p {
text-align:right;
}
#testimonials a:active, #testimonials a:link, #testimonials a:visited {
color:#A5CE3A;
color:#1D1B17;
}
#testimonials a:hover {
color:#D5006E;
}
#framework-shadow {
position:relative;
width:100%;
height:auto;
background-color:#A5CE3A;
display:none;
}
#shadow {
width:auto;
min-width:320px;
max-width:1600px;
position:relative;
margin-right:auto;
margin-left:auto;
font-size:20px;
color:#FFFFFF;
}
#shadow p {
margin:0px;
padding:0px;
text-align:center;
line-height:75px;
}
#shadow a:active, #shadow a:link, #shadow a:visited {
color:#FFFFFF;
}
#shadow a:hover {
color:#1D1B17;
}
#framework-bar {
position:relative;
width:100%;
padding-top:50px;
padding-bottom:50px;
background-color:#040D0C;
content-visibility:auto;
}
#bar {
width:auto;
min-width:320px;
max-width:1600px;
position:relative;
margin:0px;
padding:0px;
margin-right:auto;
margin-left:auto;
font-size:14px;
text-align:center;
color:#A5A5A5;
}
#bar p {
text-align:center;
}
#bar p span {
font-size:35px;
color:#FFFFFF;
}
#bar a {
font-size:20px;
}
#framework-basic {
position:relative;
width:100%;
background-size:cover;
background-position:center center;
filter:grayscale(0%);
content-visibility:auto;
}
#basic {
width:100%;
height:65vh;
position:relative;
padding-top:75px;
padding-bottom:75px;
}
#basic-box {
position:absolute;
top:50%;
left:50%;
width:80%;
min-width:320px;
max-width:650px;
margin:0px;
margin-right:auto;
margin-left:auto;
padding:0px;
padding-top:25px;
padding-bottom:25px;
background-color:#FFFFFF;
background-color:rgba(255,255,255,0.85);
border-radius:5px;
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:#1D1B17;
}
#basic-box p {
margin:0px;
padding:0px;
line-height:55px;
font-size:45px;
font-weight:400;
text-align:center;
}
#basic-box a {
font-weight:900;
}
#basic-box a:active, #basic-box a:link, #basic-box a:visited {
color:#D5006E;
}
#basic-box a:hover {
color:#A5CE3A;
}
#basic-box .page-button a {
font-weight:500;
background-color:#D5006E;
border:2px solid #D5006E;
border-radius:15px 15px 15px 0px;
}
#basic-box .page-button a:hover {
background-color:#A5CE3A;
border:2px solid #A5CE3A;
}
#basic-box .feature-button a {
font-weight:500;
border-radius:15px 15px 15px 0px;
}
#basic-box .feature-button a:hover {
background-color:#A5CE3A;
border:2px solid #A5CE3A;
}
#framework-footer {
position:relative;
width:100%;
min-height:100px;
background-color:#A5CE3A;
content-visibility:auto;
}
#footer {
width:auto;
min-width:320px;
max-width:1600px;
position:relative;
margin-top:0px;
margin-right:auto;
margin-bottom:0px;
margin-left:auto;
padding:0px;
text-align:left;
font-size:14px;
line-height:20px;
color:#FFFFFF;
}
#footer-box {
padding:2%;
}
#footer ul {
list-style:none;
margin-left:5%;
}
#footer li {
font-size:20px;
line-height:25px;
margin-bottom:15px;
}
#footer li img {
margin:0px;
margin-right:10px;
padding:0px;
}
#footer h5 {
margin:0px;
padding:0px;
padding-bottom:35px;
font-size:45px;
font-weight:900;
line-height:55px;
text-align:left;
text-transform:uppercase;
color:#1D1B17;
}
#footer p {
margin:1%;
line-height:25px;
}
#footer a:active, #footer a:link, #footer a:visited {
color:#1D1B17;
}
#footer a:hover {
color:#D5006E;
}
#footer a:active.reverse, #footer a:link.reverse, #footer a:visited.reverse {
color:#A5CE3A;
}
#footer a:hover.reverse {
color:#D5006E;
}
#footer .testimonial {
font-size:30px;
font-family:"Times New Roman", Times, serif;
margin-left:5px;
margin-right:5px;
}
#footer-icons {
width:385px;
max-width:100%;
height:35px;
margin:auto;
background-color:#040D0C;
}
#footer-icons img {
width:100%;
max-width:25px;
height:auto;
margin-left:auto;
margin-right:auto;
}
#footer-icons div {
float:left;
width:35px;
max-width:35px;
margin-left:15px;
}
#footer-icons div:first-child {
margin-left:0px;
}
#footer-icons div.facebook a:active, #footer-icons div.facebook a:link, #footer-icons div.facebook a:visited {
color:#FFFFFF;
}
#footer-icons div.facebook a:hover {
color:#3B5998;
}
#framework-copyright {
position:relative;
width:100%;
min-height:50px;
background-color:#1D1B17;
z-index:50;
content-visibility:auto;
}
#copyright {
width:auto;
min-width:320px;
max-width:1600px;
position:relative;
margin-top:0px;
margin-right:auto;
margin-bottom:0px;
margin-left:auto;
text-align:center;
color:#FFFFFF;
}
#copyright div {
padding:1%;
}
#copyright a {
color:#FFFFFF;
}
.float-left {
float:left;
}
.float-right {
float:right;
}
.content-clear {
clear:both;
}

/* MENUS============================================================================= */
#menu-buttons {
height:50px;
margin:0;
padding:0;
list-style:none;
float:right;
text-align:left;
color:#FFFFFF;
}
#menu-buttons li {
padding:0;
margin:0;
height:50px;
line-height:50px;
margin-right:15px;
list-style:none;
}
#menu-buttons li a, #menu-buttons li a:visited {
display:block;
text-decoration:none;
height:50px;
color:#A5CE3A;
}
ul#menu-buttons li a:hover {
color:#D5006E;
}
#menu-buttons li {
float:left;
}
#menu-buttons:after {
content:".";
display:block;
height:0;
clear:both;
visibility:hidden;
}
#header-buttons {
height:35px;
line-height:35px;
top:0px;
left:0px;
position:relative;
color:#1D1B17;
}
#header-buttons ul {
width:auto;
list-style:none;
vertical-align:bottom;
}
#header-buttons li {
width:100%;
height:35px;
line-height:35px;
float:left;
text-align:center;
}
#header-buttons li a {
display:block;
text-decoration:none;
padding-left:0.5%;
padding-right:0.5%;
}

#header-buttons li a:active, #header-buttons li a:link, #header-buttons li a:visited {
color:#1D1B17;
}
#header-buttons li a:hover {
background-color:#1D1B17;
color:#FFFFFF;
border-radius:5px 5px 0px 0px;
-moz-border-radius:5px 5px 0px 0px;
-webkit-border-radius:0;
-webkit-border-top-left-radius:5px;
-webkit-border-top-right-radius:5px;
}
ul#dropdown .submenu {
width:520%;
height:auto;
visibility:hidden;
position:relative;
top:0px;
padding:5%;
z-index:2;
background-color:#ECECEC;
border:1px solid #1D1B17;
border-radius:0px 0px 5px 5px;
-moz-border-radius:0px 0px 5px 5px;
-webkit-border-radius:0px 0px 5px 5px;
}
ul#dropdown li:hover>.submenu {
visibility:visible;
opacity:1;
}
ul#dropdown .submenu li {
width:100%;
margin:0px;
font-size:20px;
text-align:left;
height:15px;
line-height:15px;
}
ul#dropdown .submenu li a {
color:#1D1B17;
}
ul#dropdown .submenu li:hover {
width:100%;
margin:0px;
background-color:#1D1B17;
}
ul#dropdown .submenu li a:hover {
background-color:#1D1B17;
color:#D5006E;
}
ul#dropdown .submenu h4 {
margin:1%;
font-size:15px;
font-weight:bold;
color:#1D1B17;
}
ul#dropdown .submenu p a {
display:inline;
font-size:15px;
color:#D5006E;
padding-left:0px;
padding-right:0px;
}
ul#dropdown .submenu p a:hover {
color:#1D1B17;
background-color:transparent;
}
ul#dropdown li:hover>a {
background-color:#1D1B17;
color:#A6CE39;
border-radius:5px 5px 0px 0px;
-moz-border-radius:5px 5px 0px 0px;
-webkit-border-radius:0;
-webkit-border-top-left-radius:5px;
-webkit-border-top-right-radius:5px;
}
ul#dropdown ul li:hover>a {
background-color:#1D1B17;
color:#A6CE39;
}
.submenu-column {
float:left;
overflow:hidden;
}
.submenu-divider {
width:1px;
height:365px;
position:relative;
margin-left:0.3%;
margin-right:0.7%;
float:left;
background-color:#DDDEDE;
border-right:1px solid #003882;
top:10px;
bottom:10px;
}
.submenu-sales {
float:right;
}
.submenu-design {
float:right;
}
.submenu-general {
float:right;
}
.divider {
background-color:#FFFFFF;
background-image:url(/images/bg-title-divider.png);
background-repeat:repeat-x;
background-position:0px 15px;
}

/* FORMS============================================================================= */
input:not([type=submit]):not([type=file]):not([type=radio]):not([type=checkbox]):not([type=image]):not([type=submit]) {
height:45px;
width:96%;
max-width:96%;
margin-top:10px;
margin-bottom:10px;
padding-left:2%;
padding-right:2%;
border:1px solid #D5D5D5;
border:1px solid #E5E5E5;
background-color:#FFFFFF;
border-radius:5px;
-moz-border-radius:5px;
-webkit-border-radius:5px;
-webkit-appearance:none;
font-size:16px;
}
input:not([type=submit]):not([type=file]):not([type=radio]):not([type=checkbox]):not([type=image]):not([type=submit]):hover {
border:1px solid #D5D5D5;
background-color:#F5F5F5;
border-radius:5px;
-moz-border-radius:5px;
-webkit-border-radius:5px;
-webkit-appearance:none;
font-size:16px;
}
textarea {
width:96%;
margin-top:10px;
margin-bottom:10px;
padding-left:2%;
padding-right:2%;
border:1px solid #D5D5D5;
background-color:#FFFFFF;
border-radius:5px;
-moz-border-radius:5px;
-webkit-border-radius:5px;
-webkit-appearance:none;
font-size:16px;
}
textarea:hover {
border:1px solid #D5D5D5;
background-color:#F5F5F5;
border-radius:5px;
-moz-border-radius:5px;
-webkit-border-radius:5px;
-webkit-appearance:none;
font-size:16px;
}
select {
max-width:96%;
height:45px;
margin-top:10px;
margin-bottom:10px;
padding-left:2%;
padding-right:2%;
border:1px solid #D5D5D5;
background-color:#FFFFFF;
border-radius:5px;
-moz-border-radius:5px;
-webkit-border-radius:5px;
font-size:16px;
padding-left:10px;
padding-right:35px;
}
select:hover {
border:1px solid #D5D5D5;
background-color:#F5F5F5;
border-radius:5px;
-moz-border-radius:5px;
-webkit-border-radius:5px;
font-size:16px;
}
.form-details {
padding-left:2%;
height:35px;
line-height:35px;
background-color:#000000;
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:#FFFFFF;
padding:1%;
font-size:14px;
}
.form-fields img {
width:auto;
padding:1%;
}
.form-button {
max-width:100%;
height:50px;
line-height:50px;
padding-left:25px;
padding-right:25px;
background:#A5CE3A;
border:1px solid #A5CE3A;
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 #1D1B17;
background:#1D1B17;
color:#A5CE3A;
}
.page-button {
width:auto;
margin-left:auto;
margin-right:auto;
-webkit-appearance:none;
border-radius:0;
}
.page-button a {
display:inline-block;
height:35px;
line-height:35px;
position:relative;
margin-top:5px;
font-size:15px;
text-align:center;
text-decoration:none;
color:#FFFFFF;
background-color:#A5CE3A;
border:2px solid #A5CE3A;
padding:0px 25px 0px 25px;
-webkit-appearance:none;
border-radius:0;
cursor:pointer;
}
.page-button a:active, .page-button a:link, .page-button a:visited {
color:#FFFFFF !important;
}
.page-button a:hover {
background-color:#D5006E;
border:2px solid #D5006E;
color:#FFFFFF !important;
}
.feature-button {
width:auto;
margin-left:auto;
margin-right:auto;
-webkit-appearance:none;
border-radius:0;
}
.feature-button a {
display:inline-block;
height:35px;
line-height:35px;
position:relative;
margin-top:5px;
background-color:#1D1B17;
border:2px solid #1D1B17;
color:#FFFFFF;
font-size:15px;
text-align:center;
text-decoration:none;
padding:0px 25px 0px 25px;
-webkit-appearance:none;
border-radius:0;
}
.feature-button a:active, .feature-button a:link, .feature-button a:visited {
color:#FFFFFF !important;
}
.feature-button a:hover {
background-color:#D5006E;
border:2px solid #D5006E;
color:#FFFFFF !important;
}
.border-button {
width:auto;
margin-left:auto;
margin-right:auto;
-webkit-appearance:none;
border-radius:0;
}
.border-button a {
display:inline-block;
height:35px;
line-height:35px;
position:relative;
margin-top:5px;
background-color:#FFFFFF;
border:2px solid #D5006E;
color:#D5006E;
font-size:15px;
text-align:center;
text-decoration:none;
padding:0px 25px 0px 25px;
-webkit-appearance:none;
border-radius:0;
}
.border-button a:active, .border-button a:link, .border-button a:visited {
color:#D5006E;
}
.border-button a:hover {
background-color:#D5006E;
border:2px solid #D5006E;
color:#FFFFFF;
}

/* CONTENT ============================================================================= */
.swatches {
font-size:14px;
text-align:center;
}
.swatch {
width:100%;
max-width:140px;
border:1px solid #1D1B17;
border:1px solid #949292;
}
.box-divide {
width:50%;
margin:0px;
padding:0px;
float:left;
}
.box-divide-content {
width:40%;
margin:0px;
padding:5%;
float:left;
}
.box-divide-wide {
width:50%;
margin:0px;
padding:0px;
float:left;
}
.box-content {
position:relative;
width:90%;
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%);
}
.box-position {
position:relative;
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%);
}
.box-form {
background-color:rgba(255,255,255,0.5);
color:#555555;
padding:10%;
border-radius:10px;
}
.box-form a:active, .box-form a:link, .box-form a:visited {
color:#FFFFFF;
}
.box-form a:hover {
color:#1D1B17;
}
.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:#1D1B17;
color:#FFFFFF;
text-align:center;
}
.box-features h2 {
font-family:'Tenor Sans', Helvetica, Verdana, Arial, sans-serif;
font-weight:400;
text-align:center;
color:#FFFFFF;
}
.box-features p {
text-align:center;
}
.box-features img {
width:100%;
max-width:100%;
margin:0px;
padding:0px;
}
#box-questions {
padding:0px;
padding-left:15px;
padding-right:15px;
margin-bottom:15px;
background-color:rgba(255,255,255,0.5);
border:1px solid #FFFFFF;
border-radius:15px;
-moz-border-radius:15px;
-webkit-border-radius:15px;
}
#box-questions a:active, #box-questions a:link, #box-questions a:visited {
color:#D5006E;
}
#box-questions a:hover {
color:#FFFFFF;
}
.box-background {
background-color:#E5E5E5;
background-size:cover;
background-position:left center;
}
.box-text {
background-color:#E5E5E5;
background-color:transparent;
}
.box-plain {
background-color:#FFFFFF;
background-color:rgba(255,255,255,0.80);
}
.box-background .box-plain {
margin:10%;
padding:10%;
}
.box-background .box-plain h4 {
padding-top:0px;
margin-top:0px;
}
.box-plain-padded {
margin:10%;
padding:10%;
background-color:#FFFFFF;
background-color:rgba(255,255,255,0.80);
}
.box-plain-border {
padding-top:10%;
border-top:1px solid #757575;
}
.box-plain h6 {
white-space:normal;
margin:0px;
}
.box-plain-padded p {
font-size:25px;
}
.box-plain span {
font-size:16px;
}
.box-plain .material-icons {
font-size:95px;
}
.box-border {
border:1px solid #C5C5C5;
border-radius:10px;
margin-bottom:5px;
padding:2%;
}
.box-border strong {
font-size:20px;
}
.box-border .symbol {
font-family:Georgia, "Times New Roman", Times, serif;
font-size:35px;
line-height:20px;
vertical-align:middle;
}
.box-logo {
position:relative;
height:100%;
}
.box-logo p {
margin:0;
position:relative;
top:50%;
left:50%;
transform:translate(-50%,-50%);
text-align:center;
}
.box-logo img {
display:block;
width:75%;
max-width:450px;
margin:auto;
}
#content .box-logo img {
display:block;
width:75%;
max-width:450px;
margin:auto;
}
#content-menu {
width:40%;
float:right;
vertical-align:top;
position:relative;
margin-left:25px;
}
#content-menu img {
display:inline;
margin:auto;
}
.content-side-box {
padding:5px;
height:auto;
width:100%;
color:#1D1B17;
background-color:#E7E6E2;
border:1px solid #D7D5D0;
vertical-align:top;
text-align:justify;
margin-bottom:15px;
}
.content-side-box h2 {
background-color:#A5CE3A;
border:1px solid #FFFFFF;
height:auto;
margin:0px;
padding:5px;
color:#1D1B17;
}
.price-box {
border:1px solid #C2C2C2;
padding:5px;
}
.price-box h2 {
background-color:#A5CE3A;
padding:5px;
margin-top:0px;
font-size:19px;
color:#FFFFFF;
}
.price-box .price {
font-size:18px;
color:#323241;
}
.content-main-panel-left {
padding:0px;
margin:0px 1% 0px 1%;
height:auto;
width:100%;
float:left;
background-image:url(images/panel-bg-top.png);
background-repeat:repeat-y;
background-position:center top;
vertical-align:top;
text-align:justify;
}
.content-main-panel-left p {
padding:0px;
margin:0px;
}
.content-main-panel-left-text {
font-size:12px;
padding:0px 25px 0px 25px;
color:#323241;
}
.content-main-panel-left-text ul {
padding:0px 15px 0px 15px;
margin:0px;
list-style-image:url(/images/bullet.png);
}
.content-main-panel-right {
padding:0px;
margin:0px 1% 0px 1%;
height:auto;
width:48%;
float:left;
background-image:url(images/panel-bg-top.png);
background-repeat:repeat-y;
background-position:center top;
vertical-align:top;
text-align:justify;
}
.content-main-panel-right p {
padding:0px;
margin:0px;
}
.content-main-panel-right-text {
font-size:10px;
padding:0px 25px 0px 25px;
color:#323241;
}
.content-main-panel-right-text ul {
padding:0px 15px 0px 15px;
margin:0px;
list-style-image:url(/images/bullet-navy.png);
}
.content-main-panel-bg-entry {
min-height:420px;
padding:0px;
margin:0px;
background-image:url(images/panel-bg.png);
background-repeat:no-repeat;
background-position:center bottom;
vertical-align:bottom;
text-align:justify;
}
.content-main-panel-bg-professional {
min-height:445px;
padding:0px;
margin:0px;
background-image:url(images/panel-bg.png);
background-repeat:no-repeat;
background-position:center bottom;
vertical-align:bottom;
text-align:justify;
}
.content-main-panel-bg-enterprise {
min-height:470px;
padding:0px;
margin:0px;
background-image:url(images/panel-bg-enterprise.png);
background-repeat:no-repeat;
background-position:center bottom;
vertical-align:bottom;
text-align:justify;
}
.content-main-panel-bg-empire {
min-height:510px;
padding:0px;
margin:0px;
background-image:url(images/panel-bg-empire.png);
background-repeat:no-repeat;
background-position:center bottom;
vertical-align:bottom;
text-align:justify;
}
.thumbnail {
height:100%;
position:relative;
}
.thumbnail img {
vertical-align:bottom;
}
.thumbnail .details {
left:0px;
top:0px;
width:100%;
text-align:center;
color:rgb(255, 255, 255);
position:absolute;
min-height:40%;
opacity:0px;
background-color:rgba(31, 180, 221, 1);
-webkit-transition:0.25s ease-in;
-moz-transition:0.25s ease-in;
-o-transition:0.25s ease-in;
transition:0.25s ease-in;
}
.thumbnail:hover .details {
margin-top:0px;
opacity:0.9;
}
.thumbnail .details h3 {
margin:0px auto;
padding:27px 0px 5px;
border:currentColor;
text-align:center;
color:rgb(255, 255, 255);
text-transform:uppercase;
line-height:30px;
letter-spacing:1px;
font-size:28px;
font-weight:300;
}
.thumbnail .details p {
text-align:center;
font-size:18px;
}
.thumbnail .details {
min-height:50%;
}
.button-hover:hover {
background-color:#FFFFFF;
}
.box-highlight {
padding-bottom:2%;
}
.box-highlight ul {
margin-left:15%;
list-style-position:inside;
list-style-image:url('/images/tick-lime-pale.png');
}
.box-highlight li {
padding:1%;
}
.box-border {
border:1px solid #617529;
border-radius:25px 0px 25px 0px;
margin-bottom:5px;
padding:2%;
color:#617529;
}
.box-border p {
line-height:25px;
}
.box-border strong {
font-size:20px;
}
.box-border .material-icons {
vertical-align:middle;
}
.box-border .symbol {
font-family:Georgia, "Times New Roman", Times, serif;
font-size:35px;
line-height:20px;
vertical-align:middle;
}
.box-border .standout {
font-size:25px;
line-height:20px;
}
.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 h3 {
font-size:25px;
line-height:35px;
margin:0px;
padding:0px;
}
.box-testimonial-category {
background-color:#1D1B17;
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 {
padding-right:0px;
}
.box-testimonial .feature-button .material-icons {
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:#1557A3;
}
.testimonial a:hover {
color:#1557A3;
}
.box-testimonial-old {
padding-bottom:2%;
border-bottom:1px solid #DDDEDE;
}
.box-testimonial-old ul {
margin-left:10%;
}
.box-testimonial-old li {
padding:1%;
}
.box-testimonials {
padding:2%;
border:1px solid #DDDEDE;
border-radius:5px 5px 0px 0px;
-moz-border-radius:5px 5px 0px 0px;
-webkit-border-radius:5px 5px 0px 0px;
}
.box-testimonials h2 {
height:125px;
margin-top:0px;
padding-top:0px;
font-size:20px;
font-weight:400;
color:#A5CE3A;
overflow:hidden;
}
.box-testimonials h2 .quote {
font-size:35px;
font-family:"Times New Roman", Times, serif;
line-height:25px;
vertical-align:bottom;
padding-left:5px;
padding-right:5px;
}
.box-testimonials .quote {
font-size:25px;
font-family:"Times New Roman", Times, serif;
line-height:15px;
vertical-align:bottom;
padding-left:5px;
padding-right:5px;
}
.box-testimonials p {
height:205px;
overflow:hidden;
}
.box-clients {
height:65px;
position:relative;
padding:2%;
background-color:#DDDEDE;
border-radius:0px 0px 5px 5px;
-moz-border-radius:0px 0px 5px 5px;
-webkit-border-radius:0px 0px 5px 5px;
}
.box-clients p {
margin:0px;
padding:0px;
margin-left:25%;
}
.box-features {
padding:1.5%;
border:#DDDEDE 1px solid;
}
.box-features h2 {
height:35px;
line-height:35px;
background-color:#1D1B17;
color:#FFFFFF;
font-size:14px;
text-align:center;
overflow:hidden;
}
.box-features a:active, .box-features a:link, .box-features a:visited {
color:#FFFFFF;
}
.box-features a:hover {
color:#EF7C30;
}
.box-features img {
margin-left:auto;
margin-right:auto;
border:#1D1B17 0px solid;
}
.box-navigation {
background-color:#F4F4F4;
padding:5%;
}
.box-navigation ul {
margin-left:15px;
}
.box-shop {
width:auto;
}
.box-shop ul {
list-style:none;
margin:0px;
}
.box-shop li {
margin:1px;
text-align:left;
font-size:11px;
}
.box-shop a {
width:auto;
height:30px;
line-height:30px;
display:block;
padding:0px 5px 0px 5px;
background-color:#FFFFFF;	
}
.box-shop a:active, .box-shop a:link, .box-shop a:visited {
color:#1D1B17;
}
.box-shop a:hover {
background-color:#1D1B17;
color:#FFFFFF;
}
.navigation {
font-weight:bold;
font-size:11px;
}
.photo {
border:#BAC6DC 1px solid;
padding-bottom:5px;
padding-left:5px;
padding-right:5px;
padding-top:5px;
text-align:center;
}
.photo img {
border:1px solid #F45B19;
margin-left:auto;
margin-right:auto;
margin-top:2%;
margin-bottom:2%;
}
.video {
border:#BAC6DC 1px solid;
padding-bottom:10px;
padding-left:10px;
padding-right:10px;
padding-top:10px;
text-align:center;
}
.logo img {
margin:auto;
}
#lightbox {
width:100%;
height:100%;
position:fixed;
z-index:10000;
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:#53565A;
filter:alpha(opacity=65);
opacity:0.65;
}
#lightbox #box-nav {
width:100%;
position:absolute;
z-index:10001;
background-color:#FFFFFF;
top:0px;
left:0px;
}
#lightbox #box-close {
position:absolute;
top:0px;
right:0px;
padding:10px;
}
#lightbox #box {
position:absolute;
width:96%;
max-width:950px;
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%);
padding:2%;
overflow:hidden;
}
#lightbox #box img {
width:auto;
max-width:90%;
height:auto;
max-height:90%;
padding:5px;
position:fixed;
top:52.5%;
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;
}
#lightbox #box-testimonial {
width:96%;
max-width:850px;
position:relative;
margin:0px auto;
padding:2%;
background:#FFFFFF;
overflow:hidden;
}
#lightbox #box-testimonial img {
border:0px solid #A5CE3A;
margin-left:auto;
margin-right:auto;
}
#lightbox .box-testimonials img {
width:auto;
border:0px solid #A5CE3A;
}
#lightbox .box-testimonials h2 {
height:auto;
overflow:visible;
}
#lightbox .box-testimonials p {
height:auto;
overflow:visible;
}
#lightbox .box-clients {
height:auto;
}
#quotes {
font-size:25px;
line-height:45px;
}
#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-featured {
font-size:25px;
font-weight:600;
text-align:center;
}
.title-overview {
font-size:20px;
text-align:center;
}
.title-featuredc {
font-size:16px;
color:#A5CE3A;
}
.title {
color:#FFFFFF;
font-size:12px;
font-weight:bold;
}
.heading {
font-size:12px;
font-weight:bold;
color:#FF9933
}
.textsmall {
font-size:10px;
font-weight:bold;
}
.textcolour {
font-size:12px;
color:#FF9933
}
.texttiny {
font-size:10px;
color:#FFFFFF
}
.facebook {
max-width:100%;
overflow:hidden;
}
.image-box {
position:relative;
width:100%;
}
.image-box-package { 
width:43%;
position:absolute;
padding:10px;
top:0px;
right:0px;
}
.image-box-package p {
text-align:justify;
color:#323241;
font-size:18px;
font-weight:normal;
}
.image-box-home {
position:relative;
width:100%;
}
.image-box-home img {
margin-left:auto;
margin-right:auto;
}
.image-box-left { 
width:25%;
position:absolute;
padding:10px;
top:50px;
left:0px;
text-align:right;
color:#A5CE3A;
font-weight:bold;
}
.image-box-right {
width:25%;
position:absolute;
padding:10px;
top:0px;
right:0px;
text-align:right;
color:#A5CE3A;
font-weight:bold;
}
.hide-mini {
display:inline;
}
.hide-midi {
display:inline;
}
.hide-maxi {
display:none;
}
.hide-all {
display:none;
}

@media only screen and (max-width:1400px) {
/*   MAKE LAYOUT RESPONSIVE at 1400px FOR LAPTOP ================================================================ */
#animation-box h1 {
font-size:5vw;
line-height:65px;
}
#animation-box .animation-standout {
font-size:5vw;
line-height:65px;
}
#animation-box .animation-text {
font-size:3vw;
line-height:45px;
}
#content img {
width:450px;
max-width:100%;
margin-left:1%;
margin-right:1%;
margin-bottom:1%;
}
#quotes {
font-size:2vw;
line-height:40px;
}
.box-testimonials h2 {
height:110px;
}
.box-testimonials p {
height:215px;
}
.box-clients {
height:75px;
}
.box-plain .material-icons {
font-size:7vw;
}
}

@media only screen and (max-width:1200px) {
#footer h5 {
font-size:4vw;
line-height:45px;
}
#footer li {
font-size:16px;
}
}

@media only screen and (max-width:1000px) {
/*   MAKE LAYOUT RESPONSIVE at 1000px FOR LAPTOP ================================================================ */
#animation-box h1 {
font-size:5.5vw;
line-height:60px;
}
#animation-box .animation-standout {
font-size:5.5vw;
line-height:60px;
}
#animation-box .animation-text {
font-size:3.5vw;
line-height:40px;
}
}

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

h1 {
font-size:35px;
font-size:6vw;
}
h2 {
font-size:23px;
font-size:5vw;
line-height:45px;
}
h6 {
font-size:2vw;
}
.title-featured {
font-size:4vw;
}
.title-overview {
font-size:3vw;
}
#circle-profile {
float:none;
margin:0px;
margin-left:auto;
margin-right:auto;
}
#icons-profile {
text-align:center;
}
#framework-logo {
height:125px;
height:0px;
}
#framework-header {
height:95vh;
background-size:cover;
background-position:left bottom;
}
#header-logo {
width:175px;
height:auto;
position:relative;
display:none;
}
#header-buttons {
font-size:14px;
}
#animation-bg {
width:100%;
height:100%;
background-color:rgba(0, 0, 0, 0.5);
}
#animation-box {
text-align:center;
color:#FFFFFF;
}
#animation-box h1 {
font-size:8vw;
line-height:55px;
text-align:center;
text-shadow:unset;
color:#FFFFFF;
}
#animation-box p {
text-align:center;
}
#animation-box .animation-standout {
font-size:8vw;
line-height:55px;
text-shadow:unset;
}
#animation-box .animation-text {
font-size:5vw;
text-shadow:unset;
}
#animation-box .page-button a {
margin-bottom:10px;
}
#menu-buttons {
width:100%;
text-align:center;
}
#menu-buttons li {
width:12.5%;
margin-left:0.5%;
margin-right:0.5%;
}
#menu-buttons li.home {
width:12.5%;
}
#menu-buttons li.profile {
width:12.5%;
}
#menu-buttons li.portfolio {
width:16.5%;
}
#menu-buttons li.testimonials {
width:23.5%;
}
#menu-buttons li.orders {
width:12.5%;
}
#menu-buttons li.contact {
width:16.5%;
}
ul#dropdown .submenu li {
font-size:14px;
}
.submenu-systems {
left:-104%;
}
.submenu-traffic {
left:-208%;
}
.submenu-sales {
left:-312%;
float:left;
}
#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-bg .padding2h {
padding-left:5%;
padding-right:5%;
padding-bottom:5%;
}
#content-bg {
font-size:16px;
}
#content-bg p {
line-height:28px;
}
#content-bg h4 {
font-size:20px;
line-height:20px;
}
#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%;
}
#content-4 .padding2h {
padding-left:5%;
padding-right:5%;
padding-bottom:5%;
}
#content-5 .padding2h {
padding-left:5%;
padding-right:5%;
padding-bottom:5%;
}
#content-6 .padding2h {
padding-left:5%;
padding-right:5%;
padding-bottom:5%;
}
.box-content {
top:0px;
left:0px;
padding:5%;
transform:none;
-ms-transform:none;
-webkit-transform:none;
-moz-transform:none;
-o-transform:none;
}
.box-divide {
width:100%;
margin:0px;
padding:0px;
float:none;
}
.box-divide-content {
width:90%;
margin:0px;
padding:5%;
float:none;
}
.box-divide-wide {
width:100%;
}
.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;
}
.box-logo img {
width:75%;
max-width:75%;
padding-top:5px;
padding-bottom:5px;
}
#content .box-logo img {
width:75%;
max-width:75%;
padding-top:5px;
padding-bottom:5px;
}
#content-1 {
padding-top:50px;
padding-bottom:50px;
}
#content-1 .box-logo img {
width:75%;
max-width:75%;
padding-top:5px;
padding-bottom:5px;
}
#content-2 .box-logo img {
width:75%;
max-width:75%;
padding-top:5px;
padding-bottom:5px;
}
#content-3 {
padding-top:50px;
padding-bottom:50px;
}
#content-3.content-3-trim {
padding-top:0px;
}
#content-3 .box-logo img {
width:75%;
max-width:75%;
padding-top:5px;
padding-bottom:5px;
}
#content-4 {
padding-top:50px;
padding-bottom:50px;
}
#content-4.content-4-trim {
padding-top:0px;
}
#content-4 .box-logo img {
width:75%;
max-width:75%;
padding-top:5px;
padding-bottom:5px;
}
#content-5 {
padding-top:50px;
padding-bottom:50px;
}
#content-5.content-5-trim {
padding-top:0px;
}
#content-5 .box-logo img {
width:75%;
max-width:75%;
padding-top:5px;
padding-bottom:5px;
}
#content-6 {
padding-top:50px;
padding-bottom:50px;
}
#content-6.content-6-trim {
padding-top:0px;
}
#content-6 .box-logo img {
width:75%;
max-width:75%;
padding-top:5px;
padding-bottom:5px;
}
#section-testimonials .span-1-of-3 {
width:49.2%;
}
#section-testimonials .span-1-of-3:nth-child(3n+1) { 
clear:none;
margin-left:1.6%;
}
#section-testimonials .span-1-of-3:nth-child(2n+1) { 
clear:both;
margin-left:0px;
}
.box-testimonials p {
height:335px;
}
#footer h5 {
font-size:6vw;
line-height:45px;
padding-bottom:25px;
}
#footer ul {
margin-left:0px;
}
#footer li {
font-size:18px;
}
#footer li img {
margin:0px;
margin-right:5px;
padding:0px;
}
#footer-box {
padding:3%;
}
#framework-shadow {
display:block;
}
#shadow p {
line-height:45px;
}
#basic-box p {
font-size:5vw;
line-height:50px;
}
#quotes {
font-size:3vw;
line-height:35px;
}
#quotes .symbol {
font-size:55px;
line-height:25px;
}
input:not([type=submit]):not([type=file]):not([type=radio]):not([type=checkbox]):not([type=image]):not([type=submit]) {
width:85%;
}
textarea {
width:85%;
}
.hide-mini {
display:inline;
}
.hide-maxi {
display:inline;
}
.hide-midi {
display:none;
}

}

@media only screen and (min-width:481px) {
#framework-header {
background-image:url(images/bg-home-logo.jpg);
}
}

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

/* CONTENT ============================================================================= */
h1 {
font-size:35px;
font-size:7vw;
}
h2 {
font-size:23px;
font-size:6vw;
line-height:35px;
}
h6 {
font-size:14px;
}
.title-featured {
font-size:5vw;
}
.title-overview {
font-size:4vw;
}
#framework-logo {
height:auto;
}
#header-logo {
width:100%;
height:auto;
margin-left:0px;
display:none;
}
#framework-menu {
height:105px;
}
#menu {
height:75px;
text-align:center;
font-size:15px;
}
#menu-buttons {
width:100%;
height:70px;
text-align:center;
}
#menu-buttons li {
width:32%;
margin-left:0.5%;
margin-right:0.5%;
}
#menu-buttons li.home {
width:32%;
}
#menu-buttons li.profile {
width:32%;
}
#menu-buttons li.portfolio {
width:32%;
}
#menu-buttons li.testimonials {
width:32%;
}
#menu-buttons li.orders {
width:32%;
}
#menu-buttons li.contact {
width:32%;
}
#menu-buttons li:nth-child(3n+1) { 
clear:both;
}
#framework-header {
height:95vh;
background-image:url(images/bg-home-logo-1-mini.jpg);
background-size:cover;
background-position:center center;
}
#header {
width:100%;
}
#header-buttons {
width:100%;
margin-right:0px;
position:relative;
}
#header-buttons li {
width:99%;
height:35px;
margin-left:0.5%;
margin-right:0.5%;
font-size:20px;
line-height:35px;
}
#header-buttons li:nth-child(1n+1) { 
clear:both;
}
ul#dropdown .submenu {
width:94%;
left:0px;
padding:3%;
}
ul#dropdown .submenu li {
height:20px;
line-height:20px;
}
ul#dropdown .submenu p {
line-height:20px;
}
#header-buttons-m {
width:100%;
height:40px;
bottom:0px;
right:0px;
margin-right:0px;
position:relative;
color:#1D1B17;
vertical-align:bottom;
}
#header-buttons-m ul {
width:auto;
list-style:none;
vertical-align:bottom;
}
#header-buttons-m li {
width:99%;
height:35px;
line-height:35px;
margin-left:0.5%;
margin-right:0.5%;
float:left;
text-align:center;
font-size:20px;
}
#header-buttons-m li:nth-child(1n+1) { 
clear:both;
}
#header-buttons-m a {
display:block;
text-decoration:none;
height:35px;
padding-left:0.5%;
padding-right:0.5%;
}
#header-buttons-m a:active, #header-buttons-m a:link, #header-buttons-m a:visited {
color:#1D1B17;
}
#header-buttons-m a:hover {
background-color:#1D1B17;
color:#FFFFFF;
border-radius:5px 5px 0px 0px;
-moz-border-radius:5px 5px 0px 0px;
-webkit-border-radius:0;
-webkit-border-top-left-radius:5px;
-webkit-border-top-right-radius:5px;
}
#header-menu {
background-image:url(/images/button-menu.png);
background-position:90% 50%;
background-repeat:no-repeat;
}
#header-menu:hover {
background-image:url(/images/hover-menu.png);
background-position:90% 50%;
background-repeat:no-repeat;
}
ul#dropdown-m .submenu {
width:98%;
height:auto;
visibility:hidden;
position:relative;
top:0px;
left:0px;
padding:0px 3px 3px;
z-index:2;
background-color:#ECECEC;
border-radius:0 5px 5px 5px;
-moz-border-radius:0 5px 5px 5px;
-webkit-border-radius:0;
-webkit-border-top-right-radius:5px;
-webkit-border-bottom-right-radius:5px;
-webkit-border-bottom-left-radius:5px;
}
#dropdown-m .submenu a {
height:25px;
}
ul#dropdown-m li:hover>.submenu {
visibility:visible;
opacity:1;
}
ul#dropdown-m .submenu li {
width:100%;
height:25px;
margin:0px;
font-size:14px;
text-align:center;
line-height:25px;
}
ul#dropdown-m .submenu li a {
color:#1D1B17;
}
ul#dropdown-m .submenu li:hover {
width:100%;
margin:0px;
background-color:#1D1B17;
}
ul#dropdown-m .submenu li a:hover {
background-color:#1D1B17;
color:#A6CE39;
}
ul#dropdown-m li:hover>a {
background-color:#1D1B17;
color:#A6CE39;
border-radius:5px 5px 0px 0px;
-moz-border-radius:5px 5px 0px 0px;
-webkit-border-radius:0;
-webkit-border-top-left-radius:5px;
-webkit-border-top-right-radius:5px;
}
ul#dropdown-m ul li:hover>a {
background-color:#1D1B17;
color:#A6CE39;
}
#animation-box {
text-align:center;
}
#animation-box h1 {
font-size:10vw;
line-height:50px;
text-align:center;
}
#animation-box p {
text-align:center;
}
#animation-box .animation-standout {
font-size:10vw;
line-height:50px;
}
#animation-box .animation-text {
font-size:6vw;
line-height:45px;
}
#animation-box span.page-button {
width:225px;
max-width:100%;
margin-top:10px;
}
#highlights {
padding-top:50px;
padding-bottom:50px;
}
#content {
padding-top:50px;
padding-bottom:50px;
}
#content .padding2h {
padding-left:10%;
padding-right:10%;
padding-bottom:10%;
}
#content img {
width:100%;
max-width:100%;
margin-left:0px;
margin-right:0px;
margin-bottom:1%;
}
#content-bg .padding2h {
padding-left:10%;
padding-right:10%;
padding-bottom:10%;
}
#content-bg {
font-size:16px;
}
#content-bg p {
line-height:28px;
}
#content-bg h4 {
font-size:20px;
line-height:20px;
}
#content-1 {
padding-top:50px;
padding-bottom:50px;
}
#content-1 .padding2h {
padding-left:10%;
padding-right:10%;
padding-bottom:10%;
}
#content-1 img {
width:100%;
max-width:100%;
margin-left:0px;
margin-right:0px;
margin-bottom:1%;
}
#content-2 .padding2h {
padding-left:10%;
padding-right:10%;
padding-bottom:10%;
}
#content-2 img {
width:100%;
max-width:100%;
margin-left:0px;
margin-right:0px;
margin-bottom:1%;
}
#content-3 {
padding-top:50px;
padding-bottom:50px;
}
#content-3.content-3-trim {
padding-top:0px;
}
#content-3 .padding2h {
padding-left:10%;
padding-right:10%;
padding-bottom:10%;
}
#content-3 img {
width:100%;
max-width:100%;
margin-left:0px;
margin-right:0px;
margin-bottom:1%;
}
#content-4 {
padding-top:50px;
padding-bottom:50px;
}
#content-4.content-4-trim {
padding-top:0px;
}
#content-4 .padding2h {
padding-left:10%;
padding-right:10%;
padding-bottom:10%;
}
#content-4 img {
width:100%;
max-width:100%;
margin-left:0px;
margin-right:0px;
margin-bottom:1%;
}
#content-5 {
padding-top:50px;
padding-bottom:50px;
}
#content-5.content-5-trim {
padding-top:0px;
}
#content-5 .padding2h {
padding-left:10%;
padding-right:10%;
padding-bottom:10%;
}
#content-5 img {
width:100%;
max-width:100%;
margin-left:0px;
margin-right:0px;
margin-bottom:1%;
}
#content-6 {
padding-top:50px;
padding-bottom:50px;
}
#content-6.content-6-trim {
padding-top:0px;
}
#content-6 .padding2h {
padding-left:10%;
padding-right:10%;
padding-bottom:10%;
}
#content-6 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-content {
width:80%;
padding:10%;
}
.box-divide-content {
width:80%;
padding:10%;
}
.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;
}
.box-plain .material-icons {
font-size:20vw;
}
.box-logo img {
padding-top:15px;
padding-bottom:15px;
}
#content .box-logo img {
padding-top:15px;
padding-bottom:15px;
}
#content-1 .box-logo img {
padding-top:15px;
padding-bottom:15px;
}
#content-2 .box-logo img {
padding-top:15px;
padding-bottom:15px;
}
#content-3 .box-logo img {
padding-top:15px;
padding-bottom:15px;
}
#content-4 .box-logo img {
padding-top:15px;
padding-bottom:15px;
}
#content-5 .box-logo img {
padding-top:15px;
padding-bottom:15px;
}
#content-6 .box-logo img {
padding-top:15px;
padding-bottom:15px;
}
#section-testimonials .span-1-of-3 {
width:100%;
}
#section-testimonials .span-1-of-3:nth-child(1n+1) { 
clear:both;
margin-left:0px;
}
.box-testimonial-category {
font-size:18px;
}
.box-testimonial .symbol {
font-size:20px;
line-height:20px;
}
.box-testimonials h2 {
height:auto;
}
.box-testimonials p {
height:auto;
overflow:visible;
}
.box-clients {
height:auto;
margin-bottom:25px;
}
#features {
padding-top:50px;
padding-bottom:50px;
}
#features h5 {
font-size:18px;
}
#logos {
padding-top:50px;
padding-bottom:50px;
}
#logos h5 {
font-size:18px;
}
#testimonials {
padding-top:50px;
padding-bottom:50px;
}
#testimonials p {
text-align:center;
}
#basic {
min-height:65vh;
}
#basic-box p {
font-size:6.5vw;
line-height:45px;
}
#basic-box .page-button a {
width:175px;
}
#basic-box .feature-button a {
width:175px;
}
#footer h5 {
font-size:8vw;
line-height:40px;
padding-bottom:15px;
}
#footer-box {
padding:5%;
}
#quotes {
font-size:4vw;
line-height:30px;
}
#quotes .symbol {
font-size:50px;
line-height:20px;
}
.box-features {
padding:5%;
}
.hide-maxi {
display:inline;
}
.hide-midi {
display:inline;
}
.hide-mini {
display:none;
}
input:not([type=submit]):not([type=file]):not([type=radio]):not([type=checkbox]):not([type=image]):not([type=submit]) {
width:85%;
}
textarea {
width:85%;
}
}