/*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*/
/*--------- SVET Web design ---------------------------------------*/
/*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*/

/* colors light blue: #ccccff
    dark blue: #0000cc
    text color:  */
/*-------- Basic Setup ----------*/

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}


html,
body{
/*    background-color: #080d89; */
    color: #505050;
/*    font-family: 'Arial', serif; */
    font-family: 'Lato', 'sans-serif';
    font-weight: 400;
    font-size: 20px;
    text-rendering: optimizeLegibility;
    margin: 0;
    padding: 0;
    /*margin-right: 5%;
    margin-left: 5%; */

}


.clearfix{zoom:1}
.clearfix:after {
    content: ".";
    clear: both;
    display: block;
    height: 0;
    visibility: hidden;
}

/*-------- header ----------*/

h1, h2, h3 {
    font-weight: 500;
    text-transform: uppercase;
}

h1{
    vertical-align: middle;
   /* color: #ff4e00;   ff6c00 #ff4e00*/
    color: #ff4e00;
    font-size: 175%;
    font-weight:600;
    word-spacing: 10px;
    letter-spacing: 2px;
    display: table-cell;
    padding: 0;
    -webkit-text-stroke: 1px #fff;

}

.h2q {
    font-size: 120%;
    color: #bf6516;
    margin: 0;
    word-spacing:20px;
    text-align: center;
    letter-spacing: 7px;
    font-style: italic
    
}

.h2v{
    color: #fff;
}

h2{
    font-size: 150%;
    word-spacing: 10px;
    text-align: center;
    margin-top: 2%;
    margin-bottom: 3%;
    letter-spacing: 5px;
    
}

h2:after {
    display:block;
    height: 2px;
    content: "";
    background-color: #ff4e00;
    width: 10%;
    margin: auto;
    margin-top: 1%;
    
}


h3{
    font-size: 110%;
    margin-bottom: 2%;
    margin-top: 2%;
    text-align: center;
    
}

#js-header {
    position: fixed;
    top:0;
    z-index: 999;
    width: 100%;
    height: 15vh;
}

/*
.header {
    // background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url(img/hero.jpg) 
    background-image: url(img/SVET04.jpg), linear-gradient(rgba(0, 0, 0, 0.81), rgba(0, 0, 0, 0.81));
    background-image: url(img/SVET04.jpg), -moz-linear-gradient(rgba(0, 0, 0, 0.81), rgba(0, 0, 0, 0.81));
    background-image: url(img/SVET04.jpg), -webkit-linear-gradient(rgba(0, 0, 0, 0.81), rgba(0, 0, 0, 0.81)); 
   // background-image: url(img/SVET01.jpg), -webkit-linear-gradient(top, rgba(240,249,255,1) 0%,rgba(203,235,255,1) 47%,rgba(161,219,255,1) 100%); 
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100% 100%; 

    height: 90%;
    width: 100%;
    
} */

.header {
    /*background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url(img/hero.jpg) */
    background-image: -webkit-linear-gradient(rgba(1, 3, 18, 0.5), rgba(0, 23, 152, 0.5)), url(img/SVET04.jpg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100% 100%; 
    z-index: 999;
    height: 90%;
    width: 100%;
    
}

#top-padding{
    margin-top:  18vh;
}

.svet-textbox {
    margin-left: 2em;
    width: 75%;
    float: left;
    height: 100%;
    vertical-align: middle;
    text-align:left;
    display: table;
   

/*    margin-top: 25%; */
}



.logo-space {
    float: left;
    left: 10px;
    border: 2px solid #2a0ec4;
    
}

.logo-space, 
.founder-space {

    position: relative;
    width: 6%;
    height: 80%;
    margin: 1.5vh;

}

.founder-space {
    float: right;
    right: 10px;
}

.logo {
    height: 100%;
    width: 100%;

}

.founder {
    float: right;
    max-height: 100%;
    max-width: 100%;
    vertical-align: middle;
    margin-right: 10px;
    border-radius: 50%;
    border-color: #2a0ec4;

}


/*
.logo-black {
    height:50px;
    width: auto;
    float: left;
    margin-top: 5px;
    margin-left: 10px;
}
.logo-black{
display: none;
}
*/

/* -------- Navigation bar ------ */

.main-nav{
    float:left;
    position: fixed;
    list-style: none;
    width: 100%;
    height: 4.5%;
    font-size: 75%;
    padding-right:  5%;
    background-color: #fff;
    border-bottom: 2px solid #001a62;

    /*
    background: -moz-linear-gradient(top, rgba(184,225,252,1) 0%, rgba(169,210,243,1) 10%, rgba(144,186,228,1) 25%, rgba(144,188,234,1) 37%, rgba(144,191,240,1) 50%, rgba(107,168,229,1) 51%, rgba(162,218,245,1) 83%, rgba(189,243,253,1) 100%); /* FF3.6-15 */
    /*
    background: -webkit-linear-gradient(top, rgba(184,225,252,1) 0%,rgba(169,210,243,1) 10%,rgba(144,186,228,1) 25%,rgba(144,188,234,1) 37%,rgba(144,191,240,1) 50%,rgba(107,168,229,1) 51%,rgba(162,218,245,1) 83%,rgba(189,243,253,1) 100%); /* Chrome10-25,Safari5.1-6 */
    /*
    background: linear-gradient(to bottom, rgba(184,225,252,1) 0%,rgba(169,210,243,1) 10%,rgba(144,186,228,1) 25%,rgba(144,188,234,1) 37%,rgba(144,191,240,1) 50%,rgba(107,168,229,1) 51%,rgba(162,218,245,1) 83%,rgba(189,243,253,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    

/*    margin: 50px 50px; */
}

.main-nav li {
    display: inline-block;
    text-align: center;
    padding: 8px 20px;
    vertical-align:middle;
    font-size: 90%;
    letter-spacing: 2px;
    text-transform: uppercase;
    }

.main-nav li a:link,
.main-nav li a:visited {
    padding: 8px 5px;
    color: #0000cc;
    text-decoration: none;
    border-bottom: 2px solid transparent;
    -webkit-transition: background-color 1s, color 1s;
    transition: background-color 1s, color 1s;
}


.main-nav li a:hover,
.main-nav li a:active {
/*    border-bottom: 2px solid #1616bf; */
    background-color: #ff4e00;
    
    color: #fff;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}



.main-nav ul a {
    display: block;
}

/*
.dropbtn:hover,
.dropbtn:active  {
    background-color: #ff4e00;


} */

.dropdown-content {

/*    
    
    background: -moz-linear-gradient(top, rgba(184,225,252,1) 0%, rgba(169,210,243,1) 10%, rgba(144,186,228,1) 25%, rgba(144,188,234,1) 37%, rgba(144,191,240,1) 50%, rgba(107,168,229,1) 51%, rgba(162,218,245,1) 83%, rgba(189,243,253,1) 100%); /* FF3.6-15    
    background: -webkit-linear-gradient(top, rgba(184,225,252,1) 0%,rgba(169,210,243,1) 10%,rgba(144,186,228,1) 25%,rgba(144,188,234,1) 37%,rgba(144,191,240,1) 50%,rgba(107,168,229,1) 51%,rgba(162,218,245,1) 83%,rgba(189,243,253,1) 100%); /* Chrome10-25,Safari5.1-6 
    
    background: linear-gradient(to bottom, rgba(184,225,252,1) 0%,rgba(169,210,243,1) 10%,rgba(144,186,228,1) 25%,rgba(144,188,234,1) 37%,rgba(144,191,240,1) 50%,rgba(107,168,229,1) 51%,rgba(162,218,245,1) 83%,rgba(189,243,253,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    
    background: #fff;
    display: none;
    margin-top: 0.6%;
    position: absolute;
    min-width: 160px;
    cursor:pointer;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);

}

li .dropdown-content a {
    display: block !important;
    text-align: left;

}


.dropdown-content a:hover {background-color: #ff4e00;}
/* li a:hover, */
.dropdown:hover .dropbtn {
            background-color: #ff4e00;
        }

.dropdown:hover .dropdown-content {
    display: block !important;

} 



/*
.dropbtn {
    display: inline-block;
    text-decoration: none;
}

*/


.icon-home{
    color: #ff4e00;
    display: block;
/*    padding-left: 800%; */
    float: right;
    text-align: center;
    font-size: 150%;
    margin-top: 2px;
    /* secrets to align text and Icons */
    vertical-align:middle;
    -webkit-transition: font-size 1s;
    transition: font-size 1s;

}


icon-home:hover
 {
    font-size: 160%;
} 

/*
.mobile-nav-icon{
    float: right;
    color: #fff;
    margin-top: 30px;
    cursor: pointer;
    font-size: 150%;
    display: none;
}

 */

/***********************/
/* slide styling start */
/***********************/


.slide {
    width: 100%;
    height: 70.5vh;
/*    margin-top: 220px; */ /* commented as margin top will be set by JQUERY */
    background:  -moz-linear-gradient(top, rgba(240,249,255,1) 0%, rgba(203,235,255,1) 47%, rgba(161,219,255,1) 100%);
    background: -webkit-linear-gradient(top, rgba(240,249,255,1) 0%,rgba(203,235,255,1) 47%,rgba(161,219,255,1) 100%);
    background: linear-gradient(to bottom, rgba(240,249,255,1) 0%,rgba(203,235,255,1) 47%,rgba(161,219,255,1) 100%);
    
}

/* Slideshow container */
.slideshow-container {
    width: 75%;
    height: 100%;
    position: relative;
    margin: auto;
    overflow:hidden;
}

.mySlides {display:none;
    max-height: 100%;
    max-width: 100%;
}

/* Fading animation */
.fade {
  -webkit-animation-name: fade;
  -webkit-animation-duration: 4s;
  animation-name: fade;
  animation-duration: 4s;
}

.fit{
    display: inline-block;
    width: 100%;
/*    height: 100%; */
    height: 70.5vh;
} 


/* Caption text */
.text {
  color: #f2f2f2;
  font-size: 15px;
  padding: 8px 12px;
  position: absolute;
  bottom: 8px;
  width: 100%;
  text-align: center;
}

/* Number text (1/3 etc) */
.numbertext {
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}

/* The dots/bullets/indicators */
.dot {
  height: 13px;
  width: 13px;
  margin: 0 2px;
  background-color: rgba(255, 79, 1, 0.46);
  border: 2px #fff solid;    
  border-radius: 50%;
  display: inline-block;
  transition: background-color 2s ease;
}

.active {
  background-color: #ff4e00;
}

.dots {
    text-align: center;
    margin: 0vh;
    z-index: 99;
 
 
}


@-webkit-keyframes fade {
  from {opacity:0.5; -webkit-transform:scale(0.75);} 
  to {opacity:1.0;-webkit-transform: scale(1.25);}
}

@keyframes fade {
  from {opacity:0.5;transform:scale scale(0.75);} 
  to {opacity:1.0;transform: scale(1.25);}
}

/* On smaller screens, decrease text size 
@media only screen and (max-width: 300px) {
  .text {font-size: 11px}
}
*/
/* slide styling ends */

.section-welcome {
    background-color: #edf6ff;
    padding-bottom: 10px;
}




/***********************/
/* showcase           **/
/***********************/

.show{
    display: inline-block;
}

.showcase{
    display: inline-block;
    background-color: rgba(255, 204, 204, 0.23);
    width: 50%;
    position: relative;

}

#yr{
    color: #ff4e00;
    font-weight: 600;
}
.box {
    padding: 1%;
}


.box-style{
    line-height: 145%;
    letter-spacing: 2px;
    text-align: right;
    vertical-align: middle;
    font-size: 150%;
    height: 200px;
    color: #fff;
    padding-top:100px;
    padding-right: 5px;
    
}

.box-style01{
    background-color: #f05d57;
    
}


.box-style02{
    background-color: rgb(5, 198, 214);
    
}

.box-style03{
    background-color: #fd7f12;
    
}

.box-style04{
    background-color: #06a22a;
    
}

.box img{
    width:100%;
    height: 200px;

}

.progress{
    height: 760px;
    width: 50%;
    display: inline-block;
    float: right;
    background-color: rgba(230, 230, 230, 0.19);
}

.progress img {
    width: 90%;
    margin: 5%;
}

/***********************/
/* about Us           **/
/***********************/


.section-aboutus {

    width: 100%;
/*       
    padding-bottom: 10px;
    background-color: #edf6ff;
    background-image: -webkit-linear-gradient(rgba(45, 60, 70, 0.81), rgba(45, 60, 70, 0.81)), url(img/overview.jpg);
    background-image: linear-gradient(rgba(45, 60, 70, 0.81), rgba(45, 60, 70, 0.81)), url(img/overview.jpg);
    background-size: cover;
    background-position:center;
    background-attachment: fixed; */ 
}

.aboutus-img-box{
    display: block;
    float: left;
    width: 30vw;
    height: 80vh;
}

.aboutus-img-box img{
    display: block;
    width: 100%;
    height: 50%;
}

.overview {
    position: relative;
    display: block;
    float: right;
    width: 68vw;
    height: 80vh;
} 

.motto{
    text-align: center;
    color: #ff4e00;
    font-style: italic;
    word-spacing: 5px;
    letter-spacing: 2px;
    font-size: 120%;
    margin-bottom: 25px;
    
}

.quote{
    color:#848484;
    font-size: 200%;
}


.founder-msg{
    width: 100%;
    background-color: rgba(242, 243, 255, 0.46);
}

.founder-box{
    display: block;
    float: left;
    width: 30vw;
    /* background-color: #b9d2db; */
    background-color: #d6d7e8;
}

.founder-box img{
    display: block;
    width: 100%;
    padding:10%;
}


.founder-stmt{
    position: relative;
    display: block;
    float: right;
    width: 68vw;

}

.mission{
    width: 100%;
    background-color: #2c2c2c;
}

.mission-box{
    display: block;
    float: left;
    width: 30vw;
    background-color: #c7c7c7;
}

.mission-box img {
    display: block;
    width: 100%;
    padding: 10%
}

.mission-stmt{
    position: relative;
    display: block;
    float: right;
    width: 68vw;
    color: #fff;
}


.principle-desk{
    width: 100%;
    margin: 0;
    padding: 0;
    background-color: rgba(255, 218, 218, 0.22);
}

.principle-box{
    display: block;
    float: left;
    width: 30vw;
    background-color: #ffdada; 
}

.principle-box img {
    display: block;
    width: 100%;
    padding: 10%;
}

.principle-stmt{
    position: relative;
    display: block;
    float: right;
    width: 68vw;

}



/***********************/
/* academics          **/
/***********************/

.academics {
    position: relative;
    display: block;
    float: right;
    width: 68vw;

}


.academics-img-box{
    display: block;
    float: left;
    width: 30vw;
    height: 90vh;

}

.academics-img-box img{
    display: block;
    width: 100%;
    height: 50%;
 
}

.rnr{
    color: #ff4e00;
}


/***********************/
/* Admission          **/
/***********************/


.section-admission {
    width: 100%;

}

.admission {
    position: relative;
    display: block;
    float: right;
    width: 68vw;

}


.admission-img-box{
    display: block;
    float: left;
    width: 30vw;
    height: 80vh;

}

.admission-img-box img{
    display: block;
    width: 100%;
    height: 50%;
 
}

.appForm{
    font-size: 60%;
    width: 60px;
    margin-left: 15%;
}


.appl-form img{
    width: 60px;
    height: 60px;
}


/***********************/
/* infrastructure bar **/
/***********************/


.infra-section {
    padding: 0;
    width: 100%;
    margin-left: 2.5%;
    margin-right: 2.5%;
    background-color: #f5faff;
}

.facility{
    background-color: #e8f4ff;
    height: 40vh;
    
}

.facility-img-box{
    display: block;
    float: left;
    width: 32.26%;
    height: 40vh;
}

.facility-img-box img{
    display: block;
    width: 100%;
    height: 95%;
}

.facility-txt {
    position: relative;
    display: block;
    float: right;
    width: 65%;
    height: 40vh;
} 

.infra-showcase{
    padding-top: 20px;
    width: 100%;
    height: 20vh;
}

.infra-col {
    display: block;
    float:left;
    margin: 0;
    width: 32.26%;
    height: 20hv;
    overflow: hidden;
}


.infra-photo img {
    height: 30vh;
    width: 90%;
    -webkit-transform: scale(1.15);
    transform: scale(1.15);
    -webkit-transition: opacity 0.5s, -webkit-transform 0.5s;
    transition: opacity 0.5s, -webkit-transform 0.5s;
    transition: transform 0.5s, opacity 0.5s;
    transition: transform 0.5s, opacity 0.5s, -webkit-transform 0.5s;
}

.infra-photo img:hover{
    -webkit-transform: scale(1.03);
    transform: scale(1.03);
    opacity: 1.5;
}




/***********************/
/* contactUs **/
/***********************/

.contact-form {
    width: 90%;
    margin: 0 auto;
}

.nbr,
input[type=text],
input[type=email],
select,
textarea {
    width: 100%;
    padding: 7px;
    border-radius: 3px;
    border: 1px solid #ccc;
}

textarea {
    height: 100px;
}

input[type=checkbox] {
    margin: 10px 5px 10px 0;
}

*:focus {outline: none;}

.form-box{
    position: absolute;
    top:0;
    right: 0;
    width: 50%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.8);
    z-index: 10;
}


/*---------    Map -------------------------------*/

.map-box{
    position: relative;
    width: 100%;
    height: 500px;
}
#map{
    position: relative;
    width: 100%;
    height: 500px;
    z-index: 0;
}




.contactUs{
/*    margin-top: 226px;     */ 
    width: 100%;
    padding-left:10%;
    color: #fff;
    display: inline-block;
    background-color: #f8f6f9;
    font-size: 90%;
    font-weight:400;
    word-spacing: 2px;
    letter-spacing: 2px;
    line-height: 120%;

    text-align: center;
    display: table;

}

.contactBox{
    width: 30%;
    height: 35vh;
    margin-top: 100px;
    margin-bottom: 100px;
    display: table-cell;
    vertical-align: middle;
    float: left;

    padding: 4% 2%;
}

#addr{
    background-color: #301010;
    
}

#ph{
    background-color: #022643;
}

#Ctntemail{
    background-color: #2a3212;
    
}

.addrClr{
    color: #ff4e00;
    }


/*-------- Bottons ----------*/

input[type=submit] {    
    display: inline-block;
    padding: 10px 30px;
    text-decoration: none;
    font-weight: 400;
    border: none;
    background-color: #ff4e00;
    color: #fff;
    border-radius: 100px;
    
    -webkit-transition: background-color 0.5s, border 0.5s, color 0.5s;
    transition: background-color 0.5s, border 0.5s, color 0.5s;
}


input[type=submit]:active,     
input[type=submit]:hover {    
    background-color: #bf6516;

}

/*-------- Paras ----------*/
.long-copy {
    position: relative;
    line-height: 145%;
    max-width: 70%;
    margin-left: 15%;
    text-align: justify;
    margin-bottom: 3%;
    padding-bottom: 3%;
}


.short-copy {
    line-height: 145%;
    width: 95%;
    margin: 1%;
    text-align: justify;
}



/*-------- Paras ----------*/
.icon-big{
    display: block;
    font-size: 200%;
    color:  #ff4e00;
    
}

/*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*/
/*---------    News and Events               ----------------------------------*/
/*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*/

.section-news{
/*    margin-top: 226px;     */ 
    background-color: #fefdfa;
    padding-bottom: 10px;
}


.cal-gal {
    width: 100%;
    display: inline-block;
    margin: 5%;
    background-color: #faf9f2;
}
.calendar{

    width: 45%;
    float: left;
    background-color: #faf9f2;
}

.galary {
    width: 45%;
    float: left;
}


/*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*/
/*---------    Footer-------               ----------------------------------*/
/*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*/

footer{
    background-color: #333333;
    padding: 1%;

}

.footer-ad{
    font-size: 80%;
}

.footer-nav {
    list-style: none;
    float: left;
}

.footer-links {
    list-style: none;
    float: right;
}

.footer-nav li,
.footer-links li {
    display: inline-block;
    margin-right: 20px;
}

.footer-nav li:last-child,
.footer-links li:last-child {
    margin-right: 2px;
}


.footer-nav li a:link,
.footer-nav li a:visited,
.footer-links li a:link,
.footer-links li a:visited{
    text-decoration: none;
    border: 0;
    color: #888;
    font-size: 90%;
    -webkit-transition: color 0.2s;
    transition: color 0.2s;
}

.footer-nav li a:active,
.footer-nav li a:hover{
    color: #ddd;
}


.footer-links li a:link,
.footer-links li a:visited{
    font-size: 180%;
}

.ion-social-facebook,
.ion-social-twitter,
.ion-social-googleplus,
.ion-social-instagram{
    -webkit-transition: color .5s;
    transition: color .5s;
}

.ion-social-facebook:hover{
    color: #3b5998;
}

.ion-social-twitter:hover{
    color: #55acee;
}

.ion-social-googleplus:hover{
    color: #dd4b39;
}

.ion-social-instagram:hover{
    color: #125688;
}

footer p{
    padding: 1%;
    text-align: center;
    font-size: 80%;
    color: #888;
}

/* animation for scrolling */

.js--wp-1,
.js--wp-2,
.js--wp-3
{
    opacity: 1;
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
}

.js--wp-4 {
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
}

.js--wp-1.animated,
.js--wp-2.animated,
.js--wp-3.animated
{
    
    opacity: 1;
}