/*
Created by Zeuskx
Visit datoweb.com
*/
@import url('https://fonts.googleapis.com/css?family=Sarabun:300,400,500,600,700,800');
body {
	margin: 0;
	padding: 0;
	font-family: 'Sarabun', sans-serif;
	font-size: 15px;
	color: #171717;
    background: #fff;
    -webkit-font-smoothing: antialiased;
    -moz-font-smoothing: antialiased;
}
body * {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	word-wrap: break-word;
}
:root {
    --blue: #3174ab;
    --red: #d04c51;
    --green: #3fa142;
    --dark: #222222;
    --gray: #f7f7f7;
}
::selection {
	background:#6ba9c6;
	color:#fff;
}
pre {
	font-family: monospace;
}
html {
	overflow-y:scroll;
}
a {
	-webkit-transition: all .1s linear;
    transition: all .1s linear;
    -o-transition: all .1s linear;
    color: #444;
    text-decoration: none;
}
a:hover {
    color: #000;
    text-decoration: underline;
}
h1, h2, h3, h4, h5 {
	padding: 4px 0;
	margin: 0;
}
ul.info li {
    margin-bottom: .25rem;
}
img {
    max-width: 100%;
}
.wrapper {
    width: 100%;
    height: auto;
}
.s-none,
.s-none * {
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}
.p-absolute {
    position: absolute !important;
}
.p-relative {
    position: relative !important;
}
.pointer {
	cursor: pointer !important;
}
.d-block {
	display: block !important;
}
.d-none {
	display: none !important;
}
.d-inline {
	display: inline !important;
}
.d-inline-b {
    display: inline-block !important;
}
.o-hidden {
    overflow: hidden !important;
}
.w-100 {
    width: 100%;
}
.f-bold {
	font-weight: bold !important;
}
.f-normal {
    font-weight: normal !important;
}
.ta-c {
	text-align: center !important;
	display: block;
}
.ta-l {
	text-align: left !important;
	display: block;
}
.ta-r {
	text-align: right !important;
	display: block;
}
.ta-j {
	text-align: justify !important;
	display: block;
}
.ta-m {
    top: 50%;
    position: absolute;
    transform: translateY(-50%);
}
.c-white {
	color: white;
}
.c-dark {
	color: var(--dark);
}
.c-red {
	color: var(--red);
}
.fs-1 {
	font-size: .25rem !important;
}
.fs-2 {
	font-size: .50rem !important;
}
.fs-3 {
	font-size: .75rem !important;
}
.fs-4 {
	font-size: 1rem !important;
}
.fs-5 {
	font-size: 1.25rem !important;
}
.bg-white {
	background: white;
}
.bg-dark {
	background: var(--dark);
	color: #fff;
}
.bg-green {
	background: green;
	color: #fff;
}
.b-0 {
    border: 0 !important;
}
.bt-0 {
    border-top: 0 !important;
}
.bb-0 {
    border-bottom: 0 !important;
}
.bl-0 {
    border-left: 0 !important;
}
.br-0 {
    border-right: 0 !important;
}
.p-0 {
	padding: 0 !important;
}
.p-1 {
	padding: .25rem !important;
}
.p-2 {
	padding: .50rem !important;
}
.p-3 {
	padding: .75rem !important;
}
.p-4 {
	padding: 1rem !important;
}
.p-5 {
	padding: 1.25rem !important;
}
.py-0 {
    padding-top:  0 !important;
	padding-bottom:  0 !important;
}
.py-1 {
    padding-top:  .25rem !important;
    padding-bottom:  .25rem !important;
}
.py-2 {
    padding-top:  .50rem !important;
    padding-bottom:  .50rem !important;
}
.py-3 {
    padding-top:  .75rem !important;
    padding-bottom:  .75rem !important;
}
.py-4 {
    padding-top:  1rem !important;
    padding-bottom:  1rem !important;
}
.py-5 {
    padding-top:  1.25rem !important;
    padding-bottom:  1.25rem !important;
}
.px-0 {
    padding-left: 0 !important;
	padding-right: 0 !important;
}
.px-1 {
    padding-left: .25rem !important;
    padding-right: .25rem !important;
}
.px-2 {
    padding-left: .50rem !important;
    padding-right: .50rem !important;
}
.px-3 {
    padding-left: .75rem !important;
    padding-right: .75rem !important;
}
.px-4 {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
}
.px-5 {
    padding-left: 1.25rem !important;
    padding-right: 1.25rem !important;
}
.pl-0 {
	padding-left: 0 !important;
}
.pl-1 {
    padding-left: .25rem !important;
}
.pl-2 {
	padding-left: .50rem !important;
}
.pl-3 {
	padding-left: .75rem !important;
}
.pl-4 {
	padding-left: 1rem !important;
}
.pl-5 {
	padding-left: 1.25rem !important;
}
.pr-0 {
	padding-right: 0 !important;
}
.pr-1 {
    padding-right: .25rem !important;
}
.pr-2 {
	padding-right: .50rem !important;
}
.pr-3 {
	padding-right: .75rem !important;
}
.pr-4 {
	padding-right: 1rem !important;
}
.pr-5 {
	padding-right: 1.25rem !important;
}
.pt-0 {
	padding-top: 0 !important;
}
.pt-1 {
    padding-top: .25rem !important;
}
.pt-2 {
	padding-top: .50rem !important;
}
.pt-3 {
	padding-top: .75rem !important;
}
.pt-4 {
	padding-top: 1rem !important;
}
.pt-5 {
	padding-top: 1.25rem !important;
}
.pb-0 {
	padding-bottom: 0 !important;
}
.pb-1 {
    padding-bottom: .25rem !important;
}
.pb-2 {
	padding-bottom: .50rem !important;
}
.pb-3 {
	padding-bottom: .75rem !important;
}
.pb-4 {
	padding-bottom: 1rem !important;
}
.pb-5 {
	padding-bottom: 1.25rem !important;
}
.m-0 {
	margin: 0 !important;
}
.m-1 {
	margin: .25rem !important;
}
.m-2 {
	margin: .50rem !important;
}
.m-3 {
	margin: .75rem !important;
}
.m-4 {
	margin: 1rem !important;
}
.m-5 {
	margin: 1.25rem !important;
}
.my-0 {
    margin-top: 0 !important;
	margin-bottom: 0 !important;
}
.my-1 {
    margin-top: 25rem !important;
    margin-bottom: .25rem !important;
}
.my-2 {
    margin-top: .50rem !important;
    margin-bottom: .50rem !important;
}
.my-3 {
    margin-top: .75rem !important;
    margin-bottom: .75rem !important;
}
.my-4 {
    margin-top: 1rem !important;
    margin-bottom: 1rem !important;
}
.my-5 {
    margin-top: 1.25rem !important;
    margin-bottom: 1.25rem !important;
}
.mx-0 {
	margin: 0 !important;
}
.mx-1 {
    margin-left: .25rem !important;
    margin-right: .25rem !important;
}
.mx-2 {
    margin-left: .50rem !important;
    margin-right: .50rem !important;
}
.mx-3 {
    margin-left: .75rem !important;
    margin-right: .75rem !important;
}
.mx-4 {
    margin-left: 1rem !important;
    margin-right: 1rem !important;
}
.mx-5 {
    margin-left: 1.25rem !important;
    margin-right: 1.25rem !important;
}
.ml-0 {
	margin-left: 0 !important;
}
.ml-1 {
    margin-left: .25rem !important;
}
.ml-2 {
	margin-left: .50rem !important;
}
.ml-3 {
	margin-left: .75rem !important;
}
.ml-4 {
	margin-left: 1rem !important;
}
.ml-5 {
	margin-left: 1.25rem !important;
}
.mr-0 {
	margin-right: 0 !important;
}
.mr-1 {
    margin-right: .25rem !important;
}
.mr-2 {
	margin-right: .50rem !important;
}
.mr-3 {
	margin-right: .75rem !important;
}
.mr-4 {
	margin-right: 1rem !important;
}
.mr-5 {
	margin-right: 1.25rem !important;
}
.mt-0 {
	margin-top: 0 !important;
}
.mt-1 {
    margin-top: .25rem !important;
}
.mt-2 {
	margin-top: .50rem !important;
}
.mt-3 {
	margin-top: .75rem !important;
}
.mt-4 {
	margin-top: 1rem !important;
}
.mt-5 {
	margin-top: 1.25rem !important;
}
.mb-0 {
	margin-bottom: 0 !important;
}
.mb-1 {
    margin-bottom: .25rem !important;
}
.mb-2 {
	margin-bottom: .50rem !important;
}
.mb-3 {
	margin-bottom: .75rem !important;
}
.mb-4 {
	margin-bottom: 1rem !important;
}
.mb-5 {
	margin-bottom: 1.25rem !important;
}
.transition {
	-webkit-transition: all .1s linear;
    transition: all .1s linear;
    -o-transition: all .1s linear;
}
.float-l {
	float: left !important;
}
.float-r {
	float: right !important;
}
.float-n {
    float: none !important;
}
.container {
	max-width: 1200px;
	margin: 0 auto;
}
.container-small {
	max-width: 800px;
}
.row {
    display: -ms-flexbox;
    display: flex;
/*    -ms-flex-wrap: wrap;
    flex-wrap: wrap;*/
    margin-left: -8px;
    margin-right: -8px;
}
.col {
	float: left;
	padding: 8px;
	width: 100%;
}
.navbar,
.navbar ul li ul {
	background: var(--gray);
    overflow: hidden;
    border-bottom: 1px solid #e6e6e6;
}
.navbar ul,
.navbar ul li ul  {
	margin: 0;
    padding: 0;
    list-style: none;
}
.navbar ul li,
.navbar ul li ul li {
	float: left;
}
.navbar ul li:hover > ul {
    display: block;
}
.navbar ul li a {
	padding: 25px;
    display: inline-block;
    text-decoration: none;
    color: #444;
}
.navbar ul li a:hover,
.navbar ul li.active > a  {
	background: #E7E7E7;
}
.navbar .logo {
	float: left;
    padding: 19px;
    padding-left: 0;
    display: inline-block;
    text-decoration: none;
    color: #444;
    font-size: 23px;
    font-weight: 600;
}
.navbar ul li ul  {
	position: absolute;
	display: none;
}
.navbar ul li ul li {
	float: none;
	display: block;
}
.navbar-dark,
.navbar-dark ul li ul {
    background: var(--dark);
    border-bottom: 1px solid #101010;
}
.navbar-dark ul li a,
.navbar-dark .logo {
    color: #d6d6d6;
}
.navbar-dark ul li a:hover,
.navbar-dark ul li.active > a {
	background: #080808;
}
.navbar-button {
	overflow: hidden;
    display: none;
    margin: 19px 18px 0 0;
    color: #fff;
    float: right;
    height: 25px;
    width: 28px;
    cursor: pointer;
    background: url(../img/nav.png) no-repeat center;
}
.navbar-list {
	overflow: hidden;
}
.section {
	padding: 16px;
    margin: 1rem 0 0 0;
    border: 1px solid #e6e6e6;
    box-shadow: 0 0 15px 1px rgba(162, 162, 162, 0.3);
}
.section:last-child {
    margin-bottom: 16px;
}
.section .section-head {
	border-bottom: 1px solid #e6e6e6;
    margin: -16px -16px 16px -16px;
    background: transparent;
    padding: 14px;
}
.section header h1,
.section header h2,
.section header h3,
.section header h4,
.section header h5 {
	font-weight: 600;
	padding: 0;
}
.footer {
	padding-top: 3rem;
    padding-bottom: 3rem;
	text-align: center;
	background: var(--gray);
    overflow: hidden;
    border-top: 1px solid #e6e6e6;
}
.footer-dark {
	background: var(--dark);
    border-top: 1px solid #101010;
    color: #d6d6d6;
}
.tg {
	display: inline-block;
    text-align: center;
    vertical-align: middle;
    background-color: var(--gray);
    border: 1px solid #e6e6e6;
    padding: 5px 20px;
    font-size: 1rem;
    line-height: 1.5;
    border-radius: .20rem;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
.tg-s {
	font-size: 0.9rem;
	padding: 4px 15px;
}
.tg-l {
	font-size: 1.25rem;
	padding: 6px 25px;
}
.tg-gray {
	color: #fff;
    background-color: #6c757d;
}
.tg-dark {
	color: #fff;
    background-color: var(--dark);
}
.btn {
	display: inline-block;
    font-weight: 400;
    color: #212529;
    text-align: center;
    vertical-align: middle;
    background-color: var(--gray);
    border: 1px solid transparent;
    padding: 5px 20px;
    font-size: 1rem;
    line-height: 1.5;
    cursor: pointer;
    border-radius: .20rem;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
.btn:hover {
	background: #f1f1f1;
	text-decoration: none;
    opacity: .9;
}
.btn-s {
	font-size: 0.9rem;
	padding: 4px 15px;
}
.btn-l {
	font-size: 1.50rem;
	padding: 6px 25px;
}
.btn-blue {
	background: var(--blue) !important;
	color: #fff;
}
.btn-blue:hover {
	color: #fff;
}
.btn-red {
	background: var(--red) !important;
	color: #fff;
}
.btn-red:hover {
	color: #fff;
}
.btn-green {
	background: var(--green) !important;
	color: #fff;
}
.btn-green:hover {
	color: #fff;
}
.btn-dark {
	background: var(--dark) !important;
	color: #fff;
}
.btn-dark:hover {
	color: #fff;
}
.count {
	color: #212529;
    background-color: #f8f9fa;
    display: inline-block;
    padding: .25em .40em;
    font-size: 75%;
    font-weight: 700;
    line-height: 1;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: .5rem;
    position: relative;
    top: -1px;
}
.bar {
    height: 16px;
    overflow: hidden;
    background-color: #f5f5f5;
    border-radius: .10rem;
}
.bar span {
	float: left;
    width: 0;
    height: 100%;
    font-size: 11px;
    color: #222;
    text-align: center;
    background-color: #D0D0D0;
    -webkit-transition: 0.6s;
    -o-transition: 0.6s;
    transition: 0.6s;
    color: #fff;
}
.bar-blue span {
	background-color: var(--blue);
}
.bar-red span {
	background-color: var(--red);
}
.bar-green span {
	background-color: var(--green);
}
.bar-dark span {
	background-color: var(--dark);
}
.panel {
    border-radius: .10rem;
    border: 1px solid #e6e6e6;
}
.panel h1,
.panel h2,
.panel h3,
.panel h4,
.panel h5 {
	padding: 0;
}
.panel-head {
	padding: 10px 15px;
	font-weight: 600;
    border-top-left-radius: .10rem;
    border-top-right-radius: .10rem;
    color: #333;
    background-color: var(--gray);
    -webkit-user-select: none;
    -moz-user-select: none;
    cursor: default;
}
.panel-head span {
    float: right;
    font-size: 16px;
}
.panel-body {
	display: block;
    padding: 15px;
    border-top: 1px solid #e6e6e6;
}
.accordion .panel {
	margin-bottom: 4px;
}
.accordion .panel-body {
	display: none;
}
.accordion .panel-body p:first-child {
   margin-top: 0;
}
.accordion .panel-body p:last-child {
   margin-bottom: 0;
}
.accordion .panel-open {
    display: block;
}
.accordion .panel:last-child {
	margin-bottom: 0;
}
.accordion .panel-head {
	cursor: pointer;
}
.code {
	background-color: #f8f9fa;
    border: 1px solid #f7f7f7;
    padding: 16px;
    padding-top: 0;
    color: var(--dark);
}
.top {
    border: 1px solid #e6e6e6;
    width: 43px;
    height: 43px;
    position: fixed;
    margin-top: -21.5px;
    right: 10px;
    bottom: 10px;
    background: url(../img/top.png) no-repeat center;
    cursor: pointer;
    border-radius: 2px;
    background-color: var(--gray);
    display: none;
}
.top-dark {
    border: 1px solid #101010;
    background: url(../img/top-dark.png) no-repeat center;
    background-color: var(--dark);
}
.form {
	position: relative;
	overflow: hidden;
	max-width: 500px;
}
.form-group {
	margin: 0 0 8px 0;
	display: block;
	width: 100%;
	float: left;
}
.form label {
	display: block;
    font-weight: bold;
    padding: 6px 0px;
    text-align: left;
}
.form-group input[type="text"],
.form-group input[type="password"],
.form-group input[type="date"], 
.form-group input[type="email"],
.form-group input[type="number"],
.form-group input[type="search"],
.form-group textarea {
    width: 100%;
    outline: none;
    display: block;
    font-size: 15px;
    background-color: #fff;
    border: 1px solid #e6e6e6;
    border-radius: .20rem;
    padding: .70rem;
    font-family: 'Sarabun', sans-serif;
}
.form-group input[type="submit"],
.form-group input[type="button"] {
	display: inline-block;
    font-weight: 400;
    text-align: center;
    vertical-align: middle;
    border: 1px solid #e6e6e6;
    padding: 5px 20px;
    font-size: 1rem;
    line-height: 1.7;
    border-radius: .20rem;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background: var(--blue) !important;
    color: #fff;
    float: right;
    -webkit-transition: all .1s linear;
    transition: all .1s linear;
    -o-transition: all .1s linear;
}
.form-group input[type="text"]:focus,
.form-group input[type="password"]:focus,
.form-group input[type="date"]:focus, 
.form-group input[type="email"]:focus,
.form-group input[type="number"]:focus,
.form-group input[type="search"]:focus,
.form-group textarea:focus {
	border-color: #c1d8ea;
	outline: none;
	-webkit-transition: 0.2s;
	-o-transition: 0.2s;
	transition: 0.2s;
}
.form-group input[type="submit"]:hover,
.form-group input[type="button"]:hover {
	opacity: .9;
	text-decoration: none;
	cursor: pointer;
	-webkit-transition: all .1s linear;
    transition: all .1s linear;
    -o-transition: all .1s linear;
}
.form-group input[type="submit"]:focus,
.form-group input[type="button"]:focus {
	outline: none;
}
.form-group.required label span {
	color: var(--red);
}
.user {
	max-width: 350px;
}
.user i {
    background: #e9ecef;
    color: #b7b7b7;
    border-top-left-radius: .20rem;
    border-bottom-left-radius: .20rem;
    float: left;
    width: 13%;
    text-align: center;
    height: 43.38px;
    line-height: 41px;
}
.user input[type="text"],
.user input[type="email"],
.user input[type="password"] {
    width: 87%;
    float: right;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}
.remember input[type="checkbox"] {
    float: left;
}
.remember label {
	float: left;
    padding: 0;
    margin: -1px 0 0 2px;
    font-weight: normal;
    font-size: 14px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
.modal {
	display: none;
	position: fixed;
    z-index: 999;
    width: 500px;
    background: #fff;
    top: 20%;
    left: 50%;
    transform: translate(-50%, -50%);
    padding: 16px;
    margin: 16px 0 0 0;
    border: 1px solid #e6e6e6;
    box-shadow: 0 0 15px 1px rgba(162, 162, 162, 0.3);
    -webkit-transition: all .1s linear;
    transition: all .1s linear;
    -o-transition: all .1s linear;
}
.modal-head {
	border-bottom: 1px solid #e6e6e6;
    margin: -16px -16px 16px -16px;
    background: transparent;
    padding: 14px;
}
.modal-head h1,
.modal-head h2,
.modal-head h3,
.modal-head h4,
.modal-head h5 {
    padding: 0;
}
.modal-body {
	display: block;
}
.modal-footer {
    border-top: 1px solid #e6e6e6;
    margin: 16px -16px -16px -16px;
    background: transparent;
    padding: 14px;
    overflow: hidden;
}
.modal-bg {
	display: none;
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0px;
    left: 0px;
    z-index: 990;
    background-color: rgb(0, 0,0, .5);
}
.modal-close {
    position: absolute;
    right: 0;
    top: 0;
    z-index: 999;
    font-size: 27px;
    font-weight: bold;
    color: #000;
    opacity: 0.4;
    cursor: pointer;
    margin: 6px 16px 0 0;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
.alert {
	padding: 1rem;
    border: 1px solid #e6e6e6;
    border-radius: .20rem;
    background: var(--gray);
    margin: 0 0 8px 0;
    font-size: 1rem;
    position: relative;
}
.alert-s {
	padding: .45rem 1rem;
    font-size: .85rem;
}
.alert-l {
	padding: 1.25rem 1rem;
    font-size: 1.25rem;
}
.alert-close {
    font-size: 23px;
    font-weight: bold;
    opacity: .7;
    cursor: pointer;
    float: right;
    line-height: 1rem;
    -webkit-transition: all .1s linear;
    transition: all .1s linear;
    -o-transition: all .1s linear;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
.alert-close:hover {
    opacity: .6;
    -webkit-transition: all .1s linear;
    transition: all .1s linear;
    -o-transition: all .1s linear;
}
.alert-s .alert-close {
    font-size: 18px;
}
.alert-blue {
    background: #cce5ff;
    border: 1px solid #b8daff;
    color: #004085;
}
.alert-red {
	color: #721c24;
    background-color: #f8d7da;
    border-color: #f5c6cb;
}
.alert-green {
	color: #155724;
    background-color: #d4edda;
    border-color: #c3e6cb;
}
.alert-dark {
    color: #ffffff;
    background-color: var(--dark);
    border-color: black;
}
.slider {
	position: relative;
    width: 100%;
    overflow: hidden;
    padding-bottom: 56.25%;
    height: 0;
}
.slider ul {
	margin: 0;
	padding: 0;
	list-style: none;
	position: relative;
}
.slider ul li {
	position: relative;
	display: block;
	float: left;
}
.slider ul li img {
	float: left;
	width: 100%;
}
.slider .slider-control {
	position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    z-index: 99;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 8%;
    color: #fff;
    opacity: .5;
    cursor: pointer;
    font-weight: bold;
    font-size: 19px;
}
.slider .slider-control:last-child {
	left: unset;
    right: 0;
}
.list {
	margin: 0;
    padding: 0;
    list-style: none;
}
.list li {
	padding: 1rem;
    border: 1px solid #e6e6e6;
    border-bottom: 0;
    margin-bottom: 0;
}
.list li:hover {
    background: #f1f1f1;
}
.list li:last-child {
	border-bottom-left-radius: .20rem;
   border-bottom-right-radius: .20rem;
   border-bottom: 1px solid #e6e6e6;
}
.list li:first-child {
   border-top-left-radius: .20rem;
   border-top-right-radius: .20rem;
}
.list li.active,
.list li.active a {
	background: var(--blue);
	color: #fff;
    text-decoration: none;
    -webkit-transition: all .1s linear;
    transition: all .1s linear;
    -o-transition: all .1s linear;
}
.list li.active:hover {
    -webkit-transition: all .1s linear;
    transition: all .1s linear;
    -o-transition: all .1s linear;
    opacity: .9;
}
.list li a {
	margin: -1rem;
	display: block;
	padding: 1rem;
    text-decoration: none;
}
.list li a:hover {
    text-decoration: none;
}
.pagination {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
}
.pagination li {
	float: left;
}
.pagination li.active a {
	background: var(--blue);
	color: #fff;
}
.pagination li a {
    position: relative;
    display: block;
    padding: .5rem .75rem;
    margin-left: -1px;
    line-height: 1.25;
    color: var(--blue);
    background-color: #fff;
    border: 1px solid #dee2e6;
}
.pagination li a:hover {
	background: #f1f1f1;
	text-decoration: none;
}
.pagination li.active a:hover {
	background: var(--blue);
	opacity: .8;
}
.video {
    position: relative;
    padding-bottom: 56.25%; /* 16:9 */
    padding-top: 25px;
    height: 0;
    overflow: hidden;
}
.video iframe,
.video object {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.screen-s-v {
    display: none;
}




/*Elements responsive*/
@media all and (max-width: 1120px) {

.container {
	max-width: 1000px;
	margin: 0 auto; 
}

}

@media all and (max-width: 750px) {
.navbar-button {
	display: block;
}
.navbar-list {
	display: none;
    width: 100%;
}
.navbar ul li {
	float: none;
}
.navbar ul li a {
	width: 100%;
}
.navbar ul li ul {
	display: block;
	position: relative;
    border: none;
}
.navbar ul li ul li a {
	padding-left: 34px;
}
.navbar .logo {
	padding-left: 15px;
}
/*.row {
	margin: 0; 
}*/
.modal {
	width: 100%;
    left: 0;
    top: 0;
    transform: unset;
    margin: 0;
}
.slider .slider-control {
    font-size: 15px;
}
.screen-s-h {
    display: none !important;
}
.screen-s-v {
    display: block !important;
}
.accordion .panel-open {
    display: none;
}


}
/* Columns responsive */
@media all and (min-width: 651px) {
.col-m-12 {
    width: 100%;
}
.col-m-11 {
	width: 91.66666667%;
}
.col-m-10 {
	width: 83.33333333%;
}
.col-m-9 {
	width: 75%;
}
.col-m-8 {
	width: 66.66666667%;
}
.col-m-7 {
	width: 58.33333333%;
}
.col-m-6 {
	width: 50%;
}
.col-m-5 {
	width: 41.66666667%;
}
.col-m-4 {
	width: 33.33333333%;
}
.col-m-3 {
	width: 25%;
}
.col-m-2 {
	width: 16.66666667%;
}
.col-m-1 {
	width: 8.33333333%;
}
}
@media all and (min-width: 1120px) {
.col-l-12 {
    width: 100%;
}
.col-l-11 {
	width: 91.66666667%;
}
.col-l-10 {
	width: 83.33333333%;
}
.col-l-9 {
	width: 75%;
}
.col-l-8 {
	width: 66.66666667%;
}
.col-l-7 {
	width: 58.33333333%;
}
.col-l-6 {
	width: 50%;
}
.col-l-5 {
	width: 41.66666667%;
}
.col-l-4 {
	width: 33.33333333%;
}
.col-l-3 {
	width: 25%;
}
.col-l-2 {
	width: 16.66666667%;
}
.col-l-1 {
	width: 8.33333333%;
}
}