@charset "utf-8";
/* CSS Document */

@media all and (max-width: 1200px) {
	.acc {
    left: 60px;}
}

@media all and (max-width: 1040px) {
	
.grandma {
    margin-right: -110px;
	    width: 80%;}
	
.logo {
    margin-top: 40px;}
}

@media all and (max-width: 980px) {
	.acc {
    left: -60px;}
	
	.grandma {
    width: 90%;
}

.kharofa {
    width: 42%;
    max-width: 330px;
}
}

@media all and (max-width: 780px) {
	.acc { display:none;}
	
	.grandma {
    margin-top: -20px;
    float: left;}
	
	#header {
    padding-bottom:0;
}

.listen-container {
    width: 100%;
    margin: 0 0 70px 0;
	max-width:none;
}

.read-container {
    margin: 80px auto 0 auto;
    display: block;
    max-width: none;
    width: 88%;
}

#amazingaudioplayer-1 {
    width: 88% !important;
    max-width: 760px;
}

.play {
    display: block;
    margin: 100px auto 0;
    width: 88%;
}

.text {
    display: block;
    margin: 100px auto 0;
    width: 82%;
    max-width: none;
}

/*.text p {
    margin: -20px 0 0 0px;
    padding-left: 0px;
}*/

}

@media all and (max-width: 600px) {
		.logo {
    float: none;
    margin: 0px auto 0;
    padding: 22px;
    width: 100%;
    max-width: 222px;
}

.grandma {
    margin-right: -110px;
    margin: -50px auto 0 auto;
    background-position-y: -60px;
    float: none;
}

#header {
    padding-bottom:50px;
}

.kharofa {
    width: 96%;
    max-width: 300px;
	}

}


@media all and (max-width : 820px) {

nav { margin: 0; 
    width: 100%;}

.toggle + a,
 .menu { display: none; }

.toggle {
    display: block;
    background: #006c80 url(../images/about.png) no-repeat right 15px center;
    padding: 0px 50px 0 10px;
    color: #f6a76e;
    font-size: 18px;
    line-height: 3;
    text-decoration: none;
    border-bottom: 1px solid #006c80 !important;
    text-align: right;
}

.toggle:hover {
    background-color: #158f96;
    color: #ffffff;
}
[id^=drop]:checked + ul { display: block;
float:none; }

nav ul li {
    display: block;
    width: 100%;
    background-color: #005263;
}

nav ul ul .toggle,
 nav ul ul a { padding: 0 40px; }

nav ul ul ul a { padding: 0 80px; }

nav a {
    display: block;
    margin: 0 15px 0;
    padding: 0 50px 0 10px;
    border-bottom: 1px solid #006174 !important;
    color: #ffffff;
    text-align: right;
    background-position-x: right !important;
    background-position-y: center !important;
}
.first {
    font-weight: lighter;
    cursor: pointer;
    color: transparent !important;
    padding: 0 !important;
    background: #006c80 url(../images/menu.png) no-repeat right 40% center;
    border-radius: 14px;
    box-shadow: inset #003443 0px 0px 24px;
}

.first:hover {background-color: #0f7d84 !important;
        color: transparent !important;
}

.first span {
    font-size: 18px;
    line-height: 44px;
    display: block;
    color: #fff;
    text-align: center !important;
}

nav a:hover, nav ul ul ul a {
    background-color: #158f96;
}

nav ul li ul li .toggle, nav ul ul a {
    background: #006c80;
    color: #ffffff;
    padding: 0 30px 0 0 !important;
}

nav ul ul {
  float: none;
  position: static;
  color: #ffffff;
}

nav ul ul li:hover > ul,
nav ul li:hover > ul { display: none; }

nav ul ul li {
  display: block;
  width: 100%;
}

nav ul ul ul li { position: static;

}

}

@media all and (max-width : 480px) {
.grandma {
    margin: -10px auto 0 auto;}
	
		#header {
    padding-bottom:0;
}
	
}


@media all and (max-width : 700px) {
/************/

div#amazingslider-wrapper-3 {
    padding-right: 0px !important;
}

.amazingslider-nav-3 {
    left: 0 !important;
    width: 100% !important;
    top: 100% !important;
    max-height: 164px;
    margin-left: 0 !important;
    border-top: 10px solid #158f96;
    /* border-bottom: 3px solid #158f96; */
}
.amazingslider-bullet-wrapper-3 {margin-left:0 !important;}

div.amazingslider-bullet-3 {
    width: 100% !important;
    padding: 1px 0 1px 0 !important;
	height: 80px !important;
}

.amazingslider-bullet-text-3 {
    width: 70% !important;
    margin-left: 0 !important;
	max-width: none !important;
	height: 80px !important;
}

.amazingslider-bullet-image-3 {
    width: 30% !important;
    text-align: center;
	height: auto !important;
	    max-height: 80px;
}

.amazingslider-car-right-arrow-3, .amazingslider-car-left-arrow-3 {
    left: 48% !important;
    margin-left: 0 !important;
}

div.amazingslider-bullet-3 {
    margin-left: 0 !important;
}

#vid-slider {
    padding: 9px 10px 10px 10px;}
	
	.btns {
    margin: 210px auto 50px auto;}
}


@media screen and (max-width: 320px) {
	div#amazingcarousel-2 {
    border-left: 1px solid #024654;}
}

@media screen and (max-width: 240px) {
.wh-title {
    margin-right: -18px;
}
}
/*****************
TABS
***************/
@media screen and (max-width: 655px) {
	.tabs {
		display: none;
	}
	.tab_drawer_heading {
    background-color: #005263;
    color: #ffffff;
    border-bottom: 2px solid #0041506b;
    font-size: 16px;
    margin: 0;
    padding: 11px 20px;
    display: block;
    cursor: pointer;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
	.d_active {
    background-color: #158f96;
    color: #ffffff;
}
}