body{font-family: 'product_sansregular';background: url('../images/note-book.png') repeat;}

h1,h2,h3,h4,h5,h6{ margin: 0;}
a,a:hover{ text-decoration: none;}
p{ color: #8b8a8a; font-size: 14px;line-height: 26px;}

header{ width: 100%;z-index: 99; position: absolute; top: 0;}
header .nav>li>a {color: #232323;font-family: 'product_sansregular';font-size: 14px;text-align: center;padding-left: 7px;padding-right: 7px;}
header .nav>li>a span{ background-color: #000; padding: 8px 8px; border-radius: 4px; color: #fff;}
header .nav>li>a:hover span{ background-color: #289bb6;
  -moz-transition:all 500ms ease;
	-webkit-transition:all 500ms ease;
	    -ms-transition:all 500ms ease;
	     -o-transition:all 500ms ease;
            transition:all 500ms ease;}
header ul.navbar-nav{ margin-top: 25px;}
header .nav > li > a:focus, header .nav > li > a:hover{ background-color:transparent;color: #289bb6; }
#sanjo .nav li a.current{color: #fff;background-color: #289bb6;border-radius: 4px;padding: 7px 18px;  font-size: 14px; opacity: 1;margin-top: 6px;
       -moz-transition:all 500ms ease;
	-webkit-transition:all 500ms ease;
	    -ms-transition:all 500ms ease;
	     -o-transition:all 500ms ease;
            transition:all 500ms ease;}
#sanjo .nav li a.current:hover{ box-shadow:0 2px 0px #000; background: #000;color: #fff;}
header .nav>li>a.ur-class span{background-color: #289bb6; }
header .nav>li>a.ur-class:hover span{background-color: #000; }

header .logo-small {display: none;}

.readmore{padding: 19px 40px; border: 2px #d1d1d1 solid; font-size: 16px;color: #252525; text-align: center; text-transform: capitalize;border-radius: 6px; opacity: 1;
       -moz-transition:all 500ms ease;
	-webkit-transition:all 500ms ease;
	    -ms-transition:all 500ms ease;
	     -o-transition:all 500ms ease;
            transition:all 500ms ease;}
.readmore:hover{ background-color: #289bb6; border-color: #289bb6; color: #FFF;}
.view-all{background-color: #001117; color: #fff; border: none;}

/*.top-wrapper{ background-color: aquamarine;}*/

/****#* BANNER ANIMATION CSS *****/
.banner{margin-bottom: 43px;margin-top: 90px;}
.banner figure{ position: relative;}
/*
.banner figure::before {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    background:url('../images/shadow.') no-repeat;
    left: 0;
    bottom:-100%;
    right: 0;
    display: block;margin-left: auto;margin-right: auto;background-size:contain;

}
*/
.banner figure
{
  position: relative;background-color: #fff;
}
.banner figure:before, .banner figure:after
{
  z-index: -1;
  position: absolute;
  content: "";
  bottom: 15px;
  left: 10px;
  width: 50%;
  top: 80%;
  max-width:300px;
  background: #777;
  box-shadow: 0 15px 10px #777;
  transform: rotate(-3deg);
}
.banner figure:after
{
  transform: rotate(3deg);
  right: 10px;
  left: auto;
}

.banner-bg{position: relative; width: 100%;}
.bnr-txt{ position: absolute; left: 50%; top: 50%; width: 100%; text-align: center;

      -webkit-transform: translate(-50%,-50%);
         -moz-transform: translate(-50%,-50%);
          -ms-transform: translate(-50%,-50%);
           -o-transform: translate(-50%,-50%);
              transform: translate(-50%,-50%);
}
.bnr-txt h5{ font-family: 'ml-ttkanikabold'; font-size: 56px;  display: inline-block;}
.bnr-txt h3{ font-family: 'Gloria Hallelujah', cursive; font-size: 60px;}
.bnr-txt h3 span{ color: #289bb6;}


.home-anim{position: relative; margin: 13px 0 0 0; min-height: 120px; overflow: hidden; }
.home-anim h3{ top:15px; left: 50%; font-size: 26px; position: absolute; line-height: 26px; display: inline-block; width: 100%; text-align: center;
  -webkit-transform: translate(-50%,0);
	 -moz-transform: translate(-50%,0);
	  -ms-transform: translate(-50%,0);
	   -o-transform: translate(-50%,0);
		  transform: translate(-50%,0);
}



.new h3{font-size: 28px;}
.new a{color: #289bb6;}
.new{ text-align: center;font-size: 24px;position: absolute;  top: 50%;left: 0;right: 0;  text-align: center;margin: 0 auto;display: inline-block;
      -webkit-transform: translate(0,-50%);
         -moz-transform: translate(0,-50%);
          -ms-transform: translate(0,-50%);
           -o-transform: translate(0,-50%);
              transform: translate(0,-50%);}
.first img {margin:0px auto;}
.text-box{position: relative; overflow: hidden;margin-top:20px;}
.newtxt{ display: none;}


.year-wrap{ margin-top: 0px; text-align: center; padding-bottom: 15px;}
.year-wrap .container{ position: relative; margin-top: 30px; margin-bottom: 40px;}
.year-wrap h3{ text-align: center; font-size: 25px;}
.year-wrap h3 a{ text-align: center; font-size: 25px;color:#289bb6}
.year{ width: 100%; text-align: center;}
a.circle-bg { text-align: center; background-color: white;border: 4px solid #289bb6;display: block;width: 145px;height: 145px;border-radius: 100px;line-height: 135px;font-size: 40px;margin: 0 auto;  font-family: 'montserratextrabold';color: #252525;text-decoration: none;}
a.circle-bg:hover { background-color:#289bb6; color: #fff;
       -moz-transition:all 500ms ease;
	-webkit-transition:all 500ms ease;
	    -ms-transition:all 500ms ease;
	     -o-transition:all 500ms ease;
            transition:all 500ms ease;
}

.custom-nav{position: absolute;font-size: 28px;text-align: center; padding: 5px 14px;color: #d4d4d4;z-index: 100; cursor: pointer;
    top: 50%;
    -webkit-transform: translate(0,-50%);
       -moz-transform: translate(0,-50%);
        -ms-transform: translate(0,-50%);
         -o-transform: translate(0,-50%);
            transform: translate(0,-50%);
}
.custom-nav.prev:hover{ background-color: #289bb6;color: #fff;
 -moz-transition:all 500ms ease;
	-webkit-transition:all 500ms ease;
	    -ms-transition:all 500ms ease;
	     -o-transition:all 500ms ease;
            transition:all 500ms ease;
}
.custom-nav.next:hover{ background-color: #289bb6;color: #fff;
 -moz-transition:all 500ms ease;
	-webkit-transition:all 500ms ease;
	    -ms-transition:all 500ms ease;
	     -o-transition:all 500ms ease;
            transition:all 500ms ease;
}
.custom-nav.prev:hover{ background-color: #289bb6;color: #fff;}
.custom-nav.prev{ left: -15px; border: 2px solid #289bb6;color: #000;   width: 40px; height: 41px; border-radius: 100%; text-align: left;padding: 0px 0px 0px 4px;cursor: pointer;}
.custom-nav.next{ right:-15px;border: 2px solid #289bb6;color: #000;   width: 40px; height: 41px; border-radius: 100%; text-align: right;padding: 0px 4px 4px 1px;
cursor: pointer;}

/*.custom-nav.prev::after{ content: ""; width: 200px; height: 1px;border: 1px solid #000;}*/
/*
.year-inner::after {background: url('../images/whats-pattern_03.png') repeat;
    content: "";
    display: inline-block;
    height: 50px;
    position: relative;
    vertical-align: middle;
    width: 100%;
    margin: -151px 0 0;

}
*/

.anim-slide .entha{ left:0;}
.anim-slide .urclass{ right: 0;}
.anim-slide img#visitn{left: 20%; top:25px;}
.urclass.urclass-sm{ display: none;}
.entha.entha-sm{ display: none;}
.anim-dots{ display: none;}

.year-inner{padding: 0 20px;}
.home-history{ padding: 60px 0;display:block; margin-top: 30px; background-color: #fff;  /*box-shadow:inset 0 10px 32px -17px #7b7b7b;*/}
.hs-right h2{text-align: right;font-size: 34px;font-family: 'product_sansitalic';}
.hs-right span{color: #289bb6;}
.hs-left a{padding: 19px 40px;background-color: #289bb6;font-size: 14px;color: #fff;text-transform: uppercase;border-radius: 6px;
    opacity: 1;
       -moz-transition:all 500ms ease;
	-webkit-transition:all 500ms ease;
	    -ms-transition:all 500ms ease;
	     -o-transition:all 500ms ease;
            transition:all 500ms ease;}
.hs-left a:hover{ box-shadow:0 2px 0px #000; background: #000;color: #fff;}
.hs-left {margin: 8px 20px;}

.inner-block{ display: block; margin: 30px 0 40px 0; height: 256px; width: 100%; background: url('../images/small-thumb1.jpg') no-repeat center; position: relative; border: 1px #d5d5d5 solid;}
.side-box .inner-block{height: 215px;}
.inner-block-rgt{background: url('../images/small-thumb2.jpg') no-repeat center;}
.inner-block h3{ position: absolute; z-index: 10; box-shadow: 2px 2px 2px #000; background: #289bb6; font-family: 'product_sansitalic'; font-size: 28px; color: #d2d2d2; padding: 10px; left: 50%; bottom: 55px;
  -webkit-transform: translate(-50%,0);
     -moz-transform: translate(-50%,0);
      -ms-transform: translate(-50%,0);
       -o-transform: translate(-50%,0);
          transform: translate(-50%,0);
}
.inner-block h3 span{ color: #fff;}
.inner-block:hover h3{ background: #000; }
.inner-block .view-teacher{background-color: #000; width: auto;position: absolute; z-index: 10;left:41%; bottom:22px;padding:6px 29px 6px 11px;color: #fff;font-size: 14px;font-family: 'product_sansregular';
  -webkit-transform: translate(-50%,0);
     -moz-transform: translate(-50%,0);
      -ms-transform: translate(-50%,0);
       -o-transform: translate(-50%,0);
          transform: translate(-50%,0);}

.inner-block .view-teacher::after{color: #289bb6;content: "\f101";position: absolute; font-size:20px;top:6%;font-family: 'FontAwesome';margin-left: 10px;font-weight: 500;}
.inner-block .view-teachers{}
.inner-block .left {left:41%;}
.inner-block:hover .view-teacher{background-color: #289bb6;}
.inner-block:hover .view-teacher::after{color: #000;}

.inner-block-rgt .view-teacher{left:60%; padding:6px 16px 6px 30px;}
/*.inner-block-rgt .view-teacher::after{display: none;}*/
.inner-block-rgt .view-teacher::after{color: #289bb6;content: "\f100 ";position: absolute; font-size:20px;top:6%;font-family: 'FontAwesome';font-weight: 500;margin-right: 10px;right: 79%;top: 4%;}

/*.blue-overlay{ position: absolute; width: 100%; height: 100%; background-color:rgba(40,155,182,0.8); z-index: 9; opacity: 0;
   -moz-transition:all 500ms ease;
-webkit-transition:all 500ms ease;
    -ms-transition:all 500ms ease;
     -o-transition:all 500ms ease;
        transition:all 500ms ease;
}
.inner-block:hover .blue-overlay{opacity: 1;
   -moz-transition:all 500ms ease;
-webkit-transition:all 500ms ease;
    -ms-transition:all 500ms ease;
     -o-transition:all 500ms ease;
        transition:all 500ms ease;
}*/
#search input{padding:4px 15px;border: 2px #289bb6 solid;border-radius: 5px; min-width: 204px;background-color: #289bb6;color: #fff; }
#search input::placeholder {color: #fff; opacity: 1;}
#search input:focus{ border-color:#000; }
#search button{background-color: #000;border: 0;padding:6px 20px;color: #fff;border-radius: 4px; margin-left: 3px;}
#search button:hover{background-color: #289bb6;
-moz-transition:all 500ms ease;
-webkit-transition:all 500ms ease;
    -ms-transition:all 500ms ease;
     -o-transition:all 500ms ease;
        transition:all 500ms ease;}
.inner-search{ margin-top: 30px;}

.class-dission .class-dission-teach ul li a{width: 200px;}
#teach-form .form-group{margin: 0;}
#teach-form {background-color: #e5e5e5;padding: 20px 10px;margin-bottom: 30px;margin-left: 1px;margin-right: 1px;}
#teach-form #myform .btn-sanjo{background-color: #289bb6; color: #fff;}
#teach-form #myform .btn-sanjo span{ color: #fff; text-transform: none;}
.teacher-pic{text-align: left;font-size:15px;display: block;color: #4e4e4e;font-family: 'product_sansregular';margin: 5px 0;}
p.teacher-pic span{ color:#289bb6; font-family: 'product_sansbold';}

footer { background-color: #001117;padding: 30px 0; width: 100%;}
footer .footer-qrts h4{color:#fff;font-size: 22px; text-align: center;}
footer .footer-qrts span{color:#289bb6;font-size: 30px;font-family: 'product_sansbold';}
footer .footer-qrts {margin: 0;}
.socil-icon h4{font-size: 18px;color: #fff;margin-bottom: 12px; text-align: center;}
.socil-icon span{color: #289bb6;}
.socil-icon {margin: 22px 0;  border-top:1px #0c4f5f  solid;padding-top: 10px;}
.socil-icon a {font-size: 14px;color:#fff;margin-left: 10px;line-height: 30px;}
.socil-icon i {font-size: 14px;color:#289bb6;font-size: 14px;}
.anpg{ float: left; display: block; margin-right: 15px;margin-top: 16px;}
.social{ float: right;}
.socil-left{ text-align: center;border:0;}
.socil-left h4{ font-size: 18px; margin-top: 32px;}

.footer-p p{margin: 18px 0;font-size: 14px;text-align: center;border-top: 1px solid #011f2a; padding-top: 20px;}
.footer-p span{color:#289bb6 ;}
.footer-p1 {display: none;}
.footer-p a{color:#289bb6 ;}
/*footer .fa-facebook{display: none;}*/
#typed-strings{ display: inline;}

/* ===========tootle tip style ============== */



/* =========== Sanjo inner ============== */
.conect-contactbox p{font-size:18px; text-align: center;font-style: normal;margin-bottom: 0;}
.conect-contactbox .socil-icon{border: 0;margin: 0px 0 34px;}
.conect-contactbox .socil-icon a{color: #289bb6;font-weight: 600;}
.conect-contactbox .socil-icon i{color: #000;}
/*.conect-contactbox .social-iconbox li a i*/
.conect-contactbox p span{ color: #289bb6;}


.inner-banner{background-image: url(../images/snajo-inner-banner_02_02.jpg);width: 100%;height: 150px;background-position: center center;}
.class-dission {text-align: center;margin: 45px auto 20px auto;}
.class-dission ul li{display: inline-block; list-style-type: none;/* padding: 15px 35px 15px 35px; */}
.class-dission ul li a{display: block; color:#289bb6;border:3px solid #289bb6;font-size: 18px; height: 52px; width:120px;line-height: 50px;text-align: center; border-radius: 5px; margin:0 10px 10px 10px; position: relative;text-decoration: none; }
.class-dission.class-dission-teach ul li a{width: 240px;}
.class-dission.class-dission-teach ul{padding: 0;}



.class-dission ul li a:hover, .class-dission ul li a.actv{background-color: #289bb6;color: #fff;}
.class-dission ul li a::after {color: #289bb6;content: "\f0d7";position: absolute; font-size: 24px;top: 59%;font-family: 'FontAwesome';left: 50%; opacity: 0;
            transform: translate(-50%,0);
    -webkit-transform: translate(-50,0);
       -moz-transform: translate(-50,0);
        -ms-transform: translate(-50,0);
         -o-transform: translate(-50,0);
}
.class-dission ul li a:hover::after, .class-dission ul li a.actv::after{opacity: 1;}

.class-foto-section{text-align: center; margin: 0 auto;font-family: 'product_sansbold';}
/*.class-foto-section > .container{border-top: 1px solid #d3d3d3;} */
.teachers-section > .container{border:none} 
.class-foto-section h3{margin: 25px 20px 30px;}
.class-foto-section .cls-photo-box img{margin: 0 auto;}
.class-foto-section .y-font {color: #000; font-size: 46px;}
.class-foto-section span {color:#289bb6;font-family: 'product_sansregular'; }
.class-foto-section .and {color: #fff;background-color: #289bb6;padding: 12px 15px 12px 15px;border-radius: 24px;font-size: 15px;}
.class-foto-section .cls-photo-box{margin-bottom: 40px;}
.class-foto-section .boys-grid img{margin:0 auto;filter: grayscale(100%);}
/*.class-foto-section .boys-grid img:hover{filter: grayscale(0);}*/
.boys-grid p{font-size: 15px; padding:0 5px; color: #289bb6;margin: 12px auto;font-family: 'product_sansregular';text-transform:capitalize;}
.class-foto-section .boys-grid {box-shadow: 2px 8px 10px -3px rgba(0,0,0,0.33); height: 268px;}
.fb-comments-wrap{ background: #fff; box-shadow: 2px 8px 10px -3px rgba(0,0,0,0.33); margin-bottom: 30px;}


/*new styles added*/
.conect-btn{color: #000;background-color: #fff;border-radius: 4px;padding: 12px 18px; font-size: 16px; opacity: 1;margin-left: 20px;}
.conect-btn:hover{background-color: #000;color: #fff;
-moz-transition:all 500ms ease;
-webkit-transition:all 500ms ease;
    -ms-transition:all 500ms ease;
     -o-transition:all 500ms ease;
        transition:all 500ms ease;}
.inner-search{ margin-top: 30px;}
.class-sidebox{width: 100%; height:auto;background-color: #289bb6;padding:2px 0;box-shadow: 2px 8px 10px -3px rgba(0,0,0,0.33);}
.side-box a{margin: 0 0 30px;}
.side-box .view-teacher{left: 45%;}
.sidebox-form-wrap h2{text-align:left;font-size:28px; font-family: 'product_sansregular';margin:0 20px;color: #fff;}
.sidebox-form-wrap{margin:0;padding:45px 0 56px;}
.sidebox-form-wrap .go{background-color: #289bb6; padding: 8px 7px; border-radius: 20px;color: #fff;}
.sidebox-form-wrap .boys {background-color: #289bb6;padding: 19px 9px;border-radius: 37px;color: #fff;font-size: 16px;}
.main-text{text-align: center;padding: 30px  0;font-family: 'product_sansregular';}
.main-text h2{ position: relative;font-size: 32px;}
.main-text h2::after{content: "";width: 100px;height:2px;position: absolute;background-color: #289bb6;left: 50%;bottom: -15px;
            transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
       -moz-transform: translate(-50%,-50%);
        -ms-transform: translate(-50%,-50%);
         -o-transform: translate(-50%,-50%);
}
.aluminipic img{margin: 0 auto;}
.class-foto-section .teacher-fill{ height: 268px; padding-top: 8px5}
.fb-sec img{margin: 0 auto;}

.social-iconbox{padding: 0;text-align: center;}
.social-iconbox li{display: inline-block;color: #000;}
.social-iconbox li a{display: inline-block;}
.social-iconbox li a i{display: block;border-radius:50%;color:#289bb6;display: inline-block;float: left;margin-right:5px;padding: 8px 11px;font-size: 15px;}


.teacher-fill{
       -moz-transition:all 500ms ease;
	-webkit-transition:all 500ms ease;
	    -ms-transition:all 500ms ease;
	     -o-transition:all 500ms ease;
            transition:all 500ms ease;}
.teacher-fill:hover{background-color: #289bb6; 
       -moz-transition:all 500ms ease;
	-webkit-transition:all 500ms ease;
	    -ms-transition:all 500ms ease;
	     -o-transition:all 500ms ease;
            transition:all 500ms ease;}
.teacher-fill p{color: #289bb6;margin: 15px auto;}
.teacher-fill:hover p{color: #fff;margin: 15px auto; }
.teachers-section .teacher-fill:hover img{ filter: grayscale(100%);
       -moz-transition:all 500ms ease;
	-webkit-transition:all 500ms ease;
	    -ms-transition:all 500ms ease;
	     -o-transition:all 500ms ease;
            transition:all 500ms ease;
}
.boys-grid figure{position: relative;
-moz-transition:all 500ms ease;
	-webkit-transition:all 500ms ease;
	    -ms-transition:all 500ms ease;
	     -o-transition:all 500ms ease;
            transition:all 500ms ease;
}
.boys-grid {margin-bottom: 60px;padding-bottom: 5px;background-color: #fff; position: relative;}
.boys-grid .box-grid-hover{position: absolute; color: #fff;bottom: 0;height: 100%; width: 100%; font-family: 'product_sansregular'; background-color: rgba(0,173,239,0);
       -moz-transition:all 500ms ease;
	-webkit-transition:all 500ms ease;
	    -ms-transition:all 500ms ease;
	     -o-transition:all 500ms ease;
            transition:all 500ms ease;
}

.boys-grid .roll-no{color: #fff;width: 30px;height: 30px;background-color: #289bb6;display: block;margin: -10px auto; border-radius: 100%;padding: 5px; position: absolute; left: 50%; bottom: -5px;
-webkit-transform: translate(-50%,0);
   -moz-transform: translate(-50%,0);
    -ms-transform: translate(-50%,0);
     -o-transform: translate(-50%,0);
        transform: translate(-50%,0);
}
.boys-grid .box-grid-hover h5 {margin-top: 7px;}
.boys-grid .box-grid-hover h6 {position: absolute;bottom: 0;text-align: center;left: 0;right: 0;font-family: 'product_sansregular';font-size: 14px; opacity: 0;}
.boys-grid .box-grid-hover .fb-icon{display: block;background-color: #fff;color: #289bb6; width: 40px; border-radius: 20px;text-align: center;opacity: 0;font-size: 18px;height: 40px;padding: 9px;margin: 0 auto;box-shadow: 2px 8px 10px -3px rgba(0,0,0,0.33);position: absolute;
 top: 0; left: 0;right: 0;
-webkit-transform: translate(0,-50%);
   -moz-transform: translate(0,-50%);
    -ms-transform: translate(0,-50%);
     -o-transform: translate(0,-50%);
        transform: translate(0,-50%);
    
    -webkit-transition: all 300ms ease-in;
       -moz-transition: all 300ms ease-in;
         -o-transition: all 300ms ease-in;
            transition: all 300ms ease-in;
    

}
.boys-grid:hover .box-grid-hover{ background-color: rgba(40,155,182,0.8);
	-webkit-transition:all 500ms ease;
	    -ms-transition:all 500ms ease;
	     -o-transition:all 500ms ease;
            transition:all 500ms ease;
}
.boys-grid:hover img{ filter: grayscale(0);
       -moz-transition:all 500ms ease;
	-webkit-transition:all 500ms ease;
	    -ms-transition:all 500ms ease;
	     -o-transition:all 500ms ease;
            transition:all 500ms ease;
}
.boys-grid:hover .box-grid-hover .fb-icon{ opacity: 1; top: 50%;
    -moz-transition:all 500ms ease;
	-webkit-transition:all 500ms ease;
	    -ms-transition:all 500ms ease;
	     -o-transition:all 500ms ease;
            transition:all 500ms ease;}
.boys-grid:hover .box-grid-hover h6{ opacity: 1; bottom: 15px;
 -moz-transition:all 500ms ease;
	-webkit-transition:all 500ms ease;
	    -ms-transition:all 500ms ease;
	     -o-transition:all 500ms ease;
            transition:all 500ms ease;
}

.box-grid-hover .stud-edit{opacity:0;display: block;color: #fff; cursor: pointer; position: absolute;top: 0;z-index:20;font-size: 14px;padding: 10px 3px;
 font-family: 'product_sansregular';right:-15px;
  -moz-transition:all 500ms ease;
	-webkit-transition:all 500ms ease;
	    -ms-transition:all 500ms ease;
	     -o-transition:all 500ms ease;
            transition:all 500ms ease;
}
.box-grid-hover .stud-edit i{color:#289bb6;margin-left:22px; }
.box-grid-hover .stud-edit::before{position: absolute;content: ''; width: 0;height: 0;border-right: 29px solid #fff;border-top: 20px solid transparent;border-bottom: 20px solid transparent; margin: 0px 2;top: 0;right: 0;z-index: -1;
    -moz-transition: all 500ms ease;
        -webkit-transition: all 500ms ease;
            -ms-transition: all 500ms ease;
                -o-transition: all 500ms ease;
                    transition: all 500ms ease;
 }
.boys-grid:hover .stud-edit{opacity: 1;right:0;
 -moz-transition:all 500ms ease;
	-webkit-transition:all 500ms ease;
	    -ms-transition:all 500ms ease;
	     -o-transition:all 500ms ease;
            transition:all 500ms ease;}



.whatsapp{text-align: center;background-image: url(../images/pattern-whatsapp.jpg);background-color: #eeeeee;}
.whatsapp h2{font-size: 26px;font-family: 'product_sansbold';margin: 10px 0 20px 0;color: #289bb6;}
.whatsapp span{color:#5cd168;font-size: 30px; }
.whatsapp h4{font-size: 26px;font-family: 'product_sansbold';position: relative;    margin-top: 30px;}
.whatsapp p{font-size: 14px;font-family: 'product_sansregular';color: #3e3e3e;margin: 10px 0 0 0;}
.whatsapp .ring-round {background-color: #289bb6;color: #fff;padding: 19px 12px 19px 14px;font-size: 15px;border-radius: 40px;}
/*.whatsapp .ring-round::after {color: #289bb6;content: "\f0d8"; position: absolute;font-size: 35px;top: -33px;font-family: 'FontAwesome';left: 53%;z-index: 99;margin: -32px -16px 8px;}*/



/* =========== connect-form ============== */

.form-wrap{position: relative;margin: 60px 0 0;}
.form-wrap h3{font-size:26px; font-family: 'product_sansregular'; text-align: center;margin: 30px 0 5px 0; }
.form-wrap h3 span{ color: #289bb6; font-size: 32px;}
.form-wrap .go{background-color: #289bb6; padding: 8px 7px; border-radius: 20px;color: #fff;}
.form-wrap .boys {background-color: #289bb6;padding: 19px 9px;border-radius: 37px;color: #fff;font-size: 16px;}
.form-wrap p{text-align: center;color: #929292;font-size: 20px;margin-bottom: 30px;}
.inner-wrap{margin: 0;}
.inner-wrap p{margin-bottom: 0;}
.connect-form .form-group{margin-bottom: 25px;}
.connect-form .form-control{background-color: #289bb6; color: #fff;}
.connect-form .submit-button {cursor: pointer;height: 50px;width: 100%;background-color: #000; color: #fff;margin-bottom: 20px; border: none;text-align: center;}
.connect-form .form-control::-webkit-input-placeholder { color: #fff;}
.connect-form .form-control:-ms-input-placeholder { color: #fff;}
.connect-form .form-control::-moz-placeholder { color: #fff;}
.connect-form .form-control:-moz-placeholder { color: #fff;}
.connect-form .form-control:focus {outline: none;box-shadow:none !important;background-color: #289bb6;border-color: #c6c6c6; color: #fff;}
.connect-form .form-group{position: relative;}
.connect-form .btn{ background-color:#289bb6; color: #fff; border-color:#289bb6; }
.validation-msg {position: absolute; color: red; font-size: 14px; display: inline;}
.thank-msg {position: absolute; margin: -50px auto;font-size: 12px;
left: 50%;
            transform: translate(-50%,0);
    -webkit-transform: translate(-50,0);
       -moz-transform: translate(-50,0);
        -ms-transform: translate(-50,0);
         -o-transform: translate(-50,0);}
.thank-msg2 {position: absolute; margin: -50px auto;font-size: 12px;
left: 50%;
            transform: translate(-50%,0);
    -webkit-transform: translate(-50,0);
       -moz-transform: translate(-50,0);
        -ms-transform: translate(-50,0);
         -o-transform: translate(-50,0);}

#sucsMsg{ font-family: 'product_sansbold'; text-align: center; font-size: 18px; display: inline;}
.msg-group{ text-align: center;}
/*.thank-msg::before{color: #289bb6;content: "";position: absolute; width: 100px;height: 1px;background-color: #c6c6c6;
bottom: -10px;left: 50%;
            transform: translate(-50%,0);
    -webkit-transform: translate(-50,0);
       -moz-transform: translate(-50,0);
        -ms-transform: translate(-50,0);
         -o-transform: translate(-50,0);}*/
#myform .btn-sanjo{ background-color: #289bb6; color: #fff;}

/* =========== 225-sanjo ============== */

.sanjo-about-banner{}
.inner-image-box img{border-bottom: 5px solid #289bb6; position: relative;}
.inner-image-box{position: relative;margin-top: 90px;}
.sanjo-about-banner span{color: #fff;font-size: 28px;}
.sanjo-about-banner h3{position: absolute; font-size: 38px;font-family: 'product_sansbold';z-index: 1;bottom: 45px;margin: 0 45px;}
.sanjo-about-banner h3::before{ content: "";position: absolute;width: 60px;height: 60px;background-color: #289bb6;z-index: -99;border-radius: 42px;margin: -8px -15px;}
.about-story {margin: 30px 0;}
.about-story h2{font-size: 32px; font-family: 'meeraregular'; text-align: center;}
.about-story h3{font-size: 32px; font-family: 'product_sansitalic';text-align: center;}
.about-story h3{position: relative;}
/*.about-story h3::before{content: "";width: 100px;height: 1px;position: absolute;background-color: #289bb6;left: 50%;bottom: -15px;
            transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
       -moz-transform: translate(-50%,-50%);
        -ms-transform: translate(-50%,-50%);
         -o-transform: translate(-50%,-50%);
}*/
/*
.about-story h3::after{content: "";width: 50px;height: 1px;position: absolute;background-color: #289bb6;right: 50%;bottom: -25px;
            transform: translate(50%,-50%);
    -webkit-transform: translate(50%,-50%);
       -moz-transform: translate(50%,-50%);
        -ms-transform: translate(50%,-50%);
         -o-transform: translate(50%,-50%);
}
*/

.about-pg {color: #767474;font-size: 20px;font-family: 'meeraregular';text-align: left;margin: 30px 0;}
.about-pg p{ font-size: 19px; color: #575757;}
.change-font{ font-family: 'product_sansregular';}
.about-pg span{color: #000;font-size: 25px;font-family: 'meeraregular';}
.about-story h3 span{color: #289bb6;}
.about-pg img{margin: 0 auto 20px auto;}
.viewallyrs .circle-bg{ margin-bottom: 25px;}
.fb-help{ cursor: pointer; font-family: 'product_sansitalic';}


/*================== bottom to top ==================*/

#scroll {position: fixed;bottom: 20px;right: 30px;z-index: 99;border: none;outline: none;background-color: #4e4e4e;color: white;cursor: pointer;border-radius: 100%;
    width: 32px;height: 32px;padding: 5px 9px;}

#scroll:hover {
  background-color: #289bb6;
}



/* =========== RESPONSIVE ============== */
@media (max-width: 1200px) { 
    .navbar-brand > img { width: 198px;margin-top: 11px;}
   /* .custom-nav.prev{ left: -30px; }
    .custom-nav.next{ right:-30px;}*/
    .socil-icon a {font-size: 11px;}

}
@media (max-width: 991px) {
     .navbar-header { float: none;}
    .navbar-left,.navbar-right {float: none !important;}
    .navbar-toggle {display: block;}
    .navbar-collapse {border-top: 1px solid transparent;box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);}
    .navbar-fixed-top {top: 0;border-width: 0 0 1px;}
    .navbar-collapse.collapse {display: none!important;}
    .navbar-nav {float: none!important;margin-top: 7.5px;background-color:#fff;}
    .navbar-nav>li {float: none;}
    .navbar-nav>li>a {padding-top: 10px;padding-bottom: 10px;}
    .collapse.in{display:block !important;}
    header ul.navbar-nav {margin-top:0;}
    .socil-icon {border-left:0;}
    .social{float: left;}
    
    .navbar-toggle {margin-top: 12px;color: #289bb6;font-size: 30px; text-align: center; font-family: 'product_sansregular';text-transform: uppercase;}
    .hs-right h2{text-align: center;}
    .hs-left {text-align: center;margin: 30px 0;}
     footer .footer-qrts {margin: 15px 9px;}
    .socil-icon {margin: 10px 10px;}
    .fb-page{margin: 10px 10px;}
    .custom-nav.prev{ left: 0;  }
    .custom-nav.next{ right: 0;}
    footer .footer-p1{display: block;}
    
    .first-r h2 {display: block;font-size: 56px; text-align: center;}

    .banner {margin-bottom: 0px;margin-top: 90px;}
    .inner-block .left {left:46%;}
    .inner-block-rgt .view-teacher{left:54%;}
    
    .anim-slider{ max-width: 490px; margin: 20px auto 0 auto; height: 120px;}
    .anim-slide img#visitn{ top: 30px;}
}

@media (max-width: 767px) {
    .home-history{text-align: center;}
    .socil-icon {margin: 10px 10px;}
    header .logo-large{display: none;}
    header .logo-small {display: block;margin: 4px 0 auto;}
    .navbar-brand > img {width: auto;}
    .class-foto-section .boys-grid.boys-grid { width: 167px; margin: 12px auto;}
    .collapse .nav{ background-color: #FFF;}
    header ul.navbar-nav{ margin-top: 0;}
    .bnr-txt h5{ font-size: 44px;}
    .bnr-txt h3{ font-size: 46px;}
    .bnr-txt{top: 60%;}
    .first-r br {display: none;}
    .teacher-pic{text-align: center;margin: 9px 0;}
    .anim-slider{ height: 90px;}
    .entha{ left: 0; width: 210px; height: 74px;}
    .urclass{ right: 0; width: 170px; height: 65px;}
    .anim-slide img#visitn{ left: 10%;}
    .inner-block .left {left: 45%;}
    .inner-block-rgt .view-teacher {left: 55%;}
    .inner-block h3{font-size: 24px;}

@media (max-width: 479px) {
    .class-dission ul li a { width: 190px; text-align: center; margin: 11px 18px;}
    .thank-msg::before{display: none;}
    .sanjo-about-banner h3 {font-size: 22px; margin: 0; left: 0; bottom: 20px;
                transform: translate(0,-50%);
        -webkit-transform: translate(0,-50%);
           -moz-transform: translate(0,-50%);
            -ms-transform: translate(0,-50%);
             -o-transform: translate(0,-50%);
    }
    .about-story h2{ font-size: 23px; margin-bottom: 15px;}
    .about-story h3{ font-size: 23px;}
    .about-pg{ margin-top: 45px;}
    .sanjo-about-banner h3::before{ width: 40px;  height: 40px;}
    .sanjo-about-banner span{ font-size: 22px;}
    .bnr-txt{top: 70%;}
    .bnr-txt h5{ font-size: 26px;}
    .bnr-txt h3{ font-size: 26px;}
    .year-wrap h3,.year-wrap h3 a{ font-size: 18px;}
    .first-r h2 {display: block;font-size: 35px;text-align: center;}
    .new{top:72%;}
    .new h3{font-size: 20px;}
    .main-text h2{font-size: 22px;}
    .text-box {margin-top:30px;}
    .blue-text{float: left;}
    
    .anim-slider{ height: 100px; max-width: 321px; margin: 20px auto 0 auto;}
    .entha{left:0; width:135px; height: 49px; top: 25px;}
    .urclass{right: 0; width: 112px; height: 45px; top: 25px;}
    .anim-slide img#visitn{left:0; margin-bottom: 0;}
     .inner-block-rgt .view-teacher {left: 54%;}
    .inner-block h3 {font-size: 18px;}
    .inner-block .left { left: 48%;}
    .class-foto-section .boys-grid.boys-grid { width: auto;}
    }
@media (max-width: 380px){
    .class-foto-section .boys-grid{width: 100%;height:258px;}
    .class-foto-section .teacher-fill {height: 258px;}
     .inner-block h3{font-size: 14px;}
    .inner-block-rgt .view-teacher{left: 53%;font-size: 11px;bottom: 27px;}
    .inner-block .left {left: 48%;font-size: 11px;bottom: 27px;}
    }
    
@media (max-width: 319px){
    footer .fa-facebook{display: block;}
    footer .fb-page{display: none;}
    .class-foto-section .boys-grid.boys-grid {border-bottom: 2px solid #289bb6;width: 150px;}
    .thank-msg::before{display: none;}
    .sanjo-about-banner h3 {left: 15px;}
    .bnr-txt h5{ font-size: 20px;}
    .bnr-txt h3{ font-size: 26px;}
    
}
