/* http://www.menucool.com */


/*slider frame*/
#sliderFrame {
    width: 100%;
    /*You can also add: max-width:1200px; if you like*/
    font-size:0;
}

div#slider, #slider div.sliderInner {
    width:100%;
    height:500px;
}
#slider
{
    position:relative;
    margin:0 auto; /*center-aligned*/
    transform: translate3d(0,0,0);
}

#slider a:hover{
    color:white;
}

div#slider, #slider div.sliderInner div.mcSlc {
	background-size: cover !important;
	background-position: 100% center !important;
}

/* Caption styles */
/* Not set as each slide has no caption in this demo. */
#slider div.mc-caption-bg, #slider div.mc-caption-bg2 {
	position:absolute;
	width:70%;
	height:auto;
	padding:20px;
	left:20%; /* or left: ??px; */
	top:2%;/* or top: ??px; */
	z-index:3;
	overflow:hidden;
}
#slider div.mc-caption-bg {
    /* NOTE: Its opacity is to be set through the sliderOptions.captionOpacity setting in the js-image-slider.js file.*/
	background:none;
        
}
#slider div.mc-caption-bg2 {
    background:none;
}
#slider div.mc-caption {
	font-size:55px;
        font-family:Aller-Bold;
        color:white;
	z-index:4;
	padding:0px;
	text-align:left;
    background:none;
    text-shadow: 0px 0px 5px #858585;
}
p.back{
    font-size:25px;
        font-family:Aller;
        color:white;
	z-index:4;
	padding:0px;
	text-align:left;
    background:none;
}


.slider_li{
    list-style: disc;
    font-size:22px;
        font-family:Aller;
        color:white;
	z-index:4;
	padding:0px;
	text-align:left;
    background:none;
}


/* ------ built-in navigation bullets wrapper ------*/
#slider div.navBulletsWrapper  {
	top:450px;/* Its position is relative to the #slider */
	text-align:center;
	background:none;
	position:relative;
	z-index:5;
        width:100%;
}
/* each bullet */
#slider div.navBulletsWrapper div 
{
    width:15px; height:15px;
    font-size:0;
    background:transparent url("../images/bullet.png") no-repeat 0 0;
    display:inline-block; *display:inline; zoom:1;
    overflow:hidden;cursor:pointer;
    margin:0 4px;/* set distance between each bullet*/
}

#slider div.navBulletsWrapper div.active {background-position:0 -15px;}


/* --------- Others ------- */


/*----------- navigation buttons on both sides of the slider -----------*/
.group1-Wrapper 
{
    position:absolute;
    z-index:20;
    top:210px;
    margin-left:50%;/* position it in the middle of #sliderFrame */
    height:100px;
}
a.group1-Prev, a.group1-Next
{
    width:45px;height:45px;
    background:transparent url("../images/navbuttons2.png"); 
    display:block; 
    cursor:pointer;
    position:absolute;
    top:150px;
    user-select: none;
}
a.group1-Prev{background-position:55px -13px; left: -770px;}
a.group1-Next {background-position:55px 65px;left:720px;}

a.group1-Prev:hover{background-position:117px -13px;}
a.group1-Next:hover {background-position:-11px -88px;}



@media (min-width: 1400px) {
 
a.group1-Prev{background-position:55px -13px; left: -670px;}
a.group1-Next {background-position:55px 65px;left:610px;}
}

@media (max-width: 1400px) and (min-width:1366px) {
 
a.group1-Prev{background-position:55px -13px; left: -590px;}
a.group1-Next {background-position:55px 65px;left:540px;}
}

@media (max-width: 1366px) and (min-width:1024px) {

 a.group1-Prev{background-position:55px -13px; left: -600px;}
a.group1-Next {background-position:55px 65px;left:550px;}
}

@media (max-width: 1024px) and (min-width:768px) {

 a.group1-Prev{background-position:55px -13px; left: -440px;}
a.group1-Next {background-position:55px 65px;left:390px;}

a.group1-Prev, a.group1-Next
{
    top:90px;
}
}

@media (max-width: 768px) and (min-width:640px) {

 a.group1-Prev{background-position:55px -13px; left: -340px;}
a.group1-Next {background-position:55px 65px;left:300px;}

a.group1-Prev, a.group1-Next
{
    top:40px;
}
}

@media (max-width:640px) {

a.group1-Prev{background-position:55px -13px; left: -310px;}
a.group1-Next {background-position:55px 65px;left:265px;}

a.group1-Prev, a.group1-Next
{
    top:40px;
}
div#slider, #slider div.sliderInner div.mcSlc {
	background-size: cover !important;
	background-position: right center !important;
}
}

#home_right_1 img{
    width:400px;
}

@media (min-width: 1367px) {
#home_right_1{
    width:45%;
    height:100%;
    margin-right:10%;
    margin-top:-18px;
    float:right;
}
}

@media (max-width: 1366px) {
#home_right_1{
    width:45%;
    height:100%;
    margin-right:10%;
    margin-top:-28px;
    float:right;
}
 #slider div.mc-caption-bg, #slider div.mc-caption-bg2 {
	position:absolute;
	width:70%;
	height:auto;
	padding:20px;
	left:17%; /* or left: ??px; */
	top:22%;/* or top: ??px; */
	z-index:3;
	overflow:hidden;
}
    #slider div.mc-caption {
	font-size:50px;
        font-family:Aller-Bold;
        color:white;
	z-index:4;
	padding:0px;
	text-align:left;
    background:none;
    text-shadow: 0px 0px 5px #858585;
}

p.back{
    font-size:23px;
        font-family:Aller;
        color:white;
	z-index:4;
	padding:0px;
	text-align:left;
    background:none;
}

}
@media (max-width: 1280px) {
#home_right_1{
    width:45%;
    height:100%;
    margin-right:10%;
    margin-top:-33px;
    float:right;
}
 #slider div.mc-caption-bg, #slider div.mc-caption-bg2 {
	position:absolute;
	width:70%;
	height:auto;
	padding:20px;
	left:17%; /* or left: ??px; */
	top:23%;/* or top: ??px; */
	z-index:3;
	overflow:hidden;
}
}

@media (max-width: 1024px) {
    
#home_right_1{
    width:45%;
    height:100%;
    margin-right:10%;
    margin-top:-36px;
    float:right;
}
#home_right_1 img{
    width:300px;
}

 #slider div.mc-caption-bg, #slider div.mc-caption-bg2 {
	position:absolute;
	width:70%;
	height:auto;
	padding:20px;
	left:17%; /* or left: ??px; */
	top:19%;/* or top: ??px; */
	z-index:3;
	overflow:hidden;
}
#home_right img{
    height:170px;
}
#slider div.mc-caption {
	font-size:35px;
        font-family:Aller-Bold;
        color:white;
	z-index:4;
	padding:0px;
	text-align:left;
    background:none;
    text-shadow: 0px 0px 5px #858585;
}

div#slider, #slider div.sliderInner {
    width:100%;
    height:350px;
}

#slider div.navBulletsWrapper  {
	top:300px;/* Its position is relative to the #slider */
	text-align:center;
	background:none;
	position:relative;
	z-index:5;
        width:100%;
}

p.back{
    font-size:15px;
        font-family:Aller;
        color:white;
	z-index:4;
	padding:0px;
	text-align:left;
    background:none;
}

.slider_li{
    list-style: disc;
    font-size:15px;
        font-family:Aller;
        color:white;
	z-index:4;
	padding:0px;
	text-align:left;
    background:none;
}

}

@media (max-width: 768px) {
#home_right_1{
    width:45%;
    height:100%;
    margin-right:10%;
    margin-top:-17px;
    float:right;
}
#home_right_1 img{
    width:200px;
}
#slider div.mc-caption-bg, #slider div.mc-caption-bg2 {
	position:absolute;
	width:70%;
	height:auto;
	padding:20px;
	left:20%; /* or left: ??px; */
	top:19%;/* or top: ??px; */
	z-index:3;
	overflow:hidden;
}
#home_right img{
    height:120px;
}
#slider div.mc-caption {
	font-size:25px;
        font-family:Aller-Bold;
        color:white;
	z-index:4;
	padding:0px;
	text-align:left;
    background:none;
    text-shadow: 0px 0px 5px #858585;
}

div#slider, #slider div.sliderInner {
    width:100%;
    height:250px;
}

#slider div.navBulletsWrapper  {
	top:220px;/* Its position is relative to the #slider */
	text-align:center;
	background:none;
	position:relative;
	z-index:5;
        width:100%;
}

p.back{
    font-size:10.5px;
        font-family:Aller;
        color:white;
	z-index:4;
	padding:0px;
	text-align:left;
    background:none;
}

.slider_li{
    list-style: disc;
    font-size:10.5px;
        font-family:Aller;
        color:white;
	z-index:4;
	padding:0px;
	text-align:left;
    background:none;
}
}

@media (max-width: 640px) {
#home_right_1{
    width:45%;
    height:100%;
    margin-right:10%;
    margin-top:-17px;
    float:right;
}
#home_right_1 img{
    width:193px;
}
#slider div.mc-caption-bg, #slider div.mc-caption-bg2 {
	position:absolute;
	width:70%;
	height:auto;
	padding:20px;
	left:16%; /* or left: ??px; */
	top:22%;/* or top: ??px; */
	z-index:3;
	overflow:hidden;
}
#home_right img{
    height:100px;
}
#slider div.mc-caption {
	font-size:20px;
        font-family:Aller-Bold;
        color:white;
	z-index:4;
	padding:0px;
	text-align:left;
    background:none;
    text-shadow: 0px 0px 5px #858585;
}

div#slider, #slider div.sliderInner {
    width:100%;
    height:250px;
}

#slider div.navBulletsWrapper  {
	top:220px;/* Its position is relative to the #slider */
	text-align:center;
	background:none;
	position:relative;
	z-index:5;
        width:100%;
}

p.back{
    font-size:9.5px;
        font-family:Aller;
        color:white;
	z-index:4;
	padding:0px;
	text-align:left;
    background:none;
}

.slider_li{
    list-style: disc;
    font-size:9.5px;
        font-family:Aller;
        color:white;
	z-index:4;
	padding:0px;
	text-align:left;
    background:none;
}
}