/*   
Theme Name: Cyberduck howTo Theme
Theme URI: http://www.cyberduck.se
Description: Companyname Official Cyberduck howTo Theme
Author: Ola Eborn
Author URI: http://www.cyberduck.se
Version: 1.0
*/



/* Colors 

gul = #FFCB07;
svart = #3a3a3a;
grå = #efefef;

*/

body {
	background:#fff;
	color:#3a3a3a;
	margin:0;
	padding:0;
    font: 400 13px/18px 'Open Sans', Helvetica, Arial, sans-serif;
	border-top:15px solid #FFCB07;
}

a {
	color:#FFCB07;
}

h1,h2,h4,h5 {
	font-weight:700;
}

h3 {
	font-size:11px;
	text-transform:uppercase;
	font-weight:400;
	font-style:normal !important;
	margin-bottom:4px !important;
}

h5 {
	text-transform:uppercase;
	font-size:13px;
}

h6 {
	font-size:13px;
	font-weight:400;
	margin:10px 0 3px 0 !important;
}

h6:first-child {
	margin-top:0px;
}


#page-wrap {
	width:980px;
	margin:0 auto;
}

header {
	height:120px;
	border-bottom:1px solid #efefef;
	position:relative;
}

#logo {
	width:265px;
	position:absolute;
	bottom:21px;
	left:-21px;
}

#main-content {
	margin-top:20px;
}

#content-wrap {
	
}

aside {
	
}

footer {
	
}

nav {
	float:right;
	margin-top:0px;	
}

nav ul li {
  display: inline-block;
  height: 135px;
  padding: 47px 30px;
  margin-top: -15px !important;
  margin-right: -2px !important;
  box-sizing: border-box;
  font-weight: 700;
  text-transform: uppercase;
  position: relative;
  font-size: 12px;
  -webkit-transition: 0.5s all ease;
  -moz-transition: 0.5s all ease;
  -o-transition: 0.5s background ease;
  -ms-transition: 0.5s background ease;
  transition: 0.5s all ease;
  border-top: 15px solid transparent;
  cursor: pointer;
  line-height: 13px;
  vertical-align: top;
  text-align: center;
}

nav ul li:hover, .current_page_item {
  background: #fafafa;
  border-bottom: 1px solid #FFCB07;
  border-top: 15px solid #3a3a3a;
  box-sizing:border-box;
}

.menu-item-top {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:6px;
	background:#3a3a3a;
}

#top-border {
	position:absolute;
	top:0;
	left:0;
	height:6px;
	width:100%;
	background:#FFCB07;
}

hr {
	height:1px;
	border:0;
	background:#efefef;
}

.introtext {
    font-size: 20px;
    text-align: center;
    width: 73%;
    line-height: 1.4;
    font-weight: 300;
    float: left;
    margin-left: 10px;
    margin-top: 40px;
}

.introtext2 {
	font-size:20px;
	text-align:center;
	width:73%;
	line-height:1.4;
	font-weight:300;
	margin:0 auto;
	margin-top:40px;
	margin-bottom:40px;
}

.default {
	width:100%;
	font-size:18px;
	line-height:24px;
	font-weight:300;
	margin-top:40px;
}

#infobox {
	float:right;
	width:200px;
	height:230px;
	background:#efefef;
	border-bottom:3px solid #FFCB07;
	margin-bottom:35px;
}

a #infobox:hover .infoboxtext {
	color:#3a3a3a;
	text-shadow:none;
}

#infobox .inner {
	padding:10px;
}

.screenshot-holder {
	width:177px;
	border:2px solid #fff;
	overflow:hidden;
	margin-bottom:10px;
	position:relative;
}

.screenshot-holder img {
	position:relative;
	z-index:2;
	display:block;
}

img {
	display:block;
}

.noimage {
	position:absolute;
	top:40%;
	left:0;
	width:100%;
	text-align:center;
	color:#888;
	text-shadow:1px 1px 0 #fff;
	text-transform:uppercase;
	z-index:1;
}

.infoboxtext {
	color:#888;
	text-shadow:1px 1px 0 #fff;
	border-bottom:1px solid #fff;
	line-height:15px;
	text-align:center;
	-webkit-transition:0.3s all ease;
-moz-transition:0.3s all ease;
-o-transition:0.3s all ease;
-ms-transition:0.3s all ease;
transition:0.3s all ease;
padding-bottom:3px;
}

.noline {
	border:none !important;
}

.filmer {
	width:100%;
	display:none;
	margin-bottom:40px;
	position: relative;
	padding-bottom: 54.25%; /* 16:9 */
	padding-top: 25px;
	height: 0;
}

.preloader {
	position:absolute;
	width:40px;
	height:40px;
	top:50%;
	left:50%;
	margin-top:-20px;
	margin-left:-20px;
	z-index:5;
}

.filmer iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index:10;
}


.col-3 {
}

#documents {
	margin:0 auto;
}

.boxtitle {
	border-bottom:1px solid #efefef;
	margin-bottom:20px;
}

#documents ul {
	margin:0;
	padding:0;
	list-style:none;
}

#documents ul li {
	display:block;
	padding:9px 10px 7px 10px;
	background:#efefef;
	margin-top:2px;
	text-transform:uppercase;
	font-weight:700;
	font-size:12px;
	padding-left: 40px;
	background: url(images/camera.png) #efefef 8px 6px no-repeat;
	background-size:auto 17px;
	-webkit-transition:0.3s background ease;
	-moz-transition:0.3s background ease;
	-o-transition:0.3s background ease;
	-ms-transition:0.3s background ease;
	transition:0.3s background ease;
	cursor:pointer;
	position:relative;
}

#documents .dokument ul li {
	background: url(images/document.png) #efefef 8px 6px no-repeat;
	background-size:auto 20px;
}

#documents .screenshots ul li {
	background: url(images/screenshot.png) #efefef 8px 8px no-repeat;
	background-size:auto 17px;
}


#documents ul li:hover {
	background-color:#FFCB07;
}


#documents a {
	color:inherit;
}

.helptext {
	text-transform:none;
	font-weight:400;
	line-height:15px;
	display:none;
}

.helpbutton {
	position:absolute;
	top:4px;
	right:4px;
	width:15px;
	opacity:0.3;
	z-index:10;
-webkit-transition:0.3s opacity ease;
	-moz-transition:0.3s opacity ease;
	-o-transition:0.3s opacity ease;
	-ms-transition:0.3s opacity ease;
	transition:0.3s opacity ease;
}

.helpbutton:hover {
	opacity:1;
}


.copyright {
	text-align:center;
	font-size:11px;
	color:#bababa;
	margin-bottom:25px;
	margin-top:50px;
}

div.pp_default .pp_description {
font-weight:700 !important;
margin: 20px 65px 17px 150px !important;
padding:5px;
background:#efefef;
/*text-transform:uppercase;*/
display:inline-block;
font-size:12px !important;
}

.pp_description {
	padding:6px 4px !important;
}

#login {
	width:400px;
	height:175px;
	margin:0 auto;
	margin-top:25px;
	margin-bottom:70px;
	background: #dedede;
font-weight: normal;
background: #fff;
border: 1px solid #e5e5e5;
-webkit-box-shadow: rgba(200,200,200,0.7) 0 4px 10px -1px;
box-shadow: rgba(200,200,200,0.7) 0 4px 10px -1px;
}

#loginbox-container {
	padding-top:50px;
	width:300px;
	margin:0 auto;
}

#smartPWLogin {
	width:inherit !important;
	position:relative;
}

#smartPassword {
font-weight: 200;
height:27px;
font-size: 20px;
line-height: 1;
width: 65%;
padding: 3px;
margin-top: 2px;
margin-right: 6px;
margin-bottom: 0px;
border: 1px solid #e5e5e5;
background: #fbfbfb;
outline: 0;
-webkit-box-shadow: inset 1px 1px 2px rgba(200,200,200,0.2);
box-shadow: inset 1px 1px 2px rgba(200,200,200,0.2);
border-radius:0;
}

input[type="submit"] {
line-height: 28px;
height:34px;
padding: 0 12px 4px;
background:#ffc609;
color: #fff;
cursor: pointer;
-webkit-appearance: none;
white-space: nowrap;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
font-size:13px;
vertical-align:top;
display:inline-block;
margin-top: 3px;
border:0;
}


#loginlogo {
	width:265px;
	margin:0 auto;
	padding-right:40px;
	margin-top:175px;
}

#smartPWError {
	position:absolute;
	top:47px;
	left:0;
	color:#F7891F;
}

a.pp_close {
right: 3px !important;
bottom: 3px !important;
}

.pp_close {
	top:auto !important!
}

.pp_nav {
	position:absolute !important;
	bottom:3px;
	left:3px;
}

.pp_description {
	display:table !important;
}

.pp_description span {
	display:table-cell;
}

.pp_description>div {
	display:table-cell;
	vertical-align:top;
	margin-right:6px;
	width:30px;
}

.pp_description>div>div {
	background:#FFCB07;
	width:20px;
	height:20px;
	border-radius:10px;
	text-align:center;
	margin-top:-3px;
	line-height:20px;
	display:block !important;
	padding-left: 1px;
  	box-sizing: border-box;
	-moz-box-sizing: border-box;
}


.wpcf7 {
	padding:15px !important;
	background:#efefef;
	box-sizing:border-box;
}

.wpcf7 p {
	margin-bottom:8px !important;
}

.wpcf7 input, .wpcf7 textarea {
height: 28px;
font-size: 13px;
border: 1px solid #dedede;
border-radius: 3px;
font-weight: normal;
padding-left:7px;
width:100%;
box-sizing:border-box;
}

.wpcf7 textarea {
	resize:vertical;
	height:140px;
}

div.wpcf7-response-output {
margin: 0 0 0 0 !important;
padding:0 0 0 0 !important;
border:0;
font-size:13px;
font-weight:bold;
color:#F79B1B;
line-height: 16px !important;
}

div.wpcf7-validation-errors {
border:0 !important;	
}

.wpcf7-not-valid-tip {
	
	border:none !important;
	background:#FFCB07 !important;
	color:#fff !important;
	font-weight:bold !important;
	padding:2px 6px!important;
	width:auto !important;
	position:relative;
}

.wpcf7-not-valid-tip:before {
	content: "";
	width: 0; 
	height: 0; 
	border-top: 5px solid transparent;
	border-bottom: 5px solid transparent; 
	
	border-right:10px solid #FFCB07;
	position:absolute;
	z-index:1000;
	top:6px;
	left:-8px; 
}

div.wpcf7-mail-sent-ok {
border: none !important;
}

.wpcf7 input[type="submit"] {
	width:100px;
}

.responsiveSelectContainer select.responsiveMenuSelect, select.responsiveMenuSelect {
	width:41px !important;
	height:33px !important;
	-webkit-appearance: menulist-button !important;
	position:absolute;
	right:0;
	top:33px;
	-ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
	filter: alpha(opacity=0);
	opacity: 0;
	z-index:200;
}

.menuback {
	width:41px !important;
	height:33px !important;
	background:url(images/menu.png) no-repeat;
	position:absolute;
	right:0;
	top:33px;
	z-index:100;
	display:none;
}

#swipebox-caption {
padding-top:55px !important;
line-height: 17px !important;
}

.faq {
	margin-bottom:35px;
}

.answer {
	font-style:italic;
	font-size:12px;
}

.question, .answer {
	max-width:710px;
	margin:0 auto;
}



.question {
	font-weight:700;
	font-size:15px;
	margin-bottom:13px;
}


@media print {

.do-not-print { display: none; }
#comments { page-break-before: always; }

body { width: 100% !important; margin: 0 !important; padding: 0 !important; line-height: 1.4; word-spacing: 1.1pt; letter-spacing: 0.2pt; font-family: Garamond,"Times New Roman", serif; color: #000; background: none; font-size: 12pt; }
h1,h2,h3,h4,h5,h6 { font-family: Helvetica, Arial, sans-serif; }
h1 { font-size: 19pt; }
h2 { font-size:17pt; }
h3 { font-size:15pt; }
h4,h5,h6 { font-size:12pt; }
code { font: 10pt Courier, monospace; } 
blockquote { margin: 1.3em; padding: 1em; }
img { display: block; margin: 1em 0; }
a img { border: none; }
table { margin: 1px; text-align:left; }
th { border-bottom: 1px solid #333;  font-weight: bold; }
td { border-bottom: 1px solid #333; }
th, td { padding: 4px 10px 4px 0; }
caption { background: #fff; margin-bottom: 2em; text-align: left; }
thead { display: table-header-group; }
tr { page-break-inside: avoid; } 
a { text-decoration: none; color: black; }
	
} /* END print media */