@charset "utf-8";
/* CSS Document */
* { max-width:100%; font-size:15px; padding:0; margin:0; line-height:22px; outline:none; box-sizing:border-box; border-collapse:collapse; font-family: 'McLaren', cursive; }
body { }
.clear { clear: both; }
.inner { width: 980px; margin: 0 auto; }
img, table, iframe { max-width: 100% !important; }
table { width: 100% !important; }
table td { border:#7EBA5A 1px solid; padding:6px; }
table.noborder { border: none; }
table.noborder td { border:none; padding: 6px; }
table.noborder td img { border-radius: 5px; }
table.center td { border:#7EBA5A 1px solid; padding:6px; text-align: center; }
table.noborder strong { color:#f1c40f; }
body#page div.content { padding: 40px 0 20px 0; }
img { height: auto !important; }
body.page11099 div.container div.content aside { display: none; }
body.page11099 div.container div.content div.block { width: 100%; }
.homelearning { background: #FFF; padding: 20px 40px; text-decoration: none; margin:0 auto 30px; color: #FF8000; display: block; text-align: center; border-radius: 10px; font-weight: bold; letter-spacing: 1px; border:#FF8000 4px solid; font-size: 18px; }
.homelearning:hover { color:#01B4EF; border:#01B4EF 4px solid; }
div.container div.inner h1 { color: #ffffff; font-size:24px; line-height: 1.5em!important; text-transform: uppercase; margin: 20px 0 10px 0; }
div.container div.inner h2 { color: #ffffff; font-size: 18px; line-height: 1.5em!important; text-transform: uppercase; margin: 20px 0 10px 0;}
div.container div.inner p { margin: 5px 0 10px 0;}
@media screen and (min-width: 980px) {
.nav-btn { display:none; }
}
div.container { }
div.container header { background: #B9D9EB; padding: 20px 0; }
div.container header div.inner { }
div.container header div.inner h1 { color: #9D2643; font-size: 46px; line-height: 46px; text-transform: uppercase; }
div.container header div.inner ul { display: inline-block; list-style: none; }
div.container header div.inner ul li, div.container header div.inner ul li a { color: #4B9ECB; text-decoration: none; font-size: 15px; margin-right: 30px; line-height: 15px; float: left; text-transform: uppercase; }
div.container header div.inner ul li:before { font-family: FontAwesome; margin-right: 10px; }
div.container header div.inner ul li:nth-child(1):before { content: "\f041"; }
div.container header div.inner ul li:nth-child(2):before { content: "\f095"; }
div.container header div.inner ul li a { font-family: FontAwesome; margin-right: 10px; }
div.container header div.inner ul li.twitter a:before { content: "\f099"; }
div.container header div.inner ul li.facebook a:before { content: "\f09a"; }
@media screen and (min-width: 980px) { div.container nav { background: url(images/bar-1.png) top center no-repeat; } }
div.container nav div.inner { position: relative; }
div.container nav div.inner span.nav-btn { }
div.container nav div.inner ul#nav { display: inline; margin: 0 auto; background: #4A7729; width: 90%; float: left; }
div.container nav div.inner ul#nav li { display: inline-block; position: relative; float: left; }
div.container nav div.inner ul#nav li a { text-transform: uppercase; color: #FFF; font-size: 16px; padding: 19px 14px; display: block; text-decoration: none; border-left: 1px solid #509E2F; }
div.container nav div.inner ul#nav li a:hover { background:#509E2F ; }
div.container nav div.inner img { position: absolute; bottom: -18px; right: 0; z-index: 103; }
div.container nav div.inner ul li ul { display: none; position: absolute; top: 60px; left: 0; background:#509E2F ; z-index: 999; }
div.container nav div.inner ul li ul li { width: 260px; display: block; }
div.container nav div.inner ul li ul li a { padding: 8px 10px !important; display: block; border-top: 1px solid #4A7729; max-width: 350px; width: 200px !important; background: #3E6222; border-left: none !important; font-size: 14px !important; }
div.container nav div.inner ul li ul li a:hover { background: #4A7729 !important; }
div.container nav div.inner ul li:hover ul { display: block; }
div.container div.content { background: url(images/Untitled-1.png) 0 0 no-repeat; background-attachment: fixed; background-size: cover; }
div.container div.content div.inner { background-size: cover; padding-bottom: 20px; }
body#index div.container div.content div.inner { padding-bottom: 35px; }
div.container div.content div.slideshow { position: relative; margin-bottom: 50px; }
div.container div.content div.slideshow img { -webkit-clip-path: polygon(0 0, 100% 0, 97% 100%, 3% 100%); clip-path: polygon(0 0, 100% 0, 97% 100%, 3% 100%); }
@media screen and (min-width: 980px) {
div.container div.content div.slideshow span.inspire { color: #FFF; font-style: italic; width: 264px; height: 189px; position: absolute; bottom: -10px; left: -25px; background: url(images/inspire.png) 0 0 no-repeat; font-size: 26px; line-height: 30px; padding: 50px 80px 0 27px; text-shadow: 2px 2px #974C00; z-index: 101; }
div.container div.content div.slideshow span.blue { width: 139px; height: 122px; background: url(images/Untitled-8.png)0 0 no-repeat; position: absolute; bottom: -10px; right: -25px; z-index: 101; }
}
div.container div.content div.sm { background: #0184AF; border-radius: 15px; padding: 15px; margin-bottom: 20px; position: relative; }
div.container div.content div.sm p { color: #FFF; font-size: 15px !important; }
div.container div.content div.sm strong { color: #FFF; font-size: 17px; float: left; margin-right: 10px; padding-left: 40px; }
div.container div.content div.sm strong:before { color: #FFF; font-size: 42px; font-family: FontAwesome; margin-right: 10px; content: "\f099"; font-weight: normal; position: absolute; left: 10px; }
div.container div.content div.notice2 { background: #0184AF; color:#FFF; border-radius: 15px; padding: 15px; margin-bottom: 20px; position: relative; border:#01B4EF 3px solid; }
div.container div.content div.notice2 a { color: #01B4EF }
div.container div.content div.notice2 a:hover { color: #FFF }
div.container div.content div.notice { background: #76A820; border-radius: 15px; padding: 15px; margin-bottom: 20px; position: relative; border:#5B8318 3px solid; }
div.container div.content div.notice #mod1 { margin-bottom: 0 !important; color:#FFF; text-align: center; }
div.container div.content div.notice p { text-align: center; color: #FFF; font-size: 15px !important; margin-bottom: 0 !important; }
div.container div.content div.notice a { color: #5B8318 }
div.container div.content div.notice a:hover { color: #FFF }
div.container div.content div.notice a.button-white { color: #fff; display: block; border: 2px solid #fff; background: transparent; padding: 10px; border-radius: 5px; text-decoration: none; }
div.container div.content div.notice a.button-white:hover { color: #76A820; background: #fff; border-color: #fff; }
div.container div.content div.notice h2 { color: #FFF; font-size: 17px; margin-right: 10px; margin-bottom: 20px; padding-left: 40px; text-align: center; }
div.container div.content div.notice h2:before { color: #FFF; font-size: 36px; font-family: FontAwesome; margin-right: 10px; content: "\f1bb"; font-weight: normal; }
div.container div.content div.notice h2:after { color: #FFF; font-size: 36px; font-family: FontAwesome; margin-left: 10px; content: "\f1bb"; font-weight: normal; }
div.container div.content div.welcome div#mod1 { margin-bottom: 0!important; }
div.container div.content div.welcome { background: #FF4000; border-radius: 15px; padding: 20px; }
div.container div.content div.welcome h2 { color: #FFF; font-size: 26px; margin-bottom: 15px; font-weight: bold; }
div.container div.content div.welcome p { color: #FFF; font-size: 15px; }
div.container div.content div.welcome p br { }
div.container div.content div.welcome p a { color: #8A2100; text-decoration: none; font-size: 15px; }
div.container div.content div.welcome p a:hover { color: #333; }
div.container div.content div.welcome div#mod1 { color: #FFF; font-size: 15px; }
div.container div.content div.welcome div#mod1 a { color: #8A2100; text-decoration: none; font-size: 15px; }
div.container div.content div.welcome div#mod1 a:hover { color: #333; }
div.container div.news { background: #629940; padding: 30px 0; }
div.container div.news div.inner { }
div.container div.news div.inner h2 { color: #FFF; font-size: 32px; line-height: 32px; margin-bottom: 20px; font-weight: bold; }
div.container div.news div.inner div div#mod1 { }
div.container div.news div.inner div img { border-radius: 15px; float: left; margin-right: 15px; }
div.container div.news div.inner div h3 { font-size: 15px; color: #FFF; margin-bottom: 20px; font-weight: bold; }
div.container div.news div.inner div p { color: #FFF; font-size: 14px; }
div.container div.news div.inner div p a { color: #92C573; text-decoration: none; }
div.container div.news div.inner div p a:hover { color: #333; }
div.container div.news div.inner div div#mod1 strong { font-size: 15px; color: #FFF; margin-bottom: 20px; font-weight: bold; }
div.container div.news div.inner div img { float: left !important; }
div.container div.news div.inner div div#mod1 { color: #FFF; font-size: 14px; }
div.container div.news div.inner div div#mod1 a { color: #92C573; text-decoration: none; }
div.container div.news div.inner div div#mod1 a:hover { color: #333; }
div.container div.news div.inner div.left { margin-right: 2%; width: 49%; float: left; }
div.container div.news div.inner div.left img { }
div.container div.news div.inner div.left h3 { }
div.container div.news div.inner div.left p { }
div.container div.news div.inner div.left p a { }
div.container div.news div.inner div.right { }
div.container div.news div.inner div.right img { }
div.container div.news div.inner div.right h3 { }
div.container div.news div.inner div.right p { }
div.container div.news div.inner div.right p a { }
div.container footer { background: #8CC13E; padding: 30px 0; }
div.container footer div.inner { text-align: center; }
div.container footer div.inner ul { display: inline-block; list-style: none; margin-bottom: 15px; }
div.container footer div.inner ul li { float:left; }
div.container footer div.inner ul li:before { content: "\2022"; color: #FFF; }
div.container footer div.inner ul li:first-child:before { content: ""; }
div.container footer div.inner ul li a { color: #FFF; text-decoration: none; padding: 0px 20px; margin-bottom: 10px; }
div.container footer div.inner ul li a:hover { color: #333; }
div.container footer div.inner p { color: #FFF; display: block; }
div.container div.lower { padding: 30px 0; background: #EFEFEF; }
div.container div.lower div.inner { text-align: center; }
div.container div.lower div.inner a { color: #333333; text-decoration: none; }
div.container div.lower div.inner a.full { display: block; color: #333333; text-decoration: none; }
div.container div.lower div.inner a.last { margin-top: 20px;}
div.container div.lower div.inner a:hover { color: #CC1515; }
div.container div.lower div.inner a img { display: block; margin: 0 auto; margin-bottom: 20px; }
/*Sub Page*/
div.container div.content div.block { float: right; background: #629940; width: 75%; padding: 20px; border-radius: 15px; }
div.container div.content div.block h3 { color: #FFF; font-size: 26px; line-height: 26px; margin-bottom: 20px; font-weight: bold; }
div.container div.content div.block h3 a { color: #FFF; font-size: 26px; line-height: 26px; margin-bottom: 20px; font-weight: bold; text-decoration: none; }
div.container div.content div.block h3 a:hover { color: #9D2643; }
div.container div.content div.block { color: #FFF; font-size: 15px; }
div.container div.content div.block p br { }
div.container div.content div.block a { color: #8A2100; text-decoration: none; font-size: 15px; }
div.container div.content div.block a:hover { color: #333; }
div.container div.content aside { padding: 20px; background: #FF8000; float: left; width: 23%; border-radius: 15px; }
div.container div.content aside h2 { color: #FFF; line-height: 26px; font-size: 26px; margin-bottom: 20px; font-weight: bold; }
div.container div.content aside ul { list-style: none; }
div.container div.content aside ul li { display: block; }
div.container div.content aside ul li a { display: block; padding: 10px 0; text-decoration: none; color: #FFF; border-top: 1px solid #DD6F00; }
div.container div.content aside ul li a:hover { background: #DD6F00; padding-left: 10px; }
@media screen and (max-width: 979px) {
.nav-btn { display:block; margin:0; text-align:right; cursor:pointer; float: left; width:51px; height: 51px; background: url(images/bars.png) 0 0 no-repeat; }
div.container nav { background: #509E2F; }
div.container nav div.inner ul#nav { display: none ; width: 100% !important; }
div.container nav div.inner ul#nav li { display: block !important; width: 100% !important; }
div.container nav div.inner ul#nav li a { display: block !important; }
div.container nav div.inner ul#nav li ul { display: none !important; }
div.container nav div.inner ul#nav li ul li { display: none !important; }
div.container nav div.inner img { top: -66px; }
div.container header { padding: 20px; }
div.container header div.inner ul li { float: none; line-height: 25px; }
div.container div.content div.sm p { line-height:24px; }
div.container div.content div.inner { padding-bottom: 20px !important; }
div.container div.content div.slideshow span.inspire { font-size: 26px; line-height: 30px; background: #FF8000; color: #FFF; font-weight: bold; font-style: italic; border-radius: 15px; padding: 20px; margin-bottom: 20px; text-shadow: 2px 2px #974C00; display: block; text-align: center; margin-top: 12px; }
div.container div.content div.slideshow { width: 100% !important; height: auto !important; margin-bottom: 0 !important; }
div.container div.content div.slideshow img { width: 100% !important; height: auto !important; margin-bottom: 0 !important; }
div.container div.news div.inner { padding-left: 20px; padding-right: 20px; }
div.container div.news div.inner div.left { width: 100% !important; }
div.container div.news div.inner div.right { width: 100% !important; }
div.container div.news div.inner div img { }
div.container div.news div.inner div h3 { }
div.container div.news div.inner div p { }
div.container div.news div.inner div p a { }
div.container div.news div.inner div p a:hover { }
div.container div.news div.inner div.left { margin-right: 0 !important; margin-bottom: 15px !important; }
}
@media screen and (max-width: 720px) {
div.container footer div.inner ul { display: none; }
div.container div.content div.block { width: 100%; margin-bottom: 20px; }
div.container div.content aside { width: 100%; }
}
@media screen and (max-width: 440px) {
div.container nav div.inner img { display: none; }
}
.innerNav { margin-left: 20px; }
#mod1, #mod2, #mod3, #mod4, #mod5, #mod6, #mod7, #mod8, #mod9 { margin-bottom:20px; }
#mod1 ul, #mod2 ul { margin:20px; }
#mod3 a { margin:0 10px 10px 0; float:left; }
#mod3 img { border:#CCC 3px solid; }
#mod3 ul { margin-left:0 !important; }
#mod3 p { margin-bottom:10px; }
#mod7 ul { padding:0; margin:15px 0 0 0!important; }
#mod7 li { list-style:none; padding:10px; margin:0 0 10px 0; }
#mod7 li:nth-child(odd) { background: #FFE0C1; margin-right:30px; }
#mod7 li:nth-child(odd) span { float: right; padding:8px; background-color: #FFA953; font-size:11px; margin:-10px -10px 0px 10px; }
#mod7 li:nth-child(even) { background: #D6F3FE; margin-left:30px; }
#mod7 li:nth-child(even) span { float: left; padding:8px; background-color:#60D0FB ; font-size:11px; margin:-10px 10px 0px -10px; }
.mod7write { padding:10px; background:#EFEFEF; border-top:#999 1px solid; border-bottom:#999 1px solid; margin-top:10px; }
.mod7write label { display:block; }
.mod7write input { width:200px; padding:5px; border:#999 1px solid; }
.mod7write textarea { width:300px; padding:5px; border:#999 1px solid; }
.calendar { width:100%; border-collapse:collapse; }
.calendar tr { height:60px; }
.calendar .calendar-head { height:20px !important; }
.calendar td { padding:5px; border:#CCC 1px solid; width:14%; vertical-align:top; }
.calendar-day-head { line-height:20px; background-color:#666; color:#FFF; padding:5px; text-align:center; }
.calendar-day-np { line-height:30px; }
.calendar td.today { background-color:#CCC; }
.calendar .calendar-day:hover { background-color: #E6E6E6; }
#mod8 { padding-bottom:20px; border-bottom:#EDBF47 1px dotted; }
#mod8.full { border-bottom:none; }
#mod8 img.small { float:left; width:120px; max-width:120px !important; margin:0 15px 0 0; border:#EDBF47 1px solid; padding:3px; }
#mod8 img.full { max-width:460px; max-height:510px; margin:5px 0 10px 0; border:#EDBF47 1px solid; padding:3px; display:block; }
#mod8 .title a, #mod8 .title { font-weight:bold; text-decoration:none; font-size:16px; display:block; }
#mod8 em { margin-bottom:5px; display:block; font-size:12px; }
.page7072 table img {
width: 150px;
height: 185px!important;
object-fit: cover;
}
/* Cookie Box */
#cookie_box {
position: fixed;
display: inline-flex;
font-family: sans-serif;
left: 50%;
transform: translate(-50%);
justify-content: center;
align-items: center;
bottom: 20px;
font-size: 14px;
z-index: 1000;
background: #4a7729;
padding: 15px 10px;
width:35%;
color: #fff;
border-radius: 15px;
box-shadow: 0px 0px 5px 4px rgb(0 0 0 / 0.2);
}
#cookie_box .cookie_box_close {
background-color: #75a92a;
border-radius: 10px;
padding: 10px 30px;
transition: all ease 0.25s;
}
#cookie_box .cookie_box_close:hover {
background-color: #639121;
color: #fff;
}
#cookie_box .box-cookie {
width: 85%;
padding: 0px 25px;
text-align: justify;
color: #fff;
}
#cookie_box .box-cookie a {
color: #d8d8d8;
font-weight: 600;
text-decoration: none;
transition: all ease 0.25s;
}
#cookie_box .box-cookie a:hover {
color: #bdbdbd;
}
#cookie_box .box-img {
display: inline-block;
height: auto;
width: 7.5%;
text-align: center;
}
#cookie_box .box-img p{
font-size: 3em;
text-shadow: none;
margin: 0px;
}
#cookie_box .box-btn {
width: 15%;
text-align: center;
}
#cookie_box .box-btn a{
color: #fff;
text-shadow: 0px 0px 8px rgb(0 0 0 / 0.5);
text-decoration: none;
font-weight: bold;
font-size: 15px;
}
/**/
/* Cookie Mobile */
@media (max-width: 1600px) {
#cookie_box {
width: 50%;
}
}
@media (max-width: 1300px) {
#cookie_box {
width: 70%;
}
}
@media (max-width: 900px) {
#cookie_box {
width: 80%;
}
}
@media (max-width: 770px) {
#cookie_box .box-cookie {
display: inline-block;
vertical-align: middle;
width: 85%;
font-size: 12px;
padding: 0px 5px;
}
#cookie_box .box-btn {
display: inline-block;
vertical-align: middle;
width: 15%;
}
#cookie_box {
display: inline-block;
width: 90%;
font-size: 12px;
font-size: 0px;
}
}
@media screen and (max-width: 650px) {
#cookie_box .box-btn a {
font-size: 12px;
}
#cookie_box .cookie_box_close {
padding: 5px 30px;
}
#cookie_box .box-cookie {
width: 100%;
}
#cookie_box .box-btn {
width: 100%;
text-align: center;
margin: 15px 0px;
margin-bottom: 5px;
}
#cookie_box {
width: 90%;
}
}
@media screen and (max-width: 450px) {
#cookie_box .box-cookie {
font-size: 10px;
}
#cookie_box .cookie_box_close {
padding: 5px 15px;
}
#cookie_box .box-btn {
margin-bottom: 0px;
}
#cookie_box {
padding: 10px;
}
}
/**/
.socialContainer {
display: grid;
grid-template-columns: repeat(3, 1fr);
}
.col {
padding: 20px;
}
@media (max-width: 770px) {
.socialContainer {
display: grid;
grid-template-columns: repeat(1, 1fr);
}
}