/*
Theme Name: IB NET PTE LTD
Theme URI: https://www.i-b-net.com/
Description: IB NET PTE LTD Exclusive Theme
Version: 1.0
Author: 
Author URI: 
*/

/* wordpress blog */
img.alignright { display: block; margin: 0 0 0 auto; }

img.alignleft { display: block; margin: 0 auto 0 0; }

img.aligncenter { display: block; margin: 0 auto; }

a:hover img.hoverImg{opacity:0.6;}

.flex-box {
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: center;
    justify-content: center;
}

.flex-height {display: flex; align-items: center;}

.btn{white-space:normal; border-radius:0; font-style:italic; padding:.5rem 2rem;}

.btn-primary{background-color:#023163; border-color:#023163;}

.border-primary{border-color:#023163 !important;}

.bg-black{background-color:#000;}

.bg-dark-blue{background-color:#07101f;}

.text-orange{color:#982d00;}

.mb-30px{margin-bottom:30px !important;}

.mb-40px{margin-bottom:40px !important;}

.mb-50px{margin-bottom:50px !important;}

.container {max-width: 1230px;}

@media screen and (max-width: 1199px){
.container {max-width: 100%;}
}

.img-center{display:block; margin-left:auto; margin-right:auto;}

.bg-gradient{/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#5b6ead+0,f9ca8e+50,fce678+100 */
background: #5b6ead; /* Old browsers */
background: -moz-linear-gradient(left,  #5b6ead 0%, #f9ca8e 50%, #fce678 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  #5b6ead 0%,#f9ca8e 50%,#fce678 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right,  #5b6ead 0%,#f9ca8e 50%,#fce678 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5b6ead', endColorstr='#fce678',GradientType=1 ); /* IE6-9 */
}

.bg-gradient-reverse{/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#fce678+0,f9ca8e+50,5b6ead+100 */
background: #fce678; /* Old browsers */
background: -moz-linear-gradient(left,  #fce678 0%, #f9ca8e 50%, #5b6ead 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  #fce678 0%,#f9ca8e 50%,#5b6ead 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right,  #fce678 0%,#f9ca8e 50%,#5b6ead 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fce678', endColorstr='#5b6ead',GradientType=1 ); /* IE6-9 */
}

html{font-size:17px;}

body{font-family: 'Quantico', sans-serif; line-height:1.6rem; color:#023163;}

html[lang="ja"] body{font-family: "Noto Sans JP", Meiryo, メイリオ, "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", sans-serif; font-size:15px;}

.font-ja{font-family: "Noto Sans JP", Meiryo, メイリオ, "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", sans-serif !important;}

h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6,.btn{font-style:italic; font-weight:700; font-family: 'Quantico', sans-serif;}

.sec-padding-120px{padding:120px 0;}

@media screen and (max-width:767px){
 .h1{font-size:2rem;}
}

/* haader */
.navbar{font-style:italic; font-weight:bold; font-family: 'Quantico', sans-serif;}

.navbar-light .navbar-brand{color:#023163; font-size:2rem;}

.navbar-light .navbar-brand span{font-size:1rem;}

.navbar-light .navbar-nav .show>.nav-link, .navbar-light .navbar-nav .active>.nav-link, .navbar-light .navbar-nav .nav-link.show, .navbar-light .navbar-nav .nav-link.active{color:#023163;}

.navbar-light .navbar-nav .nav-link:hover, .navbar-light .navbar-nav .nav-link:focus{color:#023163;}

.navbar-light .navbar-nav .nav-link{color:rgba(2,49,99,0.5)}

#logo-header{width:200px; -webkit-transition: ease .25s; transition: ease .25s;}

.navbar-brand{padding:0;}

.navbar.solid {transition: ease .25s; box-shadow: 0 0 4px grey; -webkit-transition: ease .25s; transition: ease .25s;}

.navbar.solid #logo-header{width:150px;}

@media screen and (max-width:767px){
 #logo-header{width:150px;}
	
 .navbar-nav{text-align:center;}
}

/* footer */
.ctr{padding:65px 0; font-style:italic; color:#fff; text-align:center; background:url('/wp/wp-content/themes/i-b-net/images/bg-section-ctr.jpg') top center fixed; background-size:cover;}

.ctr h4{text-shadow:0 0 10px #59f9fb, 0 0 20px #3494aa, 0 0 30px #3494aa;}

footer{font-style:italic; text-align:center;}

#footer-top{padding:60px 0; color:#fff;}

#footer-top h5{text-shadow:0 0 10px #3494aa, 0 0 20px #3494aa, 0 0 30px #3494aa, 0 0 40px #3494aa;}

#footer-top p{text-shadow:0 0 10px #3494aa, 0 0 20px #3494aa, 0 0 30px #3494aa}

#footer-bottom{padding:20px 0; text-align:center;}

#footer-bottom a, #footer-bottom a:hover, #footer-bottom a:focus{color:#023163;}

#footer-bottom a{text-decoration:underline;}

#footer-bottom a:hover, #footer-bottom a:focus{text-decoration:none;}

/* common */
.title-bordered {
  text-align: center;
  position: relative;
  overflow: hidden;
  margin-bottom: 40px;
}
.title-bordered:after,
.title-bordered:before {
  content: "";
  height: 1px;
  display: block;
  position: absolute;
  bottom: 6px;
  width: 12%;
  opacity: 1;
}
.title-bordered:before {
  left: 50%;
  background-image: -webkit-linear-gradient(left,color-stop(transparent 0%),color-stop(#023163 100%));
  background-image: linear-gradient(to right,transparent 0%,#023163 100%);
  background-repeat: repeat-x;
}
.title-bordered:after {
  right: 50%;
  background-image: -webkit-linear-gradient(left,color-stop(#023163 0%),color-stop(transparent 100%));
  background-image: linear-gradient(to right,#023163 0%,transparent 100%);
  background-repeat: repeat-x;
}
.title-bordered .title-inner {
  position: relative;
  padding-bottom: 40px;
}
.title-bordered .title-inner:after,
.title-bordered .title-inner:before {
  content: "";
  display: block;
  position: absolute;
  border-radius: 50%;
}
.title-bordered .title-inner:before {
  left: 50%;
  margin-left: -7px;
  bottom: 0;
  width: 13px;
  height: 13px;
  background: #023163;
  opacity: .5;
  filter: alpha(opacity=50);
}
.title-bordered .title-inner:after {
  left: 50%;
  margin-left: -3px;
  bottom: 4px;
  width: 5px;
  height: 5px;
  background: #f9cc8d;
}

/* index */
.hero-img{padding:300px 0;  text-align:center; background:url('/wp/wp-content/themes/i-b-net/images/hero-img.jpg') top center fixed; background-size:cover;}

.hero-img h1{font-size:5rem; margin-bottom:0; color:#fffdd5; text-shadow:0 0 10px #dfa46f, 0 0 20px #dfa46f, 0 0 30px #dfa46f;}

@media screen and (max-width:767px){
 .hero-img{padding:180px 0;}
 
 .hero-img h1{font-size:2.75rem;}
}

#bg-home-services{background:url('/wp/wp-content/themes/i-b-net/images/bg-section-home.jpg') top center fixed; background-size:cover;}

#bg-page-hosting{background:url('/wp/wp-content/themes/i-b-net/images/bg-section-hosting.jpg') top center fixed; background-size:cover;}

/* pages */
.page-ttl{padding:150px 0;  text-align:center; background:url('/wp/wp-content/themes/i-b-net/images/hero-img.jpg') center center; background-size:cover;}

.page-ttl h1{font-size:3rem; margin-bottom:0; color:#fffdd5; text-shadow:0 0 10px #dfa46f, 0 0 20px #dfa46f, 0 0 30px #dfa46f; text-transform:uppercase;}

@media screen and (max-width:767px){
.page-ttl h1{font-size:2.25rem;}
}

.icn-orange{color:#e49253;}

.icn-purple{color:#8b8aa3;}

.icn-card-area .card{background-color:rgba(255,255,255,.75);}

ul.checked{list-style:none; padding-left:2px; padding-right:20px; margin-bottom:0;}

ul.checked li{padding-left: 1.5em; margin-bottom:5px; }

ul.checked li a, ul.checked-success li a, ul.checked-danger li a{color:inherit;}

ul.checked li:before{content: '\f00c'; /* FontAwesome Unicode */
  font-family: 'Font Awesome 5 Pro';
  display: inline-block;
  margin-left: -1.5em; /* same as padding-left set on li */
  width: 1.5em; /* same as padding-left set on li */
  font-weight:600; color:#d77b49;}

.hover-box {
  background: rgba(57, 61, 119, .3);
  bottom: 0;
  left: 15px;
  opacity: 0;
  overflow: hidden;
  padding: 2.2rem;
  position: absolute;
  text-align: center;
  top: 0;
  right: 15px;
  -webkit-transition: 0.6s;
  transition: 0.6s;
}

.hover-box-yellow{background: rgba(171, 138, 8, .5) !important;}

.hover-box:hover { opacity: 1; }

.hover-box:after,
.hover-box:before {
  border: 1px solid rgba(255, 255, 255, 0.7);
  bottom: 1rem;
  content: '';
  left: 1rem;
  opacity: 0;
  position: absolute;
  right: 1rem;
  top: 1rem;
  -webkit-transform: scale(1.5);
  -ms-transform: scale(1.5);
  transform: scale(1.5);
  -webkit-transition: 0.6s 0.2s;
  transition: 0.6s 0.2s;
}

.hover-box:before {
  border-bottom: none;
  border-top: none;
  left: 2rem;
  right: 2rem;
}

.hover-box:after {
  border-left: none;
  border-right: none;
  bottom: 2rem;
  top: 2rem;
}

.hover-box:hover:after,
.hover-box:hover:before {
  -webkit-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
  opacity: 1;
}

@media screen and (max-width:991px){
 .hover-box{opacity:1;}
}

/* terms */
#page-terms a, #page-terms a:hover, #page-terms a:focus{color:#982d00;}

#page-terms a{text-decoration:underline;}

#page-terms a:hover{text-decoration:none;}

/* owl carousel */
#owl-portofolio .owl-prev{position:absolute; left:-25px; top:45%; font-size:1.75em; color:#393d77;}

#owl-portofolio .owl-next{position:absolute; right:-25px; top:45%; font-size:1.75em; color:#393d77;}

.owl-theme .owl-controls .owl-buttons div{background:transparent; opacity:1; color:#c1a050;}

.owl-dots{display:none;}

/* 404 */
#page404 h2{font-size:6rem; color:#023163; margin-bottom:3rem;}

#page404 h3{margin-bottom:3.5rem;}

#page404 a{color:#982d00; text-decoration:underline;}

#page404 a:hover{text-decoration:none;}

/* Back to Top */
#return-to-top {
    z-index:1000;
    position: fixed;
    bottom: 20px;
    right: 20px;
    background: rgba(2, 49, 99, 0.5);
    width: 50px;
    height: 50px;
    display: block;
    text-decoration: none;
    -webkit-border-radius: 35px;
    -moz-border-radius: 35px;
    border-radius: 35px;
    display: none;
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}
#return-to-top i {
    z-index:1200;
    color: #fff;
    margin: 0;
    position: relative;
    left: 16px;
    top: 13px;
    font-size: 19px;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}
#return-to-top:hover {
    background: rgba(0, 0, 0, 0.9);
}
#return-to-top:hover i {
    color: #fff;
    top: 5px;
}