@font-face{
	font-family: regular ;
	src: url('/css/fonts/regular.otf');
}

.topbar-wrapper,
.login-type,
.menu-sidebar,
.carousel{
	display: none;
}


@media screen and (max-width: 768px){
	
html, body{
		text-align: center;
}
.gray_out{
		padding: 0 15px 0 30px;
}
.call_to_action,
#top_header,
#main-nav,
#sidebar,
.very_top_menu{
		display: none;
}
.top-margin{
	margin-top: 100px;
	font-size: 38px;
}
.topbar-wrapper{
		display: block;
		height: 100px;
		width: 100%;
		background-color: red;
		position: fixed; top: 0;
		z-index: 100;
		text-align: left;
		box-shadow: 0px 2px 3px rgba(0,0,0,.2);
}

.topbar-wrapper .upper-bar{
		height: 60px;        
		background: linear-gradient( to top right, #dfdfdf,#eee) ;
}


.topbar-wrapper .menu-icon{
		width: 40px;
		height: 40px;
		margin: 10px;
		background-image: url('/img/mobile_version/menu2.png');
		background-size: cover;
		display: inline-block;
}
.menu-icon:hover{
		cursor: pointer;
}

.mobile-sb-logo{
		height: 45px;
		margin: 8px auto;
		position: relative;
		left:50%;
		margin-left: -150px;
}

.lower-bar{
		background: linear-gradient( to top left, #00418a,#0258b9) ;
		height: 40px;
		width: 100%;
}

.lower-bar a{
		line-height: 40px;
		width: 25%;
		display: inline-block;
		text-align: center;
		font-family: regular;
		letter-spacing: .08em;
		font-size: 15px;
		color: #e9e9e9;
}
.lower-bar a:nth-child(2){
		width: 46%;
}

.login-type{
		display: block;
		width: 96%;
		height:140px;
		background-color: #0258b9;
		position: fixed;
		top: -50px;
		border-radius: 10px;
		z-index: 99;
		margin: 0 2%;
		color: #eee;
		opacity: 0;
		box-shadow: 0 0 20px #333;
		transition: all .320s ease-in-out;
}
.login-type:before{
		content: '';
		border-style: solid;
		border-width: 0 10px 10px 10px;
		border-color: transparent transparent #0258b9 transparent;
		position: absolute;
		top: -10px; right: 30px;
}

.login-type.open{
		opacity: 1;
		top: 110px;
}


.login-type .right{
		float: right;
		width: 50%;
		display: block;
		background: linear-gradient(to right, #00418a, #0258b9);
		height: 100%;
		border-radius: 0 10px 10px 0;
}
.img{
		background-size: cover;
		margin: 0 auto; 
		width: 100px;
		height: 100px;
}
.img.web{
		background-image: url('/img/mobile_version/laptop.png');
}
.img.phone{
		width: 80px;
		background-image: url('/img/mobile_version/phone.png');
}

.login-type .left{
		float: left;
		width: 50%;
		display: block;
		background-color: peru;
		height: 100%;
		border-radius: 10px 0 0 10px;
		background: linear-gradient(to left, #eee, #ddd);

}
.login-type .left a{
		color: #000;
}
.login-type a{
		color: #000;
		font-family: regular;
		font-size: 18px;
		letter-spacing: .06em;
		color: #eee;
}


/*  phone sidebar  */

.menu-sidebar{
	display: block;
	height: 100%;
	max-width: 80%;
	width: 400px;
	background: linear-gradient(to right, #00418a, #0258b9);
	position: fixed;
	top: 0;
	bottom: 0;
	left: -400px;
	z-index: 101;
	transition: all .320s ease;
	padding-top: 60px;
	color: #eee;
	overflow: auto;
	box-shadow: 
}
.menu-sidebar.open{
		left: 0px;
}
.menu-sidebar .close{
		width: 35px;
		height: 30px;
		margin: 15px;
		position: absolute; right: 0; top: 0;
		background-image: url('/img/mobile_version/left-arrow.png');
		background-size: cover;
}
.menu-sidebar .close:hover{
		cursor: pointer;
}
.menu-sidebar .sidebar-heading p{
	font-family: Ubuntu;
	padding: 0 20px;
	font-size: 16px;
	line-height: 1.3em;
	color: #fff;
}
.menu-sidebar .sidebar-heading p b{
	font-size: 1.3em;
}
.menu-sidebar .sidebar-nav li{
		text-align: left;
		margin: 3px 20px;
		list-style: none;
		border-radius: 22px;
		background: linear-gradient(to left, rgba(255,255,255,.1), rgba(255,255,255,0) );

}
.menu-sidebar .sidebar-nav li a{
		display: block;
		font-family: regular;
		letter-spacing: .06em;
		color: #eee;
		text-transform: capitalize;
		font-size: 22px;
		height: 44px;
		line-height: 44px;
}
.menu-sidebar .sidebar-nav li img{
		width: 40px;
		height: 40px;
		position: relative; bottom: 2px;
		margin: 3px 7px 0 15px;
		display: inline-block;
		vertical-align: middle;
}

.menu-sidebar .sidebar-social{
	margin: 20px auto 30px;
}
.menu-sidebar .sidebar-social li{
	display: inline-block;
	margin: 0 3px;
}


/*   mobile page syling   */

	/*    Content    */

#content{
		margin-top: 80px;
		width: 100%;
}

#sidebar{
		padding: 0 15px 0 15px;
}
#sidebar .side_body .side_list li{
		padding: 0;
}

ul.button-group{
		width: 127px;
		margin: 10px auto;
}

label.inline{
		margin-bottom: 0;
		float: left;
}

form.columns{
		padding-left: 30px;
}

footer{
		text-align: left;
}
footer #copyright p{
		width: 90%;
		margin: 0 auto 20px;
		text-align: justify;
}


/*  carousel  */
#slider_wrap{
	margin-top: 120px;
	height: 220px;
}

#slider_wrap .slider-nav{
	height: 220px;
}


#slider_wrap .main-slider{
	height: 220px;
}
#slider_wrap .main-slider li a img{
	height: 220px;
}

#main, #content{
	margin-top: 10px;
}


.th img.responsive{
		margin: 0 auto;
}

footer section{
		max-width: 320px;
		display: inline-block;
}

.editions .edition{
	width: 90%;
	vertical-align: top;
}
.edition.enterprise{
	width: 90%;
}

.editions .second-row{
	width: 90%;
	padding: 0 2%;
}
.edition .edition-desc{
	min-height: auto;
}

.newsletter {
	display: none;
}

table {
	display: block;
	max-width: 100%;
	overflow: auto;
}

}

@media screen and (max-width: 320px){
#slider_wrap{
	height: 120px;
}

#slider_wrap .slider-nav{
	height: 120px;
}


#slider_wrap .main-slider{
	height: 120px;
}
#slider_wrap .main-slider li a img{
	height: 120px;
}

.th img.responsive{
		width: 90%;
}



}