@import url('bootstrap.css');
@import url('font-awesome.css');

@font-face {
  font-family: 'Open Sans';
  src: url('../fonts/OpenSans-Regular.ttf')  format('truetype'); 
}

body{
    font-size:14px;
    font-family:"Open Sans"!important;
    color: #333;
    line-height: 23px;
    width:100%;
    height:100%;
    /*background:url(../images/main-bg.png) #fff;*/
    /*background:#;*/
    /*background-attachment: fixed;*/
    background:url(../images/bg1.jpg) no-repeat 100% 100% #f4f4f4;
}

a, p {
    font-family:"Open Sans"!important;
}

.ex_link{
    background: #343434;
    color: #fff;
    display: inline-block;
    padding: 7px 10px;
    width: 110px;
    margin: 0 auto;
    text-align: center;
    text-decoration: none;
}
.ex_link:hover{
  color:#fff;
  text-decoration:none;
}

.create-form input{
  display:inline;
  width:100px;
  margin:0;
}

.btn {
  display: inline-block;
  padding:5px 10px;
  margin-bottom: 0;
  font-size: 14px;
  font-weight: normal;
  line-height: 1.42857143;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  -ms-touch-action: manipulation;
      touch-action: manipulation;
  cursor: pointer;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  background-image: none;
  border: 1px solid transparent;
  border-radius:3px !important;
  color:#fff;
  background:#4caf34;
}
.btn-default:hover,
.btn-default:focus,
.btn-default.focus,
.btn-default:active,
.btn-default.active,
.open > .dropdown-toggle.btn-default {
  color: #fff;
  background-color: #229407;
  border-color: #888;
}
.logo{
  text-decoration: none;
}

.logo img{
  text-align:center;
  margin:0 auto;
  padding:0;
  max-width:250px !important;
}

/*bg*/
.banner_bg{
 background:#fff;
 padding:20px 0;
}
.section2{
  background:url(../images/histogood_banner.png) no-repeat 100% 50% #fff;
  /*background-attachment: fixed;*/
  background-size: cover;
  min-height:800px;
}
.white_bg{
  background:#fff !important;
}
.section3{
  padding:20px 0;
  margin-top:-50px;
}
.section4{
      /*background-attachment: fixed;*/
  background: transparent;
}
.section5{
  min-height: 600px;
  box-shadow: 0 0 17px #6d6d6d;
}
footer{
  background:#1a1919;
  padding:20px 0;
}

/*color*/
.green{
  background:#9fd94d;
}
.red{
  background:#ff3e00;
}
.white{
  color:#fff !important;
}
.margin_top_low{
  margin-top:20px;
}
.margin_bottom_low{
  margin-bottom:20px;
}
.no-gutter{
  margin:0 !important;
  padding:0 !important;
}
/*---------------*/

/*----------------menu------------------*/
.navbar{
  padding:5px 0px;
  width: 100%;
  border-radius: 0 !important;
  /*border-top:5px solid #ccd199;*/
  /*background: #808c00;*/
  /*text-transform: uppercase;*/
  margin-top:30px !important;
}
.navbar-default .navbar-nav > li > a{
  color:#232323 ;
  text-decoration:none;
  padding:5px 0;
}

.login{
  color:#fff !important;
  text-decoration:none;
  display:inline-block;
  padding:3px 10px !important;
  width:100px;
  margin:3px 0;
  text-align:center;
  border-radius: 10px;
}
.login:hover{
  /*text-decoration:none;
  display:inline-block;
  padding:3px 15px !important;
  margin:3px 0;*/

}

.tab{
  margin-top:-150px;
}
.tab img{
 margin:0 auto;
 padding:0;
 text-align:center;
}
.tab h4{
 color:#232323;
 font-weight:bold;
 margin-top:20px;
}

.link ul{
  margin:0;
  padding:0;
}
.link ul li{
  list-style:none;
  padding:0;
}
.link ul li a{
  text-decoration:none;
  color:#fff;
}
.link ul li a:hover{
  text-decoration:none;
  color:#ff3e00;
}

.text_box{
    padding: 20px;
    background: #fff;
    margin: 50px 0px 20px 20px;
    box-shadow: 1px 1px 5px #e3e3e3;
}
.text_box p{
  color:#7f7f7f;
  padding:0px;
  margin:0;
}

.category{
  margin:20px 0;
  background:#343434;
}
.category h4,.category p{
  color:#fff;
}
.category a{
    color: #fff;
    text-decoration: none;
    background: #4caf34;
    border-radius: 10px;
    text-align: center;
    margin: 20px auto;
    display: block;
    padding: 7px 10px;
    width: 55%;
}

.category2{
  margin:20px 0;
  background:#343434;
  text-decoration:none;
  display:block;
}
.category2 h4,.category2 p{
  color:#fff;
  margin-bottom:10px;
}

.margin-top{
  margin-top:-100px;
}
.register_a {
    float: left!important;
    background: none!important;
    color: #000!important;
    width: auto!important;
    padding: 0!important;
    margin-left: 10px!important;
}
.forgot {
    float: left!important;
    margin: 0 20px 10px -22px!important;
    background: none!important;
    color: #000!important;
}
.forgot:hover,.register_a:hover {
  text-decoration: underline!important;
}
.box1{
  position: relative;
  float: left;
  width: 100%;
  padding:20px;
  margin-bottom:20px;
  background:#fff;
  text-decoration:none;
  box-shadow: 0px 1px 12px #4a4a4a;
}
.box1 h4{
  color:#343434;
  text-decoration:none;
}
.box1 p{
  color:#5e5e5e;
  text-decoration:none;
}
.box1 a{
  color:#fff;
  text-decoration:none;
  background:#5fa1cb;
  display:block;
  margin:0 auto;
  text-align:center;
  border-radius:3px;
  width:130px;
  padding:5px 0;
}
.box1 a:hover{
  color:#fff;
  text-decoration:none;
  background:#347dac;
}

.table a{
  color:#fff;
  text-decoration:none;
  background:#e4e4e4;
  padding:5px 0;
  display:inline-block;
  border-radius:3px;
}
.table a:hover{
  color:#fff;
  text-decoration:none;
  background:#4caf34;
}

.page{
  /*background:rgba(0,0,0,0.8);*/
  padding:20px;
  margin-top:100px;
}
.page h3,.page p,.page h2{
  color:#fff;
}

.select-style{
  width:200px;
  height:30px;
  border:1px solid #888;
  border-radius:3px;
}


.profile{
  background:rgba(255,61,0,0.6);
  padding:10px 20px;
  min-height: 500px;
  max-height: 500px;
}
.profile h4{
  color:#fff;
  font-weight:bold;
}
.profile p{
  color:#fff;
}
.profile a{
  color:#fff;
  text-decoration:none;
  margin:10px auto;
  text-align:center;
  display:block;
}
.profile2{
  background:rgba(102,182,84,0.6);
  padding:10px 45px;
  min-height: 500px;
  max-height: 500px;
}
.profile2 h4{
  color:#fff;
  font-weight:bold;
}
.profile2 p{
  color:#fff;
}
.profile2 a{
  color:#fff;
  text-decoration:none;
  margin:10px auto;
  text-align:center;
  display:block;
}
.profile2 ul{
  margin:10px;
  padding:0;
}
.profile2 ul li{
  list-style:circle;
  color:#fff;
  line-height:2;
}

.profile3{
  background:rgba(85,149,183,0.6);
  padding:10px 20px;
}

.award{
  margin: 0px 20px 20px 20px;
  background: #fff;
  /* border: 1px solid #888; */
  padding: 0;
  box-shadow: 0 1px 5px #e3e3e3;
  float: left;
  width: 85%;
}
.award h4{
  color: #5d5d5d;
  margin: 0;
  padding: 15px;
  border-bottom:1px solid #eaeaea;
}
.award_img {
  padding: 10px;
}

.content-banner{
    background: #595959;
    padding: 35px 0 35px 20px;
}

.back{
    color: #fff;
    text-decoration: none;
    background: #4daf34;
    padding: 10px 30px;
    border-radius: 10px;
}
.back:hover{
  color:#fff;
  text-decoration:none;
  background:#208108;
}

.search{
  color:#fff;
  text-decoration:none;
  background:#4caf34;
  padding:4px 10px;
  border-radius:10px;
  display:inline-block;
  border: none;
  margin-left: 2px;
}
.search:hover{
  color:#fff;
  text-decoration:none;
  background:#208108;
}

.judge{
  background:#343434;
}
.judge a{
  color:#fff;
  text-decoration: none;
  background:#4caf34;
  display:block;
  width:60%;
  padding:5px 10px;
  text-align: center;
  margin:38px auto;
  border-radius:3px;
}

.title h3{
  margin:0 auto;
  padding: 0;
  color:#fff;
}

/*title*/
/*.title h2{
  margin:0 auto;
  padding:0 0 20px 0;
  color:#808c00;
  font-family:"Open Sans";
  font-weight:lighter;
}

.title h3{
  text-align:center;
  margin:0 auto;
  padding:10px 0;
  color:#e9007e;
  font-family:"Lobster";
  background:url(../images/title-bg.png) no-repeat 50% 100%;
}

.title h5{
  text-align:center;
  margin:0 auto;
  padding:0 0 20px 0;
  color:#888;
  font-family:"Open Sans";
  font-style:italic;
}

.text h2,.text h3,.text h4{
  font-weight:bold;
  color:#666;
  margin:0 0 10px 0;
}
.text p{
  color:#888;
  margin:0 0 10px 0;
}
*/

/*
.fancybox,.fancybox:hover{
  text-decoration:none;
}
.fancybox h4{
  margin:0;
  padding:10px;
  background:#e0e0e0;
  color:#222;
  font-family:"Arial";
  font-size:14px;
  text-decoration:none;
}
.fancybox h4:hover{
  color:#000;
  text-decoration:none;
}
*/

#map{
  border:5px solid #99a700;
  height:350px;
}




/*--------------------animation------------------------*/
.animated { 
    -webkit-animation-duration: 2s; 
    animation-duration: 2s; 
    -webkit-animation-fill-mode: both; 
    animation-fill-mode: both; 
} 

@-webkit-keyframes bounceInRight { 
    0% { 
        opacity: 0; 
        -webkit-transform: translateX(2000px); 
    } 
    60% { 
        opacity: 1; 
        -webkit-transform: translateX(-30px); 
    } 
    80% { 
        -webkit-transform: translateX(10px); 
    } 
    100% { 
        -webkit-transform: translateX(0); 
    } 
} 

@keyframes bounceInRight { 
    0% { 
        opacity: 0; 
        transform: translateX(2000px); 
    } 
    60% { 
        opacity: 1; 
        transform: translateX(-30px); 
    } 
    80% { 
        transform: translateX(10px); 
    } 
    100% { 
        transform: translateX(0); 
    } 
} 

.bounceInRight { 
    -webkit-animation-name: bounceInRight; 
    animation-name: bounceInRight; 
}

@-webkit-keyframes bounceInLeft { 
    0% { 
        opacity: 0; 
        -webkit-transform: translateX(-2000px); 
    } 
    60% { 
        opacity: 1; 
        -webkit-transform: translateX(30px); 
    } 
    80% { 
        -webkit-transform: translateX(-10px); 
    } 
    100% { 
        -webkit-transform: translateX(0); 
    } 
} 

@keyframes bounceInLeft { 
    0% { 
        opacity: 0; 
        transform: translateX(-2000px); 
    } 
    60% { 
        opacity: 1; 
        transform: translateX(30px); 
    } 
    80% { 
        transform: translateX(-10px); 
    } 
    100% { 
        transform: translateX(0); 
    } 
} 
.bounceInLeft { 
    -webkit-animation-name: bounceInLeft; 
    animation-name: bounceInLeft; 
}

@-webkit-keyframes flipInX { 
    0% { 
        -webkit-transform: perspective(400px) rotateX(90deg); 
        opacity: 0; 
    } 
    40% { 
        -webkit-transform: perspective(400px) rotateX(-10deg); 
    } 
    70% { 
        -webkit-transform: perspective(400px) rotateX(10deg); 
    } 
    100% { 
        -webkit-transform: perspective(400px) rotateX(0deg); 
        opacity: 1; 
    } 
} 
@keyframes flipInX { 
    0% { 
        transform: perspective(400px) rotateX(90deg); 
        opacity: 0; 
    } 
    40% { 
        transform: perspective(400px) rotateX(-10deg); 
    } 
    70% { 
        transform: perspective(400px) rotateX(10deg); 
    } 
    100% { 
        transform: perspective(400px) rotateX(0deg); 
        opacity: 1; 
    } 
} 
.flipInX { 
    -webkit-backface-visibility: visible !important; 
    -webkit-animation-name: flipInX; 
    backface-visibility: visible !important; 
    animation-name: flipInX; 
}

/*--------------------------------------to top*/

.cd-top {
  display: inline-block;
  height: 40px;
  width: 40px;
  position: fixed;
  bottom: 40px;
  right: 10px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
  /* image replacement properties */
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  background: rgba(255,61,0,0.9) url(../images/cd-top-arrow.svg) no-repeat center 50%;
  visibility: hidden;
  opacity: 0;
  -webkit-transition: opacity .3s 0s, visibility 0s .3s;
  -moz-transition: opacity .3s 0s, visibility 0s .3s;
  transition: opacity .3s 0s, visibility 0s .3s;
  border-radius:30px;
}
.cd-top.cd-is-visible, .cd-top.cd-fade-out, .no-touch .cd-top:hover {
  -webkit-transition: opacity .3s 0s, visibility 0s 0s;
  -moz-transition: opacity .3s 0s, visibility 0s 0s;
  transition: opacity .3s 0s, visibility 0s 0s;
}
.cd-top.cd-is-visible {
  /* the button becomes visible */
  visibility: visible;
  opacity: 1;
}
.cd-top.cd-fade-out {
  /* if the user keeps scrolling down, the button is out of focus and becomes less visible */
  opacity: .5;
}
.no-touch .cd-top:hover {
  background-color: rgba(254,138,58,0.9);
  opacity: 1;
}
@media only screen and (min-width: 768px) {
  .cd-top {
    right: 20px;
    bottom: 20px;
  }
}
@media only screen and (min-width: 1024px) {
  .cd-top {
    height: 40px;
    width: 40px;
    right: 30px;
    bottom: 30px;
  }
}


.no-padding{
  padding:0 !important;
}

.table-radius{
  background:#333;
  border-radius:10px !important;
}

.th_left {
  background:#e5e5e5!important;
  border-radius:10px 0 0 10px !important;
  border:none!important;
  padding: 10px 0 10px 30px!important;
}

.th_middle {
  background:#e5e5e5!important;
  border-radius:0px !important;
  border:none!important;
  padding: 10px 0!important;
}

.th_right {
  background:#e5e5e5;
  border-radius:0 10px 10px 0 !important;
  border:none!important;
  padding: 10px 0!important;
}

.td_left {
  border:none!important;
  padding-left:30px!important;
}
.td_middle, .td_right {
  border: none!important;
}

.custom_label {
    width: 100%;
    text-align: left!important;
}

.custom_textbox {
    float:left;
    width: 90%;
    padding: 10px 20px;
    height: 40px;
    border-radius: 8px;
}

.custom_checkbox {
    width: 20px;
    height: 20px;
    margin: 15px 0 0 -35px;
}

.detail-image {
  margin-left: 30px;
}

.competition_form {
  margin-left: 30px!important;
}

.check_score {
    display: inline;
    width: 70px;
    margin: 0;
    height: 40px;
    text-align: center;
    border-radius: 10px;
    border: 1px solid #a5a5a5;
    color: #544f4f;
}

.com_detail_img {
  width: 130px;
  height: 130px;
  box-shadow: 1px 1px 5px #4a4a4a;
}

.strong {
  font-weight: bold!important;
}
.view_rules {
  width: auto!important;
  background: #5fbacc!important;
  padding: 9px 40px!important;
  margin: 0 auto!important;
  border-radius: 9px!important;
  font-size: 13px!important;
  display: inline!important;
}
.add_img_select {
  width: 100%;
  padding: 0px 20px;
  height: 40px;
  border: 1px solid #aaaaaa;
  border-radius: 10px;
}
.img_warning_title {
    color: #cc0000!important;
    font-weight: bold;
    font-size: 16px;
    margin-bottom: 2px;
}
.img_warning_text {
    color: #cc0000!important;
    font-weight: bold;
    font-size: 14px;
    margin-bottom: 0px;
}
.mentor_profile {
  background: #5595b8;
  color: #fff;
  padding: 10px 20px;
  margin-bottom: 20px;
}
.view_bio, .view_bio:hover {
  color: #fff;
  font-size: 12px;
  text-decoration: underline;
}
.cate_images_btn a {
color: #fff;
text-decoration: none;
background: #4caf34;
border-radius: 10px;
text-align: center;
margin: 20px auto;
display: block;
padding: 10px 20px;
}
.category_images_select {
width: 100%;
height: 40px;
border-radius: 10px;
border: 1px solid #adadad;
}
.category_images_sicon {
    color: #fff;
    text-decoration: none;
    background: #4caf34;
    padding: 8px 20px;
    border-radius: 10px;
    display: inline-block;
    border: none;
    margin-left: -15px;
    font-size: 18px;
}

@media (max-width: 1000px) {
.margin-top {
margin-top: 0px!important;
}
}

.previous_btn {
    float: right;
    width: 20px;
    height: 20px;
    background: #000;
    border-radius: 50%;
    position: absolute;
    right: 5px;
    top: 5px;
}
.previous_a {
    background: none!important;
    margin-top: -2px!important;
    width: auto!important;
    padding: 0px!important;
}

@media (min-width: 300px) and (max-width: 991px) {
  .logo img {
    width: 70%;
  }
  .navbar {
    margin-top: 0px!important;
    padding: 0px!important;
  }
  .banner_bg {
    padding: 10px 0 0 0!important;
  }
}

.menu2{
  margin: 30px 0 5px 0;
}
.menu2 ul li{
  list-style:none;
  float:left;
}
.menu2 ul li a{
  color:#222;
  text-decoration:none;
  padding:10px;
  margin:0 10px;
  font-size: 16px;
}

@media only screen and (max-width: 991px) {
    .menu2 {
        margin: 10px 0 5px 0!important;
    }
    .menu2 ul {
        padding: 0px!important;
    }
    .menu2 ul li a {
        margin:0 7px;
        font-size: 13px!important;
        width: 60px!important;
        padding: 2px 5px!important;
    }
    .logo img {
      margin-top: 10px;
    }
}

.btn-danger {
  background-color: #d9534f!important;
}

a {
  outline: none!important;
}

.profile_background {
  background-color: #f4f4f4;
  position: relative;
}
.profile_inner {
  width: 90%;
  margin: 0 auto;
}
.profile_leftside {
  background-color: #8c6426;
  padding: 10px 0;
  margin-bottom: 10px;
}
.profile_title{
    color: #ef3e0c;
    text-align: center;
    letter-spacing: 2px;
    font-size: 27px;
}
.profile_award {
    margin: 0 0 20px 0;
    background: #eef2f3;
    padding: 20px;
}
.profile_hr {
  margin: 5px 0px;
  border: 1px solid #e3e3e3;
}