/* CSS Document */
@font-face {
    font-family: 'OpenSansRegular';
    src: url('fonts/OpenSans-Regular-webfont.eot');
    src: url('OpenSans-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/OpenSans-Regular-webfont.woff') format('woff'),
         url('fonts/OpenSans-Regular-webfont.ttf') format('truetype'),
         url('fonts/OpenSans-Regular-webfont.svg#OpenSansRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'OpenSansItalic';
    src: url('fonts/OpenSans-Italic-webfont.eot');
    src: url('fonts/OpenSans-Italic-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/OpenSans-Italic-webfont.woff') format('woff'),
         url('fonts/OpenSans-Italic-webfont.ttf') format('truetype'),
         url('fonts/OpenSans-Italic-webfont.svg#OpenSansItalic') format('svg');
    font-weight: normal;
    font-style: normal;

}

.view {width: 225px; height: 150px; margin: 10px; float: left;border: 1px solid #fff;overflow: hidden;
position: relative; text-align: center;-webkit-box-shadow: 0px 1px 4px #e6e6e6;-moz-box-shadow: 0px 1px 4px #e6e6e6;box-shadow: 0px 1px 4px #e6e6e6;cursor: default;background:#0168B5 url(../images/bgimg.png) no-repeat center center;}
.view .mask,.view .content {width: 225px;height: 150px;position: absolute;overflow: hidden;top: 0;left: 0;}
.view img {display: block;position: relative;}
.view h2 {font-family:"Open Sans", Arial, Helvetica, sans-serif;text-transform: capitalize;color: #fff;text-align: center;position: relative;font-size: 16px;padding: 10px;background: rgba(0, 0, 0, 0.8);margin: 10px 0 0 0;}
.view p {font-family:"Open Sans", Arial, Helvetica, sans-serif;font-size: 14px;position: relative;color: #fff;
   padding: 10px 20px 12px;text-align: center;}
.view a.info {display: inline-block;text-decoration: none;padding: 7px 14px;background: #000;
color: #fff;text-transform: capitalize;-webkit-box-shadow: 0 0 1px #000;-moz-box-shadow: 0 0 1px #000;box-shadow: 0 0 1px #000;font-family:"Open Sans", Arial, Helvetica, sans-serif;}
.view a.info: hover {-webkit-box-shadow: 0 0 5px #000;-moz-box-shadow: 0 0 5px #000; box-shadow: 0 0 5px #000;
}
.marg-right{ margin-right:0px;}

@media only screen and ( min-width: 768px) and ( max-width: 980px ) {
	
.view {width: 235px; height: 155px; margin: 5px; float: left;border: 1px solid #fff;overflow: hidden;
position: relative; text-align: center;-webkit-box-shadow: 0px 1px 4px #e6e6e6;-moz-box-shadow: 0px 1px 4px #e6e6e6;box-shadow: 0px 1px 4px #e6e6e6;cursor: default;background:#0168B5 url(../images/bgimg.png) no-repeat center center;}
.view .mask,.view .content {width: 235px;height: 155px;position: absolute;overflow: hidden;top: 0;left: 0;}
.view img {display: block;position: relative; width:235px; height:155px;}
.view h2 {font-family:"Open Sans", Arial, Helvetica, sans-serif;text-transform: capitalize;color: #fff;text-align: center;position: relative;font-size: 16px;padding: 10px;background: rgba(0, 0, 0, 0.8);margin: 10px 0 0 0;}
.view p {font-family:"Open Sans", Arial, Helvetica, sans-serif;font-size: 14px;position: relative;color: #fff;
   padding: 10px 20px 12px;text-align: center;}
.view a.info {display: inline-block;text-decoration: none;padding: 7px 14px;background: #000;
color: #fff;text-transform: capitalize;-webkit-box-shadow: 0 0 1px #000;-moz-box-shadow: 0 0 1px #000;box-shadow: 0 0 1px #000;font-family:"Open Sans", Arial, Helvetica, sans-serif;}
.view a.info: hover {-webkit-box-shadow: 0 0 5px #000;-moz-box-shadow: 0 0 5px #000; box-shadow: 0 0 5px #000;
}
.marg-right{ margin-right:0px;}	
}

@media only screen and ( min-width: 600px) and ( max-width: 767px ) {

.view {width: 260px; height: 175px; margin: 10px; float: left;border: 1px solid #fff;overflow: hidden;
position: relative; text-align: center;-webkit-box-shadow: 0px 1px 4px #e6e6e6;-moz-box-shadow: 0px 1px 4px #e6e6e6;box-shadow: 0px 1px 4px #e6e6e6;cursor: default;background:#0168B5 url(../images/bgimg.png) no-repeat center center;}
.view .mask,.view .content {width: 260px;height: 175px;position: absolute;overflow: hidden;top: 0;left: 0;}
.view img {display: block;position: relative; width:260px; height:175px;}
.view h2 {font-family:"Open Sans", Arial, Helvetica, sans-serif;text-transform: capitalize;color: #fff;text-align: center;position: relative;font-size: 16px;padding: 10px;background: rgba(0, 0, 0, 0.8);margin: 20px 0 0 0;}
.view p {font-family:"Open Sans", Arial, Helvetica, sans-serif;font-size: 14px;position: relative;color: #fff;
   padding: 10px 20px 12px;text-align: center;}
.view a.info {display: inline-block;text-decoration: none;padding: 7px 14px;background: #000;
color: #fff;text-transform: capitalize;-webkit-box-shadow: 0 0 1px #000;-moz-box-shadow: 0 0 1px #000;box-shadow: 0 0 1px #000;font-family:"Open Sans", Arial, Helvetica, sans-serif;}
.view a.info: hover {-webkit-box-shadow: 0 0 5px #000;-moz-box-shadow: 0 0 5px #000; box-shadow: 0 0 5px #000;
}
.marg-right{ margin-right:0px;}
	
}

@media only screen and ( min-width: 481px) and ( max-width: 599px ) {

.view {width: 207px; height: 140px; margin: 10px; float: left;border: 1px solid #fff;overflow: hidden;
position: relative; text-align: center;-webkit-box-shadow: 0px 1px 4px #e6e6e6;-moz-box-shadow: 0px 1px 4px #e6e6e6;box-shadow: 0px 1px 4px #e6e6e6;cursor: default;background:#0168B5 url(../images/bgimg.png) no-repeat center center;}
.view .mask,.view .content {width: 207px;height: 140px;position: absolute;overflow: hidden;top: 0;left: 0;}
.view img {display: block;position: relative; width:207px; height:140px;}
.view h2 {font-family:"Open Sans", Arial, Helvetica, sans-serif;text-transform: capitalize;color: #fff;text-align: center;position: relative;font-size: 16px;padding: 10px;background: rgba(0, 0, 0, 0.8);margin: 5px 0 0 0;}
.view p {font-family:"Open Sans", Arial, Helvetica, sans-serif;font-size: 14px;position: relative;color: #fff;
   padding: 10px 20px 12px;text-align: center;}
.view a.info {display: inline-block;text-decoration: none;padding: 7px 14px;background: #000;
color: #fff;text-transform: capitalize;-webkit-box-shadow: 0 0 1px #000;-moz-box-shadow: 0 0 1px #000;box-shadow: 0 0 1px #000;font-family:"Open Sans", Arial, Helvetica, sans-serif;}
.view a.info: hover {-webkit-box-shadow: 0 0 5px #000;-moz-box-shadow: 0 0 5px #000; box-shadow: 0 0 5px #000;
}
.marg-right{ margin-right:0px;}	
}

@media only screen and ( min-width: 320px) and ( max-width: 480px ) {
.view {width: 240px; height: 160px; margin: 10px 0 10px 30px; float: left;border: 1px solid #fff;overflow: hidden;
position: relative; text-align: center;-webkit-box-shadow: 0px 1px 4px #e6e6e6;-moz-box-shadow: 0px 1px 4px #e6e6e6;box-shadow: 0px 1px 4px #e6e6e6;cursor: default;background:#0168B5 url(../images/bgimg.png) no-repeat center center;}
.view .mask,.view .content {width: 240px;height: 160px;position: absolute;overflow: hidden;top: 0;left: 0;}
.view img {display: block;position: relative; width:240px; height:160px;}
.view h2 {font-family:"Open Sans", Arial, Helvetica, sans-serif;text-transform: capitalize;color: #fff;text-align: center;position: relative;font-size: 16px;padding: 10px;background: rgba(0, 0, 0, 0.8);margin: 15px 0 0 0;}
.view p {font-family:"Open Sans", Arial, Helvetica, sans-serif;font-size: 14px;position: relative;color: #fff;
   padding: 10px 20px 12px;text-align: center;}
.view a.info {display: inline-block;text-decoration: none;padding: 7px 14px;background: #000;
color: #fff;text-transform: capitalize;-webkit-box-shadow: 0 0 1px #000;-moz-box-shadow: 0 0 1px #000;box-shadow: 0 0 1px #000;font-family:"Open Sans", Arial, Helvetica, sans-serif;}
.view a.info: hover {-webkit-box-shadow: 0 0 5px #000;-moz-box-shadow: 0 0 5px #000; box-shadow: 0 0 5px #000;
}
.marg-right{ margin-right:0px;}		
}