@import url(http://fonts.googleapis.com/css?family=Rajdhani:400,600&subset=latin,latin-ext);
@font-face {
    font-family: 'rajdhaniregular';
    src: url('../fonts/rajdhani-regular-webfont.eot');
    src: url('../fonts/rajdhani-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/rajdhani-regular-webfont.woff2') format('woff2'),
         url('../fonts/rajdhani-regular-webfont.woff') format('woff'),
         url('../fonts/rajdhani-regular-webfont.ttf') format('truetype'),
         url('../fonts/rajdhani-regular-webfont.svg#rajdhaniregular') format('svg');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'rajdhanibold';
    src: url('../fonts/rajdhani-bold-webfont.eot');
    src: url('../fonts/rajdhani-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/rajdhani-bold-webfont.woff2') format('woff2'),
         url('../fonts/rajdhani-bold-webfont.woff') format('woff'),
         url('../fonts/rajdhani-bold-webfont.ttf') format('truetype'),
         url('../fonts/rajdhani-bold-webfont.svg#rajdhanibold') format('svg');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'rajdhanilight';
    src: url('../fonts/rajdhani-light-webfont.eot');
    src: url('../fonts/rajdhani-light-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/rajdhani-light-webfont.woff2') format('woff2'),
         url('../fonts/rajdhani-light-webfont.woff') format('woff'),
         url('../fonts/rajdhani-light-webfont.ttf') format('truetype'),
         url('../fonts/rajdhani-light-webfont.svg#rajdhanilight') format('svg');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'rajdhanimedium';
    src: url('../fonts/rajdhani-medium-webfont.eot');
    src: url('../fonts/rajdhani-medium-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/rajdhani-medium-webfont.woff2') format('woff2'),
         url('../fonts/rajdhani-medium-webfont.woff') format('woff'),
         url('../fonts/rajdhani-medium-webfont.ttf') format('truetype'),
         url('../fonts/rajdhani-medium-webfont.svg#rajdhanimedium') format('svg');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'rajdhaniregular';
    src: url('../fonts/rajdhani-semibold-webfont.eot');
    src: url('../fonts/rajdhani-semibold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/rajdhani-semibold-webfont.woff2') format('woff2'),
         url('../fonts/rajdhani-semibold-webfont.woff') format('woff'),
         url('../fonts/rajdhani-semibold-webfont.ttf') format('truetype'),
         url('../fonts/rajdhani-semibold-webfont.svg#rajdhanisemibold') format('svg');
    font-weight: bold;
    font-style: normal;

}

/* =============================================================================
	 HTML5 display definitions
	 ========================================================================== */

article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }
audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
audio:not([controls]) { display: none; }
[hidden] { display: none; }

/* =============================================================================
	 Base
	 ========================================================================== */

html { font-size: 100%; overflow-y: scroll; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
body { margin: 0; font-size: 14px; line-height: 24px; font-family: 'Rajdhani', sans-serif; }
body, button, input, select, textarea { font-family: 'Rajdhani', sans-serif; color: #232323; }

::-moz-selection { background: #3299CC; color: #fff; text-shadow: none; }
::selection { background: #3299CC; color: #fff; text-shadow: none; }


/* =============================================================================
	 Links
	 ========================================================================== */

a { color: #3299CC; text-decoration: underline; }
a:visited { color: #3299CC; }
a:hover { color: #232323; text-decoration: none; }
a:focus { outline: thin dotted; }
a:hover, a:active { outline: 0; }


/* =============================================================================
	 Typography
	 ========================================================================== */

abbr[title] { border-bottom: 1px dotted; }
b, strong { font-weight: bold; }
blockquote { position: relative; margin:45px 30px 40px; font-family: 'Rajdhani', sans-serif; font-style:italic;}
blockquote p {text-indent:50px;}
blockquote p:before{position:absolute; top:10px; left:-50px; content: '\201C'; font-family: 'Rajdhani', sans-serif; font-size: 100px; font-style: normal;}
dfn { font-style: italic; }
hr { display: block; height: 1px; border: 0; border-top: 1px solid #dee0e0; margin: 0; padding: 0; }
ins { background: #ff9; color: #000; text-decoration: none; }
mark { background: #ff0; color: #000; font-style: italic; font-weight: bold; }
pre, code, kbd, samp { font-family: monospace, monospace; _font-family: 'courier new', monospace; font-size: 1em; }
pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; }
q { quotes: none; }
q:before, q:after { content: ""; content: none; }
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }


/* =============================================================================
	 Lists
	 ========================================================================== */

ul, ol, dd, nav ul, nav ol { margin:0; padding:0; list-style: none; list-style-image: none; }
.list li:before {
    content: "• ";
    color: #7E7E7E;
	font-size : 17px;
	font-family: 'rajdhaniregular', sans-serif;
}


/* =============================================================================
	 Embedded content
	 ========================================================================== */

img { border: 0; -ms-interpolation-mode: bicubic; vertical-align: middle; }
svg:not(:root) { overflow: hidden; }


/* =============================================================================
	 Figures
	 ========================================================================== */

figure { margin: 0; }


/* =============================================================================
	 Forms
	 ========================================================================== */

form { margin: 0; }
fieldset { border: 0; margin: 0; padding: 0; }
label { cursor: pointer; }
legend { border: 0; *margin-left: -7px; padding: 0; }
button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: middle; *vertical-align: middle; }
button, input { line-height: normal; *overflow: visible; }
table button, table input { *overflow: auto; }
button, input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; -webkit-appearance: button; }
input[type="checkbox"], input[type="radio"] { box-sizing: border-box; }
input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }
input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }
textarea { overflow: auto; vertical-align: top; resize: vertical; }
input:valid, textarea:valid { }
input:invalid, textarea:invalid { }

label {display:block; margin-top:12px; margin-bottom:4px; width:100%;}
input, textarea {display:block; padding:4px; width:100%; height:30px; background-color:#ffffff;
  border: 1px solid #cccccc;
  -webkit-border-radius: 3px;
	 -moz-border-radius: 3px;
		  border-radius: 3px;}
textarea {height:120px;}
input,
textarea {
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
	 -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
		  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  -webkit-transition: border linear 0.2s, box-shadow linear 0.2s;
	 -moz-transition: border linear 0.2s, box-shadow linear 0.2s;
	  -ms-transition: border linear 0.2s, box-shadow linear 0.2s;
	   -o-transition: border linear 0.2s, box-shadow linear 0.2s;
		  transition: border linear 0.2s, box-shadow linear 0.2s;}
input:focus,
textarea:focus {
  border-color: rgba(13, 184, 175, 0.8);
  outline: 0;
  outline: thin dotted \9;
  /* IE6-9 */
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(13, 184, 175, 0.6);
	 -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(13, 184, 175, 0.6);
		  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(13, 184, 175, 0.6);}

label.error {
	display: inline-block;
	margin:0;
	padding: 2px 24px;
	background: url(../img/error.png) center left no-repeat;
	font-size:12px;
    font-weight: normal;
    color: red;}
label.valid {
	display: inline-block;
	margin:0;
	padding: 2px 24px;
	background: url(../img/valid.png) center left no-repeat;
	font-size:12px;
    font-weight: normal;
    color: green;}

button.btn {margin: 45px auto 0; padding:1px 0 0 2px; background:#fff;}

/* =============================================================================
	 Tables
	 ========================================================================== */

table {margin-bottom:14px; width:100%; border-collapse:collapse; border-spacing:0;
-webkit-border-radius: 4px;
     -moz-border-radius: 4px;
          border-radius: 4px;}
th {background:#fff; font-weight:bold;}
tr:nth-of-type(odd) {background:#f9f9f9;}
td {vertical-align: top;}
td, th {padding:8px; border:1px solid #dddddd; text-align:left;}

.cc-cookies {width:100% !important;}


/* =============================================================================
	 apply a natural box layout model to all elements
	 ========================================================================== */

*, *:before, *:after {
	-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
 }


/* =============================================================================
	 Structure
	 ========================================================================== */

body {position:relative; min-width:1200px; background:#f9fbfb;} /* #f7f7f7 */

header .container {position:relative;}
.pinned #lang {display:none;}
#lang {
	position: absolute;
	right: 0px;
	top: 0px;
	/*background-color: #fff;*/
	display: table-row;
	padding: 5px;
}
#lang a {
    background-repeat: no-repeat;
    text-decoration: none;
    color: #fff;
    vertical-align: middle;
    display: table-cell;
    padding: 10px;
    font-size: 16px;
    line-height: 17px;
    font-weight: bold;
}
/*#lang .tr {
	background-image: url('../img/tr.png');
}
#lang .en {
	background-image: url('../img/en.png');
}
#lang .ru {
	background-image: url('../img/ru.png');
}*/
.fleft {
	float: left;
}
.fullwidthbanner-container + hr {
	display: block;
	height: 1px;
	border: 0;
	border-top: 3px solid #323232;
	margin: 0;
	padding: 0;
}
.fullwidth {position:relative; width:100%;}
.container {margin-left:auto; margin-right:auto; width:1200px;}
.container.home {}
.grid {display:inline; float:left; margin-left:10px; margin-right:10px;}
html body div.clear,
html body span.clear {display:block; float:none; clear:both;margin:0; padding:0; width:0; height:0; background:none; border:0; font-size:0; overflow:hidden; visibility:hidden;}

.span1, .span2, .span3, .span4, .span5, .span6, .span7, .span8, .span9, .span10, .span11, .span12 {position:relative; display:inline; float:left; margin-left:10px; margin-right:10px;}
.span1 {width: 80px;}
.span2 {width: 180px;}
.span3 {width: 280px;}
.span4 {width: 380px;}
.span5 {width: 480px;}
.span6 {width: 580px;}
.span7 {width: 680px;}
.span8 {width: 780px;}
.span9 {width: 880px;}
.span10 {width: 980px;}
.span11 {width: 1080px;}
.span12 {width: 1180px;}
.prefix1 {margin-left: 110px;}
.prefix2 {margin-left: 210px;}
.prefix3 {margin-left: 310px;}
.prefix4 {margin-left: 410px;}
.prefix5 {margin-left: 510px;}
.prefix6 {margin-left: 610px;}
.prefix7 {margin-left: 710px;}
.prefix8 {margin-left: 810px;}
.prefix9 {margin-left: 910px;}
.prefix10 {margin-left: 1010px;}
.prefix11 {margin-left: 1110px;}
.suffix1 {margin-right: 110px;}
.suffix2 {margin-right: 210px;}
.suffix3 {margin-right: 310px;}
.suffix4 {margin-right: 410px;}
.suffix5 {margin-right: 510px;}
.suffix6 {margin-right: 610px;}
.suffix7 {margin-right: 710px;}
.suffix8 {margin-right: 810px;}
.suffix9 {margin-right: 910px;}
.suffix10 {margin-right: 1010px;}
.suffix11 {margin-right: 1110px;}

.visible-desktop { display: block !important; visibility: visible; } /* visible on desktop only */
.visible-tablet { display: none !important; visibility: hidden; } /* visible on tablet only */
.visible-mobile { display: none !important; visibility: hidden; } /* visible on mobile only */

.hidden-desktop { display: none !important; visibility: hidden; } /* hidden on desktop only */
.hidden-tablet { display: block !important; visibility: visible; } /* hidden on tablet only */
.hidden-mobile { display: block !important; visibility: visible; } /* hidden on mobile only */

/* =============================================================================
	 Typography
	 ========================================================================== */

h1, h2, h3, h4, h5, h6 {margin: 0; padding:0; font-family: 'Rajdhani', sans-serif; font-weight:normal; color:inherit; text-transform:uppercase; /*text-rendering:optimizelegibility;*/ color: #7E7E7E;}
h1 small, h2 small, h3 small, h4 small, h5 small, h6 small {font-weight:normal; color: #999999;}
strong { color: #7E7E7E; }

h1 {font-size: 22px; line-height: 32px;}
h2 {font-size: 18px; line-height: 28px;}
h3 {font-size: 14px; line-height: 24px;}
h4 {font-size: 13px; line-height: 21px;}
h5 {font-size: 12px; line-height: 18px;}
h6 {font-size: 11px; line-height: 15px;}

p {margin: 0 0 14px; font-family:inherit; font-size:14px; font-weight:300; line-height:24px;}
small {font-size: 11px;}
span {color:#3299CC;}

.btn {position:relative; display:block; margin:45px auto 0; padding-top:10px; padding-left:2px; width:210px; height:46px; border:2px solid #232323; text-align:center; font-family: 'Rajdhani', sans-serif; font-size:14px; font-weight:700;  color:#232323; text-transform:uppercase; text-decoration:none; letter-spacing:2px;
-webkit-border-radius: 6px;
-moz-border-radius: 6px;
border-radius: 6px;
-webkit-transition: background 0.5s linear;
-moz-transition: background 0.5s linear;
-ms-transition: background 0.5s linear;
-o-transition: background 0.5s linear;
transition: background 0.5s linear;}
.btn:hover {background-color:#3299CC; border-color:#3299CC; color:#fff;}
.btn-small {margin:16px auto 0; padding-top:8px; width:120px; height:30px; font-size:12px; line-height:12px;}

.btn-green {border-color:#3299CC; color:#3299CC;}
.btn-green:hover {background-color:#3299CC; color:#fff;}

.btn-quiet {margin:14px auto 0 !important; padding-top:5px; padding-left:0; width:200px; height:36px; border-width:1px; font-size:12px; font-weight:300; text-transform:none; letter-spacing:0;}

/* =============================================================================
	 Masthead
	 ========================================================================== */

.masthead, .masthead-small {width:100%; height:280px; z-index:1; /*position:relative;*/}
.masthead-small {height:370px;}
.masthead-image {
	background-image: url(../img/head-image.jpg); background-position: center center;

	/* lt ie8 */
	-ms-background-position-x: center;
	-ms-background-position-y: center;
	background-position: center center;

	/* scale bg image proportionately */
	background-size: cover;
	-ms-behavior: url(../../backgroundsize.min.htc);
	/* prevent scaling past src width (or not) */
	/* max-width: 1200px; */
}

.masthead-content, .masthead-content-small {position:absolute; top:140px; left:0; width:100%; height:230px; text-align:center; z-index:3;}
.masthead-content h1, .masthead-content-small h1 {margin:90px auto 0; font-family: 'Rajdhani', sans-serif; font-size:48px; line-height:48px; font-weight:900; color:#fff;}
.masthead-content-small h1 {margin:36px auto 0;}
.masthead-content p, .masthead-content-small p {margin:25px auto 0; font-family: 'Rajdhani', sans-serif; color:#fff; font-size:20px; line-height:20px; font-weight:300; text-transform: none;}
.masthead-content a.btn {margin:65px auto 0; background-color:transparent; border-color:#fff; color:#fff;}
.masthead-content a.btn:hover {background-color:#3299CC; border-color:#3299CC; color:#fff;}

.masthead-content-small p.h1 {margin:36px auto 0; font-family: 'Rajdhani', sans-serif; font-size:48px; line-height:48px; font-weight:900; color:#fff; text-transform:uppercase;}

/* =============================================================================
	 Header
	 ========================================================================== */

header {position:relative; background:transparent; z-index:2;}

@-webkit-keyframes fadeInDown {
	0% {opacity:0;-webkit-transform:translateY(-20px);}
	100% {opacity:1;-webkit-transform:translateY(0);}
	}
@-moz-keyframes fadeInDown {
	0% {opacity:0;-moz-transform:translateY(-20px);}
	100% {opacity:1;-moz-transform:translateY(0);}
	}
@-o-keyframes fadeInDown {
	0% {opacity:0;-o-transform:translateY(-20px);}
	100% {opacity:1;-o-transform:translateY(0);}
	}
@keyframes fadeInDown {
	0% {opacity:0;transform:translateY(-20px);}
	100% {opacity:1;transform:translateY(0);}
	}

.banner {height:120px; background: #323232;}
.banner.pinned {position:fixed; top:0; width: 100%; height:64px; z-index:999;
	background:rgb(0,0,0);
	background: transparent\9;
	background:rgba(0,0,0,0.8);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#cc000000,endColorstr=#cc000000);
	zoom: 1;
	-webkit-animation-name: fadeInDown;
	-moz-animation-name: fadeInDown;
	-o-animation-name: fadeInDown;
	animation-name: fadeInDown;
	-webkit-animation-duration: 750ms;
	-moz-animation-duration: 750ms;
	-o-animation-duration: 750ms;
	animation-duration: 750ms;
	-webkit-animation-fill-mode: both;
	-moz-animation-fill-mode: both;
	-o-animation-fill-mode: both;
	animation-fill-mode: both;
}
.banner.pinned:nth-child(n) {filter:none;}
.logo {float:left;margin:20px 10px 0;width: 194px;height:66px;background-size: 194px 66px;background-image: url(../img/logo_gucum_beyaz.png);}
.banner.pinned .logo {display:none;}

/* =============================================================================
	 Main Nav
	 ========================================================================== */

nav#nav select { display:none; }

nav#nav {float:right; margin:62px 10px 0; font-family: 'rajdhaniregular', sans-serif;}
nav#nav ul {font-size:0;}
nav#nav ul li {display:inline-table; margin-right:30px; position:relative;padding-bottom: 16px;}
nav#nav ul li.hasChilds {padding-bottom: 16px;}
nav#nav ul li.hasChilds > a{cursor:default;}
nav#nav ul li.hasChilds:hover {background-image: url('../img/arrow-down.png'); background-repeat: no-repeat; background-position-x: center; background-position-y: 25px;}
nav#nav ul li ul {display: none; background-color: #323232; margin: 29px 0px 0px -10px; position: absolute; top: 15px; left: 0px; padding: 0px 10px 5px 10px; transition: all 1s ease;}
.pinned nav#nav ul li ul {background-color: rgba(0,0,0,0.8);}
nav#nav ul li:hover ul {display: inline-table; }
nav#nav ul li.hasChilds:hover a {border-top: 1px solid #6E6E6E;}
nav#nav ul li:last-child {margin-right:0;}
nav#nav ul li a {padding:10px 0; color:#CACACA; font-size:14px; text-transform:uppercase; text-decoration:none;
	-webkit-transition: all 150ms linear;
	-moz-transition: all 150ms linear;
	-o-transition: all 150ms linear;
	transition: all 150ms linear;
	border-bottom: 4px solid transparent;}
nav#nav ul li a:hover {border-top: 1px solid #6E6E6E;}
nav#nav ul li ul li { margin-right: 0px;padding-bottom:0px;}
nav#nav ul li ul li a {padding-top: 5px; padding-bottom: 5px; padding-left: 5px; line-height: 0px; border-bottom: none; border-top: none !important; white-space: nowrap;}
nav#nav ul li ul li a:hover {border-left: 1px solid #6E6E6E; border-top: none;}
nav#nav ul li.current-menu-item a {border-top: 1px solid #6E6E6E;}
nav#nav ul li.current-page-ancestor a {border-top: 1px solid #6E6E6E;}

.banner.pinned nav#nav {margin-top:20px;}
.banner.pinned nav#nav ul li a:hover {border-top: 1px solid #6E6E6E;}
.banner.pinned nav#nav ul li ul li a:hover {border-top: none;}
.banner.pinned nav#nav ul li.current-menu-item a {border-top: 1px solid #6E6E6E;}
.banner.pinned nav#nav ul li.current-page-ancestor a {border-top: 1px solid #6E6E6E;}

.product-pinned section {
	height: 1px;
}

.product-pinned section article {
	position: fixed !important;
	top: 80px;
	width: 380px;
	height: auto;
}

/* =============================================================================
	 Back to Top
	 ========================================================================== */

.banner .back-to-top {display:none;}
.banner.pinned .back-to-top {display:block;}
.back-to-top {float:left; margin:19px 10px 0; width:26px; height:26px; background-size:26px 26px; background-image:url(../img/backtotop.png);}

/* =============================================================================
	 Search
	 ========================================================================== */

#searchform {float:right; margin-top:20px;}
#searchform label {padding-right:5px; font-size: 12px;}
#s {}
#searchsubmit {}
.header-search {width:120px; font-size: 12px;}

/* =============================================================================
	 Main
	 ========================================================================== */

section {padding:52px 0 60px; text-align:center;}
section h2 {padding-left:5px; letter-spacing:2px;}
section p {margin-bottom:50px; font-family: 'Rajdhani', sans-serif; font-weight:300;}
section p.blockquote {position:relative; margin-bottom:16px; font-family:Rockwell, "Courier Bold", Courier, Georgia, Times, "Times New Roman", serif; font-size:16px; font-style:italic;}
section p.blockquote span {position:relative; top:20px; margin-right:5px; font-family: Georgia, Times, "Times New Roman", serif; font-size:56px; color:#232323; font-style:normal;}
section#about p {margin-bottom:16px;}
section#about img {margin-top:14px; margin-bottom:14px;
border-radius: 50%;
-moz-border-radius: 50%;
-webkit-border-radius: 50%;}
section article {margin-bottom:20px; padding:20px; background:#fff; border:1px solid #dee0e0;}
section#about article {margin-bottom:0; padding:0; background:transparent; border:0;}
section article h3 {margin-bottom:8px;}
section article p {margin-bottom:0; font-family:inherit; font-weight:300;}
section article img {margin-bottom:14px;}

#services a.brand, #servicelist a.brand {margin:0 auto 14px; width:80px; height:80px; background-size:80px 80px; background-image:url(../img/icon-lightbulb.png);}
#services a.web, #servicelist a.web {margin:0 auto 14px; width:80px; height:80px; background-size:80px 80px; background-image:url(../img/icon-web.png);}
#services a.search, #servicelist a.search {margin:0 auto 14px; width:80px; height:80px; background-size:80px 80px; background-image:url(../img/icon-graph.png);}
#services a.marketing, #servicelist a.marketing {margin:0 auto 14px; width:80px; height:80px; background-size:80px 80px; background-image:url(../img/icon-marketing.png);}

#servicelist article {margin-bottom:20px;}
#servicelist ul {font-size:0;}
#servicelist ul li {display:inline-block; margin-right:14px;}
#servicelist ul li:nth-child(even) {margin-right:0;}

#portfolio ul {width:100%; font-size:0;}
#portfolio ul li {position:relative; display:inline-block; margin:0 10px 20px; width:380px; height:253px;}
#portfolio ul li img {width:100%; height:auto; z-index:4;
	-webkit-box-shadow: 0px 7px 5px -6px rgba(50, 50, 50, 0.5);
	-moz-box-shadow:    0px 7px 5px -6px rgba(50, 50, 50, 0.5);
	box-shadow:         0px 7px 5px -6px rgba(50, 50, 50, 0.5);}
#portfolio ul li .overlay {display: block; position:absolute; top:0; left:0; width:100%; height:100%; padding:0; color:#fff; text-align:center;
	background:rgb(0,0,0);
	background: transparent\9;
	background:rgba(0,0,0,0.8);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#b2000000,endColorstr=#b2000000);
	zoom: 1;
	opacity:0;
	transition: opacity 0.75s ease 0s;}
#portfolio ul li .overlay:nth-child(n) {filter:none;}
#portfolio ul li:hover .overlay {opacity: 1;}
#portfolio ul li .overlay h3 {border:0; clip:rect(0 0 0 0); height:1px; margin:-1px; overflow:hidden; padding:0; position:absolute; width:1px;}
#portfolio ul li .overlay p.last {border:0; clip:rect(0 0 0 0); height:1px; margin:-1px; overflow:hidden; padding:0; position:absolute; width:1px;}
#portfolio ul li .overlay p.view {position:absolute; left:50%; top:50%; margin-top:-20px; margin-left:-40px; width:80px; padding:6px 0; padding-left:5px; border-top:4px solid #3299CC; border-bottom:4px solid #3299CC; font-family: 'Rajdhani', sans-serif; font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:5px;}

/* Loaded / Done */
.btn.done{cursor:default; opacity:0.2; filter:alpha(opacity=20); }
.btn.loading:before {position:absolute; display:inline-block; left:5px; top:8px; width:30px; height:30px; background: transparent url(../img/ajax-loader.gif) no-repeat center center; content: ''; overflow: hidden; z-index: 100;
	-webkit-transition: width 0.5s ease-in-out;
	-moz-transition: width 0.5s ease-in-out;
	transition: width 0.5s ease-in-out;}
.load-more-btn-wrap{display:block; padding:0; text-align:center; overflow:hidden;}

#latestnews article {padding:0;}
#latestnews article h2 {margin-bottom:8px; padding:0; font-size:14px; line-height:24px; letter-spacing:0;}
#latestnews ol {width:100%; font-size:0;}
#latestnews ol li {}
#latestnews ol li article .latestnews_image img {margin-bottom:0; width:100%; height:auto;}
#latestnews ol li article .latestnews_content {padding:16px 20px 24px;}
#latestnews ol li article .btn-small {margin-top:16px;}

#services a.btn, #servicelist a.btn, #portfolio a.btn, #latestnews a.btn {margin:25px auto 0;}

/* =============================================================================
	 Article Pages
	 ========================================================================== */

#article article {position:relative; padding:50px 50px; text-align:left;}
#article article .featured-image {margin:-50px -50px 20px; width:auto;}
#article article .featured-image img {width:100%; height:auto;}
#article article h1, #article article h2, #article article h3, #article article h4, #article article h5, #article article h6 {margin:26px 0 16px; padding:0; font-size:14px; color:#3299CC; letter-spacing:3px;}
#article article h1 {margin:0; font-size:24px; color:#7E7E7E;}
#article article p {margin-bottom:15px;}
#article article ul, #article article ol {margin-bottom:20px; margin-left:15px;}
#article article ul li, #article article ol li {margin-bottom:8px; ist-style:disc; list-style-position:outsite; font-weight:300; line-height:24px;}
#article article ol li {list-style:decimal;}
#article article hr {margin:16px 0 20px;}
#article article .video-container {position:relative; margin:0 auto 14px; padding-bottom: 56.25%; padding-top:30px; height:0; overflow: hidden;}
#article article .video-container iframe,
#article article .video-container object,
#article article .video-container embed {position:absolute; top:0; left:0; width:100%; height:100%;}
#article article #author {margin-bottom:16px;}
#article article #author p {padding-top:8px; line-height:20px;}
#article article #author img.avatar {float:left; margin-right:10px;
border-radius: 50%;
-moz-border-radius: 50%;
-webkit-border-radius: 50%;
}

#article article ul.wpsocialite {margin:14px 0 0 !important;}
#article article ul.wpsocialite li {padding-bottom:0 !important;}
#article article ul.wpsocialite li:first-child {padding-left:0 !important;}

#portfolio-container {padding:58px 0 60px;}
#portfolio-primary-image {position:relative; margin-bottom:20px; border:1px solid #dee0e0;}
#portfolio-primary-image img {width:100% !important; height:auto;}
#portfolio-article {padding:0;}
#portfolio-article article {position:relative; padding:50px; text-align:left;}
#portfolio-article article img {width:100% !important; height:auto;}
#portfolio-article article hr {margin:20px 0;}

#map_canvas {height:500px;}

/* =============================================================================
	 Aside
	 ========================================================================== */

aside {padding:52px 0 60px;}
aside .panel {margin-bottom:20px; padding:20px; background:#fff; border:1px solid #dee0e0;}
aside .panel h3 {margin-bottom:18px; letter-spacing:3px;}
aside .panel h4 {margin-bottom:18px; letter-spacing:1px;}
aside .panel ol li {margin-bottom:20px; padding-bottom:20px; border-bottom:1px solid #dee0e0;}
aside .panel ol li:first-child {padding-top:20px; border-top:1px solid #dee0e0;}
aside .panel ol li:last-child {margin-bottom:0; padding-bottom:0; border-bottom:0;}
aside .panel ol li .recentpost_image {float:left; margin-right:10px;}
aside .panel ol li .recentpost_content {padding-top:9px;}
aside .panel ol li .recentpost_content h4 {font-size:12px; line-height:18px;}
aside .panel ol li .recentpost_content h4 a {color:#232323; text-decoration:none;}
aside .panel ol li .recentpost_content h4 a:hover {color:#3299CC;}

aside .panel input, aside .panel textarea, aside .panel select {
	background: none repeat scroll 0 0 #FFFFFF;
	border: 1px solid #B2B2B2;
	margin: 0 0 12px;
	padding: 8px;
}
aside .panel button, aside .panel input, aside .panel textarea, aside .panel select {
	margin: 0;
	width: 100%;
	font-size: 100%;
	vertical-align: middle;
}

aside .menu-services-navigation-container {width:100%; background:#fff; border-top:1px solid #dee0e0; border-bottom:1px solid #dee0e0;}
aside .menu-services-navigation-container ul {width:100%;}
aside .menu-services-navigation-container ul li {position:relative; border:1px solid #dee0e0; border-top:0;}
aside .menu-services-navigation-container ul li:last-child {border-bottom:0;}
aside .menu-services-navigation-container ul li ul {border-top:1px solid #dee0e0;}
aside .menu-services-navigation-container ul li ul li {border-left:0; border-right:0;}
aside .menu-services-navigation-container ul li ul li.current-menu-item {}
aside .menu-services-navigation-container ul li ul li.current-menu-item a {color:#3299CC;}
aside .menu-services-navigation-container ul li a {display:block; padding:10px 0 8px 18px; font-family: 'Rajdhani', sans-serif; font-size:13px; color:#232323; line-height:14px; font-weight:700; text-decoration:none; text-transform:uppercase;}
aside .menu-services-navigation-container ul li a:hover {color:#3299CC;}
aside .menu-services-navigation-container ul li a:before {position:absolute; top:9px; left:5px; width:8px; height:8px; content: url(../img/arrow-right.png);}
aside .menu-services-navigation-container ul li a.active {background:#f9fbfb;}
aside .menu-services-navigation-container ul li a.active:before {position:absolute; top:9px; left:5px; width:8px; height:8px; content: url(../img/arrow-down.png);}
aside .menu-services-navigation-container ul li ul li a {padding:10px; padding-left:24px; border:0; font-size:13px; line-height:12px; font-weight:    00; text-transform:none;}
aside .menu-services-navigation-container ul li ul li a.active {background:#fff;}
aside .menu-services-navigation-container ul li ul li a:before {content:none;}
aside .menu-services-navigation-container ul li ul li a.active:before {content:none;}

aside#portfolio-aside {padding:0;}
aside#portfolio-aside h1 {font-size: 14px; line-height: 24px;}
aside#portfolio-aside hr {margin-bottom:18px;}
aside#portfolio-aside p {margin-bottom:13px; font-size:13px;}
aside#portfolio-aside ul {/*font-size:0;*/}
aside#portfolio-aside ul li {/*display:inline-block; margin-right:8px; width:40px; height:40px;*/}
aside#portfolio-aside ul li:last-child {margin-right:0;}
aside#portfolio-aside ul li a {width:40px; height:40px; background-size:40px 40px; background-position:0 0; background-repeat: no-repeat;}
aside#portfolio-aside ul li a.branding {background-image:url(../img/icon-lightbulb-small.png);}
aside#portfolio-aside ul li a.design {background-image:url(../img/icon-brush-small.png);}
aside#portfolio-aside ul li a.web {background-image:url(../img/icon-web-small.png);}
aside#portfolio-aside ul li a.seo {background-image:url(../img/icon-graph-small.png);}
aside#portfolio-aside ul li a.marketing {background-image:url(../img/icon-marketing-small.png);}

aside #address {text-align:center;}
aside #address span {color:#232323;}
aside #address .logo-vertical {margin: 0 auto 20px;width: 194px;height: 66px;background-size: 194px 66px;background-image: url(../img/logo_gucum_siyah.png);}

aside ul.social {position:relative; float:none; display:block; top:0; font-size:0;}
aside ul.social li {display:inline-block; margin-right:5px;}
aside ul.social li:last-child {margin-right:0;}

/* =============================================================================
	 Footer
	 ========================================================================== */

#footer {background:#4d4d4d;}
#footer .back-to-top {display:block; position:absolute; top:-40px; left:50%; margin:0 0 0 -40px; width:80px; height:80px; background-size:80px 80px; background-image:url(../img/footer-top-logo.png);}
#footer .back-to-top:hover {background-image:url(../img/footer-top-hover.png);}

footer {padding:80px 0; color:#fff;}
footer h3, footer h4 {font-family: 'Rajdhani', sans-serif; font-size:36px; line-height:36px; font-weight:900; color:#fff;}
footer h3 a {color:#fff;}
footer h4 {font-size:24px;}
footer p {font-family: 'Rajdhani', sans-serif; font-weight:100; font-size:20px; line-height:30px; color:#fff;}
footer p.small {color:#3299CC; font-size:16px;}
footer a {color:#3299CC; text-decoration:none;}
footer a:hover {color:#fff; text-decoration:underline;}
footer span {color:#fff;}

ul.social {position:absolute; top:80px; right:0; float:right; font-size:0;}
ul.social li {display:inline-block; margin-right:5px;}
ul.social li:last-child {margin-right:0;}
ul.social li a.facebook {width:40px; height:40px; background-size:40px 40px; background-image:url(../img/icon-facebook.png);}
ul.social li a.twitter {width:40px; height:40px; background-size:40px 40px; background-image:url(../img/icon-twitter.png);}
ul.social li a.linkedin {width:40px; height:40px; background-size:40px 40px; background-image:url(../img/icon-linkedin.png);}
ul.social li a.googleplus {width:40px; height:40px; background-size:40px 40px; background-image:url(../img/icon-googleplus.png);}
ul.social li a.skype {width:40px; height:40px; background-size:40px 40px; background-image:url(../img/icon-skype.png);}

nav#footernav {margin:40px 0 0; font-family: 'Rajdhani', sans-serif;}
nav#footernav > ul > li {float:left; margin-right:30px;}
nav#footernav > ul > li > a, nav#footernav > ul > li > a:visited {display:block; font-size:16px; color:#fff; font-weight:300;}
nav#footernav ul li ul li a {color:#3299CC;}

#footerbase {background:#323232;}
#footerbase footer {padding:25px 0; color:#fff;}
nav#corporatenav > ul > li {display:inline-block; margin-right:14px;}
nav#corporatenav > ul > li > a, nav#corporatenav > ul > li > a:visited {display:block; font-size:11px; color:#fff; font-weight:700; text-transform:uppercase;}

img.grayscale{
filter: grayscale(100%);
-webkit-filter: grayscale(100%); /* For Webkit browsers */
filter: gray; /* For IE 6 - 9 */
-webkit-transition: all .6s ease; /* Fade to color for Chrome and Safari */
filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 10+, Firefox on Android */
}

img.grayscale:hover{
filter: grayscale(0%);
-webkit-filter: grayscale(0%);
filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'1 0 0 0 0, 0 1 0 0 0, 0 0 1 0 0, 0 0 0 1 0\'/></filter></svg>#grayscale");
}

#footerbase footer {
	position: relative;
	display: inline;
	float: left;
	margin-left: 10px;
	margin-right: 10px;
}

#footerbase a {
	text-decoration: none;
	color: #fff;
    line-height: 22px;
}

#footerbase strong {
	color: #fff;
}

#footerbase .footer1 {
	width: 330px;
}

#footerbase .footer2 {
	width: 480px;
	text-align: center;
}

#footerbase .footer3 {
	width: 330px;
	line-height: 75px;
	text-align: right;
}

#footerbase .footer4 {
	width: 200px;
	line-height: 48px;
}


/* =============================================================================
	 Wordpress Classes
	 ========================================================================== */

.alignnone {margin: 5px 20px 20px 0;}
.aligncenter, div.aligncenter {display: block; margin: 5px auto 5px auto;}
.alignright {float:right; margin: 5px 0 20px 20px;}
.alignleft {float: left; margin: 5px 20px 20px 0;}
.aligncenter {display: block; margin: 5px auto 5px auto;}
a img.alignright {float: right; margin: 5px 0 20px 20px;}
a img.alignnone {margin: 5px 20px 20px 0;}
a img.alignleft {float: left; margin: 5px 20px 20px 0;}
a img.aligncenter {display: block; margin-left: auto; margin-right: auto}
.wp-caption {padding: 5px 3px 10px; max-width: 96%; background: #fff; border: 1px solid #f0f0f0; text-align: center;}
.wp-caption.alignnone {margin: 5px 20px 20px 0;}
.wp-caption.alignleft {margin: 5px 20px 20px 0;}
.wp-caption.alignright {margin: 5px 0 20px 20px;}
.wp-caption img {margin: 0; padding: 0; width: auto; height: auto; max-width: 98.5%; border: 0 none;}
.wp-caption p.wp-caption-text {margin: 0; padding: 0 4px 5px; font-size: 11px; line-height: 17px;}


/* ==|== media queries ======================================================
	 PLACEHOLDER Media Queries for Responsive Design.
	 ========================================================================== */

/* #Tablet (Portrait) - Design for a width of 960px
================================================== */

@media only screen and (min-width: 960px) and (max-width: 1279px) {

.product-pinned section article {width: 300px;}
body {min-width:960px;}
.container {width:960px;}
.span1, .span2, .span3, .span4, .span5, .span6, .span7, .span8, .span9, .span10, .span11, .span12 {display:inline; float:left; margin-left:10px; margin-right:10px;}
.span1 {width: 60px;}
.span2 {width: 140px;}
.span3 {width: 220px;}
.span4 {width: 300px;}
.span5 {width: 380px;}
.span6 {width: 460px;}
.span7 {width: 540px;}
.span8 {width: 620px;}
.span9 {width: 700px;}
.span10 {width: 780px;}
.span11 {width: 860px;}
.span12 {width: 940px;}
.prefix1 {margin-left: 90px;}
.prefix2 {margin-left: 170px;}
.prefix3 {margin-left: 250px;}
.prefix4 {margin-left: 330px;}
.prefix5 {margin-left: 410px;}
.prefix6 {margin-left: 490px;}
.prefix7 {margin-left: 570px;}
.prefix8 {margin-left: 650px;}
.prefix9 {margin-left: 730px;}
.prefix10 {margin-left: 810px;}
.prefix11 {margin-left: 890px;}
.suffix1 {margin-right: 90px;}
.suffix2 {margin-right: 170px;}
.suffix3 {margin-right: 250px;}
.suffix4 {margin-right: 330px;}
.suffix5 {margin-right: 410px;}
.suffix6 {margin-right: 490px;}
.suffix7 {margin-right: 570px;}
.suffix8 {margin-right: 650px;}
.suffix9 {margin-right: 730px;}
.suffix10 {margin-right: 810px;}
.suffix11 {margin-right: 890px;}
nav#nav ul li a {font-size: 14px;}
nav#nav ul li {margin-right: 15px;}

.visible-desktop { display: block !important; visibility: visible; } /* visible on desktop only */
.visible-tablet { display: none !important; visibility: hidden; } /* visible on tablet only */
.visible-mobile { display: none !important; visibility: hidden; } /* visible on mobile only */

.hidden-desktop { display: none !important; visibility: hidden; } /* hidden on desktop only */
.hidden-tablet { display: block !important; visibility: visible; } /* hidden on tablet only */
.hidden-mobile { display: block !important; visibility: visible; } /* hidden on mobile only */

/* =============================================================================
	 Main
	 ========================================================================== */

#services .span3 {width:460px;}
#portfolio ul li {width:300px; height:200px;}

/* =============================================================================
	 Article Pages
	 ========================================================================== */

#article article {}
#article article img {width:100%; height:auto;}
#article article #author img.avatar {width:60px; height:60px;}
aside .recentposts ol li .recentpost_content {padding-top:0;}


#footerbase .footer1 {
	width: 290px;
	line-height: 75px;
}

#footerbase .footer2 {
	width: 180px;
}

#footerbase .footer3 {
	width: 190px;
}

#footerbase .footer4 {
	width: 200px;
	line-height: 75px;
}

#footerbase .footer1:after {
	content: '';
	border-right: 1px solid #6E6E6E;
	margin-left: 12px;
	height: 70px;
	position: absolute;
}

}


/* #Tablet (Portrait) - Design for a width of 768px
================================================== */

@media only screen and (min-width: 768px) and (max-width: 959px) {

/* =============================================================================
	 Table
	 ========================================================================== */
	.product-pinned section article {width: 236px;}
	td, th { font-size: 10px; line-height: 11px;}
	.cookies-policy table, .cookies-policy thead, .cookies-policy tbody, .cookies-policy th, .cookies-policy td, .cookies-policy tr {display:block;}
	.cookies-policy thead tr {position:absolute; top:-9999px; left:-9999px;}
	.cookies-policy tr {border:0 solid #dddddd;}
	.cookies-policy td {position:relative; padding-left:50%; border:1px solid #dddddd; border-width:1px 1px 0 1px;}
	.cookies-policy td:before {position:absolute; top:6px; left:6px; width:45%; padding-right:10px; white-space:nowrap;}

	/* Label the data */
	.cookies-policy td:nth-of-type(1):before { content: "Cookie name"; }
	.cookies-policy td:nth-of-type(2):before { content: "Cookie provider"; }
	.cookies-policy td:nth-of-type(3):before { content: "Expires after"; }
	.cookies-policy td:nth-of-type(4):before { content: "Cookie description"; }

/* =============================================================================
	 Structure
	 ========================================================================== */
	
body {min-width:768px;}
.container {width:768px;}
.container.home {/*padding-top:70px;*/}
.span1, .span2, .span3, .span4, .span5, .span6, .span7, .span8, .span9, .span10, .span11, .span12 {display:inline; float:left; margin-left:10px; margin-right:10px;}
.span1 {width: 44px;}
.span2 {width: 108px;}
.span3 {width: 172px;}
.span4 {width: 236px;}
.span5 {width: 300px;}
.span6 {width: 364px;}
.span7 {width: 428px;}
.span8 {width: 492px;}
.span9 {width: 556px;}
.span10 {width: 620px;}
.span11 {width: 684px;}
.span12 {width: 748px;}
.prefix1 {margin-left: 74px;}
.prefix2 {margin-left: 138px;}
.prefix3 {margin-left: 202px;}
.prefix4 {margin-left: 266px;}
.prefix5 {margin-left: 330px;}
.prefix6 {margin-left: 394px;}
.prefix7 {margin-left: 458px;}
.prefix8 {margin-left: 522px;}
.prefix9 {margin-left: 586px;}
.prefix10 {margin-left: 650px;}
.prefix11 {margin-left: 694px;}
.suffix1 {margin-right: 74px;}
.suffix2 {margin-right: 138px;}
.suffix3 {margin-right: 202px;}
.suffix4 {margin-right: 266px;}
.suffix5 {margin-right: 330px;}
.suffix6 {margin-right: 394px;}
.suffix7 {margin-right: 458px;}
.suffix8 {margin-right: 522px;}
.suffix9 {margin-right: 586px;}
.suffix10 {margin-right: 650px;}
.suffix11 {margin-right: 694px;}

.visible-desktop { display: none !important; visibility: hidden; } /* visible on desktop only */
.visible-tablet { display: block !important; visibility: visible;  } /* visible on tablet only */
.visible-mobile { display: none !important; visibility: hidden; } /* visible on mobile only */

.hidden-desktop { display: block !important; visibility: visible; } /* hidden on desktop only */
.hidden-tablet { display: none !important; visibility: hidden; } /* hidden on tablet only */
.hidden-mobile { display: block !important; visibility: visible; } /* hidden on mobile only */

/* =============================================================================
	 Masthead
	 ========================================================================== */

.masthead {height:440px;}
.masthead-content {height:300px;}
.masthead-content h1, .masthead-content-small h1 {margin:30px auto 0; font-size:40px; line-height:40px;}
.masthead-content p, .masthead-content-small p {margin:20px auto 0;}
.masthead-content a.btn {margin:45px auto 0;}

/* =============================================================================
	 Main
	 ========================================================================== */

#services .span3 {width:364px;}
#servicelist ul li {margin-right:0;}
#servicelist ul li a {width:324px;}
#portfolio ul li {width:236px; height:157px;}
.contact-us .span8 {width:100%;}
.contact-us section {margin-left:0; margin-right:0; padding-left:10px; padding-right:10px; padding-bottom:0;}
button.btn {margin:25px auto 0;}
.contact-us aside {width:100%; margin-left:0; margin-right:0; padding:0 10px;}
aside #address {display:block; /*float:left;*/ margin-left:0; margin-right:10px; /*width:462px;*/ text-align:center;}
aside #socialpane {display:inline; float:left; margin-left:10px; margin-right:0; width:266px;}

/* =============================================================================
	 Article Pages
	 ========================================================================== */

#article article {padding:30px 30px;}
#article article .featured-image {margin:-30px -30px 20px; width:auto;}
#article article img {width:100%; height:auto;}
#article article #author img.avatar {width:60px; height:60px;}
aside .recentposts ol li .recentpost_content {padding-top:0;}

#portfolio-article article {padding:30px;}

/* =============================================================================
	 Footer
	 ========================================================================== */

footer ul.social {position:relative; top:16px; right:0; float:none; font-size:0;}
nav#footernav {display:none !important; visibility:hidden;}
nav#nav ul li a {font-size: 12px;}
nav#nav ul li {margin-right: 5px;}

#footerbase .footer1 {
	width: 364px;
}

#footerbase .footer2 {
	width: 364px;
}

#footerbase .footer3 {
	width: 364px;
}

#footerbase .footer4 {
	width: 364px;
}

#footerbase .footer1:after {
	display: none;
}

}


	
/*	#Mobile (Portrait) - Design for a width of 320px
================================================== */
	
@media only screen and (max-width: 767px) {

/* =============================================================================
	 Table
	 ========================================================================== */
	 #lang {
		right: 50px;
		top: 130px;
	}
	.product-pinned section article {position: relative !important;}
	td,th {
		padding: 2px;
		font-size: 4px;
		line-height: 5px;
	}
	.cookies-policy table, .cookies-policy thead, .cookies-policy tbody, .cookies-policy th, .cookies-policy td, .cookies-policy tr {display:block;}
	.cookies-policy thead tr {position:absolute; top:-9999px; left:-9999px;}
	.cookies-policy tr {border:0 solid #dddddd;}
	.cookies-policy td {position:relative; padding-left:50%; border:1px solid #dddddd; border-width:1px 1px 0 1px;}
	.cookies-policy td:before {position:absolute; top:6px; left:6px; width:45%; padding-right:10px; white-space:nowrap;}

	/* Label the data */
	.cookies-policy td:nth-of-type(1):before { content: "Cookie name"; }
	.cookies-policy td:nth-of-type(2):before { content: "Cookie provider"; }
	.cookies-policy td:nth-of-type(3):before { content: "Expires after"; }
	.cookies-policy td:nth-of-type(4):before { content: "Cookie description"; }

/* =============================================================================
	 Structure
	 ========================================================================== */

body {min-width:300px;}
.container {width:300px;}
.container.home {padding-top:0;}
.span1, .span2, .span3, .span4, .span5, .span6, .span7, .span8, .span9, .span10, .span11, .span12,
.prefix1, .prefix2, .prefix3, .prefix4, .prefix5, .prefix6, .prefix7, .prefix8, .prefix9, .prefix10, .prefix11,
.suffix1, .suffix2, .suffix3, .suffix4, .suffix5, .suffix6, .suffix7, .suffix8, .suffix9, .suffix10, .suffix11 {display:block; margin-left:0; margin-right:0; width:100%;
		-webkit-box-sizing: border-box;
			 -moz-box-sizing: border-box;
						box-sizing: border-box;
}

.visible-desktop { display: none !important; visibility: hidden; } /* visible on desktop only */
.visible-tablet { display: none !important; visibility: hidden; } /* visible on tablet only */
.visible-mobile { display: block !important; visibility: visible; } /* visible on mobile only */
.visible-mobile-landscape { display: none !important; visibility: hidden; } /* visible on mobile only */

.hidden-desktop { display: block !important; visibility: visible; } /* hidden on desktop only */
.hidden-tablet { display: block !important; visibility: visible; } /* hidden on tablet only */
.hidden-mobile { display: none !important; visibility: hidden;} /* hidden on mobile only */

/* =============================================================================
	 Typography
	 ========================================================================== */

h1, h2, h3, h4, h5, h6 {margin: 0; padding:0; font-family: 'Rajdhani', sans-serif; font-weight:700; font-style:normal; color:inherit; text-transform:uppercase; text-rendering:optimizelegibility;}
h1 small, h2 small, h3 small, h4 small, h5 small, h6 small {font-weight:normal; color: #999999;}

h1 {font-size: 22px; line-height: 32px;}
h2 {font-size: 18px; line-height: 28px;}
h3 {font-size: 14px; line-height: 24px;}
h4 {font-size: 13px; line-height: 21px;}
h5 {font-size: 12px; line-height: 18px;}
h6 {font-size: 11px; line-height: 15px;}

p {margin:0 0 16px; font-family:inherit; font-size:16px; font-weight:300; line-height:26px;}
small {font-size:11px;}
span {color:#3299CC;}

/* =============================================================================
	 Header
	 ========================================================================== */

.logo {margin:0 auto; float:none;}

nav#nav ul {display:none;}
nav#nav {float:none; margin: 20px auto 0;}
nav#nav select {display:block; margin:0 auto; width:280px;}

.banner {padding-top:20px; height:185px !important;}
.banner.pinned {padding-top:0;height:64px !important;}
.banner.pinned .back-to-top {display:none;}

/* =============================================================================
	 Masthead
	 ========================================================================== */

.masthead, .masthead-small {height:356px;}
.masthead-content, .masthead-content-small {top:136px; height:220px;}
.masthead-content h1, .masthead-content-small h1 {margin:1px auto 0; font-size:34px; line-height:36px;}
.masthead-content-small h1 {margin:36px auto 0;}
.masthead-content p, .masthead-content-small p {margin:10px auto 0; padding:0 10px; font-size:17px; line-height:23px;}
.masthead-content a.btn {margin:18px auto 0;}

.website-design .masthead-content-small h1, .email-marketing .masthead-content-small h1, .blog .masthead-content-small h1, .single .masthead-content-small h1, .category .masthead-content-small h1 {padding:0 40px;}
.single-portfolio .masthead-content-small h1 {padding:0;}

/* =============================================================================
	 Main
	 ========================================================================== */

section {padding:30px 0 30px;}
section p {margin-bottom:30px;}
#services a.btn, #portfolio a.btn, #latestnews a.btn {margin:15px auto 5px;}
#servicelist a.btn {margin:10px auto 30px;}
#servicelist ul li {margin-right:0;}
#servicelist ul li a {width:260px;}
#servicelist ul li a.btn-quiet {font-size:14px;}
#portfolio ul li {margin: 0 0 20px; width:300px; height:200px;}
#latestnews ol li {margin:0 auto;}
#article a.btn {margin:30px auto 0;}
button.btn {margin:25px auto 0;}
.contact-us section {padding-bottom:0;}

#map_canvas.fullwidth {margin:0 auto; width:300px; height:300px;}

/* =============================================================================
	 Article Pages
	 ========================================================================== */

#article article {padding:24px 24px;}
#article article .featured-image {margin:-24px -24px 20px; width:auto;}
#article article img {width:100%; height:auto;}
#article article #author img.avatar {width:60px; height:60px;}
#article article h1 {font-size:20px; line-height:30px}
#article article ul li, #article article ol li {margin-bottom:10px; font-size:16px; line-height:26px;}
#article article ul.wpsocialite li {padding:5px !important;}
aside .recentposts ol li .recentpost_content {padding-top:0;}

#portfolio-article {margin-bottom:0;}
#portfolio-article article {padding:24px;}

/* =============================================================================
	 Aside
	 ========================================================================== */

aside {padding:0 0 40px;}
.contact-us aside {padding:0;}

/* =============================================================================
	 Footer
	 ========================================================================== */

footer p {font-weight:300;}
footer p.small{line-height:20px;}
footer ul.social {position:relative; top:16px; right:0; float:none; font-size:0;}
nav#footernav {display:none !important; visibility:hidden;}

#footerbase footer {
	width: 280px !important;
	text-align: center;
	line-height: 24px !important;
}

#footerbase .footer1:after {
	display: none;
}

}



/* #Mobile (Landscape) - Design for a width of 480px
================================================== */

@media only screen and (min-width: 480px) and (max-width: 767px) {
#lang {
	right: 114px;
	top: 130px;
}
.product-pinned section article {position: relative;}

	td, th { font-size: 9px; line-height: 10px;}
body {min-width:420px;}
.container {width:420px;}
.container.home {padding-top:95px;}
.visible-mobile-landscape { display: block !important; visibility: visible; } /* visible on mobile landscape only */

/* =============================================================================
	 Header
	 ========================================================================== */

nav#nav select {width:400px;}

.banner {height:185px !important;}
.banner.pinned {height:64px !important;}

/* =============================================================================
	 Masthead
	 ========================================================================== */

.masthead {height:355px;}
.masthead-small {height:260px;}
.masthead-content, .masthead-content-small {top:136px; height:220px;}
.masthead-content-small {top:144px; height:116px;}
.masthead-content h1, .masthead-content-small h1 {font-size:34px; line-height:36px;}
.masthead-content-small h1 {margin:1px auto 0; font-size:28px; line-height:30px;}
.masthead-content p, .masthead-content-small p {padding:0 25px; font-size:18px; line-height:24px;}

.website-design .masthead-content-small h1, .email-marketing .masthead-content-small h1, .blog .masthead-content-small h1, .single .masthead-content-small h1, .category .masthead-content-small h1 {padding:0;}

.home .masthead-content h1 {padding:0 60px;}

/* =============================================================================
	 Main
	 ========================================================================== */

#portfolio ul li {width:420px; height:280px;}
#map_canvas.fullwidth {width:400px;}

/* =============================================================================
	 Article Pages
	 ========================================================================== */

#article article {padding:24px 24px;}
#article article ul.wpsocialite li {padding:10px !important;}
aside .recentposts ol li .recentpost_content {padding-top:9px;}

#footerbase footer {
	width: 400px !important;
	text-align: center;
	line-height: 24px !important;
}

}


/*	Retina Display Images
================================================== */

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (-moz-min-device-pixel-ratio: 1.5),
only screen and (-o-min-device-pixel-ratio: 3/2),
only screen and (min-device-pixel-ratio: 1.5) {
	.logo {background-image: url(../img/logo_gucum_beyaz.png);width: 216px;height: 98px;background-size: 216px 89px;}
	.back-to-top {background-image: url(../img/backtotop_402x.png);}
	#services a.brand, #servicelist a.brand {background-image:url(../img/icon-lightbulb_402x.png);}
	#services a.web, #servicelist a.web {background-image:url(../img/icon-web_402x.png);}
	#services a.search, #servicelist a.search {background-image:url(../img/icon-graph_402x.png);}
	#services a.marketing, #servicelist a.marketing {background-image:url(../img/icon-marketing_402x.png);}
	#servicelist article section ul li {background-image: url(../img/tick_402x.png);}
	ul.social li a.facebook {background-image:url(../img/icon-facebook_402x.png);}
	ul.social li a.twitter {background-image:url(../img/icon-twitter_402x.png);}
	ul.social li a.linkedin {background-image:url(../img/icon-linkedin_402x.png);}
	ul.social li a.googleplus {background-image:url(../img/icon-googleplus_402x.png);}
	ul.social li a.skype {background-image:url(../img/icon-skype_402x.png);}
	aside#portfolio-aside ul li a.branding {background-image:url(../img/icon-lightbulb-small_402x.png);}
	aside#portfolio-aside ul li a.design {background-image:url(../img/icon-brush-small_402x.png);}
	aside#portfolio-aside ul li a.web {background-image:url(../img/icon-web-small_402x.png);}
	aside#portfolio-aside ul li a.seo {background-image:url(../img/icon-graph-small_402x.png);}
	aside#portfolio-aside ul li a.marketing {background-image:url(../img/icon-marketing-small_402x.png);}
}


/* =============================================================================
	 common classes
	 ========================================================================== */

.alpha {margin-left:0 !important;}
.omega {margin-right:0 !important;}
.first {margin-top:0 !important;}
.last {margin-bottom:0 !important;}
.left {float:left !important;}
.right {float:right !important;}

.dl {width:0; height:0;}
.ir {display:block; border:0; text-indent:-999em; overflow:hidden; background-color:transparent; background-repeat:no-repeat; text-align:left; direction:ltr;}
.ir br {display:none;}
.hidden {display:none !important; visibility:hidden;}
.visuallyhidden {border:0; clip:rect(0 0 0 0); height:1px; margin:-1px; overflow:hidden; padding:0; position:absolute; width:1px;}
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus {clip:auto; height:auto; margin:0; overflow:visible; position:static; width:auto;}
.invisible {visibility:hidden;}
.clearfix:before, .clearfix:after {content:""; display:table;}
.clearfix:after {clear:both;}
.clearfix {zoom:1;}


 
@media print {
	* { background: transparent !important; color: black !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; } /* Black prints faster: h5bp.com/s */
	a, a:visited { text-decoration: underline; }
	a[href]:after { content: " (" attr(href) ")"; }
	abbr[title]:after { content: " (" attr(title) ")"; }
	.ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; }  /* Don't show links for images, or javascript/internal links */
	pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
	thead { display: table-header-group; } 
	tr, img { page-break-inside: avoid; }
	img { max-width: 100% !important; }
	@page { margin: 0.5cm; }
	p, h2, h3 { orphans: 3; widows: 3; }
	h2, h3 { page-break-after: avoid; }
}

.fullwidthbanner-container .caption {
    bottom: 50px;
    z-index: 1;
    opacity: 1 !important;
    font-family: 'Calibri', sans-serif;
    font-size: 36px !important;
    text-align: right;
    color: #fff;
    background-color: rgba(0, 0, 0, 0.6);
    padding: 20px 80px !important;
    line-height: 36px !important;
}

.fullwidthbanner-container .caption strong{
	color: #fff;
}

section#anasayfa {
	text-align: left;
    padding-left: 50px;
    padding-right: 50px;
}

section#anasayfa p {
	margin-bottom: 15px;
    font-size: 18px;
    color: #171717;
    /*font-family: 'Calibri', sans-serif;*/
    font-weight: 400;
}

section#anasayfa p strong {
    color: #171717;
}