body
{
font-family: 'Titillium Web', sans-serif;
text-align:center;
}
*{
padding:0px;
margin:0px;
}

@media screen and (min-width: 860px) {
#maindiv{
width:100%;
height:62px;
position:fixed;
}
#navdiv{
background:#000;
height:62px;
width:100%;
line-height:0px;
}
#logo{
float:left;
cursor:pointer;
margin-left:45px;
padding-top:7px;
}
#logos
{
float:right;
margin-right:-840px;
cursor pointer;
padding-top:5px;
}
#navdiv ul{
float:right;
margin-right:250px;
line-height:20px;
position:relative;
z-index:100;
}
#navdiv ul li{
list-style-type:none;
display:inline-block;
}
#navdiv ul li a{
padding:20px;
text-decoration:none;
color:#e4ecf3;
font-size:15px;
display:block;
}
#navdiv ul li a:hover{
color: #FFA500;
transition:all 0.40s;
}
#navdiv ul li:hover ul{
display:block;
margin-left:17px;
}
#navdiv ul ul{
display:none;
width:200px;
position:absolute;
}
#navdiv ul li li{
background:#000;
display:block;
text-align:justify;
border:1px solid #e4ecf3;
}
#navdiv ul li li a{
padding:9px;
}
#navdiv .current_page{
color: #FFA500;
}
.banner{
width: 100%;
}
.container-banner{
width:100%;
height:370px;
}
.banner-img {
width: 100%;
height:370px; 
margin:0 auto;
}

#about{
background:#f2f2f2;
}
.about-container{
width:100%;
height:400px;
}
.about-container .left-column{
width:50%;
height:400px;
float:left;
}
.left-column h1{
font-size:20px;
padding:50px;
margin-bottom:-60px;
}
.left-column p{
text-align:justify;
margin:30px;
font-size:13.5px;
line-height:200%;
}

.about-container .right-column{
width:50%;
height:400px;
float:right;
}
.right-column .about-img{
width:90%;
height:300px;
padding:30px;
}

#vision{
background:#fff;
}
.container-vmv{
width:100%;
height:350px;
}
.container-vmv .vision-column{
width:33%;
height:350px;
float:left;
}
.vision-column .vision-img{
width:100px;
height:120px;
margin-bottom:-50px;
padding:30px;
}
.vision-column p{
text-align:center;
margin:30px;
font-size:13.5px;
line-height:170%;
}


.container-vmv .mission-column{
width:33%;
height:350px;
float:left;
}
.mission-column .mission-img{
width:110px;
height:120px;
margin-bottom:-50px;
padding:30px;
}
.mission-column p{
text-align:center;
margin:30px;
font-size:13.5px;
line-height:170%;
}


.container-vmv .value-column{
width:33%;
height:350px;
float:left;
}
.value-column .value-img{
width:100px;
height:120px;
margin-bottom:-50px;
padding:30px;
}
.value-column p{
text-align:center;
margin:30px;
font-size:13.5px;
line-height:170%;
}


#make-different{
background:#f2f2f2;
}
.container-fluid{
width:100%;
height:370px;
}

h1{
font-size:20px;
padding:40px;
}

.container-fluid .span1{width:22.404255319148934%;*width:22.351063829787233%;}
.container-fluid .span2{width:22.404255319148934%;*width:22.351063829787233%;}
.container-fluid .span3{width:22.404255319148934%;*width:22.351063829787233%;}
.container-fluid .span4{width:22.404255319148934%;*width:22.351063829787233%;}

.span1{
width:250px;
float:left;
padding-top:20px;
}
.span2{
width:250px;
float:left;
padding:20px;
}
.span3{
width:250px;
float:left;
padding:20px;
}
.span4{
width:250px;
float:left;
padding:20px;

}


h5{
text-align:center;
color:black;
font-size:13px;
padding:5px;
}
p{
text-align:center;
color:black;
font-size:12px;
font-weight:normal;
}
.box1
{
    background-color: #ffd63b;
    border-top: 1px solid #f0f0f0;
    padding: 30px;
    height:130px;
    margin-left:30px;
    border-radius: 4px;    
}
.box2
{
    background-color: #ffd63b;
    border-top: 1px solid #f0f0f0;
height:130px;
padding:30px;
margin-left:30px;
    border-radius: 4px;  
}

.box3
{
    background-color: #ffd63b;
    border-top: 1px solid #f0f0f0;
    padding: 30px;
height:130px;
margin-left:15px;
    border-radius: 4px;  
}
.box4
{
    background-color: #ffd63b;
    border-top: 1px solid #f0f0f0;
    padding: 30px;
    height:130px;
margin-left:15px;
    border-radius: 4px;  
}
.footer {
    background:#000;
    display: block;
    float: left;
    height:260px;
    margin: 0 auto;
    width: 100%;
}

.main_footer_fix {
    margin: 0 auto;
    padding-top: 0;
    width: 90%;
}
.span5
{
    color: #FFF;
margin-left:-20px;
    display: block;
    padding: 20px;
    margin-bottom:-10px;
    text-align:left;
    font-weight:bold;
    font-size:18px;
}
.pg
{
    color: #DCDCDC;
    text-align:left;
    display: block;
    font-size:16px;
}
.right_side {
    display: block;
    float: left;
    list-style-type: none;
    margin: 8px 2px 0px 0;
    padding: 15px 0px 20px 0px;
    width:28%;
}

.left_side {
    display: block;
    float: left;
    list-style-type: none;
    margin: 8px 2px 0;
    padding: 15px 10px 20px 0px;
    width: 20%;
}

.left_side ul {
    list-style-type: none;
    margin:0px;
    padding: 0px;
}
li.fotter_big_txt {
    color: #FFF;
    display: block;
    padding:25px;
    margin-left:-24px;
margin-bottom:8px;
    text-decoration: none; 
    font-weight:bold;
}
li.fotter_big_txt a {
    color: #FFFFFF;
    display: block;
    font-size: 18px;
    line-height: 20px;
    font-weight:bold;
    float:left;
text-decoration: none; 
}

li.fotter_txt {
    color: #fff;
    font-size: 16px;
    font-weight:normal;
    text-align:left; 
    list-style-type:none;
}
li.fotter_txt a {
    color: #fff;
    font-size: 16px;
    text-decoration: none;
}
li.fotter_txt a:hover {
    color: #FFA500;
    font-size: 16px;
    text-decoration: none;
}

.left_side .span5
{
    color: #FFF;
margin-left:25px;
    display: block;
    padding: 20px;
    margin-bottom:-10px;
    text-align:left;
    font-weight:bold;
    font-size:18px;
}


.logo1{
display: block;
float:left;
}
.logo1 .fotter_txt_w{
    float:left;
margin:12px;
}

.logo1 .fotter_txt_wp {
    color: #fff;
    font-size: 16px;
    font-weight:normal;
    text-align:left; 
    list-style-type:none;

}
.logo1 .fotter_txt_wp a {
     color: #fff;
    font-size: 16px;
    text-decoration: none;

}
.logo1 .fotter_txt_wp a:hover {
     color: #FFA500;
    font-size: 16px;
    text-decoration: none;

}

.logo2{
display: block;
margin-left:20px;
float:left;
}
.logo2 .fotter_txt_w{
    float:left;
margin:12px;
}

.logo2 .fotter_txt_wp {
    color: #fff;
    font-size: 16px;
    font-weight:normal;
    text-align:left; 
    list-style-type:none;

}
.logo2 .fotter_txt_wp a {
     color: #fff;
    font-size: 16px;
    text-decoration: none;

}
.logo2 .fotter_txt_wp a:hover {
     color: #FFA500;
    font-size: 16px;
    text-decoration: none;

}

.logo3{
display: block;
margin-left:20px;
float:left;
}
.logo3 .fotter_txt_w{
    margin:12px;
float:left;
}

.logo3 .fotter_txt_wp {
    color: #fff;
    font-size: 16px;

    font-weight:normal;


    text-align:left; 
    list-style-type:none;

}
.logo3 .fotter_txt_wp a {
     color: #fff;
    font-size: 16px;
    text-decoration: none;

}
.logo3 .fotter_txt_wp a:hover {
     color: #FFA500;
    font-size: 16px;
    text-decoration: none;

}


.row
{
margin-right:-15px;
margin-left:-15px
}
.footer_hide
{ 
display:block;
}
}





/* media query for tablet */

@media screen and (min-width: 420px) and (max-width: 860px) {
#logo{
float:left;
cursor:pointer;
margin-left:15px;
padding-top:5px;
}
#logos{
display:none;
}
#navdiv ul{
float:right;
margin-right:25px;
line-height:20px;
position:relative;
z-index:100;
}
#navdiv ul li{
list-style-type:none;
display:inline-block;
}
#navdiv ul li a{
padding:20px;
text-decoration:none;
color:black;
font-size:12px;
display:block;
}
#navdiv ul li a:hover{
color: #FFA500;
transition:all 0.40s;
}
#navdiv ul li:hover ul{
display:block;
margin-left:17px;
}
#navdiv ul ul{
display:none;
width:200px;
position:absolute;
}
#navdiv ul li li{
background:black;
display:block;
text-align:justify;
border:1px solid white;
}
#navdiv ul li li a{
padding:9px;
color:white;
}
#navdiv .current_page{
color: #FFA500;
}
.banner{
width: 100%;
position:relative;
}
.container-banner{
width:100%;
height:300px;
}
.banner-img {
width: 100%;
height:300px; 
margin:0 auto;
}

#about{
background:#f2f2f2;
}
.about-container{
width:100%;
height:450px;
position:relative;
}
.about-container .left-column{
width:50%;
height:450px;
float:left;
position:relative;
}
.left-column h1{
font-size:20px;
padding:80px;
margin-bottom:-90px;
}
.left-column p{
text-align:justify;
margin:30px;
font-size:12px;
line-height:200%;
}

.about-container .right-column{
width:50%;
height:450px;
float:right;
position:relative;
}
.right-column .about-img{
width:90%;
height:300px;
padding-top:90px;
margin-left:10px;
}

#vision{
background:#fff;
}
.container-vmv{
width:100%;
height:350px;
position:relative;
}
.container-vmv .vision-column{
width:33%;
height:350px;
float:left;
position:relative;
}
.vision-column .vision-img{
width:100px;
height:120px;
margin-bottom:-50px;
padding:30px;
}
.vision-column p{
text-align:center;
margin:30px;
font-size:13.5px;
line-height:170%;
}


.container-vmv .mission-column{
width:33%;
height:350px;
float:left;
position:relative;
}
.mission-column .mission-img{
width:110px;
height:120px;
margin-bottom:-50px;
padding:30px;
}
.mission-column p{
text-align:center;
margin:30px;
font-size:13.5px;
line-height:170%;
}


.container-vmv .value-column{
width:33%;
height:350px;
float:left;
position:relative;
}
.value-column .value-img{
width:100px;
height:120px;
margin-bottom:-50px;
padding:30px;
}
.value-column p{
text-align:center;
margin:30px;
font-size:13.5px;
line-height:170%;
}


#make-different{
background:#f2f2f2;
}
.container-fluid{
width:100%;
height:570px;
}

h1{
font-size:20px;
padding:40px;
}

.container-fluid .span1{
width:250px;
float:left;
padding-top:20px;
margin-left:110px;
position:relative;
}
.container-fluid .span2{
width:250px;
float:left;
padding:20px;
position:relative;
}
.container-fluid .span3{
width:235px;
float:left;
padding:20px;
margin-left:105px;
position:relative;
}
.container-fluid .span4{
width:230px;
float:left;
padding:20px;
position:relative;
}


h5{
text-align:center;
color:black;
font-size:13px;
padding:5px;
}
p{
text-align:center;
color:black;
font-size:12px;
font-weight:normal;
}
.box1
{
    background-color: #ffd63b;
    border-top: 1px solid #f0f0f0;
    padding: 30px;
    height:130px;
    margin-left:30px;
    border-radius: 4px;    
}
.box2
{
    background-color: #ffd63b;
    border-top: 1px solid #f0f0f0;
height:130px;
padding:30px;
margin-left:30px;
    border-radius: 4px;  
}

.box3
{
    background-color: #ffd63b;
    border-top: 1px solid #f0f0f0;
    padding: 30px;
height:120px;
margin-left:15px;
    border-radius: 4px;  
}
.box4
{
    background-color: #ffd63b;
    border-top: 1px solid #f0f0f0;
    padding: 30px;
    height:120px;
margin-left:10px;
    border-radius: 4px;  
}

.footer {
    background-color: #000;
    display: block;
    float: left;
    height:270px;
    margin: 0 auto;
    width: 100%;
}

.main_footer_fix {
    margin: 0 auto;
    padding-top: 0;
    width: 90%;
}
.span5
{
    color: #FFF;
margin-left:-20px;
    display: block;
    padding: 20px;
    margin-bottom:-10px;
    text-align:left;
    font-weight:bold;
    font-size:16px;
}
.pg
{
    color: #DCDCDC;
    text-align:left;
    display: block;
    font-size:14px;
}
.right_side {
    display: block;
    float: left;
    list-style-type: none;
    margin: 8px 2px 0px 0;
    padding: 15px 0px 20px 0px;
    width:28%;
}

.left_side {
    display: block;
    float: left;
    list-style-type: none;
    margin: 8px 2px 0;
    padding: 15px 10px 20px 0px;
    width: 20%;
}

.left_side ul {
    list-style-type: none;
    margin:0px;
    padding: 0px;
}
li.fotter_big_txt {
    color: #FFF;
    display: block;
    padding:25px;
    margin-left:-24px;
    margin-bottom:8px;
    text-decoration: none; 
    font-weight:bold;
}
li.fotter_big_txt a {
    color: #FFFFFF;
    display: block;
    font-size: 16px;
    line-height: 20px;
    font-weight:bold;
    float:left;
text-decoration: none; 
}

li.fotter_txt {
    color: #fff;
    font-weight:normal;
    text-align:left; 
    list-style-type:none;
}
li.fotter_txt a {
    color: #fff;
    font-size: 14px;
    text-decoration: none;
}
li.fotter_txt a:hover {
    color: #FFA500;
    font-size: 16px;
    text-decoration: none;
}

.left_side .span5
{
    color: #FFF;
margin-left:5px;
    display: block;
    padding: 20px;
    margin-bottom:-10px;
    text-align:left;
    font-weight:bold;
    font-size:16px;
}

.logo1{
display: block;
float:left;
}
.logo1 .fotter_txt_w{
    float:left;
margin:10px;
}

.logo1 .fotter_txt_wp {
    color: #fff;
    font-weight:normal;
    text-align:left; 
    list-style-type:none;

}
.logo1 .fotter_txt_wp a {
     color: #fff;
    font-size: 14px;
    text-decoration: none;

}
.logo1 .fotter_txt_wp a:hover {
     color: #FFA500;
    font-size: 16px;
    text-decoration: none;

}

.logo2{
display: block;
margin-left:20px;
float:left;
}
.logo2 .fotter_txt_w{
    float:left;
margin:10px;
}

.logo2 .fotter_txt_wp {
    color: #fff;
    font-size: 16px;
    font-weight:normal;
    text-align:left; 
    list-style-type:none;

}
.logo2 .fotter_txt_wp a {
     color: #fff;
    font-size: 14px;
    text-decoration: none;

}
.logo2 .fotter_txt_wp a:hover {
     color: #FFA500;
    font-size: 16px;
    text-decoration: none;

}

.logo3{
display: block;
float:left;
}
.logo3 .fotter_txt_w{
    margin:12px;
float:left;
}

.logo3 .fotter_txt_wp {
    color: #fff;
    font-weight:normal;
    text-align:left; 
    list-style-type:none;

}
.logo3 .fotter_txt_wp a {
     color: #fff;
    font-size: 14px;
    text-decoration: none;

}
.logo3 .fotter_txt_wp a:hover {
     color: #FFA500;
    font-size: 16px;
    text-decoration: none;

}

.row
{
margin-right:-15px;
margin-left:-15px
}
.footer_hide
{ 
display:block;
}
}


}