/*
Theme Name: ISPConfig Bootstrap
Theme URI: https://4c49e94b-433c-42bb-bec4-4524dacd5efd.p.bardy.io
Author: ISPConfig UG
Author URI: https://4c49e94b-433c-42bb-bec4-4524dacd5efd.p.bardy.io
Description: The ISPConfig Bootstrap theme.
Version: 1.0
License: (c) ISPConfig UG
License URI: 
Tags: grey, 2column
Text Domain: ispconfig

*/


/* Bootstrap overrides -------------------------------- */

.container-fluid {
	padding-left:0px;
	padding-right:0px;
}

.carousel-control.left, .carousel-control.right {
    background-image: none;
	color: #333333;
}

/* Text ----------------------------------------------- */

h1 {
	color:#3F464A;
	font-family: 'Lato', sans-serif;
	font-weight: 900;
	font-size:28px;
	margin-top:25px;
	margin-bottom:25px;
}

h2 {
	color:#3F464A;
	font-family: 'Lato', sans-serif;
	font-weight: 700;
	font-size:23px;
	margin-top:20px;
	margin-bottom:20px;
}

h3 {
	color:#3F464A;
	font-family: 'Lato', sans-serif;
	font-weight: 400;
	font-style:italic;
	font-size:18px;
	margin-top:15px;
	margin-bottom:15px;
}

h4 {
	color:#3F464A;
	font-family: 'Lato', sans-serif;
	font-weight: 300;
	font-size:15px;
	margin-top:12px;
	margin-bottom:12px;
	font-weight:bold;
}

p {
	line-height:16pt;
	margin-top:10px;
	margin-bottom:10px;
}

hr {
	border-color:#CCCCCC;
}

/* Applied to HR tags below H tags*/
.hline {
	margin-top:-12px;
	margin-bottom:-10px;
}

h2 + hr {
   margin-top:-12px;
   margin-bottom:-10px;
}

/* Heights in px as classes */

.height-10 {
	height:10px;
}
.height-20 {
	height:20px;
}
.height-30 {
	height:30px;
}
.height-40 {
	height:40px;
}
.height-50 {
	height:50px;
}

/* Background colors ---------------------------------- */

.isp-bg-grey-light {
	background-image:url(images/bg_light_grey.png);
}

.isp-bg-grey-medium {
	background-image:url(images/bg_medium_grey.png);
}

.isp-bg-grey-dark {
	background-image:url(images/bg_dark_grey.png);
}

/* Lists --------------------------------------------- */

.check-red ul {
	margin-top:30px;
	padding-left:25px;
	line-height:23px;
	list-style-image:url(images/check_red.png);
	text-align:left;
}

/* Loginbar ------------------------------------------ */

/* Login --------------------------------------------- */

.loginbar {
	color: #3F464A;
	background-image:url(images/bg_login.png);
	height:150px;
}

.userbar {
	color: #3F464A;
	background-image:url(images/bg_login.png);
	height:25px;
	text-align:right;
	padding:10px 20px 10px 0;
}

.userbar span {
	color:#3F464A;
	font-family: 'Lato', sans-serif;
	font-weight: 300;
	font-size:15px;
	margin-top:12px;
	margin-bottom:12px;
	font-weight:bold;
}

.invisible {
	display:none;	
}

/* Navigation ---------------------------------------- */

#logoWrapper {
	margin-top:5px;
}

#textnav {
	margin-top:20px;
	#font-family: 'Lato', sans-serif;
	font-family: Arial, sans-serif;
	float:left;
}

#textnavContentWrapper {
	float:left;
	margin-top:5px;
}

#textnav li {
	list-style-type: none;
	display: inline;
}

#textnav ul {
	list-style-type: none;
	display: inline;
}

#textnav a {
	font-size:15px;
	font-weight:700;
	color:#969CA1;
	text-decoration:none;
	margin-right:10px;
}

#textnav a img{
	border:none;
}

#textnav a:hover {
	color: #e42d33;
}

#textnav li.current_page_item  a{
	color: #0a7af0;
}

#textnav li.current_page_parent a{
	color: #0a7af0;
}

#main_search {
	background: #EFF0F4 url(images/icon_lens.png) right no-repeat;
	/*padding-right: 25px;*/
	font-size:14px;
	color:#666666;
	font-style:italic;
	border:solid 1px #999;
	width:150px;
	margin-right:10px;
}

#langswitch {
	font-size:12px;
	color:#666666;
	border:solid 1px #999;
}

#mainNavWrapper {
	float:left;
	margin-bottom:-3px;
}


/* Tab base settings */
ul#menu-main-menu {
	list-style-type: none;
	#font-family: 'Lato', Verdana, sans-serif;
	font-family: Arial, sans-serif;
	font-size:14px;
	font-weight:400;
	text-align: center;
	margin-top:34px;
	/*margin-bottom:-21px;*/
	padding-top:3px;
	/*padding-bottom:30px;*/
	padding-left:5px;
	/*padding-right:10px;*/
}

ul#menu-main-menu li {
	display: inline;
}

/* Selected tab */
ul#menu-main-menu li.current_page_item {
	
}

/*Selected tab text and link */
ul#menu-main-menu li.current_page_item a {
	background-image:url(images/bg_nav_grey.png);
	color: #0a7af0;
	position: relative;
	top: 1px;
	padding-top: 5px;
	border: 1px solid #cccccc;
	border-bottom: none;
	font-weight:700;
}

/* Selected tab */
ul#menu-main-menu li.current-page-parent {
	
}

/*Selected tab text and link */
ul#menu-main-menu li.current-page-parent a {
	background-image:url(images/bg_nav_grey.png);
	color: #0a7af0;
	position: relative;
	top: 1px;
	padding-top: 5px;
	border: 1px solid #cccccc;
	border-bottom: none;
	font-weight:700;
}

/* All tab text and link */
ul#menu-main-menu li a {
	padding: 10px 6px;
	color: #3F464A;
	margin-right: 0px;
	text-decoration: none;
	border-bottom: none;
}

ul#menu-main-menu a:hover {
	color: #e42d33;
}

#subnavClosed {
	background-image:url(/wp-content/themes/ispconfig/images/nav_line.png);
	height:5px;
}

#subnav {
	background-image:url(/wp-content/themes/ispconfig/images/nav_line2.png);
	height:33px;
	text-align: right;	
}

#subnav ul {
	display: inline;
	list-style-type: none;
	#font-family: 'Lato', Verdana, sans-serif;
	font-family: Arial, sans-serif;
	font-size:14px;
	font-weight:700;
	/*margin-right:165px;*/
}

#subnav li {
	display: inline;
	padding-right:20px;
}

#subnav li:last-child {
	padding-right:0px;
}

#subnav a{
	text-decoration:none;
	line-height:32px;
	color: #3F464A;
	display: inline-block;
	height:32px;
}


#subnav a:hover {
	color: #e42d33;
}

#subnav li.current_page_item a {
	color: #0a7af0;
}

#subnavContentWrapper {
	padding-right:10px;
}

/* Buttons ----------------------------------------------------- */

#btnlogin {
	display:block;
	background-image:url(images/btn_login.png);
	width:59px;
	height:26px;
	
}

#btnlogin:hover {
	background-image:url(images/btn_login_hover.png);
}

#btncart {
	display:block;
	background-image:url(images/btn_cart.png);
	width:59px;
	height:26px;
	
}

#btncart:hover {
	background-image:url(images/btn_cart_hover.png);
}

#btnlogout {
	display:block;
	background-image:url(images/btn_logout.png);
	width:68px;
	height:26px;
	
}

#btnlogout:hover {
	background-image:url(images/btn_logout_hover.png);
}

#btnloginform {
	display:block;
	background-image:url(images/btn_signin.png);
	width:73px;
	height:26px;
	
}

#btnloginform:hover {
	background-image:url(images/btn_signin_hover.png);
}

#btndownload {
	display:inline-block;
	background-image:url(images/btn_download_large.png);
	width:279px;
	height:46px;
	margin-top:18px;
}

#btndownload:hover {
	background-image:url(images/btn_download_large_hover.png);
}

#btnbuy {
	display:inline-block;
	background-image:url(images/btn_buy_now.png);
	width:220px;
	height:44px;
	margin-top:18px;
}

#btnbuy:hover {
	background-image:url(images/btn_buy_now_hover.png);
}

.btngreendownload {
	display:inline-block;
	background-image:url(images/btn_download_green.png);
	width:220px;
	height:44px;
	margin-top:30px;
}

.btngreendownload:hover {
	background-image:url(images/btn_download_green_hover.png);
}

.formgreendownload {
	display:inline-block;
	background-image:url(images/btn_download_green.png);
	width:220px;
	height:44px;
	margin-top:30px;
	border-style: none;
    background-color: transparent;
	text-indent: 480px;
}

.formgreendownload:hover {
	background-image:url(images/btn_download_green_hover.png);
}

#btnvideotour {
	/*display:block;*/
	display:inline-block;
	background-image:url(images/btn_video_tour.png);
	width:170px;
	height:48px;
	margin-top:18px;
}

#btnvideotour:hover {
	background-image:url(images/btn_video_tour_hover.png);
}

#btnonlinedemo {
	/*display:block;*/
	display:inline-block;
	background-image:url(images/btn_online_demo.png);
	width:194px;
	height:48px;
	margin-top:18px;
	margin-left:20px;
}

#btnonlinedemo:hover {
	background-image:url(images/btn_online_demo_hover.png);
}

/* Footer --------------------------------------------------- */

.footer {
	color:#FFFFFF;
}

.footer a {
	color:#FFFFFF;
	text-decoration: none;
	line-height:18px;
	font-size:12px;
}

.footer h5 a {
	color:#FFFFFF;
	text-decoration: none;
	line-height:18px;
	font-size:16px;
}

.footer a:hover {
	text-decoration: underline;
}

#footerMenuWrapper {
	margin-top:40px;
}

#footerMenuWrapper .col-md-2 img {
	margin-bottom:10px;
}

#footerIcon img {
	margin-bottom:30px;
}

#footerImprint {
	text-align:center;
	padding-bottom:20px;
	font-size:12px;
}

/* Index page ---------------------------------------------- */

.indexcolumnheader {
	margin-top:30px;
	color:#3F464A;
	font-family: 'Lato', sans-serif;
	font-weight: 700;
	font-size:18px;
}
.indexcolumnheader img {
	margin-right:10px;
}
.indexcolumnheader hr {
	margin-top:5px;
}

.indexcontentboxleft {
	/*margin-bottom:35px;*/
	width:450px;
	position:relative;
	text-align:left;
}
.indexcontentboxright {
	/*margin-bottom:35px;*/
	width:450px;
	margin-left:20px;
	text-align:left;
}
.indexboxh {
	height:200px;
	overflow:hidden;
}

.indexcontentboxleft ul, .indexcontentboxright ul {
	/*padding-left:3px;*/
}


#indexRow1Col1 {
	margin-top: 20px;
	margin-left: 20px;
}

#indexRow1Col1 img{
	margin-top: 40px;
}

#indexServicesFunction h1 {
	margin-bottom: 0px;
	margin-top: 30px;
}

#indexServicesFunction hr {
	margin-bottom: 0px;
	margin-top: 10px;
}

.col-md-6 img {
	max-width: 100%;
}

@media screen and (max-width: 650px) {
	#menu-main-menu, #menu-main-menu > li , #menu-main-menu > li > a {
		display: block;
	}
}

/* responsive queries */
#mobile-menu {
  display: none;
}

.indexcontentboxleft, .indexcontentboxright {
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
}

@media screen and (max-width: 767px) {
  .container h1, .container h2 {
    text-align: center;
  }
  .indexcolumnheader {
    text-align: center;
  }
  .indexcolumnheader > img {
    display: block;
    margin-left: auto;
    margin-right: auto;
  }
}

@media screen and (max-width: 650px) {
  body {
    border-top: 42px solid #444;
  }
  #logoWrapper {
    text-align: center;
  }
  #mobile-menu {
    display: block;
    position: absolute;
    top: 5px;
    left: 5px;
    z-index: 2;
    width: 32px;
    height: 32px;
    background-image: linear-gradient(to bottom, #666, #333);
    border-radius: 5px;
  }
  #mobile-menu::before {
    display: block;
    content: "";
    width: 100%;
    height: 100%;
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgAQMAAABJtOi3AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAAZQTFRF////////VXz1bAAAAAF0Uk5TAEDm2GYAAAAWSURBVAjXY2AgDNj//3+ARNBOCRYAAFrXGg4yv169AAAAAElFTkSuQmCC");
    background-size: contain;
  }
  #textnav {
    display: none;
  }
  div[class*="col-md-"] {
    position: static;
  }
  
  #mainNavWrapper {
    position: absolute;
    display: none;
    float: none;
    width: 100%;
    top: 48px;
    background: rgba(255, 255, 255, 0.95);
    padding: 0;
  }
  
  ul#menu-main-menu {
    display: block;
    width: 100%;
    padding: 0;
    margin-top: 0;
    margin-bottom: 0;
    border-bottom: solid 3px #9f9f9f;
  }
  #subnav {
    display: none;
  }
  ul#menu-main-menu-1 {
    padding-left: 0;
    font-size: 0.875em;
  }
  ul#menu-main-menu > li, ul#menu-main-menu > li > a,
  ul#menu-main-menu-1 > li, ul#menu-main-menu-1 > li > a{
    display: block;
    margin: 0;
  }
  ul#menu-main-menu > li {
    border-bottom: solid 1px #dfdfdf;
  }
  ul#menu-main-menu li.current_page_item ul#menu-main-menu-1 > li > a {
    background-image: none;
    background: rgba(221, 225, 229, 0.4);
  }
  #indexRow1Col1 {
	margin: 0;
  }
  .container.footer h5 {
    margin-top: 15px;
    margin-bottom: 0;
  }
  .container.footer a {
    display: block;
    text-align: center;
  }
  .container.footer a + br {
    display: block;
  }
  .container.footer img {
    width: 100%;
    height: 2px;
  }
  #footerIcon {
    text-align: center;
  }
}
