/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : 20 Sep, 2020, 8:36:18 PM
    Author     : Jawahar
*/

/*@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;700;900&display=swap');*/
/*@import url('https://fonts.googleapis.com/css2?family=Libre+Baskerville:wght@700&display=swap');*/
@import url('https://fonts.googleapis.com/css2?family=Raleway:wght@400;700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto+Slab:wght@900&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Lora:wght@700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Anton&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Caveat&display=swap');

body{
    margin:0px;
    padding:0px;    
    background-image: url('images/tiny_grid.png');
    background-repeat: repeat;
}

.thin-bar{
    background-color: #042166;
    width:100%;
    height:4px;
    content:' ';
}

#page_header_wrapper{
    padding-top: 10px;
    padding-bottom: 5px;    
}

#home-page-top-container{
    width:100%;
    height:auto;        
    border-top: solid 4px #042166;
    border-left:solid 4px #042166; 
    border-right:solid 4px #042166; 
}

/*
#inner-top-div{    
    top:0px;
    width:100%;
    height:auto;            
    display:flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;  
    background-color: transparent;
}
*/

#inner-top-div{    
    top:0px;
    width:100%;
    height:auto;            
    display:flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;  
    /*background-color: transparent;*/
    /*background-color: rgba(89,191,255,0.9);*/
    background-color:white;
}

#logo-and-schoolname-div{
    /*background-color: rgba(89,191,255,0.9);        */
    width:100%;
    padding:10px;
    display:flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;    
    flex:1;
}

#school-name{
    /*font-family: 'Libre Baskerville', serif;*/
    font-family: 'Lora', serif;
    font-size: 1.5rem;
    font-weight: 700;
    text-align: left;
    line-height: 1.5rem;
    /*color:#073092!important;*/
    color:red!important;
    color:#990000!important;
    /*
    background: -webkit-linear-gradient(red, red, red, #8b0000, red, red, red);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;*/
}

#tag-line{
    text-align: right;    
    color:rgba(0,0,0,1.0);
    font-size: 0.8rem;
    font-weight: 100;
    background: -webkit-linear-gradient(#000, #000);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

#other-school-details-div{        
    text-align: right;
    line-height: 25px;
    color:#042166;
    margin-top: 10px;
    font-size: 1.2rem;
    flex:1;

    margin-right: 20px;

    display:flex;
    flex-direction: row;
    justify-content: flex-end;
    align-items: center;
}

.separator{
    color:black;
}

.menu-bar-container{    
    background-color: #0b48ab!important;
    background-color:#03083c!important;
    width:100%;        
    padding:1px;
}

@media (max-width: 700px){
    #inner-top-div{    
        top:0px;
        width:100%;
        height:auto;            
        display:flex;
        flex-direction: column;
        flex-wrap: nowrap;
        justify-content: center;
        align-items: center;  
        /*background-color: transparent;*/
        /*background-color: rgba(89,191,255,0.9);*/
        background-color:white;
    }

    #logo-and-schoolname-div{
        /*background-color: rgba(89,191,255,0.9);        */
        width:100%;
        padding:10px;
        display:flex;
        flex-direction: row;
        flex-wrap: nowrap;
        justify-content: center;
        align-items: center;    
        flex:1;
    }

    #school-name{        
        font-family: 'Libre Baskerville', serif;
        font-size: 1.2rem;
        line-height: 1.2rem;
        font-weight: 700;
        text-align: center;        
        margin-top: 5px;
        margin-bottom: 5px;
        color:rgba(0,0,0,1.0);        
    }

    .navbar {        
        padding: .5rem .5rem !important; 
    }

    #other-school-details-div{        
        text-align: right;
        line-height: 25px;
        color:#042166;
        margin-top: 10px;        
        flex:1;

        margin-right: 20px;

        display:flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }

    .btn{
        font-size: 0.8rem!important;
    }

    .image-buttons{
        height:25px;
    }

    .other-links{
        margin-top: 5px;
        margin-bottom: 5px;
    }

    #footer-container-div{
        background-color: rgba(50,50,50,0.8);
        color:white;
        padding-top:20px;
        padding-bottom:20px;
        display:flex;
        flex-direction: column;
        flex-wrap: nowrap;
        justify-content: center;
        align-items: center;
    }

    #contact-us-div{
        margin:auto!important;        
        display:flex;
        width:100%;
        flex-direction: column;
        flex-wrap: wrap;
        justify-content: center;
        align-items:center;
    }

    #school-timings-div{
        margin-top:50px;
    }
}


.red{
    color:#f1373e;   
}

.menu-bar-container{    
    background-color:#395e7d;
    background-color: #8a7ccf;
    background-color: rgba(50,50,50,0.8);
    width:100%;    
}

#slide-show-container{
    width:100%;       
}


.erp-button{
    background-image: url('images/erp_icon.png');
    background-repeat: no-repeat;
    background-position: left center;
    padding-left: 30px;
    background-origin: padding-box;    
}

.admission-form-button{
    background-image: url('images/admission_form_icon.png');
    background-repeat: no-repeat;
    background-position: left center;
    padding-left: 30px;
    background-origin: padding-box;   
}

.preschooling-button{
    background-image: url('images/jack_jill.png');
    background-repeat: no-repeat;
    background-position: left center;
    padding-left: 35px;
    background-origin: padding-box;   
}

.heading_1{
    background-image: url('images/tile_2.png');
    background-repeat: no-repeat;
    background-position: left center;
    padding-left:25px;
    border-bottom: dotted #743a52 1px;
    margin-bottom: 5px;
    font-family: 'Raleway', sans-serif;
    font-size: 1.3rem;
    font-weight: 700;
    color:#743a52;
}

.heading_2{                
    margin-bottom: 5px;
    font-family: 'Raleway', sans-serif;
    font-size: 1.1rem;
    font-weight: 700;
    color:#34421E;
}

.matter_1{    
    font-family: 'Raleway', sans-serif !important;
    font-size: 1.0rem;    
    font-weight: 400;
    color:black;
    text-align: justify;
    margin-top: 5px;
}

.centered-heading{
    text-align: center;
    font-family: 'Raleway', sans-serif;
    font-size: 1.2rem;
    font-weight: 700;
}

.right-sidebar-container{
    /*background-color: rgba(50,50,50,0.8);*/ 
    /*background-color:#0b48ab!important;*/
    background-color: transparent;
    padding-left: 5px;
    padding-right: 5px;
    padding-bottom: 10px;
}

.stitched-border {
    /*
    background:rgba(50,50,50,0.7);  
    color:yellow;         
    border: 2px dashed yellow;
    border-radius: 10px;
    box-shadow: 0 0 0 4px rgba(50,50,50,0.7), 2px 1px 6px 4px rgba(50,50,50,0.7);      
    */

    /*background:#03083c!important;*/
    background-color: transparent;
    color:#353962;         
    /*border: 2px solid #676a8a;*/
    /*border-radius: 10px;*/
    /*box-shadow: 0 0 0 4px rgba(50,50,50,0.7), 2px 1px 6px 4px rgba(50,50,50,0.7);      */
}

.right-container-header{    
    /*color:white;    */
    color:#353962;
    padding:10px;
    font-size: 1.5rem;
    font-weight: bold;
    text-align: center;    
}

.news-item{
    border: 1px solid black;
    margin: 0px 0px;
}

.news-item a {
    font-family: Arial, sans-serif;
    text-align: center;
    font-size: 1.2rem;
    font-weight: normal;
    color: #06f;
}

.news-item img {
    /*float: left;*/
    width: 100px;
    height:100px;
    margin: 5px 15px 5px 0;
}

.news-item li {
    padding: 10px;    
    border-bottom: 1px dashed navy;
    background: white;
}

.news-item ul {
    padding: 0;
    list-style: none;
}

#news-ticker{
    background-color: rgba(255,255,255,1);
    color:black;
    border-radius: 10px;
    padding:10px;
}

.news-container-div{    
    padding:5px;
    background-color: red;    
}

.news{
    color:black;
}



#footer-container-div{
    /*background-color: rgba(50,50,50,0.8);*/
    /*background-color: #0b48ab!important;*/
    background-color: #03083c!important;
    color:white;
    padding-top:20px;
    padding-bottom:20px;
    display:flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}

#contact-us-div{
    margin-right:50px;
}

#social-media-div{
    color:white;
    margin-left:50px;
}

#visitor-counter-div{
    color:white;
    margin-left:50px;
}

.social-media-link{
    color:white;
    text-decoration: none;
}

.social-media-link:hover{
    color:white;
    text-decoration: none;
}

.page-heading-container-div{
    margin-top: 10px;
    margin-bottom: 20px;
    width:100%;
    height:auto;   
    /*background-image: url('images/bk2.webp');*/
}

.page-heading-inner-div{
    width:100%;
    height:auto;   
    text-align: center;
    color:#073092;
    padding-top: 10px;
    padding-bottom: 10px;
    background-color:rgba(89,191,255,0.9);    
    font-family: 'Roboto Slab', serif;
    font-size: 3.5rem;
    line-height: 3.5rem;
    font-weight: 900;    
}

.photo-frame{
    border:solid 8px rgba(255,255,255,0.8);
}

.all-edge-shadow {
    -webkit-box-shadow: 0px 0px 6px 3px #cbcbcb;
    -moz-box-shadow: 0px 0px 6px 3px #cbcbcb;
    box-shadow: 0px 0px 6px 3px #cbcbcb;
}

.one-edge-shadow {
    -webkit-box-shadow: 0 8px 6px -6px #bababa;
    -moz-box-shadow: 0 8px 6px -6px #bababa;
    box-shadow: 0 8px 6px -6px #bababa;
}


.box-grid-container{
    display:flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;    
    margin-bottom:20px;
}


.text-box{
    width:180px;
    height:180px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    cursor:pointer;    
}

.image-box{
    width:180px;
    height:180px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    cursor:pointer;

    /*filter: blur(2px);
    -webkit-filter: blur(2px);*/

    /*-webkit-transition: -webkit-transform 0.9s ease-in;*/
    /*transition: transform 0.9s ease-in;*/

    transition        : all 0.5s linear;
    -moz-transition   : all 0.5s linear;
    -webkit-transition: all 0.5s linear;
    -o-transition     : all 0.5s linear;
}


@media (max-width:1024px){
    .text-box{
        width:150px;
        height:150px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        cursor:pointer;    
    }

    .image-box{
        width:150px;
        height:150px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        cursor:pointer;

        transition        : all 0.5s linear;
        -moz-transition   : all 0.5s linear;
        -webkit-transition: all 0.5s linear;
        -o-transition     : all 0.5s linear;
    }

    .box-text{
        color:white;
        font-family: 'Anton', sans-serif;
        font-size: 1.5rem!important;    
        text-shadow: 2px 2px black;
    }

    .principal-message-container{
        /*max-width: 100%!important;*/
        width:400px;
    }
}

@media (max-width:1280px){
    .text-box{
        width:170px;
        height:170px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        cursor:pointer;    
    }

    .image-box{
        width:170px;
        height:170px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        cursor:pointer;

        transition        : all 0.5s linear;
        -moz-transition   : all 0.5s linear;
        -webkit-transition: all 0.5s linear;
        -o-transition     : all 0.5s linear;
    }

    .box-text{
        color:white;
        font-family: 'Anton', sans-serif;
        font-size: 2.0rem!important;    
        text-shadow: 2px 2px black;
    }

    .principal-message-container{
        /*max-width: 100%!important;*/
        width: 450px;
    }
}


@media (min-width:1366px){
    .text-box{
        width:170px;
        height:170px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        cursor:pointer;    
    }

    .image-box{
        width:170px;
        height:170px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        cursor:pointer;

        transition        : all 0.5s linear;
        -moz-transition   : all 0.5s linear;
        -webkit-transition: all 0.5s linear;
        -o-transition     : all 0.5s linear;
    }

    .box-text{
        color:white;
        font-family: 'Anton', sans-serif;
        font-size: 2.0rem!important;    
        text-shadow: 2px 2px black;
    }

    .principal-message-container{
        /*max-width: 100%!important;*/
        width: 500px;
    }
}

.image-box:hover{
    /*-webkit-transition: -webkit-transform 0.9s ease-out;
    transition: transform 0.9s ease-out;*/
    /*filter: blur(0px);
    -webkit-filter: blur(0px);
    transition        : all 0.5s linear;
    -moz-transition   : all 0.5s linear;
    -webkit-transition: all 0.5s linear;
    -o-transition     : all 0.5s linear;*/
}

@media (min-width:1920px){
    .text-box{
        width:200px;
        height:200px;
    }

    .image-box{
        width:200px;
        height:200px;        
    }

    .box-text{
        color:white;
        font-family: 'Anton', sans-serif;
        font-size: 3rem;    
        text-shadow: 2px 2px black;
    }

    .principal-message-container{
        max-width: 100%!important;
    }
}

.grid-box-text-container{
    -webkit-transition: -webkit-transform 0.8s;
    transition: transform 0.8s;
}


.grid-box-text-container:hover{
    -moz-transform: scale(1.2);
    -webkit-transform: scale(1.2);
    -o-transform: scale(1.2);
    -ms-transform: scale(1.2);
    -webkit-transform: scale(1.2);
    transform: scale(1.2);

    -webkit-transition: transform 0.8s ease-in-out;
    -moz-transition:transform 0.8s ease-in-out;
    -ms-transition:transform 0.8s ease-in-out;    
}



.aqua-box{
    background-color:#52ccff;
}

.maroon-box{
    background-color:#b4100f;
}

.dark-gray-box{
    background-color: #252525
}

.box-text{
    color:white;
    font-family: 'Anton', sans-serif;
    font-size: 2rem;    
    text-shadow: 2px 2px black;
}

.welcome{
    background-image: url('images/welcome.webp');
    background-size: cover;
    background-position: center;

}

.media{
    background-image: url('images/media.webp');
    background-size: cover;
    background-position: center;    
}

.history{
    background-image: url('images/history.webp');
    background-size: cover;
    background-position: center;    
}

.why-us{
    background-image: url('images/whyus.webp');
    background-size: cover;
    background-position: center;    
}

.photos{
    background-image: url('images/photos.webp');
    background-size: cover;
    background-position: center;    
}