body {  font-family: 'Montserrat', sans-serif; font-size: 13px ; color:#333; line-height:20px; font-weight: 500;
}
th   {  font-family: 'Montserrat', sans-serif; font-size: 13px; font-weight: bold; background-color: #D3DCE3;}
td   {  font-family: 'Montserrat', sans-serif; font-size: 13px;}
form   {  font-family: 'Montserrat', sans-serif; font-size: 13px}
h1   {  font-family: 'Montserrat', sans-serif; font-size: 16px; font-weight: bold}
h3   {  font-family: 'Montserrat', sans-serif; font-size: 14px; font-weight: bold}
a:link    {  font-family: 'Montserrat', sans-serif; text-decoration: none; color: #006699;}
a:visited {  font-family: 'Montserrat', sans-serif; text-decoration: none; color:#006699;}
a:hover   {  font-family: 'Montserrat', sans-serif; text-decoration: none; color: #003366;}
A:link.nav {  font-family: 'Montserrat', sans-serif; color: #000000}
A:visited.nav {  font-family: 'Montserrat', sans-serif; color: #000000}
A:hover.nav {  font-family: 'Montserrat', sans-serif; color: red;}
.nav {  font-family: 'Montserrat', sans-serif; color: #000000}

body {

background: url(pics/sea_bg3.jpg) no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;	

	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
}


#container
{
width: auto; height:99.5%; display:block; border:0px solid #FF0000;
}

#footer
{
width: auto; height: auto; display:block;
background: url(pics/blue5.jpg);
clear:both;
}

#bg-inside-header
{
height:87px; background: none;
}


.page-header
{
position:fixed;top:0px;left:0px; right:0px; z-index:100; background:rgba(0, 34, 102, 0.7); background:url(pics/bg_header.png);
-moz-box-shadow: 0px 1px 5px #333; -webkit-box-shadow: 0px 1px 5px #333; box-shadow: 0px 1px 5px #333;
  -webkit-transition: top 0.8s;
  -moz-transition: top 0.8s;
  transition: top 0.8s;

}

.page-header.off-canvas { top: -92px; }

.page-header.fixed {
  top: 1;
  z-index: 999;
}

#header
{
width:1000px;
}

#kiri-header
{
width:31%; padding:0px; float:left; height:90px; text-align:center;
display:flex;
align-items:center;
}

#kanan-header
{
width:68%; padding:0px; float:right; height:90px; text-align:center;
display:flex;
align-items:center;
}

#full-header
{
width:100%; padding:0px; height:90px; text-align:center; border:#FF0000 0px solid;
display:flex;
background-image:url(pics/header.png);
align-items:center;
}

#logo-mobile
{
display:none;
}

#kolom-slide
{
width: auto; height:auto;
}

#spotlight-bg
{
width: auto; padding:20px; background: url(pics/bedge_grunge.jpg);
}

#widget-home-services
{
width: auto; padding:20px; background: url(pics/blue12.jpg);
}


#widget-home-bg
{
width: auto; padding:20px; background: url(pics/blu_stripes.png);
}


#kontak-bg
{
width: auto; padding:20px; background: url(pics/blue11.jpg);
}

#spotlight-col
{
width:1000px; display:inline-block; border:#333 0px solid; padding-bottom:0px;
}


#spot-kiri
{
width:20%; padding:0px; float:left; height: auto; border:#FF6600 0px solid;
display:flex;
align-items:center;
padding:10px; text-align: justify;
margin-right:20px;
border-radius:10px;
margin-top:10px;
}

#spot-widget-home
{
width:29%; padding:0px; float:left; height: auto; border: #0099CC 0px solid;
display:flex;
align-items:center;
padding:10px; text-align: justify;
margin-right:18px;
border-radius:10px;
margin-top:10px;
}

#kotak-widget-home
{
background:rgba(255,255,255, 0.5); width:280px; height:270px; padding:10px; border:#fff solid 1px; text-align:center; border-radius:10px;
    -moz-box-shadow: 0px 3px 5px #333;
    -webkit-box-shadow: 0px 3px 5px #333;
    box-shadow: 0px 3px 5px #333;
	margin:auto;

}

#quote-container
{
width: auto; padding:20px;

}

#quote-spot
{
width:1000px; border:#FF0000 0px solid; display:inline-block; padding:20px;
font-size:40px; font-weight:bold; line-height:40px; letter-spacing:-2px; color:#FFFFFF; 
text-shadow: 0 2px 0 #000;
}

#kontak-kiri
{
width:33%; float:left; height: auto; border: #333333 1px dashed; margin-right: 15px;
padding:10px; text-align: left; border-radius:10px; font-size:20px; background:#fff;
}

#kontak-kanan
{
width:60%; float:left; height: auto; border: #333333 1px dashed;
padding:10px; text-align: justify; border-radius:10px; background: #FFFFFF;
}

#menu-res
{
width:1000px; display:block;
}

#main-container
{
width:970px; display: table;
padding-top:20px;
padding-bottom:20px;
padding-left: 30px;
padding-right: 20px;
border: red 0px dashed;
height:99%;
margin-top:30px;
background:rgba(255,255,255, 0.8);
}

#leftside-menu
{
width:23%; float:left; height: auto; border: green 0px dashed; margin-right: 20px;
padding:2px; text-align: center; border-radius:0px;
height: 98%;
}

#main-content
{
width:71%; float:left; height: auto; border: orange 0px dashed; margin-right: 0px;
padding:2px; text-align: justify; border-radius:0px;
height: 98%;
}

#rightside-menu
{
width:25%; float:right; height: auto; border: blue 0px dashed;
padding:2px; text-align: center; border-radius:0px;
height: 98%;
}

#leftside-widget-berita
{
border:dashed 1px #0099FF; padding:5px; border-radius:10px;
margin-bottom:15px;
}

#leftside-widget-galeri
{
border:dashed 1px #0099FF; padding:5px; border-radius:10px;
margin-bottom:15px;
}

#rightside-widget-informasi
{
border:dashed 0px #0099FF; padding:5px; border-radius:10px;
margin-bottom:15px; background:#FFFFFF;
}

#rightside-widget-data-kurikulum
{
border:dashed 0px #0099FF; padding:5px; border-radius:10px;
margin-bottom:15px;
}

#rightside-widget-link
{
border:dashed 0px #0099FF; padding:5px; border-radius:10px;
margin-bottom:15px; background:#FFFFFF;
}

#rightside-widget-statistik
{
border:dashed 0px #0099FF; padding:0px; border-radius:10px;
margin-bottom:15px;
}

#rightside-widget-berita
{
}

#title-box-widget
{
padding:5px; border-top-left-radius: 8px 8px; border-top-right-radius: 8px 8px; background: #003366;
}


.btn {font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; font-style: normal; color: #fff; border: #003366; border-style: solid; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; background-color: #006699; padding:6px; border-radius:10px;}

.btn2 {font-size: 14px; font-style: normal; color: #990000; border: #FF9900; border:2px dashed #99CCFF; background:rgba(255, 255, 255, 0.5); padding:10px; border-radius:5px;}
.btn2:hover {
text-decoration: none;
color: #003366; 
-moz-box-shadow: 0px 1px 3px #333;
-webkit-box-shadow: 0px 1px 3px #333;
box-shadow: 0px 1px 3px #333;
border-radius:5px;
}


.style30 {padding:8px; border:#ccc; border-style: solid; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; background-color: #fff; color:#111; width:100%; border-radius:0px;}

.style31 {font-size: 10px; padding:8px; font-style: normal; border:#ccc; border-style: solid; border-top-width: 2px; border-right-width: 2px; border-bottom-width: 2px; border-left-width: 2px; background-color: #eee; font-family: Verdana, Arial, Helvetica, sans-serif; color:#333333;border-radius:5px;}

.catform {font-size: 12px; padding:4px; font-style: normal; border:#666; border-style: solid; border-top-width: 2px; border-right-width: 2px; border-bottom-width: 2px; border-left-width: 2px; background-color: #ddd; font-family: Verdana, Arial, Helvetica, sans-serif; color:#333333;border-radius:5px; width:200px;}

.link1 a:link {text-decoration : none;color:#660000; text-shadow: 1px 1px lightblue;}
.link1 a:visited {text-decoration : none;color:#660000; text-shadow: 1px 1px lightblue}
.link1 a:hover {text-decoration: none;color:#003366; text-shadow: 1px 1px lightblue}

.link2 a:link {text-decoration :none;color: #003366; font-size:13px;}
.link2 a:visited {text-decoration : none;color:#003366; font-size:13px;}
.link2 a:hover {text-decoration: underline;color: #990000; font-size:13px;}

.link3 a:link {text-decoration :none;color: #990000;}
.link3 a:visited {text-decoration : none;color:990000;}
.link3 a:hover {text-decoration: underline;color:#003366;}

.link4 {text-decoration :none;color:#003366;}
.link4:hover {
text-decoration: none;
color: #990000; 
-moz-box-shadow: 0px 1px 3px #333;
-webkit-box-shadow: 0px 1px 3px #333;
box-shadow: 0px 1px 3px #333;
border-radius:5px;
}


.center-cropped {
  object-fit: cover; /* Do not scale the image (cover / contain) */
  object-position: center; /* Center the image within the element */
  width: 205px;
  height: 200px;
  }
  
.center-cropped-gallery {
  object-fit: cover; /* Do not scale the image (cover / contain) */
  object-position: center; /* Center the image within the element */
  width: 100%;
  height: 180px;
  border-radius:5px;
  }
  
.center-cropped-gallery-terbaru {
  object-fit: cover; /* Do not scale the image (cover / contain) */
  object-position: center; /* Center the image within the element */
  width: 275px;
  height: 195px;
  border-radius:5px;
  }
  
.center-cropped-gallery-leftside {
  object-fit: cover; /* Do not scale the image (cover / contain) */
  object-position: center; /* Center the image within the element */
  width: 100%;
  height: 100%;
  border-bottom-left-radius: 8px 8px; border-bottom-right-radius: 8px 8px;
  }
  
.center-cropped-dis {
  object-fit: contain; /* Do not scale the image (cover / contain) */
  object-position: center; /* Center the image within the element */
  width: 120px;
  height: 90px;
  }

#boxshadow_photo {
    -moz-box-shadow: 0px 3px 5px #333;
    -webkit-box-shadow: 0px 3px 5px #333;
    box-shadow: 0px 3px 5px #333;
	margin:auto;
}

.shadow_text {
text-shadow: 1px 1px #eee;
}

.shadow_text_black {
text-shadow: 1px 1px #000;
}

#spotlight-detail_product
{
width: auto; display:inline-block; border:#333 0px solid; padding-bottom:20px;
}

#product-kiri
{
width:31%; padding:0px; float:left; height: auto; border: #666 0px dashed; margin-right: 12px;
padding:0px; text-align: justify; border-radius:10px; font-size:20px;
}

#product-kanan
{
width:66%; padding:0px; float:right; height: auto; border: #666 0px dashed;
padding:0px; text-align: justify; border-radius:10px;
}

#title-product
{
text-align:left;
}