body{font-family: 'THSarabunNew';font-size: 20px;}
a{font-size: 20px;}
p{font-size: 20px;}
li,ul {font-size: 20px;}
.h1, h1{font-size: 45px;}
.h2, h2{font-size: 40px;}
.h3, h3{font-size: 35px;}
.h4, h4{font-size: 30px;}
.h5, h5{font-size: 25px;}
.h6, h6{font-size: 20px;}
label {font-size: 20px;}
span{font-size: 20px;}
div{font-size: 20px;}
li.knowldedgedata>span>* {
text-decoration-thickness: 1px !important;
}
.displayfiexandwrap{display: flex; flex-wrap: wrap;}
/*ฟอนคอร์สเรียน*/
.wpb_wrapper p{font: 18px/1.6 THSarabunNew;}
.wpb_wrapper h2{ margin: 0 0 1.4rem;}
h1, .h1, h2, .h2, h3, .h3 {
margin-top: 0px;
margin-bottom: 30px; }
.dropdown-toggle::after{vertical-align: 0px!important;}
/*เฮดเดอร์ปุ่มซัพเมนู*/
option{
color:#193b54;
}
.dropdown-menu > li > a {
width: 250px;
padding: 10px 8px;
/* background: rgba(255, 255, 255,0.95);*/
background: rgba(72, 205, 158,0.95);
color: #193b54;
}
.dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus {
background-color: #48CD9E;
}
@media (min-width: 992px){
.dropdown-menu .dropdown-toggle:after{
border-top: .3em solid transparent;
border-right: 0;
border-bottom: .3em solid transparent;
border-left: .3em solid;
}
.dropdown-menu .dropdown-menu{
margin-left:0; margin-right: 0;
}
.dropdown-menu li{
position: relative;
background: rgba(255, 255, 255,0.95);
}
.nav-item .submenu{
display: none;
position: absolute;
left:99%; top:-7px;
}
.nav-item .submenu-left{
right:100%; left:auto;
}
.dropdown-menu > li:hover{ background-color: rgba(255, 255, 255,0.95) }
.dropdown-menu > li:hover > .submenu{
display: block;
}
}
.dropdown-menu{
transform: translate(0, 5px);
display: none;
transition: 5.5s;
border: 1px solid rgba(0, 0, 0, .0);
-webkit-box-shadow: none;
box-shadow: none;
}
/* li:hover > .dropdown-menu {
display: block;
transform: translate(0, 0px);
transition: 0.5s;
opacity: 1;
} */
/*เฮดเดอร์สมัครสมาชิกREGISTER*/
.registerheder{background: #193b54;
padding: 25px 10px;
border-radius: 15px 15px 15px 15px;
color: #ffcb59;
/* letter-spacing: 3px; */
text-shadow: 1px 1px 2px #8c5c2c;
}
input.padtop,textarea.padtop,select.padtop {padding-top: 20px; }
input.padtop26,textarea.padtop26,select.padtop26 {padding-top: 26px; }
.registerheder h3{margin: 0px;}
.registerheder span {color: #FFF;font-weight: 200;}
.mainpagregistercolor {
border: dashed #ffcd5c 5px;
padding: 15px;
border-radius: 15px;
background: #00ac7f8a
}
.mainpagregistercolor_information {
border: dashed #ffcd5c 5px;
padding: 15px;
border-radius: 15px;
background: #00ac7f8a
}
/*เฮดเดอร์สมัครสมาชิกREGISTERจบ*/
/*หน้าการ์ดโปรไฟล์ของนักเรียน*/
.mainhedermyprofile{
margin: 15px;
background: -webkit-gradient(radial, 50% 0, 254, 50% 0, 90, from(#fbcb5c), color-stop(0.49, #fbcb5c), color-stop(0.51, #01c1aa), to(#01c1aa));
padding: 0px 15px;
/* padding-bottom: 70px;*/
padding-top: 30px;
border-radius: 15px;
transition: 0.5s;
}
.mainhedermyprofile img div{text-align: center; display: grid;}
.mainhedermyprofile h4{color: #173b53;font-size: 20px;font-weight: bolder;line-height: 1.5;}
.mainhedermyprofile hr{margin: 15px 0px;border-top: solid #00ac7f 3px;}
.mainhedermyprofile p {color: #173b53}
/*********************** Demo - 1 *******************/
.box10:after,.box10:before,.box1:after,.box1:before,.box2 .inner-content:after,.box3:after,.box3:before,.box4:before,.box5:after,.box5:before,.box6:after,.box7:after,.box7:before{content:""}
.box1 .title,.box10 .title{letter-spacing:1px}
.box10 .title,.box11 .title{text-transform:uppercase}
.box10{box-shadow:0 0 3px rgba(0,0,0,.3)}
.box10 .icon li a{text-align:center}
.box10 .icon li a{line-height:35px;border-radius:50%}
.box10{background:#000;overflow:hidden;position:relative}
/* .box10:after, .box10:before{border-width:0 180px 140px;border-style:solid;border-color:transparent transparent #0d5f45;position:absolute;bottom:0;left:50%;z-index:1;transform:translate(-55%,100%);transition:all .5s 0s cubic-bezier(.6,-.28,.735,.045)}*/
.box10:after{border-width:150px 250px;border-color:transparent #00ac7f #00ac7f #00ac7f;top:60%!important;transform:translate(-60%,100%)}
.box10:hover:before{transition:all .4s 0s cubic-bezier(.175,.885,.32,1.275);transform:translate(-55%,0);transition-delay:.2s}
.box10:hover:after{transition:all .4s 0s cubic-bezier(.175,.885,.32,1.275);transform:translate(-60%,0);transition-delay:0s}
.box10 img{width:100%;height:auto;opacity:1;transition:all .5s ease 0s;aspect-ratio: 75/106;}
.box10:hover img{transform:scale(1.1) translateY(-3%);opacity:.4}
.box10 .box-content{
position: absolute;
top: 0;
left: 0;
opacity: 0;
z-index: 2;
transform: translateY(20%);
transition: all .5s ease 0s;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);}
.box10:hover .box-content{opacity:1;/*transform:translate(0)*/;transition-delay:.1s}
.box10 .title{font-size:23px;font-weight:800;color:#fff;text-align: center;}
.box10 .icon{padding:0;margin:0;list-style:none;display:none;}
.box10 .icon li{display:inline-block}
.box10 .icon li a{width:35px;height:35px;background:#18ab69;font-size:18px;color:#fff;margin-right:10px;transition:all .3s ease 0s}
.box10 .icon li a:hover{transform:rotate(360deg)}
@media only screen and (max-width:767px) and (min-width:600px){
.box10:before{border-width:0 250px 240px}
.box10:after{border-width:260px 460px}
}
@media only screen and (max-width:599px) and (min-width:430px)
{
.box:before{border-width:0 220px 120px}
.box10:after{border-width:260px 460px}
}
.learningvideooverlay{
background-color: #173b53;
-webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, .4);
box-shadow: 0 5px 15px rgba(0, 0, 0, .4);
}
.learningvideooverlay img{
-webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 1.5);
box-shadow: 0 5px 15px rgba(0, 0, 0, 1.5);
}
.learningvideooverlay p {color: #ffcd5c!important;margin-bottom: 0px;}
/*หนังเรียนเรียน*/
.courseliststylenot li {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
/*จัดหน้ากระดาษ*/
.flexdisplay {
display: -ms-flexbox;
display: flex;
-ms-flex-align: center;
align-items: center;
}
/* @media (max-width: 991px){
.flexdisplay {
display: -ms-block!important;
display: block!important;
-ms-flex-align: center!important;
align-items: center!important;
}
}*/
/*หน้าของ profile*/
.textleftmyprofile {
text-align: left;
padding-left: 15px;
padding-top: 15px;
}
@media (max-width: 991px) {
.textleftmyprofile {
text-align: left;
padding-top: 15px;
padding-left: 0px;
}
}
.tab .nav-tabs {
border-bottom: 0px solid #98c7bf;
background: #ffcd5c;
border-top-right-radius: 15px;
border-top-left-radius: 15px;
}
.tab .nav-tabs li a {
color: #fff;
padding: 10px 13px;
background: #98c7bf;
position: relative;
transition: all 0.3s ease 0s;
}
.tab .nav-tabs li a:hover {
background: #98c7bf;
opacity: 0.8;
}
.tab .nav-tabs li.active a {
opacity: 1;
}
.tab .nav-tabs li.active a,
.tab .nav-tabs li.active a:hover,
.tab .nav-tabs li.active a:focus {
color: #fff;
background: #98c7bf;
border: none;
text-shadow: 1px 1px 2px #000;
border-radius: 0;
}
.tab .nav-tabs li a:after {
border-left: 15px solid #98c7bf;
right: -15px;
}
.tab .nav-tabs li a i,
.tab .nav-tabs li.active a i {
display: inline-block;
padding-right: 5px;
font-size: 15px;
text-shadow: none;
}
.tab .nav-tabs li a span {
font-size: 14px;
letter-spacing: 2px;
transition: all 0.3s ease 0s;
}
.tab .nav-tabs li a:hover span,
.tab .nav-tabs li.active a span {
letter-spacing: 1px;
opacity: 1;
transition: all 0.3s ease 0s;
}
.tab .tab-content {
background: #fff;
font-size: 16px;
color: #6c6c6c;
line-height: 25px;
}
.tab .tab-content h3 {
font-size: 24px;
margin-top: 0;
}
.tab .nav-tabs div a,
.tab .nav-tabs div.active div a {
display: inline-block;
padding-right: 5px;
font-size: 15px;
text-shadow: none;
}
.tab .nav-tabs div a i,
.tab .nav-tabs div.active div a i {
padding-right: 5px;
}
.tab .nav-tabs div a:hover,
.tab .nav-tabs div a:focus {
color: #00ac7f;
position: relative;
transition: all 0.3s ease 0s;
}
.tab .nav-tabs div a {
letter-spacing: 1px;
color: #183a53;
transition: all 0.3s ease 0s;
padding: 10px 0px;
}
.checkmyprofile {
background: #98c7bf2a;
display: -ms-flexbox;
display: flex;
-ms-flex-align: center;
align-items: center;
}
@media screen and (max-width: 992px) {
.checkmyprofile {
text-align: right;
margin-bottom: .625em;
display: -ms-block;
display: block;
-ms-flex-align: center;
align-items: center;
}
}
.checkmyprofile div {
padding: 5px;
}
.checkmyprofile.hederfont div {
font-size: .85em;
letter-spacing: .1em;
text-transform: uppercase;
font-weight: 600;
}
@media screen and (max-width : 767px){/*.boxdashedradius div a img { width: 150px;*/
.buttonmyprofile{position: relative;}
.min767inlinebox{display: inline-flex;font-size: 10px;}
.min767inlinebox h4 {font-size: 12px;}
/*.mainhedermyprofile{padding-bottom: 0px;padding-top: 20px;background: -webkit-gradient(radial, 10% 30%, 169, -10% 70%, 90, from(#fbcb5c), color-stop(0.49, #fbcb5c), color-stop(0.51, #01c1aa), to(#01c1aa)); }*/
.mainhedermyprofile{margin-top: 15px; }
.teacher-image{ margin-right: 5px;
width: 140px;
height: auto;
margin-top: 0px;
margin-bottom: 15px;
}
}
.buttonmyprofile {
background-color: #1b3b54;
border: none;
color: #ffcd5c;
font-size: 18px;
padding: 10px;
transition: all 0.5s;
cursor: pointer;
font-weight: bolder;
width: 150px;
border-radius: 15px;
left: 0px;
position: relative;
float: right;
}
.buttonmyprofile:hover .glyphicon {
left: -25px;
color: #1b3b54;
}
.buttonmyprofile .glyphicon {
color: #FFF;
background: #ffcd5c;
border-radius: 50%;
padding: 13px;
width: 60px;
height: 60px;
left: -35px;
top: -8px;
position: absolute;
font-size: 30px;
transition: 0.5s;
}
.buttonmyprofile .glyphicon-play:before {
padding-left: 2px;
}
.teacher-image {
border-radius: 50%;
flex-shrink: 0;
width: 160px;
height: 160px;
border: #fbcb5c 5px solid;
}
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px) {
.teacher-image {width: 100%;height: auto;}
.textleftmyprofile{padding-left: 15px;}
.mainhedermyprofile{margin: 0px;
margin-top: 15px;}
}
@media screen and (min-width: 768px) and (max-width: 991px){
.buttonmyprofile{position: relative;}
.min767inlinebox{font-size: 12px;}
}
@media screen and (max-width:767px){.buttonmyprofile{position: relative;}}
.boxdashedradius{
padding: 15px;
margin: 15px;
border: dashed #ffF 5px;
border-radius: 15px;
}
.boxdashedradius1{
padding: 5px;
margin: 10px;
border: dashed #ffF 2px;
border-radius: 15px;
}
/*เฮดเดอร์หน้าhome*/
.homeheder{
background: #193b54;
padding: 10px;
border-radius: 15px 15px 15px 15px;
color: #ffcb59;
text-shadow: 1px 1px 2px #8c5c2c;
/* letter-spacing: 3px; */
}
.homeheder1{
background: #193b54;
padding: 15px;
font-size: 18px;
border-radius: 15px 15px 15px 15px;
color: #ffcb59;
text-shadow: 1px 1px 2px #8c5c2c;
}
/*ปุ่มสไตล์ของพื้นหลัง*/
/* .scallop-down{
height: 100px;
width: 100%;
background: -webkit-gradient(radial, 50% 0, 10, 50% 0, 40, from(#ffcd5c), color-stop(0.49, #ffcd5c), color-stop(0.51, #f7f2de), to(#f7f2de));
-webkit-background-size: 49px 100%;
}
.scallop-up{
height: 100px;
width: 100%;
background: -webkit-gradient(radial, 50% 100%, 10, 50% 100%, 40, from(#ffcd5c), color-stop(0.49, #ffcd5c), color-stop(0.51, #f7f2de), to(#f7f2de));
-webkit-background-size: 49px 100%;
}*/
/*ปุ่มเปิดเพื่อดูเพิ่มเติม
*/
.iconcolorffcd5c p {color: #4ccc9c;
/* letter-spacing: 2px; */
position: absolute;
right: 40px;
top: 12px;
margin: 0px;}
.iconcolorffcd5c{fill:#ffcd5c;transition: 0.5s ;}
.iconcolorffcd5c p{transition: 0.5s;cursor: pointer}
.iconcolorffcd5c svg{fill: #4ccc9c;transition: 0.5s;}
.iconcolorffcd5c:hover svg {fill: #ffcb59;}
.iconcolorffcd5c:hover p {color: #ffcb59;}
/*หน้าhomeหน้าแรก*/
.pictutoronly{border-radius: 25em;border: #00ac7f solid 5px;}
.title-play-center p strong{
color: #193b54;
list-style: none;
padding: .7em 15px;
display: block;
text-align: center;
font-size: 24px;
}
.title-play-center p {
line-height: 1.25;
color: #193b54;
list-style: none;
text-align: center;
font-weight: bolder;
}
.topright {position: absolute;left: 0px;z-index: 100;top: -15px; width: 70px; animation: mymove 2s infinite;
animation-timing-function: linear;}
@keyframes mymove {
0% { transform: scale(1.2,1.2); /* Standard syntax */}
25% { transform: scale(1.3,1.3); /* Standard syntax */}
50% { transform: scale(1.5,1.5); /* Standard syntax */}
75% { transform: scale(1.3,1.3); /* Standard syntax */}
100% { transform: scale(1.2,1.2); /* Standard syntax */}
}
@media screen and (max-width: 1024px){
}
.namecoure {
-webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, .5);
box-shadow: 0 5px 15px rgba(0, 0, 0, .2);
}
/*
รู้จักกับครูฝ้าย
*/
@media screen and (width: 1024px){
.flexdisplayonlyipad{display: -ms-flexbox;display: flex;-ms-flex-align: center; align-items: center;}
}
@media screen and (width: 768px){
.fontstyletutorathome {font: 8.5px/0.5 'THSarabunNew'!important;
font-weight: 600;
/* letter-spacing: 0.5px; */
}
.flexdisplayonlyipad{
font: 24px/1.0 'THSarabunNew';
font-weight: 600;
/* letter-spacing: 0.5px; */
color: #193b54;}
}
.fontstyletutorathome {
font: 14.5px/1.0 'THSarabunNew';
font-weight: 600;
/* letter-spacing: 0.5px; */
color: #193b54;}
.boxfontatabout1{font-weight: 600;letter-spacing: 0.5px;padding-left: 15px;}
@media only screen and (min-device-width : 992px) and (max-device-width : 1299px)
{
.boxfontatabout1{font: 11.5px/1 'THSarabunNew';font-weight: 600;letter-spacing: 0.5px;color: #193b54;}
}
@media screen and (min-width: 768px) and (max-width: 991px)
{
.boxfontatabout1 {font: 13.5px/1 'SukhumvitSet-Text'}
}
@media (max-width: 991px)
{
.boxfontatabout1 {font: 10.5px/1 'THSarabunNew';font-weight: 600;color: #193b54;}
.boxfontatabout1 p {line-height: 1.10em!important;margin-bottom: 5px;font-size: 20px;}
}
@media (max-width: 767px){
.boxfontatabout1 {
font: 14.5px/1.0 'THSarabunNew';
font-weight: 600;
letter-spacing: 0.5px;
color: #193b54;
padding-left: 0px;}
}
.hedermaintextinabout {
background-color: #ffcd5c;
padding: 5px 10px;
line-height: 1.5;
border-radius: 15px 15px 15px 15px;
}
/*popupรีวิว*/
.one {
position: fixed;
top: -100%;
left: 0;
width: 100%;
height: 100%;
transition: all .1s ease-in-out;
-moz-transition: all .1s ease-in-out;
-webkit-transition: all .1s ease-in-out;
-ms-transition: all .1s ease-in-out;
z-index: 1000;
}
.overlay {
background: rgba(72, 205, 158,0.95);
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.overlay2 {
background: rgba(0, 0, 0, 0);
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.middle {
position: relative;
width: 100%;
height: 100%;
top: -100%;
transition: all .5s ease-in-out;
-moz-transition: all .5s ease-in-out;
-webkit-transition: all .5s ease-in-out;
-ms-transition: all .5s ease-in-out;
}
.reviewtwo {
position: absolute;
vertical-align: middle;
margin: auto;
width: 100%;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
height: auto;
}
@media (max-width: 767px){
.boxfontatabout1 p {
line-height: 2em!important;
margin-bottom: 10px;
font-size: 20px;
/*background: -webkit-linear-gradient(45deg, #00ac7f, #193b54 50%);
-webkit-text-fill-color: transparent;*/
}
}
/*ปุ่มรีวิวสมัครแบบลอยติดตามหน้าจอ*/
.showinreview:hover,.showinreview:focus {
background: #FFF;
cursor: pointer;
border: none;
box-shadow: 0 0 0 10px #FFF;
margin-bottom: 5px;
}
.showinreview {
position: fixed;
bottom: 30px;
left: 30px;
z-index: 1000;
color: #193b54;
box-shadow: 0 0 10px #4ccc9c;
cursor: pointer;
}
/*บ้านรีวิวเด็กๆที่มีปุ่มสมัครให้กด*/
.gallery {
column-gap: 0px;
-webkit-column-count: 3;
-moz-column-count: 3;
column-count: 3;
-webkit-column-width: 33%;
-moz-column-width: 33%;
column-width: 33%; }
.gallery .pics {
-webkit-transition: all 350ms ease;
transition: all 350ms ease; }
.gallery .animation {
-webkit-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
transition: 1.5s
}
@media (max-width: 450px) {
.gallery {
-webkit-column-count: 2;
-moz-column-count: 2;
column-count: 2;
-webkit-column-width: 100%;
-moz-column-width: 100%;
column-width: 100%;
transition: 1.5s;
}
}
@media (max-width: 400px) {
.btn.filter {
padding-left: 1.1rem;
padding-right: 1.1rem;
}
}
/*เฮดเดอร์ประโยคฯลฯ+ครูฝ้าย*/
.row-header-title{
background: #193b54;
padding: 15px 10px;
border-radius: 15px 15px 15px 15px;
color: #ffcb59;
/* letter-spacing: 3px; */
text-shadow: 1px 1px 2px #8c5c2c;
font-weight: 600;
}
/*หน้ารู้จักกับครูฝ้าย*/
.title-play-center-tutor p {line-height: 1.69em;margin-bottom: 0px;}
@media (max-width: 767px){
.flexdisplaybox {display: -ms-block!important;
display: block!important;
-ms-flex-align: center!important;
align-items: center!important;}
}
/*ข้อดีเมื่อเรียนกับครูฝ้าย*/
.title-play-center .maginintext{margin: 0px 30px;}
@media (max-width: 991px){
.title-play-center-tutor{text-align: left!important}
/* .pan15 {padding-left: 0px!important;}*/
}
.pan15x {padding: 15px 0px;}
.pan15y {padding: 0px 15px;}
.flexdisplaybox
{display: -ms-flexbox;
display: -webkit-box;
-ms-flex-align: center;
align-items: center;}
.lolomoRow.lolomoRow_title_card .rowTitle{ margin: 0px;}
/*หน้าล็อคอิน*/
.signup-form{
background: #00ac7f8a;
margin: 0 auto;
box-shadow: 0px 15px 16.83px 0.17px rgba(0, 0, 0, 0.05);
-moz-box-shadow: 0px 15px 16.83px 0.17px rgba(0, 0, 0, 0.05);
-webkit-box-shadow: 0px 15px 16.83px 0.17px rgba(0, 0, 0, 0.05);
-o-box-shadow: 0px 15px 16.83px 0.17px rgba(0, 0, 0, 0.05);
-ms-box-shadow: 0px 15px 16.83px 0.17px rgba(0, 0, 0, 0.05);
border-radius: 20px;
-moz-border-radius: 20px;
-webkit-border-radius: 20px;
-o-border-radius: 20px;
-ms-border-radius: 20px;
padding: 40px;
border-bottom-right-radius: 1em;
border-bottom-left-radius: 1em;
margin-bottom: 5px;
}
.mainbuttonfullpagelogin{
width: auto;
height: 50px;
background-color: #ffcd5c;
color: #193b54;
cursor: pointer;
display: inline-block;
border: 0px;
font-weight: 700;
border-radius: 15px;
}
.mainregfullpagelogin{
background: #ffcd5c;
margin: 0 auto;
box-shadow: 0px 15px 16.83px 0.17px rgba(0, 0, 0, 0.05);
-moz-box-shadow: 0px 15px 16.83px 0.17px rgba(0, 0, 0, 0.05);
-webkit-box-shadow: 0px 15px 16.83px 0.17px rgba(0, 0, 0, 0.05);
-o-box-shadow: 0px 15px 16.83px 0.17px rgba(0, 0, 0, 0.05);
-ms-box-shadow: 0px 15px 16.83px 0.17px rgba(0, 0, 0, 0.05);
padding: 20px 60px;
border-bottom-right-radius: 20px;
border-bottom-left-radius: 20px;
}
/*ปุ่มอัพโหลดสลปแจ้งชำระเงิน*/
/* .waves-effect {
position: relative;
overflow: hidden;
cursor: pointer;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-webkit-tap-highlight-color: transparent;
}*/
.file-field .file-path-wrapper {
padding-left: 10px;
overflow: hidden;
}
.btnuploadpayment {
background-color: #ffcd5c !important;
margin: 0rem;
color: inherit;
width: 120px;
text-transform: uppercase;
word-wrap: break-word;
white-space: normal;
cursor: pointer;
border: 0;
border-radius: .125rem;
/*-webkit-box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16), 0 2px 10px 0 rgba(0,0,0,0.12);
box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16), 0 2px 10px 0 rgba(0,0,0,0.12);*/
-webkit-transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,-webkit-box-shadow .15s ease-in-out;
transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,-webkit-box-shadow .15s ease-in-out;
transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out,-webkit-box-shadow .15s ease-in-out;
}
.file-field input[type="file"] {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
width: 100%;
padding: 0;
margin: 0;
cursor: pointer;
filter: alpha(opacity=0);
opacity: 0;
}
.file-field input.file-path {
width: 100%;
height: 40px;
}
.md-form .validate {
margin-bottom: 2.5rem;
}
/*css หน้ารีวิวแบ่งภาพ*/
.pics.animation{padding: 5px;}
/*คอร์สตกแต่งพื้นหลังเพิ่มเติม */
.section-bubble, .section-bubble1, .section-bubble2, .section-bubble3, .section-bubble4, .section-bubble5, .section-bubble_type-a, .section-bubble_type-b {
margin-bottom: 20vw;
position: relative;
}
.section-bubble:after, .section-bubble1:after, .section-bubble2:after, .section-bubble3:after, .section-bubble4:after, .section-bubble5:after, .section-bubble_type-a:after, .section-bubble_type-b:after {
content: '';
position: absolute;
bottom: 0;
width: 100%;
height: 20vw;
background: url(csskrufai.css) green;
background-size: 100%;
transform: translate(0, 100%);
border-bottom: #ffcd5c 1px solid;
border-top: #f7f2de 0px solid;
}
.section-bubble1 {
background-color: #ffcd5c;
}
.section-bubble1:after {
background-color: #f7f2de;
background-image: url("data:image/svg+xml;utf8,");
}
.section-bubble2 {
background-color: #ffcd5c;
}
.section-bubble2:after {
background-color: #ffcd5c;
background-image: url("data:image/svg+xml;utf8,");
}
.section-bubble5 {
background-color: #ffcd5c;
}
.section-bubble5:after {
background-color: #ffcd5c;
background-image: url("data:image/svg+xml;utf8,")
/* background-image: url("data:image/svg+xml;utf8,");*/
}
.section-bubble3 {
background-color: #384364;
}
.section-bubble3:after {
background-color: #ffcd5c;
background-image: url("data:image/svg+xml;utf8,")
;
}
.section-bubble3 h1 {
color: white;
}
.section-bubble3 p {
color: white;
opacity: .8;
}
.section-bubble4 {
background-color: #cccccc;
}
.section-bubble4:after {
background-color: #333333;
background-image: url("data:image/svg+xml;utf8,");
}
.section-bubble_type-a:after {
background-image: url("data:image/svg+xml;utf8,");
}
.section-bubble_type-b:after {
background-image: url("data:image/svg+xml;utf8,");
}
/*คัสตอมปุ่มกดสไลด์*/
.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet{background : #FE3A3B!important;}
/*หน้าไฟล์วิดิโอเรียน*/
.vjs-playlist-duration{font-size:12px}
.vjs-playlist .vjs-playlist-duration {
background-color: rgba(26,26,26,.8);
left: 0;
padding: 0px 3px;
position: absolute;
top: 0;
}
.curenttime {
background: #F00;
height: 5px;
bottom: 35px;
position: absolute;
}
/*หน้าเล่นวิดิโอเรียน*/
/* Customize website's scrollbar like Mac OS
Not supports in Firefox and IE */
/*
โมสกอบาร์เป็นรูปแบบธีมเวป*/
/* total width */
.scrollbar {
/* height: 75vh;*/
/* width: 25vw;*/
min-width: auto;
/*background: #fff;*/
overflow-y: scroll}
.scrollbar::-webkit-scrollbar {
/* background-color:#fff;*/
width:5px
}
/* background of the scrollbar except button or resizer */
/*.scrollbar::-webkit-scrollbar-track {
background-color:#fbcb5c
}*/
/*.scrollbar::-webkit-scrollbar-track:hover {
background-color:#f4f4f4
}*/
/* scrollbar itself */
.scrollbar::-webkit-scrollbar-thumb {
background-color:#00ac7f2a;
border-radius:16px;
border:5px solid #fff
}
.scrollbar::-webkit-scrollbar-thumb:hover {
background-color:#98c7bf;
border:4px solid #f4f4f4
}
/* set button(top and bottom of the scrollbar) */
.scrollbar::-webkit-scrollbar-button {display:none}
/*โมสกอบาร์เป็นรูปแบบธีมเวป*/
.newplayer {
cursor: pointer;
font-size: 20px;
margin-bottom: -5px;
padding: 0px 3px;
color: #FFF;
margin-left: 15px;
margin-left: 5px;
}
/*ปรับขนาดดูวิดิโอ*/
.video-container {
position: relative;
padding-bottom: 56.25%;
padding-top: 30px;
height: 0;
overflow: hidden;
}
.video-container iframe,
.video-container object,
.video-container embed,
.video-container video{
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.timedataplayvideo{
float: right;
font-size: 8px;
color: #FFF;
background: #4ccc9c;
letter-spacing: 3px;
display: inline-grid;
padding: 5px;
border-radius: 6px;
}
.numberplayvideo{
color: #173b53;
margin-top: 10px;
text-align: center;
}
.vjs_video_3-dimensions{
width: auto;
}
.vjs-mouse.vjs-playlist .vjs-playlist-thumbnail img {
width: 121px;
}
ol.vjs-playlist.vjs-csspointerevents.vjs-mouse {
padding-left: 0px;
}
.vjs-mouse.vjs-playlist p.vjs-playlist-item.vjs-selected.active {
color: #4ccc9c;
}
/*.vjs-mouse.vjs-playlist li.vjs-playlist-item.vjs-selected {
}
.vjs-mouse.vjs-playlist li.vjs-playlist-item:first-child {
}
.vjs-mouse.vjs-playlist li.vjs-playlist-item {
padding-right: 12px;
margin-bottom: 0;
}*/
.vjs-mouse.vjs-playlist .vjs-playlist-item {
/* height: 67.5px;*/
margin-bottom: 17px;
}
.vjs-playlist .vjs-playlist-item {
/* height: 56px;*/
margin-bottom: 14px;
}
.vjs-playlist .vjs-playlist-item {
cursor: pointer;
overflow: hidden;
position: relative;
}
user agent stylesheet
li {
display: list-item;
text-align: -webkit-match-parent;
}
.vjs-mouse.vjs-playlist {
min-width: 100%;
padding: 0;
margin: 0;
}
.vjs-mouse.vjs-playlist {
font-size: 11px;
}
.vjs-playlist {
color: #193b54;
}
.vjs-playlist {
list-style-type: none;
overflow: auto;
position: relative;
}
.vjs-mouse.vjs-playlist p {
height: initial;
font-weight: bold;
padding-top: 8px;
color: #000;
}
.vjs-playlist .vjs-playlist-duration {
background-color: rgba(26,26,26,.8);
left: 0;
padding: 0px 3px;
position: absolute;
top: 0;
color: #FFF;
}
.vjs-mouse.vjs-playlist li.vjs-playlist-item.vjs-selected.menu-active p {
color: white;
border-bottom: #FFF 1px solid;
}
.vjs-mouse.vjs-playlist li.vjs-playlist-item:hover .vjs-playlist-thumbnail:before {
height: 2.5em;
width: 2.5em;
color: rgba(255,255,255,.75);
background-color: transparent;
border: .19999em solid rgba(255,255,255,.75);
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
-ms-border-radius: 50%;
border-radius: 50%;
}
.vjs-mouse.vjs-playlist li.vjs-playlist-item:hover .vjs-playlist-thumbnail:before {
height: 2.5em;
width: 2.5em;
color: rgba(255, 255, 255, 0.75);
background-color: transparent;
border: 0.19999em solid rgba(255, 255, 255, 0.75);
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
-ms-border-radius: 50%;
border-radius: 50%;
}
.vjs-mouse.vjs-playlist .vjs-playlist-item:hover .vjs-playlist-thumbnail:before {
content: '\f101';
border-radius: 5px;
font-family: VideoJS;
height: 34px;
left: 40.5px;
line-height: 34px;
top: 13px;
width: 40px;
}
.vjs-playlist .vjs-playlist-thumbnail:before {
display: block;
position: absolute;
background-color: rgba(26,26,26,.5);
text-align: center;
}
.demo{ background: #ffded7; }
a:hover,a:focus{
outline: none;
text-decoration: none;
}
/*
* STYLE 9
*/
.marginbottom5 li{margin-bottom: 5px;}
#comment {width: 100% ; margin-top: 10px;
border-radius: 15px;
border: 1px solid #787878;
padding: 5px 5px 5px 10px;
height: 70px;
-webkit-transition: 0.2s;
transition: 0.2s;
box-sizing: border-box;
resize: none;}
/*ปุ่มอนิเมชั่นขยับอยู่หน้าคอมเม้นและดาวโหลด*/
.commentbutton {/*width: 160px;*/
color: #fff;
font-size: 18px;
padding: 10px;
padding-top: 7px;
-webkit-transition: 0.5s;
transition: 0.5s;
cursor: pointer;
border-radius: 15px;
border: none;
background: #ffcd5c;
margin-top: 10px;
box-shadow: 0px 5px 0px 0px #ffcd5c9a;
}
.commentbutton:hover {
box-shadow: none;
-webkit-transform: translateY(5px);
transform: translateY(5px);
-webkit-transition: all .1s linear;
transition: all .1s linear;
}
.comment {
display: -webkit-box;
display: flex;
}
.comment {
padding: 10px 10px;
margin: 10px 0px;
color: #fff;
background: #98c7bf2a;
}
.commentPic {
max-width: 45px;
max-height: 45px;
margin-right: 15px;
}
.commentBody {
max-width: 580px;
overflow-wrap: break-word;
}
.commentHeader {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
}
.publishDate {
color: #787878;
margin-left: 15px;
font-size: 11px;
line-height: 16px;
font-weight: 700;
}
.commentAuthor{color: #6f6f6f}
.commentContent{ font-size: 11px;
line-height: 16px;
font-weight: 700;
color: #6f6f6f;}
/*ปุ่มอนิเมชั่นขยับอยู่หน้าคอมเม้นและดาวโหลด*/
/*ฟิตหน้าดูไฟล์เรียน
*/ .maxheghtcomment{height: 287px;
overflow: scroll;
scrollbar-width: none;
-ms-overflow-style: none;
overflow-y: scroll;
overflow-x: hidden;
scrollbar-width: none}
.font16{color: #000}
/*tabเลือกเมนู4หัวข้อ*/
@media (max-width: 991px){
.tab .nav-tabs li a i, .tab .nav-tabs li.active a i{
font-size:8px!important;
}
.tab .nav-tabs li a span {
font-size:8px!important;
}
}
.tab .nav-tabs{
/* padding-left: 15px;*/
border-bottom: 0px solid #173b53 ;
background: #173b53;
border-top-right-radius: 15px;
border-top-left-radius: 15px;
}
.tab .nav-tabs li a:hover{
opacity: 0.8;
}
.tab .nav-tabs li.active a{
opacity: 1;
}
.tab .nav-tabs li.active a,
.tab .nav-tabs li.active a:hover,
.tab .nav-tabs li.active a:focus{
border: none;
text-shadow: 1px 1px 2px #000;
border-radius: 0;
}
.tab .nav-tabs div a {
color: #fff;
padding: 10px 0px;
background: transparent;
position: relative;
transition: all 0.3s ease 0s;
font-size: 1.5rem;
}
.tab .nav-tabs div a:hover,.tab .nav-tabs div a:focus {
color: #ffcd5c;
position: relative;
transition: all 0.3s ease 0s;
}
.folder .foldervideoplay div a{
background: transparent!important;
}
.foldervideoplay > .row {background-color: #ffcd5c;}
.tab-content .tabs > .row {background-color: #ffcd5c;}
/*.tab-pane > .row > .col-md-12.col-sm-12.col-xs-12{background-color: #ffcd5c;}*/
/*#Section1 > .row {background: #00ac7f8a;border-bottom-right-radius: 15px;
border-bottom-left-radius: 15px;}*/
#Section2 {color: #173b53;
font: 14.5px/2.5 'THSarabunNew';
font-weight: 600;
letter-spacing: 0.5px;
color: #193b54;}
#Section3 , #Section3 a{color: #173b53;
font: 14.5px/2.5 'THSarabunNew';
font-weight: 600;
letter-spacing: 0.5px;
color: #193b54;}
#Section4 {color: #173b53;
font: 14.5px/2.5 'THSarabunNew';
font-weight: 600;
letter-spacing: 0.5px;
color: #193b54;}
.playvideomaxheight p {color: #FFF; font-size: 1.5rem;}
.foldervideoplay > .col-md-12.col-sm-12.col-xs-12 > div > .row{
border-right: dashed #ffF 2px;
border-left: dashed #ffF 2px;
}
.scrollbar.playvideomaxheight > .row > div {padding: 5px 0px;}
.fontsizefolder {color: #FFF;margin: 0px 0.5rem;}
/*ฟิตหน้าเรียนของipad*/
.playvideomaxheight{
min-height: 270px;
max-height: 400px;
overflow: scroll;
scrollbar-width: none;
-ms-overflow-style: none;
overflow-y: scroll;
overflow-x: hidden;
scrollbar-width: none;
}
/*.glyphicon-folder-open:before{content: "\e117";}
.folder .foldervideoplay div.active a i{content: "\e118"!important;}*/
@media screen and (max-width: 884px)
{
.fontsizefolder{font-size: 1rem!important}
.playvideomaxheight p{font-size: 1rem!important}
/*.tab-pane.fade h4{font-size: 8px!important;}*/
.vjs-playlist-duration{font-size: 8px!important;}
.folder .foldervideoplay div.active a i {font-size: 20px!important;transition: 0.5s!important;}
.folder .foldervideoplay div a i {font-size: 20px!important;transition: 0.5s!important;}
.vjs-playlist-item .vjs-selected {margin: 0px!important;}
.vjs-playlist-name{font-size: 1rem!important;}
}
@media only screen
and (min-device-width : 992px)
and (max-device-width : 1299px)
{
.playvideomaxheight {
min-height: 265px;
max-height: 400px;
overflow: scroll;
scrollbar-width: none;
-ms-overflow-style: none;
overflow-y: scroll;
overflow-x: hidden;
scrollbar-width: none;
}
/*.boxdashedradius {
border: none;
padding: 0px;
}*/}
@media screen and (min-width: 768px) and (max-width: 991px){
.playvideomaxheight {
min-height: 132px;
max-height: 400px;
overflow: scroll;
scrollbar-width: none;
-ms-overflow-style: none;
overflow-y: scroll;
overflow-x: hidden;
scrollbar-width: none;
}
/*.boxdashedradius {
border: none;
padding: 0px;
}*/
}
@media screen and (max-width: 767px){
.chanepading767{padding-left:0px!important;
padding-top: 0px!important;}
.playvideomaxheight{max-height: 600px; overflow: auto;}
.maxheghtcomment{height: auto!important;}
}
/*หน้าดูยูทูป*/
.playvideomaxheightyouture{
min-height: 270px;
max-height: 456px;
overflow: scroll;
scrollbar-width: none;
-ms-overflow-style: none;
overflow-y: scroll;
overflow-x: hidden;
scrollbar-width: none;
}
@media only screen
and (min-device-width : 992px)
and (max-device-width : 1299px)
{
.playvideomaxheightyouture {
min-height: 265px;
max-height: 380px;
overflow: scroll;
scrollbar-width: none;
-ms-overflow-style: none;
overflow-y: scroll;
overflow-x: hidden;
scrollbar-width: none;
}
/*.boxdashedradius {
border: none;
padding: 0px;
}*/}
@media screen and (min-width: 768px) and (max-width: 991px){
.playvideomaxheightyouture {
min-height: 132px;
max-height: 300px;
overflow: scroll;
scrollbar-width: none;
-ms-overflow-style: none;
overflow-y: scroll;
overflow-x: hidden;
scrollbar-width: none;
}
/*.boxdashedradius {
border: none;
padding: 0px;
}*/
}
@media screen and (max-width: 767px){
.playvideomaxheightyouture{max-height: none; overflow: auto;}
}
.tab .nav-tabs li a:before,
.tab .nav-tabs li a:after{
content: "";
border-top: 42px solid transparent;
position: absolute;
top: -2px;
}
.tab .nav-tabs li a:before{
border-right: 15px solid #98c7bf ;
left: -15px;
}
.tab .nav-tabs li a:after{
border-left: 15px solid #98c7bf ;
right: -15px;
}
.tab .nav-tabs li a i,
.tab .nav-tabs li.active a i{
display: inline-block;
padding-right: 5px;
font-size: 15px;
text-shadow: none;
}
.tab .nav-tabs li a span{
/*font-size: 14px;
letter-spacing: 2px;*/
transition: all 0.3s ease 0s;
}
.tab .nav-tabs li a:hover span,
.tab .nav-tabs li.active a span{
letter-spacing: 1px;
opacity: 1;
transition: all 0.3s ease 0s;
}
.tab .tab-content{
background: #fff;
font-size: 16px;
color: #6c6c6c;
line-height: 25px;
}
.tab .tab-content h3{
font-size: 24px;
margin-top: 0;
}
.fontsizehedderinvideo{
text-align: center;
padding: 0px; font-size: 12px;font-weight: 900;
}
.modal-content .previous {
display: inline;
float: left;
text-decoration: none;
font-size: 30px;
color: #173b53;
font-weight: bolder
}
.modal-content .next {
display: inline;
float: right;
color: #173b53;
font-size: 30px;
font-weight: bolder;
text-decoration: none;}
/* บทความ*/
.displayforknowledge{display: flex;margin-top: 12px}
.mainpagknowcolor{
border: dashed #ffcd5c 2px;
padding: 15px;
border-radius: 15px;
background: #FFF;
}
.knowldedgedata{font-weight: 700;background: #f9e6bc; color:#193b54;}
.namecoure .knowldedgedata { background: rgba(72, 205, 158,0.95);}
.namecoure.knowledgeonline > .knowldedgedata {background: #000}
@media screen and (max-width: 479px) and (min-width: 320px){
.show_catlist img {
width: 100% !important;
height: auto !important;
margin: 0 !important;
}}
.show_catlist img {height:401px; margin:10px; width:600px}
/*สีของกรอบหน้าดูข้อมูลนักเรียน*/
.mainmyprofilecolor {background: #00ac7f8a; border-bottom-right-radius: 15px; border-bottom-left-radius: 15px;}
/*หน้าเมนูมือถือมุมซ้ายบน*/
.sidebar .wrapper {
background-color: #f7f2de;
/*background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' height='100%25' viewBox='0 0 1200 800'%3E%3Cdefs%3E%3ClinearGradient id='a' gradientUnits='userSpaceOnUse' x1='600' y1='25' x2='600' y2='777'%3E%3Cstop offset='0' stop-color='%23f7f2de'/%3E%3Cstop offset='1' stop-color='%234ccc9c'/%3E%3C/linearGradient%3E%3ClinearGradient id='b' gradientUnits='userSpaceOnUse' x1='650' y1='25' x2='650' y2='777'%3E%3Cstop offset='0' stop-color='%23f4f2d0'/%3E%3Cstop offset='1' stop-color='%234ccc9c'/%3E%3C/linearGradient%3E%3ClinearGradient id='c' gradientUnits='userSpaceOnUse' x1='700' y1='25' x2='700' y2='777'%3E%3Cstop offset='0' stop-color='%23eaf0c3'/%3E%3Cstop offset='1' stop-color='%234ccc9c'/%3E%3C/linearGradient%3E%3ClinearGradient id='d' gradientUnits='userSpaceOnUse' x1='750' y1='25' x2='750' y2='777'%3E%3Cstop offset='0' stop-color='%23dcecb5'/%3E%3Cstop offset='1' stop-color='%234ccc9c'/%3E%3C/linearGradient%3E%3ClinearGradient id='e' gradientUnits='userSpaceOnUse' x1='800' y1='25' x2='800' y2='777'%3E%3Cstop offset='0' stop-color='%23cae9a8'/%3E%3Cstop offset='1' stop-color='%234ccc9c'/%3E%3C/linearGradient%3E%3ClinearGradient id='f' gradientUnits='userSpaceOnUse' x1='850' y1='25' x2='850' y2='777'%3E%3Cstop offset='0' stop-color='%23b6e59a'/%3E%3Cstop offset='1' stop-color='%234ccc9c'/%3E%3C/linearGradient%3E%3ClinearGradient id='g' gradientUnits='userSpaceOnUse' x1='900' y1='25' x2='900' y2='777'%3E%3Cstop offset='0' stop-color='%239ee18d'/%3E%3Cstop offset='1' stop-color='%234ccc9c'/%3E%3C/linearGradient%3E%3ClinearGradient id='h' gradientUnits='userSpaceOnUse' x1='950' y1='25' x2='950' y2='777'%3E%3Cstop offset='0' stop-color='%2384dd80'/%3E%3Cstop offset='1' stop-color='%234ccc9c'/%3E%3C/linearGradient%3E%3ClinearGradient id='i' gradientUnits='userSpaceOnUse' x1='1000' y1='25' x2='1000' y2='777'%3E%3Cstop offset='0' stop-color='%2373d980'/%3E%3Cstop offset='1' stop-color='%234ccc9c'/%3E%3C/linearGradient%3E%3ClinearGradient id='j' gradientUnits='userSpaceOnUse' x1='1050' y1='25' x2='1050' y2='777'%3E%3Cstop offset='0' stop-color='%2366d586'/%3E%3Cstop offset='1' stop-color='%234ccc9c'/%3E%3C/linearGradient%3E%3ClinearGradient id='k' gradientUnits='userSpaceOnUse' x1='1100' y1='25' x2='1100' y2='777'%3E%3Cstop offset='0' stop-color='%2359d090'/%3E%3Cstop offset='1' stop-color='%234ccc9c'/%3E%3C/linearGradient%3E%3ClinearGradient id='l' gradientUnits='userSpaceOnUse' x1='1150' y1='25' x2='1150' y2='777'%3E%3Cstop offset='0' stop-color='%234ccc9c'/%3E%3Cstop offset='1' stop-color='%234ccc9c'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cg %3E%3Crect fill='url(%23a)' width='1200' height='800'/%3E%3Crect fill='url(%23b)' x='100' width='1100' height='800'/%3E%3Crect fill='url(%23c)' x='200' width='1000' height='800'/%3E%3Crect fill='url(%23d)' x='300' width='900' height='800'/%3E%3Crect fill='url(%23e)' x='400' width='800' height='800'/%3E%3Crect fill='url(%23f)' x='500' width='700' height='800'/%3E%3Crect fill='url(%23g)' x='600' width='600' height='800'/%3E%3Crect fill='url(%23h)' x='700' width='500' height='800'/%3E%3Crect fill='url(%23i)' x='800' width='400' height='800'/%3E%3Crect fill='url(%23j)' x='900' width='300' height='800'/%3E%3Crect fill='url(%23k)' x='1000' width='200' height='800'/%3E%3Crect fill='url(%23l)' x='1100' width='100' height='800'/%3E%3C/g%3E%3C/svg%3E");
background-attachment: fixed;
background-size: cover;*/
}
.sidebar nav ul li a {
letter-spacing: 0.5px;
color: #193b54!important;
}
/*หน้าคลิปติวฟรีลิงค์ไปyouture*/
.sbvcytc-content {
padding: 0 10px 10px;
width: 100%;
clear: both;
}
.sbvcytc-title {
font: 26px/0.6 THSarabunNew;
font-size: 8px;
font-weight: bold;
line-height: 1.3;
margin-top: 5px;
color: #193b54;
text-decoration: none;
float: left;
width: 100%;
clear: both;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.sbvcytc-thumbnail {
width: 100%;
float: left;
clear: both;
position: relative;
}
.sbvcytc-social-sharing {
position: absolute;
z-index: 1;
right: 5px;
top: 5px;
overflow: hidden;
}
.sbvcytc-social-sharing:hover {
overflow: visible;
}
.sbvcytc-social-sharing:hover .sbvcytc-social-sharing-items {
right: 0;
opacity: 1;
}
.sbvcytc-popup-social-sharing a.sbvcytc-popup-social-gplus, .sbvcytc-social-sharing-items .sbvcytc-social-sharing-gplus {
background-color: #d34836;
}
.sbvcytc-popup-social-sharing a.sbvcytc-popup-social-twitter, .sbvcytc-social-sharing-items .sbvcytc-social-sharing-twitter {
background-color: #009ad1;
}
.sbvcytc-popup-social-sharing a.sbvcytc-popup-social-facebook, .sbvcytc-social-sharing-items .sbvcytc-social-sharing-facebook {
background-color: #3b5999;
}
.sbvcytc-social-sharing a {
color: #fff !important;
width: 20px;
height: 20px;
float: left;
text-align: center;
background-color: rgba(0, 0, 0, 0.6);
line-height: 20px;
border-radius: 100px;
font-size: 12px;
cursor: pointer;
}
.sbvcytc-social-sharing-items {
position: absolute;
right: -100%;
opacity: 0;
top: 0;
width: 80px;
transition: all 500ms ease 0s;
-moz-transition: all 500ms ease 0s;
-webkit-transition: all 500ms ease 0s;
-ms-transition: all 500ms ease 0s;
-o-transition: all 500ms ease 0s;
}
.sbvcytc-meta {
color: #333333;
}
.sbvcytc-meta i {
font-size: 8px;
}
.sbvcytc-meta {
clear: both;
}
.sbvcytc-meta-item, .sbvcytc-meta {
color: #333333;
border-color: #333333;
}
.sbvcytc-meta-item:first-child{
border-left: 0;
padding-left: 0;
}
.sbvcytc-meta-item{
float: left;
margin-right: 5px;
padding-left: 5px;
border-left: 1px solid #333333;
}
.sbvcytc-play {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 1;
}
.sbvcytc-video .vjs-playlist-duration {
background-color: rgba(26,26,26,.8);
left: 0;
padding: 0px 3px;
position: absolute;
top: 0;
color: #FFF;
}
.sbvcytc-meta span {
margin-top: 5px;
margin-left: 5px;
font-size: 8px;
}
.sbvcytc-video:hover {
background: rgba(72, 205, 158,0.5);
box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.5);
}
.sbvcytc-video {
box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.2);
background: rgba(72, 205, 158,0.95);
transition: 0.5s;
}
.sbvcytc-meta{
margin: 10px;
line-height: 1;
float: left;}
@media screen and (max-width: 1024px){
.sbvcytc-meta{
margin: 3px;}
}
/*วิธีการสมัคร*/
.hedermaintextinabout a {color: #00ac7f!important;cursor: pointer!important;}
/*หน้าแบคอิน*/
.attr-nav > ul > li > a {
color: #FFF;
display: block;
padding: 12px 12px;
position: relative;
}
.navigation-tab.sidebar-main-trigger > a{color: #FFF}
.hidesearch { display: none;}
.editclass {color: #193b54;}
.bor1{ border: #00ac7f 1px solid!important;color: #00ac7f}
.pad5 { box-shadow: 0 5px 15px rgba(0, 0, 0, .2);}
.ytitle {
font: 26px/0.6 THSarabunNew;
font-size: 20px;
font-weight: bold!important;
line-height: 1.3;
color: #193b54;
text-decoration: none;
float: left;
width: 100%;
clear: both;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.ytitle span {
margin-top: 5px;
margin-left: 5px;
font-size: 20px;
}
.knowledgeonline{
list-style: none;
color: #FFF;
margin: 0;
padding: .7em 15px;
display: block;
font-weight: bold;
line-height: 1.5;
text-align: left;
position: relative;
width: 100%;
z-index: 99;
background: #00ac7f;}
.namecoure .knowldedgedata {
background: rgba(72, 205, 158,1);
}
p::selection {
background: #00ac7f;
color: #ffffff;
}
strong::selection{
background: #00ac7f;
color: #ffffff;
}
img::selection{
background: #00ac7f;
color: #ffffff;
}
.contectblock ul {padding-left: 0px;}
.contectblock ul li img{width: 1rem!important;}
.contectblock li {font-size: 1.5rem;}
.teacher-personal-info span {color: rgba(72, 205, 158,1)!important }
.teacher-name span {color: rgba(72, 205, 158,1)!important }
/*เฉพาะหน้าเรียนกับพวกเรา*/
.pt30px{
padding-top: 30px;
}
.pb30px{
padding-bottom: 30px;
}
.mt30px{
margin-top: 30px;
}
.mb30px{
margin-bottom: 30px;
}
.font_color_193b54 {
color: #193b54!important ;
}
.fixed-bg {
background-color: #379CD3;
min-height: 50rem;
background-attachment: fixed;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
z-index: -1000;
transform: translateX(0%) translateY(0%);
}
.boxfontatabout2 {
font: 15px/1 'THSarabunNew';
font-weight: 600;
letter-spacing: 0.5px;
color: #193b54;
padding-left: 15px;
}
.form-control.teachwithus{
border: 3px solid #ffcd5c;
}
.teachwithusmt40 {
margin-top: -40px;
}
@media screen and (max-width: 991px) and (min-width: 768px){
.teachwithusmt40 {
margin-top: 0px;
}}
.backgrund00ac7f8a{background: #00ac7f8a;}
.btbbradius15px{border-top-right-radius: 15px; border-top-left-radius: 15px;border-bottom-right-radius: 15px;border-bottom-left-radius: 15px;}
.textmoblieintaechwithus1{margin-top: 4rem;color: #FFF;letter-spacing: 2px;line-height: 4rem;font-size: 2rem;}
.textmoblieintaechwithus2{margin-top: 4rem;margin-bottom: 4rem;color: #FFF;letter-spacing: 1rem;font-size: 2rem;}
.textmoblieintaechwithus3{padding-bottom: 1.5rem;line-height: 2.5rem;letter-spacing: 0.3rem;color: #FFF;font-size: 1rem;}
.textpcintaechwithus1{font-size: 2rem;margin-top: 4rem;color: #FFF;letter-spacing: 2px;line-height: 4rem;}
.textpcintaechwithus2{margin-top: 4rem;font-size: 6rem;margin-bottom: 4rem;color: #FFF; letter-spacing: 1rem;}
.textpcieintaechwithus3{padding-bottom: 1.5rem;font-size: 2rem;line-height: 5rem;letter-spacing: 0.3rem;color: #FFF;}
.tutorimgteachwithus{width: 320px;z-index: -1000;}
.tutorimgmoblieteachwithus{width: 320px;position: absolute;transform: translateX(-72%) translateY(1.5%);z-index: -1000;}
.form-control::placeholder {
color: #FFF;
opacity: 1; /* Firefox */
}
.form-control:-ms-input-placeholder { /* Internet Explorer 10-11 */
color: #FFF;
}
.form-control::-ms-input-placeholder { /* Microsoft Edge */
color: #FFF;
}
/*line*/
.tooltip_line .tooltiptext_line {
font-size: 14px;
font-weight: bold;
visibility: visible;
width: 80px;
background-color: #f1f2f7;
color: #000;
text-align: center;
border-radius: 6px;
padding: 5px 0;
position: absolute;
z-index: 1;
/*top: 15px;*/
right: 115%;
}
.tooltip_line .tooltiptext_line::after {
content: "";
position: absolute;
top: 50%;
left: 100%;
margin-top: -5px;
border-width: 5px;
border-style: solid;
border-color: transparent transparent transparent #f1f2f7;
}