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

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

body
{
	margin:0px 0px;
	padding:0;
	background:#fff;
}
h1
{
	font:20px 'Libre Baskerville', serif;
	text-align:left;
	color:#5584ff;
}
h2
{
	font:16px 'Libre Baskerville', serif;
	text-align:left;
	color:#5584ff;
}
h3,h4,h5,h6
{
	font:14px 'Libre Baskerville', serif;
	text-align:left;
	color:#5584ff;
	font-weight:bold;
}
p
{
	/*font:16px "Palatino Linotype", "Book Antiqua", Palatino, serif;*/
	font:22px 'Libre Baskerville', serif;
	color:#000;
	text-align:left;
	text-align:justify;
	text-shadow: 0.3px 0.3px #ccc
}
#container-body
{
	width:100%;
	overflow:hidden;
	margin: 2px auto;
}
.top
{
	width:100%;
	height:30px;
	margin:auto;
	background:#0f1a36;
	
}
.top-call
{
	float:right;
	width:100%;
	height:30px;
	position: fixed;
    background: #0f1a36;
    z-index: 1;
    top: 0;
}
.top-call p
{
	font:16px "Arial Black", Gadget, sans-serif;
	margin:auto;
	margin-top:4px;
	color:#fff;
}
.top-social
{
	float:right;
	width:33%;
	height:30px;
	border:1px solid #000;
}
.head
{
	width:85%;
	background:#fff;
	height:90px;
	margin:auto;
	/*border-bottom:2px solid #fff;
	-webkit-box-shadow: inset -2px -1px 36px -5px rgba(0,0,0,0.69);
	-moz-box-shadow: inset -2px -1px 36px -5px rgba(0,0,0,0.69);
	box-shadow: inset -2px -1px 36px -5px rgba(0,0,0,0.69);*/

}
.header-logo
{
	width:35%;
	height:90px;
	margin:auto;
	float:left;
}
.header-logo img
{
	width:100%;
	
}
.logo
{
	width:30%;
	float:left;
	height:90px;
}
.nav
{
	height:90px;
	width:64%;
	margin:auto;
	float:Right;
	background:#fff;
	/*
	border-bottom:2px solid #d72d00;
	box-shadow:0 6px 12px 5px #000000;
	-webkit-box-shadow:0 6px 12px 5px #000000;
	-moz-box-shadow:0 6px 12px 5px #000000;*/
}
.nav ul
{
	margin:0;
	padding:0;
	list-style:none;
	text-align:right;
	position:relative;
}
.nav ul li
{
	text-decoration:none;
	display:inline-block;
	-webkit-transition: all .25s ease;
  -moz-transition: all .25s ease;
  -ms-transition: all .25s ease;
  -o-transition: all .25s ease;
  transition: all .25s ease;
}
.nav ul li a,visited
{
	color:#000;
	font:15px 'Libre Baskerville', serif;
	text-decoration:none;
	display:block;
	padding:6px;
	font-weight:bold;
	margin-top:50px;
	border-bottom:2px solid #5584ff;
	transition: all 1.2s ease;
}
.nav ul li a:hover
{
	color:#5584ff;
	border-bottom:2px solid #000;
	transition: all 1.2s ease;
}
.nav ul li:hover ul
{
	display:block;
}

.nav ul ul
{
	display:none;
	position:absolute;
	z-index:2;
	
}
.nav ul ul li
{
	display:block;
	border-bottom:1px solid #fff;
	border-top:1px solid #fff;
	transition: all 1.2s ease;
	
}
.nav ul ul li a,visited
{
	font:12px 'Libre Baskerville', serif;
	padding:5px;
	background:#fff;
	width:150px;
	height:20px;
	text-align:center;
	margin:0px;
	transition: all 1.2s ease;
}
.nav ul ul li a:hover
{
	color:#5584ff;
	transition: all 1.2s ease;
}







.flash
{
	width:99.7%;
	height:450px;
	margin:auto;
	margin-bottom:30px;
	/*box-shadow: 0 10px 5px #777;*/
	background-image:url(../img/flashh.jpg);
	

}
.flash_Left
{
	width:65%;
	height:450px;
	float:left;
}
.flash_right
{
	width:34.5%;
	height:450px;
	float:left;

}

.signup_form
{
	width:80%;
	height:430px;
	background-image:url(../img/fl-rgt.png);
	opacity:0.8;

	
	margin-left:5px;
	margin-top:10px;
}
.signup_form h2
{
	font:18px 'Libre Baskerville', serif;
	color:#fff;
	margin-left:95px;

}
.content-B
{
	width:85%;
	height:410px;
	margin:auto;
	margin-bottom:20px;
}
.content-box
{
	width:30%;
	height:360px;
	float:left;
	margin-right:3%;
	
}
.content-boxp1
{
	width:100%;
	height:32%;
	float:left;
	transition: all 5s ease;
}
.content-boxp1 img
{
	margin-left:32%;
	
}
.content-boxp1:hover
{
	
	transition: all 0.5s ease;
	transform: scale(0.5);
}

.content-boxp2
{
	width:100%;
	height:68%;
	float:left;
	
}
.content-boxp2 h2
{
	font:18px 'Libre Baskerville', serif;
	font-weight:bold;
	text-align:center;
}
.content-boxp2 p
{
	width:70%;
	margin:auto;
	font-weight:bold;
	font:13px 'Libre Baskerville', serif;
	color:#000;
}

.content-page
{
	width:100%;
	height:auto;
	background:#f7f8fb;
	margin:auto;
	float:left;
}
.content-page li
{
	Font:18px 'Libre Baskerville', serif;
	color:#000;
	font-weight:bold;
	margin-bottom:8px;
	text-decoration:none;
}
.content-page h1 a
{
	color:#5584ff;
}
.content-p
{
	width:85%;
	height:auto;
	margin:auto;

}
.content-p a
{
	color:#000;
	text-decoration:none;

}
.product
{
	width:30%;
	height:310px;
	float:left;
	margin:0 1.5% 1.5% 1.5%;
	background:#fff;
	box-shadow:0 4px 10px 0 #888888;
	-webkit-box-shadow:0 4px 10px 0 #888888;
	-moz-box-shadow:0 4px 10px 0 #888888;
}
.product-L
{
	width:100%;
	height:200px;
	float:left;
}
.product-R
{
	text-align:left;
	margin:auto;
	height:110px;
	width:80%;
	
}
.product-R h1
{
	text-align:center;
	margin-top:5px;
}
.product-R
{
	text-decoration:none;
}
.content-pp
{
	width:85%;
	height:auto;
	margin:auto;

}
.content-p-box p
{
	width:90%;
	margin:auto;
	margin-bottom:20px;
	
}
.content-p-box
{
	width:100%;
	height:auto;
	margin:auto;
	float:left;
	box-shadow:0 4px 10px 0 #888888;
	-webkit-box-shadow:0 4px 10px 0 #888888;
	-moz-box-shadow:0 4px 10px 0 #888888;
	margin-bottom:20px;
}
.content-p-box-L
{
	width:29%;
	height:320px;
	float:left;
	
}

.content-p-box-R
{
	width:70%;
	height:320px;
	float:left;
	
	
}
.content-p-box h1
{
	margin-left:20px;
	border-bottom:2px solid #5584ff;
}
.content-p-box-R li
{
	text-align:left;
	font:18px 'Libre Baskerville', serif;
	list-style:none;
	margin-left:10%;
	margin-top:1.5%;
}

.cont_Box
{
	width:85%;
	height:420px;
	margin:auto;
	margin-bottom:20px;
}

.cont_Box_L
{
	width:29%;
	height:350px;
	float:left;
}
.cont_Box_L h1
{
	font:26px 'Libre Baskerville', serif;
}
.cont_Box_L h1 a
{
	color:#000;
}
.cont_Box_L li
{
	Font:18px 'Libre Baskerville', serif;
	color:#000;
	font-weight:bold;
	margin-bottom:8px;
	text-decoration:none;
}

.cont_Box_L p
{
	font:14px 'Libre Baskerville', serif;
	color:#555;
	width:90%;
	text-align:justify;
}
.cont_Box_R
{
	width:69%;
	height:350px;
	float:left;

}
.oplogo
{
	width:85%;
	height:100px;
	margin:auto;
}
.box-x
{
	color:#fff;
	width:30%;
	border-radius:2px;
	height:350px;
	float:left;
	margin:10px 0 8px 2.7%;
	box-shadow:0 4px 10px 0 #888888;
	-webkit-box-shadow:0 4px 10px 0 #888888;
	-moz-box-shadow:0 4px 10px 0 #888888;
}
box h3{
	text-align:center;
	position:relative;
	top:80px;
}
.box {
	width:95%;
	height:350px;
	background:#f1f1f1;
	margin:auto;
	margin-top:15px;
	margin-bottom:15px;
	
}
.box:hover .front
{
	-webkit-transform:perspective( 1200px ) rotateY( -180deg );
		transform:perspective( 1200px ) rotateY( -180deg );
}
.box:hover .back
{
	-webkit-transform:perspective( 1200px ) rotateY( 0deg );
		transform:perspective( 1200px ) rotateY( 0deg );
}
.front
{
	position:absolute;
	-webkit-transform:perspective( 1000px ) rotateY( 0deg );
	transform:perspective( 1000px ) rotateY( 0deg );
	background:#F90;
	width:1090px;
	height:350px;
	-webkit-backface-visibility:hidden;
	backface-visibility:hidden;
	transition:-webkit-transform .5s linear 0s;
	transition:transform .5s linear 0s;
}
.back
{
	position:absolute;
	-webkit-transform:perspective( 1000px ) rotateY( 180deg );
	transform:perspective( 1000px ) rotateY( 180deg );
	background:#CED9E7;
	width:1090px;
	height:350px;
	-webkit-backface-visibility:hidden;
	backface-visibility:hidden;
	transition:-webkit-transform .5s linear 0s;
	transition:transform .5s linear 0s;
}


/*==================================================
 * Effect 2
 * ===============================================*/
.effect2
{
  position: relative;
}
.effect2:before, .effect2:after
{
  z-index:-1;
  position: absolute;
  content: "";
  bottom: 15px;
  left: 10px;
  width: 50%;
  top: 80%;
  max-width:300px;
  background: #777;
  box-shadow: 0 15px 10px #777;
  transform: rotate(-3deg);
}
.effect2:after
{
  transform: rotate(3deg);
  right: 10px;
  left: auto;
}
.flash1
{
	width:75%;
	height:300px;
	margin:auto;	
	/*box-shadow:0px 0px 30px 0px #000000;
	-webkit-box-shadow:0px 0px 30px 0px #000000;
	-moz-box-shadow:0px 0px 30px 0px #000000;*/	
}

.rectangle
{
	width:95%;
	margin:auto;
	height:65px;
	border-bottom-style:dotted;
	border-top-style:dotted;
	border-color:#000;
}
.rectangle h1
{
	font:18px 'Libre Baskerville', serif;
	color:#000;
	text-align:center;
	font-weight:bolder;
}
.rectangle p
{
	text-align:center;
}
.content
{
	width:90%;
	margin:auto;	
	border-bottom:2px solid #06C;
	overflow:hidden;
	
}
.content li
{
	font:16px 'Libre Baskerville', serif;
	list-style:circle;
	text-align:justify;
	font-weight:bold;
}
.content-in
{
	width:100%;
	margin:auto;
		
}
.content-in a
{
	color:#000;
	text-decoration:none;
}
.content-left
{
	width:50%;
	background:#fff;
	margin:auto;
	float:left;
	margin-bottom:2%;
}
.content-right
{
	width:50%;
	background:#fff;
	margin:auto;
	float:left;
		margin-bottom:2%;
}
.xx
{
	width:25%;
	height:290px;
	float:left;
	margin:auto;
	margin-right:4%;
	margin-left:4%;
	margin-top:10px;
	margin-bottom:20px;
	border-radius:100px / 30px;
	 opacity:1;
	 transition:all 0.9s ease;
	 
}
.effect7
{
    position:relative;
}
.effect7:before, .effect7:after
{
	content:"";
    position:absolute; 
    z-index:-1;
    box-shadow:0 1px 5px rgba(0,0,0,0.8);
    top:0;
    bottom:0;
    left:10px;
    right:10px;
    border-radius:80px / 25px;
} 
.effect7:after
{
    right:10px; 
    left:auto; 
    transform:skew(8deg) rotate(3deg);

}
.xx-top
{
	width:100%;
	float:left;
	height:35%;	
    transition: all 5s ease;
	

}
.xx-top:hover
{

		transition:all 0.9s ease;
		width:115%;
}
.xx-bottom
{
	width:100%;
	float:left;
	height:65%;
}
.xx-bottom a
{
	text-decoration:none;
	color:#5584ff;
}
.xx-bottom h2 a
{
	text-decoration:none;
	color:#5584ff;
}
.xx-bottom:hover
{
        opacity:0.9;
		background:#fff;
		transition:all 0.9s ease;
}
.xx h2
{
	font:12px 'Libre Baskerville', serif;
	color:#06C;
	text-align:center;
	font-weight:bold;
	
}
.xx p
{
	width:80%;
	margin:auto;
	font-weight:bold;
	font:15px 'Libre Baskerville', serif;
	text-align:justify;
}
.xx img
{
	width:40%;
	margin-left:30%;

}
.fade
{
       
}
.fade:hover
{
        opacity:1;
}
.foot
{
	width:95%;
	height:170px;
	margin:auto;
	background:#111;
	border-bottom:2px solid #06C;
}
.foot:hover
{
        opacity:0.9;
		background:#fff;
		transition:all 3s ease;
		color:#000;	
}
.foot:hover li a,visited
{
	color:#000;
}
.footer
{
	width:100%;
	height:40px;
	margin:auto;
	background:#0e1a35;
	border-bottom:2px solid #fff;
	text-align:center;
	float:left;
	
}
.foot-111
{
	width:85%;
	height:150px;
	margin:auto;
}
.foot-11
{
	width:30%;
	height:150px;
	float:left;
	border:1px solid #fff;
	margin-right:3%;
}
.footercopy
{
	width:100%;
	height:30px;
	background:#0e1a35;
	
}
.footer p
{
	color:#fff;
	font:11px 'Libre Baskerville', serif;
	text-align:center;
	padding:10px;
}
.footer1 p
{
	font-weight:bold;
	color:#ccc;
}
.footer1 img
{
	float:left;
	border-radius:20px;
	margin-left:2%;
	border:2px solid #fff;
}
.footer1 img:hover
{
	float:left;
	border-radius:20px;
	margin-left:2%;
	border:2px solid #f90;
}
.footer1 li
{
	text-decoration:none;
	text-align:center;
	list-style:none;
	text-align:left;
	/*border-bottom:1px solid #fff;*/
}
.footer1 li a,visited
{
	font:11px 'Libre Baskerville', serif;
	padding:5px;
	color:#fff;
	text-decoration:none;
}
.footer1 li a:hover
{
	color:#06C;
}
.footer1 h3
{
	
}
.foo
{
	width:100%;
	height:auto;
	background:#000;
	margin:auto;
	float:left;
}
.foo p
{
	color:#fff;
	text-align:center;
	font:9px Arial ;
	
}
.flogo
{
	width:250px;
	height:100px;
	float:right;
	margin-top:40px;

}
.readmore
{
	width:100px;
	padding:8px;
	height:20px;
	color:#000;
	font-weight:bold;
	margin:auto;
	text-align:center;
	font:14px 'Libre Baskerville', serif;
	border-radius:10px;
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
	border: 2px solid #CCC;
	margin-bottom:5px;

}
.readmore:hover
{
	background:#fff;
	color:#06C;
	border: 2px solid #5584ff;
	transition: all 1.2s ease;
	
}
.readmore a
{
	font:15px 'Libre Baskerville', serif;
	color:#5584ff;
	text-decoration:none;
	
}
.readmore a:hover
{
	color:#000;
	-webkit-transition: all .25s ease;
  -moz-transition: all .95s ease;
  -ms-transition: all .95s ease;
  -o-transition: all .95s ease;
  transition: all .95s ease;
}
.submit
{
	width:150px;
	height:50px;
	float:left;
	padding:5px;
	color:#fff;
	font-weight:bold;
	margin:10px 0px 0px 115px; 
	text-align:center;
	font:13px 'Libre Baskerville', serif;
	border: 2px solid #fff;
	border-radius:10px;
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
	background:#0f1a36;
}
.submit:hover
{
	background:#fff;
	color:#000;
	border: 2px solid #5584ff;
	transition: all 1.8s ease;
}
.input
{
	border:2px solid #000;
	border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	width:55%;
	padding:2.5%;
	margin-left:78px;
	position:relative;

	color:#000;	
}
.contact
{
	width:30%;
	float:left;
	height:150px;
	margin:0 0 0 2%;
	
}
.table
{
	width:auto;
	margin:auto;
}

.table-1
{
	width:auto;
	margin:auto;
}
.y
{
	width:31%;
	height:370px;
	float:left;
	box-shadow:0 4px 10px 0 #888888;
	-webkit-box-shadow:0 4px 10px 0 #888888;
	-moz-box-shadow:0 4px 10px 0 #888888;
	margin:auto;
	margin-right:1%;
	margin-left:1%;
	margin-top:10px;
	margin-bottom:20px;


}
.y h1
{
	text-align:center;
}
.xy
{
	width:24%;
	height:260px;
	float:left;
	box-shadow:0 4px 10px 0 #888888;
	-webkit-box-shadow:0 4px 10px 0 #888888;
	-moz-box-shadow:0 4px 10px 0 #888888;
	margin:auto;
	margin-right:0.40%;
	margin-left:0.40%;
	margin-top:10px;
	margin-bottom:20px;


}

.y_box
{
	width:99%;
	height:auto;
	float:left;
	margin:auto;
	margin-bottom:10px;
}




@media only screen and (min-width:150px) and (max-width:750px)
{
	#container-body { width:98%; margin:auto; border:3px solid #000;}
	.top { width:100%; margin:auto; height:30px;}
	.top-call { width:100%; margin:auto; height:30px;position: fixed;background: #0f1a36;z-index: 1;top: 0;}
	.top-call p {width:100%; margin:auto;text-align:center;font-size:20px;}
	.head { width:98%; height:490px; margin:auto; margin-bottom:0%; }
	.header-logo { width:100%; height:90px; margin:auto; border-bottom:2px solid #0f1a36; }
	.header-logo img { width:98%; height:100%; margin:auto;}
	.nav { width:99%; height:auto; margin:auto; border:3px solid #0e1a35; margin-bottom:5px;}
	.nav ul { padding-left:0;}
	.nav ul li {text-align:center; width:100%; border-bottom:2px solid #0e1a35; }
	.nav ul li a,visited {display:block; margin-top:35px; text-align:center;  }
	.nav ul ul {padding-left:0%; width:99.5%;}
	.nav ul ul li { text-align:center; margin:auto;}
	.nav ul ul li a,visited {display:block; font-size:75%; margin:auto; }

	.flash { width:98%; height:100%; margin:auto;  }
	.flash img { width:98%;}
	
	.flash_Left { width:100%; height:100%; margin:auto; background:#0f1a36; border-bottom:3px solid #000;} 
	.flash_Left img { width:98%; height:auto; }
	
	.flash_right { width:100%; height:100%; margin:auto; background:#0f1a36; margin-bottom:30px;}
	.flash_right img { width:100%; margin:auto; height:auto;  }
	
	.input{ width:80%; margin:auto; height:auto; border:3px solid #000; }
	.table{ width:39%; margin:auto; margin-left:77px; }
	.table-1{ width:100%; margin:auto; }
	.submit { margin-left:auto;}
	
	.signup_form { width:98%; margin:auto; background-repeat:no-repeat;}
	.signup_form img {width:100%; margin:auto; height:auto; }
	
	.oplogo { width:100%; height:auto; margin:50px 0px 20px 0px; }
	.oplogo img { width:100%; }
	
	.content-page{ width:98%; height:auto; margin:auto; }
	
	.product { width:98%; height:auto; margin:auto; margin-bottom:1.5%; }
	.product-L { width:98%; height:auto; margin:auto; }
	.product-L img { width:80%; margin:auto; margin-left:30px;}
	.product-R { width:68%; height:auto; margin:auto;  }
	
	.content-B { width:98%; height:900px; margin:auto; background:none; }
	
	.content-box { width:99%; height:auto; margin:auto; margin-bottom:15px; }
	.content-boxp1 { width:20%; margin-left:230px; }
	.content-boxp1 img { width:100%; margin:auto; }
	
	.cont_Box { width:98%; height:600px; margin:auto; }
	
	.cont_Box_L { width:98%; height:auto; margin:auto; border-bottom:3px solid #000;}
	.cont_Box_L li { text-align:justify; margin-left:21%; margin-bottom:5px; }
	.cont_Box_L h1 { text-align:center;}
	
	.cont_Box_R { width:100%; margin:auto; margin-top:30px; background:url(../img/content-mobile.jpg); background-repeat:no-repeat   }
	.cont_Box_R img { width:100%; margin:auto;}
	
	.content-p-box { width:98%; height:auto; margin:auto; margin-top:20px; }
	.content-p-box-L { width:98%; height:auto; margin:auto;}
	.content-p-box-L img { width:95%; margin:; height:auto;}
	.content-p-box-R { width:98%; height:auto; margin:auto;}
	
	.xx{ width:90%; margin-bottom:30px; height:auto;}
	.xx-top { width:98%; margin:auto;}
	.xx-bottom { width:98%; margin:auto;}
	
	
	
	
	.footercopy { width:100%; height:30px; text-align:center; margin:auto; }
	
	.logo { width:100%; margin:auto;}
	.contact { width:98%; height:auto; margin:auto;}
	.box { width:95%; margin:auto; height:200px; margin-bottom:20px; margin-top:5px;}
	.box img { width:100%; height:200px; margin:auto;}
	.box:hover { width:100%; height:200px; margin:auto;}
	.box:hover .front { width:100%; margin:auto; height:200px;}
	.box:hover .back { width:100%; margin:auto; height:200px;}
	.front { width:95%; height:200px; margin:auto;}
	.back{ margin:auto; width:90%; margin:auto;}
	.square{ width:100%; margin:auto;}
	.square1{ width:100%; margin:auto;}
	.square2{ width:100%; margin:auto;}
	
	.y{ width:100%; margin:auto;}
	.y_box{ width:100%; margin:auto;}
	.y img{ width:99%; height:300px; margin-bottom:15px; border:2px solid #06C;}
	.content{ width:98%; margin:auto;}
	.content1 { width:98%; margin:auto;}
	.content_left { width:98%; margin:auto;}
	.content_box { width:98%; border:3px solid #d72d00;}
	.content_box_l { width:98%; margin:auto;}

	.pic{ width:95%; margin-left:2.2%; margin-bottom:1%; height:230px; }
	.picbig{ display:none;}
	.content_box_r{ width:95%; margin:auto;}
	.content p{ margin:auto; margin-bottom:5px;}
	.box_1{ width:100%; margin:auto;}
	.foo{ width:100%; margin:auto; height:auto;}
	.foot{ width:98%; margin:auto; height:600px;}
	.footer{ width:98%; margin:auto; height:100%; }
	.footer1{ width:98%; margin:auto; border:none; height:auto;}
	.footer1 img{ margin:auto;}
	.footer1 li{ text-align:center; border-bottom:1px solid #fff;}
	.footer1 h3{ text-align:center;}
	.footer1 p{width:98%; margin:auto; text-align:center;}
	
		#cssmenu {
    width: 100%;
  }
  #cssmenu ul {
    width: 100%;
    display: none;
  }
  #cssmenu.align-center > ul {
    text-align: left;
  }
  #cssmenu ul li {
    width: 100%;
    border-top: 1px solid rgba(120, 120, 120, 0.2);
  }
  #cssmenu ul ul li,
  #cssmenu li:hover > ul > li {
    height: auto;
  }
  #cssmenu ul li a,
  #cssmenu ul ul li a {
    width: 100%;
    border-bottom: 0;
  }
  #cssmenu > ul > li {
    float: none;
  }
  #cssmenu ul ul li a {
    padding-left: 25px;
  }
  #cssmenu ul ul ul li a {
    padding-left: 35px;
  }
  #cssmenu ul ul li a {
    color: #dddddd;
    background: none;
  }
  #cssmenu ul ul li:hover > a,
  #cssmenu ul ul li.active > a {
    color: #ffffff;
  }
  #cssmenu ul ul,
  #cssmenu ul ul ul,
  #cssmenu.align-right ul ul {
    position: relative;
    left: 0;
    width: 100%;
    margin: 0;
    text-align: left;
  }
  #cssmenu > ul > li.has-sub > a:after,
  #cssmenu > ul > li.has-sub > a:before,
  #cssmenu ul ul > li.has-sub > a:after,
  #cssmenu ul ul > li.has-sub > a:before {
    display: none;
  }
  #cssmenu #menu-button {
    display: block;
    padding: 17px;
    color: #dddddd;
    cursor: pointer;
    font-size: 12px;
    text-transform: uppercase;
    font-weight: 700;
  }
  #cssmenu #menu-button:after {
    position: absolute;
    top: 22px;
    right: 17px;
    display: block;
    height: 4px;
    width: 20px;
    border-top: 2px solid #dddddd;
    border-bottom: 2px solid #dddddd;
    content: '';
  }
  #cssmenu #menu-button:before {
    position: absolute;
    top: 16px;
    right: 17px;
    display: block;
    height: 2px;
    width: 20px;
    background: #dddddd;
    content: '';
  }
  #cssmenu #menu-button.menu-opened:after {
    top: 23px;
    border: 0;
    height: 2px;
    width: 15px;
    background: #ffffff;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
  }
  #cssmenu #menu-button.menu-opened:before {
    top: 23px;
    background: #ffffff;
    width: 15px;
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg);
  }
  #cssmenu .submenu-button {
    position: absolute;
    z-index: 99;
    right: 0;
    top: 0;
    display: block;
    border-left: 1px solid rgba(120, 120, 120, 0.2);
    height: 46px;
    width: 46px;
    cursor: pointer;
  }
  #cssmenu .submenu-button.submenu-opened {
    background: #262626;
  }
  #cssmenu ul ul .submenu-button {
    height: 34px;
    width: 34px;
  }
  #cssmenu .submenu-button:after {
    position: absolute;
    top: 22px;
    right: 19px;
    width: 8px;
    height: 2px;
    display: block;
    background: #dddddd;
    content: '';
  }
  #cssmenu ul ul .submenu-button:after {
    top: 15px;
    right: 13px;
  }
  #cssmenu .submenu-button.submenu-opened:after {
    background: #ffffff;
  }
  #cssmenu .submenu-button:before {
    position: absolute;
    top: 19px;
    right: 22px;
    display: block;
    width: 2px;
    height: 8px;
    background: #dddddd;
    content: '';
  }
  #cssmenu ul ul .submenu-button:before {
    top: 12px;
    right: 16px;
  }
  #cssmenu .submenu-button.submenu-opened:before {
    display: none;
  }
}