.digitalmedia_banner {
	background-image: url(../../img2/corporate_digital_media_services_header.jpg); background-repeat: no-repeat; background-position: center top;
	display: block;
	width: 100%; height: 515px;
}

.contentwrap_left{width:500px; padding: 75px 0 0;}
.contentwrap_left .btn-theme.yellow{border: none;background: #fdc52e; color: #000;font-size: 22px; font-weight: 700; padding: 20px; display:inline-block; margin: 15px 0 0; }

.hding-2 {
	margin: 55px 0 40px;
}
.hding-2 h2 {
	font-family: 'helveticaneuecyrbold';
	font-size: 35px;
	line-height: 35px;
}
.hding-2 span {
	display: block;
	font-family: 'helveticaneuecyrlight';
}
.cloth-store p {text-align: left;}
.cloth-store {padding-bottom: 50px;}

.contentwrap_left h1 {
	color: #000;
	font-family: 'helveticaneuecyrbold';
	font-size:56px;
	line-height: 60px;
	padding: 0 0 0px;
	letter-spacing: -1px;
}
.contentwrap_left h4 {
	color: #000;
    font-size:24px;
    padding: 10px 0 40px;
}

.highlighted_bluetxt{display: inline-block; background: rgba(77, 166, 255, 0.7); height: 44px; line-height: 44px; color: #fff;font-size: 20px; padding: 0 15px;}

.infoiconbox{width: 100%; text-align:center; padding: 10px;border-radius:8px; background: #ebf0f5;-webkit-transition: 0.3s all ease-in-out;
  -moz-transition: 0.3s all ease-in-out;
  -o-transition: 0.3s all ease-in-out;
  transition: 0.3s all ease-in-out;}
.infoiconbox:hover{background: #ee4d50;}
.infoiconbox:hover .boxtitle{color: #fff;}
.infoiconbox .imgbox{width: 100%;overflow: hidden;padding:24px;border-radius: 8px; background: #f5faff; height: 130px; margin: 0;}
.infoiconbox .boxtitle{font-size: 22px; color: #111111; padding: 20px; line-height: 28px;display: block;}

.onefourth_grid{ margin: 0 0 20px -20px;}
.onefourth_grid li{ float: left; padding:20px 0 0 20px; width: 25%;}


.onethird_grid { text-align: center;}
.onethird_grid > li{display: inline-block; vertical-align: top;padding: 0 30px 0 30px; width:30%;}

.infoiconbox:hover img {
	-webkit-animation: toTopFromBottom 0.3s forwards;
	-moz-animation: toTopFromBottom 0.3s forwards;
	animation: toTopFromBottom 0.3s forwards;
}

.infoiconbox .imgbox img{
	-webkit-transition: background 0.3s, color 0.3s, box-shadow 0.3s;
	-moz-transition: background 0.3s, color 0.3s, box-shadow 0.3s;
	transition: background 0.3s, color 0.3s, box-shadow 0.3s;
}



@-webkit-keyframes toTopFromBottom {
	49% {
		-webkit-transform: translateY(-100%);
	}
	50% {
		opacity: 0;
		-webkit-transform: translateY(100%);
	}
	51% {
		opacity: 1;
	}
}
@-moz-keyframes toTopFromBottom {
	49% {
		-moz-transform: translateY(-100%);
	}
	50% {
		opacity: 0;
		-moz-transform: translateY(100%);
	}
	51% {
		opacity: 1;
	}
}
@keyframes toTopFromBottom {
	49% {
		transform: translateY(-100%);
	}
	50% {
		opacity: 0;
		transform: translateY(100%);
	}
	51% {
		opacity: 1;
	}
}



.circlesection{position: relative;background-color: #ededed; height: 584px; overflow: hidden;}
.circlesection .fix-container{position: relative; padding: 60px 0;}
.circlesection .fix-container:before{width: 1100px; height: 584px; content: ""; position: absolute;left: -290px; top:0; background-image: url(../../img2/circlebg.jpg); background-repeat: no-repeat;}

.circlesection h2{position: relative;text-align: center;font-size: 38px; color: #000; padding: 0 0 32px 0;font-family: 'helveticaneuecyrbold';}
.circlesection .grids{display: table; width: 100%; position: relative;}
.circlesection .grid_1{display: table-cell; vertical-align: top;}
.circlesection .grid_2{display: table-cell; vertical-align: top; padding:30px 0 0 50px;}
.circlesection p{font-size: 17px; line-height:25px;}
.circlesection .cta-new .cta-inner h3{font-size:20px; line-height:25px; color: #111111!important;}
.circlesection .cta-new.page-cta {background: url("../../img2/fadedline.png") no-repeat scroll center top;}
.circlesection .cta-new.page-cta .cta-inner {background: url("../../img2/fadedline.png") no-repeat scroll center bottom;}



.bluesection{position: relative;background-color: #ededed; height:789px;background-image: url(../../img2/fadedblue_bg.jpg); background-repeat:repeat-x; background-size: cover;
background-attachment: fixed; padding: 60px 0;}
.bluesection h2{position: relative;text-align: center;font-size: 38px; color: #fff; padding: 0 0 45px 0;font-family: 'helveticaneuecyrbold';}
.bluesection p{ color: #fff; padding-bottom:10px;}

.coloredcircle{width: 100%; text-align: center;display: inline-block; padding: 10px 0 40px;}
.coloredcircle li{ display: inline-block; margin: 0 -10px;}
.coloredcircle li .boxround{border-radius: 100%;display: table;}
.coloredcircle li .boxround .cell{width: 290px; height: 290px;display: table-cell; vertical-align: middle;font-size: 36px;font-weight: 700; color: #fff;}
.coloredcircle li .boxround.yellow{ background: rgba(253, 205, 74, 0.8);}
.coloredcircle li .boxround.green{ background: rgba(98, 198, 0, 0.8);}
.coloredcircle li .boxround.red{ background: rgba(255, 92, 95, 0.8);}
.coloredcircle li .boxround.purple{ background: rgba(93, 67, 190, 0.8);}


.whitesection{position: relative;background-color: #fff; padding: 60px 0;}
.whitesection h2{text-align: center;font-size: 38px; color: #000; padding: 0 0 35px 0;font-family: 'helveticaneuecyrbold';}
.whitesection .centerimg{display: block; margin: 0 auto 30px;}


.yellowsection{position: relative;background-color: #fff;  padding:45px 0 60px;background-image: url(../../img2/yellowbg.jpg); background-repeat:repeat-x; background-size: cover;background-attachment: fixed;

	-webkit-animation: bgMove 60s linear 0s infinite normal;
	-moz-animation: bgMove 60s linear 0s infinite normal;
	-ms-animation: bgMove 60s linear 0s infinite normal;
	-o-animation: bgMove 60s linear 0s infinite normal;
	animation: bgMove 60s linear 0s infinite normal;
	-webkit-animation-fill-mode: both;
	-moz-animation-fill-mode: both;
	-ms-animation-fill-mode: both;
	-o-animation-fill-mode: both;
	animation-fill-mode: both
}
 @-webkit-keyframes bgMove {
0% {
background-position:0 50%;
}
100% {
background-position:-500px 50%;
}
}
@-moz-keyframes bgMove {
0% {
background-position:0 50%;
}
100% {
background-position:-500px 50%;
}
}
@-ms-keyframes bgMove {
0% {
background-position:0 50%;
}
100% {
background-position:-500px 50%;
}
}
@keyframes bgMove {
0% {
background-position:0 50%;
}
100% {
background-position:-500px 50%;
}
}

.yellowsection h2{text-align: center;font-size: 38px; color: #000; padding: 0 0 15px 0;font-family: 'helveticaneuecyrbold';}
.yellowsection h5{text-align: center;font-size:24px; color: #000; padding: 0 0 40px 0;}


.planbox{width: 100%; text-align: center; position: relative;}
.planbox.green .middle{background: #2dbe60;}
.planbox .top{display:block; color: #fff;font-size: 24px; background: #333333;border-radius: 10px; padding:0 20px; text-align: center; height:52px; line-height: 52px; position: relative;width: 100%; margin: 0 0 30px 0;}
.planbox .top:before{ position: absolute; left: 50%; content: ""; bottom: -10px; margin: 0 0 0 -10px; border-left:10px solid transparent;border-right:10px solid transparent; border-top:10px solid #333;}
.planbox .middle{ background: #3098d0;border-radius: 10px; padding: 18px;}
.planbox .middle .mediumtxt{display: block; color: #fff;font-size: 22px; padding: 0 0 10px 0;}
.planbox .middle .largetxt{display: block; color: #fff;font-size: 28px;font-weight: 700; padding:0 0 20px 0;}
.planbox .middle .largetxt span{display: block; color: #fff;font-size:17px;font-weight:normal; /*font-style: italic;*/font-weight: 300;}
.planbox .middle .normaltxt {display: block; color: #fff;font-size:20px; line-height: 24px; padding: 0 0 15px 0;}
.planbox .middle .smalltxt {display: block; color: #fff;font-size:16px;font-weight:normal; font-style: italic; padding: 0 0 15px 0;font-weight: 300; min-height: 80px;}
.planbox .middle .btn-theme.white {display: block;border: none; padding: 0 10px; font-style: italic;font-weight: 300;border-radius: 10px; background: rgba(255, 255, 255, 0.4); height: 44px; line-height: 44px; margin: 0 0 10px 0;}
.planbox .middle .btn-theme.black {display: block;border: none; padding: 0 10px; color: #fff; font-weight: 300;border-radius: 10px; background: #333435;height: 44px; line-height: 44px;font-size:18px; font-weight: 700;}
.planbox .middle .btn-theme.white:hover, .planbox .middle .btn-theme.black:hover{background: #ffdf86; color: #000;}


.centerlist{margin: 0; padding: 0 0 10px 0;}
.centerlist li{font-size: 15px; color: #fff;border-bottom: 1px dashed rgba(255, 255, 255, 0.4); padding:3px 5px 5px; text-transform: capitalize;}
.section_collapse{height:370px; position: relative;}
.section_collapse .smalltxt{font-size: 13px!important; padding: 0!important; min-height: 1%!important;}



@media only screen and (max-width: 767px) {
.section_collapse{ height: auto; padding-bottom: 20px; }    
.digitalmedia_banner{background-size:300%; height: auto; padding: 10px 0 20px;}
.contentwrap_left{width: 100%; padding:10px 0 0; text-align: center;}    
.contentwrap_left h1{  font-size:28px;letter-spacing: -1px;line-height:34px; text-shadow:30px 0 30px #fff;background: rgba(255, 255, 255, 0.8); padding: 10px 30px;}    
.contentwrap_left h4 {color: #000;font-size:16px;padding: 0 0 10px; text-shadow:30px 0 10px #fff;background: rgba(255, 255, 255, 0.8); padding:0 5px 10px;}    
.highlighted_bluetxt{display: block; font-size: 12px;height: 30px;line-height: 29px;} 
.contentwrap_left .btn-theme.yellow{  padding: 12px;font-size: 15px;}    

.onefourth_grid{margin: 0;}    
.onefourth_grid li{padding: 10px 0 0; width: 100%;} 
.hding-2{margin: 10px 0;}    
.hding-2 h2{font-size: 22px;}    
.infoiconbox .boxtitle{font-size: 16px;}    
.infoiconbox:hover{background: #ebf0f5;}
.infoiconbox:hover .boxtitle{color: #000;} 
.circlesection h2, .bluesection h2{font-size: 22px;}
.circlesection .fix-container{padding: 15px 0;}
.circlesection .grid_1{width: 100%; display:block;} 
.circlesection .grid_2{width: 100%; display:block; padding:15px 0 0; text-align: center;} 
.circlesection .grid_1 img{width: 260px; margin: 0 auto; display: block;}    
.cloth-store{padding-bottom: 0;}    
    
.infoiconbox:hover img {
	-webkit-animation: toTopFromBottom 0 forwards;
	-moz-animation: toTopFromBottom 0 forwards;
	animation: toTopFromBottom 0 forwards;
}  
.circlesection{height: auto;}    
.circlesection .fix-container:before{display: none;}
.bluesection{padding: 15px 0; height: auto; text-align: center;background-attachment: scroll;} 
.bluesection h2{padding-bottom: 15px;} 
.coloredcircle{display: table; margin: 0 auto;width: auto;}    
.coloredcircle li{ margin:2px;}    
.coloredcircle li .boxround .cell{width: 140px; height: 140px;font-size: 15px;}    
    
.yellowsection{padding: 15px 0 15px 0; height: auto;background-attachment: scroll;}
.yellowsection h2{font-size: 22px; padding: 0 0 15px 0;}
.whitesection{padding: 15px 0 15px 0;}
.whitesection h2{font-size: 22px; padding: 0 0 15px 0;}    
.yellowsection h5{font-size: 16px;}    
    
.whitesection .centerimg{width:90%;}    
.onethird_grid > li{width: 100%; padding:10px 5px;} 
.planbox .top{margin-bottom: 20px;}    
 .cloth-store p  {text-align: center;}
    
}



@media only screen and (min-width:768px) and (max-width:990px) {
.onefourth_grid{ margin: 0 0 0 -10px;}
.onefourth_grid li{padding: 0 0 10px 10px;}
.infoiconbox .boxtitle {color: #111111;display: block;font-size: 14px;line-height: 20px;}
.infoiconbox:hover img {
	-webkit-animation: toTopFromBottom 0 forwards;
	-moz-animation: toTopFromBottom 0 forwards;
	animation: toTopFromBottom 0 forwards;
}      
.infoiconbox:hover{background: #ebf0f5;}
.infoiconbox:hover .boxtitle{color: #000;} 
.contentwrap_left h1{font-size:50px; line-height:56px; text-shadow:30px 0 30px #fff;}
.contentwrap_left h4{font-size:24px;}   
.circlesection{height: auto;}
.circlesection .grid_1 img{width:350px;}    
.circlesection .fix-container:before{display: none;}
.circlesection h2, .bluesection h2, .whitesection h2, .yellowsection h2{font-size: 28px;}
.circlesection .fix-container{padding:30px 0 0;}
.cloth-store{padding-bottom:20px;}    
.circlesection .grid_2{padding-top: 0;}
.circlesection .grid_1{width: 100%;display: block;}    
.circlesection .grid_2{width: 100%;display: block; padding: 20px; text-align: center;}  
.bluesection{height: auto; padding: 30px 0;background-attachment: scroll;}  
.coloredcircle li .boxround .cell{font-size:20px; width: 180px; height: 180px;}    
.whitesection{padding: 30px 0;}  
.whitesection .centerimg{width: 90%;}
.onethird_grid > li{padding: 0 5px;}    
.yellowsection{height: auto; padding: 30px 0;background-attachment: scroll;display: inline-block;}  
.onethird_grid{margin: 0 0 0 -10px;}    
.onethird_grid > li{ float: left; padding: 0 0 0 10px; width: 33.3%;} 
.planbox .top{font-size: 20px;}
.yellowsection h5{font-size: 20px;}
.planbox .middle .largetxt{font-size: 25px;}    
      
}



@media only screen and (min-width:991px) and (max-width:1050px) {
.onethird_grid > li{padding: 0 10px; width: 32%;}
.planbox .middle .normaltxt{font-size: 22px;} 
.coloredcircle li .boxround .cell{font-size:20px; width:240px; height: 240px;}    
.bluesection, .yellowsection{height: auto; padding: 30px 0;background-attachment: scroll;}     
.circlesection{ height: auto;}     
.circlesection .fix-container{ padding: 30px 0 ;}     
.circlesection .cta-new .cta-inner h3{ text-align: center; padding: 0 0 20px 0; width: 100%;}     
.circlesection .grid_2{ padding-top: 10px;} 
.circlesection .grid_1{ padding-left: 10px;} 
.circlesection .fix-container:before{top: -30px; left:-280px;}    
.circlesection .cta-new.page-cta{margin-bottom: 0; margin-top: 10px;}    

.infoiconbox:hover img {
	-webkit-animation: toTopFromBottom 0 forwards;
	-moz-animation: toTopFromBottom 0 forwards;
	animation: toTopFromBottom 0 forwards;
}      
.infoiconbox:hover{background: #ebf0f5;}
.infoiconbox:hover .boxtitle{color: #000;}    
.infoiconbox .boxtitle{font-size: 18px; line-height: 24px;}
.whitesection{padding: 30px 0;}    

}