/* 
Main Stylesheet
Created By: Dimbleweb
*/

/* INITIAL CSS */
body {color: #4d4d4f; font-family: 'GeneralFont', Arial, Verdana; font-size: 16px; line-height: 28px; position: relative; background: #fff;}

h1, h2, h3, h4, h5, h6 {font-weight: 100; font-family: 'BoldFont'; color: #4d4d4f;}
h1 strong, h2 strong, h3 strong, h4 strong, h5 strong, h6 strong {font-family: 'BoldFont';}
h1 {font-size: 56px; line-height: 68px; margin-bottom: 15px;}
h2 {font-size: 48px; line-height: 60px; margin-bottom: 15px;}
h3 {font-size: 40px; line-height: 52px; margin-bottom: 15px;}
h4 {font-size: 32px; line-height: 44px; margin-bottom: 15px;}
h5 {font-size: 24px; line-height: 36px; margin-bottom: 15px;}

@media only screen and (max-width: 768px) {
	h1 {font-size: 52px; line-height: 64px;}
	h2 {font-size: 44px; line-height: 56px;}
	h3 {font-size: 36px; line-height: 48px;}
	h4 {font-size: 28px; line-height: 40px;}
	h5 {font-size: 20px; line-height: 32px;}
}

h1 b, h2 b, h3 b, h4 b, h5 b {font-family: 'BoldFont';}
.ft-med-size {font-size: 18px; line-height: 30px; font-weight: 100;}
.ft-regular {font-family: 'GeneralFont', Arial, Verdana;}
.ft-bold-regular2{font-family: 'BoldFont2', Arial, Verdana;}
h1.no-mb, h2.no-mb, h3.no-mb, h4.no-mb {margin-bottom: 0px;}
p, p a {font-size: 16px; color: #4d4d4f; line-height: 24px;}
p.small, p.small a {font-size: 13px; line-height: 17px;}
p a:hover {text-decoration: underline; color: #4cc0b6;}
p.ft-big {font-size: 20px; line-height: 32px;}
a {color: #4cc0b6; font-size: 16px; line-height: 28px; text-decoration: none;
transition: all 0.25s linear; -webkit-transition: all 0.25s linear; -moz-transition: all 0.25s linear; -o-transition: all 0.25s linear;}
a:hover {color: #3d9a92; text-decoration: underline;}
a.pt {cursor: pointer;}
a.no-td:hover {text-decoration: none !important;}
small {font-size: 11px;}

.ft-bold {font-family: 'BoldFont', 'GeneralFont', Arial, Verdana;}

b, strong {font-family: 'BoldFont';}
i, em {font-family: 'GeneralFont' !important; font-style: italic;}
b i, i b, b em, em b, strong i, i strong, strong em, em strong {font-family: 'BoldFont'; font-style: italic;}
small {font-size: 13px; line-height: 18px;}
img.full-width {width: 100%; display: block;}
img.round-border {
border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -o-border-radius: 10px;}

.big {font-size: 20px; line-height: 28px;}

h2.type-2 {margin-bottom: -15px;}

.ta-center {text-align: center;}
.ta-left {text-align: left;}
.ta-right {text-align: right;}
.fl-left {float: left;}
.fl-right {float: right;}
.fl-clear {clear: both;}
.dmb-img-wrap {position: relative; width: 100%; height: 100%; background: transparent;}
.dmb-img-wrap img {position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: auto;}
.dmb-img-wrap-2 {position: relative; width: 100%; height: 100%; background: transparent;}
.dmb-img-wrap-2 img {position: absolute; top:0; bottom: 15%; left: 0; right: 0; margin: auto;}

.ft-title{font-family: 'BoldFont', Arial, Verdana !important;}
.ft-general{font-family: 'GeneralFont', Arial, Verdana !important;}

.cl-white {color: #fff;}
.cl-white a, .cl-white a:hover {color: #fff;}
.cl-white a:hover {text-decoration: underline;}

.gen-img-wrap {margin-bottom: 30px;}
.gen-img-wrap img {max-width: 100%; display: block;}
.gen-img-wrap img.centered {margin-left: auto; margin-right: auto;}
.mlr-auto {margin: 0 auto;}

.col-pd-left {width: 95%; padding-left: 5%;}
.col-pd-right {width: 95%; padding-right: 5%;}
.col-pd-left-2 {width: 97.5%; padding-left: 2.5%;}
.col-pd-right-2 {width: 97.5%; padding-right: 2.5%;}
.col-pd-both {width: 90%; padding-left: 5%; padding-right: 5%;}
.col-pd-both-2 {width: 95%; padding-left: 2.5%; padding-right: 2.5%;}

.cl-second {color: #4cc0b6;}
.cl-third {color: #feb04b;}
.cl-fourth {color: #f44439;}
.cl-fifth {color: #00569f;}

.sfw {float: left; width: 100%; position: relative;}
/* /INITIAL CSS */


/* GENERAL LAYOUT CSS */
.wrap {width: 90%; margin: 0 auto; position: relative;}
.wrap-2 {width: 81.25%; margin: 0 auto; position: relative;}
.wrap-3 {width: 42%; margin: 0 auto; position: relative;}
.wrap-4 {width: 55%; margin: 0 auto; position: relative;}
.wrap-5 {width: 70%; margin: 0 auto; position: relative;}

@media only screen and (max-width: 1200px) {
	.wrap {width: 95%;}
	.wrap-2 {width: 85%;}
	.wrap-3 {width: 50%;}
	.wrap-4 {width: 60%;}
	.wrap-5 {width: 75%;}
}

@media only screen and (max-width: 1024px) {
	.wrap-2 {width: 90%;}
	.wrap-3 {width: 60%;}
	.wrap-4 {width: 70%;}
	.wrap-5 {width: 85%;}
}

@media only screen and (max-width: 768px) {
	.wrap-2, .wrap-5 {width: 95%;}
	.wrap-3 {width: 75%;}
	.wrap-4 {width: 85%;}
}


@media only screen and (max-width: 480px) {
	.wrap-3, .wrap-4 {width: 95%;}
}


.container {width: 100%; float: left;}
.section {clear: both; padding: 0px; margin: 0px;}
.group:before, .group:after {content: ""; display: table;}
.group:after {clear: both;}
.group {zoom:1; /* For IE 6/7 (trigger hasLayout) */}

.dmb-col {display: block; float: left; margin: 0% 0 0% 1.6%; position: relative;}
.dmb-col.first-col {margin-left: 0;}
.dmb-col:first-child {margin-left: 0;} /* all browsers except IE6 and lower */

@media only screen and (max-width: 480px) {
	.dmb-col {margin: 0;}
	.dmb-col.mbtm40 {margin-bottom: 40px;}
	.dmb-col.mbtm30 {margin-bottom: 30px;}
	.dmb-col.mbtm20 {margin-bottom: 20px;}
	.dmb-col.mbtm10 {margin-bottom: 10px;}
	.dmb-col.no-m {margin: 0;}
}

.cl-brown {color: #5c3d38 !important;}
.cl-white {color: #fff !important;}
.cl-green {color: #177c0a !important;}
.cl-gray {color: #555 !important;}
.cl-black {color: #030708 !important;}
/* /GENERAL LAYOUT CSS */


/* TWO COLUMNS CSS */
.span_1_of_2 {width: 49.2%;}
.span_2_of_2 {width: 100%;}
@media only screen and (max-width: 480px) {
	.span_2_of_2, .span_1_of_2 {width: 100%;}
}
/* /TWO COLUMNS CSS */


/* THREE COLUMNS CSS */
.span_3_of_3 {width: 100%;}
.span_2_of_3 {width: 66.13%;}
.span_1_of_3 {width: 32.26%;}
@media only screen and (max-width: 480px) {
	.span_3_of_3, .span_2_of_3, .span_1_of_3 {width: 100%;}
}
/* /THREE COLUMNS CSS */


/* FOUR COLUMNS CSS */
.span_4_of_4 {width: 100%;}
.span_3_of_4 {width: 74.6%;}
.span_2_of_4 {width: 49.2%;}
.span_1_of_4 {width: 23.8%;}
@media only screen and (max-width: 480px) {
	.span_4_of_4, .span_3_of_4, .span_2_of_4, .span_1_of_4 {width: 100%;}
}
/* /FOUR COLUMNS CSS */


/* FIVE COLUMNS CSS */
.span_5_of_5 {width: 100%;}
.span_4_of_5 {width: 79.68%;}
.span_3_of_5 {width: 59.36%;}
.span_2_of_5 {width: 39.04%;}
.span_1_of_5 {width: 18.72%;}
@media only screen and (max-width: 480px) {
	.span_5_of_5, .span_4_of_5, .span_3_of_5, .span_2_of_5, .span_1_of_5 {width: 100%;}
}
/* /FIVE COLUMNS CSS */


/* SIX COLUMNS CSS */
.span_6_of_6 {width: 100%;}
.span_5_of_6 {width: 83.06%;}
.span_4_of_6 {width: 66.13%;}
.span_3_of_6 {width: 49.2%;}
.span_2_of_6 {width: 32.26%;}
.span_1_of_6 {width: 15.33%;}
@media only screen and (max-width: 480px) {
	.span_6_of_6, .span_5_of_6, .span_4_of_6, .span_3_of_6, .span_2_of_6, .span_1_of_6 {width: 100%;}
}
/* /SIX COLUMNS CSS */


/* SEVEN COLUMNS CSS */
.span_7_of_7 {width: 100%;}
.span_6_of_7 {width: 85.48%;}
.span_5_of_7 {width: 70.97%;}
.span_4_of_7 {width: 56.45%;}
.span_3_of_7 {width: 41.94%;}
.span_2_of_7 {width: 27.42%;}
.span_1_of_7 {width: 12.91%;}
@media only screen and (max-width: 480px) {
	.span_7_of_7, .span_6_of_7, .span_5_of_7, .span_4_of_7, .span_3_of_7, .span_2_of_7, .span_1_of_7 {width: 100%;}
}
/* /SEVEN COLUMNS CSS */


/* EIGHT COLUMNS CSS */
.span_8_of_8 {width: 100%;}
.span_7_of_8 {width: 87.3%;}
.span_6_of_8 {width: 74.6%;}
.span_5_of_8 {width: 61.9%;}
.span_4_of_8 {width: 49.2%;}
.span_3_of_8 {width: 36.5%;}
.span_2_of_8 {width: 23.8%;}
.span_1_of_8 {width: 11.1%;}
@media only screen and (max-width: 480px) {
	.span_8_of_8, .span_7_of_8, .span_6_of_8, .span_5_of_8, .span_4_of_8, .span_3_of_8, .span_2_of_8, .span_1_of_8 {width: 100%;}
}
/* /EIGHT COLUMNS CSS */


/* NINE COLUMNS CSS */
.span_9_of_9 {width: 100%;}
.span_8_of_9 {width: 88.71%;}
.span_7_of_9 {width: 77.42%;}
.span_6_of_9 {width: 66.13%;}
.span_5_of_9 {width: 54.84%;}
.span_4_of_9 {width: 43.55%;}
.span_3_of_9 {width: 32.26%;}
.span_2_of_9 {width: 20.97%;}
.span_1_of_9 {width: 9.68%;}
@media only screen and (max-width: 480px) {
	.span_9_of_9, .span_8_of_9, .span_7_of_9, .span_6_of_9, .span_5_of_9, .span_4_of_9, .span_3_of_9, .span_2_of_9 , .span_1_of_9 {width: 100%;}
}
/* /NONE COLUMNS CSS */


/* TEN COLUMNS CSS */
.span_10_of_10 {	width: 100%;}
.span_9_of_10 {width: 89.84%;}
.span_8_of_10 {width: 79.68%;}
.span_7_of_10 {width: 69.52%;}
.span_6_of_10 {width: 59.36%;}
.span_5_of_10 {width: 49.2%;}
.span_4_of_10 {width: 39.04%;}
.span_3_of_10 {width: 28.88%;}
.span_2_of_10 {width: 18.72%;}
.span_1_of_10 {width: 8.56%;}
@media only screen and (max-width: 480px) {
	.span_10_of_10, .span_9_of_10, .span_8_of_10, .span_7_of_10, .span_6_of_10, .span_5_of_10, 
	.span_4_of_10, .span_3_of_10 , .span_2_of_10, .span_1_of_10 {width: 100%;}
}
/* /TEN COLUMNS CSS */


/* ELEVEN COLUMNS CSS */
.span_11_of_11 {width: 100%;}
.span_10_of_11 {width: 90.76%;}
.span_9_of_11 {width: 81.52%;}
.span_8_of_11 {width: 72.29%;}
.span_7_of_11 {width: 63.05%;}
.span_6_of_11 {width: 53.81%;}
.span_5_of_11 {width: 44.58%;}
.span_4_of_11 {width: 35.34%;}
.span_3_of_11 {width: 26.1%;}
.span_2_of_11 {width: 16.87%;}
.span_1_of_11 {width: 7.63%;}
@media only screen and (max-width: 480px) {
	.span_11_of_11, .span_10_of_11, .span_9_of_11, .span_8_of_11, .span_7_of_11, .span_6_of_11, 
	.span_5_of_11, .span_4_of_11 , .span_3_of_11, .span_2_of_11, .span_1_of_11 {width: 100%;}
}
/* /ELEVEN COLUMNS CSS */


/* TWELVE COLUMNS CSS */
.span_12_of_12 {width: 100%;}
.span_11_of_12 {width: 91.53%;}
.span_10_of_12 {width: 83.06%;}
.span_9_of_12 {width: 74.6%;}
.span_8_of_12 {width: 66.13%;}
.span_7_of_12 {width: 57.66%;}
.span_6_of_12 {width: 49.2%;}
.span_5_of_12 {width: 40.73%;}
.span_4_of_12 {width: 32.26%;}
.span_3_of_12 {width: 23.8%;}
.span_2_of_12 {width: 15.33%;}
.span_1_of_12 {width: 6.86%;}
@media only screen and (max-width: 480px) {
	.span_12_of_12, .span_11_of_12, .span_10_of_12, .span_9_of_12, .span_8_of_12, .span_7_of_12, 
	.span_6_of_12, .span_5_of_12 , .span_4_of_12, .span_3_of_12, .span_2_of_12, .span_1_of_12 {width: 100%;}
}
/* /TWELVE COLUMNS CSS */

/* WYSIWYG CONTENT */
.wysiwyg-content, .wysiwyg-content p, .wysiwyg-content a, .wysiwyg-content ul li, .wysiwyg-content ol li {font-size: 16px; color: #4d4d4f; line-height: 28px; font-family: 'GeneralFont', Arial, Verdana;}
.wysiwyg-content.big, .wysiwyg-content.big p, .wysiwyg-content.big a, .wysiwyg-content.big ul li, .wysiwyg-content.big ol li {font-size: 17px; line-height: 25px;}
.wysiwyg-content.white, .wysiwyg-content.white p, .wysiwyg-content.white a, .wysiwyg-content.white ul li, .wysiwyg-content.white ol li {color: #fff;}
.wysiwyg-content a {color: #888;}
.wysiwyg-content a:hover {color: #0d4e9f; text-decoration: underline;}
.wysiwyg-content.white a {color: #fff;}
.wysiwyg-content.white a:hover {color: #fff;}
.wysiwyg-content.white h1, .wysiwyg-content.white h2, .wysiwyg-content.white h3, .wysiwyg-content.white h4, .wysiwyg-content.white h5 {color: #fff;}
.wysiwyg-content ul li {padding-left: 0px; list-style-type: disc; padding-bottom: 3px; margin-left: 55px;}
.wysiwyg-content ol li {list-style-type: decimal; margin-left: 55px;}
.wysiwyg-content.list-flat ol li {margin-left: 15px;}

.wysiwyg-content img.feat-img {float: left; max-width: 50%; margin-right: 20px; margin-bottom: 20px;}
.wysiwyg-content img {max-width: 100% !important;}

.wysiwyg-content table tbody tr {border-bottom: 1px solid #ddd;}
.wysiwyg-content table tbody tr:first-child {border-top: 1px solid #ddd;}
.wysiwyg-content table tbody tr td {border-right: 1px solid #ddd; padding: 5px 8px; vertical-align: middle;} 
.wysiwyg-content table tbody tr td:first-child {border-left: 1px solid #ddd;}
.wysiwyg-content table.fr-alternate-rows tr:nth-child(odd) td {background: #fff;}
.wysiwyg-content table.fr-alternate-rows tr:nth-child(even) td {background: #f5f5f5;}

.wysiwyg-content .wy-left-small {float: left; width: 23%;}
.wysiwyg-content .wy-left-small img {max-width: 100%; margin: 0 auto; display: block;}
.wysiwyg-content .wy-right-large {float: right; width: 74%;}
/* /WYSIWYG CONTENT */

/* FORM */
label.error {display: block; margin-top: 5px; font-size: 15px; line-height: 23px; color: #f21a1a; font-family: 'SpecialFont'; margin-bottom: 8px;}
.gen-form {}
.gen-form .req {color: #f55151;}
.gen-form-row {width: 100%; float: left; margin-bottom: 16px; position: relative;}
.gen-form-row.half {width: 49%; margin-right: 2%;}
.gen-form-row.half.no-mr {margin-right: 0;}
.gen-form-row.no-mb {margin-bottom: 0 !important;}
.gen-form label.form-label{color: #333; display: block; font-family: 'GeneralFont'; font-size: 16px; line-height: 22px; margin-bottom: 10px;}
.gen-form label.form-label span {color: #b3b3b3;}
.gen-form label.form-label.inline {display: inline; margin: 0;}
.gen-form input[type="text"], .gen-form input[type="email"], .gen-form input[type="password"], .gen-form textarea, ul#sc-content-list .prod-detail input[type="text"] {background: #ffffff; border: none; font-family: 'GeneralFont', Arial, Verdana; color: #4d4d4f; width: 65%; font-size: 16px; line-height: 22px; padding: 12px 22px; box-sizing: border-box;
transition: all 0.25s ease-in; -webkit-transition: all 0.25s ease-in; -moz-transition: all 0.25s ease-in; -o-transition: all 0.25s ease-in;}
.gen-form input[type="text"]:hover, .gen-form input[type="text"]:focus, .gen-form input[type="email"]:hover, .gen-form input[type="email"]:focus, .gen-form input[type="password"]:hover, .gen-form input[type="password"]:focus, .gen-form textarea:hover, .gen-form textarea:focus {outline: 0;
box-shadow: 0px 0px 8px #feb04b; -webkit-box-shadow: 0px 0px 8px #feb04b; -moz-box-shadow: 0px 0px 8px #feb04b; -o-box-shadow: 0px 0px 8px #feb04b;}
.gen-form input[type="text"].readonly, .gen-form input[type="email"].readonly, .gen-form input[type="password"].readonly, .gen-form textarea.readonly {background: #dfdfdf;}
a.gen-btn {display: inline-block;}
a.gen-btn.round {
border-radius: 30px; -webkit-border-radius: 30px; -moz-border-radius: 30px; -o-border-radius: 30px;}
a.gen-btn.block {display: block; font-size: 14px; letter-spacing: 2px;}
.gen-btn.na, .gen-btn.na :hover {background: #383838; color: #fff; cursor: default;}
.gen-form input[type="submit"], .gen-form input[type="button"], a.gen-btn {border: none; background: #feb04b; text-align: center; color: #fff; font-size: 18px; line-height: 18px; font-family: 'SpecialFont', Arial, Verdana; cursor: pointer; padding: 15px 25px;
transition: all 0.2s linear; -moz-transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -o-transition: all 0.2s linear;}
.gen-form input[type="submit"] {min-width: 180px;}
.gen-form input[type="submit"]:hover, .gen-form input[type="button"]:hover, a.gen-btn:hover, 
.gen-form input[type="submit"]:focus, .gen-form input[type="button"]:focus, a.gen-btn:focus {color: #fff; background: #f99b20; text-decoration: none; outline: 0;}
.gen-form input[type="submit"].wide, a.gen-btn.wide {min-width: 250px;}
.gen-form input[type="submit"].half-wide, a.gen-btn.half-wide, .gen-form input[type="button"].half-wide {min-width: 150px;}
.gen-form input[type="button"].gray {background: #b5b5b5;}
.gen-form input[type="submit"].full-width {width: 100%;}
input[type="submit"].calendar-submit {width: 50%; padding-top: 15px; padding-bottom: 15px;}
.gen-form span.help-block {display: block; font-size: 14px; line-height: 18px; color: #000000; margin-top: 3px;}
a.hollow-btn {display: inline-block; border: 2px solid #fff; padding: 12px 25px; background: transparent; font-size: 18px; line-height: 24px; font-family: 'BoldFont'; color: #fff;}
a.hollow-btn:hover {text-decoration: none; background: #fff; color: #4cc0b6;}
.gen-form-row .inner {padding: 10px 22px;}

a.gen-btn {min-width: 100px;}
a.gen-btn.small {padding: 15px 25px;}
a.gen-btn.blue {background: #4cc0b6;}
a.gen-btn.blue:hover {background: #3d9a92;}
a.gen-btn.orange {background: #feb04b;}
a.gen-btn.orange:hover {background: #f99b20;}

.checkbox-container {}
.checkbox-container input[type="checkbox"] {display: none;}
.checkbox-container label {font-family: 'GeneralFont'; font-size: 14px; line-height: 18px; padding-top: 4px; color: #000000; display: inline-block; padding-left: 28px; background: url(../images/icon/checkbox.png) no-repeat left top;}
.checkbox-container label:hover {cursor: pointer;}
.checkbox-container label.no-mr {margin-right: 0;}
.checkbox-container label a {color: #3d9a92; font-size: 16px; line-height: 24px;}
.checkbox-container label a:hover {text-decoration: none;}
.checkbox-container .chb-section {float: left; width: 30%; margin-right: 5%; margin-bottom: 5px;}
.checkbox-container .chb-section:nth-child(3n) {margin-right: 0;}
.checkbox-container .chb-section:nth-child(3n + 1) {clear: both;}

.checkbox-container input[type="checkbox"]:checked + label {background: url(../images/icon/checkbox-checked.png) no-repeat left top;}
::-webkit-input-placeholder { color: #939598; font-family: 'GeneralFont';}
::-moz-placeholder { color: #939598; opacity: 1.0; font-family: 'GeneralFont';}
:-ms-input-placeholder { color: #939598; font-family: 'GeneralFont';}

.gen-form-row span.req {color: #ff3333;}

.gen-form select {font-size: 14px; line-height: 18px; font-family: 'GeneralFont', Arial, Verdana; color: #4d4d4f; background: white; padding: 12px 3%; box-sizing: border-box; border: 1px solid #4d4d4f;}
.styled-select-wrapper {width: 100%; box-sizing: border-box; overflow: hidden; border: 1px solid transparent; background: url(../images/icon/arrow-down.png) no-repeat 98% center #fff;}
.styled-select-wrapper select {display: block; width: 110%; border: none; background: transparent;}
.styled-select-wrapper select option {background: #f1f2f2;}
textarea.no-resize {resize: none !important;}
select:hover, select:focus {outline: 0;
box-shadow: 0px 0px 8px #feb04b; -webkit-box-shadow: 0px 0px 8px #feb04b; -moz-box-shadow: 0px 0px 8px #feb04b; -o-box-shadow: 0px 0px 8px #feb04b;}

.radio-toolbar {margin-top: 11px;}
.radio-toolbar input[type="radio"] {display:none;}
.radio-toolbar label {display:inline-block; padding: 0px 0px 0px 25px; font-size: 16px; line-height: 30px; font-family: 'GeneralFont', Arial, Verdana; background: url(../images/icon/radio-off.png) no-repeat left top 9px; cursor: pointer;}
.radio-toolbar label.inline.with-mr {margin-right: 40px;}
.radio-toolbar label.type2 {color: #0d4e9f;}
.radio-toolbar input[type="radio"]:checked + label {background: url(../images/icon/radio-on.png) no-repeat left top 9px;}

.input-file-wrap input[type="file"] {display: none;}
.input-file-wrap span {font-size: 14px; line-height: 18px;}
.input-file-wrap-info {font-size: 16px; line-height: 22px; color: #4d4d4f; font-family: 'GeneralFont'; box-sizing: border-box; padding: 12px 22px; padding-right: 100px; background: #fff; z-index: 1000;
transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; -o-transition: all 0.2s linear;}
.input-file-wrap-info:hover {box-shadow: 0px 0px 8px #feb04b; -webkit-box-shadow: 0px 0px 8px #feb04b; -moz-box-shadow: 0px 0px 8px #feb04b; -o-box-shadow: 0px 0px 8px #feb04b;}
.input-file-wrap {display: inline-block; cursor: pointer; font-family: 'SpecialFont'; color: #fff; font-size: 16px; line-height: 22px; background: #feb04b; padding: 12px 22px; min-width: 60px; text-align: center;
transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; -o-transition: all 0.2s linear;}
.input-file-wrap:hover {background: #f99b20;}

/* INLINE STYLE */
.gen-form.inline .label-cont {float: left; width: 20%;}
.gen-form.inline .sep-cont {float: left; width: 2%;}
.gen-form.inline .form-cont {float: left; width: 78%;}
.gen-form.inline .form-cont .fl-section {float: left; margin-right: 100px;}
.gen-form.inline .form-cont .fl-section.last {margin-right: 0;}
.gen-form.inline .gen-form-row {margin-bottom: 20px;}
.gen-form.inline label.form-label {font-size: 16px; line-height: 21px; display: block; padding-top: 15px;}
.gen-form.inline label.form-label.label-big {font-size: 16px; line-height: 40px; font-family: 'ItalicTitleFont';}
.gen-form.inline label.error {margin-bottom: 8px; margin-top: 5px;}
.gen-form.inline select {min-width: 70%;}
.gen-form.inline input[type="text"], .gen-form.inline input[type="password"], .gen-form.inline textarea {width: 70%;}
.gen-form.inline input.small {width: 30%;}

.gen-form.inline input[type="text"], .gen-form.inline input[type="email"], .gen-form.inline input[type="password"] {border: none; border-bottom: 1px solid #4d4d4f; background: none; margin-top: 3px;
border-radius: 0; -webkit-border-radius: 0; -moz-border-radius: 0; -o-border-radius: 0;}
.gen-form.inline input[type="text"]:hover, .gen-form.inline input[type="text"]:focus, .gen-form.inline input[type="email"]:hover, .gen-form.inline input[type="email"]:focus,
.gen-form.inline input[type="password"]:hover, .gen-form.inline input[type="password"]:focus {
box-shadow: none; -webkit-box-shadow: none; -moz-box-shadow: none; -o-box-shadow: none;}
/* /INLINE STYLE */


@media only screen and (max-width: 480px) {
	.gen-form-row.half {width: 100%; margin-right: 0;}
	.radio-toolbar label {background: url(../images/icon/radio-off.png) no-repeat left top 7px;}
	.radio-toolbar input[type="radio"]:checked + label {background: url(../images/icon/radio-on.png) no-repeat left top 7px;}
	
	.gen-form input[type="text"], .gen-form input[type="email"], .gen-form input[type="password"], .gen-form textarea, ul#sc-content-list .prod-detail input[type="text"] {padding-left: 15px; padding-right: 15px; font-size: 14px;}
}

/* /FORM */


/* HEADER */
#header {position: absolute; top: 0; z-index: 1000;
transition: all 0.25s linear; -webkit-transition: all 0.25s linear; -moz-transition: all 0.25s linear; -o-transition: all 0.25s linear;}
#header.sticky {position: fixed; background: #fff; padding-bottom: 5px;
box-shadow: 0px 0px 5px #afafaf; -webkit-box-shadow: 0px 0px 5px #afafaf; -moz-box-shadow: 0px 0px 5px #afafaf; -o-box-shadow: 0px 0px 5px #afafaf;}
#nav-resp-container {display: none;}
#nav-resp-list-container {display: none;}

#logo-container {float: left; margin-top: 10px;}
#logo-container.sticky {margin-top: 8px;}
img#logo {height: 70px;
transition: all 0.25s linear; -webkit-transition: all 0.25s linear; -moz-transition: all 0.25s linear; -o-transition: all 0.25s linear;}
img#logo.sticky {height: 55px;}

#nav-container-2 {float: left; margin-top: 20px; margin-left: 25px; padding-left: 25px; height: 60px; border-left: 3px solid #4cc0b6;}
#nav-container-2.sticky {height: 45px;}
#nav-bottom-list-container {float: right; display: none;}
ul.nav-bottom-list {margin-top: 17px;}
ul.nav-bottom-list.sticky {margin-top: 8px;}
ul.nav-bottom-list > li {float: left; margin-right: 35px;}
ul.nav-bottom-list > li:last-child {margin-right: 0;}
ul.nav-bottom-list > li > a {font-family: 'SpecialFont'; font-size: 15px; line-height: 23px; color: #4d4d4f;}
ul.nav-bottom-list.sticky > li > a {font-size: 14px; line-height: 20px;}
ul.nav-bottom-list > li > a:hover {color: #00569f; text-decoration: none;}
ul.nav-bottom-list > li > a.active, ul#nav-bottom-list > li > a.active:hover {color: #00569f; text-decoration: none;}

#nav-container {float: right; margin-top: 20px;}
#nav-container.sticky {margin-top: 20px;}
#nav-top-list-container {float: right; margin-bottom: 28px;}
#nav-top-list-container.sticky {margin-bottom: 5px;}
ul#nav-top-list {}
ul#nav-top-list > li {float: left;}
ul#nav-top-list > li > a {display: inline-block; font-family: 'SpecialFont'; font-size: 14px; line-height: 22px;}
ul#nav-top-list.sticky > li > a {font-size: 14px; line-height: 20px;}
ul#nav-top-list > li > a:hover {text-decoration: underline;}
ul#nav-top-list > li > a#nt-login {padding: 15px 35px 15px 65px; background: url(../images/icon/hnav-login.png) no-repeat 35px center #fff; color: #4cc0b6;}
ul#nav-top-list > li > a#nt-register {padding: 15px 35px 15px 85px; background: url(../images/icon/hnav-boc.png) no-repeat 35px center #4cc0b6; color: #fff;}

ul#nav-top-list > li > a#nt-my-account {padding: 15px 35px 15px 65px; background: url(../images/icon/hnav-login.png) no-repeat 35px center #fff; color: #4cc0b6;}
ul#nav-top-list > li > a#nt-my-progress {padding: 15px 15px 15px 60px; background: url(../images/icon/hnav-progress.png) no-repeat 25px center #4cc0b6; color: #fff;}
ul#nav-top-list > li > a#nt-my-report {padding: 15px 15px 15px 65px; background: url(../images/icon/hnav-report.png) no-repeat 30px center #4cc0b6; color: #fff;}
ul#nav-top-list > li > a#nt-my-feedback {padding: 15px 30px 15px 58px; background: url(../images/icon/hnav-feedback.png) no-repeat 20px center #4cc0b6; color: #fff;}

ul#nav-top-list.sticky > li > a#nt-login {padding: 7px 17px 6px 40px; background-position: 15px center; background-size: auto 15px;}
ul#nav-top-list.sticky > li > a#nt-register {padding: 7px 17px 6px 50px; background-position: 15px center; background-size: auto 15px;}

ul#nav-top-list.sticky > li > a#nt-my-account {padding: 7px 17px 6px 40px; background-position: 15px center; background-size: auto 15px;}
ul#nav-top-list.sticky > li > a#nt-my-progress {padding: 7px 8px 6px 50px; background-position: 15px center; background-size: auto 15px;}
ul#nav-top-list.sticky > li > a#nt-my-report {padding: 7px 8px 6px 40px; background-position: 15px center; background-size: auto 15px;}
ul#nav-top-list.sticky > li > a#nt-my-feedback {padding: 7px 15px 6px 40px; background-position: 15px center; background-size: auto 15px;}

@media only screen and (max-width: 1200px) {
	#nav-container-2 {display: none;}
	#nav-container, #nav-container.sticky {margin-top: 0;}
	#nav-bottom-list-container {display: block;}
	#nav-top-list-container {margin-bottom: 10px;}
	ul.nav-bottom-list, ul.nav-bottom-list.sticky {margin-top: 0;}
	
	ul.nav-bottom-list > li > a {font-size: 14px;}
	ul#nav-top-list.sticky > li > a, ul.nav-bottom-list.sticky > li > a {font-size: 13px;}
}

@media only screen and (max-width: 1024px) {
	#header {position: fixed; background: #fff; padding-bottom: 5px;
	box-shadow: 0px 0px 5px #afafaf; -webkit-box-shadow: 0px 0px 5px #afafaf; -moz-box-shadow: 0px 0px 5px #afafaf; -o-box-shadow: 0px 0px 5px #afafaf;}
	#logo-container {margin-top: 8px;}
	img#logo {height: 55px;}
	
	#nav-top-list-container {margin-bottom: 5px;}
	ul#nav-top-list > li > a {font-size: 13px; line-height: 21px;}
	ul#nav-top-list > li > a#nt-login {padding: 7px 17px 6px 40px; background-position: 15px center; background-size: auto 15px;}
	ul#nav-top-list > li > a#nt-register {padding: 7px 17px 6px 50px; background-position: 15px center; background-size: auto 15px;}
	
	ul#nav-top-list > li > a#nt-my-account {padding: 7px 17px 6px 40px; background-position: 15px center; background-size: auto 15px;}
	ul#nav-top-list > li > a#nt-my-progress {padding: 7px 8px 6px 50px; background-position: 15px center; background-size: auto 15px;}
	ul#nav-top-list > li > a#nt-my-report {padding: 7px 8px 6px 40px; background-position: 15px center; background-size: auto 15px;}
	ul#nav-top-list > li > a#nt-my-feedback {padding: 7px 15px 6px 40px; background-position: 15px center; background-size: auto 15px;}
	
	ul#nav-bottom-list > li > a {font-size: 13px; line-height: 21px;}
}

@media only screen and (max-width: 768px) {
	img#logo, img#logo.sticky {height: 50px;}
	#nav-container {display: none;}
	#nav-resp-container {display: block; width: 30px; height: 30px; background: url(../images/icon/nav.png) no-repeat center; position: absolute; right: 0; top: 50%; transform: translateY(-50%); cursor: pointer;
	transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; -o-transition: all 0.2s linear;}
	#nav-resp-container:hover {background: url(../images/icon/nav-hover.png) no-repeat center;}
	#nav-resp-container.opened {background: url(../images/icon/nav-close.png) no-repeat center;}
	#nav-resp-container.opened:hover {background: url(../images/icon/nav-close-hover.png) no-repeat center;}
	
	#nav-resp-list-container {position: fixed; top: 70px; z-index: 900; width: 100%;}
	ul#nav-resp-list {width: 100%;}
	ul#nav-resp-list > li > a {display: block; font-size: 14px; line-height: 22px; background: #4cc0b6; box-sizing: border-box; padding: 7px 2.5%; color: #fff; font-family: 'SpecialFont', Arial, Verdana; cursor: pointer;}
	ul#nav-resp-list > li > a:hover {background: #3d9a92; text-decoration: none;}
	
	.subnav-resp-container {display: none;}
	ul.subnav-resp-list > li > a {display: block; font-size: 14px; line-height: 22px; background: #4cc0b6; box-sizing: border-box; padding: 5px 7.5%; color: #fff; font-family: 'SpecialFont', Arial, Verdana; cursor: pointer;}
	ul.subnav-resp-list > li > a:hover {background: #3d9a92; text-decoration: none;}
}
/* /HEADER */


/* HOME */
#home-slideshow-sfw {}
#slideshow-list-container .slideshow-item {width: 100%; height: 100vh; background-size: cover !important; position: relative;}
#slideshow-list-container .slideshow-item .caption {position: absolute; top: 65%; left: 15%; transform: translateY(-65%); width: 50%;}
#slideshow-list-container .slideshow-item .img-wrap img {display: none !important;}
#slideshow-list-container .slick-dots {position: absolute; bottom: 20px; z-index: 500; transform: translateX(-50%); left: 50%; min-width: 50%;}
#slideshow-list-container .slick-dots li {width: 51px; margin: 0 15px;}
#slideshow-list-container .slick-dots li button {width: 51px; height: 5px; background: url(../images/icon/bullet.png) no-repeat center;}
#slideshow-list-container .slick-dots li.slick-active button {background: url(../images/icon/bullet-active.png) no-repeat center;}

#home-hello-sfw {padding: 95px 0; background: #feb04b;}
#home-hello-sfw .wysiwyg-content {padding-left: 120px;}

#home-team-sfw {padding: 95px 0 25px; background: #f44439;}
#home-team-sfw h2 {text-align: right; padding-right: 180px;}
#home-team-sfw > img {position: absolute; top: -149px; right: 50px; height: 299px;}
ul.team-list {float: left; width: 100%; position: relative; margin-top: 30px;}
ul.team-list > li {float: left; width: 16%; margin-right: 12%; margin-bottom: 70px;}
ul.team-list > li:nth-child(4n) {margin-right: 0;}
ul.team-list > li:nth-child(4n + 1) {clear: both;}
ul.team-list > li .img-wrap {margin-bottom: 20px;}
ul.team-list > li .img-wrap img {display: block; width: 100%;}
ul.team-list > li .description {text-align: right;}
ul.team-list > li .description p {color: #fff;}
ul.team-list > li .description p.name {font-size: 20px; line-height: 24px; font-family: 'BoldFont';}
ul.team-list > li .description p.position {font-size: 14px; line-height: 18px; font-family: 'LightItalicFont';}
ul.team-list > li .description p.caption {margin-top: 20px; font-size: 16px; line-height: 24px;}

#home-service-sfw {padding: 95px 0; background: #f1f2f2;}
#home-service-list-container {padding-left: 330px; position: relative;}
#home-service-title {position: absolute; top: 50%; left: 0; transform: translateY(-50%);}
ul.service-list {}
ul.service-list > li {width: 100%; box-sizing: border-box; padding: 40px; background: #fbfcfc; margin-bottom: 30px;}
ul.service-list > li:last-child {margin-bottom: 0;}
ul.service-list > li .img-wrap {float: left; width: 25%; text-align: center;}
ul.service-list > li .img-wrap img {display: block; margin: 0 auto; max-width: 100%;}
ul.service-list > li .img-wrap img.img-resp {display: none;}
ul.service-list > li .description {float: right; width: 70%;}
ul.service-list > li .description img {max-height: 40px; display: block; margin-bottom: 30px;}

#home-client-sfw {padding: 95px 0; background: #fff;}
#home-client-sfw {text-align: center;}
ul.client-list {width: 100%; text-align: center;}
ul.client-list > li {display: inline-block; width: 19.5%; height: 150px; position: relative; margin: 0;}
ul.client-list > li img {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); max-width: 80%; max-height: 80%;}

#home-testimonial-sfw {padding: 95px 0;}
img#quote-left {position: absolute; top: 15px; left: 10%;}
img#quote-right {position: absolute; bottom: 15px; right: 10%;}
.updateable-bg-sfw {background-size: cover !important;}
img.sfw-bg {display: none;}
#home-testimonial-container {background: #fff;}
.testimonial-item {text-align: center; padding: 60px; min-height: 150px;}
.testimonial-item p {}
.testimonial-item .info {margin-top: 35px; float: right; text-align: center;}
@media only screen and (min-width: 769px) {
	.testimonial-item .info {max-width: 300px;}
}
.testimonial-item .info h5 {font-size: 20px; line-height: 28px; margin-bottom: 0;}
.testimonial-item .info p {font-family: 'LightItalicFont'; font-size: 14px; line-height: 20px;}
#testimonial-list-container .slick-dots {position: absolute; bottom: -50px; z-index: 500; transform: translateX(-50%); left: 50%; min-width: 50%;}
#testimonial-list-container .slick-dots li {width: 51px; margin: 0 15px;}
#testimonial-list-container .slick-dots li button {width: 51px; height: 5px; background: url(../images/icon/bullet-2.png) no-repeat center;}
#testimonial-list-container .slick-dots li.slick-active button {background: url(../images/icon/bullet-active.png) no-repeat center;}

#home-boc-sfw {padding: 65px 0; text-align: center;}
#home-boc-sfw a.gen-btn {margin: 0 auto; margin-top: 10px;}
#home-boc-sfw .wrap-4 {padding-left: 200px;}

#home-blog-sfw {padding: 95px 0; background: #f1f2f2;}
ul.blog-list {float: left; width: 100%; position: relative;}
ul.blog-list > li {float: left; width: 100%; position: relative; margin-bottom: 30px; background: #ffffff; margin-bottom: 30px;}
ul.blog-list > li:last-child {margin-bottom: 0;}
ul.blog-list > li:last-child {margin-bottom: 0;}
ul.blog-list > li .img-wrap {float: left; width: 23%;box-sizing: border-box;}
ul.blog-list > li .img-wrap.type2 {width: 30%;}
ul.blog-list > li .img-wrap .inner {background-size: cover !important; }
ul.blog-list > li .img-wrap img {display: none;}
ul.blog-list > li .info {float: right; width: 77%; box-sizing: border-box; padding: 25px 40px;}
ul.blog-list > li .info.fw {float: none; width: 100%; padding: 0;}
ul.blog-list > li .info.type2 {width: 70%;}
ul.blog-list > li .info.no-ptb {padding-top: 0; padding-bottom: 0; margin-top: -3px;}
ul.blog-list > li .info h5, ul.blog-list > li .info h5 a {font-size: 18px; line-height: 26px; margin-bottom: 0; color: #00569f; font-family: 'ExtraBoldFont', Arial, Verdana;}
ul.blog-list > li .info h5:hover, ul.blog-list > li .info h5 a:hover {text-decoration: none; color: #4cc0b6;}
ul.blog-list > li .info p.post-date {font-size: 14px; line-height: 20px; color: #feb04b; font-family: 'ItalicFont', Arial, Verdana;}
ul.blog-list > li .info p.like {margin-top: 10px; font-size: 'SpecialFont'; color: #4cc0b6; font-size: 16px; line-height: 22px; background: url(../images/icon/like-color.png) no-repeat left top; padding-left: 30px;}
ul.blog-list > li .info p.description {margin-top: 15px; color: #333;}
ul.blog-list > li .info p.category {display: inline-block; margin-top: 15px; font-family: 'SpecialLightFont', Arial, Verdana; font-size: 16px; line-height: 24px; color: #fff; background: url(../images/icon/blog-category.png) no-repeat 15px center #939598; padding: 3px 20px; padding-left: 40px;
border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -o-border-radius: 5px;}
ul.blog-list > li .info .line {height: 2px; background: #4cc0b6; margin-top: 33px;}
ul.blog-list > li .info .line.mt-2 {margin-top: 10px;}
#home-blog-sfw a.gen-btn {margin: 0 auto; margin-top: 40px;}

@media only screen and (max-width: 1200px) {
	#slideshow-list-container .slideshow-item .caption {left: 50%; transform: translate(-50%, -65%); width: 75%; text-align: center;}
}

@media only screen and (max-width: 1024px) {
	#slideshow-list-container .slideshow-item .caption .wysiwyg-content h2 {font-size: 36px; line-height: 48px;}
	
	#home-hello-sfw .wysiwyg-content {padding-left: 60px;}
	#home-team-sfw > img {height: 200px; top: -100px;}
	
	#home-team-sfw h2 {text-align: center; padding-right: 0;}
	
	ul.team-list > li {width: 19%; margin-right: 8%;}
	ul.team-list > li .description p.caption {font-size: 14px; line-height: 22px;}
	
	#home-service-list-container {padding-left: 0;}
	#home-service-title {position: relative; transform: none; top: 0; margin-bottom: 30px;}
	
	#home-boc-sfw .wrap-4 {padding-left: 0;}
	
	ul.blog-list > li .img-wrap {padding: 10px; width: 30%;}
	ul.blog-list > li .info {width: 70%; padding: 10px 30px 25px 30px;}
}

@media only screen and (max-width: 768px) {
	#slideshow-list-container .slideshow-item .caption {width: 90%; top: 60%; transform: translate(-50%, -60%);}
	#slideshow-list-container .slideshow-item .caption .wysiwyg-content h2 {font-size: 30px; line-height: 42px;}
	#slideshow-list-container .slick-dots li {width: 35px; margin: 0 7px;}
	#slideshow-list-container .slick-dots li button {width: 35px; height: 5px; background-size: 35px 5px;}
	
	#home-team-sfw > img {height: 150px; top: -75px; right: 5%;}
	
	ul.team-list > li {width: 37%; margin-right: 26%;}
	ul.team-list > li:nth-child(4n) {margin-right: 10%;}
	ul.team-list > li:nth-child(4n + 1) {clear: none;}
	ul.team-list > li:nth-child(2n) {margin-right: 0;}
	ul.team-list > li:nth-child(2n + 1) {clear: both;}
	
	ul.service-list > li .img-wrap {width: 100%; margin-bottom: 30px; text-align: left; position: relative;}
	ul.service-list > li .img-wrap img {margin-left: 0; width: 100px;}
	ul.service-list > li .img-wrap img.img-resp {display: block; position: absolute; top: 50%; left: 120px; transform: translateY(-50%); width: auto; height: 40px;}
	ul.service-list > li .description {width: 100%;}
	ul.service-list > li .description img {display: none;}
	
	ul.client-list > li {width: 32%;}
	
	img#quote-left {left: 3%; height: 60px;}
	img#quote-right {right: 3%; height: 60px;}
	.testimonial-item {padding: 40px;}
	.testimonial-item .info {float: none;}
	#testimonial-list-container .slick-dots li {width: 35px; margin: 0 7px;}
	#testimonial-list-container .slick-dots li button {width: 35px; height: 5px; background-size: 35px 5px;}
	
	ul.blog-list > li .img-wrap {display: none;}
	ul.blog-list > li .info {width: 100%; padding: 25px 30px;}
}

@media only screen and (max-width: 480px) {	
	ul.team-list > li {width: 42%; margin-right: 16%;}
	
	ul.service-list > li .img-wrap img {width: 75px;}
	ul.service-list > li .img-wrap img.img-resp {width: 150px; height: auto; left: 100px;}
	
	ul.client-list > li {width: 45%; height: 120px; margin-right: 5%;}
	ul.client-list > li:nth-child(2n) {margin-right: 0;}
	
	img#quote-left, img#quote-right {display: none;}
	#slideshow-list-container .slick-dots {bottom: 60px;}
}
/* /HOME */


/* BLOG */
#header-bg-sfw {padding: 220px 0 60px 0;}
#header-bg-sfw h2 {font-size: 60px; line-height: 68px; color: #fff; text-align: center;}

#blog-sfw {padding: 80px 0; background: #fff;}
#blog-left-container {float: left; width: 73%;}
#blog-right-container {float: right; width: 22%;}

.sidebar-container {margin-bottom: 30px;}
.sidebar-container h5 {font-family: 'SpecialFont'; font-size: 24px; line-height: 24px; padding: 15px 25px; background: #ededee; color: #333333; margin-bottom: 0;}
ul.sidebar-cat-list {padding: 10px 0; background: #f6f6f6;}
ul.sidebar-cat-list > li {padding: 0 10px;}
ul.sidebar-cat-list > li > a {display: block; font-family: 'SpecialLightFont'; color: #333333; padding: 7px 15px; border-bottom: 1px solid #c7c8ca;}
ul.sidebar-cat-list > li:last-child > a {border-bottom: 0;}
ul.sidebar-cat-list > li > a:hover {color: #00569f; text-decoration: none;}
ul.sidebar-cat-list > li > a.active, ul.sidebar-cat-list > li > a.active:hover {font-family: 'SpecialFont'; color: #333;}

#blog-detail-header {margin-bottom: 30px;}
#blh-left {float: left;}
.blog-like-container {display: inline-block; background: url(../images/icon/like.png) no-repeat 8px center #4cc0b6; padding: 6px; padding-left: 50px;
border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -o-border-radius: 5px;}
.blog-like-container p {font-family: 'SpecialFont'; color: #fff; font-size: 20px; line-height: 20px; display: inline-block; background: #3d9a92; padding: 5px 8px;
border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -o-border-radius: 5px;}
.blog-like-container p.clickable {cursor: pointer;
transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; -o-transition: all 0.2s linear;}
.blog-like-container p.clickable:hover {background: #3d9a77;}
#blh-right {float: right;}
ul.share-socmed-list {}
ul.share-socmed-list > li {float: left; margin-right: 8px;}
ul.share-socmed-list > li:last-child {margin-right: 0;}
ul.share-socmed-list > li p {font-size: 18px; line-height: 40px;}
ul.share-socmed-list > li img {height: 40px; -webkit-backface-visibility: hidden;
transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; -o-transition: all 0.2s linear;}
ul.share-socmed-list > li img:hover {opacity: 0.75;}

@media only screen and (max-width: 1024px) {
	#header-bg-sfw {padding-top: 150px;}
	
	ul.blog-list > li .img-wrap.type2 {padding: 0;}
	
	#blog-left-container {width: 67%;}
	#blog-right-container {width: 28%;}
}

@media only screen and (max-width: 768px) {
	#header-bg-sfw h2 {font-size: 44px; line-height: 56px;}
	
	#blog-left-container {width: 60%;}
	#blog-right-container {width: 35%;}
	
	ul.blog-list > li .img-wrap.type2 {display: block; width: 100%; margin-bottom: 20px; text-align: center; width: auto !important; height: auto !important;}
	ul.blog-list > li .img-wrap.type2 img {display: block; margin: 0 auto; max-width: 100%;}
	ul.blog-list > li .info.type2 {width: 100%; padding: 0;}
	
	.sidebar-container h5 {font-size: 20px; line-height: 28px; padding: 10px 15px;}
	ul.sidebar-cat-list > li {padding: 0 5px;}
	ul.sidebar-cat-list > li > a {padding: 7px 10px; font-size: 15px; line-height: 23px;}
	
	#blog-detail-header {display: none;}
	ul.share-socmed-list > li p {font-size: 16px;}
}

@media only screen and (max-width: 480px) {
	#blog-sfw {padding: 40px 0;}
	
	#blog-left-container {width: 100%; padding-bottom: 30px; margin-bottom: 30px; border-bottom: 1px dashed #7f7f7f;}
	#blog-right-container {width: 100%;}
	.sidebar-container h5 {padding: 12px 20px;}
	ul.sidebar-cat-list > li {padding: 0 10px;}
	ul.sidebar-cat-list > li > a {padding: 7px 10px;}
}
/* /BLOG */


/* PORTFOLIO */
#portfolio-sfw {padding: 80px 0; background: #fff;}
#portfolio-sfw a.gen-btn {}
ul.prt-category-list {width: 100%; text-align: center;}
ul.prt-category-list > li {display: inline-block; margin-right: 24px;}
ul.prt-category-list > li:last-child {margin-right: 0;}
ul.prt-category-list > li > a {display: inline-block; padding: 10px; font-size: 18px; line-height: 26px; font-family: 'SpecialLightFont'; color: #333333; margin-bottom: 10px;}
ul.prt-category-list > li > a:hover {color: #feb04b; text-decoration: none; }
ul.prt-category-list > li > a.sep:hover {color: #333;}
ul.prt-category-list > li > a.active, ul.prt-category-list > li > a.active:hover {font-family: 'SpecialFont'; background: url(../images/icon/line-org.png) repeat-x bottom center;}

ul.portfolio-list {float: left; width: 100%; position: relative; margin-top: 60px;}
ul.portfolio-list > li {float: left; width: 31%; margin-right: 3.5%; margin-bottom: 40px;}
ul.portfolio-list > li:nth-child(3n) {margin-right: 0;}
ul.portfolio-list > li:nth-child(3n + 1) {clear: both;}
ul.portfolio-list > li .img-wrap {background-size: cover !important; position: relative;}
ul.portfolio-list > li .img-wrap img {display: none;}
ul.portfolio-list > li .cover {position: absolute; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.85); display: none;}
ul.portfolio-list > li .cover .inner {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 75%; padding-top: 35px; background: url(../images/icon/line-wht.png) no-repeat top center; text-align: center;}
ul.portfolio-list > li .cover .inner h5 {font-size: 20px; line-height: 28px; color: #fff; margin-bottom: 0;}
ul.portfolio-list > li .cover .inner p {font-size: 14px; line-height: 22px; color: #fff; font-family: 'LightFont';}

#prt-vid-frame {margin-bottom: 60px;}
#prt-vid-frame iframe {width: 100% !important; height: 500px !important;}

#prt-det-left {float: left; width: 57%;}
#prt-det-right {float: right; width: 30%;}
#prt-det-right .prt-det-item {float: left; width: 100%; position: relative; margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px solid #cccccc;}
#prt-det-right .prt-det-item:last-child {margin-bottom: 0; padding-bottom: 0; border-bottom: none;}
#prt-det-right .prt-det-item .title {float: left; width: 23%;}
#prt-det-right .prt-det-item .value {float: right; width: 72%;}

@media only screen and (max-width: 1200px) {
	ul.prt-category-list > li {margin-right: 10px;}	
}

@media only screen and (max-width: 1024px) {
	ul.prt-category-list > li > a {font-size: 15px; line-height: 23px; padding: 5px;}
	
	#prt-vid-frame {margin-bottom: 30px;}
	#prt-vid-frame iframe {height: 400px !important;}
	#prt-det-left, #prt-det-right {width: 100%; padding: 0; margin: 0;}
	#prt-det-left {margin-bottom: 50px;}
}

@media only screen and (max-width: 768px) {	
	ul.portfolio-list > li {width: 47.5%; margin-right: 5%;}
	ul.portfolio-list > li:nth-child(3n) {margin-right: 5%;}
	ul.portfolio-list > li:nth-child(3n + 1) {clear: none;}
	ul.portfolio-list > li:nth-child(2n) {margin-right: 0;}
	ul.portfolio-list > li:nth-child(2n + 1) {clear: both;}
	
	ul.portfolio-list > li .cover .inner h5 {font-size: 18px; line-height: 26px;}
	ul.portfolio-list > li .cover .inner p {font-size: 13px; line-height: 20px;}
}

@media only screen and (max-width: 480px) {	
	#portfolio-sfw {padding: 40px 0;}
	
	ul.portfolio-list > li {width: 48.5%; margin-right: 3%; margin-bottom: 15px;}
	ul.portfolio-list > li:nth-child(3n) {margin-right: 3%;}
	ul.portfolio-list > li:nth-child(3n + 1) {clear: none;}
	ul.portfolio-list > li:nth-child(2n) {margin-right: 0;}
	ul.portfolio-list > li:nth-child(2n + 1) {clear: both;}
	
	#prt-load-more-btn {margin-top: 30px;}
}
/* /PORTFOLIO */


/* CONTACT */
#contact-sfw {padding: 95px 0; background: #f1f2f2;}
#contact-form input[type="text"], #contact-form input[type="email"], #contact-form textarea {width: 100%;}

#contact-bottom-sfw {padding: 95px 0; background: #fff;}
#ctb-left {float: left; width: 46%}
#gmap-container iframe {width: 100% !important; height: 480px !important;}
#ctb-right {float: right; width: 46%; margin-top: -8px;}
#ctb-right h5 {font-size: 20px; line-height: 32px;}

@media only screen and (max-width: 1024px) {
	#contact-bottom-sfw {padding: 60px 0;}
	#gmap-container iframe {height: 350px !important;}
}

@media only screen and (max-width: 600px) {
	#ctb-left, #ctb-right {width: 100%; padding: 0; margin: 0;}
	#ctb-left {margin-bottom: 30px;}
	#gmap-container iframe {height: 300px !important;}
}

@media only screen and (max-width: 480px) {
	#contact-sfw {padding: 40px 0;}
}
/* /CONTACT */


/* ACCOUNT */
#account-sfw {padding: 95px 0; background: #f1f2f2;}
.account-form input[type="text"], .account-form input[type="email"], .account-form input[type="password"], .account-form textarea {width: 100%;}
.account-form .input-file-wrap {position: absolute; right: 0; top: 0;}

.table-row-container {float: left; width: 100%; position: relative;}
.table-row {float: left; width: 100%; position: relative; margin-bottom: 30px;}
.table-row-container .table-row:last-child {margin-bottom: 0;}
.table-row .title {float: left; width: 25%; box-sizing: border-box; padding-right: 15px;}
.table-row .sep {float: left; width: 5%; box-sizing: border-box; padding-right: 15px;}
.table-row .value {float: left; width: 70%; box-sizing: border-box;}

#report-sfw {padding: 95px 0; background: #fff;}
table.gen-table {width: 100%;}
table.gen-table tr td {padding: 12px 20px; vertical-align: middle; border-left: 1px solid #ccc; border-top: 1px solid #ccc;}
table.gen-table tr td:last-child {border-right: 1px solid #ccc;}
table.gen-table tr:last-child td {border-bottom: 1px solid #ccc;}
table.gen-table tr td a.gen-btn {padding: 12px 20px; font-size: 16px; line-height: 16px;}
#report-sfw table.gen-table {width: 70%; margin: 0 auto;}

ul.sel-rating-list {}
ul.sel-rating-list > li {cursor: pointer; float: left; margin-right: 5px;}
ul.sel-rating-list > li img {width: 30px; height: 28px;}
ul.sel-rating-list > li:last-child {margin-right: 0;}
#feedback-form ul.sel-rating-list {position: absolute; display: inline-block; margin-left: 30px; margin-top: -5px;}

@media only screen and (max-width: 768px) {
	.table-row .title {width: 30%;}
	.table-row .value {width: 65%;}
	
	#report-sfw table.gen-table {width: 85%;}
}

@media only screen and (max-width: 600px) {
	.table-row .title {width: 35%;}
	.table-row .value {width: 60%;}
	
	#feedback-form ul.sel-rating-list {position: relative; display: block; margin-left: 0; margin-top: 5px;}
}

@media only screen and (max-width: 480px) {
	#account-sfw {padding: 40px 0;}
	#report-sfw {padding: 40px 0;}
	
	.title-resp {display: none;}
	h2.small-resp {font-size: 36px; line-height: 48px;}
	
	.table-row .title {width: 40%;}
	.table-row .value {width: 55%;}
	
	#report-sfw table.gen-table {width: 100%;}
	table.gen-table tr td {padding: 10px 16px; font-size: 15px; line-height: 22px;}
}
/* /ACCOUNT */


/* PAGINATION */
.pagination-container {margin-top: 15px;}
.pagination-list {}
.pagination-list.centered {display: inline-block; margin: 0 auto;}
.pagination-list li {float: left; margin-bottom: 5px; margin-right: 12px;}
.pagination-list li:last-child {margin-right: 0px;}
.pagination-list li a {font-size: 18px; line-height: 18px; color: #333333; font-family: 'SpecialLightFont'; display: inline-block; padding: 11px 15px; box-sizing: border-box; border-bottom: 2px solid #00569f; background: #fff;
transition: all 0.25s ease-in; -moz-transition: all 0.25s ease-in; -webkit-transition: all 0.25s ease-in; -o-transition: all 0.25s ease-in;}
.pagination-list li a:hover {text-decoration: none; border-bottom: 2px solid #feb04b;}
.pagination-list li a.active, .pagination-list li a.active:hover {font-family: 'SpecialFont'; border-bottom: 2px solid #feb04b;}
.pagination-list li a.bald, .pagination-list li a.bald:hover {border-bottom: none;}
.pagination-list li a.bald:hover {color: #feb04b;}

@media only screen and (max-width: 480px) {
	.pagination-container.fl-right, .pagination-container.fl-left {float: none !important;}
	.pagination-container {text-align: center;}
	.pagination-list {display: inline-block; margin: 0 auto;}
}
/* /PAGINATION */


/* FOOTER */
#footer {padding: 60px 0;}
#footer p, #footer p a {color: #fff; font-family: 'SpecialLightFont', Arial, Verdana;}
#footer p.thin {font-family: 'SpecialThinFont', Arial, Verdana;}
#footer p.cr {font-size: 13px; line-height: 18px;}
#footer-left {float: left; width: 48%;}
#ftleft-left {float: left; width: 55%;}
#ftleft-right {float: right; width: 40%;}

#footer-right {float: right; width: 50%;}
#footer-right p.cr {text-align: right;}
ul#footer-nav-list {float: right;}
ul#footer-nav-list > li {float: left; margin-right: 35px;}
ul#footer-nav-list > li:last-child {margin-right: 0;}
ul#footer-nav-list > li > a {font-family: 'SpecialFont'; color: #fff;}
ul#footer-nav-list > li > a:hover {color: #feb04b; text-decoration: none;}

ul.socmed-list {}
ul.socmed-list > li {float: left; margin-right: 25px;}
ul.socmed-list > li:last-child {margin-right: 0;}
ul.socmed-list > li img {height: 15px; -webkit-backface-visibility: hidden;
transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; -o-transition: all 0.2s linear;}
ul.socmed-list > li img:hover {opacity: 0.75;}
#footer-right ul.socmed-list {float: right; margin-top: 30px; margin-bottom: 10px;}

@media only screen and (max-width: 1024px) {
	#footer-left {width: 35%;}
	#ftleft-left {width: 100%; margin-bottom: 20px;}
	#ftleft-right {width: 100%;}
	
	#footer-right {width: 60%;}
	ul#footer-nav-list > li {margin-right: 25px;}
}

@media only screen and (max-width: 768px) {
	#footer {padding: 30px 0;}
	#footer-left {float: none; width: 100%; padding-bottom: 20px; margin-bottom: 20px; border-bottom: 1px dashed #dfdfdf;}
	#ftleft-left {width: 55%; margin-bottom: 0;}
	#ftleft-right {width: 40%;}
	#footer-right {float: none; width: 100%;}
	
	ul#footer-nav-list {float: left;}
	#footer-right ul.socmed-list {float: left; margin-top: 15px; margin-bottom: 5px;}
	#footer-right p.cr {text-align: left;}
}

@media only screen and (max-width: 600px) {
	#ftleft-left, #ftleft-right {width: 100%;}
	#ftleft-left {margin-bottom: 20px;}
	
	ul#footer-nav-list > li {margin-right: 20px;}
	ul#footer-nav-list > li > a {font-size: 15px; line-height: 23px;}
	ul#footer-nav-list > li.resp {display: none;}
}
/* /FOOTER */


/* OVERLAY NOTIFICATION */
.overlay-bg, .overlay-bg2  { width: 100%; height: 100%; background: #7f7f7f; opacity: 0.5; z-index: 9000; left: 0; top: 0; position: fixed;}
.notification-content, .notification-content2 {width: 40%; box-sizing: border-box; padding: 40px; background: #ffffff; z-index: 10000; position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: center;}
.notification-content h3, .notification-content2 h3 {font-size: 30px; line-height: 36px; font-family: 'SpecialFont'; color: #333; margin-bottom: 20px;}
.notification-content p, .notification-content2 p {font-size: 16px; line-height: 24px; margin-bottom: 0px; font-family: 'GeneralFont'; color: #808285;}
.notification-content small, .notification-content2 small {padding-left: 3px; font-size: 13px; color: #222; font-family: 'GeneralFont';}

.notif-success h3, .notif-success2 h3 {padding-top: 100px; background: url(../images/icon/success-notif.png) no-repeat top center; background-size: auto 75px;}
.notification-close-btn {margin-top: 15px; font-size: 16px; line-height: 16px; padding: 10px 20px; display: inline-block; background: #4cc0b6; cursor: pointer; color: #fff; font-family: 'SpecialFont';}
.notification-close-btn:hover {background: #3d9a92; text-decoration: none; color: #fff;}

.overlay-bg2, .notification-content2 {display: none;}
.form-control.type2 {display: inline; width: 60%;}

@media only screen and (max-width: 960px) {
	.notification-content, .notification-content2 {width: 70%;}
}

@media only screen and (max-width: 600px) {
	.notification-content, .notification-content2 {width: 80%; padding: 20px;}
	.notification-content h3, .notification-content2 h3 {margin-bottom: 20px;}
	.notif-success h3, .notif-success2 h3 {padding-top: 75px; background-size: auto 50px;}
	.notification-content h3, .notification-content2 h3 {font-size: 26px; line-height: 32px;}
	.notification-content p, .notification-content2 p {font-size: 14px; line-height: 20px;}
}


/* ADDITIONAL */
#fp-waiting {background: #fff; position: fixed; top: 0; left: 0; width: 100%; height: 100%; opacity: 0.7; z-index: 9000; display: none;}
#fp-waiting img {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
/* /ADDITIONAL */