/* http://www.dwuser.com/education/content/creating-responsive-tiled-layout-with-pure-css/*/

 .redTop{
    position:absolute; left:0px; top:0px;
    background-image:  url(../images/bannertop_fill115.png);
    width:100%;
    height:115px;
  }
  #topWhite {
    float:left;
    height:115px;
    position:absolute; left:0px; top:0px;
  }
  #topImg {
    float:left;
    position:absolute; left:10px; top:6px;
   }
  .addTop {
    position:absolute; right:0px; top:0px; 
   /* width:728px;
    overflow-x:scroll;
    white-space: nowrap; */
  }
  .topWrapper{
   width:100%; 
   height:115px;
  }
  .fbLike{
    position:absolute; left:120px; top:80px; 
  }
  .imageFull{
    display: block;    
  }
  .imageMobile{   
    display: none;    
  }

  .logoNormal{
    width:176px;
    height:65px; 
  }
  .logoSmall{
   width:45px; 
   height:45px;
  }
  .topWImage{
   border:0px;
   width:214px; 
   height:115px;
  }


/*
.redTop{
background-image:  url(../images/redtop_fill.png);
height:90px;
}
 
#topWhite {
  float:left;   
  height:100px;
  position:absolute; left:0px; top:0px;
}

.boxHeader{
  position:absolute; left:0px; top:0px;
  width:100%;
  height: 90px;
  padding-left: 214px;

}


#topImg {
position:absolute; left:20px; top:10px;
z-index: 1000;
}

.searchWrapper{
width:100%;
background:url(../images/bannertop_fill90.png) ;
height:90px;

}
*/


#nav-home {   
  position:absolute; top:102px; right:10px;    
  background: transparent; 
}

#nav-home img{ 
width:30px;
height:30px;
}

.linksTop {
       position:absolute; left:200px; top:145px;

}

.searchTop {
position:absolute; top:103px; left:10px;     
width:450px; 
}

#cse-search-box-menu {
height:43px;
}
#cse-search-box-menu input[type="text"]{

height: 29px;
font-size: 14px;
   font-weight: bold;
vertical-align: middle;
}
#cse-search-box-menu .aligned { 
  vertical-align: middle; 
  height:34px;
  width:70px; 
  padding:4px;
}



#cse-search-box {
height:43px;
vertical-align: middle;
}
#cse-search-box input[type="text"]{

height: 29px;  /*22px*/
font-size: 14px;
   font-weight: bold;
vertical-align: middle;
}
#cse-search-box .aligned { vertical-align: middle;

height:34px;
width:70px; 
padding:4px;
}

 

.followUs{
/*position:relative; top:14px; left:30px;    */
  position:absolute; top:135px; right:0px;    
}
 

.iframeTopBanner {
  border: 0px;
  width: 0px;
  height: 0px; /*90px*/
  align: left;
 vertical-align: BOTTOM;
} 
.iframeTOP {
  border: 0px;
  width: 100%;
 height: 90px; /*81px*/
  align: left;
 vertical-align: BOTTOM;
}
 
.descSection{
  margin-left: 10px;
  margin-right: auto;
  margin-top: 10px;
  width:90%;
font: 15px/18px 'Lucida Sans',sans-serif;
}   

body {
   margin: 0;
   padding: 0;
   background: #FFFFFF; /*EEE*/
   font: 12px/15px 'Lucida Sans',sans-serif;
}
 

h1 {
//	FONT-SIZE: 8px; FONT-FAMILY: 'Arial', Verdana, Tahoma, Helvetica, sans-serif
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 16px;
        vertical-align: bottom;
 padding-top: 20px;
	color: #444444;   //#000000; //blue;   //
}


.wrap {
position:relative;
  margin-left: auto;
    margin-right: auto;
   overflow: hidden;
   width:98%;
/*  margin: 10px; */
background-color: 	#FAFCFF;

}

.descSection{
  margin-left: auto;
  margin-right: auto;
  width:100%;
  font-size: 12px;
}  

 

.topRight {
  position:absolute;   
  top: 15px;
  right: 12px;
  color: #585859;
  font-weight: bold;
  font-size: 23px;
  font-family: Verdana, Century Gothic, Times, Georgia,  Comic Sans MS, serif;
float: right;
//text-shadow: -1px 0 white, 0 1px white, 1px 0 white, 0 -1px white;

  text-shadow: -1px 0 2px #ffffff; /* horizontal-offset vertical-offset 'blur' colour */
  -moz-text-shadow: -1px 0 2px #ffffff;
  -webkit-text-shadow: -1px 0 2px #ffffff;
}
.topRight a{
text-decoration: none;
color: #585859;
float: right;
 
}

.topLeft {
  position:absolute;   
  bottom: 13%;
  left: 15px;
  color: #585859;
  font-weight: bold;
  font-size: 25px;
  font-family: "Verdana", Times, serif; 
  max-width:100px;
}

.posCenter{
  vertical-align: middle;
  align:center;
}
.posCenter img {
   width: 100%;
   height:100%;
}

.smallContent{
  display:none;
}
.smallContent a{
  text-decoration: none;
     position:absolute;   
     top: 60px;
     left: 5px;
     color: #1963AC;
     font-weight: bold;
     font-size: 12px;
     font-family: "Verdana", Times, serif;
     align:left;
  margin-right: 5px;
}

.boxContent{
  position:absolute;   
  top: 60px;
  left: 10px;
  color: #1963AC;
  font-weight: bold;
  font-size: 12px;
  font-family: "Verdana", Times, serif;
  align:left;
width:95%;
}
.boxContent span{
color: #cccccc;
font-size: 14px;
}
.boxContent a{
//text-decoration: none;
color: #1963AC;
}

.bcNohref a {
text-decoration: none;
color: #1963AC;
}

.boxWrapper{
background-color: #29A4AD;
 
}

.box {
   float: left;
   position: relative;
   width: 25%;
   padding-bottom: 25%;
   margin-top:  0px;
background-color: #29A4AD; 



}
.boxInner {

   position: absolute;
   left: 0px;
   right: 0px;
   top: 0px;
   bottom: 0px;
   overflow: hidden;
   position: absolute;
   bottom: 0px;
   left:0px;
   font-family: "Verdana", Times, serif;
   border-style: solid;
   border-color:  #29A4AD;  
   border-width: 3px;    
   background-color: #ffffff;  
 background-color: #29A4AD;
}

.boxCourse{
  color: #1963AC;
  font-weight: bold;
  font-size: 12px;
  font-family: "Verdana", Times, serif;
  align:left;
  width: 100%;
  height:80%;
}
.boxCourse img {
   width: 100%;
 height:100%;
}


.boxDesc{
  padding-top: 5px;
  padding-left: 5px;
  color: #1963AC;
  font-weight: bold;
  font-size: 12px;
  font-family: "Verdana", Times, serif;
  align:left;
} 
.boxDesc a{
text-decoration:none;
} 

.boxPrice{
  position:absolute;   
  bottom: 1px;
  left: 5px;
  font-weight: bold;
  font-size: 12px;
  font-family: "Verdana", Times, serif;
  color: #009933;
} 

.boxMore{
  position:absolute;   
  bottom: 1px;
  right: 5px;
  font-weight: bold;
  font-size: 12px;
  font-family: "Verdana", Times, serif;
  color: #009933;
} 

.boxMore a{
text-decoration:none;
}


.boxNext{
  position:absolute;   
  bottom:  0px;
  right: 5px;
  font-weight: bold;
  font-size: 22px;
  font-family: "Verdana", Times, serif;
  color: #009933;
  line-height: 30px;
} 
.boxPrev{
  position:absolute;   
  top:  0px;
  left: 5px;
  font-weight: bold;
  font-size: 22px;
  font-family: "Verdana", Times, serif;
  color: #009933;
  line-height: 30px;
} 

.bgColourBlue{
background-color: #1963AC;
}

.bgColourGreen{
background-color: #249445;
}

.bgColourDGreen{
background-color: #114F54;
}


.bgColourFGreen{
background-color: #18839A;
}

.bgColourWhite{
background-color: #ffffff;
}




.textColourWhite{
 color: #FFFFFF;
text-shadow: none;
}
.textColourWhite a{
 color: #FFFFFF;
text-shadow: none;
}

.boxInner img {
   width: 100%;
}

.boxInner .titleBox {
   position: absolute;
   top: 0;
   left: 0;
   right: 0;
   font-weight: bold;
   font-size: 15px;
   font-family:  Times, serif;
   margin-bottom:  0px;  /* -50 */
   background: #000;
   background: rgba(0, 0, 0, 0.7);
   color: #FFF;
   padding: 15px;  /*10px;*/
   text-align: center;
   -webkit-transition: all 0.3s ease-out;
   -moz-transition: all 0.3s ease-out;
   -o-transition: all 0.3s ease-out;
   transition: all 0.3s ease-out;
}



.tFooter {
  float:left; 
  width:100%;
}
.footerADD {
  border: 0px;
  width: 100%;
  height: 210px;
  vertical-align: TOP;
}
.searchFooter {
       float:left;
}
.addthisFooter {
       float:right;     
       margin-right :10px;
 display:inline-block;
}
.footerBG {background-image:  url(../images/footer_fill.png);}
.footerLinks {
       float:left; 
       width:100%;
   padding: 12px 0px 16px 20px;

   font-family: Verdana;
   font-size: 12px;
   font-weight: bold;
   color: #FFFFFF; 
}
.footerLinks a:link{
   color: #FFFFFF; 
   padding-right: 5px;
}
.footerLinks a:visited{
   color: #FFFFFF; 
}

.endLinks {
   text-align:center;
   font-family: Verdana;
   font-size: 14px;
   font-weight: bold;
   color: #000000; 
/*background:#cccccc;*/
height: 50px;
padding-top:10px;
}
.endLinks a{
padding-left:10px;
} 

.iframeBOTTOM {
  border: 0px;
  width: 100%;
 height: 450px;
  align: left;
 vertical-align: TOP;
}
 
 

@media only screen and (max-width : 480px) {
   /* Smartphone view: 2 tiles */
   .wrap {
     width:100%;
   }

   .box {
      width: 50%;
      padding-bottom: 50%;
   }
  /*
   .boxHeader{
    width: 100%;
    height: 280px;
    margin-left: 0px;
   }
*/
  #topImg {
    float:left;
    position:absolute; left:3px; top:5px;
  }
  .redTop{
    position:absolute; left:0px; top:0px;
    background-image:  url(../images/bannertop_fill115.png);
    width:100%;
    height:55px;
  }
  .topWrapper{
   width:100%; 
   height:55px;
  }
  .topWImage{
   border:0px;
   width:214px; 
   height:55px;
  }


  .imageFull{
    display: none;  
  }
  .imageMobile{   
    display: block;    
  }
 
   #nav-home {      
     position:absolute; top:102px; right:5px;    
   }

   .topRight {   
     font-size: 20px;
   }

   .topLeft {
     margin: auto;
     position:absolute;   
     top: 0; left: 0; bottom: 0; right: 0;
     width: 60%;
     padding-top: 30%;
   }


   .boxContent{
     display:none;
   }
   .smallContent{
     display:block; 
   }
   .boxPrice{
     display:none; 
   } 
   .boxMore{
     display:none; 
   } 
   .boxDesc{
    padding-top: 0px;
    padding-left: 5px;
   }
   .searchTop {
      position:absolute; top:103px; left:5px;     
      width:350px;
    }
   .searchBox{
     width:210px;
   }

   .followUs{
     position:absolute; top:102px; right:0px;    
     width:106px; 
     display: none;
   }
   .commentsHeader{
     display: none;
   }
   h1{
    padding-top:0px;    
   } 
}

@media only screen and (max-width : 667px) and (min-width : 481px) {
   /* Tablet view: 2 tiles */
   .wrap {
     width:100%;
   }
   .box {
      width: 50%;
      padding-bottom: 50%;
   }
  /*
   .boxHeader{
    width: 100%;
    height: 280px;
    margin-left: 0px;
   }
*/
 
   #nav-home {      
     position:absolute; top:102px; right:5px;    
   }

   .topRight {   
     font-size: 20px;
   }

   .topLeft {
     margin: auto;
     position:absolute;   
     top: 0; left: 0; bottom: 0; right: 0;
     width: 60%;
     padding-top: 30%;
   }


   .boxContent{
     display:none;
   }
   .smallContent{
     display:block; 
   }
   .boxPrice{
     display:none; 
   } 
   .boxMore{
     display:none; 
   } 
   .boxDesc{
    padding-top: 0px;
    padding-left: 5px;
   }
   .searchTop {
      position:absolute; top:103px; left:5px;     
      width:350px;
    }
   .searchBox{
     width:180px;
   }

   .followUs{
     position:absolute; top:102px; right:0px;    
     width:106px; 
     display: none;
   }
   .commentsHeader{
     display: none;
   }
   h1{
    padding-top:0px;    
   } 
}

@media only screen and (max-width : 750px) and (min-width : 668px) {
   /* Tablet view: 3 tiles */
   .wrap {
     width:100%;
   }
   .box {
      width: 33.3%;
      padding-bottom: 33.3%;
   }
 
   .descSection{
    margin-left: auto;
    margin-right: auto;
    width:100%;
    font-size: 11px;
   } 

   .topRight {   
     font-size: 20px;
   }

   .topLeft {
     margin: auto;
     position:absolute;   
     top: 0; left: 0; bottom: 0; right: 0;
     width: 60%;
     padding-top: 30%;
   }

   .boxContent{
     display:none;
   }
   .smallContent{
     display:block; 
   }
}


@media only screen and (max-width : 1050px) and (min-width : 751px) {
   /* Small desktop / ipad view: 3 tiles */
   .wrap {
     width:90%;
   }
   .box {
      width: 33.3%;
      padding-bottom: 33.3%;
   }
 
}

@media only screen and (max-width : 1290px) and (min-width : 1051px) {
   /* Medium desktop: 4 tiles */
   .wrap {
     width:90%;
   }
   .box {
      width: 33%;
      padding-bottom: 33%;
   }

}

@media only screen and  (min-width : 1390px) {
   /* Medium desktop: 4 tiles */
   .wrap {
     width:90%;
   }

}