h1, h2, h3, h4, h5, h6, p, blockquote, form, label, ul, ol, dl, fieldset, address {


	margin:0.5em 0;


}


h1 {


	font-size:2em;


}


h2 {


	font-size:1.7em;


}


h3 {


	font-size:1.3em;


}


h4 {


	font-size:1.2em;


}


h5 {


	font-size:1.1em;


}


h6 {


	font-size:1em;


	font-weight:bold;


}








a {


	text-decoration:none;


	-webkit-transition:color 0.25s ease-in; 


	-moz-transition:color 0.25s ease-in; 


	-o-transition:color 0.25s ease-in; 


	transition:color 0.25s ease-in;


	outline:0;


}





blockquote {


    font-style: italic;


    font-weight: 100;


	font-size:35px;


    line-height: 150%;


    margin: 15px 0;


    padding: 0 0 5px 65px;


    width: auto;


}


blockquote p {


    margin-top: 0;


    padding: 0 65px 10px 0;


}





p.note, p.pin, p.clip, p.down, pre, .code {


    border-color: #E7E7E7;


    border-right: 1px solid #E7E7E7;


    border-style: solid;


    border-width: 1px 1px 1px 5px;


}


pre, .code {


    margin: 10px 0;


    clear:both;


}


pre, code {


    font: italic 100% monospace;


    padding: 10px;


    white-space: normal !important;


}





p.down, p.clip, p.pin, p.note {


    margin: 10px 0;


    padding: 15px 20px 15px 50px;


}





p.note {


}





p.pin {


}





p.clip {


}


p.down {


}





body ol {


    list-style: decimal inside none;


}


.maincontent ul,
#container_maincontent_bg ul
{


    list-style: disc outside none;


   	margin:5px;

}





ul.tick, 
ul.plus, 
ul.star,
.maincontent ul,
#container_maincontent_bg ul
{


	margin:5px;


}


ul.tick li, 
ul.plus li, 
ul.star li,
.maincontent ul li,
#container_maincontent_bg ul li
{


	list-style: none outside none;


    padding: 3px 30px;


}


ul.tick li,
.maincontent ul li,
#container_maincontent_bg ul li
{


background: url("../images/typo/tick.png") no-repeat scroll 5px 14px rgba(0, 0, 0, 0);


}


ul.plus li {


    background: url("../images/typo/plus.png") no-repeat scroll left center transparent;


}


ul.star li {


    background: url("../images/typo/star.png") no-repeat scroll left center transparent;


}








em.highlight {


    border-radius: 4px 4px 4px 4px;


    font-style: normal;


    padding: 2px 5px;


    text-shadow: none;


}


em.highlight.black {


    background: none repeat scroll 0 0 #000000;


    color: #FFFFFF;


}


em.highlight.green {


    background: none repeat scroll 0 0 #89B223;


    color: #FFFFFF;


}


em.highlight.yellow {


    background: none repeat scroll 0 0 #B29E23;


    color: #FFFFFF;


}


em.highlight.blue {


    background: none repeat scroll 0 0 #4B90B5;


    color: #FFFFFF;


}


em.highlight.red {


    background: none repeat scroll 0 0 #A62929;


    color: #FFFFFF;


}








/* Horizontal rule */


hr{


  border-bottom:1px solid;


  margin-top: 15px;


  margin-bottom: 15px;


}





/* Tables */


tr, td{


  border:1px solid;


  padding:20px;


}











/* Content Column Layout */


.col-2, .col-3, .col-4, .col-5 {


	float:left;


}


.col-2 div, .col-3 div, .col-4 div, .col-5 div {


	margin:5px 10px;


}


.col-2 {


	width:50%;


}


.col-3 {


	width:33%;


}


.col-4 {


	width:25%;


}


.col-5 {


	width:20%;


}





/* Image Frames */


img.frame-1 {


    border: 1px solid #FFFFFF;


    box-shadow: 0 0 6px -4px #000000;


    display: inline-block;


    outline: medium none;


    padding: 2px;


	margin:0 !important;


}








/***************************************************************************/


/* Image Hover Effects Styling */


/***************************************************************************/





.clearfix:after {


  visibility: hidden;


  display: block;


  content: "";


  clear: both;


  height: 0;


}





.effects {


}





.effects .img {


    float: left;


    margin-bottom: 5px;


    overflow: hidden;


    position: relative;


    width: 100%;


}





.effects .img:nth-child(n) {


  margin-right: 5px;


}





.effects .img:first-child {


}





.effects .img:last-child {


  margin-right: 0;


}


.effects .img img {


  display: block;


  margin: 0;


  padding: 0;


  max-width: 100%;


  height: auto;


}





.overlay {


  display: block;


  position: absolute;


  z-index: 20;


  background: rgba(0, 0, 0, 0.8);


  overflow: hidden;


  -webkit-transition: all 0.5s;


  -moz-transition: all 0.5s;


  -o-transition: all 0.5s;


  transition: all 0.5s;


}





a.close-overlay {


  display: block;


  position: absolute;


  top: 0;


  right: 0;


  z-index: 100;


  width: 45px;


  height: 45px;


  font-size: 20px;


  font-weight: 700;


  color: #fff;


  line-height: 45px;


  text-align: center;


  background-color: #000;


  cursor: pointer;


}


a.close-overlay.hidden {


  display: none;


}





a.expand {


  display: block;


  position: absolute;


  z-index: 100;


  width: 40px;


  height: 40px;


  border: solid 1px #fff;


  text-align: center;


  color: #fff;


  line-height: 40px;


  font-weight: 700;


  font-size: 30px;


  -webkit-border-radius: 30px;


  -moz-border-radius: 30px;


  -ms-border-radius: 30px;


  -o-border-radius: 30px;


}





/* ============================================================


  EFFECT 1 - SLIDE IN BOTTOM


============================================================ */


#effect-1 .overlay {


  bottom: 0;


  left: 0;


  right: 0;


  width: 100%;


  height: 0;


}


#effect-1 .overlay a.expand {


  left: 0;


  right: 0;


  bottom: 50%;


  margin: 0 auto -30px auto;


}


#effect-1 .img.hover .overlay {


  height: 100%;


}





/* ============================================================


  EFFECT 2 - SLIDE IN TOP


============================================================ */


#effect-2 .overlay {


  top: 0;


  left: 0;


  right: 0;


  width: 100%;


  height: 0;


}


#effect-2 .overlay a.expand {


  left: 0;


  right: 0;


  top: 50%;


  margin: -30px auto 0 auto;


}


#effect-2 .img.hover .overlay {


  height: 100%;


}





/* ============================================================


  EFFECT 3 - SLIDE IN LEFT


============================================================ */


#effect-3 .overlay {


  top: 0;


  bottom: 0;


  left: 0;


  width: 0;


  height: 100%;


}


#effect-3 .overlay a.expand {


  top: 0;


  bottom: 0;


  left: 50%;


  margin: auto 0 auto -30px;


}


#effect-3 .img.hover .overlay {


  width: 100%;


}





/* ============================================================


  EFFECT 4 - SLIDE IN RIGHT


============================================================ */


#effect-4 .overlay {


  top: 0;


  bottom: 0;


  right: 0;


  width: 0;


  height: 100%;


}


#effect-4 .overlay a.expand {


  top: 0;


  bottom: 0;


  right: 50%;


  margin: auto -30px auto 0;


}


#effect-4 .img {


  overflow: hidden;


}


#effect-4 .img.hover .overlay {


  width: 100%;


}





/* ============================================================


  EFFECT 5 - ICON BORDER ANIMATE


============================================================ */


#effect-5 .overlay {


  top: 0;


  bottom: 0;


  left: 0;


  right: 0;


  opacity: 0;


}


#effect-5 .overlay a.expand {


  top: 0;


  bottom: 0;


  left: 0;


  right: 0;


  margin: auto;


  width: 100%;


  height: 100%;


  -webkit-border-radius: 0;


  -moz-border-radius: 0;


  -ms-border-radius: 0;


  -o-border-radius: 0;


  border-radius: 0;


  -webkit-transition: all 0.5s;


  -moz-transition: all 0.5s;


  -o-transition: all 0.5s;


  transition: all 0.5s;


}


#effect-5 .img.hover .overlay {


  opacity: 1;


}


#effect-5 .img.hover .overlay a.expand {


  width: 40px;


  height: 40px;


  -webkit-border-radius: 30px;


  -moz-border-radius: 30px;


  -ms-border-radius: 30px;


  -o-border-radius: 30px;


  border-radius: 30px;


}





/* ============================================================


  EFFECT 6 - ICON BOUNCE IN


============================================================ */


#effect-6 .overlay {


  top: 0;


  bottom: 0;


  left: 0;


  right: 0;


  opacity: 0;


}


#effect-6 .overlay a.expand {


  left: 0;


  right: 0;


  top: 0;


  margin: 0 auto;


  opacity: 0;


  -webkit-transition: all 0.5s;


  -moz-transition: all 0.5s;


  -o-transition: all 0.5s;


  transition: all 0.5s;


}


#effect-6 .img.hover .overlay {


  opacity: 1;


}


#effect-6 .img.hover .overlay a.expand {


  top: 50%;


  margin-top: -30px;


  opacity: 1;


}


.maincontent img {
    border: 1px solid #ffffff;
    box-shadow: 0 0 6px -4px #000000;
    padding: 2px;
}





/***************************************************************************/


/* End Image Hover Effects Styling */


/***************************************************************************/